<template>
	<view>
		<Nav />
		<!-- 顶部面板 -->
		<view class="top--panel" :class="{ grayscale: !isBusinessTime }">
			<template v-if="shopExtend">
				<image class="panelimgbackground"
					:src="shopExtend ? shopExtend.value : 'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/shopDetails/topBanner.png'"
					mode="aspectFill" v-if="!isJsonArrayString(shopExtend.value)"></image>
				<swiper class="panelimgbackground" autoplay indicator-dots circular v-else>
					<swiper-item class="panelimgbackground" v-for="(item, index) in JSON.parse(shopExtend.value)"
						:key="index">
						<image class="panelimgbackground" :src="item" mode="aspectFill"></image>
					</swiper-item>
				</swiper>
			</template>
			<template v-else>
				<image class="panelimgbackground"
					src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/shopDetails/topBanner.png" mode="aspectFill">
				</image>
			</template>
			<view class="panelone">
				<text>
					{{ shopInfo.shopName }}
				</text>
				<view class="paneltow">距离您{{ juli }}km</view>
				<!-- <up-icon name="arrow-right" color="#999999" size="14"></up-icon> -->
			</view>
			<view class="new-user-discount u-font-28" v-if="newUserDiscount&&newUserDiscount.amount">
				<text class="">新客立减¥</text>
				<text class="u-font-32">{{ newUserDiscount.amount }}</text>
				<!-- <text class="u-m-l-60">新客可随机减免金额</text> -->
			</view>
			<view class="panelthere flex-between">
				<view class="paneltheretext">
					营业时间：{{ (shopInfo.businessStartDay || '--') + ' 至 ' + (shopInfo.businessEndDay || '--') }}
					{{ endTimeref.startTime }} -
					{{ endTimeref.endTime < '05' ? ` 凌晨${endTimeref.endTime}` : endTimeref.endTime }}
				</view>
				<view class="flex-start" @click="callChildMethod">
					<view style="margin-right: 14rpx">查看</view>
					<up-icon name="arrow-down" color="#999999" size="14"></up-icon>
				</view>
			</view>
			<!-- 本店招牌菜 -->
			<view class="panelfour" v-if="shopProductList.hots && shopProductList.hots.length > 0">本店招牌菜</view>
			<view class="panelfive">
				<scroll-view :scroll-x="true" :scroll-with-animation="false">
					<view class="panelfive_list">
						<view class="panelfiveitem" @click="clickspecifications(item, index, index, '热销')"
							v-for="(item, index) in shopProductList.hots" :key="index">


							<view class="relative">
								<image @click.stop="getProductImgs(item)" class="panelfiveitemimage"
									:src="item.coverImg" mode="aspectFill"></image>
								<view class="limitDiscount" v-if="showLimitDiscount(item)">
									限时折扣{{ limitDiscountCountdown }}</view>
								<!-- <view class="limitDiscount" v-if="item.is_time_discount">
									限时折扣{{ limitDiscountCountdown }}</view> -->
								<view class="stock_warning" v-if="showStockNumber(item)&& !showNoBuy(item)">
									仅剩{{returnStockNumber(item)}}份</view>
							</view>

							<view class="vifgoodsImg flex-center" v-if="showNoBuy(item)">
								<image v-if="item.isSale == 0" src="@/static/ztt/icon_goods_yxj.svg"
									style="width: 200rpx; height: 100%" mode=""></image>
								<image v-else-if="item.isSaleTime == 0 && !item.isSaleTimeshow"
									src="@/static/ztt/icon_goods_wks.svg" style="width: 200rpx; height: 100%" mode="">
								</image>
								<image v-else-if="item.isSoldStock == 1" src="@/static/ztt/icon_goods_sq.svg"
									style="width: 200rpx; height: 100%" mode=""></image>
								<image v-else src="@/static/ztt/icon_goods_kcbz.svg" style="width: 200rpx; height: 100%"
									mode="">
								</image>
							</view>
							<view class="u-flex u-m-t-32 u-row-between">
								<view class="panelfiveitemone">
									{{ item.name }}
								</view>
								<text class="top-tag">招牌</text>
							</view>

							<view class="panelfiveitemtow">本店回头客第{{ index + 1 }}名</view>
							<view class="panelfiveitemthere flex-between">
								<view class="describe" v-if="item.suitNum > 1 && item.type != 'sku'"
									style="font-size: 20rpx; margin-top: 10rpx">
									「{{ item.suitNum }}{{ item.unitName }}起点」
								</view>
							</view>

							<!-- <view class="panelfiveitemfour">
								{{item.shortTitle?item.shortTitle:''}}
							</view>
							<view class="panelfiveitemfive">
								月售{{item.stockNumber}}
							</view> -->
							<view v-if="item.isSoldStock == 1 || (item.isSaleTime == 0 && !item.isSaleTimeshow)"
								class="flex-between" style="margin-top: 32rpx; margin-bottom: 48rpx">
								<view class="panelfiveitemsex flex-between">
									<view class="panelfiveitemsex_oen">
										<text class="tips"
											:class="shopInfo.isVip == 0 || shopInfo.isMemberPrice == 0 ? 'lineThrough' : ''">¥</text>
										<!-- 会员价与价格 -->
										<text class="price">
											{{ shopUserInfo.isVip == 1 && shopUserInfo.isMemberPrice == 1 ? item.memberPrice || item.salePrice : item.salePrice }}
										</text>
										<!-- 单位 -->
										<text class="unit" v-if="item.unitName">/{{ item.unitName }}</text>

										<text class="old-price">¥{{ item.salePrice }}</text>
									</view>
								</view>
								<view class="panelfiveitemNum">
									<view class="sku-wrap flex-center" style="background-color: #cecece">
										<text class="t" v-if="item.isSaleTime == 0 && !item.isSaleTimeshow">未开售</text>
										<text class="t" v-if="item.isSoldStock == 1">已售罄</text>
									</view>
								</view>
							</view>

							<view v-else class="flex-between"
								style="margin-top: 32rpx; margin-bottom: 48rpx; flex-wrap: inherit">
								<view class="panelfiveitemsex flex-between">
									<view class="panelfiveitemsex_oen">
										<text class="tips"
											:class="shopInfo.isVip == 0 || shopInfo.isMemberPrice == 0 ? 'lineThrough' : ''">¥</text>
										<!-- 会员价与价格 -->
										<view class="price">
											<GoodsPrice :limitDiscount="cartStore.limitTimeDiscount" :cart="item"
												:shopUserInfo="shopUserInfo" :key="item.id" :shopInfo="shopInfo">
											</GoodsPrice>
										</view>

										<text class="unit" v-if="item.unitName">/{{ item.unitName }}</text>
										<text class="old-price">¥{{ item.salePrice }}</text>
										<!-- <text v-if="item.suitNum>1 && item.type!= 'sku'"
											style="font-size: 16rpx;">「{{item.suitNum}}{{item.unitName}}起点」</text> -->
									</view>
								</view>
								<!-- single-单规格商品 sku-多规格商品 package-套餐商品 weight-称重商品 coupon-团购券 -->
								<view class="panelfiveitemNum">
									<!-- v-if="item.type == 'single'|| item.type == 'weight' || item.type == 'coupon' || (item.type == 'package' && item.groupType=='0')" -->
									<view class="sku-wrap flex-center"
										v-if="item.type == 'sku' || (item.type == 'package' && item.groupType == '1')"
										@click.stop="clickspecifications(item, index, index1)">
										<text class="t no-wrap" v-if="item.groupType == '1'">选择套餐</text>
										<text class="t" v-else>选规格</text>
										<!-- <text class="dot num"
											v-if="item.cartNumber > 0">{{ ifcartNumber(item) < 99 ? ifcartNumber(item) : '99+' }}</text> -->
										<text class="dot num"
											v-if="returnGoodsImCartNum(item)">{{ returnGoodsImCartNum(item) < 99 ? returnGoodsImCartNum(item) : '99+' }}</text>
									</view>
									<view class="Controls" v-else>
										<view class="btn" v-if="item.cartNumber != '0'">
											<up-icon name="minus-circle-fill" color="#E9AB7A" size="25"></up-icon>
											<view class="btnClick" @tap.stop="singleclick(item, '-')"></view>
											<!-- <view class="btnClick"
												@tap.stop="$u.throttle(() => singleclick(item, '-'), 500)"></view> -->
										</view>
										<!-- <text class="num">{{ ifcartNumber(item) }}</text> -->
										<text class="dot num"
											v-if="returnGoodsImCartNum(item)">{{ returnGoodsImCartNum(item) < 99 ? returnGoodsImCartNum(item) : '99+' }}</text>
										<view class="btn">
											<up-icon name="plus-circle-fill" color="#E9AB7A" size="25"></up-icon>
											<!-- <view class="btnClick"
												@tap.stop="$u.throttle(() => singleclick(item, '+'), 500)"></view> -->
											<view class="btnClick" @tap.stop="singleclick(item, '+')"></view>
										</view>
									</view>
								</view>
							</view>
						</view>
					</view>
				</scroll-view>
			</view>
		</view>

		<!-- 滚动区域 -->
		<view class="scroll-panel" id="scroll-panel" :class="{ grayscale: !isBusinessTime }">
			<view class="list-box">
				<view class="left" :style="{ top: `${store.height}px` }">
					<scroll-view :scroll-into-view="leftIntoView" :scroll-with-animation="false" :scroll-y="true"
						:style="{ height: `${store.screenHeight - store.height}px` }" style="padding-bottom: 200rpx">
						<view class="item" v-for="(item, index) in shopProductList.productInfo" :key="index"
							:class="{ active: index == leftIndex }" :id="'left-' + index" :data-index="index"
							@click="leftTap(index)">
							<text>{{ item.name }}</text>
						</view>
					</scroll-view>
				</view>
				<view class="main">
					<view class="u-p-r-32" v-if="carouselList.length">
						<up-swiper indicator indicatorMode="line" height="188rpx" :list="carouselList"
							keyName="imageUrl">
							<template #default="scope">
								<view class="relative">
									<image :src="scope.item.imageUrl" mode="aspectFill"
										style="width:600rpx;height: 188rpx;"></image>
									<view class="absolute swiper-mask" @click.stop="swiperClick(scope.item)">
										<view class="share-btn-box" v-if="showShare(scope.item)">
											<ymf-share @shareClick="shareBtnClick(scope.item)">
												<view class="share-btn">分享</view>
											</ymf-share>
										</view>

									</view>
								</view>

							</template>
						</up-swiper>
					</view>

					<view>
						<view class="item main-item" v-for="(item, index) in shopProductList.productInfo" :key="index"
							:id="'item-' + index">
							<view class="title">
								<view>{{ item.name }}</view>
							</view>
							<view class="goods" @click="clickspecifications(item1, index, index1)"
								v-for="(item1, index1) in item.productList" :key="item1.id">
								<view class="relative">
									<image class="goodsImg" @click.stop="getProductImgs(item1)"
										v-if="item1.coverImg != null" :lazy-load="true"
										:src="`${item1.coverImg}${!item1.imgLoad ? '?x-oss-process=image/resize,m_lfit,w_150,h_150' : ''}`"
										mode="aspectFill"></image>
									<image class="goodsImg"
										src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/1.gif" mode=""
										v-else :lazy-load="true"></image>
									<view class="limitDiscount" v-if="showLimitDiscount(item1)">
										限时折扣{{ limitDiscountCountdown }}</view>

									<!-- 	<view class="limitDiscount" v-if="item1.is_time_discount">
										限时折扣{{ limitDiscountCountdown }}</view> -->
									<view class="stock_warning" v-if="showStockNumber(item1)&&!showNoBuy(item1)">
										仅剩{{returnStockNumber(item1)}}份</view>
								</view>

								<view class="vifgoodsImg" v-if="showNoBuy(item1)">
									<image v-if="item1.isSale == 0" src="@/static/ztt/icon_goods_yxj.svg"
										style="width: 200rpx; height: 100%" mode=""></image>
									<image v-else-if="item1.isSaleTime == 0 && !item1.isSaleTimeshow"
										src="@/static/ztt/icon_goods_wks.svg" style="width: 200rpx; height: 100%"
										mode=""></image>
									<image v-else-if="item1.isSoldStock == 1" src="@/static/ztt/icon_goods_sq.svg"
										style="width: 200rpx; height: 100%" mode=""></image>
									<image v-else src="@/static/ztt/icon_goods_kcbz.svg"
										style="width: 200rpx; height: 100%" mode=""></image>
								</view>

								<view v-if="index == '0'" class="topSort" :class="'c' + (index1 + 1)">
									TOP{{ index1 + 1 }}</view>

								<view class="goods_right" style="overflow: hidden">
									<view class="name">{{ item1.name }}</view>
									<!-- <view class="lookBack" v-if="index=='0'">本店销量第{{index1+1}}名</view>-->
									<!-- <view class="lookBack" v-if="specifications.item.isHot == 1">热销</view> -->
									<view class="lookBack" v-if="returnIsHot(item1,item,index)">热销</view>
									<view class="describe">{{ item1.shortTitle ? item1.shortTitle : '' }}</view>

									<view class="describe" v-if="item1.suitNum > 1 && item1.type != 'sku'"
										style="font-size: 20rpx">
										「{{ item1.suitNum }}{{ item1.unitName }}起点」
									</view>
									<view
										v-if="item1.isSoldStock == 1 || (item1.isSaleTime == 0 && !item1.isSaleTimeshow)"
										class="flex-between">
										<view class="money">
											<view>￥</view>
											<text class="money_num" style="margin-right: 10rpx">
												{{ shopUserInfo.isVip == 1 && shopUserInfo.isMemberPrice == 1 ? item1.memberPrice || item1.salePrice : item1.salePrice }}
											</text>
											<text v-if="item1.unitName">/{{ item1.unitName }}</text>
										</view>
										<view class="flex-end">
											<view class="sku-wrap flex-center" style="background-color: #cecece">
												<text class="t"
													v-if="item1.isSaleTime == 0 && !item1.isSaleTimeshow">未开售</text>
												<text class="t" v-else-if="item1.isSoldStock == 1">已售罄</text>
											</view>
										</view>
									</view>
									<view v-else class="flex-between" style="flex-wrap: inherit">
										<view class="money">
											<view>￥</view>
											<view class="money_num">
												<GoodsPrice :limitDiscount="cartStore.limitTimeDiscount" :cart="item1"
													:shopUserInfo="shopUserInfo" :shopInfo="shopInfo"></GoodsPrice>
											</view>
											<text class="money_num" v-if="item1.unitName">/{{ item1.unitName }}</text>

											<text class="old-price"
												v-if="showLimitDiscount(item1)">￥{{ item1.salePrice }}</text>
											<!-- <text class="old-price"
													v-if="item1.is_time_discount">￥{{ item1.salePrice }}</text> -->
											<!-- <text v-if="item1.suitNum>1 && item1.type!= 'sku'"
												style="font-size: 14rpx;">
												「{{item1.suitNum}}{{item1.unitName}}起点」
											</text> -->
										</view>
										<view class="flex-end"
											v-if="item1.type == 'sku' || (item1.type == 'package' && item1.groupType == '1')">
											<view class="sku-wrap flex-center"
												@click.stop="clickspecifications(item1, index, index1)">
												<text class="t no-wrap" v-if="item1.groupType == '1'">选择套餐</text>
												<text class="t" v-else>选规格</text>
												<!-- <text class="dot num"
													v-if="item1.cartNumber > 0">{{ ifcartNumber(item1) < 99 ? ifcartNumber(item1) : '99+' }}</text> -->

												<text class="dot num"
													v-if="returnGoodsImCartNum(item1)">{{ returnGoodsImCartNum(item1) < 99 ? returnGoodsImCartNum(item1) : '99+' }}</text>
											</view>
										</view>
										<view class="Controls" v-else>
											<view class="btn" v-if="item1.cartNumber * 1 != '0'">
												<up-icon name="minus-circle-fill" color="#E9AB7A" size="25"></up-icon>
												<!-- <view class="btnClick"
													@tap.stop="$u.throttle(() => singleclick(item1, '-'), 500)"></view> -->
												<view class="btnClick" @tap.stop="singleclick(item1, '-')"></view>
											</view>

											<text class="num">{{ ifcartNumber(item1) }}</text>
											<view class="btn">
												<up-icon name="plus-circle-fill" color="#E9AB7A" size="25"></up-icon>
												<!-- <view class="btnClick"
													@tap.stop="$u.throttle(() => singleclick(item1, '+'), 500)"></view> -->
												<view class="btnClick" @tap.stop="singleclick(item1, '+')"></view>
											</view>
										</view>
									</view>
								</view>
							</view>
						</view>
						<view class="fill-last" :style="{ height: fillHeight + 'px' }"></view>
					</view>
				</view>
			</view>
		</view>

		<confirmorder ref="confirmorderref" :cartLists_count="cartLists_count" :cartList="matchedProducts"
			:totalPrices="totalPrices" :confirmordershow="confirmordershow"
			@close="confirmordershow = !confirmordershow" @customevent="websocketsendMessage" :orderinfo="orderinfo">
		</confirmorder>

		<!-- 店铺详情 -->
		<shopindex ref="showShopInfoRef"></shopindex>
		<!-- 购物车 -->
		<shoppingCartes :cartLists_count="cartLists_count" :cartList="matchedProducts" :showCart="showCart"
			:limitDiscount="cartStore.limitTimeDiscount" @customevent="websocketsendMessage"
			@close="showCart = !showCart" :orderinfo="orderinfo" @clickcancelOrder="clickcancelOrder"
			v-if="cartLists_count > 0" :nextFullAmountActivty="nextFullAmountActivty"></shoppingCartes>

		<!-- 显示购物车栏 -->
		<view class="cart-wrap" v-if="cartLists_count > 0 && !confirmordershow && isBusinessTime">
			<view class="cart-content">
				<view class="left">
					<view class="iconBox">
						<image class="icon"
							src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/shopDetails/shopIcon.png"
							mode="aspectFill" @click="Historicalorders(true)"></image>
						<text class="u-badge">{{ cartLists_count < 99 ? cartLists_count : '99+' }}</text>
					</view>

					<text class="i">￥</text>
					<text class="num">{{ actualPrice }}</text>

					<text class="allDiscountMoney" v-if="allDiscountMoney * 1 > 0">共减¥{{ allDiscountMoney }}</text>
				</view>
				<view class="btn" @tap="$u.debounce(orderdetail, 500)" v-if="orderType == 'scan'">
					<text class="t">去下单</text>
				</view>
				<view class="btn" v-else>
					<u-button type="primary" shape="circle" plain @click="beforehandHandle">扫码下单</u-button>
				</view>
			</view>
			<!-- 满减活动 -->
			<view class="fullAmount-activity" v-if="nextFullAmountActivty">
				<text>再买</text>
				<text class="price">
					¥{{
						BigNumber(nextFullAmountActivty.fullAmount)
							.minus(totalPrices * 1)
							.toFixed(2)
					}}
				</text>
				<text>，</text>
				<text>可再减</text>
				<text class="price">¥{{ nextFullAmountActivtyAgignDiscount }}</text>
			</view>
		</view>

		<!-- 规格 -->

		<view class="history_order" @click="toHistory"
			v-if="shopInfo && shopInfo.registerType == 'after' && orderinfo.id">
			<image class="img" src="@/static/history.png" mode=""></image>
			<text>已下单菜品</text>
		</view>
		<Loading :isLoading="!useSocket.isConnected" />
		<ModalList></ModalList>
		<recommendGoodsModal v-if="isDataLoaded" @onBuyClick="onBuyClick"></recommendGoodsModal>

		<view v-for="(item,index) in goodsModalList" :key="index">
			<goodsModal :key="index" v-model="item.show" :goods="item.goods" @prveImgs="prveImgs" :orderinfo="orderinfo"
			:cartNumber="returnGoodsImCartNum(item.goods)"
			:consStockList="consStockList"
				@shareClick="shareClick" @close="goodsModalClose(index)" @websocketsendMessage="websocketsendMessage"
				@modalAdd="modalAdd" :GoodsIDInCartNumMap="GoodsIDInCartNumMap"></goodsModal>
		</view>

		<xbSwiperPreview :visable="showPrveImg" :imgs="prveImgsList" @update:visable="updateShowPrveImg">
		</xbSwiperPreview>
		<!-- 显示选择人数popup -->
		<u-popup mode="bottom" :safe-area-inset-bottom="false" :show="showTableInfoPeopleNumPopup">
			<view class="select_num_wrap">
				<image class="top_bg" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/order/orderAMeal.png"
					mode="aspectFill"></image>
				<view class="sn-bnottom">
					<view class="sn-header">
						<text class="t1">请选择就餐人数</text>
						<text class="t2">桌号{{ shopTable.name }}</text>
					</view>
					<view class="sn-num-wrap">
						<view class="sn-num">
							<view class="item" :class="{ active: tableInfoPeopleActive == index }"
								v-for="(item, index) in 10" :key="item" @click="tableInfoPeopleNumHandle(item, index)">
								<text class="t">{{ item }}</text>
							</view>
						</view>
						<view class="input">
							<u-input v-model="tableInfoPeopleNum" :maxlength="2" placeholder="请输入自定义人数" clearable
								@change="tableInfoPeopleNumInput"></u-input>
						</view>
					</view>
					<view class="sn-footer-wrap">
						<view class="btn">
							<u-button plain shape="circle" size="large" @click="closeTableInfoPeopleNum">取消</u-button>
						</view>
						<view class="btn">
							<u-button type="primary" size="large" shape="circle"
								@click="tableInfoPeopleNumConfirm">确认</u-button>
						</view>
					</view>
				</view>
			</view>
		</u-popup>

		<ymf-share-popup></ymf-share-popup>
	</view>
</template>

<script setup>
	/**
	 * api合集 start
	 */
	import * as discountActivityApi from '@/common/api/market/discountActivity';
	import {
		consumeDiscount
	} from '@/common/api/market/index.js';
	import * as limitTimeDiscountapi from '@/common/api/market/limitTimeDiscount.js';
	import {
		APIshopUserInfo,
		APIusershopInfodetail
	} from "@/common/api/member.js";

	import {
		productminiApphotsquery,
		APIgroupquery,
		APIminiAppinfo,
		APIminiAppskuinfo,
		getConsStock,
		productRelated
	} from '@/common/api/product/product.js';

	import {
		APIhistoryOrder,
		APIcancelOrder,
		APIrmPlaceOrder
	} from '@/common/api/order/index.js';
	import {
		APIproductqueryShop
	} from '@/common/api/member.js';


	import {
		carousel
	} from '@/common/api/market/share.js'
	/**
	 * api合集 end
	 */

	/**
	 * 三方库 start
	 */
	import BigNumber from 'bignumber.js';
	//价格计算辅助函数
	import {
		limitUtils
	} from 'ysk-utils';

	import dayjs from 'dayjs';
	import isBetween from 'dayjs/plugin/isBetween';
	dayjs.extend(isBetween);
	/**
	 * 三方库 end
	 */

	/**
	 * 组件 start 
	 */

	import xbSwiperPreview from '@/components/xb-swiper-preview/index.vue';
	import GoodsPrice from '@/components/goods-price.vue';
	import ModalList from '@/components/modal-list.vue';
	import recommendGoodsModal from './components/recommend-goods-modal.vue';
	//导航栏
	import Nav from '@/components/CustomNavbar.vue';
	import shopindex from './components/shopindex.vue';
	import goodsModal from './components/goods-modal.vue';
	import shoppingCartes from './components/shoppingCartes.vue';
	import confirmorder from './components/confirmorder.vue';
	import Loading from '@/components/Loading.vue';
	/**
	 * 组件 end
	 */


	/**
	 * 项目代码辅助方法 start
	 */
	import {
		filterNumberInput,
		isJsonArrayString
	} from '@/utils/util.js';
	import {
		getDistance
	} from '@/utils/address.js';
	import {
		isObjectEqual,
		isArrayEqual
	} from './components/utils.js'
	/**
	 * 项目代码辅助方法 end
	 */


	/**
	 *  store本地存储 start
	 */

	import {
		useNavbarStore
	} from '@/stores/navbarStore';


	import {
		useWebSocket
	} from '@/stores/carts-websocket.js';
	// 结账管理
	import {
		Memberpay
	} from '@/stores/pay.js';
	import {
		productStore
	} from '@/stores/user.js';

	// 是否显示禁止购买
	function showNoBuy(item) {
		if (item.isSale == 0) {
			return true
		}
		if (item.isSaleTime == 0 && !item.isSaleTimeshow) {
			return true
		}
		if (item.isSoldStock == 1) {
			return true
		}
		if(item.type==="single"){
			const sku=item.skuList[0]
			if(!sku){
				return true
			}
			if(sku&&returnStockNumber(item)<sku.suitNum){
				return true
			}
		}
		if (returnStockNumber(item) <= 0) {
			return true
		}
		return false
	}

	const storeMemberpay = Memberpay();
	const store = useNavbarStore();
	// 动态更新导航栏配置
	store.updateNavbarConfig({
		showBack: true, //左边返回键
		rightText: '', //右边文字
		showSearch: false, //true是标题其他事文字
		title: '',
		isTransparent: false,
		hasPlaceholder: false //是否要占位符
	});
	const userStore = productStore();
	// 金额管理
	import {
		useCartStore
	} from '@/stores/order.js';
	import {
		computed,
		nextTick,
		provide,
		reactive
	} from 'vue';
	const cartStore = useCartStore();
	/**
	 *  store本地存储 end
	 */

	// 获取全局属性
	const {
		proxy
	} = getCurrentInstance();

	//点单智能推荐
	function onBuyClick(item) {
		let index = -1;
		let index1 = -1;
		if (!item.isHot) {
			if (item.type == 'sku' || (item.type == 'package' && item.groupType == '1')) {
				for (let i in shopProductList.productInfo) {
					const cate = shopProductList.productInfo[i];
					const goodsList = cate.productList;
					const index1 = goodsList.findIndex((goods) => goods.id == item.id);
					if (index1 > -1) {
						index = i;
						clickspecifications(item, index, index1);
						break;
					}
				}
			} else {
				uni.$u.throttle(() => singleclick(item, '+'), 500);
			}
		} else {
			if (item.type == 'sku' || (item.type == 'package' && item.groupType == '1')) {
				for (let i in shopProductList.hots) {
					const goods = shopProductList.hots[i];
					if (goods.id == item.id) {
						index = i;
						clickspecifications(item, index, index);
						break;
					}
				}
			} else {
				uni.$u.throttle(() => singleclick(item, '+'), 500);
			}
		}
	}


	/**
	 * 通用数据合集 start
	 */

	// 门店信息
	const shopInfo = reactive({});
	Object.assign(shopInfo, uni.cache.get('shopInfo'));
	// 台桌信息
	const shopTable = uni.cache.get('shopTable');
	//距离
	const distance = uni.cache.get('distance');

	//店铺详情
	const showShopInfoRef = ref(null);
	// 计算高度
	const navScroll = ref(null);

	// 初始加载中
	const isLoading = ref(true);



	const shopExtend = ref('');

	/**
	 * 通用数据合集 end
	 */


	/**
	 * 轮播功能 staart
	 */
	const swiperCurrent = ref(0);

	function swiperChange(e) {
		swiperCurrent.value = e.current;
	}
	/**
	 * 轮播功能 end
	 */


	//调用shop组件
	const callChildMethod = () => {
		if (showShopInfoRef.value) {
			showShopInfoRef.value.childMethod();
		}
	};







	// 购物车对应的商品数
	const GoodsIDInCartNumMap = computed(() => {
		const map = {}
		for (let cart of cartStore.carts) {
			if (map[cart.product_id]) {
				map[cart.product_id] += cart.number * 1
			} else {
				map[cart.product_id] = cart.number * 1
			}

		}
		return map
	})

	/**
	 * 返回购物车对应的商品数量
	 */
	function returnGoodsImCartNum(goods) {
		if (!goods) {
			return 0
		}
		if (GoodsIDInCartNumMap.value.hasOwnProperty(goods.id)) {
			return GoodsIDInCartNumMap.value[goods.id]
		}
		return 0
	}


	// 获取商品数据
	const shopProductList = reactive({
		hots: [],
		productInfo: []
	});



	// 计算左侧位置
	const leftIndex = ref(0);

	//元素最低端的距离
	const lastbottom = ref('');

	//储存元素的下标
	const topArr = ref([]);

	// 填充高度，用于最后一项低于滚动区域时使用
	const fillHeight = ref(200);

	//距离顶部的高度
	const scrollTopSize = ref(0);

	//左侧导航点击
	const leftTap = (index) => {
		console.log('topArr.value[index] ', topArr.value[index]);
		console.log('store.height', store.height);
		console.log('scrollTop', topArr.value[index] - store.height);
		uni.pageScrollTo({
			scrollTop: topArr.value[index] - store.height,
			duration: 0
		});
		leftIndex.value = index;
	};

	/* 计算左侧滚动位置定位 */
	const leftIntoView = computed(() => {
		return `left-${leftIndex.value ? leftIndex.value : 0}`;
	});

	/* 获取元素顶部信息 */
	const getElementTop = () => {
		console.log('getElementTop');
		new Promise((resolve, reject) => {
			let view = uni.createSelectorQuery().selectAll('.main-item');
			view.boundingClientRect(async (data) => {
				resolve(data);
			}).exec();
			proxy.$uGetRect('.scroll-panel').then((res) => {
				scrollTopSize.value = res.top; //元素距离顶部的距离
			});
		}).then((res) => {
			try {
				topArr.value = res.map((item) => {
					return item.top; /* 减去滚动容器距离顶部的距离 加导航栏高度*/
				});

				// 获取最后一个元素最低端的盒子到顶点的距离
				for (let i = 0; i <= topArr.value.length - 1; i++) {
					if (store.screenHeight - 200 >= topArr.value[topArr.value.length - 1] - topArr.value[i]) {
						// 获取距离最后一个index
						lastbottom.value = i;
						break;
					}
				}
				/* 获取最后一项的高度，设置填充高度。判断和填充时做了 +-20 的操作，是为了滚动时更好的定位 */
				let last = res[res.length - 1].height;
				if (last - 20 < store.screenHeight) {
					fillHeight.value = 200;
				}
			} catch (error) {
				//TODO handle the exception
			}
		});
	};

	// 定时器
	const mainThrottle = ref(null);

	/* 主区域滚动监听 */
	const mainScroll = (e) => {
		// 节流方法
		clearTimeout(mainThrottle.value);
		mainThrottle.value = setTimeout(() => {
			scrollFn();
		}, 10);
		let scrollFn = () => {
			let top = e.scrollTop;
			let index = 0;
			// 判断左边是否可以滑动

			for (let i = topArr.value.length - 1; i >= 0; i--) {
				/* 在部分安卓设备上，因手机逻辑分辨率与rpx单位计算不是整数，滚动距离与有误差，增加2px来完善该问题 */
				if (top + 2 >= topArr.value[i] - store.height) {
					index = i;
					break;
				}
			}
			/* 查找当前滚动距离 */
			if (index >= lastbottom.value) {
				//
				leftIndex.value = index > leftIndex.value ? index : leftIndex.value;
				// this.leftIndex = this.leftIndex
			} else {
				leftIndex.value = index < 0 ? 0 : index;
			}
		};
	};

	//动态导航栏滑动距离
	onPageScroll((res) => {
		uni.$u.debounce((store.scrollTop = res.scrollTop), 500);
		uni.$u.debounce((navScroll.value = res.scrollTop), 500);
		uni.$u.debounce(mainScroll(res), 500);
	});




	/*商品区域轮播图 start*/

	const shareSwiperItem = ref(null)

	function swiperClick(item) {
		console.log('swiperClick', item);
		shareSwiperItem.value = item
		const pTag = returnPageTags(item.jumpPagePath)

		if (pTag === 'pp-list') {
			return uni.navigateTo({
				url: item.jumpPagePath + '&shopId=' + uni.cache.get('shopId')
			})
		}
		if (pTag === 'pp-detail') {
			const url = item.jumpPagePath + '&shopId=' + uni.cache.get('shopId') + '&' + item.extendParam
			return uni.navigateTo({
				url: url.replace('goodsId', 'id')
			})
		}
		if (pTag === 'gb-list') {
			return uni.navigateTo({
				url: item.jumpPagePath + '&shopId=' + uni.cache.get('shopId')
			})
		}
		if (pTag === 'gb-detail') {
			const url = item.jumpPagePath + '&shopId=' + uni.cache.get('shopId') + '&' + item.extendParam
			return uni.navigateTo({
				url: url.replace('goodsId', 'wareId')
			})
		}
		if (pTag === 'dis') {
			return uni.navigateTo({
				url: item.jumpPagePath + '&shopId=' + uni.cache.get('shopId')
			})
		}
		if (pTag === 'index') {
			return uni.switchTab({
				url: item.jumpPagePath + '&shopId=' + uni.cache.get('shopId')
			})
		}

		if (pTag === 'eat') {
			if (item.extendParam) {
				const id = item.extendParam.split('=')[1]
				const item = allGoodsArr.value.find(v => v.id == id)
				if (item) {
					clickspecifications(item)
				}
			}
		}

		if (pTag === 'point') {
			return uni.navigateTo({
				url: item.jumpPagePath + '&shopId=' + uni.cache.get('shopId')
			})
		}
		if (pTag === 'point-detail') {
			const url = item.jumpPagePath + '&shopId=' + uni.cache.get('shopId') + '&' + item.extendParam
			return uni.navigateTo({
				url: url.replace('goodsId', 'id')
			})
		}
	}

	function showShare(item) {
		if (item.isShareable && item.isEnabled) {
			return true
		}
		return false
	}
	/*商品区域轮播图 end*/

	// 规格信息
	const specifications = reactive({
		item: {},
		index: '',
		inedxs: '',
		type: '',
		product_id: '',
		sku_id: '',
		groupSnap: {},
		item: {
			groupSnap: [],
			result: {
				isSoldStock: 0
			}
		}
	});
	// 用于判断接口数据是否加载完成
	const isDataLoaded = ref(false);

	// 存储用户当前选择的规格，初始为空对象
	const selectedSpecs = ref({});

	// 能否提交的状态
	const canSubmit = ref(false);

	//字形判断
	const skuBtnText = ref('添加到购物车');

	// 计算属性，判断是否所有规格类型都有选中项
	const allSpecsSelected = computed(() => {
		// 获取所有规格类型的键
		const specKeys = Object.keys(specifications.item.selectSpecInfo);
		// skuBtnText.value = selectedSpecsStr.value ? `您还没选择${specKeys[1]}哦` : ``
		// 检查每个规格类型是否都在 selectedSpecs 中有对应的选中值
		return specKeys.every((key) => selectedSpecs.value[key]);
	});

	function isSkuSelected(specType, option) {
		return selectedSpecs.value[specType] === option;
	}

	// 处理规格选择的方法
	const selectSpec = async (specType, option) => {
		// 规格清零
		shopCartNumber.value = 0;

		// 更新 selectedSpecs 对象，将当前规格类型的选中值设置为用户点击的选项
		const newSelectedSpecs = {};
		const specKeys = Object.keys(specifications.item.selectSpecInfo);
		for (const key of specKeys) {
			if (key === specType) {
				newSelectedSpecs[key] = option;
			} else {
				newSelectedSpecs[key] = selectedSpecs.value[key];
			}
		}
		selectedSpecs.value = newSelectedSpecs;
		if (allSpecsSelected.value) {
			// try {
			let result = await APIminiAppskuinfo({
				specInfo: selectedSpecsStr.value,
				id: specifications.item.id
			});
			// skuList
			if (result != true) {
				specifications.sku_id = result.id;
				specifications.product_id = result.productId;
				// 添加多规格分组
				specifications.item.result = result;
				if (result.isSoldStock == 0) {
					canSubmit.value = true;
				} else {
					canSubmit.value = false;
				}
			} else {
				specifications.item.result = 'kong';
				canSubmit.value = false;
			}
		} else {
			canSubmit.value = false;
		}
	};

	const shopUserInfo = ref(uni.cache.get('shopUserInfo'));

	// 监听 specifications 的变化
	watch(
		() => specifications.item.groupSnap,
		(newGroupSnap) => {
			if (Array.isArray(newGroupSnap)) {
				selectedOptions.value = newGroupSnap.map(() => []);
			}
		}
	);

	// 存储选中的选项，二维数组
	const selectedOptions = ref(specifications.item.groupSnap.map(() => []));

	// / 选择规格的方法
	const goodsidClick = (setmenuindex, option, goodsid) => {
		if (!selectedOptions.value[setmenuindex]) {
			// 如果 selectedOptions.value[setmenuindex] 不存在，初始化一个空数组
			selectedOptions.value[setmenuindex] = [];
		}
		if (isOptionSelected(setmenuindex, option)) {
			// 如果已经选中，取消选中
			selectedOptions.value[setmenuindex] = selectedOptions.value[setmenuindex].filter((item) => item.proId !==
				option.proId);
		} else if (!isMaxSelected(setmenuindex)) {
			// 如果未达到最大选择数量，添加到选中列表
			selectedOptions.value[setmenuindex].push(option);
		}
	};

	// 判断选项是否已选中
	const isOptionSelected = (setmenuindex, option) => {
		// 确保 selectedOptions.value[setmenuindex] 存在
		if (selectedOptions.value[setmenuindex]) {
			return selectedOptions.value[setmenuindex].some((item) => item.proId === option.proId);
		}
		return false;
	};

	// 判断是否达到最大选择数量
	const isMaxSelected = (setmenuindex) => {
		// 确保 selectedOptions.value[setmenuindex] 存在
		if (selectedOptions.value[setmenuindex]) {
			return selectedOptions.value[setmenuindex].length >= specifications.item.groupSnap[setmenuindex].number;
		}
		return false;
	};

	// 计算所有选中条件是否都符合
	const allConditionsSatisfied = computed(() => {
		// 检查 specifications.item.groupSnap 是否存在
		if (!specifications.item?.groupSnap) {
			return false;
		}
		return specifications.item.groupSnap.every((optionGroup, index) => {
			// 获取当前索引对应的已选选项，如果不存在则默认为空数组
			const selected = selectedOptions.value[index] || [];
			// 检查是否达到最大选择数量
			const hasEnoughSelection = selected.length === optionGroup.number;
			return hasEnoughSelection;
		});
	});

	// 提交选择，套餐选中最后处理的数据
	const selectedGroupSnap = ref([]);

	// 计算属性，将 selectedSpecs 转换为字符串形式
	const selectedSpecsStr = computed(() => {
		const values = Object.values(selectedSpecs.value);
		return values.join('，');
	});

	//添加购物车数量
	const shopCartNumber = ref(0);

	// 多规格 套餐 单规格添加数量
	const shopCart = async (i) => {
		if (i == '-' && shopCartNumber.value <= (specifications.item.suitNum || 1)) {
			shopCartNumber.value = 0;
			return false;
		}
		let res = await shoppingcart();
		// if (!isSkuGoods.value) {
		//   console.log("specifications.item", specifications.item);
		//   if (i == "-") {
		//     shopCartNumber.value--;
		//   } else {
		//     shopCartNumber.value++;
		//   }
		//   specifications.item.cartNumber = shopCartNumber.value;
		//   singleclick(specifications.item, i);
		//   return;
		// }
		if (specifications.item.result === 'kong') {
			//没有满足可添加或者编辑的规格
			return;
		}
		if (i == '-') {
			if (!res && shopCartNumber.value == specifications.item.suitNum) {
				uni.showToast({
					title: `起点${specifications.item.suitNum}个`,
					icon: 'none'
				});
				return false;
			} else {
				shopCartNumber.value--;
			}
		} else {
			if (!res && shopCartNumber.value < 1) {
				if (specifications.type == 'sku') {
					shopCartNumber.value = parseFloat(specifications.item.result.suitNum);
				} else {
					shopCartNumber.value = parseFloat(specifications.item.suitNum);
				}
			} else {
				shopCartNumber.value++;
			}
		}
	};

	//返回是否是热销商品
	function returnIsHot(item, category, index) {
		return item.isHot && category.name == '热销' && index == 0 && shopProductList.hots.find(v => v.id == item.id)
	}



	// 根据购物车的数据匹配选中的商品查找是否有匹配的数组
	const matchingProduct = async (data) => {
		return matchedProducts.value.find((product, index) => {
			if (specifications.type == 'package') {
				// 套餐
				let result = false;
				try {
					if (product.type == 'package') {
						let res = JSON.parse(product.cartListinfo.pro_group_info);
						result = isArrayEqual(res, selectedGroupSnap.value);
					}
				} catch (error) {
					//TODO handle the exception
				}
				// 直接返回布尔值
				return result;
			} else if (specifications.item.type == 'sku') {
				// 多规格
				return product.cartListinfo.sku_id == data.id && product.cartListinfo.product_id == data
					.productId;
			} else {
				// 其他
				return product.skuId == data.skuId && product.id == data.id;
			}
		});
	};

	// 判断多规格和套餐  商品是否在购物车有数据
	const shoppingcart = async () => {
		let res = null;
		if (specifications.item.type == 'package') {
			if (!allConditionsSatisfied.value) {
				return false;
			}
			// 是否是套餐package
			selectedGroupSnap.value = specifications.item.groupSnap.map((setmenu, index) => {
				return {
					...setmenu,
					goods: selectedOptions.value[index]
				};
			});
			res = await matchingProduct(selectedGroupSnap.value);
		} else if (specifications.item.type == 'sku') {
			if (!canSubmit.value) {
				return false;
			}
			res = await matchingProduct(specifications.item.result);
		} else {
			// 单规格
			res = await matchingProduct(specifications.item);
		}
		return res;
	};

	// 提交选择并执行下一步操作的方法
	const submitSelection = async () => {
		console.log('submitSelection', submitSelection)
		if (!isProductAvailable(specifications.productListitem.days, specifications.productListitem.startTime,
				specifications.productListitem.endTime)) {
			uni.showToast({
				title: '不在可售时间内'
			});
			return false;
		}
		// 判断购物车是否有该选中商品
		// 数量不能少于0
		if (shopCartNumber.value <= 0) {
			return;
		}
		let res = await shoppingcart();

		if ((specifications.item.type == 'package' && allConditionsSatisfied.value) || (specifications.item.type ==
				'sku' && canSubmit.value)) {
			// 是否是套餐 有就传
			if (specifications.item.type == 'package') {
				// 需求更改:所所有商品套餐都是add,没有修改
				res = null;
			} else {
				selectedGroupSnap.value = [];
			}
			console.log('specifications.item', specifications.item);
			const number = await calculateValue(res.cartNumber, '+', shopCartNumber.value)

			const oldGoodsArr = combineOrderInfoDetailMap(orderinfo.value)
			if (oldGoodsArr.find(v => v.productId == specifications.item.id)) {
				// 等待用户点击
				const isConfirm = await showConfirmModal(
					'该商品已下单过，请确认是否重复',
					'菜品名称：《' + specifications.item.name + '》'
				);
				if (!isConfirm) {
					return
				}
			} else {
				if (res && number * 1 === 2) {
					const isConfirm = await showConfirmModal(
						'购物车已有该商品，请确认是否重复',
						'菜品名称：《' + specifications.item.name + '》'
					);
					if (!isConfirm) {
						return
					}

				}
			}



			websocketsendMessage({
				id: res ? res.cartListId : '',
				type: 'shopping',
				suitNum: specifications.productListitem.suitNum,
				table_code: uni.cache.get('tableCode'),
				shop_id: uni.cache.get('shopId'),
				operate_type: res ? 'edit' : 'add',
				product_id: specifications.product_id,
				sku_id: specifications.sku_id,
				number: res ? number : shopCartNumber.value,
				pro_group_info: selectedGroupSnap.value,
				goods_type: specifications.item.type == 'package' ? 'package' : '',
				memberPrice: specifications.item.memberPrice,
				is_print: 1,
				product_type: specifications.item.type,
				is_time_discount: showLimitDiscount(specifications.item)
			});
			// 清空套餐选中
			selectedGroupSnap.value = [];
		} else {
			const number = await calculateValue(res.cartNumber, '+', shopCartNumber.value)
			const oldGoodsArr = combineOrderInfoDetailMap(orderinfo.value)
			if (oldGoodsArr.find(v => v.productId == specifications.item.id)) {
				// 等待用户点击
				const isConfirm = await showConfirmModal(
					'该商品已下单过，请确认是否重复',
					'菜品名称：《' + specifications.item.name + '》'
				);
				if (!isConfirm) {
					return
				}
			} else {
				if (res && number * 1 === 2) {
					const isConfirm = await showConfirmModal(
						'购物车已有该商品，请确认是否重复',
						'菜品名称：《' + specifications.item.name + '》'
					);
					if (!isConfirm) {
						return
					}
				}
			}


			websocketsendMessage({
				id: res ? res.cartListId : '',
				type: 'shopping',
				suitNum: specifications.productListitem.suitNum,
				table_code: uni.cache.get('tableCode'),
				shop_id: uni.cache.get('shopId'),
				operate_type: res ? 'edit' : 'add',
				product_id: specifications.product_id,
				sku_id: specifications.sku_id,
				number: res ? number : shopCartNumber.value,
				memberPrice: specifications.item.memberPrice,
				is_print: 1,
				product_type: specifications.item.type,
				is_time_discount: showLimitDiscount(specifications.item)
			});

			return;
		}
	};

	//返回是否是多规格商品
	function returnIsSkuGoods(item) {
		if (item.type == 'single' || item.type == 'weight' || (item.type == 'package' && item.groupType == '0')) {
			return false;
		}
		return true;
	}

	const isSkuGoods = computed(() => {
		return returnIsSkuGoods(specifications.item);
	});

	//预览图
	const showPrveImg = ref(false);
	const prveImgsList = ref([]);

	function updateShowPrveImg(e) {
		showPrveImg.value = e
	}

	function prveImgs(images) {
		prveImgsList.value = images;
		showPrveImg.value = true;
		return;
		uni.previewImage({
			urls: images,
			current: swiperCurrent.value
		});
	}

	async function getProductImgs(item) {
		console.log('getProductImgs', item)
		let res = await APIminiAppinfo(item.id);
		prveImgs(res.images);
	}

	const goodsModalList = ref([])

	function goodsModalClose(index) {
		goodsModalList.value.splice(index, 1)
	}

	function modalAdd(item) {
		clickspecifications(item)
	}

	//获取多规格数据
	const clickspecifications = async (item, index, indexs, type) => {
		console.log('clickspecifications', item);
		// 商品类型 single-单规格商品 sku-多规格商品 package-套餐商品 weight-称重商品 coupon-团购券
		// if (
		//   item.isSoldStock == 1 ||
		//   (item.isSaleTime == 0 && !item.isSaleTimeshow) ||
		//   item.type == "single" ||
		//   item.type == "weight" ||
		//   (item.type == "package" && item.groupType == "0")
		// ) {
		//   return false;
		// }

		if (item.isSoldStock == 1 || (item.isSaleTime == 0 && !item.isSaleTimeshow)) {
			return uni.showToast({
				title: '商品已下架或不在可售时间内',
				icon: 'none'
			});
		}

		shopCartNumber.value = 0;

		// 数量清零
		// 初始化
		let data = {
			item: item,
			productListitem: item,
			type: '',
			product_id: '',
			sku_id: ''
		};
		Object.assign(specifications, data);
		// 初始化 多规格选中
		selectedSpecs.value = {};
		canSubmit.value = false;
		// skuBtnText.value = '请选择规格'
		// single-单规格商品 sku-多规格商品 package-套餐商品 weight-称重商品 coupon-团购券
		let res = await APIminiAppinfo(item.id);

		console.log('res', res);
		console.log('item', item);
		specifications.item = {
			...res,
			...item,
			product_id: res.id,
			sku_id: item.skuId
		};
		if (specifications.item.type == 'package') {
			selectedOptions.value = [];
			specifications.product_id = res.id;
			specifications.sku_id = item.skuId;
			shopCartNumber.value = 1;
		} else {
			specifications.product_id = res.id || specifications.item.product_id;
			specifications.sku_id = item.skuId || specifications.item.sku_id;
		}
		// 购物车是否有商品
		specifications.type = res.type;
		specifications.item.selectSpecInfo = Object.fromEntries(Object.entries(specifications.item.selectSpecInfo)
			.filter(([_, value]) => value.length > 0));
		// 给默认数量
		specifications.item.amountcartNumber = 0;
		goodsModalList.value.push({
			show: true,
			goods: {
				...specifications.item,
				/*过滤掉只有一个规格且下架的商品或者skuList为空的商品*/
				relatedRecommendJson: (specifications.item.relatedRecommendJson || []).filter(v => v
					.skuList && v.skuList.length)
			}
		})
	};
	// 判断商品是否在可售时间内
	const isProductAvailable = async (sellDaysStr, startTimeStr, endTimeStr) => {
		if (!sellDaysStr) {
			return false
		}
		// 将后端返回的字符串转换为数组
		const sellDays = sellDaysStr.split(',');
		const now = dayjs();
		const days = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
		const currentDay = days[now.day()];

		// console.log('当前日期:', currentDay);
		// console.log('可售日期列表:', sellDays);

		// 检查当前周几是否在可售周几列表中
		if (!sellDays.includes(currentDay)) {
			// console.log('当前日期不在可售日期列表中');
			return false;
		}

		const startTime = dayjs(`${now.format('YYYY-MM-DD')} ${startTimeStr}`);
		let endTime = dayjs(`${now.format('YYYY-MM-DD')} ${endTimeStr}`);

		// 处理跨天情况
		if (endTime.isBefore(startTime)) {
			endTime = endTime.add(1, 'day');
		}

		// console.log('当前时间:', now.format('YYYY-MM-DD HH:mm:ss'));
		// console.log('开始时间:', startTime.format('YYYY-MM-DD HH:mm:ss'));
		// console.log('结束时间:', endTime.format('YYYY-MM-DD HH:mm:ss'));

		const isInRange = now.isBetween(startTime, endTime, null, '[)');
		// console.log('当前时间是否在可售时间范围内:', isInRange);

		return isInRange;
	};


	function stockNumberIsFull(item) {
		if (item.isStock && item.stockNumber < item.suitNum) {
			return false
		}
		return true
	}

	/**
	 * 判断商品是否可售
	 * @param {Object} item
	 */
	function juageProductAvailable(item, i) {
		if (!isProductAvailable(item.days, item.startTime, item.endTime)) {
			uni.showToast({
				title: '不在可售时间内'
			});
			return false;
		}
		if (item.isStock && item.stockNumber < item.suitNum && i == '+') {
			uni.showToast({
				title: '库存不足',
				icon: 'none'
			});
			return false;
		}
		return true;
	}


	// 封装成 Promise 的确认弹窗
	const showConfirmModal = (title, content) => {
		return new Promise((resolve) => {
			uni.showModal({
				title: title,
				content: content,
				showCancel: true,
				cancelText: '取消添加',
				confirmText: '继续',
				success(res) {
					// 确认返回 true，取消/关闭返回 false
					resolve(res.confirm === true);
				}
			});
		});
	};
	// 单规格
	const singleclick = async (item, i) => {
		console.log('单规格商品点击事件:', item, i);
		if (!juageProductAvailable(item, i)) {
			return false;
		}
		// 判断购物车是否有该选中商品
		let res = null;
		try {
			res = matchedProducts.value.find((product, index) => {
				return product.skuId == item.skuId && product.id == item.id;
			});
		} catch (error) {
			//TODO handle the exception
		}

		// 保存这次点击的
		specifications.productListitem = item;

		// 是否起售 如果小于或者大于都是1
		let suitNum = 1;
		const cartNumberFloat = parseFloat(item.cartNumber);
		if (!res && item.suitNum > cartNumberFloat) {
			suitNum = item.suitNum;
		} else if (item.suitNum >= cartNumberFloat && i === '-') {
			suitNum = item.cartNumber;
		}

		const number = await calculateValue(item.cartNumber, i, suitNum)
		const goodsStockNumber = returnStockNumber(item)
		
		console.log('number', number);
		if (i === '+') {
			if (goodsStockNumber < suitNum) {
				return uni.showToast({
					title: '库存不足',
					icon: 'none'
				})
			}
			const oldGoodsArr = combineOrderInfoDetailMap(orderinfo.value)
			if (oldGoodsArr.find(v => v.productId == item.id)) {
				// 等待用户点击
				const isConfirm = await showConfirmModal(
					'该商品已下单过，请确认是否重复',
					'菜品名称：《' + item.name + '》'
				);
				if (!isConfirm) {
					return
				}
			} else {
				if (number * 1 == 2) {
					const isConfirm = await showConfirmModal(
						'购物车已有该商品，请确认是否重复',
						'菜品名称：《' + item.name + '》'
					);
					if (!isConfirm) {
						return
					}
				}
			}


		}

		const sendMsg = {
			type: 'shopping',
			suitNum: item.suitNum,
			table_code: uni.cache.get('tableCode'),
			shop_id: uni.cache.get('shopId'),
			operate_type: number == 'del' ? 'del' : res ? 'edit' : 'add',
			product_id: item.id,
			sku_id: item.skuId,
			memberPrice: item.memberPrice,
			number: number,
			is_print: 1,
			product_type: item.type,
			is_time_discount: showLimitDiscount(item)
		};
		if (item.cartListId) {
			sendMsg.id = item.cartListId;
		}
		websocketsendMessage(sendMsg);
	};

	const calculateValue = (cartNumber, i, step = 1) => {
		if (i == '+') {
			const result = parseFloat(cartNumber) + parseFloat(step);
			return result.toFixed(2);
		} else {
			// 当减到0返回del
			const result = parseFloat(cartNumber) - parseFloat(step);
			return result == 0 ? 'del' : result.toFixed(2);
		}
	};

	// WebSocket处理  	// 初始化配置
	const options = {
		initMessage: {
			type: 'shopping',
			operate_type: 'init',
			table_code: uni.cache.get('tableCode'),
			shop_id: uni.cache.get('shopId'),
			time_dis_info: null
		}
	};
	const useSocket = useWebSocket();
	//购物车显示
	const showCart = ref(false);

	// 提交订单显示
	const confirmordershow = ref(false);

	// 更新商品数量的方法
	const updateProductQuantities = () => {
		console.log('updateProductQuantities');
		// 先将所有商品的 cartNumber 初始化为 0
		shopProductList.hots.forEach((i) => {
			i.cartNumber = 0;
		});
		// 遍历商品列表二维数组
		shopProductList.productInfo.forEach((group) => {
			group.productList.forEach((product) => {
				product.cartNumber = 0;
			});
		});

		// 再去更新数组的值
		cartListFilter.value.forEach((cartItem) => {
			shopProductList.productInfo.forEach((group) => {
				group.productList.forEach((product) => {
					if (product.id == cartItem.product_id && product.skuId == cartItem
						.sku_id) {
						product.cartNumber = cartItem.number || 0;
						product.cartListId = cartItem.id;
					}
				});
			});
		});
		// 遍历购物车数组
		cartListFilter.value.forEach((cartItem) => {
			// 遍历商品列表二维数组
			shopProductList.hots.forEach((group) => {
				// 商品 id 匹配
				if (group.id == cartItem.product_id) {
					// 更新商品的数量
					group.cartListId = cartItem.id;
					group.cartNumber = cartItem.number || 0;
				}
			});
		});
	};

	//websocket产值
	const websocketsendMessage = (data) => {
		console.log('websocketsendMessage', data);
		delete data.memberPrice;
		uni.$u.debounce(() => {
			useSocket.sendMessage(data);
		}, 200);
	};

	// 用于记录已经处理过的消息的 msg_id
	const processedMessageIds = new Set();

	//设置商品初始选中
	function setGoodsInitSel(cartsArr) {
		console.log('setGoodsInitSel');
		const arr = cartsArr && cartsArr.length ? cartsArr : cartStore.carts;
		if (arr.length <= 0) {
			return;
		}
		shopProductList.hots.map((v) => {
			const item = arr.find((cart) => cart.product_id == v.id);
			if (item) {
				v.cartNumber = `${item.number}`;
			}
		});
		shopProductList.productInfo.map((info) => {
			info.productList.map((v) => {
				const item = arr.find((cart) => cart.product_id == v.id);
				if (item) {
					v.cartNumber = `${item.number}`;
					console.log(v.cartNumber);
				}
			});
		});
	}

	async function delGoods() {
		await websocketsendMessage({
			id: Message.id,
			type: 'shopping',
			table_code: uni.cache.get('tableCode'),
			shop_id: uni.cache.get('shopId'),
			operate_type: 'del',
			is_print: 1
		});
	}

	// 购物车初始化时进行判断商品是否可以使用限时折扣,然后更新
	let socketTimer = null

	// 返回商品对应sku数据

	function cartInit(arr) {

		const result = []
		cartStore.carts = arr.map(v => {
			const goods = cartStore.allGoodsArr.find(g => g.id == v.product_id)
			const goodsSkuList = goods ? goods.skuList : []
			const findSku = goodsSkuList.find(sku => sku.id == v.sku_id)
			const memberPrice = findSku ? findSku.memberPrice : 0
			const is_temporary = v.is_temporary || v.isTemporary
			const is_time_discount = limitUtils.canUseLimitTimeDiscount({
					...v,
					memberPrice
				}, cartStore.limitTimeDiscount, shopInfo,
				shopUserInfo.value, 'product_id');
			if (!goods && !is_temporary) {
				console.log('删除未匹配到的商品', {
					id: v.id,
					operate_type: "del",
					table_code: uni.cache.get('tableCode'),
					shop_id: uni.cache.get('shopId'),
					type: "shopping",
				})
				useSocket.sendMessage({
					id: v.id,
					operate_type: "del",
					table_code: uni.cache.get('tableCode'),
					shop_id: uni.cache.get('shopId'),
					type: "shopping",
				});
				return null
			}
			return {
				...v,
				is_time_discount: is_time_discount ? 1 : 0,
				memberPrice
			}
		}).filter(v => v)

		for (let cart of arr) {
			const findItem = cartStore.carts.find(v => v.id == cart.id)
			if (findItem && findItem.is_time_discount != cart.is_time_discount) {
				result.push({
					id: cart.id,
					is_time_discount: findItem.is_time_discount
				})
			}
		}
		if (result.length > 0) {
			useSocket.sendMessage({
				table_code: uni.cache.get('tableCode'),
				shop_id: uni.cache.get('shopId'),
				type: "shopping",
				operate_type: "bulk_edit",
				data: {
					cart: result
				}
			});

		}
	}

	let socketInitFinished = false
	// 收到的消息变化
	async function onMessage(Message) {
		if (Message) {
			// 心跳返回  过滤
			if (Message.type == 'ping_interval' || Message.msg_id == 'ping_interval') {
				isLoading.value = false;
				return false;
			}

			// 检查消息是否已经处理过
			if (processedMessageIds.has(Message.msg_id)) {
				return;
			}
			processedMessageIds.add(Message.msg_id);

			// 初始化
			if (Message.operate_type == 'init') {
				// cartStore.limitTimeDiscount = Message.time_dis_info;
				cartInit(Message.data)
				try {
					uni.hideLoading();
				} catch (error) {
					//TODO handle the exception
				}
				isLoading.value = false;

				if (!socketInitFinished) {
					useSocket.chnageInitMessage(options.initMessage)
					socketInitFinished = true
				}

			}

			if (Message.operate_type == 'rottable_error') {
				uni.showModal({
					title: '提示',
					content: Message.msg,
					showCancel: true,
					cancelText: '舍弃',
					confirmText: '合并',
					success(res) {
						showTableInfoPeopleNumPopup.value = false;
						if (res.confirm) {
							startUseTable({
								is_hb: 2
							})
						} else {
							startUseTable({
								is_hb: 2,
								give_up: 1
							})
						}
					}
				})
			}

			// 转桌成功
			if (Message.operate_type == 'rottable') {

				console.log('转桌成功了');
				console.log(Message);

				// uni.showToast({
				// 	title: '扫码成功，请下单',
				// 	icon: 'none'
				// });

				orderType.value = 'scan';
				uni.cache.set('tableCode', Message.data.new_table_code);

				if (showTableInfoPeopleNumPopup.value == true) {
					showTableInfoPeopleNumPopup.value = false;
				}

				const data = {
					type: 'shopping',
					operate_type: 'init',
					table_code: uni.cache.get('tableCode'),
					shop_id: uni.cache.get('shopId'),
					time_dis_info: cartStore.limitTimeDiscount
				};
				console.log('cartStore.limitTimeDiscount', cartStore.limitTimeDiscount)
				// useSocket.sendMessage({
				// 	type: 'shopping',
				// 	operate_type: 'time_discount_save',
				// 	table_code: Message.data.new_table_code,
				// 	shop_id: uni.cache.get('shopId'),
				// 	operate_type: 'time_discount_save',
				// 	data: cartStore.limitTimeDiscount
				// });
				useSocket.sendMessage(data);
			}

			// 清空购物车
			if (Message.operate_type == 'cleanup') {
				cartStore.carts = [];
				setTimeout(() => {
					Historicalorders();
				}, 400);
				showCart.value = false;
			}

			// 删除除购物车
			if (Message.operate_type == 'del' && Message.status == 1) {
				// 优化：使用可选链操作符避免报错
				cartStore.carts = cartStore.carts.filter((item) => item.id !== Message.data?.id);
				// cartStore.carts = cartStore.carts.filter(item => item.id != Message.data.id);
			}

			// 添加或者减少购物后返回
			if (Message.operate_type == 'add' || Message.operate_type == 'edit') {
				[Message.data].forEach((objA) => {
					const index = cartStore.carts.findIndex((objB) => objB.id == objA.id);
					if (index !== -1) {
						cartStore.carts[index] = objA;
					} else {
						cartStore.carts.push(objA);
					}
				});
			}

			// 历史订单
			if (Message.operate_type == 'clearOrder') {
				Historicalorders();
			}

			// 购物车数据更新从新请求
			if (Message.type == 'product' && Message.data_type == 'product_update' && Message.operate_type ==
				'product_update') {
				isDataLoaded.value = false;
				productqueryProduct();
			}

			// 提示
			if (Message.status == 0 && Message.type != 'no_suit_num' && Message.type != 'time_discount' && Message
				.operate_type != 'rottable_error') {
				uni.showToast({
					title: Message.msg,
					icon: 'none'
				});
			}

			if (Message.type == 'no_suit_num') {
				// console.log(specifications)
				uni.showModal({
					title: '提示',
					showCancel: false,
					content: '此商品库存不足起售数量！',
					success: (data) => {
						delGoods();
					}
				});
			}



			//除去p 每次返回都回执消息
			await websocketsendMessage({
				type: 'receipt',
				msg_id: Message.msg_id
			});

			// 初始化商品数量
			await updateProductQuantities();
		}
	}

	// 更新购物车数据shopProductList.hots
	const matchedProducts = computed(() => {
		if (cartStore.carts.length > 0) {
			let Specialstop = null;

			try {
				Specialstop = [
					...[{
						id: '',
						name: '',
						productList: shopProductList.hots
					}],
					...shopProductList.productInfo
				];
			} catch (error) {
				Specialstop = shopProductList.productInfo;
				//TODO handle the exception
			}
			return cartStore.carts
				.flatMap((cartItem) => {
					for (const group of Specialstop) {
						for (const product of group.productList) {
							if (product.id == cartItem.product_id) {
								console.log(cartItem);
								return {
									...product,
									cartListinfo: cartItem,
									cartListId: cartItem.id, //购物车id
									cartNumber: cartItem.number //增加一个数量算法
									// cartNumberToAdd: cartItem.number //增加一个数量算法
								};
							}
						}
					}
					if (cartItem.is_temporary === 1) {
						return [{
							...cartItem,
							memberPrice: cartItem.discount_sale_amount,
							salePrice: cartItem.discount_sale_amount,
							cartListinfo: cartItem,
							cartListId: cartItem.id, // 购物车id
							cartNumber: cartItem.number // 增加一个数量算法
						}];
					}
					// 如果没找到匹配的商品，返回 null 或者其他默认值，这里返回 null
					return null;
				})
				.filter((item) => item !== null);
		} else {
			return [];
		}
	});

	//删除某一个待支付订单
	const clickcancelOrder = async (data) => {
		if (data.i == 'all') {
			await APIcancelOrder({
				shopId: uni.cache.get('shopId'),
				orderId: orderinfo.value.id
			});
		} else {
			await APIrmPlaceOrder({
				shopId: uni.cache.get('shopId'),
				orderId: orderinfo.value.id,
				placeNum: data.key
			});
		}
		Historicalorders();
	};

	// 储存是否存在多次下单
	const orderinfo = ref({});
	const confirmorderref = ref(null);


	// 结账
	const orderdetail = async () => {
		isAutoClose = false;
		uni.navigateTo({
			url: '/pages/order/confirm-order?tableCode=' + uni.cache.get('tableCode') + '&shopId=' + uni
				.cache.get('shopId')
		});
		return;
		try {
			await Historicalorders();
		} catch (error) {}
		confirmordershow.value = true;
		showCart.value = false;
	};

	// 历史订单
	const Historicalorders = async (W) => {
		if (W) {
			showCart.value = !showCart.value;
		} else {
			let res = await APIhistoryOrder({
				tableCode: uni.cache.get('tableCode')
			});
			if (res && typeof res === 'object') {
				orderinfo.value = {
					id: res.id,
					detailMap: res.detailMap,
					placeNum: res.placeNum
				};
			}

		}
	};

	// 提取合并 orderinfo.detailMap 数组的逻辑
	function combineOrderInfoDetailMap(orderinfo) {
		if (!orderinfo) return [];
		let combinedArray = [];
		for (const key in orderinfo.detailMap) {
			if (orderinfo.detailMap.hasOwnProperty(key)) {
				let subArray = orderinfo.detailMap[key];
				combinedArray = [...combinedArray, ...subArray];
			}
		}
		return combinedArray;
	}

	// 计算购物车商品费用
	const totalPrices = computed(() => {
		// 购物车总数价格
		let cart = 0;
		if (matchedProducts.value.length > 0) {
			// 购物车总数价格
			cart = matchedProducts.value.reduce((total, item) => {
				if (item.type == 'sku') {
					item.skuList.forEach((i, t) => {
						if (item.cartListinfo.sku_id == i.id) {
							item.memberPrice = i.memberPrice;
							item.salePrice = i.salePrice;
						}
					});
				}
				if (cartStore.limitTimeDiscount && cartStore.limitTimeDiscount.id && item.cartListinfo
					.is_time_discount ==
					1) {
					//限时折扣
					const price = limitUtils.returnPrice({
						goods: item,
						shopInfo,
						limitTimeDiscountRes: cartStore.limitTimeDiscount,
						shopUserInfo: shopUserInfo.value,
						idKey: 'id'
					});
					return total + parseFloat(price) * parseFloat(item.cartNumber);
				}
				// 是否启用会员价 0否1是
				if (shopUserInfo.value.isVip == 1 && shopUserInfo.value.isMemberPrice == 1) {
					// memberPrice会员价
					return total + parseFloat(item.memberPrice || item.salePrice) * parseFloat(item
						.cartNumber);
				} else {
					// salePrice销售价
					return total + parseFloat(item.salePrice || 0) * parseFloat(item.cartNumber);
				}
			}, 0);
		}
		cart = parseFloat(cart);
		// 向上取整并保留两位小数
		return parseFloat(cart.toFixed(2));
	});

	//全部优惠券金额
	const allDiscountMoney = computed(() => {
		let discountMoney = 0;
		// 新客立减
		if (newUserDiscount.value && newUserDiscount.value.amount) {
			discountMoney += newUserDiscount.value.amount;
		}
		// 满减活动
		if (fullAmountActivty.value && fullAmountActivty.value.discountAmount) {
			discountMoney += fullAmountActivty.value.discountAmount;
		}
		return discountMoney.toFixed(2);
	});

	// 计算实际金额（购物车商品费用-新客立减-满减活动）
	const actualPrice = computed(() => {
		let price = BigNumber(totalPrices.value * 1)
			.minus(allDiscountMoney.value * 1)
			.toFixed(2);
		return price <= 0 ? 0 : price;
	});

	// 计算购物车商品总数量
	const cartLists_count = computed(() => {
		const combinedOrderInfo = combineOrderInfoDetailMap(orderinfo.value);
		const orderInfoCount = combinedOrderInfo.reduce((sum, item) => {
			return sum + parseFloat(item.num);
		}, 0);

		const matchedProductsCount = matchedProducts.value.reduce((sum, item) => {
			const num = typeof item.cartNumber === 'string' ? parseFloat(item.cartNumber) : item
				.cartNumber;
			return sum + num;
		}, 0);

		const totalCount = matchedProductsCount;
		return parseFloat(totalCount.toFixed(2));
	});

	// 定义 ifcartNumber 计算属性方法 展示数量
	function ifcartNumber(item) {
		// 如果 item 为空或者 cartNumber 不是字符串类型，返回 0
		if (!item || item.cartNumber * 1 == 0) {
			return '';
		}
		let numValue = parseFloat(item.cartNumber);
		if (isNaN(numValue)) {
			// 如果转换结果是 NaN，说明 cartNumber 不是有效的数字字符串，返回 0
			return '';
		}
		// type string  商品类型 single-单规格商品 sku-多规格商品 package-套餐商品 weight-称重商品 coupon-团购券
		if (item.type === 'weight') {
			// 如果类型是称重重量，将值保留两位小数
			return parseFloat(numValue.toFixed(2));
		} else {
			// 如果类型是整数，将值转换为整数
			return Math.round(numValue);
		}
		// 如果类型不匹配，返回原始值
		return item.cartNumber;
	}

	// 计算处理后的购物车列表 	// 用于筛选后的购物车数组
	const cartListFilter = computed(() => {
		// 使用 reduce 方法对 cartList 进行处理
		const grouped = cartStore.carts.reduce((acc, item) => {
			const productId = item.product_id;
			const num = parseFloat(item.number);

			if (!acc[productId]) {
				// 如果 acc 中还没有该 product_id 的记录，创建一个新对象
				acc[productId] = {
					...item,
					number: num
				};
			} else {
				// 如果已经有该 product_id 的记录，将当前对象的 number 值累加到已有记录的 number 属性上
				acc[productId].number += num;
			}
			return acc;
		}, {});
		// 将累加结果保留两位小数，并将对象转换为数组
		return Object.values(grouped).map((item) => ({
			...item,
			number: item.number.toFixed(2)
		}));
	});

	const endTimeref = reactive({
		startTime: '',
		endTime: ''
	});

	// 获取当前时间
	const getCurrentTime = () => {
		const now = new Date();
		const hours = now.getHours().toString().padStart(2, '0');
		const minutes = now.getMinutes().toString().padStart(2, '0');
		return `${hours}:${minutes}`;
	};

	// 计算是否在营业时间内
	const isBusinessTime = computed(() => {
		if (!shopInfo.businessTime) {
			return true;
		}
		const currentTime = getCurrentTime();
		const [startTime, endTime] = shopInfo.businessTime.split('-');
		endTimeref.startTime = startTime;
		endTimeref.endTime = endTime;
		// 如果开始时间大于结束时间，说明是跨天的营业时间
		if (startTime > endTime) {
			return currentTime >= startTime || currentTime <= endTime;
		}
		return currentTime >= startTime && currentTime <= endTime;
	});
	const allGoodsArr = ref([])
	// 列表请求
	const productqueryProduct = async () => {
		cartStore.goodsIsloading = false;
		allGoodsArr.value = []
		try {
			shopProductList.hots = await productminiApphotsquery();
			shopProductList.productInfo = await APIgroupquery();
		} catch (error) {
			uni.showToast({
				title: '网络不稳定，请重新扫码进入',
				icon: 'none'
			});
			setTimeout(() => {
				uni.pro.switchTab('index/index');
			}, 1000);
			return; // 出错直接返回，避免后续逻辑
		}

		if (shopProductList.productInfo.length > 0 || shopProductList.hots.length > 0) {
			// 第一步：处理productInfo（替换forEach为for...of，支持await）
			for (const group of shopProductList.productInfo) {
				for (const product of group.productList) {
					product.cartNumber = 0;
					// 等待异步函数执行完成后，再push
					product.isSaleTimeshow = await isProductAvailable(
						product.days,
						product.startTime,
						product.endTime
					);
					allGoodsArr.value.push(product);
					cartStore.setGoodsMap(product.id, product);
				}
			}

			// 第二步：处理hots（同理替换forEach为for...of）
			for (const i of shopProductList.hots) {
				i.cartNumber = 0;
				i.isSaleTimeshow = await isProductAvailable(i.days, i.startTime, i.endTime);
				allGoodsArr.value.push(i);
				cartStore.setGoodsMap(i.id, i);
			}

			// 此时所有异步操作完成，allGoodsArr已有数据
			// console.log('allGoodsArr', allGoodsArr);
			// console.log('shopProductList', shopProductList);
			console.log('cartStore.carts', cartStore.carts)
			cartStore.allGoodsArr = allGoodsArr.value
			if (cartStore.carts.length > 0) {
				cartInit(cartStore.carts);
			}

			cartStore.goodsIsloading = true;
			scrollTopSize.value = 0;
			topArr.value = [];
			isDataLoaded.value = true;
			Historicalorders();
			updateProductQuantities();
		} else {
			uni.showToast({
				title: '暂无列表数据,请重新扫码',
				icon: 'none'
			});
			isDataLoaded.value = false;
			setTimeout(() => {
				uni.pro.switchTab('index/index');
			}, 1000);
			return false;
		}

		if (pageOptions.showGoodsId) {
			const item = allGoodsArr.value.find(v => v.id == pageOptions.showGoodsId)
			if (item) {
				clickspecifications(item)
			}
			pageOptions.showGoodsId = null
		}


	};

	provide('cartStore', cartStore);
	provide('shopUserInfo', shopUserInfo);
	provide('shopInfo', shopInfo);

	const orderType = ref('scan');

	// 扫码下单

	// 台桌信息
	const showTableInfoPeopleNumPopup = ref(false);
	const tableInfo = ref('');
	const tableShopInfo = ref(uni.cache.get('shopInfo'));

	// 选择的人数
	const tableInfoPeopleActive = ref(-1);
	const tableInfoPeopleNum = ref('');

	// 选择人数
	function tableInfoPeopleNumHandle(num, index) {
		tableInfoPeopleActive.value = index;
		tableInfoPeopleNum.value = num;
	}

	// 人数输入框
	function tableInfoPeopleNumInput(e) {
		tableInfoPeopleActive.value = -1;
		setTimeout(() => {
			tableInfoPeopleNum.value = filterNumberInput(e, 1);
		}, 50);
	}

	// 取消选择人数
	function closeTableInfoPeopleNum() {
		showTableInfoPeopleNumPopup.value = false;
		tableInfoPeopleActive.value = -1;
		tableInfoPeopleNum.value = '';
	}

	// 确认选择人数
	function tableInfoPeopleNumConfirm() {
		if (tableInfoPeopleNum.value > 0) {
			uni.cache.set('dinersNum', tableInfoPeopleNum.value);
			startUseTable();
		} else {
			uni.showToast({
				title: '请选择就餐人数',
				icon: 'none'
			});
		}
	}

	// 开始换桌
	function startUseTable(par) {
		tableShopInfo.value = uni.cache.get('shopInfo');
		const oldTableCode = uni.cache.get('tableCode');
		const cartIds = cartStore.carts.map((item) => item.id);

		const data = {
			is_hb: 1,
			...par,
			type: 'shopping',
			operate_type: 'rottable',
			account: tableShopInfo.value.phone,
			table_code: oldTableCode,
			new_table_code: uni.cache.get('shopTable').tableCode,
			cart_id: cartIds,
			shop_id: tableShopInfo.value.id,
		};

		websocketsendMessage(data);
	}

	const juli = computed(() => {
		const juli = getDistance(userStore.location.latitude, userStore.location.longitude, shopInfo.lat,
			shopInfo.lng);
		return juli.toFixed(2)
	})


	//计算距离判断是否可以点餐
	async function computedDistance(shopInfo) {
		return new Promise((resolve, reject) => {
			console.log('店铺经纬度', shopInfo.lat, shopInfo.lng);
			console.log('用户经纬度', userStore.location.latitude, userStore.location.longitude);

			const juli = getDistance(userStore.location.latitude, userStore.location.longitude, shopInfo.lat,
				shopInfo.lng);
			const orderFenceDistance = ((shopInfo.orderFenceDistance || 2000) / 2000).toFixed(2);

			console.log('距离', juli);

			if (shopInfo.isOrderFence && juli > orderFenceDistance) {
				uni.showModal({
					title: '提示',
					confirmText: '重新定位',
					content: '抱歉，您当前距离店铺过远，为保障您的用餐体验，请您到店后或在门店附近再下单。若您已在店铺附近，可尝试重新定位',
					success: async (res) => {
						if (res.confirm) {
							console.log('用户点击了确认');
							await userStore.getLocation();
							// computedDistance();
							uni.showToast({
								title: '定位成功，请重新扫码',
								icon: 'none'
							});
						} else if (res.cancel) {
							console.log('用户点击了取消');
						}
					}
				});
				reject();
				return;
			}
			resolve(juli);
		});
	}

	// 预点单扫码下单
	function beforehandHandle() {
		isAutoClose = false
		uni.scanCode({
			success: async (res) => {
				try {


					console.log('options.initMessage', options.initMessage)
					const newTableCode = userStore.getQueryString(res.result, 'code');
					console.log('newTableCode', newTableCode);
					const shopInfoRes = await APIproductqueryShop({
						tableCode: newTableCode
					});

					console.log('shopInfoRes===', shopInfoRes);

					await computedDistance(shopInfoRes.shopInfo);
					if (shopInfoRes.shopInfo.id !== shopInfo.id) {
						uni.showModal({
							title: '注意',
							content: '扫码店铺与当前店铺不一致，请重新加载页面',
							showCancel: false,
							success: async (res) => {
								uni.cache.set('tableCode', newTableCode);
								await userStore.actionsproductqueryShop(newTableCode);
								await userStore.actionsproductqueryProduct();
								useSocket.closeSocket();
								userStore.jumpToOrderPage();
							}
						});
					} else {
						await userStore.actionsproductqueryShop(newTableCode);
						await userStore.actionsproductqueryProduct();
						const res = await APIhistoryOrder({
							tableCode: newTableCode
						});

						if (res && res.id) {
							return uni.showModal({
								title: '提示',
								content: '目标台桌使用中无法转桌',
								showCancel: false
							})
						}
						if (shopInfoRes.shopInfo.isTableFee === 1) {
							// 免桌位费，直接换桌
							startUseTable();
						} else {
							// 不免桌位费，显示选择人数
							tableInfo.value = uni.cache.get('shopTable');
							showTableInfoPeopleNumPopup.value = true;
						}

					}
				} catch (error) {
					console.log(error);
				}
			}
		});
	}


	import {
		shareMixin,
		handleMixinOnLoad,
		returnQuery,
		jsonToUrl,
		wxShare,
		returnPageTags,
		returnCommonQuery
	} from '@/utils/share.js'
	// defineOptions({
	// 	mixins: [shareMixin],
	// });


	let isGoodsShare = ref(false)

	function shareClick() {
		isGoodsShare.value = true
	}

	function getPage(pageStr) {

	}

	function shareBtnClick(item) {
		console.log('shareBtnClick', item);
		shareSwiperItem.value = item
	}

	function swiperShare(queryJson) {
		console.log('shareSwiperItem', shareSwiperItem.value);
		const pTag = returnPageTags(shareSwiperItem.value.jumpPagePath)
		let query = jsonToUrl(queryJson)
		query += ('&' + shareSwiperItem.value.extendParam)
		const shopName = uni.cache.get('shopInfo').shopName || ''
		const path = shareSwiperItem.value.jumpPagePath ? shareSwiperItem.value.jumpPagePath :
			'/pages/product/index?type=beforehand'
		console.log('path', path);
		const json = {
			imageUrl: shareSwiperItem.value.imageUrl,
			path: path + '&' + query,
			title: shareSwiperItem.value.name + (shopName ? `-${shopName}` : ''),
		}
		if (pTag === 'pp-detail') {
			json.path = json.path.replace('goodsId', 'id')
		}
		if (pTag === 'gb-detail') {
			json.path = json.path.replace('goodsId', 'wareId')
		}
		if (pTag === 'point-detail') {
			json.path = json.path.replace('goodsId', 'id')
		}
		if (pTag.includes('eat')) {
			if (shareSwiperItem.value.extendParam) {
				json.path = json.path.replace('goodsId', 'showGoodsId')
			}
		}
		return wxShare(json)
	}


	async function onShare() {
		const queryJson = await returnCommonQuery()
		if (shareSwiperItem.value) {
			return swiperShare(queryJson)
		}
		let query = jsonToUrl(queryJson)
		query += '&type=beforehand'
		let json = {}
		const shopName = uni.cache.get('shopInfo').shopName || ''
		if (goodsModalList.value.length && isGoodsShare.value) {
			const goods = goodsModalList.value[goodsModalList.value.length - 1].goods
			query += '&showGoodsId=' + goods.id
			json.title = goods.name + (shopName ? `-${shopName}` : '')
			json.imageUrl = goods.coverImg
			json.showGoodsId = goods.id
		} else {
			json.title = shopName
			json.imageUrl = uni.cache.get('shopInfo').logo || ''
		}

		return wxShare({
			query,
			...json,
			path: '/pages/product/index' + '?' + query
		})
	}

	onShareAppMessage(onShare)

	onShareTimeline(onShare)

	const pageOptions = reactive({})

	const carouselList = ref([])

	async function getConsStocks() {
		const res = await getConsStock({
			shopId: userStore.shopInfo.id
		})
		consStockList.value = res || []
	}
	const consStockList = ref([])


	// 是否显示剩余库存数量
	function showStockNumber(item) {
		return !item.isSoldStock && returnStockNumber(item) <= 10 && returnStockNumber(item) > 0
	}

	function returnStockNumber(item) {
		if (!item.isAutoSoldStock) {
			return 9999
		}
		const consList = item.consList
		const matchStockList = consStockList.value.filter(v => {
			return consList.find(c => c.consInfoId == v.consId)
		}).map(v => {
			const cItem = item.consList.find(c => c.consInfoId == v.consId)
			const goodsNumber = Math.floor(v.stockNumber / cItem.surplusStock)
			return {
				...v,
				goodsNumber
			}
		}).sort((a, b) => {
			return a.goodsNumber - b.goodsNumber
		})

		const minConsStockNumber = matchStockList[0] ? matchStockList[0].goodsNumber : 9999
		return minConsStockNumber
	}
	onLoad(async (e) => {
		Object.assign(pageOptions, e)
		if (e.type) {
			orderType.value = e.type;
		}

		await handleMixinOnLoad({
			...e,
			shopId: e.shopId || uni.cache.get('shopId')
		})

		if (userStore.shopUserInfo.shopExtendList) {
			shopExtend.value = userStore.shopUserInfo.shopExtendList.find(v => v.autoKey == 'shopinfo_bg') ||
				''
		}

		// //获取用户信息
		// const userInfo = await APIshopUserInfo({
		// 	shopId: uni.cache.get('shopId')
		// })
		// //获取店铺信息
		// const shopInfoRes = await APIusershopInfodetail({
		// 	shopId: uni.cache.get('shopId')
		// });
		Object.assign(shopInfo, userStore.shopInfo);
		if (e.type == 'beforehand') {
			uni.cache.set("tableCode", userStore.shopUserInfo.id);
			options.initMessage.table_code = userStore.shopUserInfo.id
		}
		options.initMessage.shop_id = userStore.shopInfo.id
		shopUserInfo.value = userStore.shopUserInfo

		await productqueryProduct();

		const extraInitPar = {}
		if (e.one_more_order && e.order_id) {
			extraInitPar.one_more_order = 1
			extraInitPar.order_id = e.order_id
			extraInitPar.user_id = uni.cache.get('userInfo').id || ''
		}

		const time_dis_info = await getLimitDiscount()
		options.initMessage.time_dis_info = time_dis_info

		console.log('options.initMessage', {
			...options.initMessage,
			...extraInitPar,
		})
		useSocket.connect({
			...options.initMessage,
			...extraInitPar,
		}, onMessage);

		cartStore.setOldOrder({
			detailMap: {},
			originAmount: 0
		});


		//新客立减
		getNewUserDiscount();
		// 满减活动
		getDiscountActivity();

		//分享轮播
		carousel({
			shopId: uni.cache.get('shopId')
		}).then(res => {
			carouselList.value = res
		})

		let res = await APIhistoryOrder({
			tableCode: uni.cache.get('tableCode')
		});
		oldOrder.value = res;
		nextTick(() => {
			getElementTop();
		})
		if (res && res.id && shopInfo.registerType == 'after' && !e.noJump) {
			toHistory();
			return;
		}

		setTimeout(() => {
			// 启动网络监听
			useSocket.initNetworkListener();
		}, 500);
	});

	const nowTime = ref(getEndTimeInSeconds(dayjs().format('HH:mm')));
	let timer = setInterval(() => {
		nowTime.value = getEndTimeInSeconds(dayjs().format('HH:mm'));
	}, 1000);

	function getEndTimeInSeconds(endTime) {
		const [hour, minute] = endTime.split(':').map(Number);
		return hour * 60 * 60 + minute * 60;
	}
	// 将秒再转为hh::mm
	function secondsToHHMM(seconds) {
		const hours = Math.floor(seconds / 60 / 60);
		const minutes = Math.floor(seconds / 60) % 60;
		return `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}`;
	}

	const limitDiscountCountdown = computed(() => {
		if (!cartStore.limitTimeDiscount && !cartStore.limitTimeDiscount.id) {
			return '';
		}
		if (cartStore.limitTimeDiscount.useTimeType != 'custom') {
			return '';
		}
		//根据当前时间和限时折扣的结束时间计算倒计时,结束时间是hh:mm,将hh:mm转换为时间多少秒，然后再减去当前时间，就得到了倒计时
		const endTime = getEndTimeInSeconds(cartStore.limitTimeDiscount.useEndTime);
		const countdown = endTime - nowTime.value;
		if (countdown <= 0) {
			return '';
		}
		return secondsToHHMM(countdown);
	});

	function showLimitDiscount(item) {
		if (!cartStore.limitTimeDiscount || !cartStore.limitTimeDiscount.id) {
			return 0;
		}
		return limitUtils.canUseLimitTimeDiscount(item, cartStore.limitTimeDiscount, shopInfo, shopUserInfo.value, 'id') ?
			1 : 0;
	}

	function returnLimitPrice(item) {
		return limitUtils.returnPrice({
			goods: item,
			limitTimeDiscountRes: cartStore.limitTimeDiscount,
			shopInfo: shopInfo,
			shopUserInfo: shopUserInfo.value,
			idKey: 'id'
		});
	}

	function watchEmit() {
		uni.$off('updateProductIndex')
		uni.$on('updateProductIndex', function(data) {
			getNewUserDiscount()
		})
	}

	onShow(async () => {
		isAutoClose = true;
		// 监听页面显示和隐藏
		watchEmit()
		useSocket.setOnMessage(onMessage);
		useSocket.onShowconnect();
		let res = await APIhistoryOrder({
			tableCode: uni.cache.get('tableCode')
		});
		if (res) {
			orderinfo.value = {
				id: res.id,
				detailMap: res.detailMap,
				placeNum: res.placeNum
			};
		} else {
			orderinfo.value = {
				id: ''
			};
		}
		// if(!topArr.value.length){
		// 	getElementTop()
		// }

		//耗材列表
		await getConsStocks()
	});

	//是否自动关闭socket
	let isAutoClose = true;

	function closeSocket() {
		if (isAutoClose) {
			useSocket.closeSocket();
		}
		useSocket.setOnMessage(() => {});
	}
	onHide(() => {
		isGoodsShare.value = false
		shareSwiperItem.value = null
		closeSocket();
	});
	onUnload(() => {
		closeSocket();
	});

	// 获取新客立减

	const newUserDiscount = ref(null);
	async function getNewUserDiscount() {
		let res = await consumeDiscount({
			shopId: uni.cache.get('shopId')
		});
		if (res && typeof res == 'object') {
			newUserDiscount.value = res;
			cartStore.consumeDiscount = res
			cartStore.newUserDiscount = res.amount
		} else {
			newUserDiscount.value = null;
			cartStore.consumeDiscount = {}
			cartStore.newUserDiscount = 0
		}
	}

	const fullAmountActivity = ref(null);
	//获取满减活动
	async function getDiscountActivity() {
		const res = await discountActivityApi.config({
			shopId: uni.cache.get('shopId')
		});
		if (res && typeof res == 'object') {
			res.thresholds = (res.thresholds || []).sort((a, b) => {
				return a.fullAmount - b.fullAmount
			})
			fullAmountActivity.value = res;
		}
	}

	//返回当前满足的满减的活动
	const fullAmountActivty = computed(() => {
		if (!fullAmountActivity.value) {
			return null;
		}
		//下一个满足满减的
		let fullAmount = null;
		for (let i in fullAmountActivity.value.thresholds) {
			const item = fullAmountActivity.value.thresholds[i]
			if (totalPrices.value * 1 >= item.fullAmount) {
				fullAmount = item;
			}
		}

		return fullAmount;
	});

	//返回下一个满减活动
	const nextFullAmountActivty = computed(() => {
		if (!fullAmountActivity.value) {
			return null;
		}
		//下一个满足满减的
		let nextFullAmount = null;
		for (let item of fullAmountActivity.value.thresholds) {
			if (totalPrices.value * 1 < item.fullAmount) {
				nextFullAmount = item;
				break;
			}
		}
		return nextFullAmount;
	});
	const nextFullAmountActivtyAgignDiscount = computed(() => {
		if (nextFullAmountActivty.value && fullAmountActivty.value) {
			return nextFullAmountActivty.value.discountAmount - fullAmountActivty.value.discountAmount
		}
		if (nextFullAmountActivty.value && !fullAmountActivty.value) {
			return nextFullAmountActivty.value.discountAmount
		}
		return 0
	})
	const oldOrder = ref(null);


	// 限时折扣
	async function getLimitDiscount() {
		const limitRes = await limitTimeDiscountapi.getConfig({
			shopId: uni.cache.get('shopId')
		});
		if (limitRes && typeof limitRes == 'object') {
			cartStore.limitTimeDiscount = limitRes;
		} else {
			cartStore.limitTimeDiscount = null;
		}
		return cartStore.limitTimeDiscount
	}
	onMounted(async () => {

	});

	//跳转历史订单
	function toHistory() {
		isAutoClose = false;
		const tableCode = uni.cache.get('tableCode');
		const shopId = uni.cache.get('shopId');
		let url = `/pages/order/confirm-order?tableCode=${tableCode}&shopId=${shopId}`;
		const res = oldOrder.value;
		console.log('toHistory', res);
		// if (res && res.id && shopInfo.registerType == 'after') {
		// 	url+='&orderId='+res.id
		// }
		uni.navigateTo({
			url
		});
	}
</script>

<style lang="scss" scoped>
	.grayscale {
		filter: grayscale(100%);
		pointer-events: none;
	}

	.top--panel {
		// padding: 0 20rpx;
		background-color: #fff;

		.panelimgbackground {
			width: 100%;
			height: 272rpx;
		}

		.panelone {
			padding: 20rpx 20rpx 0 20rpx;
			font-weight: 500;
			font-size: 32rpx;
			color: #333333;
			display: flex;
			justify-content: space-between;
			font-weight: 700;
		}

		.paneltow {
			font-weight: 400;
			font-size: 24rpx;
			color: #999999;
		}

		.panelthere {
			margin-top: 32rpx;
			margin-bottom: 50rpx;
			font-family: Source Han Sans CN, Source Han Sans CN;
			font-weight: 400;
			font-size: 24rpx;
			color: #999999;
			padding: 0 20rpx;

			.paneltheretext {
				font-family: Source Han Sans CN, Source Han Sans CN;
				font-weight: 400;
				font-size: 24rpx;
				color: #999999;
			}

			.flex-start {
				view {
					font-family: Source Han Sans CN, Source Han Sans CN;
					font-weight: 400;
					font-size: 24rpx;
					color: #999999;
				}
			}
		}

		.panelfour {
			font-family: Source Han Sans CN, Source Han Sans CN;
			font-weight: bold;
			font-size: 32rpx;
			color: #333333;
			padding: 0 20rpx;
		}

		.panelfive {
			width: 100%;
			padding: 0 20rpx;

			.panelfive_list {
				display: flex;
			}

			.panelfiveitem {
				margin-top: 16rpx;
				width: 340rpx;
				margin-right: 30rpx;
				position: relative;
				flex-shrink: 0;

				.panelfiveitemimage {
					border-radius: 20rpx 20rpx 0rpx 0rpx;
					width: 100%;
					height: 204rpx;
				}

				.vifgoodsImg {
					width: 100%;
					height: 204rpx;
					position: absolute;
					top: 0;
					left: 0;
					z-index: 20;
					background-color: rgb(0, 0, 0, 0.5);

					image {
						padding: 30rpx;
						width: 100%;
						height: 100%;
					}
				}

				.panelfiveitemone {
					font-weight: 500;
					font-size: 28rpx;
					color: #333333;
					overflow: hidden; //超出的文本隐藏
					text-overflow: ellipsis; //溢出用省略号显示
					white-space: nowrap; //溢出不换行

				}

				.top-tag {
					color: #999;
					background-color: #F8F8F8;
					padding: 6rpx 20rpx;
					font-size: 10px;
					white-space: nowrap;

				}

				.panelfiveitemtow {
					margin-top: 16rpx;
					font-family: Source Han Sans CN, Source Han Sans CN;
					font-weight: 400;
					font-size: 24rpx;
					color: #ff534b;
				}

				.panelfiveitemthere {
					margin-top: 12rpx;
					// text:nth-child(1) {
					// 	margin-left: 0;
					// }

					text {
						padding: 4rpx 24rpx;
						background: #f6f6f6;
						border-radius: 8rpx 8rpx 8rpx 8rpx;
						font-family: Source Han Sans CN, Source Han Sans CN;
						font-weight: 400;
						font-size: 20rpx;
						color: #999999;
					}
				}

				.panelfiveitemfour {
					margin-top: 12rpx;
					width: 100%;
					height: 36rpx;
					line-height: 36rpx;
					overflow: hidden; //超出的文本隐藏
					text-overflow: ellipsis; //溢出用省略号显示
					white-space: nowrap; //溢出不换行
					font-family: Source Han Sans CN, Source Han Sans CN;
					font-weight: 400;
					font-size: 24rpx;
					color: #999999;
				}

				.panelfiveitemfive {
					margin-top: 8rpx;
					font-family: Source Han Sans CN, Source Han Sans CN;
					font-weight: 400;
					font-size: 24rpx;
					color: #999999;
				}

				.panelfiveitemsex {
					.panelfiveitemsex_oen {
						display: flex;
						align-items: baseline;

						.tips {
							font-family: Source Han Sans CN, Source Han Sans CN;
							font-weight: 400;
							font-size: 24rpx;
							color: #333333;
						}

						.price {
							font-family: Source Han Sans CN, Source Han Sans CN;
							font-weight: bold;
							font-size: 36rpx;
							color: #333333;
						}

						.originalprice {
							margin-left: 10rpx;
							font-family: Source Han Sans CN, Source Han Sans CN;
							font-weight: 400;
							font-size: 20rpx;
							text-decoration: line-through;
						}

						.unit {
							font-family: Source Han Sans CN, Source Han Sans CN;
							font-weight: 400;
							font-size: 36rpx;
							color: #333333;
						}
					}
				}

				.panelfiveitemNum {
					// position: absolute;
					// bottom: 82rpx;
					// right: 0;
					display: flex;
					align-items: center;
					justify-content: flex-end;

					.sku-wrap {
						padding: 10rpx 20rpx;
						background: #e3ad7f;
						border-radius: 32rpx;
						position: relative;
						align-items: center;
						white-space: nowrap;

						.t {
							font-size: 28rpx;
							color: #fff;
						}

						.dot {
							position: absolute;
							top: -15rpx;
							right: -10rpx;
							background-color: #ff4b33;
							color: #fff;
							border-radius: 58rpx;
							padding: 5rpx 14rpx;
							box-sizing: border-box;
							display: flex;
							align-items: center;
							justify-content: center;
							font-size: 20rpx;
						}
					}

					.Controls {
						display: flex;
						align-items: center;

						.num {
							margin: 8rpx 8rpx 0 8rpx;
						}

						.btn {
							display: flex;
							align-items: center;
							justify-content: center;
							position: relative;

							.btnClick {
								width: 100rpx;
								height: 100rpx;
								position: absolute;
								// bottom: 0;
							}
						}
					}
				}
			}
		}
	}

	.scroll-panel {
		position: relative;

		.list-box {
			display: flex;
			flex-direction: row;
			flex-wrap: nowrap;
			justify-content: flex-start;
			align-items: flex-start;
			align-content: flex-start;
			font-size: 28rpx;
			position: relative;

			.left {
				// width: 200rpx;
				width: 156rpx;
				background-color: #f6f6f6;
				line-height: normal;
				box-sizing: border-box;
				font-size: 32rpx;
				position: sticky;
				top: 0;

				// padding-bottom: 200rpx;
				.item {
					padding: 30rpx 30rpx;
					// height: 92rpx;
					// line-height: 92rpx;
					position: relative;
					font-weight: 400;
					font-size: 24rpx;
					color: #333333;
					display: flex;
					align-items: center;
					// overflow: hidden;
					// text-overflow: ellipsis;
					// white-space: nowrap;

					&+.item {
						margin-top: 1px;

						&::after {
							// content: '';
							// display: block;
							// height: 0;
							// border-top: #d6d6d6 solid 1px;
							// width: 620upx;
							// position: absolute;
							// top: -1px;
							// right: 0;
							// transform: scaleY(0.5);
							/* 1px像素 */
						}
					}

					&.active {
						color: #333;
						background-color: #fff;
						position: relative;

						&::before {
							content: '';
							display: block;
							position: absolute;
							top: 0;
							left: 0;
							border-left: #7e5c23 solid 4px;
							height: 100%;
							width: 0;
						}

						&::after {
							content: '';
							display: block;
							position: absolute;
							top: 0;
							left: -15rpx;
							bottom: 0;
							margin: auto;
							height: 30rpx;
							width: 30rpx;
							border-radius: 50%;
							background-color: #7e5c23;
						}
					}
				}

				.items {
					height: 90px;
					position: relative;
					font-weight: 400;
					font-size: 24rpx;
					color: #333333;
				}

				.fill-last {
					height: 0;
					width: 100%;
					background: none;
				}
			}

			.main {
				background-color: #fff;
				padding-left: 20rpx;
				width: 0;
				flex-grow: 1;
				box-sizing: border-box;
				position: relative;

				.title {
					line-height: normal;
					padding: 30rpx 0;
					font-size: 24rpx;
					font-weight: bold;
					color: #666;
					background-color: #fff;
					position: sticky;
					top: 0;
					z-index: 19;
				}

				.item {
					padding-bottom: 16rpx;
					border-bottom: #eee solid 1px;
				}

				.goods {
					display: flex;
					flex-direction: row;
					flex-wrap: nowrap;
					justify-content: flex-start;
					align-content: center;
					position: relative;

					&+.goods {
						margin-top: 16rpx;
					}

					&>image {
						width: 120rpx;
						height: 120rpx;
						margin-right: 18rpx;
					}

					.goodsImg {
						position: relative;
						width: 200rpx;
						height: 200rpx;
						border-radius: 18rpx;
						flex-shrink: 0;
					}

					.vifgoodsImg {
						width: 200rpx;
						height: 100%;
						position: absolute;
						border-radius: 18rpx;
						top: 0;
						left: 0;
						z-index: 9;
						background-color: rgb(0, 0, 0, 0.5);

						image {
							padding: 30rpx;
							width: 100%;
							height: 100%;
						}
					}

					.topSort {
						width: 92rpx;
						height: 38rpx;
						text-align: center;
						line-height: 38rpx;
						position: absolute;
						top: 0;
						left: 0;
						font-weight: 400;
						font-size: 24rpx;
						color: #ffffff;
						border-radius: 20rpx 0rpx 20rpx 0rpx;
						z-index: 10;
					}

					.topSort.c1 {
						background: #fc5c2e;
					}

					.topSort.c2 {
						background: #ef994e;
					}

					.topSort.c3 {
						background: #f4b951;
					}

					.goods_right {
						width: 100%;
						display: flex;
						flex-direction: column;
						justify-content: space-around;
						position: relative;
						padding-top: 5rpx;
						padding-right: 20rpx;
						padding-left: 18rpx;
						box-sizing: border-box;

						.name {
							font-size: 28rpx;
							color: #333;
							font-weight: bold;
							margin-bottom: 8rpx;
						}

						.describe,
						.monthlySale,
						.lookBack {
							font-weight: 400;
							font-size: 20rpx;
							color: #999999;
							margin-bottom: 8rpx;
						}

						.describe,
						.name {
							width: 270rpx;
							overflow: hidden;
							text-overflow: ellipsis;
							white-space: nowrap;
						}

						.lookBack {
							color: #ff534b;
						}

						.money {
							font-weight: bold;
							font-size: 20rpx;
							color: #333;
							display: flex;
							align-items: baseline;
							white-space: nowrap;

							.money_num {
								font-size: 28rpx;
								color: #333;
								font-weight: bold;
							}
						}

						.suit {
							font-weight: 400;
							font-size: 24rpx;
							color: #666666;
						}

						.sku-wrap {
							padding: 10rpx 20rpx;
							background: #e3ad7f;
							border-radius: 32rpx;
							// position: absolute;
							// bottom: 10rpx;
							// right: 20rpx;
							align-items: center;
							position: relative;

							.t {
								font-size: 24rpx;
								color: #fff;
							}

							.dot {
								position: absolute;
								top: -15rpx;
								right: -10rpx;
								background-color: #ff4b33;
								color: #fff;
								border-radius: 58rpx;
								padding: 5rpx 14rpx;
								box-sizing: border-box;
								display: flex;
								align-items: center;
								justify-content: center;
								font-size: 20rpx;
							}
						}

						.Controls {
							display: flex;
							align-items: center;
							justify-content: flex-end;

							// position: absolute;
							// bottom: 10rpx;
							// right: 20rpx;
							.num {
								margin: auto 16rpx;
							}

							.btn {
								display: flex;
								align-items: center;
								justify-content: center;
								position: relative;

								.btnClick {
									width: 100rpx;
									height: 100rpx;
									position: absolute;
									// bottom: 0;
								}
							}
						}
					}
				}
			}
		}

		.lineThrough {
			font-weight: normal;
			text-decoration: line-through;
			color: #999 !important;
			font-size: 24rpx !important;
		}

		.money_num.lineThrough {}
	}

	.shop_sku {
		width: 100%;
		position: relative;
		border-radius: 20rpx;
		background: #fff;
		box-sizing: border-box;

		.positionabsolute {
			position: absolute;
			top: 30rpx;
			z-index: 999;
			right: 30rpx;
		}

		.shop_sku_name {
			padding: 0 28rpx;
			margin-top: 20rpx;
			font-weight: bold;
			font-size: 32upx;
			margin-bottom: 16rpx;
		}

		.shop_sku_returned {
			padding: 0 28rpx;
			font-weight: 400;
			font-size: 24rpx;
			color: #ff534b;
		}

		.shop_sku_description {
			padding: 0 28rpx;
			font-weight: 400;
			font-size: 24rpx;
			color: #999999;
			margin-top: 16rpx;
			padding-bottom: 32rpx;
			box-sizing: border-box;
			border-bottom: 2rpx solid #f0f0f0;
		}



		.shop_sku_box {
			padding: 20rpx;

			.shop_sku_box_name {
				margin-top: 20rpx;
				font-weight: 500;
				font-size: 28upx;
				color: #333;
			}

			.flex-start {
				.shop_sku_box_item {
					margin-top: 16rpx;
					padding: 12rpx 28rpx;
					border-radius: 8rpx;
					font-size: 24upx;
					margin-right: 56rpx;
					background: #efefef;
					border: 2rpx solid #efefef;
					position: relative;
					color: #666666;

					.shop_sku_box_item_tip {
						width: 62rpx;
						height: 47rpx;
						text-align: right;
						position: absolute;
						top: 0;
						right: 0;
						background: linear-gradient(45deg, transparent, transparent 50%, #cecece 50%, #cecece 100%);

						view {
							font-size: 18rpx;
							color: #666666;
							transform: rotate(45deg);
							position: absolute;
							top: 5rpx;
							right: 3rpx;
						}
					}
				}

				.shop_sku_box_item:nth-child(1) {
					margin-left: 0;
				}

				.disabled {
					color: #999;
					background-color: #f5f5f5;
					border: 2rpx solid #f5f5f5;
				}

				.shop_sku_box_item_noselected {
					color: #666;
				}

				.shop_sku_box_item_selected {
					background: #fefaf7;
					border-radius: 8rpx;
					border: 2rpx solid #e8ad7b;
					color: #e8ad7b;
				}
			}
		}

		.shop_skuselect {
			margin-top: 16rpx;
			width: 100%;
			// background: #f7f7f7;
			color: #999;
			font-size: 24upx;

			.shop_skuselectname {
				color: #000;
				font-size: 26upx;
			}
		}

		.shop_bottom {
			width: 100%;
			box-sizing: border-box;
			padding: 30rpx 28rpx;
			background-color: #fff;
			box-shadow: 0rpx -6rpx 14rpx 2rpx rgba(0, 0, 0, 0.1);

			.price {
				display: flex;
				align-items: flex-end;

				.i {
					font-size: 28rpx;
					color: #e8ad7b;
					position: relative;
					bottom: 4upx;
					font-weight: bold;
				}

				.num {
					font-size: 42rpx;
					color: #e8ad7b;
					position: relative;
					top: 6upx;
					padding: 0 4upx;
				}
			}

			.operation-wrap {
				display: flex;
				align-items: center;

				.num {
					font-size: 32upx;
					padding: 0 16upx;
				}

				.btn {
					display: flex;
					align-items: center;
					justify-content: center;
					position: relative;

					.btnClick {
						width: 100rpx;
						height: 100rpx;
						position: absolute;
						// bottom: 0;
					}
				}
			}

			.addShopping {
				width: 100%;
				height: 96rpx;
				line-height: 96rpx;
				text-align: center;
				background: #ccc;
				border-radius: 48rpx;
				font-weight: 400;
				font-size: 32rpx;
				color: #ffffff;
				margin-top: 36rpx;
			}

			.addShopping.active {
				background: #e8ad7b;
			}
		}
	}

	.shop-info-wrap {
		padding: 0 30rpx 50rpx;
		box-sizing: border-box;

		.info-wrap {
			padding: 30rpx 0;
			box-sizing: border-box;

			.shopName {
				align-self: center;
				font-size: 32rpx;
				color: #333;
				font-weight: bold;
			}
		}

		.info-wrap-title {
			font-size: 32rpx;
			font-weight: bold;
			color: #333;
		}

		.row {
			.col {
				margin-bottom: 10rpx;
			}

			.l,
			.t {
				font-size: 24rpx;
				color: #999;
			}
		}
	}

	.cart-wrap {
		width: 100%;
		padding: 22rpx 54rpx;
		box-sizing: border-box;
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		z-index: 99;
		padding-bottom: calc(env(safe-area-inset-bottom) + 1px);
		background: #ffffff;

		.cart-content {
			display: flex;
			align-items: center;
			// height: 128rpx;
			// padding: 0 36rpx;
			box-sizing: border-box;
			position: relative;
			z-index: 99;

			.left {
				flex: 1;
				display: flex;
				align-items: center;
				position: relative;

				.iconBox {
					position: relative;
				}

				.icon {
					width: 76rpx;
					height: 88rpx;
					margin-left: 22rpx;
				}

				.u-badge {
					position: absolute;
					top: -30rpx;
					right: -30rpx;
					background-color: #ff4b33;
					color: #fff;
					border-radius: 58rpx;
					padding: 5rpx 14rpx;
					box-sizing: border-box;
					display: flex;
					align-items: center;
					justify-content: center;
					font-size: 20rpx;
				}

				.i,
				.num {
					color: #333;
				}

				.i {
					font-size: 28rpx;
					position: relative;
					top: 4upx;
					margin-left: 64rpx;
				}

				.num {
					font-size: 42upx;
					font-weight: bold;
				}
			}

			.btn {
				height: 100%;
				display: flex;
				align-items: center;
				justify-content: flex-end;

				.t {
					width: 160rpx;
					height: 64rpx;
					line-height: 64rpx;
					text-align: center;
					background: #fefaf7;
					border-radius: 36rpx 36rpx 36rpx 36rpx;
					border: 2rpx solid $my-main-color;
					font-weight: bold;
					font-size: 28rpx;
					color: $my-main-color;
				}
			}
		}
	}

	.history_order {
		background-color: #fff;
		padding: 12rpx 16rpx;
		font-size: 24rpx;
		color: #333;
		display: flex;
		align-items: center;
		box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.16);
		position: fixed;
		top: 50%;
		right: 0;
		transform: translateY(-50%);
		border-radius: 100px 0 0 100px;
		z-index: 20;

		.img {
			width: 36rpx;
			margin-right: 8rpx;
			height: 36rpx;
		}
	}

	.old-price {
		color: #999;
		font-size: 24rpx;
		text-decoration: line-through;
		margin-left: 8rpx;
	}

	.relative {
		position: relative;
	}

	.limitDiscount {
		background-color: #fff0f0;
		padding: 8rpx 24rpx;
		white-space: nowrap;
		text-align: center;
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		font-size: 24rpx;
		color: #ffffff;
		border-radius: 0;
		z-index: 9;
		color: #ff1c1c;
	}

	.stock_warning {
		background-color: #F8F8F8;
		padding: 8rpx 24rpx;
		white-space: nowrap;
		text-align: center;
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		font-size: 24rpx;
		color: #333;
		border-radius: 0;
		z-index: 10;
	}

	.select_num_wrap {
		width: 100vw;
		height: 100vh;
		position: relative;

		.top_bg {
			width: 100%;
			height: 100%;
			position: absolute;
			top: 0;
			left: 0;
			z-index: 1;
		}

		.sn-bnottom {
			width: 90vw;
			border-radius: 20upx;
			background-color: #fff;
			position: absolute;
			left: 5vw;
			bottom: 20vw;
			z-index: 2;

			.sn-header {
				height: 120upx;
				display: flex;
				align-items: center;
				justify-content: space-between;
				border-bottom: 1px solid #ececec;
				padding: 0 28upx;

				.t1 {
					color: #333;
					font-size: 32upx;
				}

				.t2 {
					color: #999;
					font-size: 28upx;
				}
			}

			.sn-num-wrap {
				padding: 38upx 28upx;
				border-bottom: 1px solid #ececec;

				.sn-num {
					display: grid;
					grid-template-columns: repeat(5, 1fr);
					gap: 14px;

					.item {
						height: 40px;
						border-radius: 6px;
						background-color: #fef4eb;
						display: flex;
						align-items: center;
						justify-content: center;

						&.active {
							background-color: #e8ad7b;

							.t {
								color: #fff;
							}
						}

						.t {
							color: #333333;
							font-size: 32upx;
						}
					}
				}

				.input {
					display: flex;
					padding-top: 28upx;
				}
			}

			.sn-footer-wrap {
				display: flex;
				gap: 28upx;
				padding: 28upx;

				.btn {
					flex: 1;
				}
			}
		}
	}

	.new-user-discount {
		margin-top: 32rpx;
		color: #ff1c1c;
		font-weight: 700;
		padding-left: 20rpx;
	}

	.fullAmount-activity {
		position: absolute;
		bottom: 100%;
		left: 0;
		font-size: 28rpx;
		right: 0;
		color: #666666;
		background: linear-gradient(90deg, #ffdfe9 0%, #fef4ea 100%);
		padding: 8rpx 78rpx 8rpx 42rpx;

		.price {
			color: #ff1c1c;
		}
	}

	.allDiscountMoney {
		color: #ff1c1c;
		font-size: 12px;
		margin-left: 20rpx;
	}

	.recommand-goods {
		display: flex;
		flex-wrap: wrap;
		margin-top: 24rpx;

		.item {
			display: flex;
			flex-direction: column;
			align-items: center;
			margin-right: 30rpx;
			margin-bottom: 30rpx;
			width: 210rpx;

			&:nth-child(3n) {
				margin-right: 0;
			}

			.name {
				height: 84rpx;
			}

			.info {
				width: 100%;
			}
		}
	}

	.swiper-mask {
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		padding: 32rpx 28rpx;
	}

	.share-btn-box {
		position: absolute;
		right: 8rpx;
		bottom: 14rpx;
	}

	.share-btn {

		padding: 10rpx 32rpx;
		border-radius: 50rpx;
		background: #E3AD7F;
		font-size: 24rpx;
		color: #ffffff;
	}
</style>