<template>
	<view style="background-color: whitesmoke;" @touchstart="rightF" @touchend="leftF">
		<customNav :shownav="true" :title="posName" titledetl=""></customNav>
		<view style="width: 100%;height: 80rpx;background-color:  #40AE36;"></view>
		<view class="nodetail">
			<view class="contentInRowS" style="width: 100%;">
				<netImage style="margin-left: 12rpx;margin-top: -20rpx;" width="160" height="160" bradius="80" :mysrc="mendianMs.logo" mymode="scaleToFill"></netImage>
				<view class="contentColumn" style="width: 500rpx;margin-right: 20rpx;">
					<text class="dianpuming">{{mendianMs.posName}}</text>
					<text class="peisongsuoming">{{$t('index.manX')}} {{$formPr(mendianMs.posPrice)}} {{$t('locale.huobidw')}}</text>
					<view class="contentInRowS">
						<view class="contentColumnC" style="width: 24%;">
							<image class="actimge" :src="shouchangIcon" mode="aspectFit" @click="shouchang"></image>
							<text class="textfontS3">{{$t('index.shouchang')}}</text>
						</view>
						<view class="contentColumnC" style="width: 24%;">
							<image class="actimge" src="/static/images/daipinglun@3x.png" mode="aspectFit" @click="pinglunList"></image>
							<text class="textfontS3">{{$t('index.pinglun')}}</text>
						</view>
						<view class="contentColumnC" style="width: 24%;">
							<image class="actimge" src="/static/images/gengduozx.png" mode="aspectFit" @click="gengduozx"></image>
							<text class="textfontS3">{{$t('index.mendian')}}</text>
						</view>
						<view class="contentColumnC" style="width: 24%;">
							<image class="actimge" src="/static/images/lianxikf.png" mode="aspectFit" @click="callPhone"></image>
							<text class="textfontS3">{{$t('mend.kefudianhua')}}</text>
						</view>
					</view>
				</view>
			</view>
			<view v-if="mendianMs.state==1" class="contentInRowR">
				<text style="margin-top: 10rpx;color: darkgreen;font-size: 28rpx;padding-right: 40rpx;">{{$t('mend.statedy')}}</text>
			</view>
			<view style="height: 20rpx;"></view>
		</view>
		<view v-if="cuxiaoImge.length==0">
			<netImage style="margin-top:20rpx;margin-left: 25rpx;" width="700" height="400" bradius="6" :mysrc="mendianMs.image" mymode="scaleToFill"></netImage>
		</view>
		
		<view v-if="cuxiaoImge.length>0"><!-- 促销活动 -->
			<swiperImgs style="margin-top: 20rpx;" width="750" height="400" :imageList="cuxiaoImge"></swiperImgs>
		</view>
		<view style="margin-top: 40rpx;" >
			<view :class="[(isFixedTop[0]) ?cssName:'']" id="box" class="box">
				<view class="contentInRowL" style="width: 90%;margin-left: 5%;margin-bottom: 20rpx;align-items: center;">
					<view >
						<text class="fenleiTitle" @click="popfenlei">{{$t('index.goodsfenlei')}}</text>
					</view>
					<image class="actimgezy" style="margin-left: 10rpx;" src="/static/images/zuoyouhd.png" mode="aspectFit"></image>
					<view class="">
						<swiper style="height: 60rpx;width: 450rpx;align-items: center;" display-multiple-items="2"  :indicator-dots="false" :autoplay="false" :current="current" :duration="500" @animationfinish="fenleiSel">
							<swiper-item v-for="(item,index) in shangpinfenlei">
								<view class="swiper-item text1row" >{{item.name}}</view>
							</swiper-item>
						</swiper>
					</view>
				</view>
			</view>
			<view v-if="shangpinfenlei.length>0" class="page-view contentColumnC">
				<view class="contentInRowC">
					<text class="textdop2"></text>
					<text class="textdop1"></text>
					<text class="text2row" style="margin-left: 10rpx;font-size: 30rpx;font-weight: bold;max-width: 600rpx;">{{shangpinfenlei[current].name}}</text>
					<text class="textdop1"></text>
					<text class="textdop2"></text>
				</view>
			</view>
			<view class="page-view contentColumn">
				<view class="item_list">
					<view class="item_content" v-for="(item1, index1) in shangpinlist" :key="index1" >
						<view v-if="item1.stackingUp==0" class="thumb-boxR contentColumnC">
							<netImage class="goodimage" width="334" height="334" :mysrc="item1.image" mymode="scaleToFill"  v-on:Emyimageclick="shangpinsl(item1.id)"></netImage>
							<view class="msText">
								<text class="dianpuming" @click="shangpinsl(item1.id)">{{item1.name}}</text>
								<view class="buyBT">
									<text class="peisongsuoming detailtextV">{{item1.introduce}}</text>
								</view>
								<view v-if="shangpingoumaiS[current][index1]" class="buyBTSB">
									<text class="peisongsuoming">{{$formPr(item1.price)}}{{$t('locale.huobidw')}}</text>
									<view v-if="item1.stackingUp==0" class="rconten">
										<image v-if="shangpingoumaiS[current][index1].shuliang>0" class="imageRJ" src="/static/meishi/jianh.png" mode="aspectFit" @click="jiangouwuche(index1)"></image>
										<text v-if="shangpingoumaiS[current][index1].shuliang>0" class="textR">{{shangpingoumaiS[current][index1].shuliang}}</text>
										<image class="imageR" src="/static/meishi/jiah.png" mode="aspectFit" @click="editSKU(index1)"></image>
									</view>
									<view v-if="item1.stackingUp==1" class="rconten">
										<text class="textR">{{$t('mend.yixiajia')}}</text>
									</view>
								</view>
							</view>
						</view>
					</view>
				</view>
				<view style="height: 260rpx;"></view>
			</view>
		</view>
		<view class="bottomfloatV">
			<view class="buyBT">
				<image class="gouwuche" :src="gouwcheimg" mode="aspectFit" @click="gotoGouwuche"></image>
				<text class="peisongsuoming">{{notext}}</text>
				<text class="qjs" :style="{backgroundColor:gwbcolor,color:gwbTcolor}" @click="gotojiesuan">{{$t('comp.qujiesuan')}}</text>
			</view>
		</view>
		
		<popViewGG  :show="showpop" :showbotom="false" :maskClosable="true" :isCancel="true" @chooseCancel="chooseCancel">
			<foodxuangou style="width:100%;max-height: 70vh" :food="spindexSP" v-on:Ejiagouwuche="jiagouwuche"></foodxuangou>
		</popViewGG>
		<uni-popup style="z-index: 999;" ref="popfl" type="center" :isMaskClick="true" :safeArea="true">
			<view class="contentColumnC" style="width:660upx;background-color:white;border-radius: 8rpx;">
				<text class="fenleiTitle" style="margin-top: 16rpx;margin-bottom: 16rpx;">{{$t('index.goodsfenlei')}}</text>
				<scroll-view scroll-y="true" style="max-height: 400rpx;">
					<view>
						<view class="" v-for="(item,index) in shangpinfenlei">
							<view class="fenleiitem" @click="ppfenleisel(index)">{{item.name}}</view>
						</view>
					</view>
				</scroll-view>
				<view style="height: 20rpx;"></view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import api from "@/pages/api/api.js";
	export default {
		data() {
			return {
				isFixedTop:[],
				Topdistance:[],
				cssName:'',
				//------------------------------
				cuxiaoImge:[],
				id:1,
				userid:0,
				mendianMs:[],
				posName:'',
				isfirstShow:0,
				isShouchang:0,
				shouchangIcon:'/static/images/faver@3x.png',
				option: {},
				login:false,
				showpop:false,
				gouwuche:[],
				scrollRightTop: 0, // 右边栏目scroll-view的滚动条高度
				shangpinfenlei:[],
				shangpinlist:[],
				shangpingoumaiS:[],
				current: 0, // 当前分类值
				spindex:0,//当前分类商品操作INDEX
				spindexSP:'',//当前分类商品操作INDEX对应商品
				itemId: 0, // 栏目右边scroll-view用于滚动的id
				gouwcheimg:'/static/meishi/BuyS@3x.png',
				notext:this.$t('comp.weixgsp'),
				goumaijine:0,
				gwbcolor:'darkgray',
				gwbTcolor:'black',
				startX:0,
				startY:0,
				lang:'0',
			}
		},
		onShow() {
			if(0==this.isfirstShow){
				this.getmendianDetail(this.id);
				this.isfirstShow=1;
			}
			else{
				this.refleashdata();
			}
			var that =this;
			try {//读取
				that.token = uni.getStorageSync("token");
				//console.log('2222',that.token)
				if(that.token == '' || that.token == undefined || that.token == null){
					that.login=false;
					return;
				}
				else{
					that.login=true;
					return;
				}
			} catch(e){//错误
				return;
			}
		},
		onLoad(option) {
			var language = uni.getStorageSync('language');
			if(language=='yuenan'){
				this.lang='0';
			}
			if(language=='zh-Hans'){
				this.lang='2';
			}
			if(language=='zh-Hant'){
				this.lang='3';
			}
			this.id=option.id;
			this.refleashdata();
			uni.pageScrollTo({
				scrollTop:0,
				duration:0
			})
			
			var info = uni.getSystemInfoSync();
			var isAndroid = info.platform.toLowerCase() === 'android';
			if(isAndroid){
				this.cssName='fixedTop';
			}
			else{
				this.cssName='fixedTopios';
			}
		},
		mounted() {
			this.GetTop()
		},
		onPageScroll(e) {
			const that = this
			// console.log(e.scrollTop,JSON.stringify(this.Topdistance),JSON.stringify(this.isFixedTop))
				for(let i = 0; i < this.Topdistance.length; i++){
					if(e.scrollTop > this.Topdistance[i]-70){
						// console.log('***************')
						this.isFixedTop[i] = true
						this.$set(this.isFixedTop,i,true)
						this.isFixedTop[i] = true
					}else{
						// console.log('++++++++++')
						this.isFixedTop[i] = false
						this.$set(this.isFixedTop,i,false)
						this.isFixedTop[i] = false
					}
				}
		},
		methods: {
			GetTop(){
				var _this=this
				uni.getSystemInfo({
					success:(resu)=>{	
						//console.log('resu',JSON.stringify(resu))
						const query = uni.createSelectorQuery().in(this)
						query.selectAll('.box').boundingClientRect()
						query.selectViewport().scrollOffset()
						query.exec(function(res){
							//console.log('res',JSON.stringify(res))
							_this.arr(res[0])
						})
					},
					fail:(res)=>{}
				})
			}, 
			arr(res){
				for(let i = 0; i < res.length; i++){
					this.Topdistance[i] = res[i].top
					this.isFixedTop[i] = false
				}
				//console.log('----',JSON.stringify(this.Topdistance))
			},
			//------------------------------------------------------------------------------
			rightF(e){
				//console.log('rightF',e)
				this.startX=e.changedTouches[0].pageX;
				this.startY=e.changedTouches[0].pageY;
			},
			leftF(e){
				//console.log('leftF',e)
				var s,n;
				s=e.changedTouches[0].pageX;
				n=e.changedTouches[0].pageY;
				
				var dx,dy;
				dx=this.startX-s;
				dy=Math.abs(this.startY-n);
				
				if(Math.abs(dx)>100&&Math.abs(dx)>dy){
					if(dx>0){
						if(this.current<this.shangpinfenlei.length-1){
							this.current=this.current+1;
						}
					}
					else{
						if(this.current>0){
							this.current=this.current-1;
						}
					}
				}
			},
			fanhui(){
				uni.navigateBack();
			},
			shareToggle() {
				this.$refs.share.open()
			},
			chooseCancel(){
				this.showpop=false;
			},
			fenxiang(item,index){
				this.option={
					//绘制海报内容
					//codeUrl: 'https://pic1.zhimg.com/80/v2-2714df42147132464a71af391ed04be4_720w.jpg', //小程序太阳码
					codeUrl: '/static/defimages/erweim.png', //小程序太阳码
					coverUrl: '/static/defimages/ddd.png', //题库图片
					headUrl: '/static/logo.png', //头像
					//bgUrl: 'https://pic3.zhimg.com/v2-8fbde0f9ac6a19a23aa839e73394618a_b.jpg', //图片背景填充，和 fillStyle 只能传一个，bgUrl 优先级高于 fillStyle
					fillStyle: '#00A6FF', //纯色背景填充颜色
					nickName: '美食达', //授权登录的用户名
					miniName: '不出门吃遍全世界', //小程序名称
					tkName:this.posName, //题库名称
					tkAuthor:'门店介绍', //题库作者
					tkType: '外送', //题库类型
					cost: '自取', //是否需要收费   免费/付费
					isPub: '堂食' //公开 还是 私有
				};
				this.$refs.draw.share_qrcode(this.option);
			},
			shouchang(){
				this.addcollect();
			},
			callPhone(){
				var that = this;
				uni.showModal({
				    title: that.$t('api.message'),
				    content: that.$t('api.nqdbddh'),
					cancelText:that.$t('order.quxiao'),
					confirmText:that.$t('comp.queren'),
				    success: function (res) {
				        if (res.confirm) { //这里是点击了确定以后
							console.log(that.mendianMs.telephone)
							plus.device.dial(that.mendianMs.telephone, false );
				        } else { //这里是点击了取消以后
				          console.log('用户点击取消')
				        }
				    }
				})
			},
			gengduozx(){
				uni.navigateTo({
					url:'/pages/shanpinxungou/shangjia/gengduozhixun?mendid='+this.id
				})
			},
			pinglunList(){
				uni.navigateTo({
					url:'/pages/pinglun/pingLunList?mendid='+this.id
				})
			},
			fenleiSel(e){
				console.log(e);
				this.current=e.detail.current;
				this.getmendianshangpinList(this.shangpinfenlei[this.current].id);
				this.itemId=0;
			},
			shangpinsl(id){
				//选择商品
				uni.navigateTo({
					url:'/pages/shanpinxungou/shangpin/shangpinxiangqing?id='+id
				})
			},
			gotoGouwuche(){
				if(!this.showbt){
					uni.showToast({
					    title: this.$t('comp.qingxzsp'),
					    icon: 'none',
					    duration: 2500
					})
					return;
				}
				uni.navigateTo({
					url:'/pages/OrderList/buy/gouwuche'
				})
			},
			gotojiesuan(){
				if(this.mendianMs.state==1){
					uni.showToast({
					    title: this.$t('mend.statedy'),
					    icon: 'none',
					    duration: 2500
					})
					return;
				}
				if(!this.showbt){
					uni.showToast({
					    title: this.$t('comp.qingxzsp'),
					    icon: 'none',
					    duration: 2500
					})
					return;
				}
				var token = uni.getStorageSync("token");
				//console.log('2222',token)
				if(token == '' || token == undefined || token == null){
					uni.navigateTo({
						url:'/pages/UserCenter/LoginView'
					})
					return;
				}
				
				uni.navigateTo({
					url:'/pages/OrderList/buy/dingdanjiesuan'
				})
			},
			//pop------------------------------------------
			popfenlei(){
				if(this.shangpinfenlei.length>0){
					this.$refs.popfl.open('center');
				}
			},
			ppfenleisel(index){
				this.current=index;
				this.$refs.popfl.close();
				this.getmendianshangpinList(this.shangpinfenlei[this.current].id);
				this.itemId=0;
			},
			//------------------------------------
			addcollect(){
				if(!this.login){
					uni.navigateTo({
						url:'/pages/UserCenter/LoginView'
					})
				}
				console.log('addcollect：id',this.id);
				api('addcollect',{
					mdid:this.id
				},res=>{
					console.log(res)
					if(this.isShouchang==0){
						this.isShouchang=1;
						this.shouchangIcon='/static/images/faverr@3x.png'
					}
					else{
						this.isShouchang=0;
						this.shouchangIcon='/static/images/faver@3x.png'
					}
				},failc=>{
					//console.log('getadvertis----',failc)
				})
			},
			
			getmendianDetail(id){
				//console.log('getmendianDetail：id',id);
				uni.showLoading({
					mask:true
				})
				api('getmendianDetail',{
					id:id
				},r=>{
					console.log(r.data.data);
					uni.hideLoading();
					this.mendianMs=r.data.data;
					this.userid=this.mendianMs.userId;
					this.posName=this.mendianMs.posName;
					this.isShouchang=this.mendianMs.Collect;
					if(this.isShouchang==1){
						this.shouchangIcon='/static/images/faverr@3x.png'
					}
					else{
						this.shouchangIcon='/static/images/faver@3x.png'
					}
					this.getmendianshangpinFL(id);
					this.cuxiaoList();
					
				},failc=>{
					uni.hideLoading();
					//console.log('getadvertis----',failc)
				})
			},
			getmendianshangpinFL(id){
				uni.showLoading({
					mask:true
				})
				api('getmendianshangpinFL',{
					id:id,
					language:this.lang
				},res=>{
					uni.hideLoading();
					this.shangpinfenlei=res.data.data;
					if(this.shangpinfenlei.length>0){
						this.getmendianshangpinList(this.shangpinfenlei[0].id);
					}
				},failc=>{
					uni.hideLoading();
					//console.log('getadvertis----',failc)
				})
			},
			
			getmendianshangpinList(id){
				uni.showLoading({
					mask:true
				})
				console.log(this.lang)
				api('getmendianshangpinList',{
					id:id,
					language:this.lang
				},r=>{
					console.log(r);
					uni.hideLoading();
					this.dowithshangpinList(r.data.data);
					this.shangpinlist=r.data.data;
				},failc=>{
					uni.hideLoading();
					//console.log('getadvertis----',failc)
				})
			},
			dowithshangpinList(shangpinlist){
				if(this.shangpingoumaiS.length==0){
					for(var i=0;i<this.shangpinfenlei.length;i++){
						this.shangpingoumaiS.push([]);
					}
				}
				this.shangpingoumaiS[this.current]=[];
				if(shangpinlist){
					for(var j=0;j<shangpinlist.length;j++){
						var shuliang = this.tongbugouwuchexinxi(shangpinlist[j]);
						var otherPrice = this.getotherPrice(shangpinlist[j].foodSku);
						var tempSKU = this.gettempSKU(shangpinlist[j].foodSku);
						var tempsp={
							"shangpin":shangpinlist[j],
							"sku":tempSKU,
							"otherPrice":otherPrice,
							"shuliang":shuliang
						}
						this.shangpingoumaiS[this.current].push(tempsp);
					}
				}
			},
			cuxiaoList(){
				api('cuxiaoList',{
					mdId:this.id,
					price:''
				},r=>{
					//console.log('-----------',r)
					if(r.data.code==200){
						this.cuxiaoImge=[];
						var objs = r.data.data;
						for(var i=0;i<objs.length;i++){
							var obj=objs[i];
							if(obj.poster&&obj.poster.length>0){
								this.cuxiaoImge.push(obj.poster);
							}
						}
					}
				},failc=>{
					//console.log('getadvertis----',failc)
				})
			},
			//--------------------------------------
			tongjigouwuche(){
				
				this.goumaijine = 0;
				
				for(var i=0;i<this.gouwuche.length;i++){
					var item = this.gouwuche[i];
					var yidongjine=item.amount;
					this.goumaijine = this.goumaijine+yidongjine;
				}
				
				this.jinger();
			},
			tongbugouwuchexinxi(sp){
				var tempshuliang = 0;
				for(var i=0;i<this.gouwuche.length;i++){
					var item = this.gouwuche[i];
					for(var j=0;j<item.food.length;j++){
						if(item.food[j].id == sp.id){
							tempshuliang = tempshuliang + item.food[j].number;
						}
					}
				}
				return tempshuliang;
			},
			refleashdata(){
				var gwc = uni.getStorageSync('gouwuche');
				if(''==gwc||null==gwc||undefined==gwc){
					this.gouwuche=[];
					this.tongjigouwuche();
				}
				else{
					this.gouwuche = JSON.parse(gwc);
					this.tongjigouwuche();
				}
				if(this.shangpinlist.length>0){
					this.dowithshangpinList(this.shangpinlist);
				}
			},
			jiangouwuche(e){
				//跳转购物车
				uni.switchTab({
					url:'/pages/OrderList/buy/gouwuche'
				})
			},
			
			jiagouwuche(e){
				var gwc = uni.getStorageSync('gouwuche');
				if(''==gwc||null==gwc||undefined==gwc){
					this.gouwuche=[];
				}
				else{
					this.gouwuche = JSON.parse(gwc);
				}
				this.dowithshangpinList(this.shangpinlist);
				
				this.tongjigouwuche();
				var temp=[];
				for (var i=0;i<this.shangpinlist.length;i++) {
					temp.push(this.shangpinlist[i]);
				}
				this.shangpinlist=temp;
				
				this.showpop=false;
				
			},
			jinger(){
				if(this.goumaijine>0){
					this.notext=this.$formPr(this.goumaijine)+this.$t('locale.huobidw');
					console.log(this.notext);
					this.gwbcolor='green';
					this.gwbTcolor='white';
					this.gouwcheimg='/static/meishi/BuyS@3x.png';
					this.showbt=true;
				}
				if(this.goumaijine==0){
					this.gwbcolor='darkgray';
					this.gwbTcolor='black';
					this.notext=this.$t('comp.weixgsp');
					this.gouwcheimg='/static/meishi/BuyS@3x.png';
					this.showbt=false;
				}
			},
			editSKU(index){
				this.spindex=index;
				var sp = this.shangpingoumaiS[this.current][index];
				//this.skuGuige=sp.shangpin.sku;
				this.spindexSP = sp;
				this.showpop=true;
				console.log('<<<<<<',this.shangpinlist[index]);
				//this.$refs.popup.open();
			},
			gettempSKU(foodSku){
				var selectsku=[];
				for(var i=0;i<foodSku.length;i++){
					if(foodSku[i].objects.length>0){
						for(var j=0;j<foodSku[i].objects.length;j++){
							if(foodSku[i].objects[j].state==1){
								selectsku.push(foodSku[i].objects[j].name);
							}
						}
					}
				}
				return selectsku;
			},
			getotherPrice(foodSku){
				var jiner=0;
				for(var i=0;i<foodSku.length;i++){
					if(foodSku[i].objects.length>0){
						for(var j=0;j<foodSku[i].objects.length;j++){
							if(foodSku[i].objects[j].state==1){
								jiner=jiner+parseFloat(foodSku[i].objects[j].price);
							}
						}
					}
				}
				return parseFloat(jiner);
			},
		}
	}
</script>

<style lang="scss" scoped>
	page{
		background-color: #F2F3F7;
	}
	
	 .box{
		 height: 100upx;
		 line-height: 100upx; 
		 text-align: center;
		 background-color:white;
	 }
	 .fixedTop{
		 position: fixed;
		 top:140rpx;
		 left: 0;
		 right: 0;
		 z-index: 9999999;
	 }
	 .fixedTopios{
		 position: fixed;
		 top:180rpx;
		 left: 0;
		 right: 0;
		 z-index: 9999999;
	 }
	 //-----------------------------
	.nodetail{
		width: 94%;
		margin-left: 3%;
		margin-top: -40rpx;
		background-color: white;
		border-radius: 10rpx;
	}
	
	.fenleiTitle{
		padding-left: 16rpx;
		padding-right: 16rpx;
		line-height: 36rpx;
		font-size: 28rpx;
		border-radius: 20rpx;
		color: darkgray;
		background-color: white;
		border: 1rpx solid darkgray;
	}
	.swiper-item {
	  flex: 1;
	  flex-direction:row;
	  padding-left: 30rpx;
	  font-size: 28rpx;
	  line-height: 60rpx;
	  text-align: left;
	}
	.textdop1{
		width: 12rpx;
		height: 12rpx;
		background-color: #00A6FF;
		border-radius: 6rpx;
		margin-left: 10rpx;
	}
	.textdop2{
		width: 8rpx;
		height: 8rpx;
		background-color: #00A6FF;
		border-radius: 4rpx;
		margin-left: 10rpx;
	}
	.page-view {
		background-color:#F2F3F7;
	}
	
	.item_list{
		padding: 0 15rpx;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		.item_content{
			width: 50%;
			margin: 10rpx 0;
			padding: 14rpx;
			box-sizing: border-box;
		}
	}

	.thumb-boxR {
	    width: 334rpx;
		background-color: white;
	}
	.goodimage{
		margin-top: 0rpx;
	}
	
	.detailtextV{
		width: 90%;
		height: 80rpx;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
	}
	.rconten{
		display:flex;
		flex-direction: row;
		align-items: center;
		margin-left: auto;
		justify-content: flex-end;
	}
	.actimgeCT{
		position: fixed;
		width: 94%;
		left: 3%;
		top: 100rpx;
		z-index: 9;
	}
	.actimge{
		width: 60rpx;
		height: 60rpx;
	}
	.actimgezy{
		width: 40rpx;
		height: 40rpx;
	}
	.imageRJ{
		width: 56rpx;
		height: 56rpx;
		margin-right: 8rpx;
	}
	.imageR{
		width: 56rpx;
		height: 56rpx;
		margin-right: 30rpx;
	}
	.textR{
		margin-left: 6rpx;
		margin-right: 6rpx;
	}
	.msText{
		width: 90%;
		margin-top: 20rpx;
		padding-left: 30rpx;
		text-align: left;
		font-size: 22rpx;
		line-height: 32rpx;
	}
	.buyBT{
		display:flex;
		flex-direction: row;
		justify-content:left;
		align-items: center;
		width: 100%;
		margin-top: 10rpx;
	}
	.gouwuche{
		margin-left: 20rpx;
		width: 80rpx;
		height: 80rpx;
	}
	.dianpuming{
		font-size: 30rpx;
		line-height: 32rpx;
		height: 32rpx;
		font-weight: bold;
		overflow: hidden;
		text-overflow: ellipsis;
		/* #ifndef APP-PLUS-NVUE */
		display: -webkit-box;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical;
		/* #endif */
	}
	.peisongsuoming{
		font-size: 26rpx;
		line-height: 38rpx;
		height: 38rpx;
		color: dimgray;
	}
	.bottomfloatV{
		position: fixed;
		flex-direction: row;
		align-items: center;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 999;
		background-color: whitesmoke;
		height: 120rpx;
	}
	.qjs{
		border-radius: 30rpx;
		padding-left: 26rpx;
		padding-right: 26rpx;
		margin-left: auto;
		margin-right: 30rpx;
		font-size: 32rpx;
		height: 60rpx;
		line-height: 60rpx;
	}
	.fenleiitem{
		text-align:center;
		margin-top: 12rpx;
		margin-bottom: 12rpx;
		width:660upx;
		border-radius: 10rpx;
		color: darkblue;
		line-height: 54rpx;
		font-size: 28rpx;
		border: solid lavender;
		border-width: 0px 0px 1rpx 0px;
	}
</style>
