<template>
	<view class="pages-product">
		<block v-if="isload">
			<block v-if="sysset.showgzts">
				<view style="width:100%;height:88rpx"> </view>
				<view class="follow_topbar">
					<view class="headimg">
						<image :src="sysset.logo" />
					</view>
					<view class="info">
						<view class="i">欢迎进入 <text :style="{color:t('color1')}">{{sysset.name}}</text></view>
						<view class="i">关注公众号享更多专属服务</view>
					</view>
					<view class="sub" @tap="showsubqrcode" :style="{'background-color':t('color1')}">立即关注</view>
				</view>
				<uni-popup id="qrcodeDialog" ref="qrcodeDialog" type="dialog">
					<view class="qrcodebox">
						<image :src="sysset.qrcode" @tap="previewImage" :data-url="sysset.qrcode" class="img" />
						<view class="txt">长按识别二维码关注</view>
						<view class="close" @tap="closesubqrcode">
							<image :src="event_rul +'/static/img/static/img/close2.png'" style="width:100%;height:100%" />
						</view>
					</view>
				</uni-popup>
			</block>
			<view
			v-if="bboglist.length>0"
				style="position:fixed;top:5vh;left:20rpx;z-index:9;background:rgba(153,153,153,0.8);border-radius:20rpx;color:#fff;padding:0 10rpx">
				<swiper style="position:relative;height:54rpx;width:350rpx;" :autoplay="true" :interval="5000"
					:vertical="true">
					<swiper-item v-for="(item, index) in bboglist" :key="index" @tap="goto"
						:data-url="'/pages/shop/product?id=' + item.proid" class="flex-y-center">
						<image :src="item.headimg"
							style="width:40rpx;height:40rpx;border:1px solid rgba(255,255,255,0.7);border-radius:50%;margin-right:4px" />
						<view
							style="width:300rpx;white-space:nowrap;overflow:hidden;text-overflow: ellipsis;font-size:22rpx">
							{{item.nickname}} {{item.showtime}}购买了该商品</view>
					</swiper-item>
				</swiper>
			</view>
			<view class="swiper-container" v-if="isplay==0">
				<swiper class="swiper" :indicator-dots="false" :autoplay="true" :interval="5000" @change="swiperChange">
					<block v-for="(item, index) in product.pics" :key="index">
						<swiper-item class="swiper-item">
							<view class="swiper-item-view">
								<image class="img" @click="preImg(product.pics,index)" :src="item" mode="widthFix" />
							</view>
						</swiper-item>
					</block>
				</swiper>
				<view class="imageCount">{{current+1}}/{{(product.pics).length}}</view>
				<view v-if="product.video" class="provideo" @tap="payvideo">
					<image :src="event_rul +'/static/img/static/img/video.png'" />
					<view class="txt">{{product.video_duration}}</view>
				</view>
			</view>
			<view class="videobox" v-if="isplay==1">
				<video autoplay="true" class="video" id="video" :src="product.video"></video>
				<view class="parsevideo" @tap="parsevideo">退出播放</view>
			</view>
			<view class="product-detail__con">
				<view class="product-detail__info">
					<view class="info-hd flex al-item-center j-between">
						<view class="price flex al-item-center">
							<view class="current" :class="{'small-current': product.max_price!=product.min_price}">
								<text class="symbol">￥</text>{{product.min_price}}<text
									v-if="product.max_price!=product.min_price">-{{product.max_price}}</text>
							</view>
							<view class="original" v-if="product.market_price*1 > product.sell_price*1">
								￥{{product.market_price}}<text v-if="product.max_price!=product.min_price">起</text>
							</view>
							<view class="txt" v-if="shopset.hide_sales != 1">
								销量：{{product.sales}}
							</view>
							<view class="txt" v-if="shopset.hide_sales != 1">
								库存：{{product.stock}}
							</view>
						</view>
						<view class="info-hd__btn flex al-item-center j-between" @tap="showcuxiaodetail" v-if="couponlist.length>0">
							<view class="btn-txt">领券</view>
							<view class="icon-box flex al-item-center j-center">
								<text class="iconfont icon-arrow-right"></text>
							</view>
						</view>
					</view>
					<view class="info-bd">{{product.name}}</view>
					<view class="info-ft flex">
						<!-- <view class="playback">
							<text class="iconfont icon-shipin"></text>
							<text class="playback-txt">点击直播回放</text>
						</view> -->
						<view class="share" @tap="shareClick">
							<text class="iconfont icon-fenxiang"></text>
							<text class="share-txt">分享</text>
						</view>
					</view>
					<view class="sellpoint" v-if="product.sellpoint">{{product.sellpoint}}</view>
					<view class="commission" :style="{background:'rgba('+t('color1rgb')+',0.1)',color:t('color1')}"
						v-if="shopset.showcommission==1 && product.commission > 0">分享好友购买预计可得{{t('佣金')}}：<text
							style="font-weight:bold;padding:0 2px">{{product.commission}}</text>{{product.commission_desc}}
					</view>
					<view style="margin:20rpx 0;color:#333;font-size:22rpx" v-if="product.balance_price > 0">
						首付款金额：{{product.advance_price}}元，尾款金额：{{product.balance_price}}元</view>
					<view style="margin:20rpx 0;color:#666;font-size:22rpx" v-if="product.buyselect_commission > 0">
						下单被选奖励预计可得{{t('佣金')}}：<text
							style="font-weight:bold;padding:0 2px">{{product.buyselect_commission}}</text>元</view>

					<view class="upsavemoney"
						:style="{background:'linear-gradient(90deg, rgb(255, 180, 153) 0%, #ffcaa8 100%)',color:'#653a2b'}"
						v-if="product.upsavemoney > 0">
						<view class="flex1">升级到 {{product.nextlevelname}} 预计可节省<text
								style="font-weight:bold;padding:0 2px;color:#ca4312">{{product.upsavemoney}}</text>元
						</view>
						<view style="margin-left:20rpx;font-weight:bold;display:flex;align-items:center;color:#ca4312"
							@tap="goto" data-url="/pages/my/levelup">立即升级
							<!-- <image :src="event_rul +'/static/img/static/img/arrowright2.png'" style="width:30rpx;height:30rpx"/> -->
							<text class="iconfont icon-arrow-right"></text>
						</view>
					</view>
				</view>
				<view class="choose" @tap="buydialogChange" data-btntype="2">
					<view class="f0">规格</view>
					<view class="f1 flex1">请选择商品规格及数量</view>
				</view>
				
				<view class="cuxiaodiv" v-if="product.givescore > 0">
					<view class="cuxiaopoint">
						<view class="f0">送{{t('积分')}}</view>
						<view class="f1" style="font-size:26rpx">购买可得{{t('积分')}}{{product.givescore}}个</view>
					</view>
				</view>

				<view class="cuxiaodiv"
					v-if="cuxiaolist.length>0 || couponlist.length>0 || fuwulist.length>0 || product.discount_tips!=''">
					<view class="fuwupoint cuxiaoitem" v-if="fuwulist.length>0">
						<view class="f0">服务</view>
						<view class="f1" @tap="showfuwudetail">
							<view class="t" v-for="(item, index) in fuwulist" :key="index">{{item.name}}</view>
						</view>
						<view class="f2" @tap="showfuwudetail">
							<!-- <image :src="event_rul +'/static/img/static/img/arrow-point.png'" mode="widthFix"/> -->
							<text class="iconfont icon-arrow-right"></text>
						</view>
					</view>
					<view class="cuxiaopoint cuxiaoitem" v-if="cuxiaolist.length>0">
						<view class="f0">促销</view>
						<view class="f1" @tap="showcuxiaodetail">
							<view v-for="(item, index) in cuxiaolist" :key="index" class="t"
								:style="{background:'rgba('+t('color1rgb')+',0.1)',color:t('color1')}"><text
									class="t0">{{item.tip}}</text><text class="t1">{{item.name}}</text></view>
						</view>
						<view class="f2" @tap="showcuxiaodetail">
							<!-- <image :src="event_rul +'/static/img/static/img/arrow-point.png'" mode="widthFix"/> -->
							<text class="iconfont icon-arrow-right"></text>
						</view>
					</view>
					<view class="cuxiaopoint cuxiaoitem" v-if="product.discount_tips!=''">
						<view class="f0">折扣</view>
						<view class="f1" style="padding-left:10rpx">{{product.discount_tips}}</view>
						<view class="f2" @tap="goto" data-url="/pages/my/levelinfo">
							<!-- <image :src="event_rul +'/static/img/static/img/arrow-point.png'" mode="widthFix"/> -->
							<text class="iconfont icon-arrow-right"></text>
						</view>
					</view>
				</view>
				<view v-if="showfuwudialog" class="popup__container">
					<view class="popup__overlay" @tap.stop="hidefuwudetail"></view>
					<view class="popup__modal">
						<view class="popup__title">
							<text class="popup__title-text">服务</text>
							<image :src="event_rul +'/static/img/static/img/close.png'" class="popup__close" style="width:36rpx;height:36rpx"
								@tap.stop="hidefuwudetail" />
						</view>
						<view class="popup__content">
							<view v-for="(item, index) in fuwulist" :key="index" class="service-item">
								<view class="fuwudialog-content">
									<view class="f1">{{item.name}}</view>
									<text class="f2">{{item.desc}}</text>
								</view>
							</view>
						</view>
					</view>
				</view>
				<view v-if="showcuxiaodialog" class="popup__container">
					<view class="popup__overlay" @tap.stop="hidecuxiaodetail"></view>
					<view class="popup__modal">
						<view class="popup__title">
							<text class="popup__title-text">优惠促销</text>
							<image :src="event_rul +'/static/img/static/img/close.png'" class="popup__close" style="width:36rpx;height:36rpx"
								@tap.stop="hidecuxiaodetail" />
						</view>
						<view class="popup__content">
							<view v-for="(item, index) in cuxiaolist" :key="index" class="service-item">
								<view class="suffix">
									<view class="type-name"><text
											style="border-radius:4px;border:1px solid #f05423;color: #ff550f;font-size:20rpx;padding:2px 5px">{{item.tip}}</text>
										<text style="color:#333;margin-left:20rpx">{{item.name}}</text></view>
								</view>
							</view>
							<couponlist :couponlist="couponlist" @getcoupon="getcoupon"></couponlist>
						</view>
					</view>
				</view>
				<view class="commentbox" v-if="shopset.comment==1 && commentcount > 0">
					<view class="commentbox-hd flex al-item-center j-between">
						<view class="commentbox-hd__title">用户评价({{commentcount}})
						</view>
						<view class="commentbox-hd__more flex al-item-center" @tap="goto"
							:data-url="'commentlist?proid=' + product.id">查看全部
							<text class="iconfont icon-arrow-right"></text>
						</view>
					</view>
					<view class="commentbox-bd">
						<view class="commentbox-bd__item" v-if="commentlist.length>0">
							<view class="item-hd flex al-item-center j-between">
								<view class="item-hd__userInfo flex al-item-center">
									<image class="item-hd__userInfo-img" :src="commentlist[0].headimg" />
									<view class="item-hd__userInfo-bd">
										<view>
											<view class="item-hd__userInfo-name">{{commentlist[0].nickname}}</view>
										</view>
										<view class="item-hd__userInfo-time">
											{{commentlist[0].createtime}}
										</view>
									</view>
								</view>
								<view class="item-hd__userInfo-ft">
									<image class="grade-star" v-for="(item2,index2) in [0,1,2,3,4]" :key="index2"
										:src="event_rul +'/static/img/static/img/star' + (commentlist[0].score>item2?'2':'') + '.png'" />
								</view>
							</view>

							<view class="item-bd">
								<text class="item-bd__txt">{{commentlist[0].content}}</text>
								<view class="item-bd__imgs">
									<block v-if="commentlist[0].content_pic!=''">
										<block v-for="(itemp, index) in commentlist[0].content_pic" :key="index">
											<view @tap="previewImage" :data-url="itemp"
												:data-urls="commentlist[0].content_pic">
												<image :src="itemp"/>
											</view>
										</block>
									</block>
								</view>
							</view>
							<!-- <view class="f3" @tap="goto" :data-url="'commentlist?proid=' + product.id">查看全部评价</view> -->
						</view>
						<view v-else class="nocomment">暂无评价~</view>
					</view>
				</view>

				<view class="detail_title">
					<image class="icon2" :src="event_rul +'/static/images/title-decorate.svg'" mode=""></image>
					<view class="t0">商品描述</view>
					<image class="icon2" :src="event_rul +'/static/images/title-decorate.svg'" mode=""></image>
				</view>
				<view class="detail">
					<dp :pagecontent="pagecontent"></dp>
				</view>

				<!-- <view class="detail_title"><view class="t1"></view><view class="t2"></view><view class="t0">猜你喜欢</view><view class="t2"></view><view class="t1"></view></view> -->
				<view class="detail_title">
					<image class="icon2" :src="event_rul +'/static/images/title-decorate.svg'" mode=""></image>
					<view class="t0">猜你喜欢</view>
					<image class="icon2" :src="event_rul +'/static/images/title-decorate.svg'" mode=""></image>
				</view>
				<!-- <dp-product-itemlist :data="loveList"  :menuindex="-1"></dp-product-itemlist> -->
				<dp-product-item  :data="loveList" :menuindex="-1"></dp-product-item>
				<view class="bottombar flex-row" :class="menuindex>-1?'tabbarbot':''"
					v-if="product.status==1">
					<view class="f1">
						<view class="item" @tap="goto" :data-url="product.bid== 0 ? '/pages/index/index':'/pagesA/shop/index?id=' + product.bid">
							<!-- <image class="img" :src="event_rul +'/static/img/static/img/kefu.png'" /> -->
							<text class="iconfont" :class="product.bid == 0 ? 'icon-shouye1' : 'icon-dianpu1'" style="font-size: 40rpx; margin-bottom: 3rpx;"></text>
							<view class="t1">{{product.bid == 0 ? '首页' : '店铺'}}</view>
						</view>
					<!-- 	<button class="item" v-else open-type="contact">
							<image class="img" :src="event_rul +'/static/img/static/img/kefu.png'" />
							<view class="t1">客服</view>
						</button> -->
						<!-- 	<view class="item flex1" @tap="goto" data-url="/pages/shop/cart">
	 						<image class="img" :src="event_rul +'/static/img/static/img/gwc.png'"/>
	 						<view class="t1">购物车</view>
	 						<view class="cartnum" v-if="cartnum>0" :style="{background:'rgba('+t('color1rgb')+',0.8)'}">{{cartnum}}</view>
	 					</view> -->
						<view class="item" @tap="addfavorite">
							<!-- <image class="img" :src="event_rul +'/static/img/static/img/shoucang.png'" />
							 -->
							 <text class="iconfont icon-shoucang" v-if="!isfavorite" style="font-size: 40rpx; margin-bottom: 3rpx;"></text>
							 <text class="iconfont icon-Collection" v-else style="color:#0A5D3B; font-size: 40rpx; margin-bottom: 3rpx;"></text>
							<view class="t1">{{isfavorite?'已收藏':'收藏'}}</view>
						</view>
					</view>
					<view class="op">
						<view class="tocart flex-x-center flex-y-center"
							@tap="buydialogChange" data-btntype="1"
							v-if="product.freighttype!=3 && product.freighttype!=4">加入购物车</view>
						<view class="tobuy flex-x-center flex-y-center"
							@tap="buydialogChange" data-btntype="2">立即购买</view>
					</view>
				</view>
				<buydialog v-if="buydialogShow" :proid="product.id" :btntype="btntype"
					@buydialogChange="buydialogChange" :menuindex="menuindex" @addcart="addcart" @cartPuch="cartPuch" :showtaos="1"></buydialog>
				<cart-full v-if="showPurchase" @closePur="closePur" :purchaseDetail="purchaseDetail" :goodscart="goodscart"></cart-full>
				<scrolltop :isshow="scrolltopshow"></scrolltop>

				<view v-if="sharetypevisible" class="popup__container">
					<view class="popup__overlay" @tap.stop="handleClickMask"></view>
					<view class="popup__modal" style="height:320rpx;min-height:320rpx">
						<!-- <view class="popup__title">
	 						<text class="popup__title-text">请选择分享方式</text>
	 						<image :src="event_rul +'/static/img/static/img/close.png'" class="popup__close" style="width:36rpx;height:36rpx" @tap.stop="hidePstimeDialog"/>
	 					</view> -->
						<view class="popup__content">
							<view class="sharetypecontent">
								<view class="f1" @tap="shareapp" v-if="getplatform() == 'app'">
									<image class="img" :src="event_rul +'/static/img/static/img/weixin.png'" />
									<text class="t1">分享给好友</text>
								</view>
								<view class="f1" @tap="sharemp" v-else-if="getplatform() == 'mp'">
									<image class="img" :src="event_rul +'/static/img/static/img/weixin.png'" />
									<text class="t1">分享给好友</text>
								</view>
								<view class="f1" @tap="sharemp" v-else-if="getplatform() == 'h5'">
									<image class="img" :src="event_rul +'/static/img/static/img/weixin.png'" />
									<text class="t1">分享给好友</text>
								</view>
								<button class="f1" open-type="share" v-else>
									<image class="img" :src="event_rul +'/static/img/static/img/weixin.png'" />
									<text class="t1">分享给好友</text>
								</button>
								<view class="f2" @tap="showPoster">
									<image class="img" :src="event_rul +'/static/img/static/img/sharepic.png'" />
									<text class="t1">生成分享图片</text>
								</view>
							</view>
						</view>
					</view>
				</view>
				<view class="posterDialog" v-if="showposter">
					<view class="main">
						<view class="close" @tap="posterDialogClose">
							<image class="img" :src="event_rul +'/static/img/static/img/close.png'" />
						</view>
						<view class="content">
							<image class="img" :src="posterpic" mode="widthFix" @tap="previewImage"
								:data-url="posterpic"></image>
						</view>
					</view>
				</view>
			</view>

			<!-- new add -->
			<view class="right_car" @tap="goto" data-url="/pages/shop/cart">
				<text class="iconfont icon-gouwuche1" style="font-size: 42rpx; font-weight: bold; color: #0A5D3B;"></text>
			</view>

		</block>
		<loading v-if="loading"></loading>
		<dp-tabbar :opt="opt" @getmenuindex="getmenuindex"></dp-tabbar>
		<popmsg ref="popmsg"></popmsg>
		
		<view class="hitn-n position-f" v-show="hintShow">
			<view class="hint-bx position-a">
				<image class="hint-img" :src="event_rul + '/static/images/hint-n.png'" mode="widthFix"></image>
				<view class="content position-a  flex flex-colum al-item-center">
					<text class="title font-w">温馨提示</text>
					<text class="text">该商品已下架！</text>
				</view>
			</view>
		</view>
		<!-- 悬浮按钮 -->
		<drag-button></drag-button>
	</view>
</template>

<script>
	var app = getApp();
	var interval = null;

	export default {
		data() {
			return {
				loveList: [],
				opt: {},
				loading: false,
				isload: false,
				menuindex: -1,
				textset: {},
				isload: false,
				buydialogShow: false,
				btntype: 1,
				isfavorite: false,
				current: 0,
				isplay: 0,
				showcuxiaodialog: false,
				showfuwudialog: false,
				business: "",
				product: [],
				cartnum: "",
				commentlist: "",
				commentcount: "",
				cuxiaolist: "",
				couponlist: "",
				fuwulist: [],
				pagecontent: "",
				shopset: {},
				sysset: {},
				title: "",
				bboglist: "",
				sharepic: "",
				sharetypevisible: false,
				showposter: false,
				posterpic: "",
				scrolltopshow: false,
				kfurl: '',
				showPurchase: false,
				purchaseDetail: {},
				goodscart: {},
				
				event_rul: app.globalData.event_url,
				
				hintShow:false,
				hintTime: null,
			};
		},
		onLoad: function(opt) {
			this.opt = app.getopts(opt);
			this.getdata();
		},
		onPullDownRefresh: function() {
			this.getdata();
		},
		onShareAppMessage: function() {
			return this._sharewx({
				title: this.product.sharetitle || this.product.name,
				pic: this.product.sharepic || this.product.pic
			});
		},
		onShareTimeline: function() {
			var sharewxdata = this._sharewx({
				title: this.product.sharetitle || this.product.name,
				pic: this.product.sharepic || this.product.pic
			});
			var query = (sharewxdata.path).split('?')[1];
			console.log(sharewxdata)
			console.log(query)
			return {
				title: sharewxdata.title,
				imageUrl: sharewxdata.imageUrl,
				query: query
			}
		},
		onUnload: function() {
			clearInterval(interval);
			clearTimeout(this.hintTime)
		},

		methods: {
	
			cartPuch(e) {
				this.purchaseDetail = e
				this.showPurchase = true
				
			},
			// 关闭购物车满弹框
			closePur(e) {
				this.showPurchase = e
			},
			preImg(arr,index){
				console.log(arr,'weism')
				uni.previewImage({urls:arr,current:index})
			},
	
			getdata: function() {
				var that = this;
				var id = this.opt.id || 0;
				that.loading = true;
				app.get('ApiShop/product', {
					id: id
				}, function(res) {
					that.loading = false;

					if (res.status == 0) {
						// app.alert(res.msg);
						that.hintShow = true
						that.hintTime = setTimeout(() => {
							that.hintShow = false
							uni.navigateBack()
						}, 2000)
						return;
					}
					that.loveList = res.loveList;
					that.textset = app.globalData.textset;
					var product = res.product;
					var pagecontent = JSON.parse(product.detail);
					that.business = res.business;
					that.product = product;
					that.cartnum = res.cartnum;
					that.commentlist = res.commentlist;
					that.commentcount = res.commentcount;
					that.cuxiaolist = res.cuxiaolist;
					that.couponlist = res.couponlist;
					that.fuwulist = res.fuwulist;
					that.pagecontent = pagecontent;
					that.shopset = res.shopset;
					that.sysset = res.sysset;
					that.title = product.name;
					that.isfavorite = res.isfavorite;
					that.bboglist = res.bboglist;
					that.sharepic = product.pics[0];
					uni.setNavigationBarTitle({
						title: product.name
					});

					that.kfurl = '/pages/kefu/index?bid=' + product.bid;
					if (app.globalData.initdata.kfurl != '') {
						that.kfurl = app.globalData.initdata.kfurl;
					}
					that.loaded({
						title: product.sharetitle || product.name,
						pic: product.sharepic || product.pic,
						desc: product.sharedesc || product.sellpoint
					});
				});
			},
			swiperChange: function(e) {
				var that = this;
				that.current = e.detail.current
			},
			payvideo: function() {
				this.isplay = 1;
				uni.createVideoContext('video').play();
			},
			parsevideo: function() {
				this.isplay = 0;
				uni.createVideoContext('video').stop();
			},
			buydialogChange: function(e) {
				if (!this.buydialogShow) {
					this.btntype = e.currentTarget.dataset.btntype
				}
				this.buydialogShow = !this.buydialogShow;
			},
			//收藏操作
			addfavorite: function() {
				var that = this;
				var proid = that.product.id;
				app.post('ApiShop/addfavorite', {
					proid: proid,
					type: 'shop'
				}, function(data) {
					if (data.status == 1) {
						that.isfavorite = !that.isfavorite;
					}
					app.success(data.msg);
				});
			},
			shareClick: function() {
				this.sharetypevisible = true;
			},
			handleClickMask: function() {
				this.sharetypevisible = false
			},
			showPoster: function() {
				var that = this;
				that.showposter = true;
				that.sharetypevisible = false;
				app.showLoading('生成海报中');
				app.post('ApiShop/getposter', {
					proid: that.product.id
				}, function(data) {
					app.showLoading(false);
					if (data.status == 0) {
						app.alert(data.msg);
					} else {
						that.posterpic = data.poster;
					}
				});
			},
			posterDialogClose: function() {
				this.showposter = false;
			},
			showfuwudetail: function() {
				this.showfuwudialog = true;
			},
			hidefuwudetail: function() {
				this.showfuwudialog = false
			},
			showcuxiaodetail: function() {
				this.showcuxiaodialog = true;
			},
			hidecuxiaodetail: function() {
				this.showcuxiaodialog = false
			},
			getcoupon: function() {
				this.showcuxiaodialog = false;
				this.getdata();
			},
			onPageScroll: function(e) {
				var that = this;
				var scrollY = e.scrollTop;
				if (scrollY > 200) {
					that.scrolltopshow = true;
				}
				if (scrollY < 150) {
					that.scrolltopshow = false
				}
			},
			sharemp: function() {
				app.error('点击右上角发送给好友或分享到朋友圈');
				this.sharetypevisible = false
			},
			shareapp: function() {
				var that = this;
				that.sharetypevisible = false;
				uni.showActionSheet({
					itemList: ['发送给微信好友', '分享到微信朋友圈'],
					success: function(res) {
						if (res.tapIndex >= 0) {
							var scene = 'WXSceneSession';
							if (res.tapIndex == 1) {
								scene = 'WXSenceTimeline';
							}
							var sharedata = {};
							sharedata.provider = 'weixin';
							sharedata.type = 0;
							sharedata.scene = scene;
							sharedata.title = that.product.sharetitle || that.product.name;
							sharedata.summary = that.product.sharedesc || that.product.sellpoint;
							sharedata.href = app.globalData.pre_url + '/h5/' + app.globalData.aid +
								'.html#/pages/shop/product?scene=id_' + that.product.id + '-pid_' + app
								.globalData.mid;
							sharedata.imageUrl = that.product.pic;
							var sharelist = app.globalData.initdata.sharelist;
							if (sharelist) {
								for (var i = 0; i < sharelist.length; i++) {
									if (sharelist[i]['indexurl'] == '/pages/shop/product') {
										sharedata.title = sharelist[i].title;
										sharedata.summary = sharelist[i].desc;
										sharedata.imageUrl = sharelist[i].pic;
										if (sharelist[i].url) {
											var sharelink = sharelist[i].url;
											if (sharelink.indexOf('/') === 0) {
												sharelink = app.globalData.pre_url + '/h5/' + app
													.globalData.aid + '.html#' + sharelink;
											}
											if (app.globalData.mid > 0) {
												sharelink += (sharelink.indexOf('?') === -1 ? '?' : '&') +
													'pid=' + app.globalData.mid;
											}
											sharedata.href = sharelink;
										}
									}
								}
							}
							uni.share(sharedata);
						}
					}
				});
			},
			showsubqrcode: function() {
				this.$refs.qrcodeDialog.open();
			},
			closesubqrcode: function() {
				this.$refs.qrcodeDialog.close();
			},
			addcart: function(e) {
				console.log(e)
				this.cartnum = this.cartnum + e.num;
				this.goodscart = e
			}

		}

	};
</script>
<style lang="scss">
.pages-product {
	min-height: 100vh;
	box-sizing: border-box;
	background: #F5F5F5;
	padding-bottom: calc(124rpx + constant(safe-area-inset-bottom));
	padding-bottom: calc(124rpx + env(safe-area-inset-bottom));
}
	.icon2 {
		height: 26rpx;
		width: 50rpx;
	}

	.info_live {
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: 26rpx;
		margin-top: 20rpx;
		color: #999;

		.left {
			display: flex;

			.icon {
				padding: 0 10rpx;
				border-radius: 6rpx;
				color: #fff;
				background-color: #f3bf72;
				margin-right: 16rpx;
			}
		}

		.right {
			display: flex;

			.iconfont {
				margin-right: 16rpx;
			}
		}
	}

	.right_car {
		position: fixed;
		padding: 15rpx;
		top: 4vh;
		right: 30rpx;
		width: 80rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		z-index: 2;
		background-color: #e2f7ef;
		height: 80rpx;
		border-radius: 80rpx;
		box-shadow: 0 0 10rpx 0 #ccc;

		image {
			height: 100%;
			width: 100%;
		}
	}

	.follow_topbar {
		height: 88rpx;
		width: 100%;
		max-width: 640px;
		background: rgba(0, 0, 0, 0.8);
		position: fixed;
		top: 0;
		z-index: 13;
	}

	.follow_topbar .headimg {
		height: 64rpx;
		width: 64rpx;
		margin: 6px;
		float: left;
	}

	.follow_topbar .headimg image {
		height: 64rpx;
		width: 64rpx;
	}

	.follow_topbar .info {
		height: 56rpx;
		padding: 16rpx 0;
	}

	.follow_topbar .info .i {
		height: 28rpx;
		line-height: 28rpx;
		color: #ccc;
		font-size: 24rpx;
	}

	.follow_topbar .info {
		height: 80rpx;
		float: left;
	}

	.follow_topbar .sub {
		height: 48rpx;
		width: auto;
		background: #FC4343;
		padding: 0 20rpx;
		margin: 20rpx 16rpx 20rpx 0;
		float: right;
		font-size: 24rpx;
		color: #fff;
		line-height: 52rpx;
		border-radius: 6rpx;
	}

	.qrcodebox {
		background: #fff;
		padding: 50rpx;
		position: relative;
		border-radius: 20rpx
	}

	.qrcodebox .img {
		width: 400rpx;
		height: 400rpx
	}

	.qrcodebox .txt {
		color: #666;
		margin-top: 20rpx;
		font-size: 26rpx;
		text-align: center
	}

	.qrcodebox .close {
		width: 50rpx;
		height: 50rpx;
		position: absolute;
		bottom: -100rpx;
		left: 50%;
		margin-left: -25rpx;
		border: 1px solid rgba(255, 255, 255, 0.5);
		border-radius: 50%;
		padding: 8rpx
	}

	.swiper-container {
		position: relative;
		height: 750rpx;
		overflow: hidden;
	}

	.swiper {
		width: 100%;
		height: 750rpx;
		overflow: hidden;
	}

	.swiper-item-view {
		width: 100%;
		height: 750rpx;
	}

	.swiper .img {
		width: 100%;
		height: 750rpx;
		overflow: hidden;
	}

	.imageCount {
		width: 100rpx;
		height: 50rpx;
		background-color: rgba(0, 0, 0, 0.3);
		border-radius: 40rpx;
		line-height: 50rpx;
		color: #fff;
		text-align: center;
		font-size: 26rpx;
		position: absolute;
		right: 13px;
		bottom: 20rpx;
	}

	.provideo {
		background: rgba(255, 255, 255, 0.7);
		width: 160rpx;
		height: 54rpx;
		padding: 0 20rpx 0 4rpx;
		border-radius: 27rpx;
		position: absolute;
		bottom: 30rpx;
		left: 50%;
		margin-left: -80rpx;
		display: flex;
		align-items: center;
		justify-content: space-between
	}

	.provideo image {
		width: 50rpx;
		height: 50rpx;
	}

	.provideo .txt {
		flex: 1;
		text-align: center;
		padding-left: 10rpx;
		font-size: 24rpx;
		color: #333
	}

	.videobox {
		width: 100%;
		height: 750rpx;
		text-align: center;
		background: #000
	}

	.videobox .video {
		width: 100%;
		height: 650rpx;
	}

	.videobox .parsevideo {
		margin: 0 auto;
		margin-top: 20rpx;
		height: 40rpx;
		line-height: 40rpx;
		color: #333;
		background: #ccc;
		width: 140rpx;
		border-radius: 25rpx;
		font-size: 24rpx
	}
	.product-detail__con {
		padding: 24rpx;
		.product-detail__info {
			padding: 14rpx 24rpx 24rpx;
			background: #fff;
			border-radius: 12rpx;
		}
		.current {
			font-size: 56rpx;
			color: #ED5925;
			line-height: 80rpx;
			padding-right: 20rpx;
			&.small-current {
				font-size: 40rpx;
			}
			.symbol {
				font-size: 28rpx;
			}
		}
		.original {
			font-size: 24rpx;
			color: #999999;
			text-decoration: line-through;
			margin-right: 20rpx;
		}
		.txt {
			font-size: 26rpx;
			color: #999999;
			&:not(:last-child) {
				margin-right: 20rpx;
			}
		}
		.info-hd{
			&__btn {
				width: 104rpx;
				height: 42rpx;
				border-radius: 42rpx;
				background: linear-gradient(to right, #00AE68 0%, #096742 100%);
				padding: 0 8rpx 0 16rpx;
			}
		}
		.btn-txt {
			font-size: 24rpx;
			font-weight: 500;
			color: #FFFFFF;
			line-height: 34rpx;
		}
		.icon-box {
			width: 22rpx;
			height: 26rpx;
			border-radius: 50%;
			background: #FFFFFF;
		}
		.icon-arrow-right {
			font-size: 20rpx;
		}
		.info-bd {
			color: #333333;
			font-size: 32rpx;
			line-height: 44rpx;
			font-weight: bold;
		}
		.info-ft {
			justify-content: flex-end;
			margin-top: 46rpx;
			font-size: 26rpx;
			color: #999999;
			line-height: 36rpx;
			.iconfont {
				font-size: 30rpx;
				margin-right: 12rpx;
			}
			.share {
				margin-left: 54rpx;
			}
		}
	}

	.product-detail__info .sellpoint {
		font-size: 28rpx;
		color: #666;
		padding-top: 20rpx;
	}

	.product-detail__info .sales_stock {
		display: flex;
		justify-content: space-between;
		height: 60rpx;
		line-height: 60rpx;
		margin-top: 30rpx;
		font-size: 24rpx;
		color: #777777
	}

	.product-detail__info .commission {
		display: inline-block;
		margin-top: 20rpx;
		margin-bottom: 10rpx;
		border-radius: 10rpx;
		font-size: 20rpx;
		height: 44rpx;
		line-height: 44rpx;
		padding: 0 20rpx
	}

	.product-detail__info .upsavemoney {
		display: flex;
		align-items: center;
		margin-top: 20rpx;
		margin-bottom: 10rpx;
		border-radius: 10rpx;
		font-size: 20rpx;
		height: 70rpx;
		padding: 0 20rpx
	}

	.choose {
		border-radius: 12rpx;
		display: flex;
		align-items: center;
		background: #fff;
		margin-top: 24rpx;
		font-size: 28rpx;
		line-height: 40rpx;
		padding: 20rpx 24rpx;
		color: #333;
	}

	.choose .f0 {
		color: #999999;
		padding-right: 26rpx;
	}

	.choose .f2 {
		flex: 1;
	}

	.cuxiaodiv {
		border-radius: 20rpx;
		background: #fff;
		margin-top: 20rpx;
		padding: 0 3%;
	}

	.fuwupoint {
		width: 100%;
		font-size: 24rpx;
		color: #333;
		height: 88rpx;
		line-height: 88rpx;
		padding: 12rpx 0;
		display: flex;
		align-items: center
	}

	.fuwupoint .f0 {
		color: #555;
		font-weight: bold;
		height: 32rpx;
		font-size: 24rpx;
		padding-right: 30rpx;
		display: flex;
		justify-content: center;
		align-items: center
	}

	.fuwupoint .f1 {
		margin-right: 20rpx;
		flex: 1;
		display: flex;
		flex-wrap: nowrap;
		overflow: hidden
	}

	.fuwupoint .f1 .t {
		padding: 4rpx 20rpx 4rpx 0;
		color: #777;
		flex-shrink: 0
	}

	.fuwupoint .f1 .t:before {
		content: "";
		display: inline-block;
		vertical-align: middle;
		margin-top: -4rpx;
		margin-right: 10rpx;
		width: 24rpx;
		height: 24rpx;
		background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAwUExURUdwTOU5O+Q5POU5POQ4O+U4PN80P+M4O+Q4O+Q4POQ5POQ4OuQ4O+Q4O+I4PuQ5PJxkAycAAAAPdFJOUwAf+VSoeAvzws7ka7miLboUzckAAADJSURBVBjTY2BgYGCMWVR5VIABDBid/gPBFwjP/JOzQKKtfjGIzf3fEUSJ/N8AJO21Iao3fQbqqA+AcLi/CzCwfGGAAn8HBnlFMIttBoP4R4b4C2BOzk8G3q8M5w3AnPsLGZj/MKwHW8b6/QED4y8G/QQQx14ZSHwCcWYkMOtvAHOAyvqnPf8KcuMvkAGZP9eDjAQaEO/AwDb/D0gj0GiQpRnTQIYIfUR1DopDGexVIZygz8ieC4B6WyzRBOJtBkZ/pAABBZUWOKgAispF5e7ibycAAAAASUVORK5CYII=') no-repeat;
		background-size: 24rpx auto;
	}

	.fuwupoint .f2 {
		flex-shrink: 0;
		display: flex;
		align-items: center;
		width: 32rpx;
		height: 32rpx;
	}

	.fuwupoint .f2 .img {
		width: 32rpx;
		height: 32rpx;
	}

	.fuwudialog-content {
		font-size: 24rpx
	}

	.fuwudialog-content .f1 {
		color: #333;
		height: 80rpx;
		line-height: 80rpx;
		font-weight: bold
	}

	.fuwudialog-content .f1:before {
		content: "";
		display: inline-block;
		vertical-align: middle;
		margin-top: -4rpx;
		margin-right: 10rpx;
		width: 24rpx;
		height: 24rpx;
		background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAwUExURUdwTOU5O+Q5POU5POQ4O+U4PN80P+M4O+Q4O+Q4POQ5POQ4OuQ4O+Q4O+I4PuQ5PJxkAycAAAAPdFJOUwAf+VSoeAvzws7ka7miLboUzckAAADJSURBVBjTY2BgYGCMWVR5VIABDBid/gPBFwjP/JOzQKKtfjGIzf3fEUSJ/N8AJO21Iao3fQbqqA+AcLi/CzCwfGGAAn8HBnlFMIttBoP4R4b4C2BOzk8G3q8M5w3AnPsLGZj/MKwHW8b6/QED4y8G/QQQx14ZSHwCcWYkMOtvAHOAyvqnPf8KcuMvkAGZP9eDjAQaEO/AwDb/D0gj0GiQpRnTQIYIfUR1DopDGexVIZygz8ieC4B6WyzRBOJtBkZ/pAABBZUWOKgAispF5e7ibycAAAAASUVORK5CYII=') no-repeat;
		background-size: 24rpx auto;
	}

	.fuwudialog-content .f2 {
		color: #777
	}

	.cuxiaopoint {
		width: 100%;
		font-size: 24rpx;
		color: #333;
		height: 88rpx;
		line-height: 88rpx;
		padding: 12rpx 0;
		display: flex;
		align-items: center
	}

	.cuxiaopoint .f0 {
		color: #555;
		font-weight: bold;
		height: 32rpx;
		font-size: 24rpx;
		padding-right: 20rpx;
		display: flex;
		justify-content: center;
		align-items: center
	}

	.cuxiaopoint .f1 {
		margin-right: 20rpx;
		flex: 1;
		display: flex;
		flex-wrap: nowrap;
		overflow: hidden
	}

	.cuxiaopoint .f1 .t {
		margin-left: 10rpx;
		border-radius: 3px;
		font-size: 24rpx;
		height: 40rpx;
		line-height: 40rpx;
		padding-right: 10rpx;
		flex-shrink: 0;
		overflow: hidden
	}

	.cuxiaopoint .f1 .t0 {
		display: inline-block;
		padding: 0 5px;
	}

	.cuxiaopoint .f1 .t1 {
		padding: 0 4px
	}

	.cuxiaopoint .f2 {
		flex-shrink: 0;
		display: flex;
		align-items: center;
		width: 32rpx;
		height: 32rpx;
	}

	.cuxiaopoint .f2 .img {
		width: 32rpx;
		height: 32rpx;
	}

	.cuxiaodiv .cuxiaoitem {
		border-bottom: 1px solid #E6E6E6;
	}

	.cuxiaodiv .cuxiaoitem:last-child {
		border-bottom: 0
	}

	.popup__container {
		border-radius: 20rpx;
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		width: 100%;
		height: auto;
		z-index: 10;
		background: #fff
	}

	.popup__overlay {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		width: 100%;
		height: 100%;
		z-index: 11;
		opacity: 0.3;
		background: #000
	}

	.popup__modal {
		width: 100%;
		position: absolute;
		bottom: 0;
		color: #3d4145;
		overflow-x: hidden;
		overflow-y: hidden;
		opacity: 1;
		padding-bottom: 20rpx;
		background: #fff;
		border-radius: 20rpx 20rpx 0 0;
		z-index: 12;
		min-height: 600rpx;
		max-height: 1000rpx;
	}

	.popup__title {
		text-align: center;
		padding: 30rpx;
		position: relative;
		position: relative
	}

	.popup__title-text {
		font-size: 32rpx
	}

	.popup__close {
		position: absolute;
		top: 34rpx;
		right: 34rpx
	}

	.popup__content {
		width: 100%;
		max-height: 880rpx;
		overflow-y: scroll;
		padding: 20rpx 0;
	}

	.service-item {
		display: flex;
		padding: 0 40rpx 20rpx 40rpx;
	}

	.service-item .prefix {
		padding-top: 2px;
	}

	.service-item .suffix {
		padding-left: 10rpx;
	}

	.service-item .suffix .type-name {
		font-size: 28rpx;
		color: #49aa34;
		margin-bottom: 10rpx;
	}


	.shop {
		border-radius: 20rpx;
		display: flex;
		align-items: center;
		width: 100%;
		background: #fff;
		margin-top: 20rpx;
		padding: 20rpx 3%;
		position: relative;
		min-height: 100rpx;
	}

	.shop .p1 {
		width: 90rpx;
		height: 90rpx;
		border-radius: 6rpx;
		flex-shrink: 0
	}

	.shop .p2 {
		padding-left: 10rpx
	}

	.shop .p2 .t1 {
		width: 100%;
		height: 40rpx;
		line-height: 40rpx;
		overflow: hidden;
		color: #111;
		font-weight: bold;
		font-size: 30rpx;
	}

	.shop .p2 .t2 {
		width: 100%;
		height: 30rpx;
		line-height: 30rpx;
		overflow: hidden;
		color: #999;
		font-size: 24rpx;
		margin-top: 8rpx
	}

	.shop .p4 {
		height: 64rpx;
		line-height: 64rpx;
		color: #FFFFFF;
		border-radius: 32rpx;
		margin-left: 20rpx;
		flex-shrink: 0;
		padding: 0 30rpx;
		font-size: 24rpx;
		font-weight: bold
	}

	.detail {
		border-radius: 20rpx;
		min-height: 200rpx;
	}

	.detail_title {
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 28rpx 0 24rpx;
	}

	.detail_title .t0 {
		font-size: 36rpx;
		font-weight: 500;
		color: #0A5D3B;
		line-height: 50rpx;
		letter-spacing: 2rpx;
		margin: 0 10rpx;
	}

	.detail_title .t1 {
		width: 12rpx;
		height: 12rpx;
		background: rgba(253, 74, 70, 0.2);
		transform: rotate(45deg);
		margin: 0 4rpx;
		margin-top: 6rpx
	}

	.detail_title .t2 {
		width: 18rpx;
		height: 18rpx;
		background: rgba(253, 74, 70, 0.4);
		transform: rotate(45deg);
		margin: 0 4rpx
	}

	.commentbox {
		border-radius: 12rpx;
		background: #fff;
		padding: 20rpx 24rpx 28rpx;
		margin-top: 24rpx;
		font-weight: 500;
		&-hd {
			&__title {
				font-size: 32rpx;
				color: #333333;
				line-height: 50rpx;
			}
			&__more {
				font-size: 24rpx;
				color: #0A5D3B;
				line-height: 34rpx;
				.iconfont {
					font-size: 36rpx;
					font-weight: 500;
				}
			}
		}
		&-bd {
			margin-top: 24rpx;
			&__item {
				&:not(:last-child) {
					margin-bottom: 24rpx;
				}
				.item-hd {
					&__userInfo {
						flex: 1;
						&-img {
							width: 68rpx;
							height: 68rpx;
							box-sizing: border-box;
							flex-shrink: 0;
							margin-right: 14rpx;
						}
						&-bd {
							flex: 1;
							font-weight: 500;
						}
						&-name {
							font-size: 26rpx;
							color: #333333;
							line-height: 36rpx;
						}
						&-time {
							margin-top: 2rpx;
							font-size: 22rpx;
							color: #999999;
							line-height: 32rpx;
						}
						&-ft {
							.grade-star {
								width: 28rpx;
								height: 28rpx;
								margin-left: 6rpx;
							}
						}

					}
				}
				.item-bd {
					margin-top: 16rpx;
					&__txt {
						font-size: 26rpx;
						font-weight: 500;
						color: #333333;
						line-height: 32rpx;
					}
					&__imgs {
						margin: 24rpx -12rpx 0 0;
						image {
							margin-right: 12rpx;
							width: 164rpx;
							height: 164rpx;
							border-radius: 12rpx;
						}
					}
				}
			}
		}
	}


	.commentbox .title .f1 {
		flex: 1;
		color: #333;
		font-weight: bold;
		font-size: 30rpx;
	}

	.commentbox .title .f2 {
		color: #666;
		font-weight: bold;
		font-size: 28rpx;
		display: flex;
		align-items: center
	}

	.commentbox .nocomment {
		height: 100rpx;
		line-height: 100rpx
	}

	.comment {
		border-radius: 20rpx;
		display: flex;
		flex-direction: column;
		min-height: 200rpx;
	}

	.comment .item {
		background-color: #fff;
		padding: 10rpx 20rpx;
		display: flex;
		flex-direction: column;
	}

	.comment .item .f1 {
		display: flex;
		width: 100%;
		align-items: center;
		padding: 10rpx 0;
	}

	.comment .item .f1 .t1 {
		width: 70rpx;
		height: 70rpx;
		border-radius: 50%;
	}

	.comment .item .f1 .t2 {
		padding-left: 10rpx;
		color: #333;
		font-weight: bold;
		font-size: 30rpx;
	}

	.comment .item .f1 .t3 {
		text-align: right;
	}

	.comment .item .f1 .t3 .img {
		width: 24rpx;
		height: 24rpx;
		margin-left: 10rpx
	}

	.comment .item .score {
		font-size: 24rpx;
		color: #f99716;
	}

	.comment .item .score image {
		width: 140rpx;
		height: 50rpx;
		vertical-align: middle;
		margin-bottom: 6rpx;
		margin-right: 6rpx;
	}

	.comment .item .f2 {
		display: flex;
		flex-direction: column;
		width: 100%;
		padding: 10rpx 0;
	}

	.comment .item .f2 .t1 {
		color: #333;
		font-size: 28rpx;
	}

	.comment .item .f2 .t2 {
		display: flex;
		width: 100%
	}

	.comment .item .f2 .t2 image {
		width: 100rpx;
		height: 100rpx;
		margin: 10rpx;
	}

	.comment .item .f2 .t3 {
		color: #aaa;
		font-size: 24rpx;
	}

	.comment .item .f3 {
		margin: 20rpx auto;
		padding: 0 30rpx;
		height: 60rpx;
		line-height: 60rpx;
		border: 1px solid #E6E6E6;
		border-radius: 30rpx;
		color: #111111;
		font-weight: bold;
		font-size: 26rpx
	}

	.bottombar {
		position: fixed;
		bottom: 0px;
		left: 0px;
		right: 0;
		padding: 16rpx 24rpx 30rpx;
		background: #fff;
		display: flex;
		align-items: center;
		padding-bottom: calc(20rpx + constant(safe-area-inset-bottom));
		padding-bottom: calc(20rpx + env(safe-area-inset-bottom));
	}

	.bottombar .f1 {
		flex: 1;
		display: flex;
		align-items: center;
		// margin-right: 30rpx
		justify-content: space-around;
	}

	.bottombar .f1 .item {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 80rpx;
		position: relative
	}

	.bottombar .f1 .item .img {
		width: 44rpx;
		height: 44rpx
	}

	.bottombar .f1 .item .t1 {
		font-size: 20rpx;
		color: #666666;
		line-height: 28rpx;
	}

	.bottombar .op {
		width: 520rpx;
		border-radius: 78rpx;
		overflow: hidden;
		display: flex;
	}

	.bottombar .tocart,.bottombar .tobuy {
		flex: 1;
		height: 78rpx;
		line-height: 78rpx;
		font-size: 28rpx;
		font-weight: bold
	}
	.bottombar .tocart {
		background: linear-gradient(to right,#e9faf4 0%,#c1f9e5 100%);
		color: #0A5D3B;
	}
	.bottombar .tobuy {
		background: linear-gradient(to right,#00ad68 0%,#096741 100%);
		color: #fff;
	}

	.bottombar .cartnum {
		position: absolute;
		right: 4rpx;
		top: -4rpx;
		color: #fff;
		border-radius: 50%;
		width: 32rpx;
		height: 32rpx;
		line-height: 32rpx;
		text-align: center;
		font-size: 22rpx;
	}

	.sharetypecontent {
		border-radius: 20rpx;
		height: 250rpx;
		width: 710rpx;
		margin: 20rpx;
		display: flex;
		padding: 50rpx;
		align-items: flex-end
	}

	.sharetypecontent .f1 {
		color: #51c332;
		width: 50%;
		height: 150rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		background: #fff;
		font-size: 28rpx;
		border: 0
	}

	.sharetypecontent button::after {
		border: 0
	}

	.sharetypecontent .f1 .img {
		width: 90rpx;
		height: 90rpx
	}

	.sharetypecontent .f2 {
		color: #51c332;
		width: 50%;
		display: flex;
		flex-direction: column;
		align-items: center
	}

	.sharetypecontent .f2 .img {
		width: 90rpx;
		height: 90rpx
	}

	.sharetypecontent .t1 {
		height: 60rpx;
		line-height: 60rpx;
		color: #666
	}

	.posterDialog {
		border-radius: 20rpx;
		position: fixed;
		z-index: 9;
		width: 100%;
		height: 100%;
		background: rgba(0, 0, 0, 0.8);
		top: var(--window-top);
		left: 0
	}

	.posterDialog .main {
		width: 80%;
		margin: 60rpx 10% 30rpx 10%;
		background: #fff;
		position: relative;
		border-radius: 20rpx
	}

	.posterDialog .close {
		position: absolute;
		padding: 20rpx;
		top: 0;
		right: 0
	}

	.posterDialog .close .img {
		width: 40rpx;
		height: 40rpx;
	}

	.posterDialog .content {
		width: 100%;
		padding: 70rpx 20rpx 30rpx 20rpx;
		color: #333;
		font-size: 30rpx;
		text-align: center
	}

	.posterDialog .content .img {
		width: 540rpx;
		height: 960rpx
	}
	
	// 提示弹框
	
	.hitn-n {
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		background-color: #7F7F7F;
		z-index: 3;
		.hint-bx {
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			z-index: 6;
			.hint-img {
				width: 600rpx;
			}
			
			.content {
				width: 100%;
				top: 180rpx;
				left: 0;
				.title {
					font-size: 36rpx;
				}
				
				.text {
					margin-top: 40rpx;
					color: #666;
				}
			}
		}
	}
</style>
