<template>
	<view class="content">
		<view class="head" >
			<view class="backstyle" >
			</view>
			<image :src="imgA" mode="widthFix"></image>
		</view>
		<!-- 商家内容标题部分 -->
		<view class="content-title">
			<view class="title-img"  @click="magnifyThree">
				<image :src="imgA"  mode=""></image>
			</view>
			<view class="title-font">
				<view class="fontBox">
					{{name}}
				</view>
				<view class="fontInfo">
					{{store.supportPhone}}
				</view>
			<!-- 	<view class="fontBox" >
					<uni-icon v-for="(n,ind) in star" type="star-filled"  size="15" class="star-filled" color="8e8e8e" :key="ind"></uni-icon>
				</view> -->
				<!-- <view class="fontBox">
					{{distance}}
				</view> -->
			</view>
			<view class="title-btn">
				<view v-if="store.favorite" @click="goCollect(store)">
					<text  class="yticon icon-shoucang2" style="color: #ffba00 ; font-size: 35px;"  ></text>
				</view>
				<view v-else @click="goCollect(store)">
					<text  class="yticon icon-shoucang2" style="color: #ffffff; font-size: 35px;" ></text><!-- 收藏1 取消收藏2 -->
				</view>
				<view @click="showEvaluateLayer()">
					<text  class="yticon icon-pinglun-copy" style="color: #ffffff ; font-size: 35px;"  ></text>
				</view>

			</view>
		</view>
		<view class="BigBOX" v-show="dispalyImgThree" @click="clickshowThree">
			 <image :src="imgA" mode="" ></image>
		</view>
		<view class="tab" >
			<view class="tab-item" :class="selectIndex==1||selectIndex==5?'tab-item-checked':''" @click="changTab(1)">
				商品
			</view>
			<view class="tab-item" :class="selectIndex==2?'tab-item-checked':''" @click="changTab(2)">
				分类
			</view>
			<view class="tab-item" v-if="reviewNum<99" :class="selectIndex==3?'tab-item-checked':''" @click="changTab(3)">
				评价({{pingjia.length}})
			</view>
			<view class="tab-item" v-else :class="selectIndex==3?'tab-item-checked':''" @click="changTab(3)">
				评价(99+)
			</view>
			<view class="tab-item" :class="selectIndex==4?'tab-item-checked':''" @click="changTab(4)">
				商家
			</view>
			<view class="tab-item" :class="selectIndex==4?'tab-item-checked':''" @click="changTab(5)">
            				门店
            			</view>
		</view>
		<view class="bbox">

		</view>
		<view v-show="selectIndex==1">
			<view class="goods-list">
				<view
					v-for="(item, index) in newProductList" :key="index"
					class="goods-item"
					@click="navToDetailPage(item)"
				>
					<view class="image-wrapper">
						<image :src="item.pic" mode="aspectFill"></image>
					</view>
					<text class="title clamp">{{item.name}}</text>
					<view class="price-box">
						<text class="price">{{item.price}}</text>
						<text>已售 {{item.sale}}</text>
					</view>
				</view>
			</view>
			<uni-load-more :status="loadingType"></uni-load-more>
		</view>
		<view  v-show="selectIndex==2">
			<view class="categroy" >
				<view class="categroy-item" v-if="category" v-for="(item,index) in category" :key="index" @click="toCategoryList(item.id)">

					<image :src="item.pic" mode="" class="categroy-item-img"  v-if="item.pic" ></image>
                      <image  mode="" class="categroy-item-img"  v-else src="/static/missing-face.png"  ></image>
					<text class="categroy-item-text">{{item.name}}</text>
				</view>

			</view>
		</view>
		<view  v-show="selectIndex==3">
			<!-- 商家位置 -->
			<view class="evaluateTitle" >
				<view class="evaluateTitle-left">
					<view class="evaluateTitle-leftBack">
					</view>
					店铺评价
				</view>
				<view class="evaluateTitle-right" v-if="pingjia" @click="toCommentList()">
					全部评价({{pingjia.length}})
					<image src="../../static/right-arrow.png" style="width:22upx;height:22upx;" mode="" @click.stop=""></image>
				</view>

			</view>
			<view class="evaluateContainer" v-if="pingjia && pingjia.length>0">
				<view class="evaluate-item" v-if="pingjia" v-for="(item,index) in pingjia" :key="index">
					<image class="evaluate-itemlogo" v-if="item.pic" :src="item.pic"   mode=""></image>
					<image class="evaluate-itemlogo" v-else src="/static/missing-face.png"   mode=""></image>
					<view class="evaluate-item-content">
						<view class="evaluate-item-content-user">
							<text class="title" v-if="item.name">
								{{item.name}}
							</text>
							<text v-else>未设置昵称</text>
							<text class="date">
								{{item.createTime |formatCreateTime}}
							</text>
						</view>
						<view class="evaluate-item-content-text">
							{{item.memo}}
						</view>
					</view>
				</view>

			</view>
			<view class="evaluateContainer" v-else>
				暂无评价
			</view>

		</view>
		<view  v-show="selectIndex==4">
			<!-- 商家位置 -->
			<view class="addressBox" @click="openMap()">
				<view class="addressBox-left">
					<image src="../../static/position.png" style="width:34upx;height:34upx;" mode=""></image>
					<view class="content-content">{{store.addressDetail}}</view>
				</view>
				<view class="addressBox-right">
					<image src="../../static/temp/share_wechat.png" style="width:44upx;height:44upx;" mode="" @click.stop="showContactInfo()"></image>
					<image src="../../static/iphone.png" style="width:44upx;height:44upx;" mode="" @click.stop="makePhoneCall(store.supportPhone)"></image>
				</view>

				<!-- <view class="addressFont">
					商家电话：{{phone}}
				</view> -->
			</view>
			<view class="bbox">

			</view>
			<!-- 商家风采 -->
			<view class="imgBox">
				<view class="imgBoxImg" v-show="dispaly" @click="magnifyTwo">
					<image :src="imgA" mode=""></image>
				</view>
	 			<view class="imgBoxImg" v-show="dispalyx">
					<image :src="store.supportName" mode=""></image>
				</view>
				<view class="imgBoxImg" v-for="(item,index) in sjimg" :key="index">
					<image :src="address+item" mode=""  @click="magnify(index)"></image>
				</view>
			</view>
			<view class="BigBOX" v-show="dispalyImgTwo" @click="clickshowTwo">
				 <image :src="imgB" mode="" ></image>
			</view>
			<view class="BigBOX"  @click="clickshow" v-show="dispalyImg">
				 <image :src="address+sjimg[imgIndex]" mode=""  ></image>
			</view>
		</view>
		<view v-show="selectIndex==5">
		<view class="shop-box">
			<view v-if="!shopList" style="text-align: center; color:#5C5C5C; font-size: 30upx;">暂无商家记录</view>
            			<view class="shop" v-for="(item, index) in shopList" @click="gobrand" :data-Businessid="item.id" :key="index">

            				<image :src="item.logo" mode="" class="image" width="100%" height="100%" v-if="item.logo" ></image>
                            <image  mode="" class="image" width="100%" height="100%" v-else src="/static/missing-face.png"  ></image>
            				<view class="shopText">
            					<text class="name">{{ item.storeName }}【{{item.linkman}}】</text>
            					<view class="evaluate">
            						<uni-icon type="star-filled" size="15" class="star-filled" color="8e8e8e"></uni-icon>
            						<uni-icon type="star-filled" size="15" class="star-filled" color="8e8e8e"></uni-icon>
            						<uni-icon type="star-filled" size="15" class="star-filled" color="8e8e8e"></uni-icon>
            						<uni-icon type="star-filled" size="15" class="star-filled" color="8e8e8e"></uni-icon>
            						<uni-icon type="star-filled" size="15" class="star-filled" color="8e8e8e"></uni-icon>
            						 <text class="garde" style="margin-right:10upx; color:#666666; ">{{ item.collect }}</text>
            					</view>
            					<view class="bottomInformation">
            						<text class="crux" style="margin-top: 30upx; color:#666666; overflow: hidden; display: inline-block; height: 40upx; text-overflow:ellipsis;">
            							{{ item.address }}
            						</text>
            						<text class="distance" style=" color:#666666;">{{ item.mobile }}</text>
            					</view>
            				</view>
            				</view>
            			</view>

		</view>
		<view class="mask1" v-show="contactInfoDisplay" @click="showContactInfo()">

		</view>
		<view class="contactInfo" v-show="contactInfoDisplay">
			<text class="contactInfo-title">识别二维码添加店家微信</text>
			<image :src="store.contactQrcode" mode="" style="width: 318upx;height:318upx;"></image>
			<text>{{name}}</text>
			<text>微信号{{store.contactQq}}</text>
			<text>客服电话：{{store.supportPhone}}</text>
		</view>
		<view class="mask1" v-show="evaluateLayer" @click="showEvaluateLayer()">

		</view>
		<view class="evaluateLayer" v-show="evaluateLayer">
			<text>请输入评价内容</text>
			<textarea v-model="evaluate" placeholder="请输入评价信息" />
			<view class="evaluateLayerBtn">
				<view class="cancel" @click="showEvaluateLayer()">
					取消
				</view>
				<view class="confirm" @click="submitEvaluate()">
					确定
				</view>
			</view>
		</view>

	</view>
</template>

<script>
import mallplusCopyright from '@/components/mall-copyright/mallplusCopyright.vue';
import Api from '@/common/api';
import { formatDate } from '@/common/date';
	import uniIcon from "@/components/uni-icon/uni-icon.vue";
	import eonfox from "@/components/eonfox/eonfox.js"
	import fns from '@/components/eonfox/fns.js';
import uniLoadMore from '@/uni_modules/uni-load-more/components/uni-load-more/uni-load-more.vue';
	// #ifdef H5
	let jweixin = require('jweixin-module');
	// #endif
	var ef = new eonfox();
	export default {
	components: {
    		mallplusCopyright
    	},
		data(){
			return {
			store:'',
				id:'',
			    name:'',
				info:'',
				license_image_id:'',
				logimg:'',
				phone:'',
				star:'',
				imgA:'',
				imgB:'',
				sjimg:[],
				address:'',
				Latitude:'',
				Longitude:'',
				BusinessAddress:'',
				dispaly:true,
				dispalyx:true,
				distance:'',
				dispalyImg:false,
				index:0,
				imgIndex:'',
				dispalyImgTwo:false,
				dispalyImgThree:false,
				contactInfoDisplay:false,//是否展示商家联系方式
				selectIndex:1,//当前选中栏
				shopLatitude:'',
				shopLongitude:'',
				loadingType: 'more', //加载更多状态
				filterIndex: 0,
				priceOrder: 0, //1 价格从低到高 2价格从高到低
				goodsList: [],
				shopList: [],
				qiniu:'',
				search:{},
				sort:[],
				page:10,
				category:null,
				loadingcategoryType: 'more', //分类加载更多状态
				categoryPage:10,//分类商品分页
				categoryType:'',//分类类型
				newProductList:[],
				evaluateLayer:false,//评价弹窗
				evaluate:'',//评价内容
				pingjia:'',//评价列表
				reviewNum:0,//评价数量
				params:{},
				pageNum: 1,
				lon:'',
				lat:'',
				favorite: false//收藏
			}
		},
filters: {
              formatCreateTime(time) {
                let date = new Date(time);
                return formatDate(date, 'yyyy-MM-dd hh:mm:ss')
              },
            },
		methods:{
			toCommentList(){
				var _this=this;
				if(_this.id){
					uni.navigateTo({
						url: '/pagesA/commentList/commentList?type=merchant&id='+_this.id
					});
				}
				else{
					uni.showToast({
						title:"店铺id异常",
						icon:'none'
					})
				}
			},
			async submitEvaluate(){
				var _this=this;
				if(_this.evaluate.trim()==''){
					uni.showToast({
						title:"请输入评价内容",
						icon:'none'
					})
					return
				}
				else{
				let params = { storeId: this.id,memo:_this.evaluate };
                	let groupHotGoodsList = await Api.apiCall('post', Api.member.addStoreComment, params);
				if(groupHotGoodsList){
				this.storeCommentList(this.id);
                										_this.showEvaluateLayer();
                										uni.showToast({
                											title: '评价成功'
                										});
this.changTab(3);
                									}

				}
			},
			showEvaluateLayer(){
			        this.evaluate='';
				this.evaluateLayer=!this.evaluateLayer;
			},
			toCategoryList(typeid){
				this.changTab(1);
				this.categoryType=typeid;
				this.params.storeClassId=this.typeid;
				this.getNewProductList('refresh');
			},
			//详情
			navToDetailPage(item){
				// console.log(item)

				let id = item.id;
				uni.navigateTo({
					url: `../../pagesA/product/product?id=${id}`
				})
			},
			
			//加载分类商品 ，带下拉刷新和上滑加载
			async loadCateGoryData(type='add', loading) {

			},
			//唤起拨号
			makePhoneCall(phone){
				uni.makePhoneCall({phoneNumber:phone});
			},
			//展示商家联系方式
			showContactInfo(){
				this.contactInfoDisplay=!this.contactInfoDisplay;
			},
			//切换Tab
			changTab(index){
				this.selectIndex=index;
			},
			//收藏
			async goCollect(item){
				var _this=this
				_this.favorite = !this.favorite;
			let params = { objId: this.id, type: 3, name: item.name, meno1: item.logo, meno2: item.collect, meno3: item.hit };
            Api.apiCall('post', Api.goods.favoriteSave, params);

			},
				openMap1() {
                    			var _this = this;
                    			uni.chooseLocation({

                    				success: function(res) {
                    			console.log('res', res);
                                _this.addressData.longitude=res.longitude;
                                _this.addressData.latitude=res.latitude;
                                _this.addressId = 1 ;
                    					_this.addressData.province = res.address ;
                    					_this.addressData.name =  res.name;
                    					console.log('经度：' + res.longitude);
                    					console.log('详细地址：' + res.address);
                    					console.log('纬度：' + res.latitude);
                    					_this.storeList = {};
                    				}
                    			});

                    		},
			openMap(){
				var _this=this
				uni.openLocation({
					latitude: parseFloat(_this.shopLatitude),
					longitude: parseFloat(_this.shopLongitude),
					name:_this.name,
					address:_this.store.addressDetail,
					success: function () {
						console.log('success');
					}
				});

			},
			//点击获取图片的下标
			magnify:function(index){
				console.log('点击了',index);
				this.imgIndex=index;
				this.dispalyImg=true;
				this.dispalyImgTwo=false;
				this.dispalyImgThree=false;
			},
			//点击关闭图片
			clickshow(){
				this.dispalyImg=false;
			},
			magnifyTwo(){
				this.dispalyImgTwo=true;
				this.dispalyImg=false;
				this.dispalyImgThree=false;
			},
			magnifyThree(){
				this.dispalyImgThree=true;
				this.dispalyImgTwo=false;
				this.dispalyImg=false;
			},
			clickshowTwo(){
				this.dispalyImgTwo=false;
			},
			clickshowThree(){
				this.dispalyImgThree=false;
			},
			returnto() {
				uni.navigateBack({
					delta:1
				})
			},
			        async getShopList(storeId) {
            			let params = { storeId: storeId };
            			let groupHotGoodsList = await Api.apiCall('get', Api.index.shoplist, params);
            			this.shopList = groupHotGoodsList;
            		},

            		async storeCommentList(storeId) {
                                                    			let params = { storeId: storeId };
                                                    			let storeClass = await Api.apiCall('get', Api.index.storeCommentList, params);
                                                    			this.pingjia = storeClass.records;
                                                    		},
            		 async storeClassList(storeId) {
                                			let params = { storeId: storeId };
                                			let storeClass = await Api.apiCall('get', Api.index.storeClassList, params);
                                			this.category = storeClass.records;
                                		},
			/**
                		     * 获取新品上市信息
                		     */
                		    async getNewProductList(type = 'add', loading){
                		    //没有更多直接返回
                            			if (type === 'add') {
                            				if (this.loadingType === 'nomore') {
                            					return;
                            				}
                            				this.loadingType = 'loading';
                            			} else {
                            				this.loadingType = 'more';
                            			}
                            			this.params.pageNum=this.pageNum;
                            			this.params.storeId=this.id;

                		      let list = await Api.apiCall('get', Api.goods.goodsList, this.params);
            
            
                		        let goodsList = list.records;
            
                                			if (type === 'refresh') {
                                				this.newProductList = [];
                                			}
            
                    	this.newProductList = this.newProductList.concat(goodsList);
            
                                			//判断是否还有下一页，有是more  没有是nomore(测试数据判断大于20就没有了)
                                			this.loadingType = this.newProductList.length > list.total ? 'nomore' : 'more';
                                			if (type === 'refresh') {
                                				if (loading == 1) {
                                					uni.hideLoading();
                                				} else {
                                					uni.stopPullDownRefresh();
                                				}
                                			}
            
                		    },
		},
			async onLoad(ops) {

        	if(ops.id && ops.id!=undefined){
        	this.id=ops.id;
        	}else{
        	this.id=0;
        	}
                this.getNewProductList('refresh');
        		let params = { id:this.id };
        		let store = await Api.apiCall('get', Api.member.storeDetail1, params);
        		this.store=store.store;
                this.imgA=this.store.logo;
                this.name=this.store.name;

        if(ops.lat && ops.lat!=undefined){
        	this.shopLatitude=ops.lat;
       	}
        if(ops.lon && ops.lon!=undefined){
        	this.shopLongitude=ops.lon;
       	}
         this.getShopList(this.id);
        this.storeClassList(this.id);
        this.storeCommentList(this.id);
        	},

			//加载更多
                	onReachBottom() {
                		this.pageNum = this.pageNum + 1;

                		this.getNewProductList();
                	},
            	onPullDownRefresh() {
            	this.pageNum = this.pageNum + 1;
            	this.getNewProductList('refresh');


            		setTimeout(function () {
            			uni.stopPullDownRefresh();
            		}, 2000);
            	},
		components:{
			uniIcon,
			uniLoadMore
		},
	}
</script>
<style scoped lang="stylus" ref="stylesheet/stylus">
.content
	width 100%
	overflow hidden
	.title-box
		display flex
		justify-content center // 水平居中
		align-items center // 垂直居中
		flex-direction row // 左到右
		width 750upx
		padding 0 20upx
		height 100upx
		.scan
			width 40upx
			height 40upx
		.input-box
			// margin-left 20upx
			width 700upx
			height 58upx
			// border 1upx solid #d3d3d3
			border-radius 50upx
			.search
				display inline-block
				position absolute
				top 0
				left 0
			.input
				width 80%
				display inline-block
				font-size 28upx
				text-align center
				// text-align left
				line-height 100%
				height 100%
		.chat
			flex 1
	.topTitle
		width 100%
		height 80upx
		display flex
		align-items center // 垂直居中
		flex-direction row
		padding 0 20upx
		color #333
		font-size 30upx
		.allStore
			vertical-align middle
			line-height 80upx
			color #e7313a
		.discountStore
			line-height 100upx
			padding-left 20upx
		.leftBox
			width 300upx
			text-align right
	.classification
		height 80upx
		display flex
		align-items center
		justify-content center // 垂直居中
		flex-direction row
		font-size 28upx
		.typeList
			text-align center
			line-height 80upx
			border 1px solid #d3d3d3
			width 50%
			height 100%
	.place
		font-size 30upx
		height 100upx
		text-align left
		line-height 100upx
		border-bottom 1px solid #d3d3d3
		padding-left 20px
	.shop-box, width 100%
		height auto
	.shop
		height 200upx
		border-bottom 1px solid #eee
		display flex
		align-items center
		justify-content flex-start
		flex-direction row
		.image
			width 160upx
			height 160upx
			margin-left 25upx
			border-radius 50%
		.shopText
			width 500upx
			height 220upx
			margin-left 25upx
			padding-top 25upx
			.name
				color #333
				font-weight 600
				font-size 30upx
				width 100%
				height 30px
			.evaluate
				font-size 20upx
				margin-top 20upx
			.bottomInformation
				align-items center
				justify-content space-between
				flex-direction row
				width 100%
				color #333
				font-size 28upx
				.crux
					width 240upx
					display inline-block
				.distance
					width calc(100% - 250upx)
					float right
					text-align right
					margin-top 30upx
			.icoimg
				width 48upx
				height 48upx
</style>
<style>
	.content{
		font-size:28upx;
		width:100%;
		height:auto;
	}
	.head{
		width: 750upx;
		height: 300upx;
		overflow: hidden;
		position: relative;
	}
	.head image{
		width: 750upx;
		height: 180upx;
	}
	.backstyle{
		position: absolute;
		width: 100%;
		height: 100%;
		background-size: cover;
		background-color: rgba(0,0,0,0.4);
		background-repeat: no-repeat;

	}
	.content-title{
		width: 100%;
		height:auto;
		display: flex;
		margin-top: -120upx;
		position: relative;
		background-color: rgba(0,0,0,0.5);
	}
	.content-content{
		padding-left: 16upx;
	}
	.title-img{
		float:left;
		width: 130upx;
		height:130upx;
		margin-left: 30upx;
		margin-right: 30upx;
		margin-top: 10upx;
	}
	.title-img image{
		width: 130upx;
		height:130upx;
		border-radius: 6upx;
	}
	.title-font{
		width: 440upx;
		height: 150upx;
		float: left;
		margin-top: 10upx;
		color: #FFF;
	}
	.title-btn{
		width:170upx;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-right: 15upx;
	}
	.title-btn view{
		width: 70upx;
		height: 70upx;
		margin-left: 15upx;
	}
	.fontBox{
		width: 100%;
		height: 50upx;
		line-height: 50upx;
		font-size: 36upx;
	}
	.fontInfo{
		font-size: 24upx;
	}
	.bbox{
		width: 100%;
		height:20upx;
		background-color: #e4e2e2;
	}
	.addressBox{
		width: 690upx;
		height:auto;
		padding-top: 20upx;
		padding-bottom: 20upx;
		padding-left:30upx;
		display: flex;
		justify-content: space-between;
	}
	.addressBox-left{
		display: flex;
	}
	.addressBox-right{
		display: flex;
		width:148upx;
		justify-content: space-between;
	}
	.imgBox{
		width: 750upx;
		padding:0 30upx;
		height: auto;
		display: flex;
		flex-wrap: wrap;
	}
	.imgBoxImg{
		margin-top:40upx;
		margin-left: 5upx;
		margin-right: 5upx;
		width: 220upx;
		height:220upx;
	}
	.imgBoxImg image{
		width: 220upx;
		height:220upx;
		border-radius: 10upx;
	}
	.BigBOX{
		position:fixed;
		float: left;
		top:0upx;
		width:100%;
		height:1600upx;
		background-color: #101010;
		z-index:5;
	}
	.BigBOX image{
		float: left;
		width: 100%;
		height: 600upx;
		margin-top: 200upx;
	}
	.tab{
		height:90upx;
		display: flex;
		justify-content: space-between;
	}
	.tab-item{
		width: 25%;
		height:90upx;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.tab-item-checked{
		border-bottom:solid 4upx #F8C6B5 ;
	}
	.mask1 {
		position: fixed;
		top:0;
		left:0;
		z-index:4;
		width:100%;
		height:100vh;
		background:rgba(0,0,0,0.4);
	}
	.contactInfo{
		z-index:5;
		position: fixed;
		width:500upx;
		height:570upx;
		background-color: #fff;
		border-radius:10upx ;
		top:25vh;
		left: 125upx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: space-around;
		font-size: 28upx;
	}

	.contactInfo-title{

		font-size: 32upx;
		font-weight: 500;
	}
	.evaluateTitle{
		display: flex;
		width: 730upx;
		height: 80upx;
		align-items: center;
		justify-content: space-between;
	}
	.evaluateTitle-left{
		font-size: 32upx;
		align-items: center;
		display: flex;
	}
	.evaluateTitle-leftBack{
		width:20upx;
		height: 34upx;
		background-color:#F8C6B5 ;
		margin-right: 20upx;
	}
	.evaluateTitle-right{
		display: flex;
		font-size: 24upx;
		align-items: center;
	}
	.evaluateContainer{
		width: 710upx;
		padding-left: 40upx;
	}
	.evaluate-item{
		border-bottom: solid 2upx #BFBFBF;
		display: flex;
		padding: 20upx 0;
	}
	.evaluate-itemlogo{
		width: 80upx;
		height: 80upx;
		border-radius: 40upx;
	}
	.evaluate-item-content{
		width:590upx;
		padding-left: 20upx;
		font-size: 28upx;
	}
	.evaluate-item-content-user{
		display: flex;
		flex-direction: column;
		height: 80upx;
		justify-content: space-between;
	}
	.evaluate-item-content-user .title{
		font-size: 28upx;
	}
	.evaluate-item-content-user .date{
		font-size: 24upx;
	}
	.evaluate-item-content-text{
		padding-top: 20upx;
	}

	.evaluateLayer{
		z-index:5;
		position: fixed;
		width:600upx;
		height:570upx;
		background-color: #fff;
		border-radius:10upx ;
		top:25vh;
		left: 75upx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: space-around;
		font-size: 28upx;
	}
	.evaluateLayer text{
		margin-top: 20upx;
	}
	.evaluateLayer textarea{
		width: 560upx;
		padding: 20upx;
		border: solid 1upx #111A34;
		border-radius: 10upx;
	}
	.evaluateLayerBtn{
		width: 560upx;
		display: flex;
		justify-content:space-around;
	}
	.evaluateLayerBtn .confirm{
		width: 200upx;
		height: 80upx;
		background-color: #5193ff;
		color: #FFF;
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius: 10upx;
	}
	.evaluateLayerBtn .cancel{
		width: 200upx;
		height: 80upx;
		background-color: #cccccc;
		color: #FFF;
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius: 10upx;
	}
	.categroy{
		width:750upx;
		padding: 20upx 20upx;
		display:flex;
		flex-wrap: wrap;
	}
	.categroy-item{
		width: 174.5upx;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		margin-top: 50upx;
	}
	.categroy-item-img{
		width: 80upx;
		height:80upx;
	}
	.categroy-item-text{
		margin-top: 20upx;
	}


</style>
<style lang="scss">
	/* 商品列表 */
	.goods-list{
		display:flex;
		flex-wrap:wrap;
		padding: 30upx 30upx 0;
		background: #fff;
		.goods-item{
			display:flex;
			flex-direction: column;
			width: 48%;
			padding-bottom: 40upx;
			&:nth-child(2n+1){
				margin-right: 4%;
			}
		}
		.image-wrapper{
			width: 100%;
			height: 330upx;
			border-radius: 3px;
			overflow: hidden;
			image{
				width: 100%;
				height: 100%;
				opacity: 1;
			}
		}
		.title{
			font-size: $font-lg;
			color: $font-color-dark;
			line-height: 80upx;
		}
		.price-box{
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding-right: 10upx;
			font-size: 24upx;
			color: $font-color-light;
		}
		.price{
			font-size: $font-lg;
			color: $uni-color-primary;
			line-height: 1;
			&:before{
				content: '￥';
				font-size: 26upx;
			}
		}
	}
</style>
