feat : 对接商城首页接口
This commit is contained in:
赵毅
parent
1d6831a76e
commit
fdd5bbfb3b
@ -6,5 +6,5 @@ export const apiArr = {
|
|||||||
getCarCount:"/api/v2/wechat/commodity/cart/all_count",//购物车数量
|
getCarCount:"/api/v2/wechat/commodity/cart/all_count",//购物车数量
|
||||||
addCar:"/api/v2/wechat/commodity/cart/add",//添加购物车
|
addCar:"/api/v2/wechat/commodity/cart/add",//添加购物车
|
||||||
deleteCar:"/api/v2/wechat/commodity/cart/delete",//删除购物车
|
deleteCar:"/api/v2/wechat/commodity/cart/delete",//删除购物车
|
||||||
updateCar:"/api/v2/wechat/commodity/cart/update",
|
updateCar:"/api/v2/wechat/commodity/cart/update",//更新购物车
|
||||||
}
|
}
|
||||||
@ -1,368 +1,500 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<!-- 顶部展开后的阴影 -->
|
<!-- 顶部展开后的阴影 -->
|
||||||
<div class="boxshadow" v-if="topShow"></div>
|
<div class="boxshadow" v-if="topShow"></div>
|
||||||
<div class="header" :class="topShow ? 'op0' : ''">
|
<div class="header" :class="topShow ? 'op0' : ''">
|
||||||
<div class="searchBox" :style="{ height: localHeight + 'px', paddingTop: top + 'px' }">
|
<div
|
||||||
<div class="searchBox_left">
|
class="searchBox"
|
||||||
<!-- <u-icon name="arrow-left" size="20px" color="#000"></u-icon> -->
|
:style="{ height: localHeight + 'px', paddingTop: top + 'px' }"
|
||||||
</div>
|
>
|
||||||
<div class="searchBox_ipt" @click="searchPage">
|
<div class="searchBox_left">
|
||||||
<image
|
<!-- <u-icon name="arrow-left" size="20px" color="#000"></u-icon> -->
|
||||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png"
|
</div>
|
||||||
mode="aspectFill"></image>
|
<div class="searchBox_ipt" @click="searchPage">
|
||||||
<input disabled type="text" placeholder="输入商品名称">
|
<image
|
||||||
</div>
|
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png"
|
||||||
</div>
|
mode="aspectFill"
|
||||||
<div class="slide">
|
></image>
|
||||||
<div class="slide_con">
|
<input disabled type="text" placeholder="输入商品名称" />
|
||||||
<div v-for="(item, index) in CateList" :key="index" class="slide_conBox">
|
</div>
|
||||||
<view class="slide_item">
|
</div>
|
||||||
<image :src="picUrl + item.category_pic" mode="aspectFill"></image>
|
<div class="slide">
|
||||||
<text>{{ item.category_name }}</text>
|
<div class="slide_con">
|
||||||
</view>
|
<div
|
||||||
</div>
|
v-for="(item, index) in CateList"
|
||||||
</div>
|
:key="index"
|
||||||
|
class="slide_conBox"
|
||||||
|
@click="changeCate(item.id)"
|
||||||
|
>
|
||||||
|
<view class="slide_item">
|
||||||
|
<image
|
||||||
|
:src="picUrl + item.category_pic"
|
||||||
|
mode="aspectFill"
|
||||||
|
></image>
|
||||||
|
<text>{{ item.category_name }}</text>
|
||||||
|
</view>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="open" @click="topOpen" v-if="!topShow">
|
<div class="open" @click="topOpen" v-if="!topShow">
|
||||||
展 开
|
展 开
|
||||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_openIcon.png"
|
<image
|
||||||
mode="aspectFill"></image>
|
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_openIcon.png"
|
||||||
</div>
|
mode="aspectFill"
|
||||||
</div>
|
></image>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
</div>
|
<!-- 整体展开的顶部 -->
|
||||||
|
<div class="header header2" v-if="topShow">
|
||||||
|
<div
|
||||||
|
class="searchBox"
|
||||||
|
:style="{ height: localHeight + 'px', paddingTop: top + 'px' }"
|
||||||
|
>
|
||||||
|
<div class="searchBox_left">
|
||||||
|
<u-icon name="arrow-left" size="20px" color="#000"></u-icon>
|
||||||
|
</div>
|
||||||
|
<div class="searchBox_ipt">
|
||||||
|
<image
|
||||||
|
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png"
|
||||||
|
mode="aspectFill"
|
||||||
|
></image>
|
||||||
|
<input type="text" placeholder="输入商品名称" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<!-- 整体展开的顶部 -->
|
<div class="slide">
|
||||||
<div class="header header2" v-if="topShow">
|
<div class="slide_con">
|
||||||
<div class="searchBox" :style="{ height: localHeight + 'px', paddingTop: top + 'px' }">
|
<div
|
||||||
<div class="searchBox_left">
|
v-for="(item, index) in CateList"
|
||||||
<u-icon name="arrow-left" size="20px" color="#000"></u-icon>
|
:key="index"
|
||||||
</div>
|
class="slide_conBox"
|
||||||
<div class="searchBox_ipt">
|
>
|
||||||
<image
|
<view class="slide_item">
|
||||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png"
|
<image
|
||||||
mode="aspectFill"></image>
|
:src="picUrl + item.category_pic"
|
||||||
<input type="text" placeholder="输入商品名称">
|
mode="aspectFill"
|
||||||
</div>
|
></image>
|
||||||
</div>
|
<text>{{ item.category_name }}</text>
|
||||||
|
</view>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="slide">
|
<div class="hides" @click="topOpen">
|
||||||
<div class="slide_con">
|
收起 <u-icon name="arrow-up"></u-icon>
|
||||||
<div v-for="(item, index) in CateList" :key="index" class="slide_conBox">
|
</div>
|
||||||
<view class="slide_item">
|
</div>
|
||||||
<image :src="picUrl + item.category_pic" mode="aspectFill"></image>
|
|
||||||
<text>{{ item.category_name }}</text>
|
|
||||||
</view>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="hides" @click="topOpen">
|
<div class="Con">
|
||||||
收起 <u-icon name="arrow-up"></u-icon>
|
<div class="Con_left">
|
||||||
</div>
|
<div
|
||||||
</div>
|
class="CateItem"
|
||||||
|
v-for="item in leftCateList"
|
||||||
|
:key="item.id"
|
||||||
<div class="Con">
|
@click="changeLeftCate(item.id)"
|
||||||
<div class="Con_left">
|
>
|
||||||
<div class="CateItem" v-for="item in leftCateList" :key="item.id" @click="changeLeftCate(item.id)">
|
<!-- <image v-if="false" class="hot"
|
||||||
<!-- <image v-if="false" class="hot"
|
|
||||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_hot.png"
|
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_hot.png"
|
||||||
mode="aspectFill">
|
mode="aspectFill">
|
||||||
</image> -->
|
</image> -->
|
||||||
<!-- <image class="bao"
|
<!-- <image class="bao"
|
||||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_bao.png"
|
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_bao.png"
|
||||||
mode="aspectFill"></image> -->
|
mode="aspectFill"></image> -->
|
||||||
{{ item.category_name }}
|
{{ item.category_name }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="Con_right">
|
<div class="Con_right">
|
||||||
<div class="CateList_Box" :class="cateListShow ? 'bgf' : ''">
|
<div class="CateList_Box" :class="cateListShow ? 'bgf' : ''">
|
||||||
<div class="CateList" ref="cateListRef">
|
<div class="CateList" ref="cateListRef">
|
||||||
<div class="CateList_Item" v-for="(item, index) in tagList" :key="item.id"
|
<div
|
||||||
:class="index == rightTopActive ? 'CateList_Item_active' : ''" @click="checkItem(index)">{{ item.tag_name }}
|
class="CateList_Item"
|
||||||
</div>
|
v-for="(item, index) in tagList"
|
||||||
|
:key="item.id"
|
||||||
|
:class="index == rightTopActive ? 'CateList_Item_active' : ''"
|
||||||
|
@click="checkItem(index)"
|
||||||
|
>
|
||||||
|
{{ item.tag_name }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="more" @click="changeCateListShow">
|
||||||
|
<u-icon v-if="!cateListShow" name="arrow-down"></u-icon>
|
||||||
|
<u-icon v-if="cateListShow" name="arrow-up"></u-icon>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- 右下展开的内容 -->
|
||||||
|
<div class="activeCateList" v-if="cateListShow">
|
||||||
|
<div
|
||||||
|
class="CateList_Item"
|
||||||
|
v-for="(item, index) in tagList"
|
||||||
|
:key="index"
|
||||||
|
:class="index == rightTopActive ? 'CateList_Item_active' : ''"
|
||||||
|
@click="checkItem(index)"
|
||||||
|
>
|
||||||
|
{{ item.tag_name }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- 右下阴影 -->
|
||||||
|
<div class="boxshadow2" v-if="cateListShow"></div>
|
||||||
|
|
||||||
</div>
|
<div class="CateInfo" v-for="(item, index) in tagList" :key="item.id">
|
||||||
<div class="more" @click="changeCateListShow">
|
<div class="CateInfo_tit">
|
||||||
<u-icon v-if="!cateListShow" name="arrow-down"></u-icon>
|
{{ item.tag_name }}
|
||||||
<u-icon v-if="cateListShow" name="arrow-up"></u-icon>
|
</div>
|
||||||
</div>
|
<div
|
||||||
</div>
|
class="CateInfo_Item"
|
||||||
<!-- 右下展开的内容 -->
|
v-for="items in item.commodity_info_list"
|
||||||
<div class="activeCateList" v-if="cateListShow">
|
:key="items.id"
|
||||||
<div class="CateList_Item" v-for="(item, index) in tagList" :key="index"
|
>
|
||||||
:class="index == rightTopActive ? 'CateList_Item_active' : ''" @click="checkItem(index)">{{ item.tag_name }}
|
<div class="CateInfo_Item_Box">
|
||||||
</div>
|
<div class="CateInfo_Item_left" @click="goods(items.id)">
|
||||||
</div>
|
<image
|
||||||
<!-- 右下阴影 -->
|
:src="picUrl + items.commodity_pic"
|
||||||
<div class="boxshadow2" v-if="cateListShow"></div>
|
mode="aspectFill"
|
||||||
|
></image>
|
||||||
|
</div>
|
||||||
|
<div class="CateInfo_Item_right" :class="GGshow ? 'noneBor' : ''">
|
||||||
|
<div class="CateInfo_Item_right_Tit" @click="goods(items.id)">
|
||||||
|
{{ items.commodity_name }}
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="CateInfo_Item_right_subtit"
|
||||||
|
@click="goods(items.id)"
|
||||||
|
>
|
||||||
|
{{ items.commodity_intro }}
|
||||||
|
</div>
|
||||||
|
<div class="CateInfo_Item_Money">
|
||||||
|
<div class="CateInfo_Item_Money_left">
|
||||||
|
<span>￥</span
|
||||||
|
>{{ items.commodity_goods_info_list[0].sales_price }}
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="CateInfo_Item_Money_right"
|
||||||
|
v-if="!(items.commodity_goods_info_list.length > 1)"
|
||||||
|
>
|
||||||
|
<u-number-box
|
||||||
|
:min="0"
|
||||||
|
v-model="items.quantity"
|
||||||
|
@change="handleQuantityChange(items)"
|
||||||
|
>
|
||||||
|
<view slot="minus" class="minus">
|
||||||
|
<u-icon name="minus" size="20"></u-icon>
|
||||||
|
</view>
|
||||||
|
<text
|
||||||
|
slot="input"
|
||||||
|
style="width: 50px; text-align: center"
|
||||||
|
class="input"
|
||||||
|
>{{ items.quantity ? items.quantity : 0 }}</text
|
||||||
|
>
|
||||||
|
<view slot="plus" class="plus">
|
||||||
|
<u-icon name="plus" color="#FFFFFF" size="20"></u-icon>
|
||||||
|
</view>
|
||||||
|
</u-number-box>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="CateInfo" v-for="(item, index) in tagList" :key="item.id">
|
<div
|
||||||
<div class="CateInfo_tit">
|
class="gg"
|
||||||
{{ item.tag_name }}
|
@click="chooseGG(items)"
|
||||||
</div>
|
v-if="
|
||||||
<div class="CateInfo_Item" v-for="items in item.commodity_info_list" :key="items.id">
|
items.commodity_goods_info_list.length > 1 && !items.isShow
|
||||||
<div class="CateInfo_Item_Box">
|
"
|
||||||
<div class="CateInfo_Item_left" @click="goods(items.id)">
|
>
|
||||||
<image
|
选择规格
|
||||||
:src="picUrl + items.commodity_pic"
|
<u-icon
|
||||||
mode="aspectFill"></image>
|
name="arrow-down"
|
||||||
</div>
|
size="26rpx"
|
||||||
<div class="CateInfo_Item_right" :class="GGshow ? 'noneBor' : ''">
|
color="#FF370B"
|
||||||
<div class="CateInfo_Item_right_Tit" @click="goods(items.id)">{{items.commodity_name}}</div>
|
></u-icon>
|
||||||
<div class="CateInfo_Item_right_subtit" @click="goods(items.id)">{{items.commodity_intro}}</div>
|
</div>
|
||||||
<div class="CateInfo_Item_Money">
|
|
||||||
<div class="CateInfo_Item_Money_left">
|
|
||||||
<span>￥</span>{{ items.commodity_goods_info_list[0].sales_price }}
|
|
||||||
</div>
|
|
||||||
<div class="CateInfo_Item_Money_right">
|
|
||||||
<u-number-box v-model="value">
|
|
||||||
<view slot="minus" class="minus">
|
|
||||||
<u-icon name="minus" size="20"></u-icon>
|
|
||||||
</view>
|
|
||||||
<text slot="input" style="width: 50px;text-align: center;" class="input">{{
|
|
||||||
value }}</text>
|
|
||||||
<view slot="plus" class="plus">
|
|
||||||
<u-icon name="plus" color="#FFFFFF" size="20"></u-icon>
|
|
||||||
</view>
|
|
||||||
</u-number-box>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="gg" @click="chooseGG(items)" v-if="items.commodity_goods_info_list.length > 1 && !items.isShow">
|
<div
|
||||||
选择规格 <u-icon name="arrow-down" size="26rpx" color="#FF370B"></u-icon>
|
class="gg"
|
||||||
</div>
|
@click="chooseGG(items)"
|
||||||
|
v-if="
|
||||||
|
items.commodity_goods_info_list.length > 1 && items.isShow
|
||||||
|
"
|
||||||
|
>
|
||||||
|
收起
|
||||||
|
<u-icon name="arrow-up" size="26rpx" color="#FF370B"></u-icon>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="gg" @click="chooseGG(items)" v-if="items.commodity_goods_info_list.length > 1 && items.isShow">
|
<div class="GGList" v-if="items.isShow">
|
||||||
收起 <u-icon name="arrow-up" size="26rpx" color="#FF370B"></u-icon>
|
<div
|
||||||
</div>
|
class="GGItem"
|
||||||
|
v-for="ite in items.commodity_goods_info_list"
|
||||||
|
@click="goods(items.id)"
|
||||||
|
>
|
||||||
|
<div class="GGItem_Image">
|
||||||
|
<image
|
||||||
|
:src="picUrl + ite.commodity_pic"
|
||||||
|
mode="aspectFill"
|
||||||
|
></image>
|
||||||
|
</div>
|
||||||
|
<div class="GGItem_Con">
|
||||||
|
<div class="GGItem_Con_Tit">{{ ite.goods_name }}</div>
|
||||||
|
<div class="GGItem_Con_Msg">
|
||||||
|
<div class="GGItem_Con_Msg_left">
|
||||||
|
<span>￥</span>{{ ite.sales_price }}
|
||||||
|
</div>
|
||||||
|
<div class="GGItem_Con_Msg_right">
|
||||||
|
<u-number-box
|
||||||
|
v-model="ite.quantity"
|
||||||
|
:min="0"
|
||||||
|
@change="handleQuantityChange(ite)"
|
||||||
|
>
|
||||||
|
<view slot="minus" class="minus">
|
||||||
|
<u-icon name="minus" size="20"></u-icon>
|
||||||
|
</view>
|
||||||
|
<text
|
||||||
|
slot="input"
|
||||||
|
style="width: 50px; text-align: center"
|
||||||
|
class="input"
|
||||||
|
>{{ ite.quantity ? ite.quantity : 0 }}</text
|
||||||
|
>
|
||||||
|
<view slot="plus" class="plus">
|
||||||
|
<u-icon
|
||||||
|
name="plus"
|
||||||
|
color="#FFFFFF"
|
||||||
|
size="20"
|
||||||
|
></u-icon>
|
||||||
|
</view>
|
||||||
|
</u-number-box>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
</div>
|
<!-- 按钮 -->
|
||||||
</div>
|
<!-- <div class="btn">
|
||||||
|
|
||||||
<div class="GGList" v-if="items.isShow">
|
|
||||||
<div class="GGItem" v-for="ite in items.commodity_goods_info_list" @click="goods(items.id)">
|
|
||||||
<div class="GGItem_Image">
|
|
||||||
<image
|
|
||||||
:src="picUrl + ite.commodity_pic"
|
|
||||||
mode="aspectFill"></image>
|
|
||||||
</div>
|
|
||||||
<div class="GGItem_Con">
|
|
||||||
<div class="GGItem_Con_Tit">{{ite.goods_name}}</div>
|
|
||||||
<div class="GGItem_Con_Msg">
|
|
||||||
<div class="GGItem_Con_Msg_left">
|
|
||||||
<span>￥</span>{{ ite.sales_price }}
|
|
||||||
</div>
|
|
||||||
<div class="GGItem_Con_Msg_right">
|
|
||||||
<u-number-box v-model="value">
|
|
||||||
<view slot="minus" class="minus">
|
|
||||||
<u-icon name="minus" size="20"></u-icon>
|
|
||||||
</view>
|
|
||||||
<text slot="input" style="width: 50px;text-align: center;"
|
|
||||||
class="input">{{
|
|
||||||
value }}</text>
|
|
||||||
<view slot="plus" class="plus">
|
|
||||||
<u-icon name="plus" color="#FFFFFF" size="20"></u-icon>
|
|
||||||
</view>
|
|
||||||
</u-number-box>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<!-- 按钮 -->
|
|
||||||
<!-- <div class="btn">
|
|
||||||
查看全部商品
|
查看全部商品
|
||||||
<div class="cir">
|
<div class="cir">
|
||||||
<u-icon name="arrow-right" color="#fff" size="12px"></u-icon>
|
<u-icon name="arrow-right" color="#fff" size="12px"></u-icon>
|
||||||
</div>
|
</div>
|
||||||
</div> -->
|
</div> -->
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<nav-footer :current="2" />
|
||||||
|
|
||||||
</div>
|
<div class="shop_car" @click="shopCar">
|
||||||
</div>
|
<u-badge
|
||||||
|
numberType="limit"
|
||||||
<nav-footer :current="2" />
|
type="error"
|
||||||
|
max="99"
|
||||||
<div class="shop_car" @click="shopCar">
|
:value="carNum"
|
||||||
<u-badge numberType="limit" type="error" max="99" :value="carNum"></u-badge>
|
></u-badge>
|
||||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_car_num.png"></image>
|
<image
|
||||||
<!-- <image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_car_empty.png"></image> -->
|
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_car_num.png"
|
||||||
</div>
|
></image>
|
||||||
|
<!-- <image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_car_empty.png"></image> -->
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import {
|
import { apiArr } from "../../../api/shop";
|
||||||
apiArr
|
import { picUrl, menuButtonInfo, request, NavgateTo } from "../../../utils";
|
||||||
} from '../../../api/shop';
|
|
||||||
import {
|
|
||||||
picUrl,
|
|
||||||
menuButtonInfo,
|
|
||||||
request,
|
|
||||||
NavgateTo
|
|
||||||
} from '../../../utils';
|
|
||||||
export default {
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
picUrl,
|
||||||
|
flag: false,
|
||||||
|
top: "",
|
||||||
|
localHeight: "",
|
||||||
|
search: "",
|
||||||
|
value: "1",
|
||||||
|
cateListShow: false,
|
||||||
|
iconList: [
|
||||||
|
{
|
||||||
|
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_icon1.png",
|
||||||
|
name: "休闲零食",
|
||||||
|
},
|
||||||
|
|
||||||
data() {
|
{
|
||||||
|
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_icon2.png",
|
||||||
|
name: "肉蛋果蔬",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_icon3.png",
|
||||||
|
name: "酒水饮料",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_icon4.png",
|
||||||
|
name: "家具电器",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_icon5.png",
|
||||||
|
name: "电脑手机",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_icon1.png",
|
||||||
|
name: "休闲零食",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_icon2.png",
|
||||||
|
name: "肉蛋果蔬",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_icon3.png",
|
||||||
|
name: "酒水饮料",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_icon4.png",
|
||||||
|
name: "家具电器",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_icon5.png",
|
||||||
|
name: "电脑手机",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
|
||||||
return {
|
rightTopActive: 0,
|
||||||
picUrl,
|
topShow: false,
|
||||||
flag: false,
|
|
||||||
top: "",
|
|
||||||
localHeight: "",
|
|
||||||
search: "",
|
|
||||||
value: "1",
|
|
||||||
cateListShow: false,
|
|
||||||
iconList: [
|
|
||||||
|
|
||||||
{
|
GGshow: false,
|
||||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_icon1.png",
|
CateList: [], //分类列表
|
||||||
name: "休闲零食"
|
currentFirstId: "",
|
||||||
},
|
leftCateList: [], //底部左侧分类
|
||||||
|
currentSecondId: "",
|
||||||
|
rightCateList: [], //底部右侧分类
|
||||||
|
currentThirdId: "",
|
||||||
|
|
||||||
{
|
tagList: [],
|
||||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_icon2.png",
|
carNum: "",
|
||||||
name: "肉蛋果蔬"
|
};
|
||||||
},
|
},
|
||||||
{
|
methods: {
|
||||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_icon3.png",
|
changeCate(id) {
|
||||||
name: "酒水饮料"
|
// 根据id查找对应的分类
|
||||||
},
|
const category = this.CateList.find((item) => item.id === id);
|
||||||
{
|
if (category) {
|
||||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_icon4.png",
|
// 将leftCateList设置为该分类的二级分类，若为null则设为空数组
|
||||||
name: "家具电器"
|
this.leftCateList = category.level_two_category || [];
|
||||||
},
|
this.secondId = this.leftCateList[0]?.id;
|
||||||
{
|
this.getGoodsList();
|
||||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_icon5.png",
|
}
|
||||||
name: "电脑手机"
|
},
|
||||||
},
|
//顶部分类点击
|
||||||
{
|
changeCateListShow() {
|
||||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_icon1.png",
|
this.cateListShow = !this.cateListShow;
|
||||||
name: "休闲零食"
|
},
|
||||||
},
|
//选择右下角分类
|
||||||
{
|
checkItem(index) {
|
||||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_icon2.png",
|
this.rightTopActive = index;
|
||||||
name: "肉蛋果蔬"
|
},
|
||||||
},
|
//右下角点击更多
|
||||||
{
|
topOpen() {
|
||||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_icon3.png",
|
this.topShow = !this.topShow;
|
||||||
name: "酒水饮料"
|
},
|
||||||
},
|
// 选择商品规格
|
||||||
{
|
chooseGG(e) {
|
||||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_icon4.png",
|
e.isShow = !e.isShow;
|
||||||
name: "家具电器"
|
},
|
||||||
},
|
//搜索页
|
||||||
{
|
searchPage() {
|
||||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_icon5.png",
|
NavgateTo("../search/index");
|
||||||
name: "电脑手机"
|
},
|
||||||
},
|
//商品详情页
|
||||||
],
|
goods(e) {
|
||||||
|
NavgateTo(`../goods/index?id=${e}`);
|
||||||
|
},
|
||||||
|
|
||||||
rightTopActive: 0,
|
// 购物车
|
||||||
topShow: false,
|
shopCar() {
|
||||||
|
NavgateTo("../shopCar/index");
|
||||||
|
},
|
||||||
|
//分类列表
|
||||||
|
getCateList() {
|
||||||
|
request(apiArr.goodsCateList, "POST", {}).then((res) => {
|
||||||
|
console.log(res);
|
||||||
|
this.CateList = res.commodity_category_list;
|
||||||
|
this.firstId = res.commodity_category_list[0].id;
|
||||||
|
this.leftCateList = res.commodity_category_list[0].level_two_category;
|
||||||
|
this.secondId = res.commodity_category_list[0].level_two_category[0].id;
|
||||||
|
this.getGoodsList();
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
GGshow: false,
|
getGoodsList() {
|
||||||
CateList:[],//分类列表
|
if (!this.secondId) {
|
||||||
currentFirstId:"",
|
this.tagList = [];
|
||||||
leftCateList:[], //底部左侧分类
|
return;
|
||||||
currentSecondId:"",
|
}
|
||||||
rightCateList:[], //底部右侧分类
|
request(apiArr.getGoodsList, "POST", {
|
||||||
currentThirdId:"",
|
user_id: uni.getStorageSync("userId"),
|
||||||
|
id: this.secondId,
|
||||||
|
}).then((res) => {
|
||||||
|
res.commodity_list.forEach((item) => {
|
||||||
|
item.commodity_info_list.forEach((item) => {
|
||||||
|
item.isShow = false;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
this.tagList = res.commodity_list;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
tagList:[],
|
getShopCarList() {
|
||||||
carNum:"",
|
request(apiArr.getCar, "POST").then((res) => {
|
||||||
}
|
console.log(res);
|
||||||
},
|
this.carNum = res.total;
|
||||||
methods: {
|
});
|
||||||
//顶部分类点击
|
},
|
||||||
changeCateListShow() {
|
|
||||||
this.cateListShow = !this.cateListShow
|
|
||||||
},
|
|
||||||
//选择右下角分类
|
|
||||||
checkItem(index) {
|
|
||||||
this.rightTopActive = index
|
|
||||||
},
|
|
||||||
//右下角点击更多
|
|
||||||
topOpen() {
|
|
||||||
this.topShow = !this.topShow
|
|
||||||
},
|
|
||||||
// 选择商品规格
|
|
||||||
chooseGG(e) {
|
|
||||||
e.isShow = !e.isShow
|
|
||||||
},
|
|
||||||
//搜索页
|
|
||||||
searchPage() {
|
|
||||||
NavgateTo('../search/index')
|
|
||||||
},
|
|
||||||
//商品详情页
|
|
||||||
goods(e) {
|
|
||||||
NavgateTo(`../goods/index?id=${e}`)
|
|
||||||
},
|
|
||||||
|
|
||||||
// 购物车
|
changeLeftCate(e) {
|
||||||
shopCar(){
|
this.secondId = e;
|
||||||
NavgateTo("../shopCar/index")
|
this.getGoodsList();
|
||||||
},
|
},
|
||||||
//分类列表
|
//商品数量变化
|
||||||
getCateList(){
|
handleQuantityChange(item) {
|
||||||
request(apiArr.goodsCateList,"POST",{}).then(res=>{
|
console.log("🚀 ~ handleQuantityChange ~ value:", item);
|
||||||
console.log(res);
|
const goodsId = "";
|
||||||
this.CateList = res.commodity_category_list
|
if (item.commodity_goods_info_list.length) {
|
||||||
this.firstId = res.commodity_category_list[0].id
|
this.goodsId = item.commodity_goods_info_list[0].id;
|
||||||
this.leftCateList = res.commodity_category_list[0].level_two_category
|
} else {
|
||||||
this.secondId = res.commodity_category_list[0].level_two_category[0].id
|
this.goodsId = item.id;
|
||||||
this.getGoodsList()
|
}
|
||||||
})
|
const params = {
|
||||||
},
|
user_id: uni.getStorageSync("userId"),
|
||||||
|
goods_id_and_count: [
|
||||||
getGoodsList(){
|
{
|
||||||
request(apiArr.getGoodsList,'POST',{
|
goods_id: this.goodsId,
|
||||||
user_id:"",
|
count: item.quantity ? item.quantity + 1 : 1,
|
||||||
id:this.secondId
|
},
|
||||||
}).then(res=>{
|
],
|
||||||
res.commodity_list.forEach(item => {
|
};
|
||||||
item.commodity_info_list.forEach(item=>{
|
console.log("🚀 ~ handleQuantityChange ~ params:", params);
|
||||||
item.isShow = false
|
request(apiArr.updateCar, "POST", params).then((res) => {
|
||||||
})
|
console.log(res);
|
||||||
});
|
uni.showToast({
|
||||||
this.tagList = res.commodity_list
|
title: "操作成功！",
|
||||||
})
|
success() {
|
||||||
},
|
// setTimeout(() => {
|
||||||
|
// that.getBanlance()
|
||||||
getShopCarList(){
|
// }, 1500)
|
||||||
request(apiArr.getCar,"POST",).then(res=>{
|
},
|
||||||
console.log(res);
|
});
|
||||||
this.carNum = res.total
|
});
|
||||||
})
|
},
|
||||||
},
|
},
|
||||||
|
onLoad(options) {
|
||||||
changeLeftCate(e){
|
const meun = menuButtonInfo();
|
||||||
this.secondId = e
|
this.top = meun.top;
|
||||||
this.getGoodsList()
|
this.localHeight = meun.height;
|
||||||
},
|
this.getCateList();
|
||||||
|
this.getShopCarList();
|
||||||
},
|
},
|
||||||
onLoad(options) {
|
onReachBottom() {
|
||||||
const meun = menuButtonInfo();
|
if (this.flag) {
|
||||||
this.top = meun.top;
|
}
|
||||||
this.localHeight = meun.height;
|
},
|
||||||
this.getCateList()
|
};
|
||||||
this.getShopCarList()
|
|
||||||
},
|
|
||||||
onReachBottom() {
|
|
||||||
if (this.flag) {
|
|
||||||
|
|
||||||
}
|
|
||||||
},
|
|
||||||
}
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user