sadjv3_user/pages/index/index.vue

<template>
	<view class="content content_bj">
		<view class="index-head">
			<!-- <view class="index-top">
				<view v-if="XCXIsSelect != '否'" class="flex locate-line"
				 @tap="goCity">
					<view class="localName">{{ city }}</view>
					<image src="../../static/liliao-1.png" class="dingwei-img"></image>
				</view>
			</view> -->
			<view class="index-line">
				<view class="flex">
					<view>
						<image class="salogo" src="../../static/salogo.gif"></image>
					</view>
					<view v-if="XCXIsSelect != '否'" class="flex locate-line" @tap="goCity">
						<!--<image src="../../static/liliao-1.png" class="dingwei-img"></image>-->
						<view class="localName">{{ city }}
							<view class="view-more"></view>
						</view>
					</view>
				</view>
				<!-- <view class="index-top-left font-size-34">盛安到家</view> -->
				<view class="index-top-mian">

					<!-- <view class="index-top-mian-text">
						<image style="margin-top: 1px;" src="../../static/index-nav-1.png" mode=""></image>
						<span>实名认证</span>
					</view>
					<view class="index-top-mian-text">
						<image src="../../static/index-nav-2.png" mode=""></image>
						<span>资质认证</span>
					</view>
					<view class="index-top-mian-text">
						<image  src="../../static/index-nav-3.png" mode="" style="width: 14px; height: 14px;"></image>
						<span>平台担保</span>
					</view>-->
				</view>

				<view class="index-headset smrz">
					<!--<image style="width: 26rpx; height: 26rpx;"  src="../../static/index-nav-4.png" @click="goChat()" mode="widthFix"></image>
					 <image  src="../../static/index-nav-5.png" mode="widthFix"></image> -->
					<image class="index-yanzheng" src="../../static/images/index/renzheng01.png" mode=""></image>
					<image class="index-yanzheng" src="../../static/images/index/renzheng02.png" mode=""></image>
					<image class="index-yanzheng" src="../../static/images/index/renzheng03.png" mode=""></image>
				</view>

			</view>
			<view class="flex align-center index-mian">

				<uni-search-bar placeholder="请输入项目名称" @service="serviceTrue" @confirm="search" :cancelext="'取消'"
					v-model="searchValue" @input="input" @clear="clear">
				</uni-search-bar>
				<view class="search-btn" @click="searchBtn">
					搜索
				</view>

			</view>
			<view class="index-nav-bottom width">
				<image src="../../static/index-nav-8.png" mode="widthFix" @click="goNav('/pages/cooperate/index')">
				</image>
				<image src="../../static/index-nav-7.png" mode="widthFix" @click="xinren"></image>
			</view>
		</view>
		<view class="title-star">
			<view class="star-technician-top">
				<view class="star-technician-top-text">
					<span class="star-technician-name">明星技师</span>
					<span class="star-technician-name-bot">Star technician</span>
				</view>
				<view class="star-technician-top-text" @click="gengduo">
					<span class="star-technician-gengguo">查看更多></span>
				</view>
			</view>
		</view>
		<view class="star-technician width">
			<view class="star-technician-mian">
				<liu-goods-swiper :goodsList="starTechnician" :imgWidth="165" :imgHeight="120" @clickItem="chooseItem"
					@cancellable='false'></liu-goods-swiper>
			</view>
		</view>
		<view class="index-project width">
			<view class="index-project-content" @click="goNav('/pages/my/txszList?classifyId='+'95')">
				<image src="../../static/index-fenglei16.png" mode="widthFix"></image>
				<span class="feng_word">中医推拿</span>
			</view>
			<view class="index-project-content" @click="goNav('/pages/my/txszList?classifyId='+'101')">
				<image src="../../static/index-fenglei17.png" mode="widthFix"></image>
				<span class="feng_word">小儿推拿</span>
			</view>
			<view class="index-project-content" @click="goNav('/pages/my/txszList?classifyId='+'102')">
				<image src="../../static/index-fenglei18.png" mode="widthFix"></image>
				<span class="feng_word">产后康复</span>
			</view>
			<!-- <view class="index-project-content" @click="goNav('/pages/cooperate/index')">
				<image src="../../static/index-fenglei3.png" mode="widthFix"></image>
				<span class="feng_word">招聘合作</span>
			</view> -->
			<view class="index-project-content" @click="goNav('/pages/my/txszList?classifyId='+'91')">
				<image src="../../static/index-fenglei15.png" mode="widthFix"></image>
				<span class="feng_word">私密护理</span>
			</view>
			<view class="index-project-content" @click="goNav('/pages/my/txszList?classifyId='+'113')">
				<image src="../../static/index-fenglei14.png" mode="widthFix"></image>
				<span class="feng_word">正骨拨筋</span>
			</view>

			<view class="index-project-content"
				@click="goNav('/pages/my/indextaociliaoList?type='+104+'&name='+'index')">
				<image src="../../static/index-fenglei1.png" mode="widthFix"></image>
				<span class="feng_word">盛安套餐</span>
			</view>
			<view class="index-project-content"
				@click="goNav('/pages/my/indextaociliaoList?type='+106+'&name='+'index')">
				<image src="../../static/index-fenglei6.png" mode="widthFix"></image>
				<span class="feng_word">服务疗程</span>
			</view>
			<view class="index-project-content"
				@click="goNav('/pages/my/indextaociliaoList?type='+105+'&name='+'index')">
				<image src="../../static/index-fenglei19.png" mode="widthFix"></image>
				<span class="feng_word">项目次卡</span>
			</view>
			<view class="index-project-content" @click="shangcheng()">
				<image src="../../static/index-fenglei8.png" mode="widthFix"></image>
				<span class="feng_word">产品商城</span>
			</view>
			<view class="index-project-content" @click="gangBtn(type)">
				<image src="../../static/index-fenglei13.png" mode="widthFix"></image>
				<span class="feng_word">更多</span>
			</view>
		</view>
		<view class="index-guanggao width">
			<!-- <image class="index-guanggao-pintuan" @click="qidai()" src="../../static/pintuan.png" mode="widthFix"></image> -->
			<image class="index-guanggao-pintuan index-interval" @click="goNav('/pages/my/newseckill?text='+'index')"
				src="../../static/cika2.png" mode="widthFix"></image>
			<view class="index-guanggao-right">
				<!-- <image class="index-guanggao-right-cika index-interval" @click="goNav('/pages/my/newseckill?text='+'index')" src="../../static/cika2.png" mode="widthFix"></image> -->
				<image class="index-guanggao-right-yuyue" @click="yuedao('企业')" src="../../static/yuyue.png"
					mode="widthFix"></image>
			</view>
		</view>
		<view class="index-fujin">
			<view class="index-fujin-title width">
				<view class="index-fujin-title-left">
					<image src="../../static/fujin-jishi.png" mode="widthFix"></image>
					<span>附近技师</span>
				</view>
				<view class="index-fujin-title-right">
					<span class="index-fujin-title-left-text" @click="gengduo">更多</span>
					<span class="index-fujin-title-left-btn">></span>
				</view>
			</view>
			<view class="index-fujin-img width">
				<view class="fujin-view" v-for="(item,index) in nearbyTechnician" :key="index" @click="goOrder(item)">
					<view class="index-fujin-view">
						<image class="index-fujin-view-img" :src="item.artificerImg" mode=""></image>
						<view class="index-fujin-view-text">
							<view>
								<image src="../../static/fujin-dingwei.png" mode="w"></image>
							</view>
							<view><span>{{item.dingwei}}km</span></view>
						</view>
					</view>
					<view class="index-fujin-jie">
						<view class="index-fujin-jie-view">
							<span class="index-fujin-jie-name">{{item.artificerName}}</span>
						</view>
					</view>
				</view>

			</view>
			<view class="index-taocan width">
				<view class="index-taocan-view">
					<view class="index-taocan-view-nav" v-for="item in felNav" :key="item.id" @click="chengFel(item)">
						<view class="index-taocan-view-nav-s">
							<span class="index-taocan-view-nav-text"
								:class="[currentTabFl==item.id?'activeL':'activeH']">{{item.name}}</span>
						</view>
						<view class="fenjie"></view>
					</view>
				</view>
				<view class="index-card">
					<view class="index-card-view" v-for="(item,index) in tjData" :key="index" @click="goDatail(item)">
						<view class="index-card-view-title">
							<image class="index-card-image" :src="item.packageImg?item.packageImg:item.massageImg"
								mode=""></image>
							<!-- <view class="index-card-view-title-left">{{item.title}}</view> -->
							<view class="index-card-view-title-right">
								<text v-if="item.tagsData!=''">{{item.tagsData[0]}}</text>
								<text v-else>助眠解压</text>
							</view>
							<!-- <view class="index-card-view-title-right"  >助眠解压</view> -->
						</view>
						<view class="index-card-mian">
							<view class="index-card-mian-title marginTop">{{item.title}}</view>
							<view class="index-card-mian-biao marginTop">
								<view class="shop_label" v-if="item.tagsData!=''">
									<span v-for="tag in item.tagsData" :key="tag">{{tag}}</span>
								</view>
								<view class="shop_label" v-else>
									<view class="index-card-mian-biao-left">
										助眠减压
									</view>
									<!-- <view class="index-card-mian-biao-right"> -->
									<view class="index-card-mian-biao-left">
										缓解疲劳
									</view>
								</view>
							</view>
							<view class="index-card-mian-time marginTop" v-if="item.duration">
								<image src="../../static/rumen-time.png" mode="widthFix"></image>
								<span>{{item.duration}}分钟</span>
							</view>
							<view class="index-card-mian-money marginTop">
								<span class="index-card-mian-money-zhen">￥{{item.price}}</span>
								<span class="index-card-mian-money-jia">￥{{item.oldPrice}}</span>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="body-view">
				<!-- 使用scroll-view实现tabs滑动切换 -->
				<scroll-view class="top-menu-view" scroll-x="true" scroll-with-animation :scroll-left="scrollLeft">
					<view class="menu-topic-view" v-for="(item,index) in tabs" :id="'tabNum'+item.id" :key="index"
						@click="swichMenu(index,item.id)">
						<view :class="currentTab==index ? 'menu-topic-act' : 'menu-topic'">
							<text class="menu-topic-text">{{item.name}}</text>
							<view class="menu-topic-bottom">
								<view class="menu-topic-bottom-color"></view>
							</view>
						</view>
					</view>
				</scroll-view>

				<!-- 内容 -->
				<scroll-view class="swiper-box-list" scroll-y="true" :scroll-into-view="scrollIntoView">
					<view class="swiper-topic-list" v-for="(item,index) in swiperDateLists" :key="index">
						<view class="swiper-item-card" style="position: relative;">
							<view class="data-list">
								<view class="videoHovers" @click="towxh5Video(item,index)">
									<image class="playState" src="@/static/bofang.png"></image>
								</view>
								<image :src="item.picPath" mode="aspectFill" style="width: 100%; height: 100%;"></image>
							</view>
							<view class="swiper-item">
								<span>{{item.artificerName}}</span>
								<span class="swiper-item-view">{{item.content}}</span>
							</view>
						</view>
					</view>
				</scroll-view>
			</view>
		</view>
		<view style="width: 100%;height: 700px;"></view>
		<view class="kefu" @click="goMsg">
			<image :class="{'blinking': haveNewMsg}" src="../../static/kefu.png" mode=""></image>
			<!--<span>联系客服</span>-->
		</view>
		<!-- 经验筛选 -->
		<u-select v-model="Cityshow" style="height: auto;" :list="cityList" @confirm="getCity"></u-select>
		<uni-popup style="width: 100%;height: 100vh;" type="center" ref="bofang" @touchmove.stop.prevent="moveHandle">
			<view style="width: 100%;height: 100%;position: relative;">
				<video id="myVideo" style="width: 100%;height: 100%;" :loop="true" :muted="false"
					:show-fullscreen-btn='false' :enable-play-gesture='true' :autoplay="false" :show-play-btn='false'
					:show-center-play-btn='false' :http-cache="true" @click="jieshu" :src="filePath"></video>
				<view class="videoConten">{{contentVideo}}</view>
				<view class="videoHover" v-if="playShow==true" @click="kaishi">
					<image class="playState" src="@/static/bofang.png"></image>
				</view>
				<view class="guanbi" @click="guanbi">
					<image src="@/static/closeimg.png"></image>
				</view>
				<view class="userInfo">
					<!-- 1.头像 -->
					<image @click="tozuozhe(artificerItem)" class="userAvatar" :src="artificerItem.artificerImg"
						mode="aspectFill"></image>
					<!-- 2.上线或者下单 -->
					<view v-if="artificerItem.onLine == 1" class="comment list-view" @click="tozuozhe(artificerItem)"
						style="opacity: 0.9; margin-top: 17px;">
						<image src="@/static/img/index/lijiyuyue.png"
							style="width:40px; height:40px; position: absolute; right: 7px;"></image>
						<text
							style="color: #FFFFFF; margin-top: 5px; font-size: 14px; font-weight: bold; text-align: center; margin-top: 40px;">预约</text>
					</view>
					<view v-if="artificerItem.onLine == 2" class="comment list-view" @click="shangxian(artificerItem)"
						style="opacity: 0.9; margin-top: 17px;">
						<image src="@/static/img/index/qingtashangxian.png"
							style="width:40px; height:40px; position: absolute; right: 7px;"></image>
						<text
							style="color: #FFFFFF; margin-top: 5px; font-size: 14px; font-weight: bold; text-align: center; margin-top: 40px;">上线</text>
					</view>
					<!-- 3.点赞 -->
					<view class="list-view" @click="cLike(artificerItem);" style="opacity: 0.9; margin-top: 17px;">
						<image v-if="artificerItem.sfdz==1" src="@/static/img/index/xin.png"
							style="width: 40px; height: 40px; position: absolute; right: 6px;"></image>
						<image v-if="artificerItem.sfdz==0" src="@/static/img/index/xin-2.png"
							style="width: 40px; height: 40px; position: absolute; right: 6px;"></image>
						<text
							style="color: #FFFFFF; margin-top: 5px; font-size: 14px; text-align: center; margin-top: 40px; font-weight: bold;"
							:class="{'likeNumActive':artificerItem.sfdz}">{{artificerItem.dzs}}</text>
					</view>
					<!-- 4.评论 -->
					<view class="comment list-view" @click="toComment(artificerItem)"
						style="opacity: 0.9; margin-top: 17px;">
						<image src="@/static/img/index/liaotian-2.png"
							style="width:38px; height:36px; position: absolute; right: 7px;"></image>
						<text
							style="color: #FFFFFF; margin-top: 5px; font-size: 14px; font-weight: bold; text-align: center; margin-top: 40px;">{{artificerItem.pls}}</text>
					</view>
				</view>
			</view>
		</uni-popup>
		<uni-popup class="uni-popup" type="bottom" ref="pinglun" @touchmove.stop.prevent="moveHandle">
			<view class="popup-content-pl"
				:style="'width: '+ windowWidth +'px; height: '+ (boxStyle.height/heightNum) +'px;'">
				<CComment ref="ccRef" :showPopup="showPopup" :userInfo="userInfo" :tableData="tableData"
					:tableTotal="tableTotal" likeFun="likeFun" @replyFun="replyFun" @deleteFun="deleteFun"
					:deleteMode="deleteMode"></CComment>
			</view>
		</uni-popup>
		<view>
			<!-- 提前结束 -->
			<uni-popup class="popup-view" ref="popup" background-color="#fff">
				<view class="popup-content">
					<view class="popup-close">
						<image @click="closePopup(type)" class="popup-close-img" src="../../static/close.png"></image>
					</view>
					<!--<view class="popup-head">
						<span></span>
						<span @click="closePopup(type)">x</span>
					</view>-->
					<view class="popup-mian">
						<view class="popup-mian-view">
							<view class="index-project-content1" @click="goNav('/pages/my/newTeaml?text='+'index')">
								<image src="../../static/index-fenglei20.png" mode="widthFix"></image>
								<span class="feng_word">超值拼团</span>
							</view>
							<view class="index-project-content1" @click="chaoji">
								<image src="../../static/index-fenglei10.png" mode="widthFix"></image>
								<span class="feng_word">充值赠送</span>
							</view>
							<view class="index-project-content1">
								<image src="../../static/index-fenglei11.png" mode="widthFix"></image>
								<span class="feng_word">美甲师</span>
							</view>
							<view class="index-project-content1">
								<image src="../../static/index-fenglei12.png" mode="widthFix"></image>
								<span class="feng_word">美容师</span>
							</view>
							<view class="index-project-content1" @click="yuedao('商家')">
								<image src="../../static/index-fenglei9.png" mode="widthFix"></image>
								<span class="feng_word">约到店</span>
							</view>
						</view>
					</view>
				</view>
			</uni-popup>
		</view>
	</view>
</template>

<script>
	import * as websocketUtils from 'utils/websocketUtils.js';
	import CComment from "@/components/XJ-comment/index";
	import commonConfig from 'common/config.js';

	import * as webMap from 'utils/webMap.js';
	// import permision from "@/components/permission.js";
	// 调用手机系统权限
	// #ifdef APP-PLUS
	import permision from "@/components/permission.js";

	// #endif
	let audo = uni.createInnerAudioContext()
	audo.loop = true
	export default {
		components: {
			CComment
		},
		data() {
			return {
				haveMsg: false,
				checkboxShow: 1,
				filePath: '',
				playShow: false,
				videoId: 0,
				current: 0,
				serviceTrue: true,
				cityList: [],
				Cityshow: false,
				artificerName: '',
				//地图相关
				token: '',
				infoWindow: null,
				amap: null,
				latitude: '43.86487',
				longitude: '',
				city: '请选择地址',
				XCXIsSelect: '否',
				currentTabFl: 1,
				tjData: [],
				felNav: [{
						id: 1,
						name: '大家常买'
					},
					{
						id: 2,
						name: '全部项目',
					},
					{
						id: 3,
						name: '行业大拿'
					},
					{
						id: 4,
						name: '女性专区',
					},

				],
				scrollLeft: 0,
				tabs: [{
						id: 1,
						name: '推荐'
					},
					{
						id: 2,
						name: '附近'
					},
					{
						id: 3,
						name: '关注'
					},
				],
				currentTab: 0,
				tabCurrent: 'tabNum1',
				// Tab切换内容
				swiperDateLists: [],
				swiperDateList: [{
						id: 1,
						content: '中医推拿',
						name: '李安茹',
					},
					{
						id: 2,
						content: '中医推拿',
						name: '李安茹',
					},
					{
						id: 3,
						content: '中医推拿',
						name: '李安茹',
					},

				],
				typeList: [],
				searchValue: '',
				starTechnician: [], //明星技师
				nearbyTechnician: [], //附近技师
				classifyId: '',
				page: 1,
				limit: 10,
				arr: [],
				txAppKey: '',
				tpSel: 0,
				tpCount: 0,
				cuowu: '',
				type: 'center',
				parType: '',
				contentVideo: '',
				Key2: 'ad684a15ebbb6f5d12c407a3d593c949',
				latadd: '',
				cityname: '',
				artificerItem: {},
				showPopup: false,
				ccRef: null,
				userInfo: {
					id: 120,
					user_name: "🍁",
					user_avatar: "https://pic1.zhimg.com/80/v2-a79071a705f55c5d88f6c74e6111fe84_720w.webp",
				},
				tableTotal: 4,
				tableData: [],
				deleteMode: "all",
				windowWidth: 0,
				windowHeight: 0,
				heightNum: 1.18,
				deleteHeight: 0,
				boxStyle: { //视频，图片封面样式🌟💗
					'height': 0,
					'width': 0,
				},
				connected: false,
				connecting: false,
				haveNewMsg: false,
				msgInterval: null,
				isInit: true,
				kfInterval: null,
			}
		},
		onShareAppMessage(res) { //发送给朋友
			return {
				title: this.tuiguang,
				path: '/pages/index/index?invitation=' + this.invitationCode,
				imageUrl: this.tuiguangImg,
			}
		},
		onShareTimeline(res) { //分享到朋友圈
			return {
				title: this.tuiguang,
				path: '/pages/index/index?invitation=' + this.invitationCode,
				imageUrl: this.tuiguangImg,
			}
		},
		onLoad(e) {
			let that = this
			if (this.platform == 'ios' && (model !== 'iPhone6' || model !== 'iPhone6s' || model !== 'iPhone7' || model !==
					'iPhone8')) {
				this.deleteHeight = 0 //有 tabbar的 修改这里可以改变视频高度
			}
			this.windowWidth = uni.getSystemInfoSync().windowWidth;
			this.windowHeight = uni.getSystemInfoSync().windowHeight;
			this.boxStyle.width = this.windowWidth + 'px'; //给宽度加px
			this.boxStyle.height = this.windowHeight - this.deleteHeight; //有 tabbar的 修改这里可以改变视频高度
			that.getBannerList()
			that.remen()
			// that.getKTCityList();
			// 获取邀请码保存到本地
			if (e.invitation) {
				that.$queue.setData('inviterCode', e.invitation);
			}
			// #ifdef MP-WEIXIN
			if (e.scene) {
				const scene = decodeURIComponent(e.scene);
				this.$queue.setData('inviterCode', scene.split(',')[0]);
			}
			// #endif

			that.$Request.getT('/app/common/type/250').then(res => { //技师完成通知
				if (res.code == 0) {
					if (res.data && res.data.value) {
						that.arr.push(res.data.value)
					}
				}
			})

			that.$Request.getT('/app/common/type/248').then(res => { //技师取消通知
				if (res.code == 0) {
					if (res.data && res.data.value) {
						that.arr.push(res.data.value)
					}
				}
			})
			that.$Request.getT('/app/common/type/217').then(res => { //腾讯地图key
				if (res.code == 0) {
					if (res.data && res.data.value) {
						that.txAppKey = res.data.value;
					}
				}
			})
			var add = uni.getStorageSync('cityAdderss');
			if (add != '') {
				that.city = add.name;
				that.cityname = add.cityname;
				var location = add.location.split(",")
				that.longitude = location[0]
				that.latitude = location[1]
				console.log("onLoad=========>", add)
			} else {
				uni.getLocation({
					type: 'gcj02',
					geocode: true, //设置该参数为true可直接获取经纬度及城市信息
					highAccuracyExpireTime: 500,
					success: function(res) {
						console.log(res, '地理位置')
						that.latitude = res.latitude
						that.longitude = res.longitude
						uni.setStorageSync('latitude', res.latitude)
						uni.setStorageSync('longitude', res.longitude)
						that.getHomeNearbyList();
						that.selectCity(that.longitude, that.latitude)
					},
					fail: function(e) {
						that.cuowu = e
						that.getHomeNearbyList();
						console.log("获取信息失败，请重试！", e)
						// #ifdef APP-PLUS
						that.checkPermission();
						// #endif
					}
				})
			}

			that.getVideo()
		},
		onShow() {
			let that = this
			that.XCXIsSelect = this.$queue.getData("XCXIsSelect");
			let userId = uni.getStorageSync('userId')
			if (userId) {
				var add = uni.getStorageSync('cityAdderss');
				if (add != '') {
					that.city = add.name;
					that.cityname = add.cityname;
					var location = add.location.split(",")
					that.longitude = location[0]
					that.latitude = location[1]
					console.log("onShow=========>", add)
				}
				that.getTpMy();
				// that.getTpCount();
				// #ifdef MP-WEIXIN
				//订阅
				if (that.showModal) {
					that.openMsg()
				}
				// #endif
				that.getIsVip()
				// that.getHomeArtificerList();
				that.getHomeNearbyList();
			} else {
				// uni.navigateTo({
				// 	url: '/pages/public/login'
				// })
			}
			that.token = uni.getStorageSync('token');

			//客服按钮是否有新消息逻辑代码
			that.haveNewMsg = false
			if (that.kfInterval == null) {
				that.selectMsg(true)
				that.kfInterval = setInterval(() => {
					that.selectMsg(false)
				}, 5000)
			}

		},
		computed: {
			scrollIntoView() {
				return 'tab' + this.currentTab;
			}
		},
		methods: {
			selectMsg(isRefresh) {
				let that = this
				let data = {
					userId: uni.getStorageSync('userId'),
					focusedUserId: '0',
					// userName:this.order.userName
				}
				// app/chat/insertChatConversation
				this.$Request.postJson('/app/chat/insertChatConversation', data).then(res => {
					if (res.data) {
						that.$Request.get('/app/chat/selectChatContent?page=1&limit=1000&chatConversationId=' + res
							.data.chatConversationId).then(
							res => {
								if (res.data) {
									let count_ = res.data.totalCount
									//将新的查询结果进行保存  isRefresh意义：首次进入页面时才查询
									if (isRefresh) that.$queue.setData('keFuLastMsgCount', count_);
									//将每次最新读到的结果保存到keFuNewMsgCount中，方便其它页面使用
									that.$queue.setData('keFuNewMsgCount', count_);
									let keFuLastMsgCount = that.$queue.getData('keFuLastMsgCount')
									if (keFuLastMsgCount == undefined) {
										//说明是第一次查询 或 上一次查询结果是0
										//此时只要查询到的结果数量>0则代表有新消息
										if (count_ > 0) {
											that.haveNewMsg = true
										}
									} else {
										//如果新接收到的消息数量比上一次多 则判定为有新消息
										if (count_ > keFuLastMsgCount) {
											that.haveNewMsg = true
										}
									}
								}
							});
					}
				})
			},
			goMsg() { //客服聊天
				let that = this
				let data = {
					userId: uni.getStorageSync('userId'),
					focusedUserId: '0',
					// userName:this.order.userName
				}
				// app/chat/insertChatConversation
				this.$Request.postJson('/app/chat/insertChatConversation', data).then(res => {
					if (res.data) {
						that.haveNewMsg = false
						let id = this.ordersId == res.data.userId ? res.data.focusedUserId : this.ordersId
						uni.navigateTo({
							url: '/pages/msg/im?chatConversationId=' + res.data.chatConversationId +
								'&byUserId=' + res.data.userId
						})
					}
				})
			},
			selectCity(longitude, latitude) {
				var that = this;
				var longitude = that.longitude;
				var latitude = that.latitude;
				let amapKey = that.Key2; // 替换为你的高德地图API Key
				let url =
					`https://restapi.amap.com/v3/geocode/regeo?key=${amapKey}&location=${longitude},${latitude}&radius=1000`;
				uni.request({
					url: url,
					success: (response) => {
						if (response.data && response.data.regeocode) {
							let address = response.data.regeocode.formatted_address;
							let province = response.data.regeocode.addressComponent.province;
							let city = response.data.regeocode.addressComponent.city;
							let district = response.data.regeocode.addressComponent.district;
							let township = response.data.regeocode.addressComponent.township;
							let streetNumber = response.data.regeocode.addressComponent.streetNumber.street;
							let number = response.data.regeocode.addressComponent.streetNumber.number;
							that.city = address.replace(province, '').replace(city, '').replace(district, '')
								.replace(streetNumber, '').replace(number, '').replace(township, '')
							that.cityname = add.city;
							var add = uni.getStorageSync('cityAdderss');
							if (add != '') {
								that.city = add.name;
								that.cityname = add.cityname;
								var location = add.location.split(",")
								that.longitude = location[0]
								that.latitude = location[1]
								console.log("location=========>", location)
							}
							that.page = 1;
							// that.getTpCount();
						} else {
							console.log('逆地理编码失败', response.data);
						}
					},
					fail: (error) => {
						console.log('网络请求失败', error);
					}
				});
			},
			guanbi() {
				this.playShow = false;
				const videoContext = uni.createVideoContext('myVideo', this);
				videoContext.pause(); // 播放视频
				this.$refs.bofang.close("center");
			},
			jieshu() {
				this.playShow = true;
				const videoContext = uni.createVideoContext('myVideo', this);
				videoContext.pause(); // 播放视频
			},
			kaishi() {
				this.playShow = false;
				const videoContext = uni.createVideoContext('myVideo', this);
				videoContext.src = this.filePath; // 设置视频源
				videoContext.play(); // 播放视频
			},
			towxh5Video(item, index) {
				console.log(item);
				this.playShow = true;
				this.filePath = item.filePath;
				this.contentVideo = item.content;
				this.artificerItem = item;
				this.videoId = item.id;
				// const videoContext = uni.createVideoContext('myVideo', this);
				// videoContext.src = this.filePath; // 设置视频源
				// setTimeout(()=>{
				// 	videoContext.play(); // 播放视频
				// },100)
				this.$refs.bofang.open("center")
			},
			swichMenu(index, id) { //视频导航
				this.currentTab = index;
				// 计算需要滚动的距离
				const query = uni.createSelectorQuery().in(this);
				query.select('.top-menu-view').boundingClientRect(data => {
					this.scrollLeft = data.width / this.tabs.length * index;
				}).exec();
				this.parType = index + 1;
				this.getVideo()
			},
			swiperChange(e) { //视频导航
				let index = e.detail.current
				this.swichMenu(index);
				this.parType = index + 1;
				this.getVideo()
			},
			getVideo() {
				var that = this;
				console.log(that.parType);
				// 1.这里引入后端请求数据
				var data = {
					userId: uni.getStorageSync('userId'),
					page: this.page,
					limit: 4,
					status: '1'
				}
				if (that.parType == '1') {
					data.longitude = '';
					data.latitude = '';
				} else if (that.parType == '2') {
					data.longitude = that.longitude;
					data.latitude = that.latitude;
				} else if (that.parType == '3') {
					data.gzrId = uni.getStorageSync('userId');
				}
				this.$Request.get("/app/shipinquan/list", data).then(res => {
					if (res.code == 0) {
						that.swiperDateLists = res.data.list || {}
						// this.dataList=res.data.records

					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				});
			},
			goCity() {
				let userId = uni.getStorageSync('userId')
				if (userId) {
					var that = this
					uni.navigateTo({
						url: '/pages/index/searchAddress?text=' + 'index'
					})
				} else {
					uni.navigateTo({
						url: '/pages/public/login'
					})
				}

			},

			searchBtn() { //搜索按钮
				let userId = uni.getStorageSync('userId')
				if (userId) {
					uni.navigateTo({
						url: '/pages/my/fuwuGengduo?searchValue=' + this.searchValue
					})
				} else {
					uni.navigateTo({
						url: '/pages/public/login'
					})
				}

			},
			input(res) { //搜索 输入框
				this.searchValue = res;
			},
			changeSelect(e) {
				this.changeSelectData = e
			},
			shangcheng() {
				let userId = uni.getStorageSync('userId')
				if (userId) {
					uni.navigateTo({
						url: '/package/pages/zysc/index/index'
					})
				} else {
					uni.navigateTo({
						url: '/pages/public/login'
					})
				}

			},
			yuedao(text) {
				let userId = uni.getStorageSync('userId')
				if (userId) {
					uni.navigateTo({
						url: '/pages/shop/index?text=' + text
					})
				} else {
					uni.navigateTo({
						url: '/pages/public/login'
					})
				}

			},
			closePopup(type) { //提前结束    关闭弹出框
				this.type = type
				this.$refs.popup.close(type);
			},
			gangBtn(type) {
				this.$refs.popup.open('center')
			},
			qidai() {
				uni.showToast({
					title: '敬请期待！'
				})
			},
			getIsVip() {
				this.$Request.get("/app/UserVip/selectUserVip").then(res => {
					if (res.code == 0) {
						// this.isVip = res.data
						if (res.data == undefined) {
							this.$queue.setData('isVIP', '0')
						} else {
							this.$queue.setData('isVIP', '1')
						}
					}
				});
			},
			goChat() {
				let kefu = this.$queue.getData('kefu'); // 用户端联系方式 1 手机号 2企业微信
				let kefuPhone = this.$queue.getData('kefuPhone');
				if (kefu == 1) {
					uni.makePhoneCall({
						phoneNumber: kefuPhone //仅为示例
					});
				} else if (kefu == 3) {
					let userId = uni.getStorageSync('userId')
					if (userId) {
						uni.navigateTo({
							url: '/my/setting/customer'
						});
					} else {
						uni.navigateTo({
							url: '/pages/public/login'
						})
					}

				} else {
					// #ifdef MP-WEIXIN
					let that = this
					try {
						wx.openCustomerServiceChat({
							extInfo: {
								url: that.$queue.getData('kefuUrl')
							},
							corpId: that.$queue.getData('kefuAppId'),
							success(res) {},
							fail(res) {
								console.error(res)
							}
						})
					} catch (error) {
						console.error("catchcatch" + error)
						uni.showToast({
							title: '请更新至微信最新版本'
						});
					}
					// #endif
					// #ifndef MP-WEIXIN
					let url = that.$queue.getData('kefuUrl');
					if (url.indexOf('/pages/') !== -1 || url.indexOf('/my/') !== -1) {
						uni.navigateTo({
							url
						});
					} else {
						//#ifndef H5
						uni.navigateTo({
							url: '/pages/index/webView?url=' + url
						});
						//#endif
						//#ifdef H5
						window.location.href = url;
						//#endif
					}
					// #endif
				}
			},
			calculateDistance(lat1, lon1, lat2, lon2) {
				// 将经纬度转换为弧度
				const radLat1 = lat1 * (Math.PI / 180);
				const radLat2 = lat2 * (Math.PI / 180);
				const radLon1 = lon1 * (Math.PI / 180);
				const radLon2 = lon2 * (Math.PI / 180);
				const a = radLat1 - radLat2;
				const b = radLon1 - radLon2;

				// 使用海里公式计算距离
				const Haversine = Math.pow(Math.sin(a / 2), 2) + Math.cos(radLat1) * Math.cos(radLat2) * Math.pow(Math.sin(
					b / 2), 2);
				const distance = 2 * 6371 * Math.atan2(Math.sqrt(Haversine), Math.sqrt(1 - Haversine));

				// 返回单位为公里的距离
				return distance;

			},
			// 开启订阅消息
			openMsg() {
				console.log('订阅消息')
				var that = this
				uni.getSetting({
					withSubscriptions: true, //是否获取用户订阅消息的订阅状态，默认false不返回
					success(ret) {
						console.log(ret.subscriptionsSetting, '------------------')
						// if (ret.subscriptionsSetting.itemSettings && Object.keys(ret.subscriptionsSetting.itemSettings).length == 2) {
						if (ret.subscriptionsSetting.itemSettings) {
							uni.setStorageSync('sendMsg', true)
							uni.openSetting({ // 打开设置页
								success(rea) {
									console.log(rea.authSetting)
								}
							});
						} else { // 用户没有点击“总是保持以上，不再询问”则每次都会调起订阅消息
							uni.setStorageSync('sendMsg', false)
							uni.showModal({
								title: '提示',
								content: '为了更好的体验,请绑定消息推送',
								confirmText: '确定',
								cancelText: '取消',
								success: function(res) {
									if (res.confirm) {
										wx.requestSubscribeMessage({
											tmplIds: that.arr,
											success(re) {
												var datas = JSON.stringify(re);
												if (datas.indexOf("accept") != -1) {
													console.log(re)
													// uni.setStorageSync('sendMsg', true)
												}
											},
											fail: (res) => {
												console.log(res)
											}
										})
										// uni.setStorageSync('sendMsg', true)

										that.showModal = false
									} else if (res.cancel) {
										console.log('取消')
										// uni.setStorageSync('sendMsg', false)
										that.showModal = true
									}
								}
							})
						}
					}
				})
			},
			getTpCount() {
				this.$Request.getT('/app/message/selectCityCount?city=' + this.city).then(res => {
					if (res.code == 0) {
						this.tpCount = res.data ? res.data : 0;
					}
				});
			},
			getTpMy() {
				this.$Request.getT('/app/message/selectMessageByUserId?page=1&limit=1&state=11').then(res => {
					if (res.code == 0) {
						if (res.data && res.data.list && res.data.list.length > 0) {
							this.tpSel = 1;
						} else {
							this.tpSel = 2;
						}
					}
				});
			},

			chaoji() { //超级满减

				let userId = uni.getStorageSync('userId')
				if (userId) {
					uni.navigateTo({
						url: '/my/wallet/index'
					})
				} else {
					uni.navigateTo({
						url: '/pages/public/login'
					})
				}
			},
			xinren() { //新人专享
				let userId = uni.getStorageSync('userId')
				if (userId) {
					uni.navigateTo({
						url: '/my/hongbao/xinrenhongbao'
					})
				} else {
					uni.navigateTo({
						url: '/pages/public/login'
					})
				}

			},
			goNavs(e) {
				let userId = uni.getStorageSync('userId')
				if (userId) {
					uni.switchTab({
						url: e
					})
				} else {
					uni.navigateTo({
						url: '/pages/public/login'
					})
				}

			},
			goNav(e) {
				let userId = uni.getStorageSync('userId')
				if (userId) {
					if (e != undefined) {
						uni.navigateTo({
							url: e
						})
					} else {
						uni.showToast({
							title: '敬请期待！'
						})
					}
				} else {
					uni.navigateTo({
						url: '/pages/public/login'
					})
				}


			},
			// chooseItem(item){

			// },
			chooseItem(e) { //点击某一个item 推荐明星
				console.log('授权', uni.getStorageSync('sendMsg'))
				if (uni.getStorageSync('sendMsg')) {
					console.log('授权+1')
					wx.requestSubscribeMessage({
						tmplIds: this.arr,
						success(re) {
							var datas = JSON.stringify(re);
							if (datas.indexOf("accept") != -1) {
								console.log(re)
							}
						},
						fail: (res) => {
							console.log(res)
						}
					})
				}
				if (this.token) {
					uni.navigateTo({
						url: '/pages/therapist/orderDetail?artificerId=' + e.artificerId + "&classifyId=" + this
							.tabIndex
					});
				} else {
					uni.navigateTo({
						url: '/pages/public/login'
					});
				}

			},
			goOrder(e) {
				// console.log('授权', uni.getStorageSync('sendMsg'))
				if (uni.getStorageSync('sendMsg')) {
					console.log('授权+1')
					wx.requestSubscribeMessage({
						tmplIds: this.arr,
						success(re) {
							console.log(JSON.stringify(re), 'asdasdasdasddas')
							var datas = JSON.stringify(re);
							if (datas.indexOf("accept") != -1) {
								console.log(re)
							}
						},
						fail: (res) => {
							console.log(res)
						}
					})
				}
				if (this.token) {
					uni.navigateTo({
						url: '/pages/therapist/orderDetail?artificerId=' + e.artificerId + "&classifyId=" + this
							.tabIndex
					});
				} else {
					uni.navigateTo({
						url: '/pages/public/login'
					});
				}

			},
			gengduo() {
				let userId = uni.getStorageSync('userId')
				if (userId) {
					uni.reLaunch({
						url: '/pages/therapist/therapist'
					})
				} else {
					uni.navigateTo({
						url: '/pages/public/login'
					})
				}

			},

			getCity(e) {
				// this.city = e[0].label;
				// uni.setStorageSync('city', this.city)
				// this.getKTCityList();
				// this.getHomeArtificerList();
				// this.getHomeNearbyList();
				// this.page = 1
				// this.getlist()
			},
			getKTCityList() {
				this.$Request.getT('/app/trip/selectTripList').then(res => {
					if (res.code == 0) {
						this.cityList = [];
						let isOpen = false
						let cityName = uni.getStorageSync('city') ? uni.getStorageSync('city') : '请选择城市'
						res.data.forEach((d, index) => {
							if (cityName === d.city) {
								isOpen = true;
							}
							let data = {}
							data.label = d.city
							data.value = index
							this.cityList.push(data);
						});

						if (!isOpen) {
							this.orderList = []
							// this.showTP = true;
						} else {
							this.showTP = false;
						}
					}
				});
			},
			showCityList() {
				// #ifdef APP-PLUS
				if (this.latitude === '' || this.longitude === '') {
					this.checkPermission();
					return;
				}
				// #endif
				this.Cityshow = true;
			},
			onSearch(e) {
				// this.artificerName = e;
				this.getlist()
			},
			async checkPermission() {
				let status = permision.isIOS ? await permision.requestIOS('location') : await permision.requestAndroid(
					'android.permission.ACCESS_FINE_LOCATION');
				if (status === null || status === 1) {
					status = 1;
				} else if (status === 2) {
					uni.showModal({
						content: "系统定位已关闭",
						confirmText: "确定",
						showCancel: false,
						success: function(res) {}
					})
				} else if (status.code) {
					uni.showModal({
						content: status.message
					})
				} else {
					uni.showModal({
						title: '定位服务已关闭',
						content: "您需要打开定位权限，否则我们将无法获得到您附近的项目服务，导致我们无法为您提供服务，请到>设置>隐私>定位服务>中开启【盛安到家】定位权限",
						confirmText: "设置",
						success: function(res) {
							if (res.confirm) {
								permision.gotoAppSetting();
							}
						}
					})
				}
				return status;
			},
			getHomeNearbyList() { //附近技师和明星技师
				var data = {
					isStart: 1,
					status: 1,
					// city:this.cityname,
					longitude: this.longitude,
					latitude: this.latitude,
					page: 1,
					limit: 3
				}
				this.$Request.get("/app/artificer/getHomeArtificerList", data).then(res => {
					if (res.code == 0) {
						this.starTechnician = res.startData.list;
						this.nearbyTechnician = res.nearData.list;
						// const myLatitude = this.latitude; // 当前位置纬度
						// const myLongitude = this.longitude; // 当前位置经度
						// const targetLatitude = 39.919; // 目标位置纬度
						// const targetLongitude = 116.486; // 目标位置经度
						// const targetLatitude = ''; // 目标位置纬度
						// const targetLongitude =''; // 目标位置经度
						for (var i = 0; i < this.nearbyTechnician.length; i++) {
							const distance = this.calculateDistance(
								this.latitude,
								this.longitude,
								this.nearbyTechnician[i].latitude,
								this.nearbyTechnician[i].longitude
							);
							this.nearbyTechnician[i].dingwei = distance.toFixed(1)
							console.log(`距离为: ${distance.toFixed(1)} km`);
						}
						this.nearbyTechnician.sort((a, b) => a.dingwei - b.dingwei);
						// this.classifyId = res.data[0].id;
						// this.getorderlist('')
					}
				});
			},
			// getHomeArtificerList(){//明星技师
			// 	var data={
			// 			  isStart: 1,
			// 			  status: 1,
			// 			  // city:this.cityname,
			// 			  longitude:this.longitude,
			// 			  latitude:this.latitude,
			// 			  page: 1,
			// 			  limit: 3
			// 			}
			// 	this.$Request.get("/app/artificer/getHomeArtificerList",data).then(res => {
			// 		console.log(res);
			// 		if (res.code == 0) {

			// 				this.starTechnician = res.startData.list;
			// 				 // for(var i=0;i<this.starTechnician.length;i++){
			// 					//  const distance = this.calculateDistance(
			// 					// 		 this.latitude,
			// 					// 		 this.longitude,
			// 					// 		 this.starTechnician[i].latitude,
			// 					// 		 this.starTechnician[i].longitude
			// 					// 	 );
			// 					// 	this.starTechnician[i].dingwei= distance.toFixed(1)
			// 					//  console.log(`距离为: ${distance.toFixed(1)} km`);
			// 				 // }
			// 				// this.classifyId = res.data[0].id;
			// 				// this.getorderlist('')
			// 		}
			// 	});
			// },
			//获取轮播图
			getBannerList() {

				this.$Request.get("/app/dict/list", {
					type: '服务类型'
				}).then(res => {
					if (res.code == 0) {
						if (res.data) {
							this.typeList = res.data
							// this.classifyId = res.data[0].id;
							// this.getorderlist('')
						}
					}
				});
			},
			goDatail(item) { //热门精选，推荐套餐 跳详情
				console.log("asdasdasddasd", item)
				let userId = uni.getStorageSync('userId')
				if (userId) {
					if (item.type == '114') {
						uni.navigateTo({
							url: '/pages/shop/qiyeDatail?id=' + item.id + '&name=' + 'index'
						})
					} else if (item.type == '104') {
						uni.navigateTo({
							url: '/pages/my/serviceOderDrtail?id=' + item.id + '&limit=' + this.limit + '&page=' +
								this.page + '&name=' + 'index' + '&isCanCoupon=' + item.isCanCoupon
						})
					} else if (this.typeData == '105') {
						uni.navigateTo({
							url: '/pages/my/cikarDrtail?id=' + item.id + '&name=' + 'index' + '&isCanCoupon=' +
								item.isCanCoupon
						})
					} else if (this.typeData == '106') {
						uni.navigateTo({
							url: '/pages/my/fuwuliaochengDetail?id=' + item.id + '&limit=' + this.limit +
								'&page=' + this.page + '&name=' + 'index' + '&isCanCoupon=' + item.isCanCoupon
						})
					} else {
						uni.navigateTo({
							url: '/pages/my/fuwuDateil?id=' + item.id + '&limit=' + this.limit + '&page=' + this
								.page
						})
					}
				} else {
					uni.navigateTo({
						url: '/pages/public/login'
					})
				}


			},
			chengFel(item) { //大家常买。。。 导航切换
				this.currentTabFl = item.id;
				if (this.currentTabFl == '1') { //大家常买
					// this.remen()
					let userId = uni.getStorageSync('userId')
					if (userId) {
						uni.navigateTo({
							url: '/pages/my/fuwudajiachangmai?text=' + 'index'
						})
					} else {
						uni.navigateTo({
							url: '/pages/public/login'
						})
					}
				} else if (this.currentTabFl == '2') { // 全部项目
					let userId = uni.getStorageSync('userId')
					if (userId) {
						uni.navigateTo({
							url: '/pages/my/fuwuGengduo?text=' + 'index'
						})
					} else {
						uni.navigateTo({
							url: '/pages/public/login'
						})
					}

				} else if (this.currentTabFl == '3') { //行业大拿
					let userId = uni.getStorageSync('userId')
					if (userId) {
						uni.navigateTo({
							url: '/pages/my/hangyedana'
						})
					} else {
						uni.navigateTo({
							url: '/pages/public/login'
						})
					}

				} else { // 女性专区
					let userId = uni.getStorageSync('userId')
					if (userId) {
						uni.navigateTo({
							url: '/pages/my/fuwuxiangm'
						})
					} else {
						uni.navigateTo({
							url: '/pages/public/login'
						})
					}


				}
			},
			remen() { //大家常买
				this.$Request.get("/app/massage/package/findPackageAndMassagePage", {
					page: '1',
					limit: '4'
				}).then(res => {
					if (res.code == 0) {
						if (res.data) {
							this.tjData = res.data.list
							for (var i = 0; i < this.tjData.length; i++) {
								this.tjData[i].tagsData = this.tjData[i].labels.split(',');
							}
						}
					}
				});
			},
			tozuozhe(item) {
				// console.log("itemitemitemitemitem",item)
				uni.reLaunch({
					url: '/pages/therapist/orderDetail?artificerId=' + item.createBy + '&classifyId=' + 'undefined'
				})
				this.currents = 1 //点击头像以后就会切换
			},
			cLike(item) {
				var data = {
					createBy: uni.getStorageSync('userId'),
					shipinquanId: item.id,
				}
				if (item.sfdz == '0') {
					this.$Request.post("/app/shipinquan/addDianzan", data).then(res => {
						if (res.code == 0) {
							this.artificerItem.dzs += 1;
							this.artificerItem.sfdz = '1';
						} else {
							uni.showToast({
								title: res.msg,
								icon: 'none'
							})
						}
					});

				} else { //取消点赞
					this.$Request.post("/app/shipinquan/delDianzan", data).then(res => {
						if (res.code == 0) {
							this.artificerItem.dzs -= 1;
							this.artificerItem.sfdz = '0';
						} else {
							uni.showToast({
								title: res.msg,
								icon: 'none'
							})
						}
					});
				}
			},
			likeFun(params, callback) { //评论点赞返回
				console.log("likeFun", params);
				// Implement your logic for likeFun
			},
			toComment(item) {
				// 注意点击评论之后会执行这里
				/*
				（1）先加载缓冲
				（2）获取当前视频 ID 信息
				（3）🌟🌟🌟🌟重要🌟🌟🌟🌟
					- 一定要记得看 index.vue 里面
					 uni.setStorageSync("user",this.peopleList[i]);
					 这个东西，用于存储当前用户信息。在 插件里面会使用到这个东西，
					 记得写一下。
			
				（4）打开评论
				*/
				uni.showToast({
					title: '加载中...',
					icon: 'none',
					position: 'bottom',
					duration: 300
				})
				uni.setStorageSync("videoID", item.id);
				this.videoID = item.id;
				this.$refs.pinglun.open('bottom');
				this.getPingL(this.videoID);
			},
			shangxian(item) { //请TA上线
				var data = {
					userId: item.createBy,
					byUserId: uni.getStorageSync('userId'),
				}
				this.$Request.post("/app/message/insertUpMessage", data).then(res => {
					if (res.code == 0) {
						uni.showToast({
							title: '提醒成功！'
						})
					} else {
						uni.showToast({
							icon: 'error',
							title: '提醒失败！'
						})
					}
				});
			},
			getPingL(shipinquanId) { //获取评论列表
				var data = {
					page: this.page,
					limit: 310,
					shipinquanId: shipinquanId
				}
				this.$Request.get("/app/shipinquan/contentlist", data).then(res => {
					if (res.code == 0) {
						var msg = res.data.records || {}
						this.tableTotal = res.data.total;
						var list = [];
						// for (let i = 0; i < msg.length; i++) {
						// 	list.push(msg[i])
						// }

						this.tableData = msg.map(item => {
							return {
								...item,
								parent_id: null,
								reply_id: null,
								reply_name: null,
								user_name: item.userName,
								user_avatar: item.userPhoto ? item.userPhoto : '../../static/logo.png',
								user_content: item.content,
								is_like: true,
								like_count: 8,
								create_time: item.createTime
							};
						});
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				});
			},
			replyFun(params, callback) {
				// console.log("replyFun", params);
				if (params.params.user_content == '') {
					uni.hideLoading();
					uni.showToast({
						icon: 'error',
						title: '请填写发布评论'
					})
				} else {
					var data = {
						createBy: uni.getStorageSync('userId'),
						content: params.params.user_content,
						shipinquanId: this.videoID,
					}
					this.$Request.post("/app/shipinquan/addContent", data).then(res => {
						if (res.code == 0) {
							setTimeout(() => this.getPingL(this.videoID), 500);
							this.showPopup == true;
							uni.hideLoading();
							this.artificerItem.pls++
							// callback(this.videoID);
						} else {
							uni.hideLoading();
							uni.showToast({
								title: res.msg,
								icon: 'none'
							})
						}
					});
				}
			},
			deleteFun({
				params,
				mode
			}, callback) {

				console.log("deleteFun", {
					params,
					mode
				});
				// 当请求成功, 调用callback执行评论删除;
				switch (this.deleteMode) {
					case "bind":
						// 逻辑: 调用接口进行评论内容修改 update
						setTimeout(() => callback(), 500); // 目前为了展示效果, 直接执行callback
						break;
					case "only":
						// 逻辑: 调用接口删除一个评论 delete
						setTimeout(() => callback(), 500); // 目前为了展示效果, 直接执行callback
						break;
					default:
						// all
						// 逻辑: 调用接口删除多个评论 [delete]
						// Demo如下:
						// axios.post("http://xxx/delete", { ids: params }).then((res) => {
						//   if (res.code === 0) {
						//     callback(res);
						//   }
						// });
						setTimeout(() => callback(), 500); // 目前为了展示效果, 直接执行callback
						break;
				}
			},
			closeScrollview() {
				// 点击评论里面的叉叉，就会关闭评论
				this.$refs.pinglun.close('bottom');
			},
		}
	}
</script>

<style scoped>
	.kefu span {
		font-size: 14px;
		color: #1296db;
	}

	.kefu image {
		width: 50px;
		height: 50px;
	}

	.kefu {
		width: 75px;
		height: 75px;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		position: fixed;
		right: 0;
		bottom: 0;
		margin-bottom: 20%;
		margin-right: -5px;
	}

	/* 定义闪烁动画 */
	@keyframes blink {

		0%,
		100% {
			opacity: 1;
			/* 初始和结束状态透明度为1 */
		}

		50% {
			opacity: 0.2;
			/* 中间状态透明度降低 */
		}
	}

	/* 应用动画到图片 */
	.blinking {
		animation: blink 1s infinite;
		/* 'blink' 是动画名, '1s' 是持续时间, 'infinite' 表示无限循环 */
		width: 50px;
		/* 假设设置了宽度 */
		height: auto;
		/* 自动调整高度 */
	}

	.popup-view /deep/.uni-popup__wrapper-box {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	/deep/.uni-video-fullscreen {
		display: none;
	}

	/* 隐藏小窗口按钮 */
	/deep/.uni-video-switch {
		display: none;
	}

	.swiper-item-view {
		width: 70%;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 1;
		/* 定义文本的行数 */
		overflow: hidden;
		text-overflow: ellipsis;
		word-break: break-all;
		text-align: center;
	}

	.videoConten {
		width: 70%;
		position: absolute;
		bottom: 0px;
		margin-bottom: 60px;
		/* height: 30px; */
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		/* 定义文本的行数 */
		overflow: hidden;
		text-overflow: ellipsis;
		word-break: break-all;
		margin-left: 15px;
		color: #fff;
	}

	.top-menu-view /deep/.uni-scroll-view-content {
		display: flex;
		flex-direction: row;
		justify-content: space-around;
	}

	.guanbi {
		width: 30px;
		height: 30px;
		position: absolute;
		top: 0;
		right: 0;
		margin-top: 15px;
		margin-right: 9px;
	}

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

	/deep/.uni-popup__wrapper-box {
		width: 100%;
		height: 100%;
	}

	.data-list {
		width: 100%;
		height: 162px;
		background-color: #000000;

	}

	.videoHovers {
		width: 76px;
		height: 76px;
		position: absolute;
		top: 0px;
		margin-top: 27%;
		margin-left: 27%;
		z-index: 99;
	}

	.videoHover {
		width: 76px;
		height: 76px;
		position: absolute;
		top: 0px;
		margin-top: 70%;
		margin-left: 40%;
	}

	.videoHover image,
	.videoHovers image {
		width: 100%;
		height: 100%;
	}

	.swiper-box-list /deep/.uni-scroll-view-content {
		display: flex;
		flex-direction: row;
		justify-content: space-around;
		flex-wrap: wrap;
	}

	.salogo {
		width: 130rpx;
		height: 32rpx;
		margin-left: 34rpx;
		margin-top: 6rpx;
	}

	.index-yanzheng {
		width: 100rpx;
		height: 22rpx;
		margin-left: 4rpx;
	}

	.localName {
		width: 540rpx;
		margin-left: 4rpx;
		font-weight: bold;
		color: #333333;
		margin-top: 3rpx;
		overflow: hidden;
		/* 确保超出容器的内容被裁剪 */
		white-space: nowrap;
		/* 确保文本在一行内显示 */
		text-overflow: ellipsis;
		/* 超出部分显示省略号 */
	}

	.view-more {
		display: inline-block;
		border-top: 1px solid;
		border-right: 1px solid;
		width: 7px;
		height: 8px;
		border-color: #999;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		margin-top: 3px;
	}

	/deep/.uni-icons {
		font-family: uniicons;
		text-decoration: none;
		text-align: center;
		color: #019c88 !important;
		font-size: 30rpx !important;
		margin-top: 3rpx;

	}

	/deep/.uni-select__selector-scroll {
		height: 100px;
	}

	/deep/.uni-stat__select {
		width: 60px;
		max-width: 60px;
	}

	/deep/.uni-select__input-text {
		width: 100%;
		color: #019c88;
		white-space: nowrap;
		text-overflow: ellipsis;
		-o-text-overflow: ellipsis;
		overflow: hidden;
	}

	/deep/.uni-select {
		width: 60px;
		font-size: 14px;
		border: 1px solid #a1e0d4;
		box-sizing: border-box;
		border-radius: 30px;
		padding: 0 4px;
		padding-left: 10px;
		position: relative;
		display: flex;
		-webkit-user-select: none;
		user-select: none;
		flex-direction: row;
		align-items: center;
		width: 100%;
		flex: 1;
		height: 30px;
		background: linear-gradient(90deg, #a4e1d5, #e6f7f3);
		color: #019c88;
	}

	/deep/.uni-searchbar__cancel {
		display: none;
	}

	.search-btn {
		text-align: center;
		line-height: 31px;
		color: #fff;
		width: 130rpx !important;
		height: 32px !important;
		margin-right: 20rpx;
		border-radius: 50rpx !important;
		background: linear-gradient(90deg, #019c88, #2fbf93) !important;
	}

	.index-line {
		width: 100%;
		/* display: flex; */
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	}

	/deep/.uni-searchbar__box-icon-search,
	.search-btn {
		height: 60rpx;
		background: #18A689;
		border-radius: 31rpx;

	}

	/deep/.uni-searchbar__box {
		height: 32px;
		border-radius: 15px !important;
		background-color: #fff !important;
		border: 1rpx solid #019c88;
		padding: 0px;
		display: flex;
		flex-direction: row;
		flex-flow: row-reverse;
		position: relative;
		justify-content: center;
	}

	/deep/.uni-searchbar {
		width: 80%;
		border-radius: 31rpx;
		margin-left: 6rpx;
	}

	.index-headset {
		margin-right: 30rpx;
		display: flex;
		align-items: center;
		margin-top: 4rpx;
		justify-content: flex-end;
	}

	.locate-line {
		/*padding-left: 25rpx;*/
		margin-top: 3rpx;
		display: flex;
		align-items: center;
	}

	.popup-mian-view {
		width: 100%;
		display: flex;
		flex-direction: row;
		align-items: center;
		flex-wrap: wrap;
	}

	.popup-mian-btn span:nth-child(1) {
		background: linear-gradient(90deg, #FE912E, #FF9970);
	}

	.popup-mian-btn span:nth-child(2) {
		background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
	}

	.popup-mian-btn span {
		width: 247rpx;
		height: 77rpx;
		line-height: 77rpx;
		text-align: center;
		font-weight: 400;
		font-size: 32rpx;
		color: #FFFEFE;
		border-radius: 39rpx;
	}

	.popup-mian-btn {
		width: 100%;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		margin-top: 28px;
	}

	.popup-mian-textarea {
		width: 525.69rpx;
		height: 211.81rpx;
	}

	.popup-mian {
		width: 88%;
		display: flex;
		flex-direction: column;
		margin: 0px auto 12px auto;
	}

	.popup-head span:nth-child(2) {
		width: 50rpx;
		height: 50rpx;
		line-height: 19px;
		text-align: center;
		font-size: 24px;
		color: #15AB8D;
		border-radius: 50%;
		border: 1px solid #15AB8D;
	}

	.popup-head span:nth-child(1) {
		font-weight: bold;
		font-size: 32rpx;
		color: #333333;
	}

	.popup-head {
		width: 100%;
		height: 99.38rpx;
		background-color: rgba(21, 171, 141, 0.09);
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		padding: 0 15px;
	}

	.popup-content {
		width: 613rpx;
		height: auto;
		background: #fff url(../../static/background-img3.png)no-repeat;
		background-size: 130%;
		border-radius: 36rpx;
		display: flex;
		flex-direction: column;
	}

	.popup-close {
		text-align: right;
		margin-top: 15rpx;
		margin-right: 15rpx;

	}

	.popup-close-img {
		width: 50rpx;
		height: 50rpx;
	}

	/deep/.item-descr {
		-webkit-line-clamp: 2;
		margin-top: 5px;
	}

	.index-card-image {
		width: 100%;
		height: 100%;
		border-radius: 15rpx;
	}

	.content_bj {
		height: 100%;
		background: #fff url(../../static/background-img2.png)no-repeat;
		background-size: 100%;
	}

	.index-card-view-title {
		position: relative;
		width: 100%;
		height: 337.5rpx;
		display: flex;
		flex-direction: row;
		border-radius: 30px;
	}

	/deep/.u-select {
		width: 100%;
		height: 100%;
	}

	/deep/.u-select__header {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		height: 38px;
		padding: 0 19px;
	}

	/deep/.u-content,
	/deep/.u-search {
		flex: none;
		width: 533rpx;
		border-radius: 32rpx !important;
		height: 64rpx !important;
	}

	/deep/.u-action {
		display: none;
	}

	.dingwei-img {
		width: 26rpx;
		height: 29rpx;
	}

	.menu-topic-act .menu-topic-bottom-color {
		background: linear-gradient(90deg, rgba(234, 248, 245, 0.7), rgba(132, 211, 196, 0.7));
	}


	/* 字体 */
	.font-size-19 {
		font-size: 19rpx;
	}

	.font-size-34 {
		font-size: 35.72rpx;
	}

	.width {
		width: 95%;
	}

	/* 样式 */
	.index-taocan-view-nav:last-child .fenjie {
		display: none;
	}

	.index-taocan-view-nav-s {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.index-taocan-view-nav {
		width: 25%;
		display: flex;
		flex-direction: row;
		align-items: center;
	}

	.swiper-item span:nth-child(1) {
		font-weight: bold;
		font-size: 29rpx;
		color: #333333;
		margin: 10px 11px 0px 8px;
	}

	.swiper-item span:nth-child(2) {
		ont-weight: 400;
		font-size: 24rpx;
		color: #999999;
	}

	.swiper-item {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.swiper-item-card {
		width: 346rpx;
		display: flex;
		flex-direction: column;
		margin-top: 12rpx;
	}

	.swiper-back-img {
		width: 100%;
		height: 338rpx;
		background-color: rgba(0, 0, 0, 0.2);
		border-radius: 17rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		background: url(../../static/yuyue.png) 100% no-repeat;
	}

	.swiper-back-img image {
		width: 91.67rpx;
		height: 93.06rpx;
	}

	.body-view {
		width: 100%;
		overflow: hidden;
		padding-bottom: 100px;
	}

	.top-menu-view {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		white-space: nowrap;
		background: linear-gradient(180deg, rgba(238, 250, 246, 0.6), rgba(255, 255, 255, 0.9));
		background-color: rgba(1, 156, 136, 0.2);
		height: 108rpx;
		line-height: 108rpx;
		margin-top: 10rpx;

	}

	.menu-topic-text {
		font-size: 30rpx;
		color: #333;
		padding: 10rpx 70rpx;
		font-weight: 500;
	}

	.menu-topic-bottom {
		position: absolute;
		bottom: 0;
		width: 100%;
	}

	.menu-topic-view {
		display: inline-block;
		white-space: nowrap;
		height: 86rpx;
		position: relative;
	}

	.menu-topic-act .menu-topic-bottom {
		display: flex;
		justify-content: center;
	}

	.menu-topic-act .menu-topic-text {
		color: #000000;
		font-weight: bold;
	}

	.menu-topic-bottom-color {
		width: 62.5rpx;
		height: 4px;
		position: absolute;
		z-index: 66;
		margin-top: -23px;
	}

	/deep/.menu-topic-act {
		position: relative;
	}

	.swiper-box-list {
		width: 95%;
		margin: 5px auto;
		/* flex:1; */
		background-color: #FFFFFF;
		height: 490px;
	}

	.swiper-topic-list {
		width: 48%;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		flex-wrap: wrap;
	}

	/* 隐藏滚动条，但依旧具备可以滚动的功能 */
	/deep/.uni-scroll-view::-webkit-scrollbar {
		display: none
	}


	.index-card-mian-biao-left,
	.index-card-mian-biao-right {
		padding: 3px 5px;
	}

	.index-card-mian-biao-right {
		background-color: rgba(4, 184, 119, 0.12);
		border-radius: 8rpx;
		font-weight: 400;
		font-size: 23rpx;
		color: #0EBE80;
		margin-left: 10px;
	}

	.index-card-mian-biao-left {
		background: linear-gradient(90deg, #ffefde, #fff7ef);
		height: 34rpx;
		line-height: 34rpx;
		border-radius: 8rpx;
		padding: 0 10rpx;
		font-size: 22rpx;
		margin-right: 8rpx;
		margin-bottom: 8rpx;
		color: #f68607;
	}

	.index-card-mian-biao {
		width: 100%;
		display: flex;
		flex-direction: row;
		align-items: center;
	}

	.index-card-mian-title {
		font-size: 28rpx;
		color: #333333;
	}

	.marginTop {
		margin-bottom: 5px;
	}

	.index-card-mian {
		width: 100%;
		display: flex;
		flex-direction: column;
		margin-top: 5px;
	}

	.index-card-view-title-right {
		width: 65px;
		height: 47rpx;
		line-height: 47rpx;
		background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
		border-top-left-radius: 10px;
		border-bottom-right-radius: 10px;
		text-align: center;
		font-weight: 400;
		font-size: 22rpx;
		color: #fff;
		position: absolute;
		top: 15rpx;
		left: 10rpx;
		/* margin-left: 85px; */
	}

	.index-card-view-title-left {
		width: 95px;
		height: 46.53rpx;
		line-height: 46.53rpx;
		font-weight: 400;
		font-size: 21rpx;
		text-align: center;
		color: #333333;
		border-top-left-radius: 30px;
		background-color: rgba(176, 176, 176, 0.48);
	}

	.index-card-mian-time,
	.index-card-mian-money {
		display: flex;
		flex-direction: row;
		align-items: center;
	}

	.index-card-mian-money-zhen {
		font-weight: 400;
		font-size: 31rpx;
		color: #000000;
	}

	.index-card-mian-money-jia {
		margin-left: 10px;
		font-weight: 400;
		font-size: 24rpx;
		color: #999999;
		text-decoration-line: line-through;
	}

	.index-card-mian-time span {
		font-weight: 400;
		font-size: 24rpx;
		color: #666666;
	}

	.index-card-mian-time image {
		width: 20.83rpx;
		height: 20.83rpx;
		margin-right: 10px;
	}

	.index-card-view {
		width: 336.81rpx;
		display: flex;
		flex-direction: column;
		margin-top: 7px;
	}

	.tuijian-view {
		width: 100%;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		margin-top: 15px;
	}

	.index-card {
		width: 100%;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		flex-wrap: wrap;
		align-items: center;
		margin-top: 15px;
	}

	.fenjie {
		width: 1rpx;
		height: 32rpx;
		background: #CCCCCC;
	}

	.index-taocan-view-nav-text {
		font-weight: bold;
		font-size: 16px;
	}

	.index-taocan-view-nav-jie {
		font-weight: 400;
		font-size: 22rpx;
		color: #999;
	}

	.activeL {
		color: #019C88;
	}

	.activeXL {
		color: #2FC590;
	}

	.activeH {
		color: #333333;
	}

	.activexH {
		color: #999999;
	}

	.feng_word {
		font-size: 25rpx;
	}

	.index-taocan-view {
		width: 100%;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		margin-top: 28rpx;
	}

	.index-taocan {
		padding: 0 30rpx;
		width: 100%;
		display: flex;
		flex-direction: column;
		background: linear-gradient(180deg, rgba(238, 250, 246, 0.6), rgba(255, 255, 255, 0.9));
		margin: 20rpx 0px 0px 0px;
	}

	.index-fujin-jie-id {
		height: 30rpx;
		font-size: 24rpx;
		color: #999999;
		text-align: center;
		display: table;
		width: 100px;
		white-space: pre-wrap;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 1;
		overflow: hidden;
	}

	.index-fujin-jie-name {
		margin-bottom: 3px;
		font-size: 30rpx;
		color: #333333;
		font-weight: bold;
	}

	.index-fujin {
		width: 100%;
		height: 290px;
		background: linear-gradient(0deg, #fff, #F4FFFB);
		margin-top: 5rpx;
	}

	.index-fujin-jie-view {
		width: 222.22rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-top: 10px;
	}

	.index-fujin-jie {
		width: 100%;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}

	.fujin-view {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		padding-bottom: 10px;
	}

	.index-fujin-view {
		width: 222.22rpx;
		position: relative;
		display: flex;
		align-items: center;
		height: 313rpx;
	}

	.index-fujin-view-img {
		width: 100%;
		height: 308.5rpx;
		border-radius: 14rpx;
	}

	.index-fujin-view-text {
		width: 100%;
		height: 63px;
		display: flex;
		flex-direction: row;
		align-items: flex-end;
		justify-content: center;
		background: linear-gradient(4deg, rgba(0, 156, 136, 0.3), rgba(0, 156, 136, 0));
		border-radius: 0px 0px 7px 7px;
		position: absolute;
		bottom: 1px;
		padding-bottom: 13px;
	}

	.index-fujin-img {
		margin: 0 auto;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}

	.index-fujin-view-text span {
		font-weight: 400;
		font-size: 25rpx;
		color: #FFFFFF;
	}

	.index-fujin-view-text image {
		width: 20.83rpx;
		height: 22.61rpx;
		margin-right: 5px;
	}

	.index-fujin-title-left image {
		width: 33.33rpx;
		height: 33.33rpx;
		margin-right: 10px;
	}

	.index-fujin-title-left span {
		font-weight: bold;
		font-size: 31rpx;
		color: #333333;
	}

	.index-fujin-title-left-text,
	.index-fujin-title-left-btn {
		font-weight: 400;
		font-size: 23rpx;
		color: #333;
	}

	.index-fujin-title-left-btn {
		margin-left: 8px;
		margin-right: 5px;
	}

	.index-fujin-title-left,
	.index-fujin-title-right {
		display: flex;
		flex-direction: row;
		align-items: center;
	}

	.index-fujin-title {
		margin: 0 auto;
		padding: 15px 0px;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		margin-top: 10px;
	}

	.index-guanggao-pintuan {
		width: 400.28rpx;
		height: 100%;
	}

	.index-guanggao-right {
		width: 400.28rpx;
		height: 100%;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}

	.index-guanggao-right-cika {
		width: 100%;
		height: 200.56rpx;
		margin-bottom: 10rpx;
	}

	.index-guanggao-right-yuyue {
		width: 100%;
		height: 200.56rpx;
	}

	.index-guanggao {
		margin: 10px auto;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		/* height: 426.39rpx; */
	}

	.index-project {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		margin: 5px 10px 20px 10px;
	}

	.index-project-content image {
		width: 68.75rpx;
		height: 72.22rpx;
	}

	.index-project-content {
		display: flex;
		flex-direction: column;
		flex-basis: 20%;
		align-items: center;
		margin-top: 15px;
		height: 58px;
	}

	.index-project-content1 {
		display: flex;
		flex-direction: column;
		flex-basis: 33%;
		align-items: center;
		margin-top: 15px;
		height: 58px;
	}

	.index-project-content1 image {
		width: 68.75rpx;
		height: 72.22rpx;
	}

	.star-technician-name {
		font-weight: bold;
		font-size: 37rpx;
		color: #FFFFFF;
		margin-top: -26rpx;
	}

	.star-technician-name-bot {
		font-weight: 400;
		font-size: 21rpx;
		color: #FFFFFF;
		opacity: 0.7;
		margin-left: 10px;
	}

	.star-technician-gengguo {
		font-weight: 400;
		font-size: 22rpx;
		color: #FFFFFF;
	}

	.star-technician-top-text {
		display: flex;
		flex-direction: row;
		align-items: center;
	}

	.title-star {
		width: 95.1%;
		margin: 0 auto;
		display: flex;
		height: 51px;
	}

	.star-technician-top {
		width: 100%;
		height: 100%;
		padding: 0px 20px;
		background-image: url(../../static/frame.png);
		background-size: 100%;
		background-repeat: no-repeat;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}

	.star-technician-mian {
		width: 100%;
		height: 100%;
	}

	.star-technician {
		position: relative;
		margin: -15px auto 0px auto;
		height: 216px;
		display: flex;
		flex-direction: column;
		background: #FFFFFF;
		border-radius: 0px 0px 10px 10px;
		border: 4.5px solid #049E89;
		padding: 0px 10px;
	}

	.index-gun {
		width: 400px !important;
		white-space: nowrap;
		overflow-x: scroll;
	}

	.index-fenl {
		overflow: hidden;
		height: 40px;
		margin: 0 auto;
	}

	.fenl:nth-child(1) {
		padding-left: 0px !important;
	}

	.fenl {
		display: inline-block;
		padding: 0px 10px;
		text-align: center;
		color: #666666;
		font-weight: 500;
		font-size: 34rpx;
	}

	.index-nav-bottom image {
		width: 350.11rpx;
		height: 182.64rpx;
	}

	.index-nav-bottom {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		margin: 0px auto 8px auto;
	}

	.index-mian-select image {
		width: 16px;
		height: 8px;
		margin-left: 5px;
	}

	.index-mian-select {
		display: flex;
		flex-direction: row;
		align-items: center;
	}

	.index-mian {
		width: 98%;
		margin: 4rpx auto;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	}

	.index-top-mian {
		display: flex;
		margin-left: 15rpx;
	}

	.index-top-left {
		color: #019C88;
		font-weight: bold;
	}

	.index-top-right {
		display: flex;
		flex-direction: row;
		align-items: center;
	}

	.index-top-right image {
		width: 13px;
		height: 12px;
		margin-right: 5px;
	}

	.index-top-mian-text {
		display: flex;
		flex-direction: row;
		align-items: center;
		margin-left: 5px;
	}

	.index-top-mian-text span {
		color: #019c88;
		font-weight: 400;
		margin-left: 3px;
		font-size: 12px;
	}

	.index-top-mian-text image {
		width: 30rpx;
		height: 30rpx;
	}

	.index-top {
		width: 94%;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		margin: 0 auto;
	}

	.index-head {
		width: 100%;
		display: flex;
		align-items: flex-start;
		flex-direction: column;
		padding-top: 10px;
	}

	.content {
		width: 100%;
		height: 100vh;
		overflow: auto;
	}

	.shop_label {
		display: flex;
		flex-wrap: wrap;
		margin-top: 10rpx;
	}

	.shop_label span {
		background: linear-gradient(90deg, #ffefde, #fff7ef);
		height: 34rpx;
		line-height: 34rpx;
		border-radius: 8rpx;
		padding: 0 10rpx;
		font-size: 22rpx;
		margin-right: 8rpx;
		margin-bottom: 8rpx;
		color: #f68607;
	}

	.userInfo {
		position: absolute;
		bottom: 110px;
		right: 10px;
		display: flex;
		flex-direction: column;
		z-index: 18;
	}

	.userAvatar {
		border-radius: 500%;
		border-style: solid;
		border-width: 2px;
		border-color: #ffffff;
		width: 100rpx;
		height: 100rpx;
	}

	.list-view {
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.uni-popup {
		width: 100%;
		height: 500px;
		overflow: auto;
	}

	.popup-content-pl {
		width: 100%;
		height: 100%;
		background-color: #242424;
		border-top-left-radius: 10px;
		border-top-right-radius: 10px;
		position: relative;
		display: flex;
		flex-direction: column;
	}
	.smrz {
	    display: flex;
	    justify-content: space-between;
		margin-top: 5px;
		padding-left: 20%;
		padding-right: 20%;
	    /* padding-left: 48%;
	    padding-right: 5px; */
	}
</style>