<template>
	<view class="dialogBox" v-if="show">
		<view class="dialog" @click="closeDialog()"></view>
		
		<view class="block">
			<view class="head">
				<text>本团商品</text>
				<view class="text" @click="toGroup()">查看团购详情<up-icon name="arrow-right" color="#666" /></view>
			</view>
			<scroll-view scroll-y="true" class="contentBox">
				
				<view class="goods-item" v-for="goods in goodsList" :key="goods.id">
					<template v-if="goods.specs_type === 1">
						<view class="left" @click="getGoodsSkus(goods)">
							<view class="tip" v-if="goods.goods.stock <= 0">已抢光</view>
							<image class="img" :src="goods.face_img" mode="aspectFill"></image>
						</view>
					</template>
					<template v-else>
						<view class="left" @click="can_buy ? openSingleSku(goods) : ''">
							<view class="tip" v-if="goods.goods.stock <= 0">已抢光</view>
							<image class="img" :src="goods.face_img" mode="aspectFill"></image>
						</view>
					</template>
					<view class="right">
						<view @click="getGoodsSkus(goods)">
							<view class="title">
								<view class="kuajing" v-if="goods.goods.is_cross_border === 1">跨境包税</view>
								<view class="kuajing" v-else-if="goods.goods.overseas_direct_mail === 1">海外直邮</view>{{goods.title}}
							</view>
							<view>
								<span v-if="goods.goods.limit_type == 1" class="box_number1">{{goods.goods.start_sale_num}}件起购</span>
								<span v-if="goods.goods.limit_type == 2" class="box_number1">限购{{goods.goods.limit}}件</span>
							</view>
							<view style="display: flex;align-items: center;justify-content: space-between;padding: 10rpx 0;">
								<span class="tites"></span>
								<text class="total" v-if="is_show_sales && info.copy_shared_on === 0">已团{{goods.sales}}</text>
								<text class="total" v-if="is_show_sales && info.copy_shared_on === 1">已团{{goods.goods.sales}}</text>
							</view>
						</view>
						<view style="display: flex;align-items: center;justify-content: space-between;">
							<view style="display: flex;align-items: center;flex-wrap: wrap;">
								
								<!-- 会员下普通价格 -->
								<view class="text text2" v-if="vipOn && goods.vip_price > 0 && (is_vip || (!is_vip && vip_price_show))">
									<view class="price">
										<text class="icon">￥</text>
										<text v-if="goods.specs_type === 0">{{goods.price * 1}}</text>
										<text v-else>
											<text v-if="goods.max_price === goods.min_price">{{goods.min_price * 1}}</text>
											<text v-else>{{goods.min_price * 1}}<text class="st">起</text></text>
										</text>
									</view>
								</view>
								
								<view class="text">
									<!-- 显示会员价 -->
									<view v-if="vipOn && goods.vip_price > 0 && (is_vip || (!is_vip && vip_price_show))" class="vip">
										<view class="vip-tag"><text>会员价&nbsp;￥</text>{{goods.vip_price * 1}}</view>
									</view>
									
									<!-- 显示普通价格 -->
									<view v-else class="vip">
										<view class="price">
											<text class="icon">￥</text>
											<text v-if="goods.specs_type === 0">{{goods.price * 1}}</text>
											<text v-else>
												<text v-if="goods.max_price === goods.min_price">{{goods.min_price * 1}}</text>
												<text v-else>{{goods.min_price * 1}}<text class="st">起</text></text>
											</text>
										</view>
									</view>
								</view>
							</view>
							
							<template v-if="goods.show2">
								<text class="right1" :class="(goods.goods.stock <= 0 || !can_buy) ? 'dis' : ''"
									v-if="info.status !== 3 && info.sold_status !== 2"
									@click="(goods.goods.stock > 0 && can_buy) ? getGoodsSkus(goods) : ''">加入购物车</text>
							</template>
							<template v-if="goods.show1">
								<up-number-box
									v-model="goods.num"
									:min="goods.goods.limit_type == 1 ? parseInt(goods.goods.start_sale_num) : goods.goods.limit_type == 0 ? 1 : 1"
									:max="goods.goods.limit_type == 2 ? parseInt(goods.goods.limit) : goods.goods.limit_type == 0 ? (goods.goods.stock <= 0 ? 0 : goods.goods.stock) : 0"
									@overlimit="plusBtn(goods.goods.limit_type == 1 ? 0 : goods.goods.limit_type == 2 ? 1 : 2, goods.num, goods.goods.limit, (goods.goods.stock <= 0 ? 0 : goods.goods.stock))"
									disabledInput
									bgColor="#f2f3f5"
									:longPress="false"
									:asyncChange="true"
									@change="changeNum($event, goods)">
								</up-number-box>
							</template>
						</view>
					</view>
				</view>
				
				<view v-if="loading" class="loadbox">
					<up-loading-icon text="加载中..." textSize="14"></up-loading-icon>
				</view>
				<view v-if="!loading && !goodsList.length">
					<up-empty mode="list" icon="https://ct-upimg.yx090.com/g.ii090/images/sprite/empty/list.png" text="正在备货中..."></up-empty>
				</view>
			</scroll-view>
			
			<view class="cartBox" :class="showCart ? 'show' : ''">
				<view class="head">
					<text>已选{{number}}件商品</text>
					<view class="close" @click="showCart = false"><up-icon name="close" color="#666" /></view>
				</view>
				<scroll-view scroll-y="true" class="contentBox">
					
					<view class="goods-item" v-for="goods in cartList" :key="goods.id">
						<view class="left">
							<view class="tip" v-if="goods.goods.stock <= 0">已抢光</view>
							<image class="img" :src="goods.goods.pic_url" mode="aspectFill"></image>
						</view>
						<view class="right">
							<view>
								<view class="title">
									<view class="kuajing" v-if="goods.goods.is_cross_border === 1">跨境包税</view>
									<view class="kuajing" v-else-if="goods.goods.overseas_direct_mail === 1">海外直邮</view>{{goods.goods.title}}
								</view>
								<template v-if="goods.goods && goods.goods.sku">
									<view class="sku">{{goods.goods.sku.v1}}</view>
									<view class="sku" v-if="goods.goods.sku.v2">-{{goods.goods.sku.v2}}</view>
									<view class="sku" v-if="goods.goods.sku.v3">-{{goods.goods.sku.v3}}</view>
									<view class="sku" v-if="goods.goods.sku.v4">-{{goods.goods.sku.v4}}</view>
								</template>
									
								<view>
									<span v-if="goods.goods.limit_type == 1" class="box_number1">{{goods.goods.start_sale_num}}件起购</span>
									<span v-if="goods.goods.limit_type == 2" class="box_number1">限购{{goods.goods.limit}}件</span>
								</view>
							</view>
							<view style="display: flex;align-items: center;justify-content: space-between;">
								<view style="display: flex;align-items: center;flex-wrap: wrap;">
									
									<!-- 会员下普通价格 -->
									<view class="text text2" v-if="vipOn && goods.goods.vip_price > 0 && (is_vip || (!is_vip && vip_price_show))">
										<view class="price">
											<text class="icon">￥</text>
											<text>{{goods.goods.price}}</text>
										</view>
									</view>
									
									<view class="text">
										<!-- 显示会员价 -->
										<view v-if="vipOn && goods.goods.vip_price > 0 && (is_vip || (!is_vip && vip_price_show))" class="vip">
											<view class="vip-tag"><text>会员价&nbsp;￥</text>{{goods.goods.vip_price * 1}}</view>
										</view>
										
										<!-- 显示普通价格 -->
										<view v-else class="vip">
											<view class="price">
												<text class="icon">￥</text>
												<text>{{goods.goods.price}}</text>
											</view>
										</view>
									</view>
								</view>
								
								<!-- 步进器 -->
								<view class="stepper">
									<view class="minus flex" @click="minusCart(goods)"><up-icon name="minus" size="12" :color="Color" /></view>
									<view class="num">{{goods.num}}</view>
									<view class="plus flex" @click="plusCart(goods)"><up-icon name="plus" size="12" color="#fff" /></view>
								</view>
								
							</view>
						</view>
					</view>
					
					<view v-if="loading" class="loadbox">
						<up-loading-icon text="加载中..." textSize="14"></up-loading-icon>
					</view>
				</scroll-view>
			</view>
			
			<view class="goods-btn" v-if="!loading">
				<view class="goods-btn-icon" @click="toPage('/pages/order/list/index')">
					<up-icon name="order" size="22" />
					<view>订单</view>
				</view>
				<view class="goods-btn-icon" @click="showCart = !showCart">
					<view class="badge" v-if="number">{{number}}</view>
					<up-icon name="shopping-cart" size="24" />
					<view>购物车</view>
				</view>
				
				<template v-if="goodsList.length !== 0">
					<view class="btn" :class="can_buy ? '' : 'disabled'" @click="can_buy ? toPay() : ''" v-if="info.status !== 3 && info.sold_status === 1 && parseInt(info.total_stock) > 0">
						<text>￥{{cartPrice}}</text>
						<text>跟团购买</text>
					</view>
					
					<view v-if="info.status !== 3 && info.sold_status === 1 && parseInt(info.total_stock) <= 0" class="btn" :class="info.is_subscribe_remind_stock ? 'hui' : ''" @click="arrivalNotice()">
						<text v-if="!info.is_subscribe_remind_stock">到货提醒</text>
						<text v-else>取消到货提醒</text>
					</view>
					
					<view class="btn disabled" v-if="info.status !== 3 && info.sold_status === 2">
						<text>团购已结束</text>
					</view>
					<view class="btn disabled" v-if="info.status === 3">
						<text>团购未发布</text>
					</view>
					<view class="btn" v-if="info.status !== 3 && info.sold_status === 0"
						@click="!info.is_subscribe_remind ? handleSubscrip() : ''" :class="info.is_subscribe_remind ? 'disabled' : ''">
						<view class="item">
							<image
								src="https://ct-upimg.yx090.com/ju8hn6/shop/image/2022/07/01/cuOPd5R1X6MBOOPo7Whc3wfErkvFD3raT9sZnbv9.png"
								mode="widthFix" v-if="!info.is_subscribe_remind"></image>
							<text v-if="!info.is_subscribe_remind">预约提醒</text>
							<text v-else>已提醒</text>
						</view>
						<view class="countDown">
							<up-count-down use-slot :time="startTime" @change="onTimeChange" @finish="timeFinish">
								<text>距开售</text>
								<text v-if="timeData.days > 0">{{ timeData.days }}天</text>
								<text>{{ timeData.hours }}时</text>
								<text>{{ timeData.minutes }}分</text>
								<text>{{ timeData.seconds }}秒</text>
							</up-count-down>
						</view>
					</view>
				</template>
				
				<view v-else class="btn disabled">
					<text>团购已下架</text>
				</view>
			</view>
		</view>
		
		<!-- 单规格 -->
		<single-sku
			:id="singleId"
			:group-id="id"
			:show="showSingleSku"
			:show_stock="show_stock"
			:can-buy="can_buy"
			:short-status="shortStatus"
			@close="showSingleSku = false"
			:sales="sales"
			@refresh="toRefresh">
		</single-sku>
		
		<!-- 多规格 -->
		<choose-sku
			:show-sku="showSku"
			:skus_1="skus_1"
			:sku-info="skuInfo"
			@close="closeSku"
			:type="type"
			@getnum="getnum"
			:show_stock="show_stock"
			:showDetail="true"
			:groupId="id"
			source=""
			:sourceId="0"
			sourceType="normal"
			:can-buy="can_buy"
			:sold-status="orign_status"
			:fenxiang="false"
			:remind-stock="info.is_subscribe_remind_stock"
			:remindTmplId="remindTmplId"
			@remind="goodsRemind"
			:sales="sales"
			:short-status="shortStatus" />
		
		<!-- 有任选几件活动并且与起购数量一致sku弹窗 -->
		<multiple-sku
			:show="showVanSku"
			@close="closeSku"
			@getnum="getnum"
			:show_stock="show_stock"
			:specs-num="specsNum"
			:goodId="goodId"
			:groupId="id"
			source=""
			:sourceId="0"
			sourceType="normal"
			:sold-status="orign_status"
			:fenxiang="false"
			:remind-stock="info.is_subscribe_remind_stock"
			:remindTmplId="remindTmplId"
			:sales="sales"
			@remind="goodsRemind">
		</multiple-sku>
		
	</view>
</template>

<script>
	import { ref, reactive, toRefs, watch } from 'vue'
	import { get, post } from '@/Api/request.js'
	import { showToast, goodsItem, toMiniProgram } from '../common.js'
	import { Style } from '@/utils/list.js'
	import singleSku from '@/components/ktt/singleSku.vue'
	import ChooseSku from '@/components/sku/ChooseSku.vue'
	import multipleSku from '@/components/sku/multiple.vue'
	
	export default {
		components: { singleSku, ChooseSku, multipleSku },
		props: {
			show: {
				type: Boolean,
				default: true
			},
			id: {
				type: Number,
				default: 0
			},
			sales: {
				type: Number,
				default: 0
			}
		},
		setup(props, context) {
			const data = reactive({
				id: 0,
				show: false,
				goodsList: [],
				loading: true,
				can_buy: true,
				Color: uni.getStorageSync('theme_color'),
				priceColor: Style[uni.getStorageSync('theme_index') * 1].priceColor,
				is_show_sales: false,
				info: {},
				vipOn: uni.getStorageSync('vip_on') === 1,
				is_vip: uni.getStorageSync('is_vip'),
				vip_price_show: uni.getStorageSync('vip_price_show') || false,
				tagColor: Style[uni.getStorageSync('theme_index') * 1].tagColor,
				cartList: [],
				number: 0,
				cartPrice: 0,
				type: 1,
				canClick: true,
				remindTmplId: '',
				yuyueTempId: '',
				startTime: '',
				timeData: {},
				orign_status: 0,
				showCart: false,
				showVanSku: false,
				goodId: 0,
				specsNum: 0,
				show_1: true,
				showSingleSku: false,
				singleId: 0,
				show_stock: 0,
				shortStatus: 1
			})
			
			function getInfo(val) {
				data.loading = true
				get(`/api/v1/goods/group/detail/${data.id}`).then((res) => {
					data.info = JSON.parse(JSON.stringify(res.data))
					data.goodsList = JSON.parse(JSON.stringify(res.data.group_goods))
					data.goodsList.forEach((it) => {
						if(it.goods && it.goods.short_status == 0) {
							it.goods.stock = 0
						}
					})
					isRepeat()
					data.can_buy = !res.data.is_new_purchase || (res.data.is_new_purchase && res.user.is_purchase === 0)
					data.is_show_sales = res.data.is_show_sales === 1
					data.show_stock = res.data.shop.show_stock
					data.loading = false
					
					data.orign_status = res.data.sold_status
					if(res.data.sold_status == 2) {
						data.info.sold_status = 1
						data.info.total_stock = 0
						data.goodsList.forEach((it) => {
							it.goods.stock = 0
						})
					}
					// 未到开团时间
					getStartTime()
					
				}).catch(() => {
					data.loading = false
				})
			}
			
			// 获取当前团购购物车数据
			const getCartList = async() => {
				await get('/api/v1/carts', {
					shop_group_goods_id: data.id
				}).then((res) => {
					data.cartList = res.data
					data.number = res.num
					data.cartPrice = res.total_price
					isRepeat()
				})
			}
			
			function getCartNum() {
				get('/api/v1/carts/num').then((res) => {
					let num = Number(res.data.num)
					uni.setStorageSync('cartNum', num)
				})
			}
			
			const isRepeat = () => {
				var list = []
				data.goodsList && data.goodsList.forEach((element, index) => {
					list.push(element.id)
					data.cartList.forEach((item) => {
						if (element.id === item.shop_goods_id) {
							element.num = item.num
						}
					})
				})
				data.cartList.forEach((item) => {
					list.push(item.shop_goods_id)
				})
				Array.prototype.duplicate = function() {
					let tmp = []
					this.concat().sort().sort(function(a, b) {
						if (a == b && tmp.indexOf(a) === -1) tmp.push(a)
					})
					return tmp
				}
				data.goodsList && data.goodsList.forEach((element) => {
					element.show1 = false
					element.show2 = false
					if(list.duplicate().includes(element.id)) {
						if(element.specs_type === 0) {
							element.show1 = true
						} else {
							element.show2 = true
						}
					} else {
						element.show2 = true
					}
					if (element.show1 === element.show2) {
						element.show2 = false
					}
				})
			}
			
			function closeDialog() {
				if(data.showCart) {
					data.showCart = false
				} else {
					close()
				}
			}
			
			function close() {
				context.emit('close')
			}
			
			function toPage(url) {
				uni.navigateTo({ url })
			}
			
			function getRemindTempId() {
				get(`/api/v1/shop/template`, { type: 22 }).then((req) => {
					data.remindTmplId = req.data.template_id
				})
			}
			
			async function toPay() {
				if (data.cartList.length > 0) {
					let cartList = []
					for (let i = 0; i < data.cartList.length; i++) {
						let obj = data.cartList[i]
						if(obj.goods.status !== 1 || obj.goods.sold_status == 2 || (obj.goods.sku && obj.goods.sku.stock <= 0)){
							
						} else {
							cartList.push(obj)
						}
					}
					uni.setStorageSync('shopGoods', cartList)
					uni.navigateTo({
						url: '/pages/pay/index?type=1'
					})
				} else if (data.goodsList.length === 1) {
					if (data.goodsList[0].specs_type == 1) {
						if(data.goodsList[0].goods.show_sku_style == 1 || data.goodsList[0].goods.show_sku_style == 2) {
							data.specsNum = data.goodsList[0].goods.show_sku_style == 1 ? 2 : 3
							data.showVanSku = true
							data.goodId = data.goodsList[0].id
						} else {
							data.type = 2
							getGoodsSku(data.goodsList[0])
						}
					} else {
						if(data.goodsList[0].goods.stock <= 0) {
							return showToast('当前商品已经抢光啦')
						}
						let order = [{
							shop_goods_id: data.goodsList[0].id,
							shop_goods_sku_id: 0,
							num: data.goodsList[0].goods.limit_type == 1 ? data.goodsList[0].goods.start_sale_num : 1,
							shop_group_goods_id: data.id,
							source_id: 0,
							source_type: 'normal'
						}]
						uni.setStorageSync('shopGoods', order)
						uni.navigateTo({
							url: '/pages/pay/index?type=0&source='
						})
					}
				} else {
					showToast('请选择商品')
				}
			}
			
			// 到货提醒
			async function arrivalNotice() {
				// 取消提醒
				if(data.info.is_subscribe_remind_stock) {
					post(`/api/v1/goods/remind/cancel/${data.id}`, {type: 1}).then((res) => {
						data.info.is_subscribe_remind_stock = false
						uni.showToast({
							title: '已取消到货提醒',
							icon: 'none'
						})
					})
				} else {
					toMiniProgram('pages/groups/index?id=' + data.id)
				}
			}
			
			function getYuyueTempId() {
				get(`/api/v1/shop/template`, { type: 20 }).then((req) => {
					data.yuyueTempId = req.data.template_id
				})
			}
			
			// 订阅活动提醒消息
			const handleSubscrip = () => {
				toMiniProgram('pages/groups/index?id=' + data.id)
			}
			
			function getStartTime() {
				if (data.info.sold_status === 0 && data.info.sold_start_time) {
					let startAt = new Date(
						data.info.sold_start_time.replace(/-/g, '/')
					).getTime() // 开始时间
					let nowAt = new Date().getTime() // 当前时间
					let timestamp = startAt - nowAt //计算时间差
					data.startTime = timestamp
				}
			}
			
			function onTimeChange(e) {
				data.timeData = e
			}
			
			function timeFinish() {
				data.info.sold_status = 1
			}
			
			// 购物车-减
			async function minusCart(goods) {
				// 如果商品设置了起购
				if(goods.goods.limit_type == 1) {
					if(goods.num > parseInt(goods.goods.start_sale_num)) {
						goods.num -= 1
					} else if(goods.num == parseInt(goods.goods.start_sale_num)) {
						minusTips(goods)
						return
					} else {
						return
					}
				} else {
					if(goods.num == 1) {
						minusTips(goods)
						return
					} else {
						goods.num -= 1
					}
				}
				await addGroupCart(goods)
				getCartNum()
				getCartList()
			}
			
			function minusTips(goods) {
				uni.showModal({
					title: '提示',
					content: '确定删除该商品吗？',
					confirmColor: '#42b983',
					async success(res) {
						if (res.confirm) {
							goods.num = 0
							await addGroupCart(goods)
							getCartNum()
							getCartList()
						}
					}
				})
			}
			
			// 购物车-加
			async function plusCart(goods) {
				// 如果商品设置了限购
				if(goods.goods.limit_type == 2) {
					if(goods.num < parseInt(goods.goods.limit)) {
						goods.num += 1
					} else {
						return
					}
				} else {
					goods.num += 1
				}
				await addGroupCart(goods)
				getCartNum()
				getCartList()
			}
			
			async function addGroupCart(goods) {
				let params = {
					num: goods.num,
					shop_goods_id: goods.shop_goods_id,
					shop_goods_sku_id: goods.shop_goods_sku_id,
					shop_group_goods_id: goods.shop_group_goods_id,
					source_id: 0,
					source_type: 'normal'
				}
				await post('/api/v1/carts/' + goods.id, params, 'PUT').then((res) => {
					
				})
			}
			
			function toRefresh() {
				data.showSingleSku = false
				getCartNum()
				getCartList()
			}
			
			const { getGoodsSku, showSku, skuInfo, getNum, num, getGoodsSpecs, skus_1 } = goodsItem()
			
			const getGoodsSkus = (goods) => {
				data.shortStatus = goods.goods.short_status
				if(!data.can_buy && goods.specs_type === 0) {
					return
				}
				if(goods.goods.stock <= 0 && goods.specs_type === 0) {
					showToast('商品已被抢光了')
					return
				}
				if(data.can_buy && goods.specs_type === 0) {
					openSingleSku(goods)
					return
				}
				if(goods.goods.show_sku_style == 1 || goods.goods.show_sku_style == 2) {
					data.specsNum = data.goodsList[0].goods.show_sku_style == 1 ? 2 : 3
					data.showVanSku = true
					data.goodId = goods.id
				} else {
					getGoodsSku(goods).then((res) => {
						if (goods.specs_type === 0) {
							if (data.show_1) {
								data.show_1 = false
								getCartList()
								getCartNum()
							}
							setTimeout(() => {
								showToast('已加入购物车')
								data.show_1 = true
							}, 1000)
						}
					})
				}
			}
			
			function openSingleSku(e) {
				data.singleId = e.id
				data.shortStatus = e.goods.short_status
				data.showSingleSku = true
			}
			
			//计步器减数量
			const hanleapp = (e) => {
				var num = (e.num -= 1)
				data.cartList.forEach((res) => {
					if (res.shop_goods_id === e.id) {
						post(`/api/v1/carts/${res.id}`, {
							shop_goods_id: res.shop_goods_id,
							shop_goods_sku_id: res.shop_goods_sku_id,
							num: num,
							shop_group_goods_id: res.shop_group_goods_id,
							source_id: 0,
							source_type: 'normal'
						}, 'PUT').then((res) => {
							getCartList()
							getCartNum()
						})
					}
				})
			}
			
			// 计步器加数量
			const hanleadd = (event, e) => {
				if(data.info.limit_type === 2 && data.number >= data.info.limit) {
					showToast('本团商品限购' + data.info.limit + '件')
					return
				}
				let num = (e.num += 1)
				data.cartList.forEach((res) => {
					if (res.shop_goods_id === e.id) {
						post(`/api/v1/carts/${res.id}`, {
							shop_goods_id: res.shop_goods_id,
							shop_goods_sku_id: res.shop_goods_sku_id,
							num: num,
							shop_group_goods_id: res.shop_group_goods_id,
							source_id: 0,
							source_type: 'normal'
						}, 'PUT').then((res) => {
							getCartList()
							getCartNum()
						})
					}
				})
			}
			
			const plusBtn = (number, index, e, sock) => {
				if (number == 0) {
					showToast('该商品不能低于起购件数')
				} else if (number == 1) {
					if (index == e) {
						showToast('已达到商品限购件数')
					} else if (index > e) {
						showToast('已达到商品限购件数')
					} else if (index != e) {
						showToast('该商品不能低于1件')
					}
				} else {
					if (sock <= 1) {
						showToast('已达到该商品最大件数')
					} else {
						showToast('该商品不能低于1件')
					}
				}
			}
			
			function closeSku() {
				data.type = 1
				showSku.value = false
				data.showVanSku = false
			}
			
			const getnum = () => {
				getStartTime()
				getCartList()
				getNum()
			}
			
			function goodsRemind(flag) {
				data.info.is_subscribe_remind_stock = flag
			}
			
			function toGroup() {
				const pages = getCurrentPages()
				const prevPage = pages[pages.length - 2]
				if(prevPage && prevPage.route == 'pages/groups/index' && prevPage.options.id == data.id) {
					uni.navigateBack({
						delta: 1
					})
				} else {
					uni.navigateTo({
						url: '/pages/groups/index?id=' + data.id
					})
				}
			}
			
			function changeNum(e, goods) {
				// 减按钮
				if(e.value < goods.num && goods.num > 0) {
					let num = (goods.num -= 1)
					data.cartList.forEach((res) => {
						if (res.shop_goods_id === goods.id) {
							post(`/api/v1/carts/${res.id}`, {
								shop_goods_id: res.shop_goods_id,
								shop_goods_sku_id: res.shop_goods_sku_id,
								num: num,
								shop_group_goods_id: res.shop_group_goods_id,
								source_id: 0,
								source_type: 'normal'
							}, 'PUT').then((res) => {
								getCartList()
								getCartNum()
							})
						}
					})
				} else if(e.value > goods.num) { // 加按钮
					if(data.info.limit_type === 2 && data.number >= data.info.limit) {
						showToast('本团商品限购' + data.info.limit + '件')
						return
					}
					let num = (goods.num += 1)
					data.cartList.forEach((res) => {
						if (res.shop_goods_id === goods.id) {
							post(`/api/v1/carts/${res.id}`, {
								shop_goods_id: res.shop_goods_id,
								shop_goods_sku_id: res.shop_goods_sku_id,
								num: num,
								shop_group_goods_id: res.shop_group_goods_id,
								source_id: 0,
								source_type: 'normal'
							}, 'PUT').then((res) => {
								getCartList()
								getCartNum()
							})
						}
					})
				}
			}
			
			watch(props, async (newProps) => {
				if (newProps.show) {
					data.show = true
					data.id = newProps.id * 1
					data.goodsList = []
					await getCartList()
					getInfo()
					// getRemindTempId()
					// getYuyueTempId()
				} else {
					data.show = false
				}
			})
			
			return {
				...toRefs(data),
				getCartList,
				getInfo,
				close,
				toPage,
				toPay,
				arrivalNotice,
				getRemindTempId,
				handleSubscrip,
				getStartTime,
				onTimeChange,
				timeFinish,
				closeDialog,
				minusCart,
				plusCart,
				getCartNum,
				getGoodsSkus,
				getGoodsSku,
				openSingleSku,
				toRefresh,
				hanleapp,
				hanleadd,
				showSku,
				skuInfo,
				closeSku,
				getnum,
				getNum,
				goodsRemind,
				num,
				skus_1,
				getGoodsSpecs,
				plusBtn,
				toGroup,
				changeNum,
				toMiniProgram
			}
		}
	}
</script>

<style lang="scss" scoped>
	.dialogBox{
		width: 100%;
		height: 100vh;
		position: fixed;
		left: 0;
		top: 0;
		z-index: 200;
		overflow: hidden;
		.dialog{
			width: 100%;
			height: 100%;
			background-color: rgba(0, 0, 0, 0.5);
		}
		.block{
			width: 100%;
			position: absolute;
			left: 0;
			bottom: 0;
			background: #fff;
			height: 78vh;
			border-radius: 20rpx 20rpx 0 0;
			overflow: hidden;
			.head{
				color: #333;
				font-size: 30rpx;
				height: 100rpx;
				font-weight: bold;
				display: flex;
				align-items: center;
				justify-content: space-between;
				padding: 0 24rpx;
				border-bottom: 1rpx solid #f0f0f0;
				.text{
					color: #777;
					font-weight: normal;
				}
			}
			.contentBox{
				height: calc(100% - 210rpx);
				overflow-y: auto;
				.goods-item {
					display: flex;
					padding: 24rpx;
					border-bottom: 1rpx solid #f0f0f0;
					.left {
						margin-right: 14rpx;
						width: 200rpx;
						height: 200rpx;
						border-radius: 10px;
						overflow: hidden;
						position: relative;
						.tip {
							position: absolute;
							bottom: 0;
							background: rgba(0, 0, 0, 0.4);
							color: #fff;
							font-size: 24rpx;
							width: 100%;
							text-align: center;
							height: 36rpx;
							line-height: 36rpx;
						}
						.img {
							width: 100%;
							height: 100%;
							background: #999999;
						}
					}
					.right {
						flex-direction: column;
						justify-content: space-between;
						font-size: 30rpx;
						flex: 1;
						display: flex;
						.title {
							color: #2c2c2c;
						}
						.sku{
							font-size: 24rpx;
							color: #999999;
							margin-top: 6rpx;
						}
						.vip {
							display: flex;
							align-items: center;
							color: v-bind('priceColor');
							.price{
								font-size: 34rpx;
								font-weight: bold;
								.icon {
									font-size: 24rpx;
								}
							}
						}
						.total{
							font-size: 28rpx;
							color: v-bind('priceColor');
						}
						.text{
							display: flex;
							justify-content: space-between;
							font-size: 24rpx;
						}
						.btn{
							display: flex;
							justify-content: flex-end;
							text {
								font-size: 28rpx;
								color: #fff;
								background: $Color3;
								border-radius: 5rpx;
								height: 62rpx;
								line-height: 62rpx;
								width: 165rpx;
								text-align: center;
							}
						}
						.box_number1 {
							padding: 2rpx 10rpx;
							border: 1px solid #656565;
							border-radius: 6rpx;
							color: #656565;
							font-size: 24rpx;
						}
						.dis {
							opacity: 0.65;
						}
						.text2 {
							font-size: 36rpx !important;
							color: v-bind('priceColor');
							font-weight: 600;
							margin-right: 10rpx;
							.icon{
								font-weight: normal;
								font-size: 24rpx;
							}
						}
					}
					.vip-tag {
						font-size: 32rpx;
						color: #fbe6c3;
						background: #353648;
						border-radius: 20rpx 0 0 0;
						padding: 8rpx 10rpx;
						line-height: 1;
						text{
							font-size: 22rpx;
						}
					}
					.right1 {
						float: right;
						background: v-bind('Color');
						color: #fff;
						padding: 15rpx 20rpx;
						border-radius: 8rpx;
						font-size: 24rpx;
						white-space: nowrap;
					}
				}
			}
			.cartBox{
				position: absolute;
				top: 78vh;
				left: 0;
				width: 100%;
				height: calc(100% - 100rpx);
				background-color: #fff;
				border-radius: 20rpx 20rpx 0 0;
				transition: all 0.3s;
				z-index: 5;
				&.show{
					top: 0;
				}
				.left{
					width: 200rpx !important;
					height: 200rpx !important;
				}
			}
		}
	}
	.empty{
		width: 100%;
		padding: 120rpx 0;
		text-align: center;
		.img{
			width: 400rpx;
		}
		text{
			display: block;
			font-size: 24rpx;
			color: #aaa;
			margin-top: 20rpx;
		}
	}
	.loadbox{
		padding: 30rpx 0;
		text-align: center;
		color: #666;
	}
	.goods-btn {
		position: fixed;
		bottom: 0;
		display: flex;
		align-items: center;
		width: 100%;
		height: 110rpx;
		background: #ffffff;
		box-shadow: 0rpx 3rpx 20rpx rgba(0, 0, 0, 0.16);
		box-sizing: border-box;
		z-index: 10;
		&-icon {
			font-size: 20rpx;
			width: 100rpx;
			position: relative;
			text-align: center;
			border-right: 2rpx solid #e9e9e9;
			.icon{
				height: 23px;
				width: 23px;
				margin: 0 auto 8rpx;
			}
			.badge{
				position: absolute;
				top: -10rpx;
				left: 60rpx;
				background-color: v-bind('tagColor');
				color: #fff;
				display: inline-block;
				line-height: 1;
				padding: 2px 4px;
				border-radius: 10px;
			}
		}
	
		&-icon:nth-child(2) {
			border: none;
		}
	
		.btn {
			display: flex;
			align-items: center;
			justify-content: center;
			flex-direction: column;
			flex: 1;
			height: 100%;
			color: #fff;
			background: v-bind('Color');
			font-size: 34rpx;
			line-height: inherit;
			border-radius: 0;
			&.hui{
				opacity: 0.65;
				color: #eee;
			}
			.item {
				display: flex;
				align-items: center;
				image {
					width: 35rpx;
				}
			}
		}
		.disabled{
			opacity: 0.7;
		}
		.countDown{
			text{
				color: #fff;
				font-size: 28rpx;
			}
		}
	}
	.stepper{
		display: flex;
		align-items: center;
		.flex{
			width: 40rpx;
			height: 40rpx;
			box-sizing: border-box;
			border-radius: 4rpx;
		}
		.num{
			width: 80rpx;
			font-size: 28rpx;
			text-align: center;
		}
		.minus{
			border: 1px solid v-bind('Color');
		}
		.plus{
			background-color: v-bind('Color');
		}
	}
	.flex{
		display: flex;
		align-items: center;
		justify-content: center;
	}
</style>
