diancan_uni/pages/goods/index.vue

<template>
    <view>
        <!-- index.wxml -->
        <view class="wrap">
            <!-- 门店 -->
            <view class="store_wrap">
                <view class="store_l" v-if="store">
                    <view class="logo_wrap">
                        <image class="logo" mode="heightFix" :src="imgUrl + store.thumb"></image>
                    </view>
                    <view class="store_t_info">
                        <view class="">
                            <view class="store_t_info_t">
                                <view class="name slh">{{ store.title }}</view>
                                <!-- <image class="icon_phone" src="/statics/img/icon_phone.png" bind:tap="onMakePhone"></image> -->
                            </view>
                            <view class="desc">距离您{{ store.distance }}km</view>
                            <!-- <view class="desc">营业时间：{{ store.begin_at+'~'+ store.end_at }}</view> -->
                        </view>
                        <!-- <image class="icon_phone" src="/statics/img/icon_phone.png" bind:tap="onMakePhone"></image> -->
                    </view>
                </view>
                <view class="store_r" v-if="store">
                    <view :class="fare_type != 1 ? 'wenzi active' : 'wenzi'" @tap="changeFareType" data-type="0">外卖</view>
                    <view :class="fare_type == 1 ? 'wenzi active' : 'wenzi'" @tap="changeFareType" data-type="1">自取</view>
                </view>
            </view>
            <!-- 商品 -->
            <view class="goods_wrap">
                <scroll-view :scroll-y="true" :style="'height:' + scrollH + 'px'" :scroll-into-view="toViewYiji">
                    <view class="goods_wrap_l">
                        <view
                            :class="item.id == activeCateId ? 'cate_item active' : 'cate_item'"
                            :id="'yijicate' + item.id"
                            :data-item="item"
                            @tap="selectClassesClick"
                            v-for="(item, index) in good_cate"
                            :key="item.idx"
                        >
                            {{ item.name }}
                        </view>
                    </view>
                </scroll-view>
                <view class="">
                    <!-- wx:if="{{ showErjiCate }}" -->
                    <view class="erji_cate">
                        <view v-if="currentCate.children && currentCate.children.length != 0">
                            <scroll-view :scroll-x="true" :scroll-into-view="toViewErji" style="white-space: nowrap; width: 570rpx">
                                <text
                                    :class="activeErjiId == item.id ? 'cate_item active' : 'cate_item'"
                                    :id="'erjiCate' + item.id"
                                    @tap="onErjiCate"
                                    :data-item="item"
                                    v-for="(item, index) in currentCate.children"
                                    :key="item.idx"
                                >
                                    {{ item.name }}
                                </text>
                            </scroll-view>
                        </view>
                        <view style="padding-left: 15rpx" v-else>{{ currentCate.name }}</view>
                    </view>
                    <!-- toViewErji toView -->
                    <scroll-view :scroll-y="true" :style="'height:' + scrollH + 'px'" :scroll-into-view="toView" scroll-with-animation @scroll="scrollProductList">
                        <view class="goods_wrap_r">
                            <view class="goods_list_w" :id="'yiji' + goods.good_cate_id" v-for="(goods, index) in good_list" :key="goods.idx">
                                <view class="cate_name">{{ goods.name }}</view>

                                <view>
                                    <!-- 有二级 -->
                                    <view v-if="goods.children">
                                        <view class="goods_list" :id="'erji' + goods.good_cate_id" v-for="(goods, index1) in goods.children" :key="goods.idx">
                                            <view class="goods_item_w" :id="item.id" v-for="(item, index2) in goods.goodList" :key="item.idx">
                                                <view class="goods_item">
                                                    <image class="goods_tu" :src="imgUrl + item.thumb" @tap="onGoodsSpec" :data-item="item"></image>
                                                    <view class="goods_info">
                                                        <view class="goods_title slh_s" @tap="onGoodsSpec" :data-item="item">{{ item.title }}</view>
                                                        <view class="goods_desc slh" @tap="onGoodsSpec" :data-item="item">{{ item.describe ? item.describe : '' }}</view>
                                                        <view class="goods_specs">
                                                            <view class="price">
                                                                <view>
                                                                    <text class="unit">¥</text>
                                                                    {{ item.price }}
                                                                </view>
                                                                <view class="vip">会员价{{ '¥' + item.low_member_price }}</view>
                                                            </view>
                                                            <view class="topNum_w" v-if="item.status == 1">
                                                                <view class="btn_specs" v-if="item.good_specs && item.good_specs.length != 0" @tap="onGoodsSpec" :data-item="item">
                                                                    <text class="">选规格</text>
                                                                    <view class="topNum" v-if="item.good_specs && item.good_specs.length != 0 && item.cartNums">
                                                                        {{ item.cartNums }}
                                                                    </view>
                                                                </view>
                                                                <van-stepper
                                                                    v-else
                                                                    :value="item.nums"
                                                                    input-width="40rpx"
                                                                    min="0"
                                                                    disable-input
                                                                    custom-class="stepper"
                                                                    plus-class="plus"
                                                                    minus-class="minus"
                                                                    input-class="step_input"
                                                                    @change="onChangeSpecNum($event, { item })"
                                                                    :data-item="item"
                                                                />
                                                            </view>
                                                            <view class="topNum_w" v-if="item.status != 1">已售罄</view>
                                                        </view>
                                                    </view>
                                                </view>

                                                <view class="use_coupon" v-if="item.is_use_coupon != 1">特殊商品不参与任何活动</view>
                                            </view>
                                        </view>
                                    </view>
                                    <!-- 无二级 -->
                                    <view v-else :id="'erji' + goods.good_cate_id">
                                        <view class="goods_list">
                                            <view class="goods_item_w" :id="item.id" v-for="(item, index1) in goods.goodList" :key="item.idx">
                                                <view class="goods_item">
                                                    <image class="goods_tu" :src="imgUrl + item.thumb" @tap="onGoodsSpec" :data-item="item"></image>
                                                    <view class="goods_info">
                                                        <view class="goods_title slh_s" @tap="onGoodsSpec" :data-item="item">{{ item.title }}</view>
                                                        <view class="goods_desc slh" @tap="onGoodsSpec" :data-item="item">{{ item.describe ? item.describe : '' }}</view>
                                                        <view class="goods_specs">
                                                            <view class="price">
                                                                <view>
                                                                    <text class="unit">¥</text>
                                                                    {{ item.price }}
                                                                </view>
                                                                <view class="vip">会员价{{ '¥' + item.low_member_price }}</view>
                                                            </view>
                                                            <view class="topNum_w" v-if="item.status == 1">
                                                                <view class="btn_specs" v-if="item.good_specs && item.good_specs.length != 0" @tap="onGoodsSpec" :data-item="item">
                                                                    <text class="">选规格</text>
                                                                    <view class="topNum" v-if="item.good_specs && item.good_specs.length != 0 && item.cartNums">
                                                                        {{ item.cartNums }}
                                                                    </view>
                                                                </view>
                                                                <van-stepper
                                                                    v-else
                                                                    :value="item.nums"
                                                                    input-width="40rpx"
                                                                    min="0"
                                                                    disable-input
                                                                    custom-class="stepper"
                                                                    plus-class="plus"
                                                                    minus-class="minus"
                                                                    input-class="step_input"
                                                                    @change="onChangeSpecNum($event, { item })"
                                                                    :data-item="item"
                                                                />
                                                            </view>
                                                            <view class="topNum_w" v-if="item.status != 1">已售罄</view>
                                                        </view>
                                                    </view>
                                                </view>

                                                <view class="use_coupon" v-if="item.is_use_coupon != 1">特殊商品不参与任何活动</view>
                                            </view>
                                        </view>
                                    </view>
                                </view>
                            </view>
                        </view>
                    </scroll-view>
                </view>
            </view>
            <!-- 合计 -->
            <!-- style="background-image:url({{ hejiBg }})" -->
            <view class="heji_wrap">
                <view class="heji_l">
                    <view class="cart_w" @tap="goShopCart">
                        <image class="cart_tu" src="/static/statics/img/shopcar_tu.png"></image>
                        <view class="goods_num" v-if="totalNums">{{ totalNums }}</view>
                    </view>
                    <view class="total_price">
                        <text>
                            <text class="unit">¥</text>
                            {{ totalPrice }}
                        </text>
                        <!-- <text class="vip" wx:if="{{ totalMemberPrice }}"><text class="unit">{{ '会员¥'+totalMemberPrice }}</text></text> -->
                    </view>
                </view>
                <view class="heji_btn" @tap="toPay">选好了</view>
            </view>
        </view>
        <!-- 规格 -->
		<uni-popup ref="goodsSpec" >
			<view class="guige_wrap" v-if="showGoodsSpec">
			    <view class="guige">
			        <view class="goods_thumb_wrap" style="">
			            <!-- aspectFit center widthFix -->
			            <image class="goods_thumb" mode="widthFix" :src="imgUrl + currentGoods.thumb"></image>
			        </view>
			        <view class="goods_name">
			            <view class="goods_name_l">{{ currentGoods.title }}</view>
			        </view>
			        <view class="goods_desc" v-if="currentGoods.describe">
			            <view class="goods_desc_nr">{{ currentGoods.describe }}</view>
			        </view>
			        <view class="goods_guige" v-if="currentGoods.good_specs.length != 0">
			            <view class="goods_guige_name">规格</view>
			            <view class="goods_guige_nr">
			                <view
			                    :class="good_specs.is_checked ? 'guige_item selected' : 'guige_item'"
			                    @tap="onChangeSpecGoods"
			                    :data-specs="good_specs"
			                    :data-id="good_specs.id"
			                    v-for="(good_specs, index) in currentGoods.good_specs"
			                    :key="index"
			                >
			                    <view class="item_wenzi">
			                        <text>{{ good_specs.title }}</text>
			                    </view>
			
			                    <!-- <view class="price">
							<text>
								<text class="unit"></text>
								<text>{{ good_specs.price }}</text>
							</text>
							<text class="vip">会员价{{ '¥'+ good_specs.member_price}}</text>
						</view> -->
			                </view>
			            </view>
			        </view>
			        <view class="guige_b">
			            <view class="guige_b_l">
			                <text class="price">
			                    <text class="unit">¥</text>
			                    {{ checkedSpec.price }}
			                </text>
			                <text class="vip">会员价{{ '¥' + checkedSpec.member_price }}</text>
			            </view>
			            <!-- <view class="">
					<van-stepper value="{{ checkedSpec.nums }}" async-change input-width="40rpx" min="0" disable-input custom-class="stepper" plus-class="plus" minus-class="minus" input-class="step_input" data-item="{{ checkedSpec }}" bind:change="onChangeSpecNum" />
				</view> -->
			            <view class="" v-if="checkedSpec.status == 1">
			                <van-stepper
			                    :value="checkedSpecNums"
			                    async-change
			                    input-width="40rpx"
			                    min="0"
			                    disable-input
			                    custom-class="stepper"
			                    plus-class="plus"
			                    minus-class="minus"
			                    input-class="step_input"
			                    :data-item="checkedSpec"
			                    @change="onChangeSpecNum($event, { item: checkedSpec })"
			                />
			            </view>
			            <view class="" v-if="checkedSpec.status != 1">已售罄</view>
			        </view>
			    </view>
			    <van-icon name="close" class="btn_close" color="#ffffff" size="30px" @tap.native="closeGoodsSpec" />
			</view>
		</uni-popup>
        <!-- <van-overlay :z-index="5" class-style="background: rgba(0,0,0,.3);" :show="showGoodsSpec" @tap.native.stop.prevent="closeGoodsSpec"></van-overlay> -->
        <!-- style="top: {{  setBgHeight + 40 }}px" -->
        
        <!-- loading -->
        <!-- <van-overlay show="{{ loading }}" z-index="100">
	<van-loading custom-class="custom_loading" />
</van-overlay> -->
        <!-- 开启定位提示 -->
        <van-dialog
            class="custom_dialog"
            title="地理位置未授权"
            message="开启羊汤馆小程序定位授权后，可为您推荐就近门店"
            :show="showOpenLocation"
            confirm-button-text="授权定位"
            confirm-button-color="#D54C43"
            show-cancel-button
            @close="onCloseLocation"
            @confirm="onConfirmLocation"
        ></van-dialog>
        <!-- 所选门店不支持的提醒 -->
        <van-dialog :title="tipsTitle" :show="showTips" class="single_btn" confirm-button-color="#000000" confirmButtonText="我知道了" @confirm="closeShowTips"></van-dialog>
        <!-- 配送方式弹层 -->
        <!-- <van-overlay z-index="5" class-style="background: rgba(0,0,0,.3);" show="{{ showSelectFare }}">
	<view class="fare_w">
		<view class="title">请选择您的取货方式</view>
		<view class="type">
			<image class="type_bg" src="/statics/img/type_bg.png"></image>
			<view class="type_item waimai" bind:tap="changeFareType" data-type="0">外卖</view>
			<view class="type_item ziqu" bind:tap="changeFareType" data-type="1">自提</view>
		</view>
		<van-icon name="close" class="btn_close" color="#ffffff" size="30px" bind:tap="closeSelectFare" />
	</view>
</van-overlay> -->
        <!-- js -->
    </view>
</template>
<script module="we" lang="wxs">
/* 字符串长度截取 */
var strSlice = function(value) {
	if(value.length > 10){
		value = value.slice(0,6)+'...'
	};
	return value;
};
module.exports = {
	strSlice: strSlice
}
</script>
<script>
// index.js
import * as api from '@/service/api'
import * as util from '@/util/util.js'
import func from '@/util/wxUtil.js';

let clickScrollTimer;
export default {
    data() {
        return {
            customTop: getApp().globalData.customTop,
            setBgHeight: getApp().globalData.setBgHeight,

            // 导航条高度
            imgUrl: api.API_BASE_IMAGE,

            keywords: '',
            showGoodsSpec: false,

            // 规格弹层
            showShopCar: false,

            // 购物车弹层
            store: null,

            // 所在门店
            loading: false,

            // 全局loading
            fare_type: 1,

            // 0外卖 1自提   默认自提
            showOpenLocation: false,

            // 开启定位提醒
            good_list: null,

            cartList: null,

            // showSelectFare: false, // 配送方式弹层
            showTopCate: false,

            toViewErji: null,
            totalNums: 0,
            totalPrice: 0,
            totalMemberPrice: 0,
            activeErjiId: 0,
            checkedSpecNums: 0,
            isClickToScroll: false,

            // 通过点击滚动产品列表 true 滚动事件中不赋值，false 时赋值
            activeCateId: '',

            toViewErji: '',
            activeErjiId: '',
            toView: '',

            currentCate: {
                children: '',
                name: ''
            },

            showErjiCate: false,
            tableId: null,
            storeWrapH: '',
            scrollH: '',
            guigeH: '',
            toViewYiji: '',
            cartGoods: '',
            good_cate: '',

            currentGoods: {
                thumb: '',
                title: '',
                describe: '',
                good_specs: []
            },

            checkedSpec: {
                member_price: '',
                status: 0
            },

            checkedAddress: '',
            showTips: false,
            showSelectFare: false,

            goods: {
                good_cate_id: '',
                idx: '',
                name: '',
                children: '',
                goodList: []
            },

            good_specs: {
                is_checked: false,
                id: '',
                title: ''
            },

            tipsTitle: ''
        };
    },
    onLoad: function (options) {
        // Do some initialize when page load.
        let that = this;

        if (options.tableId) {
            that.setData({
                tableId: options.tableId
            });
        }
    },
    onShow: function () {
        // Do something when page show.
        let that = this;
        that.setData({
            showGoodsSpec: false,
            // 规格弹层
            showShopCar: false // 购物车弹层
        }); // 获取配送方式

        if (uni.getStorageSync('fare_type')) {
            that.setData({
                fare_type: uni.getStorageSync('fare_type')
            });
        } else {
            // 未获取到,需主动存一下,默认自提
            uni.setStorage({
                key: 'fare_type',
                data: '1'
            });
        } // 单店开是否开定位,都需要把商品调出来

        getApp().globalData.getLocal(function () {
            that.afterAuthLocation(); // 拒绝定位时,提醒去开启

            if (getApp().globalData.location_auth == -1) {
                console.log('拒绝定位');
                that.setData({
                    showOpenLocation: true
                });
            }
        });
    },
    onReady: function () {
        // Do something when page ready.
        let that = this; // 滚动区域高度计算

        uni.getSystemInfo({
            success: function (res) {
                let height = res.windowHeight; // console.log('总height',height)

                const query = uni.createSelectorQuery();
                query.select('.store_wrap').boundingClientRect();
                query.select('.heji_wrap').boundingClientRect(); // query.select('.erji_cate').boundingClientRect();

                query.exec((res) => {
                    // 分别取出节点的高度
                    let storeWrapH = res[0].height; // 门店选择的高度 px

                    let hejiWrapH = res[1].height; // 底部合计的高度 px
                    // let erjiCateH = res[2].height; // 顶部分类固定宽
                    // let scrollH = height - storeWrapH - hejiWrapH - erjiCateH;

                    let scrollH = height - storeWrapH - hejiWrapH;
                    that.setData({
                        storeWrapH: storeWrapH,
                        scrollH: scrollH,
                        guigeH: height * 0.5
                    }); // console.log('scrollH',scrollH)
                    // console.log('门店高度',that.data.storeWrapH);
                });
            }
        });
    },
    onHide: function () {
        // Do something when page hide.
        // console.log('hide')
        let that = this; // return;
        // 主动模拟selectClassesClick

        clearTimeout(clickScrollTimer);
        let item = that.good_cate[0];
        that.setData({
            isClickToScroll: true,
            activeCateId: item.id,
            toView: 'erji' + (item.children && item.children.length != 0 ? item.children[0].id : item.id),
            //不能数字开头，所以开头加了productItem
            activeErjiId: item.children && item.children.length != 0 ? item.children[0].id : item.id,
            toViewYiji: 'yijicate' + item.id
        }); // console.log('toView',that.data.toView);
        // console.log('activeErjiId',that.data.activeErjiId);

        let good_cate = that.good_cate; // 循环当前分类

        for (let i in good_cate) {
            if (good_cate[i].id == item.id) {
                that.setData({
                    currentCate: good_cate[i]
                });
            }
        }
    },
    onUnload: function () {
        // Do something when page close.
    },
    onPullDownRefresh: function () {
        // Do something when pull down.
    },
    onReachBottom: function () {
        // Do something when page reach bottom.
    },
    onPageScroll: function () {
        // Do something when page scroll
    },
    onResize: function () {
        // Do something when page resize
    },
    methods: {
        // 获取购物车商品
        getCartsList() {
            let that = this;
			api.getCartsList({}).then(res => {
				// 在首页只体现普通商品
				let list = res.result.list;
				that.setData({
				    cartGoods: list,
				    totalNums: res.result.total_num,
				    totalPrice: res.result.money
				}); // 同步商品列表
				
				that.updateTotalGoods();
			})
        },

        // 店铺列表(只拿最近的)
        getStoreList(lat, lng) {
            let that = this;
            let data = {
                lat: lat ? lat : getApp().globalData.lat,
                lng: lng ? lng : getApp().globalData.lng,
                page: 1,
                size: 10
            };
			api.getStoreList(data).then(res => {
				let storeList = res.result; // 有门店
				
				if (storeList && storeList.length != 0) {
				    let currentStore = storeList[0];
				    that.setData({
				        store: currentStore
				    }); // 营业时间的判断
				    // that.checkBusinessTime();
				    // 存下门店
				
				    uni.setStorage({
				        key: 'store',
				        data: JSON.stringify(that.store)
				    }); // 获取店内商品
				
				    that.getGoodsList(function () {
				        // 登录状态
				        if (getApp().globalData.token) {
				            getApp().globalData.loadingCount = 0; // 主动关
				
				            that.getCartsList();
				        }
				    });
				} else {
				    uni.showToast({
				        title: '门店暂未营业',
				        icon: 'none'
				    });
				}
			})
        },

        // 拨打店铺电话
        onMakePhone() {
            let that = this;
            uni.makePhoneCall({
                phoneNumber: that.store.phone
            });
        },

        // 获取商品分类及商品
        getGoodsList(callback) {
            let that = this;
            let params = {
                store_id: that.store.id
            };
			api.getGoodsList(params).then(res => {
				console.log(res)
			    let list = res.result.good; // 回调
			    
			    if (callback) {
			        callback();
			    }
			    
			    that.setData({
			        good_cate: res.result.good_cate,
			        good_list: list,
			        activeCateId: res.result.good_cate[0].id,
			        //默认左侧第一个选中
			        currentCate: res.result.good_cate[0],
			        // 当前分类(结构为一级分类+二级分类)
			        toView: 'erji' + res.result.good_cate[0].id
			    }); // console.log('左侧第一个分类',that.data.activeCateId);
			    // console.log('右侧第一个内容',that.data.toView);
			    // 一级节点
			    //  不知道干什么用的
			    // that.good_list.forEach((item) => {
			    //     // 添加节点的布局位置的查询请求
			    //     uni.createSelectorQuery()
			    //         .select('#yiji' + item.good_cate_id)
			    //         .boundingClientRect((rect) => {
							// console.log('rect:',rect)
			    //             item.offsetTop = rect.top;
			    //             item.height = rect.height; // console.log('rect',rect)
			    //             // console.log('item',item);
			    //         })
			    //         .exec(); // 二级节点
			    
			    //     if (item.children) {
			    //         item.children.forEach((erjiItem) => {
			    //             uni.createSelectorQuery()
			    //                 .select('#erji' + erjiItem.good_cate_id)
			    //                 .boundingClientRect((rect) => {
			    //                     erjiItem.offsetTop = rect.top;
			    //                     erjiItem.height = rect.height; // console.log('rect',rect)
			    //                     // console.log('item',item);
			    //                 })
			    //                 .exec();
			    //         });
			    //     }
			    // }); // console.log('商品列表带节点',that.data.good_list);
			})
        },

        // 左侧菜单栏切换事件
        selectClassesClick: function (e) {
            let that = this; // return;

            console.log('e===', e);
            clearTimeout(clickScrollTimer);
            let item = e.currentTarget.dataset.item;
            that.setData({
                isClickToScroll: true,
                activeCateId: item.id,
                toView: 'erji' + (item.children && item.children.length != 0 ? item.children[0].id : item.id),
                //不能数字开头，所以开头加了productItem
                activeErjiId: item.children && item.children.length != 0 ? item.children[0].id : item.id,
                toViewYiji: 'yijicate' + item.id
            }); // console.log('toView',that.data.toView);
            // console.log('activeErjiId',that.data.activeErjiId);

            let good_cate = that.good_cate; // 循环当前分类

            for (let i in good_cate) {
                if (good_cate[i].id == item.id) {
                    that.setData({
                        currentCate: good_cate[i]
                    });
                }
            } // console.log('当前fenlei',that.data.currentCate);
        },

        // 监听右边商品列表滑动
        scrollProductList(e) {
            let that = this;
            let good_cate = that.good_cate;
            let scrollTop = e.detail.scrollTop;

            if (scrollTop != 0) {
                that.setData({
                    showErjiCate: true
                });
            } // return;
            // console.log('isClickToScroll',that.data.isClickToScroll);
            // console.log('e.detail.scrollTop',scrollTop);

            if (!that.isClickToScroll) {
                that.good_list.forEach((item) => {
                    // console.log('item',item);
                    // console.log('item.offsetTop',item.offsetTop );
                    // console.log('item.height',item.height);
                    if (scrollTop >= item.offsetTop - that.storeWrapH && e.detail.scrollTop <= item.offsetTop - that.storeWrapH + item.height) {
                        that.setData({
                            activeCateId: item.good_cate_id,
                            toViewYiji: 'yijicate' + item.good_cate_id
                        }); // console.log('左侧分类1111',item.good_cate_id)

                        good_cate.forEach((cateItem) => {
                            if (cateItem.id == item.good_cate_id) {
                                that.setData({
                                    currentCate: cateItem
                                });
                            }
                        }); // console.log('当前分类',that.data.currentCate);

                        if (item.children) {
                            item.children.forEach((erjiItem) => {
                                if (scrollTop >= erjiItem.offsetTop - 180 && scrollTop <= erjiItem.offsetTop + erjiItem.height - 180) {
                                    that.setData({
                                        activeErjiId: erjiItem.good_cate_id,
                                        toViewErji: 'erjiCate' + erjiItem.good_cate_id
                                    });
                                }
                            });
                        }

                        return;
                    }
                });
            } else {
                clickScrollTimer = setTimeout(function () {
                    that.setData({
                        isClickToScroll: false
                    });
                }, 300);
            } // console.log('当前分类',that.data.currentCate)
            // console.log('左侧分类',that.data.activeCateId);
            // console.log('二级分类',that.data.activeErjiId);
            // console.log('右侧分类',that.data.toView);
        },

        // 点击某个二级菜单
        onErjiCate(event) {
            // console.log('二级event',event)
            let that = this;
            let good_cate = that.good_cate;
            let item = event.currentTarget.dataset.item; // console.log('item',item);
            // return;

            that.setData({
                toView: 'erji' + item.id,
                activeErjiId: item.id,
                activeCateId: item.parentid,
                toViewErji: 'erjiCate' + item.id
            }); // 循环当前分类
            // for(let i in good_cate){
            // 	if(good_cate[i].id == item.parentid){
            // 		that.setData({
            // 			currentCate: good_cate[i]
            // 		})
            // 	}
            // }
            // console.log('toView',that.data.toView);
            // console.log('当前的一级分类',that.data.currentCate)
        },

        // 查看规格
        onGoodsSpec(event) {
            let that = this;
            let item = event.currentTarget.dataset.item;

            if (item.status != 1) {
                // 如果商品售罄
                uni.showToast({
                    title: '此商品已售罄',
                    icon: 'none'
                });
                return;
            }

            let checkedSpec = null; // 有规格

            if (item.good_specs && item.good_specs.length != 0) {
                let specsArr = item.good_specs;

                for (let i in specsArr) {
                    if (i == 0) {
                        specsArr[i].is_checked = true; // 规格默认选中第一项

                        checkedSpec = specsArr[i];
                    } else {
                        specsArr[i].is_checked = false;
                    }
                }
            } else {
                // 无规格
                item['member_price'] = item.base_member_price;
                checkedSpec = item;
            } // console.log('当前商品',item);
            // console.log('当前选中规格',checkedSpec);

            that.setData({
                showGoodsSpec: true,
                currentGoods: item,
                // 当前商品
                checkedSpec: checkedSpec,
                // 当前选中规格
                checkedSpecNums: checkedSpec.nums ? checkedSpec.nums : 0
            });
			this.$refs.goodsSpec.open()
			
        },

        // 更改商品规格弹层的商品数量
        onChangeSpecNum(event, _dataset) {
            /* ---处理dataset begin--- */
            this.datasetHandle(event, _dataset);
            /* ---处理dataset end--- */
            let that = this;
            let nums = event.detail;
            that.setData({
                checkedSpecNums: nums
            }); // 更新购物车

            let oldCartGoods = that.cartGoods;
            let item = event.currentTarget.dataset.item; // console.log('item',item);
            // console.log('购物车',oldCartGoods);

            if (that.isAddCart(item)) {
                console.log('在'); // 在购物车
                // return;

                let params = {}; // 有规格id

                if (item.good_id) {
                    for (let i in oldCartGoods) {
                        if (oldCartGoods[i].good_id == item.good_id && oldCartGoods[i].good_specs_id == item.id) {
                            params.id = oldCartGoods[i].id; // 购物车ID

                            break;
                        }
                    }
                } else {
                    // 无规格id
                    for (let i in oldCartGoods) {
                        if (oldCartGoods[i].good_id == item.id && !oldCartGoods[i].good_specs_id) {
                            params.id = oldCartGoods[i].id; // 购物车ID

                            break;
                        }
                    }
                }

                if (nums != 0) {
                    params.nums = nums; // 修改数量
					api.editnum(params).then(res => {
						console.log(res)
						that.getCartsList();
					})
                } else {
                    // 删除
					api.removeCarts(params).then(res => {
						console.log(res)
						that.getCartsList();
					})
                }
            } else {
                console.log('不在'); // return;

                let params = {
                    good_id: item.good_id ? item.good_id : item.id,
                    nums: nums,
                    is_add: 0 // 是否为活动加购商品(1是 0否)
                }; // 有规格id(加一个无规格的看看)

                if (item.good_id) {
                    params.good_specs_id = item.id;
                } // 添加购物车
				api.createCarts(params).then(res => {
					that.getCartsList();
				})
            }
        },

        // 切换规格
        onChangeSpecGoods(event) {
            let that = this; // console.log('event====',event);

            let currentSpecs = event.currentTarget.dataset.specs;
            let oldCartGoods = that.cartGoods;
            let checkedSpec = null;
            let checkedSpecNums = 0; // 同步选中状态

            let currentGoods = that.currentGoods;
            let specsArr = currentGoods.good_specs;

            for (let j in specsArr) {
                if (specsArr[j].id == currentSpecs.id) {
                    specsArr[j].is_checked = true;

                    if (that.isAddCart(specsArr[j])) {
                        // 同步购物车
                        for (let i in oldCartGoods) {
                            if (oldCartGoods[i].good_id == currentSpecs.good_id && oldCartGoods[i].good_specs_id == currentSpecs.id) {
                                specsArr[j].nums = oldCartGoods[i].nums;
                                checkedSpecNums = oldCartGoods[i].nums; // console.log('进来了==')

                                break;
                            }
                        }
                    } else {
                        specsArr[j].nums = 0;
                        checkedSpecNums = 0;
                    }

                    checkedSpec = specsArr[j]; // break;
                } else {
                    specsArr[j].is_checked = false;
                }
            }

            that.setData({
                currentGoods: currentGoods,
                checkedSpec: checkedSpec,
                checkedSpecNums: checkedSpecNums
            }); // console.log('全规格',specsArr);
            // console.log('当前规格',checkedSpec);
        },

        // 关闭规格
        closeGoodsSpec() {
            let that = this;
            that.setData({
                showGoodsSpec: false
            });
        },

        // 计算价格和数量
        computedGoods() {
            let that = this;
            let list = that.cartGoods;
            let totalNums = 0;
            let totalPrice = 0;
            let totalMemberPrice = 0;

            for (let i in list) {
                if (list[i].nums != 0) {
                    totalNums += parseInt(list[i].nums);
                    totalPrice += parseFloat(list[i].total_prices);
                    totalMemberPrice += parseFloat(list[i].total_member_prices);
                }
            }

            that.setData({
                totalNums: totalNums,
                totalPrice: totalPrice,
                totalMemberPrice: totalMemberPrice
            }); // 同步商品列表
            // that.updateTotalGoods();
        },

        // 去结算
        toPay() {
            let that = this; // 未开启 不允许进入下一步

            if (getApp().globalData.location_auth == -1) {
                uni.showToast({
                    title: '地理位置未授权,请您授权定位后重试',
                    icon: 'none'
                });
                return;
            } // 验证登录

            getApp().globalData.verifyLogin(function (loginStatus) {
                // console.log('登录状态',loginStatus)
                if (loginStatus) {
                    if (!that.totalNums) {
                        uni.showToast({
                            title: '请先选择商品',
                            icon: 'none'
                        });
                        return;
                    } // 验证是否能下单,如果不能给提示并进购物车(因为可能是购物车有商品,但未勾选)

                    let params = {
                        token: getApp().globalData.token
                    };
					api.createList(params).then(res => {
						if (res.data.code != 200) {
						    uni.showToast({
						        title: res.data.msg,
						        icon: 'none',
						        duration: 3000
						    });
						    setTimeout(function () {
						        uni.navigateTo({
						            url: '/pages/shopcart/index'
						        });
						    }, 1000);
						} else {
						    uni.navigateTo({
						        url: '/pages/create-order/index'
						    });
						}
					})
                }
            });
        },

        // 取消授权提醒
        onCloseLocation() {
            let that = this;
            that.setData({
                showOpenLocation: false
            });
        },

        // 同意去打开地理位置
        onConfirmLocation() {
            // console.log('触发====');
            let that = this;
            uni.openSetting({
                success: function (res) {
                    console.log(res);
                    let authSetting = res.authSetting;

                    if (authSetting['scope.userLocation']) {
                        // 开启
                        getApp().globalData.getLocal(function () {
                            that.afterAuthLocation();
                        });
                    }
                }
            });
        },

        // 允许定位后的操作(或 拒绝定位,但选了默认店铺)
        afterAuthLocation(lat, lng) {
            let that = this; // 外卖流程,需要验证是否登录

            if (that.fare_type == 0) {
                getApp().globalData.verifyLogin(function (loginstatus) {
                    if (loginstatus) {
                        console.log('登录状态', loginstatus);

                        try {
                            uni.getStorage({
                                key: 'checkedAddress',
                                success: function (res) {
                                    // console.log('res.data',res.data);
                                    let checkedAddress = JSON.parse(res.data);
                                    that.setData({
                                        checkedAddress: checkedAddress
                                    }); // 按地址算

                                    that.getStoreList(that.checkedAddress.lat, that.checkedAddress.lnt);
                                },
                                fail: function () {
                                    uni.showToast({
                                        title: '请先选择收货地址',
                                        icon: 'none'
                                    });
                                    setTimeout(function () {
                                        uni.navigateTo({
                                            url: '/pages/user/address/list/index'
                                        });
                                    }, 1000);
                                }
                            });
                        } catch (err) {
                            console.log('报错信息', err);
                        }
                    }
                });
            } else {
                that.getStoreList();
            }

            console.log('定位成功');
        },

        // 切换配送方式
        changeFareType(event) {
            // console.log(event);
            let that = this;
            let fare_type = event.currentTarget.dataset.type; // 0外卖 1自提

            let store = that.store; // 判断门店是否支持此配送方式

            if (fare_type == 0 && store.is_delivery != 1) {
                uni.showToast({
                    title: '门店暂不支持外卖',
                    icon: 'none'
                });
                return;
            }

            if (fare_type == 1 && store.is_ziti != 1) {
                uni.showToast({
                    title: '门店暂不支持自提',
                    icon: 'none'
                });
                return;
            } // 支持

            // if(that.data.showSelectFare){
            // 	that.setData({
            // 		showSelectFare: false
            // 	})
            // };
            // 切换时实现: 自取选门店，外卖选地址
            // 为每次选外卖时重选地址,清掉checkedAddress

            uni.removeStorageSync('checkedAddress'); // 更新

            that.setData({
                fare_type: fare_type
            });
            uni.setStorage({
                key: 'fare_type',
                data: that.fare_type
            }); // 切到外卖

            if (fare_type == 0) {
                // 选地址
                uni.navigateTo({
                    url: '/pages/user/address/list/index'
                });
            }
        },

        // 关闭提醒
        closeShowTips() {
            let that = this;
            that.setData({
                showTips: false
            });
        },

        // 关闭选配送方式(用不到了)
        closeSelectFare() {
            let that = this;
            that.setData({
                showSelectFare: false
            });
        },

        // 计算每个商品的总数量
        updateTotalGoods() {
            let that = this;
            let oldCartGoods = that.cartGoods; // console.log('购物车',oldCartGoods);

            let list = that.good_list;
            list.forEach((item) => {
                if (item.children) {
                    // 有二级
                    let erjiGoods = item.children;
                    erjiGoods.forEach((erjiItem) => {
                        let goodsList = erjiItem.goodList;
                        goodsList.forEach((goods) => {
                            goods.cartNums = 0;
                            oldCartGoods.forEach((oldGoods) => {
                                if (!oldGoods.is_add) {
                                    // 有规格
                                    if (goods.good_specs && goods.good_specs.length != 0) {
                                        let specsArr = goods.good_specs;
                                        specsArr.forEach((goodsSpec) => {
                                            if (oldGoods.good_id == goodsSpec.good_id && oldGoods.good_specs_id == goodsSpec.id) {
                                                goodsSpec.nums = oldGoods.nums;
                                                goods.cartNums += oldGoods.nums;
                                            }
                                        });
                                    } else {
                                        // 无规格
                                        if (oldGoods.good_id == goods.id) {
                                            goods.nums = oldGoods.nums;
                                        }
                                    }
                                }
                            });
                        });
                    });
                } else {
                    // 无二级
                    let goodsList = item.goodList;
                    goodsList.forEach((goods) => {
                        goods.cartNums = 0;
                        oldCartGoods.forEach((oldGoods) => {
                            if (!oldGoods.is_add) {
                                // 有规格
                                if (goods.good_specs && goods.good_specs.length != 0) {
                                    let specsArr = goods.good_specs;
                                    specsArr.forEach((goodsSpec) => {
                                        if (oldGoods.good_id == goodsSpec.good_id && oldGoods.good_specs_id == goodsSpec.id) {
                                            goodsSpec.nums = oldGoods.nums;
                                            goods.cartNums += oldGoods.nums;
                                        }
                                    });
                                } else {
                                    // 无规格
                                    if (oldGoods.good_id == goods.id) {
                                        goods.nums = oldGoods.nums;
                                    }
                                }
                            }
                        });
                    });
                }
            });
            that.setData({
                good_list: list
            }); // console.log('重组商品',list);
        },

        // 核实商品是否存在于购物车
        isAddCart(item) {
            let that = this;
            let oldCartGoods = that.cartGoods;
            let is_have = false; // console.log('购物车',oldCartGoods);
            // console.log('操作商品',item);
            // 检测购物车是否有此商品

            for (let i in oldCartGoods) {
                if (item.good_id) {
                    // 有规格
                    console.log(item.id, oldCartGoods[i].good_specs_id);

                    if (item.id == oldCartGoods[i].good_specs_id && !oldCartGoods[i].is_add) {
                        is_have = true;
                        break;
                    }
                } else {
                    if (item.id == oldCartGoods[i].good_id && !oldCartGoods[i].is_add) {
                        is_have = true;
                        break;
                    }
                }
            }

            return is_have;
        },

        // 进入购物车页面
        goShopCart() {
            let that = this;
            uni.navigateTo({
                url: '/pages/shopcart/index'
            });
        },

        // 营业时间判断(弃用  改成多段时间了, 前端判断没意义了)
        checkBusinessTime() {
            let that = this;
            let store = that.store; // console.log('store',that.data.store,store.status);

            if (store.status != 1) {
                uni.showToast({
                    title: '门店暂未营业',
                    icon: 'none',
                    duration: 3000
                });
                return;
            }

            let currentTime = new Date();
            let year = currentTime.getFullYear();
            let month = currentTime.getMonth() + 1;
            let day = currentTime.getDate();
            let endDay = currentTime.getDate();

            if (store.end_at.split(':')[0] < store.begin_at.split(':')[0]) {
                endDay = endDay + 1;
            }

            let storeBeginAt = new Date(year + '/' + month + '/' + day + ' ' + store.begin_at);
            let storeEndAt = new Date(year + '/' + month + '/' + endDay + ' ' + store.end_at);

            if (storeBeginAt.getTime() > currentTime.getTime() || storeEndAt.getTime() < currentTime.getTime()) {
                uni.showToast({
                    title: '门店暂未营业',
                    icon: 'none',
                    duration: 3000
                });
            }
        }
    }
};
</script>
<style>
/**index.wxss**/
.wrap {
    height: 100vh;
}
.store_wrap {
    width: 750rpx;
    height: 150rpx;
    padding: 0 30rpx;
    border-bottom: 1rpx solid rgba(0, 0, 0, 0.15);
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.store_wrap .store_l {
    display: flex;
    align-items: center;
}
.store_wrap .store_l .logo_wrap {
    width: 98rpx;
    height: 98rpx;
    background: #f6f6f6;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.store_wrap .store_l .logo {
    /* width: 98rpx; */
    height: 70rpx;
}
.store_wrap .store_t_info {
    padding-left: 30rpx;
    display: flex;
    align-items: center;
}
.store_wrap .store_t_info_t {
    display: flex;
    align-items: center;
    /* justify-content: space-around; */
    width: 320rpx;
}
.store_wrap .store_t_info .name {
    /* width: 100%; */
    font-size: 30rpx;
    color: #080808;
    padding-right: 40rpx;
    flex: 1;
}
.store_wrap .icon_phone {
    width: 32rpx;
    height: 32rpx;
}
.store_wrap .store_t_info .desc {
    font-size: 26rpx;
    color: rgba(51, 51, 51, 0.54);
}
.store_wrap .store_r {
    width: 180rpx;
    height: 60rpx;
    background: #f6f6f6;
    border-radius: 30rpx;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
.store_wrap .store_r .wenzi {
    width: 90rpx;
    height: 50rpx;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26rpx;
    color: rgba(51, 51, 51, 0.54);
    background: #f6f6f6;
    border-radius: 30rpx;
}
.store_wrap .store_r .wenzi.active {
    background: #295c56;
    color: #ffffff;
}
.heji_wrap {
    width: 750rpx;
    height: 100rpx;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    position: fixed;
    bottom: 0;
    left: 0rpx;
    display: flex;
    align-items: center;
    justify-content: space-between;
    z-index: 3;
    background: #f8f8f8;
    box-shadow: 0rpx -5rpx 10rpx 0rpx rgba(161, 161, 161, 0.09);
}
.heji_wrap .heji_l {
    /* width: 470rpx; */
    display: flex;
    align-items: center;
    padding-left: 30rpx;
}
.heji_wrap .total_price {
    padding-left: 40rpx;
    font-size: 38rpx;
    color: #000000;
}
.heji_wrap .total_price .unit {
    font-size: 26rpx;
}
.heji_wrap .heji_r {
    /* flex: 1; */
    margin-left: 58rpx;
}
.heji_wrap .heji_btn {
    width: 198rpx;
    height: 100rpx;
    color: #ffffff;
    background: #295c56;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* 商品 */
.goods_wrap {
    width: 100%;
    display: flex;
}
.goods_wrap_l {
    width: 176rpx;
    background: #f6f6f6;
}
.goods_wrap_l .cate_item {
    padding-left: 30rpx;
    height: 98rpx;
    /* line-height: 98rpx; */
    font-size: 28rpx;
    color: rgba(8, 8, 8, 0.54);
    display: flex;
    align-items: center;
}
.goods_wrap_l .cate_item.active {
    background: #295c56;
    color: #ffffff;
    border-radius: 0 10rpx 10rpx 0;
}
.goods_wrap_r {
    width: 574rpx;
    flex: 1;
    padding: 30rpx 30rpx 30rpx 15rpx;
    padding-top: 0;
}
.goods_wrap_r .goods_ad {
    width: 544rpx;
    height: 265rpx;
    border-radius: 5rpx;
}
.goods_list_w .cate_name {
    font-size: 28rpx;
    color: rgba(8, 8, 8, 0.54);
    padding-top: 26rpx;
}
/* 步进器 */
.stepper .step_input {
    /* height: 24rpx; */
    height: 42rpx;
    line-height: 24rpx;
    padding-top: 0;
    font-size: 26rpx;
    color: rgba(0, 0, 0, 1);
    background: none;
}
.stepper .plus,
.stepper .minus {
    border-radius: 50%;
    overflow: hidden;
    vertical-align: bottom;
    width: 42rpx;
    height: 42rpx;
}
/* .stepper .plus{
	color: #333333;
    border: 1px solid #FFD102;
	background: #FFD102;
}
.stepper .minus{
	border: 1px solid #FFD102;
    color: rgba(0, 0, 0, 1);
    background: #fff;
} */
/* 规格 */
.guige_wrap {
    width: 670rpx;
    border-radius: 10rpx;
    margin: 0 auto;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 5;
}
.guige {
    width: 670rpx;
    padding-bottom: 38rpx;
    background: #ffffff;
}
.guige .goods_thumb_wrap {
    width: 670rpx;
    height: auto;
    position: relative;
}
.guige .goods_thumb_wrap .line {
    width: 670rpx;
    height: 30rpx;
    position: absolute;
    bottom: 0;
    left: 0;
    background-repeat: repeat-x;
    background-size: 18rpx 30rpx;
}
.guige .goods_thumb {
    width: 670rpx;
    /* width: 500rpx; */
    height: auto;
    display: block;
    margin: 0 auto;
}
.guige .goods_name {
    padding: 20rpx 30rpx 0;
    font-size: 30rpx;
    color: #080808;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.guige .goods_labels {
    padding: 0 30rpx;
    font-size: 24rpx;
    color: rgba(8, 8, 8, 0.54);
    display: flex;
    flex-wrap: wrap;
}
.guige .goods_labels .label {
    padding: 6rpx;
    background: #f6f6f6;
    margin: 10rpx 14rpx 0 0;
}
.guige .goods_desc {
    padding: 10rpx 30rpx 0;
}
.guige .goods_desc .goods_desc_name {
    font-size: 26rpx;
    color: rgba(51, 51, 51, 0.54);
}
.guige .goods_desc .goods_desc_nr {
    /* padding-top: 20rpx; */
    font-size: 24rpx;
    color: rgba(8, 8, 8, 0.54);
}
.guige .goods_guige {
    padding: 20rpx 30rpx 0;
}
.guige .goods_guige .goods_guige_name {
    font-size: 26rpx;
    color: rgba(51, 51, 51, 0.54);
}
.guige .goods_guige .goods_guige_nr {
    display: flex;
    flex-wrap: wrap;
}
.guige .guige_item {
    height: 59rpx;
    font-size: 24rpx;
    color: #333333;
    background: #ffffff;
    border: 1rpx solid rgba(0, 0, 0, 0.12);
    border-radius: 5rpx;
    display: flex;
    align-items: center;
    margin: 20rpx 20rpx 0 0;
}
.guige .guige_item:last-child {
    margin-right: 0;
}
.guige .guige_item .item_wenzi {
    display: flex;
}
.guige .guige_item .item_wenzi text {
    padding: 0 16rpx 0 12rpx;
    display: flex;
    align-items: center;
}
.guige .guige_item .item_wenzi text:not(:last-child)::after {
    content: '';
    display: block;
    width: 2rpx;
    height: 16rpx;
    background: rgba(0, 0, 0, 0.12);
    margin-left: 16rpx;
}
.guige .guige_item .price {
    padding: 0 18rpx;
    font-size: 28rpx;
    border-left: 1rpx solid rgba(0, 0, 0, 0.12);
}
.guige .guige_item .price .unit {
    font-size: 20rpx;
}
.guige .guige_item.selected {
    background: #fffbf0;
    border-color: #ed8c17;
    color: #ed8c17;
}
/* .guige .guige_item.selected .item_wenzi text:not(:last-child)::after{
	background: #D54C43;
} */
.guige .guige_item.selected .price {
    color: #ea4335;
    border-left-color: #ed8c17;
}
.guige .guige_selected {
    margin-top: 20rpx;
    height: 60rpx;
    background: #fafafa;
    border: 1rpx solid rgba(0, 0, 0, 0.05);
    border-left: 0 none;
    border-right: 0 none;
    padding: 0rpx 30rpx;
    display: flex;
    align-items: center;
    font-size: 26rpx;
    color: #000000;
}
.guige .guige_selected .label {
    color: rgba(0, 0, 0, 0.54);
}
.guige .guige_b {
    margin-top: 30rpx;
    padding: 0 30rpx;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.guige .guige_b .guige_b_l {
    font-size: 26rpx;
    color: #000000;
}
.guige .guige_b .price {
    font-size: 38rpx;
    color: #ea4335;
    padding-left: 10rpx;
}
.guige .guige_b .price .unit {
    font-size: 22rpx;
}
.guige .guige_b .item {
    font-size: 24rpx;
    color: rgba(0, 0, 0, 0.54);
}
.guige .guige_b .guige_b_r {
    width: 350rpx;
    height: 90rpx;
    background: #d54c43;
    border-radius: 45rpx;
    font-size: 34rpx;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
}
.guige_wrap .btn_close {
    width: 100%;
}
.guige_wrap .btn_close .van-icon {
    /* width: 56rpx;
	height: 56rpx; */
    display: block;
    margin: 36rpx auto;
}
/* 购物车 */
.shopcar_wrap {
    width: 750rpx;
    padding: 0 0 130rpx;
    border-radius: 20rpx 20rpx 0rpx 0rpx;
    background: #ffffff;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 2;
}
/* .shopcar_wrap::after{
	content: "";
	display: block;
	width: 0;
	height: 0;
	border: 16rpx solid transparent;
	border-bottom-color: #FFFFFF;
	position: absolute;
	top: -30rpx;
	left: 60rpx;
} */
.shopcar .shopcar_t {
    padding: 0 30rpx;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 25rpx;
    font-size: 26rpx;
    color: #080808;
}
.shopcar .shopcar_t .shopcar_t_r {
    display: flex;
    align-items: center;
    font-size: 24rpx;
    color: rgba(8, 8, 8, 0.54);
}
.shopcar .shopcar_t .icon_empty {
    width: 21rpx;
    height: 23rpx;
    margin-right: 6rpx;
}
.shopcar .goods_scroll {
    height: 560rpx;
}
.shopcar .goods_list {
    padding: 0 30rpx;
}
.shopcar .goods_list .goods_item .goods_tu {
    width: 138rpx;
    height: 138rpx;
}
.shopcar .goods_list .goods_item .goods_info {
    min-height: 160rpx;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
/* 购物车按钮 */
.cart_w {
    /* position: fixed;
	left: 40rpx;
	z-index: 4; */
    position: relative;
}
.cart_w .cart_tu {
    width: 120rpx;
    height: 122rpx;
    margin-top: -30rpx;
}
.cart_w .goods_num {
    min-width: 34rpx;
    height: 34rpx;
    border-radius: 50%;
    background: #ffd102;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: -28rpx;
    right: 16rpx;
    font-size: 24rpx;
    font-weight: bold;
    color: #000000;
}
/* 外卖 */
.store_wrap .store_l.takeout {
    display: block;
    width: 450rpx;
}
.store_wrap .takeout .user_address {
    display: flex;
    align-items: center;
    font-size: 30rpx;
}
.store_wrap .takeout .store_t_info {
    padding-left: 0;
    display: flex;
    align-items: center;
    font-size: 28rpx;
    color: rgba(51, 51, 51, 0.87);
}
.store_wrap .takeout .store_t_info .wenzi {
    color: rgba(51, 51, 51, 0.54);
    padding-right: 10rpx;
}
.store_wrap .takeout .store_t_info .name {
    padding-right: 4rpx;
}
.store_t_info .icon_change {
    width: 25rpx;
    height: 19rpx;
    margin-left: 10rpx;
}
/* 配送方式 */
.fare_w {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    color: #ffffff;
    font-size: 36rpx;
    text-align: center;
}
.fare_w .type {
    display: flex;
    position: relative;
    margin: 40rpx 0;
}
.fare_w .type .type_item {
    width: 257rpx;
    height: 210rpx;
    color: #333333;
    padding: 30rpx 0 0 30rpx;
    text-align: left;
}
.fare_w .type .type_item.waimai {
    position: absolute;
    top: 0;
    left: 0;
}
.fare_w .type .type_item.ziqu {
    position: absolute;
    top: 0;
    right: 0;
}
.fare_w .type_bg {
    width: 602rpx;
    height: 212rpx;
}
/* 二级分类 */
.erji_cate {
    display: flex;
    align-items: center;
    font-size: 28rpx;
    color: rgba(8, 8, 8, 0.54);
    /* position: fixed;
    top: 0; */
    background: #ffffff;
    z-index: 16;
    width: 100%;
    height: 80rpx;
}
.erji_cate .cate_item {
    padding: 4rpx;
    background: #f6f6f6;
    margin-left: 20rpx;
}
.erji_cate .cate_item.active {
    background: #295c56;
    color: #ffffff;
}
/* 会员价 */
.goods_list .goods_item .goods_specs .price .vip {
    /* position: relative;
    width: 57rpx; */
    /* height: 20rpx; */
    /* padding: 2rpx; */
    /* line-height: 20rpx; */
    /* background: #FFD102;
    color: #333333;
    font-size: 18rpx;
    text-align: center;
	display: inline-block;
	margin-left: 4rpx; */
    padding: 4rpx 10rpx;
    font-size: 20rpx;
    /* font-weight: bold; */
    background: #ffffff;
    border: 1px solid #f1a223;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #f1a223;
}
.guige .guige_b .guige_b_l .vip {
    padding-left: 8rpx;
}
/* .guige .guige_item .price .vip{
	font-size: 18rpx;
	padding-left: 4rpx;
}
.guige .guige_b .price .vip{
	font-size: 18rpx;
	padding-left: 4rpx;
}*/
.heji_wrap .total_price .vip {
    padding-left: 8rpx;
}
/* 规格加总数 */
.topNum_w {
    position: relative;
}
.topNum_w .topNum {
    position: absolute;
    top: -20rpx;
    right: -8rpx;
    min-width: 34rpx;
    height: 34rpx;
    background: #f1a223;
    font-size: 24rpx;
    color: #ffffff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* 未营业 */
.heji_wrap .heji_btn.un_open {
    background: rgba(0, 0, 0, 0.2);
}
/* 不参与活动的提示 */
.use_coupon {
    width: 100%;
    padding: 12rpx 14rpx;
    background: #f6f6f6;
    border-radius: 5rpx;
    font-size: 24rpx;
    color: rgba(8, 8, 8, 0.54);
}
</style>