2023-12-20 21:41:47 +08:00
|
|
|
|
<template>
|
|
|
|
|
|
<view class="goodCate">
|
|
|
|
|
|
<view class="header acea-row row-center-wrapper">
|
|
|
|
|
|
<navigator url='/pages/index/index' class="pageIndex" hover-class="none" open-type="switchTab">
|
|
|
|
|
|
<text class="iconfont icon-shouye3"></text>
|
|
|
|
|
|
</navigator>
|
|
|
|
|
|
<navigator url="/pages/goods_search/index" class="search acea-row row-center-wrapper" hover-class="none"><text class="iconfont icon-xiazai5"></text>
|
|
|
|
|
|
搜索商品</navigator>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="conter" v-if="showSlide">
|
|
|
|
|
|
<view class='aside'>
|
|
|
|
|
|
<view class='item acea-row row-center-wrapper' :class='index==navActive?"on":""' v-for="(item,index) in productList"
|
|
|
|
|
|
:key="index" @click="tapNav(index,item)">
|
|
|
|
|
|
<text>{{item.name}}</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="wrapper">
|
|
|
|
|
|
<view class="bgcolor" v-if="iSlong">
|
|
|
|
|
|
<view class="longTab acea-row row-middle">
|
|
|
|
|
|
<scroll-view scroll-x="true" style="white-space: nowrap; display: flex;height:44rpx;" scroll-with-animation
|
|
|
|
|
|
:scroll-left="tabLeft" show-scrollbar="true">
|
|
|
|
|
|
<!-- <view class="longItem" :style='"width:"+isWidth+"px"'>全部</view> -->
|
|
|
|
|
|
<view class="longItem" :style='"width:"+isWidth+"px"' :class="index===tabClick?'click':''" v-for="(item,index) in categoryErList"
|
|
|
|
|
|
:key="index" @click="longClick(index,item)">{{item.name}}</view>
|
|
|
|
|
|
</scroll-view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="openList" @click="openTap"><text class="iconfont icon-xiala"></text></view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view v-else>
|
|
|
|
|
|
<view class="downTab">
|
|
|
|
|
|
<view class="title acea-row row-between-wrapper">
|
|
|
|
|
|
<view>{{categoryTitle}}</view>
|
|
|
|
|
|
<view class="closeList" @click="closeTap"><text class="iconfont icon-xiala"></text></view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="children">
|
|
|
|
|
|
<view class="acea-row row-middle">
|
|
|
|
|
|
<view class="item line1" :class="index===tabClick?'click':''" v-for="(item,index) in categoryErList" :key="index"
|
|
|
|
|
|
@click="longClick(index,item)">{{item.name}}</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="mask" @click="closeTap"></view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<goodList :tempArr="tempArr" :isLogin="isLogin" @gocartduo="goCartDuo" @detail="goDetail"></goodList>
|
|
|
|
|
|
<view class='loadingicon acea-row row-center-wrapper mb-2'>
|
|
|
|
|
|
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="conter" v-else>
|
|
|
|
|
|
<view class="hide_slide">
|
|
|
|
|
|
<view class="bgcolor" v-if="iSlong">
|
|
|
|
|
|
<view class="hongTab acea-row row-middle">
|
|
|
|
|
|
<scroll-view scroll-x="true" style="white-space: nowrap; display: flex;height:44rpx;" scroll-with-animation
|
|
|
|
|
|
:scroll-left="tabLeft" show-scrollbar="true">
|
|
|
|
|
|
<view class="longItem" :style='"width:"+isWidth+"px"' :class="index===tabClick?'click':''" v-for="(item,index) in productList"
|
|
|
|
|
|
:key="index" @click="navSwitch(index,item)">{{item.name}}</view>
|
|
|
|
|
|
</scroll-view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="openList" @click="openTap"><text class="iconfont icon-xiangxia"></text></view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view v-else>
|
|
|
|
|
|
<view class="hownTab">
|
|
|
|
|
|
<view class="title acea-row row-between-wrapper">
|
|
|
|
|
|
<view>{{categoryTitle}}</view>
|
|
|
|
|
|
<view class="closeList" @click="closeTap"><text class="iconfont icon-xiangxia"></text></view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="children">
|
|
|
|
|
|
<view class="acea-row row-middle">
|
|
|
|
|
|
<view class="item line1" :class="index===tabClick?'click':''" v-for="(item,index) in productList" :key="index"
|
|
|
|
|
|
@click="navSwitch(index,item)">{{item.name}}</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="mask" @click="closeTap"></view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="list_prod">
|
|
|
|
|
|
<view class="item acea-row row-between-wrapper" v-for="(item,index) in tempArr" :key='index' @click="goDetail(item)">
|
|
|
|
|
|
<view class="pic">
|
|
|
|
|
|
<image :src="item.image" mode="aspectFill"></image>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="pictxt">
|
|
|
|
|
|
<view class="text line2">{{item.storeName}}</view>
|
|
|
|
|
|
<view class="bottom acea-row row-between-wrapper">
|
|
|
|
|
|
<view class="money">
|
|
|
|
|
|
<text class="sign">￥</text>
|
|
|
|
|
|
<text class="price_num">{{item.price}}</text>
|
|
|
|
|
|
<span class="item_sales" v-if="item.sales">已售{{item.sales}}</span>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view v-if="item.stock>0">
|
|
|
|
|
|
<view>
|
|
|
|
|
|
<!-- 多规格 -->
|
|
|
|
|
|
<view class="bnt" @click.stop="goCartDuo(item)">
|
|
|
|
|
|
选规格
|
|
|
|
|
|
<view class="num" v-if="item.cartNum">{{item.cartNum}}</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="bnt end" v-else>已售罄</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class='loadingicon acea-row row-center-wrapper mb-2'>
|
|
|
|
|
|
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="footer acea-row row-between-wrapper">
|
|
|
|
|
|
<view class="cartIcon acea-row row-center-wrapper" @click="getCartLists(0)" v-if="cartData.cartList.length">
|
|
|
|
|
|
<image src="../../../static/images/cart.png"></image>
|
|
|
|
|
|
<view class="num">{{cartCount}}</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="cartIcon acea-row row-center-wrapper noCart" v-else>
|
|
|
|
|
|
<image src="../../../static/images/no_cart.png"></image>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="money acea-row row-middle">
|
|
|
|
|
|
<view>￥<text class="num">{{totalPrice}}</text></view>
|
|
|
|
|
|
<view class="bnt gray_bg" :class="{ 'main_bg': cartCount > 0}" @click="subOrder">去结算</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<cartList :cartData="cartData" @closeList="closeList" @ChangeCartNumDan="ChangeCartList" @ChangeSubDel="ChangeSubDel" @ChangeOneDel="ChangeOneDel"></cartList>
|
|
|
|
|
|
<productWindow :attr="attr" :isShow='1' :iSplus='1' :iScart='1' @myevent="onMyEvent" @ChangeAttr="ChangeAttr"
|
|
|
|
|
|
@ChangeCartNum="ChangeCartNumDuo" @attrVal="attrVal" @iptCartNum="iptCartNum" @goCat="goCatNum" id='product-window'></productWindow>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
|
import {
|
|
|
|
|
|
getCategoryList,
|
|
|
|
|
|
getProductslist,
|
|
|
|
|
|
getAttr,
|
|
|
|
|
|
postCartAdd
|
|
|
|
|
|
} from '@/api/store.js';
|
|
|
|
|
|
import {
|
|
|
|
|
|
getCartList,
|
|
|
|
|
|
getCartCounts,
|
|
|
|
|
|
cartDel,
|
|
|
|
|
|
changeCartNum,
|
|
|
|
|
|
} from '@/api/order.js';
|
|
|
|
|
|
import productWindow from '@/components/productWindow';
|
|
|
|
|
|
import goodList from '@/components/d_goodList';
|
|
|
|
|
|
import cartList from '@/components/cartList';
|
|
|
|
|
|
import {mapGetters} from 'vuex';
|
|
|
|
|
|
import {goShopDetail} from '@/libs/order.js';
|
|
|
|
|
|
import {toLogin} from '@/libs/login.js';
|
|
|
|
|
|
import animationType from '@/utils/animationType.js'
|
|
|
|
|
|
export default {
|
|
|
|
|
|
computed: mapGetters(['isLogin', 'uid']),
|
|
|
|
|
|
components: {
|
|
|
|
|
|
productWindow,
|
|
|
|
|
|
goodList,
|
|
|
|
|
|
cartList
|
|
|
|
|
|
},
|
|
|
|
|
|
props: {
|
|
|
|
|
|
showSlide: {
|
|
|
|
|
|
type: Boolean,
|
|
|
|
|
|
default:true
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
data() {
|
|
|
|
|
|
return {
|
|
|
|
|
|
productList: [],
|
|
|
|
|
|
navActive: 0,
|
|
|
|
|
|
categoryTitle: '',
|
|
|
|
|
|
categoryErList: [],
|
|
|
|
|
|
tabLeft: 0,
|
|
|
|
|
|
isWidth: 0, //每个导航栏占位
|
|
|
|
|
|
tabClick: 0, //导航栏被点击
|
|
|
|
|
|
iSlong: true,
|
|
|
|
|
|
tempArr: [],
|
|
|
|
|
|
loading: false,
|
|
|
|
|
|
loadend: false,
|
|
|
|
|
|
loadTitle: '加载更多',
|
|
|
|
|
|
page: 1,
|
|
|
|
|
|
limit: 10,
|
|
|
|
|
|
cid: 0, //一级分类
|
|
|
|
|
|
sid: 0, //二级分类
|
|
|
|
|
|
isAuto: false, //没有授权的不会自动授权
|
|
|
|
|
|
isShowAuth: false, //是否隐藏授权
|
|
|
|
|
|
attr: {
|
|
|
|
|
|
cartAttr: false,
|
|
|
|
|
|
productAttr: [],
|
|
|
|
|
|
productSelect: {}
|
|
|
|
|
|
},
|
|
|
|
|
|
productValue: [],
|
|
|
|
|
|
attrValue: '', //已选属性
|
|
|
|
|
|
storeName: '', //多属性产品名称
|
|
|
|
|
|
id: 0,
|
|
|
|
|
|
cartData: {
|
|
|
|
|
|
cartList: [],
|
|
|
|
|
|
iScart: false
|
|
|
|
|
|
},
|
|
|
|
|
|
cartCount: 0,
|
|
|
|
|
|
totalPrice: 0.00,
|
|
|
|
|
|
lengthCart: 0
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
created(){
|
|
|
|
|
|
if(this.isLogin){
|
|
|
|
|
|
this.getCartNum();
|
|
|
|
|
|
this.getCartLists(1);
|
|
|
|
|
|
}
|
|
|
|
|
|
this.getAllCategory();
|
|
|
|
|
|
let that = this;
|
|
|
|
|
|
that.lengthCart = that.cartData.cartList;
|
|
|
|
|
|
// 获取设备宽度
|
|
|
|
|
|
uni.getSystemInfo({
|
|
|
|
|
|
success(e) {
|
|
|
|
|
|
that.isWidth = e.windowWidth / 5
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
},
|
|
|
|
|
|
methods: {
|
|
|
|
|
|
// 生成订单；
|
|
|
|
|
|
subOrder: function() {
|
|
|
|
|
|
let that = this,list = that.cartData.cartList,ids = [];
|
|
|
|
|
|
if(list.length){
|
|
|
|
|
|
let shoppingCartId = list.map(item => {
|
|
|
|
|
|
return {
|
|
|
|
|
|
"shoppingCartId": Number(item.id)
|
|
|
|
|
|
}
|
|
|
|
|
|
})
|
|
|
|
|
|
this.$Order.getPreOrder("shoppingCart", shoppingCartId);
|
|
|
|
|
|
that.cartData.iScart = false;
|
|
|
|
|
|
}else{
|
|
|
|
|
|
return that.$util.Tips({
|
|
|
|
|
|
title: '请选择产品'
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
// 计算总价；
|
|
|
|
|
|
getTotalPrice: function(){
|
|
|
|
|
|
let that = this,list = that.cartData.cartList,totalPrice = 0.00;
|
|
|
|
|
|
list.forEach(item=>{
|
|
|
|
|
|
if(item.attrStatus ){
|
|
|
|
|
|
totalPrice = that.$util.$h.Add(totalPrice, that.$util.$h.Mul(item.cartNum, item.vipPrice ? item.vipPrice : item.price));
|
|
|
|
|
|
}
|
|
|
|
|
|
})
|
|
|
|
|
|
that.$set(that,'totalPrice',totalPrice);
|
|
|
|
|
|
},
|
|
|
|
|
|
ChangeSubDel: function(event) {
|
|
|
|
|
|
let that = this,list = that.cartData.cartList,ids = [];
|
|
|
|
|
|
list.forEach(item=>{
|
|
|
|
|
|
ids.push(item.id)
|
|
|
|
|
|
});
|
|
|
|
|
|
cartDel(ids.join(",")).then(res=>{
|
|
|
|
|
|
that.$set(that.cartData,'cartList',[]);
|
|
|
|
|
|
that.cartData.iScart = false;
|
|
|
|
|
|
that.totalPrice = 0.00;
|
|
|
|
|
|
that.page = 1;
|
|
|
|
|
|
that.loadend = false;
|
|
|
|
|
|
that.tempArr = [];
|
|
|
|
|
|
that.productslist();
|
|
|
|
|
|
that.getCartNum();
|
|
|
|
|
|
})
|
|
|
|
|
|
},
|
|
|
|
|
|
ChangeOneDel:function(id,index){
|
|
|
|
|
|
let that = this,list = that.cartData.cartList;
|
|
|
|
|
|
cartDel(id.toString()).then(res=>{
|
|
|
|
|
|
list.splice(index,1);
|
|
|
|
|
|
if(!list.length){
|
|
|
|
|
|
that.cartData.iScart = false;
|
|
|
|
|
|
that.page = 1;
|
|
|
|
|
|
that.loadend = false;
|
|
|
|
|
|
that.tempArr = [];
|
|
|
|
|
|
that.productslist();
|
|
|
|
|
|
};
|
|
|
|
|
|
that.getCartNum();
|
|
|
|
|
|
})
|
|
|
|
|
|
},
|
|
|
|
|
|
getCartLists(iSshow) {
|
|
|
|
|
|
let that = this;
|
|
|
|
|
|
let data = {
|
|
|
|
|
|
page: 1,
|
|
|
|
|
|
limit: that.cartCount,
|
|
|
|
|
|
isValid: true
|
|
|
|
|
|
};
|
|
|
|
|
|
getCartList(data).then(res => {
|
|
|
|
|
|
that.$set(that.cartData, 'cartList', res.data.list);
|
|
|
|
|
|
if(res.data.list.length){
|
|
|
|
|
|
that.$set(that.cartData, 'iScart', iSshow?false:!that.cartData.iScart);
|
|
|
|
|
|
}else{
|
|
|
|
|
|
that.$set(that.cartData, 'iScart', false);
|
|
|
|
|
|
}
|
|
|
|
|
|
that.getTotalPrice();
|
|
|
|
|
|
})
|
|
|
|
|
|
},
|
|
|
|
|
|
closeList(e) {
|
|
|
|
|
|
this.$set(this.cartData, 'iScart', e);
|
|
|
|
|
|
this.page = 1;
|
|
|
|
|
|
this.loadend = false;
|
|
|
|
|
|
this.tempArr = [];
|
|
|
|
|
|
this.productslist();
|
|
|
|
|
|
},
|
|
|
|
|
|
getCartNum: function() {
|
|
|
|
|
|
let that = this;
|
|
|
|
|
|
getCartCounts(true, 'sum').then(res => {
|
|
|
|
|
|
that.$set(that,'cartCount',res.data.count);
|
|
|
|
|
|
});
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
onMyEvent: function() {
|
|
|
|
|
|
this.$set(this.attr, 'cartAttr', false);
|
|
|
|
|
|
},
|
|
|
|
|
|
/**
|
|
|
|
|
|
* 默认选中属性
|
|
|
|
|
|
*
|
|
|
|
|
|
*/
|
|
|
|
|
|
DefaultSelect: function() {
|
|
|
|
|
|
let productAttr = this.attr.productAttr;
|
|
|
|
|
|
let value = [];
|
|
|
|
|
|
for (let key in this.productValue) {
|
|
|
|
|
|
if (this.productValue[key].stock > 0) {
|
|
|
|
|
|
value = this.attr.productAttr.length ? key.split(",") : [];
|
|
|
|
|
|
break;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
for (let i = 0; i < productAttr.length; i++) {
|
|
|
|
|
|
this.$set(productAttr[i], "index", value[i]);
|
|
|
|
|
|
}
|
|
|
|
|
|
//sort();排序函数:数字-英文-汉字；
|
|
|
|
|
|
let productSelect = this.productValue[value.join(",")];
|
|
|
|
|
|
if (productSelect && productAttr.length) {
|
|
|
|
|
|
this.$set(this.attr.productSelect,"storeName",this.storeName);
|
|
|
|
|
|
this.$set(this.attr.productSelect, "image", productSelect.image);
|
|
|
|
|
|
this.$set(this.attr.productSelect, "price", productSelect.price);
|
|
|
|
|
|
this.$set(this.attr.productSelect, "stock", productSelect.stock);
|
|
|
|
|
|
this.$set(this.attr.productSelect, "unique", productSelect.id);
|
|
|
|
|
|
this.$set(this.attr.productSelect, "vipPrice", productSelect.vipPrice);
|
|
|
|
|
|
this.$set(this.attr.productSelect, "cart_num", 1);
|
|
|
|
|
|
this.$set(this, "attrValue", value.join(","));
|
|
|
|
|
|
} else if (!productSelect && productAttr.length) {
|
|
|
|
|
|
this.$set(this.attr.productSelect,"storeName",this.storeName);
|
|
|
|
|
|
this.$set(this.attr.productSelect, "image", this.storeInfo.image);
|
|
|
|
|
|
this.$set(this.attr.productSelect, "price", this.storeInfo.price);
|
|
|
|
|
|
this.$set(this.attr.productSelect, "stock", 0);
|
|
|
|
|
|
this.$set(this.attr.productSelect, "unique", "");
|
|
|
|
|
|
this.$set(this.attr.productSelect, "cart_num", 0);
|
|
|
|
|
|
this.$set(this, "attrValue", "");
|
|
|
|
|
|
} else if (!productSelect && !productAttr.length) {
|
|
|
|
|
|
this.$set(this.attr.productSelect,"storeName",this.storeName);
|
|
|
|
|
|
this.$set(this.attr.productSelect, "image", this.storeInfo.image);
|
|
|
|
|
|
this.$set(this.attr.productSelect, "price", this.storeInfo.price);
|
|
|
|
|
|
this.$set(this.attr.productSelect, "stock", this.storeInfo.stock);
|
|
|
|
|
|
this.$set(this.attr.productSelect,"unique",this.storeInfo.unique || "");
|
|
|
|
|
|
this.$set(this.attr.productSelect, "cart_num", 1);
|
|
|
|
|
|
this.$set(this, "attrValue", "");
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
/**
|
|
|
|
|
|
* 属性变动赋值
|
|
|
|
|
|
*
|
|
|
|
|
|
*/
|
|
|
|
|
|
ChangeAttr: function(res) {
|
|
|
|
|
|
let productSelect = this.productValue[res];
|
|
|
|
|
|
if (productSelect) {
|
|
|
|
|
|
this.$set(this.attr.productSelect, "image", productSelect.image);
|
|
|
|
|
|
this.$set(this.attr.productSelect, "price", productSelect.price);
|
|
|
|
|
|
this.$set(this.attr.productSelect, "stock", productSelect.stock);
|
|
|
|
|
|
this.$set(this.attr.productSelect, "unique", productSelect.id);
|
|
|
|
|
|
this.$set(this.attr.productSelect, "cart_num", 1);
|
|
|
|
|
|
this.$set(this.attr.productSelect, "vipPrice", productSelect.vipPrice);
|
|
|
|
|
|
this.$set(this.attr.productSelect, 'otPrice', productSelect.otPrice);
|
|
|
|
|
|
this.$set(this, "attrValue", res);
|
|
|
|
|
|
} else {
|
|
|
|
|
|
this.$set(this.attr.productSelect, "price", '暂无报价');
|
|
|
|
|
|
this.$set(this.attr.productSelect, "stock", 0);
|
|
|
|
|
|
this.$set(this.attr.productSelect, "unique", 0);
|
|
|
|
|
|
this.$set(this.attr.productSelect, "cart_num", 0);
|
|
|
|
|
|
this.$set(this.attr.productSelect, "vipPrice", '暂无报价');
|
|
|
|
|
|
this.$set(this, "attrValue", "");
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
attrVal(val) {
|
|
|
|
|
|
this.$set(this.attr.productAttr[val.indexw], 'index', this.attr.productAttr[val.indexw].attrValues[val
|
|
|
|
|
|
.indexn]);
|
|
|
|
|
|
},
|
|
|
|
|
|
/**
|
|
|
|
|
|
* 购物车手动填写
|
|
|
|
|
|
*
|
|
|
|
|
|
*/
|
|
|
|
|
|
iptCartNum: function(e) {
|
|
|
|
|
|
this.$set(this.attr.productSelect, 'cart_num', e);
|
|
|
|
|
|
},
|
|
|
|
|
|
onLoadFun() {},
|
|
|
|
|
|
// 产品列表
|
|
|
|
|
|
productslist: function() {
|
|
|
|
|
|
let that = this;
|
|
|
|
|
|
if (that.loadend) return; //如果返回列表长度小于请求分页长度，就让他为true,就不继续请求了
|
|
|
|
|
|
if (that.loading) return;
|
|
|
|
|
|
that.loading = true;
|
|
|
|
|
|
that.loadTitle = '';
|
2024-03-26 17:12:46 +08:00
|
|
|
|
let abb =0
|
|
|
|
|
|
if(uni.getStorageSync('channelId')){
|
|
|
|
|
|
abb=uni.getStorageSync('channelId')
|
|
|
|
|
|
}else{
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
console.log('3调用的');
|
2023-12-20 21:41:47 +08:00
|
|
|
|
getProductslist({
|
|
|
|
|
|
page: that.page,
|
|
|
|
|
|
limit: that.limit,
|
|
|
|
|
|
type: 1,
|
2024-03-26 17:12:46 +08:00
|
|
|
|
cid: that.sid,
|
|
|
|
|
|
channelId:abb,
|
2023-12-20 21:41:47 +08:00
|
|
|
|
}).then(res => {
|
|
|
|
|
|
let list = res.data.list,
|
|
|
|
|
|
loadend = list.length < that.limit; //返回列表长度小于请求分页长度为true,反之为false
|
|
|
|
|
|
that.tempArr = that.$util.SplitArray(list, that.tempArr);
|
|
|
|
|
|
that.$set(that, 'tempArr', that.tempArr);
|
|
|
|
|
|
that.loading = false;
|
|
|
|
|
|
that.loadend = loadend;
|
|
|
|
|
|
that.loadTitle = loadend ? "😕人家是有底线的~~" : "加载更多";
|
|
|
|
|
|
that.page = that.page + 1;
|
|
|
|
|
|
}).catch(err => {
|
|
|
|
|
|
that.loading = false,
|
|
|
|
|
|
that.loadTitle = '加载更多'
|
|
|
|
|
|
});
|
|
|
|
|
|
},
|
|
|
|
|
|
// 改变多属性购物车
|
|
|
|
|
|
ChangeCartNumDuo(changeValue) {
|
|
|
|
|
|
//changeValue:是否 加|减
|
|
|
|
|
|
//获取当前变动属性
|
|
|
|
|
|
let productSelect = this.productValue[this.attrValue];
|
|
|
|
|
|
//如果没有属性,赋值给商品默认库存
|
|
|
|
|
|
if (productSelect === undefined && !this.attr.productAttr.length)
|
|
|
|
|
|
productSelect = this.attr.productSelect;
|
|
|
|
|
|
//无属性值即库存为0；不存在加减；
|
|
|
|
|
|
if (productSelect === undefined) return;
|
|
|
|
|
|
let stock = productSelect.stock || 0;
|
|
|
|
|
|
let num = this.attr.productSelect;
|
|
|
|
|
|
if (changeValue) {
|
|
|
|
|
|
num.cart_num++;
|
|
|
|
|
|
if (num.cart_num > stock) {
|
|
|
|
|
|
this.$set(this.attr.productSelect, "cart_num", stock);
|
|
|
|
|
|
this.$set(this, "cart_num", stock);
|
|
|
|
|
|
}
|
|
|
|
|
|
} else {
|
|
|
|
|
|
num.cart_num--;
|
|
|
|
|
|
if (num.cart_num < 1) {
|
|
|
|
|
|
this.$set(this.attr.productSelect, "cart_num", 1);
|
|
|
|
|
|
this.$set(this, "cart_num", 1);
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
// 已经加入购物车时的购物加减；
|
|
|
|
|
|
ChangeCartList(changeValue, index) {
|
|
|
|
|
|
let list = this.cartData.cartList;
|
|
|
|
|
|
let num = list[index];
|
|
|
|
|
|
let stock = list[index].stock;
|
|
|
|
|
|
this.ChangeCartNum(changeValue, num, stock, 0, num.productId,index,1);
|
|
|
|
|
|
if(!list.length){
|
|
|
|
|
|
this.cartData.iScart = false;
|
|
|
|
|
|
this.page = 1;
|
|
|
|
|
|
this.loadend = false;
|
|
|
|
|
|
this.tempArr = [];
|
|
|
|
|
|
this.productslist();
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
// 购物车加减计算函数
|
|
|
|
|
|
ChangeCartNum: function(changeValue,index) {
|
|
|
|
|
|
if (changeValue) {
|
|
|
|
|
|
if (index.cartNum >= index.stock) {
|
|
|
|
|
|
index.cartNum = index.stock;
|
|
|
|
|
|
}else{
|
|
|
|
|
|
index.cartNum++;
|
|
|
|
|
|
changeCartNum(index.id, index.cartNum).then(res => {
|
|
|
|
|
|
this.getCartNum(true);
|
|
|
|
|
|
this.getTotalPrice();
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
} else {
|
|
|
|
|
|
index.cartNum--;
|
|
|
|
|
|
changeCartNum(index.id, index.cartNum).then(res => {
|
|
|
|
|
|
this.getCartNum(true);
|
|
|
|
|
|
this.getTotalPrice();
|
|
|
|
|
|
});
|
|
|
|
|
|
if(index.cartNum == 0){
|
|
|
|
|
|
cartDel(index.id).then(res=>{
|
|
|
|
|
|
this.getCartLists(1);
|
|
|
|
|
|
this.getTotalPrice();
|
|
|
|
|
|
this.productslist();
|
|
|
|
|
|
this.getCartNum();
|
|
|
|
|
|
})
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
// 多规格加入购物车；
|
|
|
|
|
|
goCatNum() {
|
|
|
|
|
|
this.goCat(1);
|
|
|
|
|
|
},
|
|
|
|
|
|
/*
|
|
|
|
|
|
* 加入购物车
|
|
|
|
|
|
*/
|
|
|
|
|
|
goCat: function(num) {
|
|
|
|
|
|
let that = this,
|
|
|
|
|
|
productSelect = that.productValue[this.attrValue];
|
|
|
|
|
|
//打开属性
|
|
|
|
|
|
if (that.attrValue) {
|
|
|
|
|
|
//默认选中了属性，但是没有打开过属性弹窗还是自动打开让用户查看默认选中的属性
|
|
|
|
|
|
that.attr.cartAttr = !that.isOpen ? true : false;
|
|
|
|
|
|
} else {
|
|
|
|
|
|
if (that.isOpen) that.attr.cartAttr = true;
|
|
|
|
|
|
else that.attr.cartAttr = !that.attr.cartAttr;
|
|
|
|
|
|
}
|
|
|
|
|
|
//只有关闭属性弹窗时进行加入购物车
|
|
|
|
|
|
if (that.attr.cartAttr === true && that.isOpen === false)
|
|
|
|
|
|
return (that.isOpen = true);
|
|
|
|
|
|
//如果有属性,没有选择,提示用户选择
|
|
|
|
|
|
if (
|
|
|
|
|
|
that.attr.productAttr.length &&
|
|
|
|
|
|
productSelect.stock === 0 &&
|
|
|
|
|
|
that.isOpen === true
|
|
|
|
|
|
)
|
|
|
|
|
|
return that.$util.Tips({
|
|
|
|
|
|
title: "产品库存不足，请选择其它"
|
|
|
|
|
|
});
|
|
|
|
|
|
if (num === 1) {
|
|
|
|
|
|
let q = {
|
|
|
|
|
|
productId: parseFloat(that.id),
|
|
|
|
|
|
cartNum: parseFloat(that.attr.productSelect.cart_num),
|
|
|
|
|
|
isNew: false,
|
|
|
|
|
|
productAttrUnique: that.attr.productSelect !== undefined ?
|
|
|
|
|
|
that.attr.productSelect.unique : that.productInfo.id
|
|
|
|
|
|
};
|
|
|
|
|
|
postCartAdd(q).then(function(res) {
|
|
|
|
|
|
that.isOpen = false;
|
|
|
|
|
|
that.attr.cartAttr = false;
|
|
|
|
|
|
that.$util.Tips({
|
|
|
|
|
|
title: "添加购物车成功",
|
|
|
|
|
|
success: () => {
|
|
|
|
|
|
setTimeout(()=>{
|
|
|
|
|
|
that.getCartNum(true);
|
|
|
|
|
|
that.getCartLists(1);
|
|
|
|
|
|
},100)
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
})
|
|
|
|
|
|
.catch(res => {
|
|
|
|
|
|
that.isOpen = false;
|
|
|
|
|
|
return that.$util.Tips({
|
|
|
|
|
|
title: res
|
|
|
|
|
|
});
|
|
|
|
|
|
});
|
|
|
|
|
|
} else {
|
|
|
|
|
|
this.getPreOrder();
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
goCartDuo(item) {
|
|
|
|
|
|
if (!this.isLogin) {
|
|
|
|
|
|
this.getIsLogin();
|
|
|
|
|
|
} else {
|
|
|
|
|
|
uni.showLoading({
|
|
|
|
|
|
title: '加载中'
|
|
|
|
|
|
});
|
|
|
|
|
|
this.storeName = item.storeName;
|
|
|
|
|
|
this.getAttrs(item.id,item.storeName);
|
|
|
|
|
|
this.$set(this, 'id', item.id);
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
getIsLogin() {
|
|
|
|
|
|
toLogin();
|
|
|
|
|
|
},
|
|
|
|
|
|
// 商品详情接口；
|
|
|
|
|
|
getAttrs(id) {
|
|
|
|
|
|
let that = this;
|
|
|
|
|
|
getAttr(id).then(res => {
|
|
|
|
|
|
uni.hideLoading();
|
|
|
|
|
|
that.$set(that.attr, 'productAttr', res.data.productAttr);
|
|
|
|
|
|
that.$set(that, 'productValue', res.data.productValue);
|
|
|
|
|
|
let productAttr = that.attr.productAttr.map(item => {
|
|
|
|
|
|
return {
|
|
|
|
|
|
attrName : item.attrName,
|
|
|
|
|
|
attrValues: item.attrValues.split(','),
|
|
|
|
|
|
id:item.id,
|
|
|
|
|
|
isDel:item.isDel,
|
|
|
|
|
|
productId:item.productId,
|
|
|
|
|
|
type:item.type
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
this.$set(that.attr,'productAttr',productAttr);
|
|
|
|
|
|
this.$set(that.attr, 'cartAttr', true);
|
|
|
|
|
|
that.DefaultSelect();
|
|
|
|
|
|
})
|
|
|
|
|
|
},
|
|
|
|
|
|
// 去详情页
|
|
|
|
|
|
goDetail(item) {
|
|
|
|
|
|
if (!this.isLogin) {
|
|
|
|
|
|
toLogin();
|
|
|
|
|
|
} else {
|
|
|
|
|
|
goShopDetail(item, this.uid).then(res => {
|
|
|
|
|
|
uni.navigateTo({
|
|
|
|
|
|
animationType: animationType.type,
animationDuration: animationType.duration,
|
|
|
|
|
|
url: `/pages/goods_details/index?id=${item.id}`
|
|
|
|
|
|
});
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
openTap() {
|
|
|
|
|
|
this.iSlong = false
|
|
|
|
|
|
},
|
|
|
|
|
|
closeTap() {
|
|
|
|
|
|
this.iSlong = true
|
|
|
|
|
|
},
|
|
|
|
|
|
getAllCategory: function() {
|
|
|
|
|
|
let that = this;
|
|
|
|
|
|
getCategoryList().then(res => {
|
|
|
|
|
|
res.data.forEach((item)=>{
|
|
|
|
|
|
if(item.child){
|
|
|
|
|
|
item.child.unshift({
|
|
|
|
|
|
id:item.id,
|
|
|
|
|
|
name:'全部'
|
|
|
|
|
|
})
|
|
|
|
|
|
}
|
|
|
|
|
|
})
|
|
|
|
|
|
let data = res.data;
|
|
|
|
|
|
that.categoryTitle = data[0].name;
|
|
|
|
|
|
that.sid = data[0].id;
|
|
|
|
|
|
that.productList = data;
|
|
|
|
|
|
that.categoryErList = res.data[0].child ? res.data[0].child : [];
|
|
|
|
|
|
that.page = 1;
|
|
|
|
|
|
that.loadend = false;
|
|
|
|
|
|
that.tempArr = [];
|
|
|
|
|
|
that.productslist();
|
|
|
|
|
|
})
|
|
|
|
|
|
},
|
|
|
|
|
|
tapNav(index, item) {
|
|
|
|
|
|
let list = this.productList[index];
|
|
|
|
|
|
this.navActive = index;
|
|
|
|
|
|
this.categoryTitle = list.name;
|
|
|
|
|
|
this.categoryErList = item.child ? item.child : [];
|
|
|
|
|
|
this.tabClick = 0;
|
|
|
|
|
|
this.tabLeft = 0;
|
|
|
|
|
|
// this.cid = list.id;
|
|
|
|
|
|
this.sid = item.id;
|
|
|
|
|
|
this.page = 1;
|
|
|
|
|
|
this.loadend = false;
|
|
|
|
|
|
this.tempArr = [];
|
|
|
|
|
|
this.productslist();
|
|
|
|
|
|
},
|
|
|
|
|
|
navSwitch(index,item){
|
|
|
|
|
|
if (this.productList.length > 3) {
|
|
|
|
|
|
this.tabLeft = (index - 1) * (this.isWidth + 6) //设置下划线位置
|
|
|
|
|
|
};
|
|
|
|
|
|
this.tabClick = index; //设置导航点击了哪一个
|
|
|
|
|
|
this.iSlong = true;
|
|
|
|
|
|
this.sid = item.id;
|
|
|
|
|
|
this.page = 1;
|
|
|
|
|
|
this.loadend = false;
|
|
|
|
|
|
this.tempArr = [];
|
|
|
|
|
|
this.productslist();
|
|
|
|
|
|
},
|
|
|
|
|
|
// 导航栏点击
|
|
|
|
|
|
longClick(index,item) {
|
|
|
|
|
|
if (this.productList.length > 3) {
|
|
|
|
|
|
this.tabLeft = (index - 1) * (this.isWidth + 6) //设置下划线位置
|
|
|
|
|
|
};
|
|
|
|
|
|
this.tabClick = index; //设置导航点击了哪一个
|
|
|
|
|
|
this.iSlong = true;
|
|
|
|
|
|
this.sid = item.id;
|
|
|
|
|
|
this.page = 1;
|
|
|
|
|
|
this.loadend = false;
|
|
|
|
|
|
this.tempArr = [];
|
|
|
|
|
|
this.productslist();
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
}
|
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
<style lang="scss">
|
|
|
|
|
|
page{
|
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
|
}
|
|
|
|
|
|
::-webkit-scrollbar {
|
|
|
|
|
|
width: 0;
|
|
|
|
|
|
height: 0;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
display: none;
|
|
|
|
|
|
}
|
|
|
|
|
|
.goodCate {
|
|
|
|
|
|
background-color: $crmeb-bg-color;
|
|
|
|
|
|
.mask {
|
|
|
|
|
|
// z-index: 99;
|
|
|
|
|
|
}
|
|
|
|
|
|
/deep/.attrProduct{
|
|
|
|
|
|
.mask {
|
|
|
|
|
|
z-index: 100;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.header {
|
|
|
|
|
|
position: fixed;
|
|
|
|
|
|
height: 128rpx;
|
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
left: 0;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
z-index: 99;
|
|
|
|
|
|
border-bottom: 1px solid #F0F0F0;
|
|
|
|
|
|
.pageIndex{
|
|
|
|
|
|
width: 68rpx;
|
|
|
|
|
|
height: 68rpx;
|
|
|
|
|
|
border-radius: 50%;
|
|
|
|
|
|
@include main_bg_color(theme);
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
line-height: 68rpx;
|
|
|
|
|
|
.iconfont{
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.search {
|
|
|
|
|
|
width: 600rpx;
|
|
|
|
|
|
/* #ifdef MP || APP-PLUS */
|
|
|
|
|
|
width: 550rpx;
|
|
|
|
|
|
/* #endif */
|
|
|
|
|
|
height: 68rpx;
|
|
|
|
|
|
border-radius: 36rpx;
|
|
|
|
|
|
background-color: #F8F8F8;
|
|
|
|
|
|
font-size: 26rpx;
|
|
|
|
|
|
color: #ADADAD;
|
|
|
|
|
|
margin-left: 22rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.iconfont {
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
margin: 4rpx 16rpx 0 0;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.conter {
|
|
|
|
|
|
padding-top: 64px;
|
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
|
|
|
|
|
|
|
.aside {
|
|
|
|
|
|
position: fixed;
|
|
|
|
|
|
width: 23%;
|
|
|
|
|
|
left: 0;
|
|
|
|
|
|
bottom: 0;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
background-color: $crmeb-bg-color-grey;
|
|
|
|
|
|
overflow-y: auto;
|
|
|
|
|
|
overflow-x: hidden;
|
|
|
|
|
|
margin-top: 128rpx;
|
|
|
|
|
|
z-index: 99;
|
|
|
|
|
|
padding-bottom: 140rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.item {
|
|
|
|
|
|
height: 100rpx;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
font-size: 26rpx;
|
|
|
|
|
|
color: $crmeb-font-color;
|
|
|
|
|
|
|
|
|
|
|
|
&.on {
|
|
|
|
|
|
background-color: $crmeb-bg-color;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
@include main_color(theme);
|
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
|
|
|
|
&::after {
|
|
|
|
|
|
content: "";
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
width: 6rpx;
|
|
|
|
|
|
height: 46rpx;
|
|
|
|
|
|
@include main_bg_color(theme);
|
|
|
|
|
|
border-radius: 0 4rpx 4rpx 0;
|
|
|
|
|
|
left: 0
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.wrapper {
|
|
|
|
|
|
margin-top: 104rpx;
|
|
|
|
|
|
width: 77%;
|
|
|
|
|
|
float: right;
|
|
|
|
|
|
background-color: $crmeb-bg-color;
|
|
|
|
|
|
padding-bottom: 130rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
.hide_slide{
|
|
|
|
|
|
margin-top: 104rpx;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
float: right;
|
|
|
|
|
|
background-color: $crmeb-bg-color;
|
|
|
|
|
|
padding-bottom: 130rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
.bgcolor {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
background-color: $crmeb-bg-color;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.goodsList {
|
|
|
|
|
|
margin-top: 0 !important;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.longTab {
|
|
|
|
|
|
width: 65%;
|
|
|
|
|
|
position: fixed;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
margin-top: 128rpx;
|
|
|
|
|
|
height: 100rpx;
|
|
|
|
|
|
z-index: 99;
|
|
|
|
|
|
background-color: $crmeb-bg-color;
|
|
|
|
|
|
}
|
|
|
|
|
|
.hongTab{
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
position: fixed;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
margin-top: 128rpx;
|
|
|
|
|
|
height: 100rpx;
|
|
|
|
|
|
z-index: 99;
|
|
|
|
|
|
background-color: $crmeb-bg-color;
|
|
|
|
|
|
}
|
|
|
|
|
|
.longItem {
|
|
|
|
|
|
height: 44rpx;
|
|
|
|
|
|
display: inline-block;
|
|
|
|
|
|
line-height: 44rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
font-size: 26rpx;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
|
color: $crmeb-font-color;
|
|
|
|
|
|
background-color: $crmeb-bg-color-grey;
|
|
|
|
|
|
border-radius: 22rpx;
|
|
|
|
|
|
margin-left: 12rpx;
|
|
|
|
|
|
|
|
|
|
|
|
&.click {
|
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
|
@include cate-two-btn(theme);
|
|
|
|
|
|
@include main_color(theme);
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.underlineBox {
|
|
|
|
|
|
height: 3px;
|
|
|
|
|
|
width: 20%;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-content: center;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
transition: .5s;
|
|
|
|
|
|
|
|
|
|
|
|
.underline {
|
|
|
|
|
|
width: 33rpx;
|
|
|
|
|
|
height: 4rpx;
|
|
|
|
|
|
background-color: $crmeb-bg-color;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.openList {
|
|
|
|
|
|
width: 12%;
|
|
|
|
|
|
height: 100rpx;
|
|
|
|
|
|
background-color: $crmeb-bg-color;
|
|
|
|
|
|
line-height: 100rpx;
|
|
|
|
|
|
padding-left: 30rpx;
|
|
|
|
|
|
position: fixed;
|
|
|
|
|
|
right: 0;
|
|
|
|
|
|
top: 128rpx;
|
|
|
|
|
|
z-index: 99;
|
|
|
|
|
|
|
|
|
|
|
|
.iconfont {
|
|
|
|
|
|
font-size: 22rpx;
|
|
|
|
|
|
color: $crmeb-font-color-subtitle;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.downTab {
|
|
|
|
|
|
width: 77%;
|
|
|
|
|
|
position: fixed;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
margin-top: 128rpx;
|
|
|
|
|
|
z-index: 99;
|
|
|
|
|
|
background-color: $crmeb-bg-color;
|
|
|
|
|
|
right: 0;
|
|
|
|
|
|
}
|
|
|
|
|
|
.hownTab{
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
position: fixed;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
margin-top: 128rpx;
|
|
|
|
|
|
z-index: 99;
|
|
|
|
|
|
background-color: $crmeb-bg-color;
|
|
|
|
|
|
right: 0;
|
|
|
|
|
|
}
|
|
|
|
|
|
.title {
|
|
|
|
|
|
font-size: 26rpx;
|
|
|
|
|
|
color: $crmeb-font-color-assist;
|
|
|
|
|
|
// padding-left: 20rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.closeList {
|
|
|
|
|
|
width: 90rpx;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
line-height: 100rpx;
|
|
|
|
|
|
padding-left: 30rpx;
|
|
|
|
|
|
transform: rotate(180deg);
|
|
|
|
|
|
|
|
|
|
|
|
.iconfont {
|
|
|
|
|
|
font-size: 22rpx;
|
|
|
|
|
|
color: $crmeb-font-color-subtitle;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.children {
|
|
|
|
|
|
max-height: 500rpx;
|
|
|
|
|
|
overflow-x: hidden;
|
|
|
|
|
|
overflow-y: auto;
|
|
|
|
|
|
padding-bottom: 20rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.item {
|
|
|
|
|
|
height: 60rpx;
|
|
|
|
|
|
background-color: $crmeb-bg-color-grey;
|
|
|
|
|
|
border-radius: 30rpx;
|
|
|
|
|
|
line-height: 60rpx;
|
|
|
|
|
|
padding: 0 15rpx;
|
|
|
|
|
|
margin: 0 0 20rpx 20rpx;
|
|
|
|
|
|
width: 165rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
|
|
|
|
|
|
&.click {
|
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
|
@include cate-two-btn(theme);
|
|
|
|
|
|
@include main_color(theme);
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.list_prod{
|
|
|
|
|
|
padding: 0 30rpx;
|
|
|
|
|
|
.item{
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
|
margin-bottom: 20rpx;
|
|
|
|
|
|
.pic{
|
|
|
|
|
|
width: 690rpx;
|
|
|
|
|
|
height: 284rpx;
|
|
|
|
|
|
margin: auto;
|
|
|
|
|
|
border-radius: 16rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
image{
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
border-radius: 16rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.pictxt{
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
.text{
|
|
|
|
|
|
font-size:30rpx;
|
|
|
|
|
|
font-family:PingFang SC;
|
|
|
|
|
|
font-weight:bold;
|
|
|
|
|
|
color: #282828;
|
|
|
|
|
|
margin: 20rpx 0;
|
|
|
|
|
|
}
|
|
|
|
|
|
.bottom{
|
|
|
|
|
|
.money{
|
|
|
|
|
|
font-size: 42rpx;
|
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
|
margin-right: 18rpx;
|
|
|
|
|
|
@include price_color(theme);
|
|
|
|
|
|
.sign{
|
|
|
|
|
|
font-size: 26rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
.item_sales{
|
|
|
|
|
|
font-size: 24rpx;
|
|
|
|
|
|
font-family: PingFang SC;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
padding-left: 17rpx;
|
|
|
|
|
|
color: #8e8e8e;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.cart{
|
|
|
|
|
|
height: 56rpx;
|
|
|
|
|
|
.pictrue{
|
|
|
|
|
|
color: #E93323;
|
|
|
|
|
|
font-size:46rpx;
|
|
|
|
|
|
width: 50rpx;
|
|
|
|
|
|
height: 50rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
line-height: 50rpx;
|
|
|
|
|
|
&.icon-jiahao{
|
|
|
|
|
|
background:linear-gradient(140deg, #FA6514 0%, #E93323 100%);
|
|
|
|
|
|
-webkit-background-clip:text;
|
|
|
|
|
|
-webkit-text-fill-color:transparent;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.num{
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
color: #282828;
|
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
|
width: 80rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.bnt{
|
|
|
|
|
|
padding: 0 30rpx;
|
|
|
|
|
|
height: 56rpx;
|
|
|
|
|
|
line-height: 56rpx;
|
|
|
|
|
|
@include main_bg_color(theme);
|
|
|
|
|
|
border-radius:42rpx;
|
|
|
|
|
|
font-size: 26rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
.num{
|
|
|
|
|
|
@include main_color(theme);
|
|
|
|
|
|
@include coupons_border_color(theme);
|
|
|
|
|
|
background: #fff;
|
|
|
|
|
|
min-width: 12rpx;
|
|
|
|
|
|
border-radius: 15px;
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
right: -14rpx;
|
|
|
|
|
|
top: -15rpx;
|
|
|
|
|
|
font-size: 22rpx;
|
|
|
|
|
|
padding: 0 10rpx;
|
|
|
|
|
|
height: 34rpx;
|
|
|
|
|
|
line-height: 34rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.end{
|
|
|
|
|
|
padding: 0 30rpx;
|
|
|
|
|
|
height: 56rpx;
|
|
|
|
|
|
line-height: 56rpx;
|
|
|
|
|
|
border-radius:42rpx;
|
|
|
|
|
|
font-size: 26rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
background:rgba(203,203,203,1);
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.footer {
|
|
|
|
|
|
position: fixed;
|
|
|
|
|
|
left: 0;
|
|
|
|
|
|
bottom:env(safe-area-inset-bottom);
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
|
box-shadow: 0px -3rpx 16rpx rgba(36, 12, 12, 0.05);
|
|
|
|
|
|
z-index: 101;
|
|
|
|
|
|
padding: 0 30rpx;
|
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
|
height: 100rpx;
|
|
|
|
|
|
&:after{
|
|
|
|
|
|
content:'';
|
|
|
|
|
|
height:env(safe-area-inset-bottom); // 这里是重点
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top:100%;
|
|
|
|
|
|
left: 0;
|
|
|
|
|
|
right:0;
|
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.cartIcon {
|
|
|
|
|
|
width: 96rpx;
|
|
|
|
|
|
height: 96rpx;
|
|
|
|
|
|
@include main_bg_color(theme);
|
|
|
|
|
|
border-radius: 50%;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
margin-top: -36rpx;
|
|
|
|
|
|
|
|
|
|
|
|
&.noCart {
|
|
|
|
|
|
background: #CBCBCB !important;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
image {
|
|
|
|
|
|
width: 49rpx;
|
|
|
|
|
|
height: 46rpx;
|
|
|
|
|
|
display: block;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.num {
|
|
|
|
|
|
min-width: 12rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
border-radius: 15px;
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
right: -6rpx;
|
|
|
|
|
|
top: -10rpx;
|
|
|
|
|
|
font-size: 22rpx;
|
|
|
|
|
|
padding: 0 10rpx;
|
|
|
|
|
|
height: 34rpx;
|
|
|
|
|
|
line-height: 34rpx;
|
|
|
|
|
|
@include main_color(theme);
|
|
|
|
|
|
@include coupons_border_color(theme);
|
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.money {
|
|
|
|
|
|
@include price_color(theme);
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
|
|
|
|
|
|
|
.num {
|
|
|
|
|
|
font-size: 42rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.bnt {
|
|
|
|
|
|
width: 222rpx;
|
|
|
|
|
|
height: 76rpx;
|
|
|
|
|
|
border-radius: 46rpx;
|
|
|
|
|
|
line-height: 76rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
margin-left: 24rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
.main_bg{
|
|
|
|
|
|
@include main_bg_color(theme);
|
|
|
|
|
|
}
|
|
|
|
|
|
.gray_bg{
|
|
|
|
|
|
background-color: #B3B3B4;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
</style>
|
