新增商城系列

App.vue

@@ -12,7 +12,7 @@
 				toolAll.tools.daoTime()
 				toolAll.tools.networkStatus()//检查当前网络状态
 				toolAll.tools.updaX()//检测版本更新
-			}
+			} 
 			setTimeout(()=>{
 				toolAll.tools.overdue()//查询是否第一次授权
 			},3000)

commons/hengmei.css

@@ -95,6 +95,27 @@
 .lianShare{height: 90rpx;width: 220rpx;}
 .backH{width: 190rpx;height: 190rpx;top: -126rpx;}
 
+/* 商城 */
+.activecate,.shopMo{width: 216rpx;height: 65rpx;border-radius: 20rpx;line-height: 65rpx;text-align: center;background-color: #f2f2f2;color: #333333;}
+.activecate{color: #FFFFFF;}
+.shopMo span::after,.activecate span::after{display: inline-block;content: '';width: 16rpx;height: 13rpx;margin-left: 6rpx;}
+.shopMo span::after{background: url(/static/public/shopSJ.png) no-repeat;background-size: 100% 90%;}
+.activecate span::after{background: url(/static/public/shopSJ-active.png) no-repeat;background-size: 100% 90%;transform: rotate(180deg);background-position: 0 2rpx;}
+.shop_list_box>view>view:last-child{margin-bottom: 200rpx;}
+
+.activebcate,.shopBMo{border-radius: 20rpx;background-color: #f2f2f2;color: #333333;padding: 12rpx 24rpx;}
+.activebcate{color: #FFFFFF;}
+
+
+/* 商品详情 */
+.activelei,.molei{border-radius: 20rpx;padding: 10rpx 24rpx;color: #333333;margin-left: 20rpx;}
+.activelei{color: #FFFFFF;}
+
+
+/* 准备下单 */
+.activeT,.expressT{width: 124rpx;height: 60rpx;line-height: 60rpx;text-align: center;margin-left: 20rpx;border-radius: 20rpx;}
+.activeT{color: #FFFFFF;}
+.activeQuan::before{content: '';display: block;width: 50%;height: 8rpx;background: #3875F6;position: absolute;bottom: -20rpx;left: 50%;transform: translateX(-50%);}
 
 
 

components/foot-tab.vue

@@ -131,7 +131,8 @@
 					if(!this.jieDuan){
 						let isAuth = this.$toolAll.tools.returnAuth()
 						if(!isAuth){
-							this.isShowT = true
+							uni.reLaunch({url:'/pages/tabbar/shop/shop'})
+							// this.isShowT = true
 						} else this.jieDuan = true
 					}
 					// uni.navigateTo({url:'/pages/tabbar/shop/shop'})

components/shop-list.vue

@@ -0,0 +1,121 @@
+<template>
+	<view class="pad20 shop_list_box">
+		<view style="width: 48.6%;float: left;">
+			<view class="bacf radius15 mar-x20" @tap="goPage">
+				<image src="../../../static/public/wen-one.png" mode="aspectFill" style="width: 100%;border-top-left-radius: 15rpx;border-top-right-radius: 15rpx;height: 325rpx;"></image>
+				<view class="pad-zy20 pad-s10 pad-x30">
+					<view class="fon28 bold col3 clips2">【99皮皮节】【种植发际 线】1000单位FUE技术...</view>
+					<view class="disac fon20 mar-sx20">
+						<view class="radius10 colf" style="padding: 6rpx 10rpx;margin-right: 10rpx;" :style="{background:publicColor}">秃顶种植</view>
+						<view class="radius10 colf" style="padding: 6rpx 10rpx;background: #F85050;">团购</view>
+					</view>
+					<view class="disac">
+						<view class="fon28 bold" style="color: #F85050;margin-right: 8rpx;">￥3888</view>
+						<view class="fon24" style="text-decoration: line-through;color: #C7C7C7;">￥4205</view>
+					</view>
+				</view>
+			</view>
+			<view class="bacf radius15 mar-x20">
+				<image src="../../../static/public/wen-one.png" mode="aspectFill" style="width: 100%;border-top-left-radius: 15rpx;border-top-right-radius: 15rpx;height: 325rpx;"></image>
+				<view class="pad-zy20 pad-s10 pad-x30">
+					<view class="fon28 bold col3 clips2">【99皮皮节】【种植发际 线】1000单位FUE技术...</view>
+					<view class="disac fon20 mar-sx20">
+						<view class="radius10 colf" style="padding: 6rpx 10rpx;margin-right: 10rpx;" :style="{background:publicColor}">秃顶种植</view>
+						<view class="radius10 colf" style="padding: 6rpx 10rpx;background: #F85050;">团购</view>
+					</view>
+					<view>
+						<view class="disjbac">
+							<view class="fon28 bold" style="color: #F85050;margin-right: 8rpx;">拼团价￥3888</view>
+							<view class="fon24" style="text-decoration: line-through;color: #C7C7C7;">￥4205</view>
+						</view>
+						<view class="disjbac mar-s20">
+							<view class="fon24 col80">已拼团10组</view>
+							<view class="disac">
+								<image src="../../../static/tabbar/mya.png" mode="" style="width: 40rpx;height: 40rpx;border-radius: 100%;"></image>
+								<image src="../../../static/tabbar/mym.png" mode="" style="width: 40rpx;height: 40rpx;border-radius: 100%;margin-left: -20rpx;"></image>
+								<image src="../../../static/tabbar/homeAc.png" mode="" style="width: 40rpx;height: 40rpx;border-radius: 100%;margin-left: -20rpx;"></image>
+							</view>
+						</view>
+					</view>
+				</view>
+			</view>
+			<view class="bacf radius15 mar-x20">
+				<image src="../../../static/public/wen-one.png" mode="aspectFill" style="width: 100%;border-top-left-radius: 15rpx;border-top-right-radius: 15rpx;height: 325rpx;"></image>
+				<view class="pad-zy20 pad-s10 pad-x30">
+					<view class="fon28 bold col3 clips2">【99皮皮节】【种植发际 线】1000单位FUE技术...</view>
+					<view class="disac fon20 mar-sx20">
+						<view class="radius10 colf" style="padding: 6rpx 10rpx;margin-right: 10rpx;" :style="{background:publicColor}">秃顶种植</view>
+						<view class="radius10 colf" style="padding: 6rpx 10rpx;background: #F85050;">团购</view>
+					</view>
+					<view>
+						<view class="disjbac">
+							<view class="fon28 bold" style="color: #F85050;margin-right: 8rpx;">促销价￥3888</view>
+							<view class="fon24" style="text-decoration: line-through;color: #C7C7C7;">￥4205</view>
+						</view>
+						<view class="fon24 col80 mar-s20">结束时间：15小时00分00秒</view>
+					</view>
+				</view>
+			</view>
+		</view>
+		<view style="width: 48.6%;float: right;">
+			<view class="bacf radius15 mar-x20">
+				<image src="../../../static/public/wen-one.png" mode="aspectFill" style="width: 100%;border-top-left-radius: 15rpx;border-top-right-radius: 15rpx;height: 325rpx;"></image>
+				<view class="pad-zy20 pad-s10 pad-x30">
+					<view class="fon28 bold col3 clips2">【99皮皮节】【种植发际 线】1000单位FUE技术...</view>
+					<view class="disac fon20 mar-sx20">
+						<view class="radius10 colf" style="padding: 6rpx 10rpx;margin-right: 10rpx;" :style="{background:publicColor}">秃顶种植</view>
+						<view class="radius10 colf" style="padding: 6rpx 10rpx;background: #F85050;">团购</view>
+					</view>
+					<view>
+						<view class="disjbac">
+							<view class="fon28 bold" style="color: #F85050;margin-right: 8rpx;">拼团价￥3888</view>
+							<view class="fon24" style="text-decoration: line-through;color: #C7C7C7;">￥4205</view>
+						</view>
+						<view class="disjbac">
+							<view class="fon24 col80">已拼团10组</view>
+							<view>
+								<image src="" mode="" style="width: 40rpx;height: 40rpx;"></image>
+							</view>
+						</view>
+					</view>
+				</view>
+			</view>
+			<view class="bacf radius15 mar-x20">
+				<image src="../../../static/public/wen-one.png" mode="aspectFill" style="width: 100%;border-top-left-radius: 15rpx;border-top-right-radius: 15rpx;height: 325rpx;"></image>
+				<view class="pad-zy20 pad-s10 pad-x30">
+					<view class="fon28 bold col3 clips2">【99皮皮节】【种植发际 线】1000单位FUE技术...</view>
+					<view class="disac fon20 mar-sx20">
+						<view class="radius10 colf" style="padding: 6rpx 10rpx;margin-right: 10rpx;" :style="{background:publicColor}">秃顶种植</view>
+						<view class="radius10 colf" style="padding: 6rpx 10rpx;background: #F85050;">团购</view>
+					</view>
+					<view class="disac">
+						<view class="fon28 bold" style="color: #F85050;margin-right: 8rpx;">￥3888</view>
+						<view class="fon24" style="text-decoration: line-through;color: #C7C7C7;">￥4205</view>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name:"shop-list",
+		data() {
+			return {
+				publicColor:uni.getStorageSync('publicColor'),
+			};
+		},
+		methods:{
+			goPage(){//进入商品详情事件
+				uni.navigateTo({
+					url:'/pagesB/shopDetail/shopDetail'
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+
+</style>

pages.json

@@ -46,6 +46,33 @@
 					"path" : "suggestions/suggestions",//投诉及建议
 					"style" : {}
 				}
+                ,{
+                    "path" : "shopCart/shopCart",
+                    "style" :                                                                                    
+                {
+                    "navigationBarTitleText": "",
+                    "enablePullDownRefresh": false
+                }
+                
+                }
+                ,{
+                    "path" : "getReadyDan/getReadyDan",
+                    "style" :                                                                                    
+                {
+                    "navigationBarTitleText": "",
+                    "enablePullDownRefresh": false
+                }
+                
+                }
+                ,{
+                    "path" : "immediatePayment/immediatePayment",
+                    "style" :                                                                                    
+                {
+                    "navigationBarTitleText": "",
+                    "enablePullDownRefresh": false
+                }
+                
+                }
             ]
 		}, 
 		{//B包
@@ -110,6 +137,24 @@
 					"path":"customer/customer",
 					"style":{}
 				}
+                ,{
+                    "path" : "shopDetail/shopDetail",
+                    "style" :                                                                                    
+                {
+                    "navigationBarTitleText": "",
+                    "enablePullDownRefresh": false
+                }
+                
+                }
+                ,{
+                    "path" : "orderDetail/orderDetail",
+                    "style" :                                                                                    
+                {
+                    "navigationBarTitleText": "",
+                    "enablePullDownRefresh": false
+                }
+                
+                }
             ]
 		}
 	],

pages/tabbar/pagehome/pagehome.vue

@@ -78,6 +78,11 @@
 		<!-- <back-top :showTop="showTop" @backTop="backTop"></back-top> -->
 		<!-- 底部客服 -->
 		<!-- <public-customer></public-customer> -->
+		<!-- 弹框优惠券 -->
+		<view class="" v-if="isQuan" style="background: rgba(0,0,0,.54);position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 11;display: flex;justify-content: center;flex-direction: column;align-items: center;">
+			<image src="../../../static/public/yquan.png" style="width: 542rpx;height: 600rpx;" mode="aspectFill"></image>
+			<image @tap="closeEv" src="../../../static/public/closequan.png" style="width: 96rpx;height: 96rpx;margin-top: 56rpx;" mode=""></image>
+		</view>
 	</view>
 </template>
 
@@ -126,7 +131,8 @@
 				reNum:0,
 				bannerList:[],//轮播图
 				jieDuan:false,
-				isNewRenderDone:false //锁的作用
+				isNewRenderDone:false ,//锁的作用
+				isQuan:true
 			}
 		},
 		onPageScroll(e) {
@@ -211,6 +217,9 @@
 			this.$toolAll.tools.buriedPointAll()//查询需要埋点的事件id
 		},
 		methods: {
+			closeEv(){
+				this.isQuan = false;
+			},
 			checkSwi(){
 				checkBanner({position:'home-banner'}).then(res=>{
 					if(res.code==0){

pages/tabbar/shop/shop.vue

@@ -1,21 +1,82 @@
 <template>
 	<view>
 		<!-- 状态栏 -->
-		<status-nav :titleVal="'商城'" :statusTitle="true"></status-nav>
+		<status-nav :titleVal="'商城'"  :statusBack="false" :statusTitle="true"></status-nav>
-		
+		<!-- 搜索输入框 -->
-		
+		<view class="search-input-box bacf" :style="{top: statusHNH+'px'}" style="position: fixed;left: 0;right: 0;">
-		
+			<view class="disac pad-zy30 mar-s20">
+				<!-- 输入框 -->
+				<input style="border: 2rpx solid #E0E0E0;padding: 0rpx 20rpx;height: 80rpx;line-height: 80rpx;" class="width100 fon34 radius10" type="text" v-model="searchVal" placeholder="请输入商品名称"/>
+				<!-- 搜索 -->
+				<view class="flexs mar-z30 radius10 pad-zy40 fon34 colf" style="height: 80rpx;line-height: 80rpx;" :style="{background:publicColor}">搜索</view>
+			</view>
+			<!-- 分类标题 -->
+			<view style="background: #FFFFFF;font-size: 24rpx;" class="disjbac pad-zy20 pad-s20">
+				<view v-for="(item,index) in shopCate" @tap="chooseShopCate(index)" :class="activeIndex==index?'activecate':'shopMo'" :style="{background:activeIndex==index?publicColor:'#F2F2F2'}" :key="index"><span>{{item}}</span></view>
+			</view>
+			<!-- 筛选结果 -->
+			<view v-if="isClick" class="pad-zy50 disac fw pad-x20">
+				<view class="col3 fon28 mar-s30">筛选：</view>
+				<view v-for="(item,indexx) in shaiList" :key="indexx" style="background: #3875F6;color: #FFFFFF;border-radius: 30rpx;padding: 8rpx 20rpx;font-size: 24rpx;display: flex;align-items: center;margin-right: 20rpx;margin-top: 30rpx;">{{item}} <view class="mar-z10" @tap="deleteSX(indexx)">×</view></view>
+			</view>
+			<view v-if="isXiao">
+				<view class="pad-zy30">
+					<view class="mar-s50 mar-x20 fon28 bold">{{cateTitle}}</view>
+					<view class="disac fw">
+						<view @tap="chooseBing(indexb)" v-for="(itemb,indexb) in bingzList" class="mar-y30 fon26 mar-s30" :key="indexb" :class="bingIndex==indexb?'activebcate':'shopBMo'" :style="{background:bingIndex==indexb?publicColor:'#F2F2F2'}">{{itemb}}</view>
+					</view>
+					<view v-if="activeIndex==1">
+						<view class="fon28 bold mar-sx40">医生选择</view>
+						<input type="text" class="mar-x40" value="" style="height: 60rpx;border: 2rpx solid #E0E0E0;border-radius: 10rpx;width: 100%;box-sizing: border-box;padding-left: 20rpx;font-size: 24rpx;" placeholder="请输入医生姓名并选择" />
+					</view>
+				</view>
+				<!-- 重置、筛选 -->
+				<view class="disjbac pad-zy20 mar-s50 mar-x30 pad-s20">
+					<view @tap="chongz" style="font-size: 28rpx;width: 294rpx;height: 60rpx;border-radius: 10rpx;text-align: center;line-height: 60rpx; background: #E6E6E6;color: #4D4D4D;">重置</view>
+					<view @tap="shaix" style="font-size: 28rpx;width: 294rpx;height: 60rpx;border-radius: 10rpx;text-align: center;line-height: 60rpx; background: #3875F6;color: #FFFFFF;">筛选</view>
+				</view>
+				<view @tap="isXiao=false" style="background: rgba(0,0,0,.54);width: 100%;height: 600rpx;float: left;position: relative;"></view>
+			</view>
+		</view>
+		<!-- 数据列表 -->
+		<view :style="{marginTop:statusHNH+titleHeight+'px'}">
+			<shopList></shopList>
+		</view>
 		<!-- 底部tab -->
 		<foot-tab :titleList="titleList" :imgList="imgList" :newcurrent='3'></foot-tab>
+		<!-- 购物车 -->
+		<navigator url="/pagesA/shopCart/shopCart" hover-class="none">
+			<view style="position: fixed;right: 30rpx;bottom: 200rpx;">
+				<view class="posir" style="width: 112rpx;height: 112rpx;">
+					<image src="/static/public/cart.png" mode="aspectFill" style="width: 112rpx;height: 112rpx;"></image>
+					<view class="posia" style="background: #F85050;width: 28rpx;height: 28rpx;border-radius: 100%;color: #FFFFFF;font-size: 24rpx;text-align: center;line-height: 28rpx;top: 20rpx;right: 20rpx;"><view style="transform: scale(.8);">99</view></view>
+				</view>
+			</view>
+		</navigator>
 	</view>
 </template>
 
 <script>
+	import shopList from '@/components/shop-list.vue';
 	export default {
+		components:{
+			shopList
+		},
 		data() {
 			return {
 				titleList:[],
-				imgList:[]
+				imgList:[],
+				statusHNH:uni.getStorageSync('statusHNH'),
+				publicColor:uni.getStorageSync('publicColor'),
+				activeIndex:'-1',
+				shopCate:['全部病种','全部医生','全部活动'],
+				cateTitle:'',
+				bingIndex:0,
+				bingzList:[],//小分类列表
+				isXiao:false,//
+				titleHeight:'',//标题高度
+				shaiList:[],//筛选后的结果列表
+				isClick:false,//是否点击了筛选
 			}
 		},
 		onShow() {
@@ -24,13 +85,61 @@
 		onLoad() {
 			this.titleList = uni.getStorageSync('footTitle')
 			this.imgList = uni.getStorageSync('footimg')
+			// 缓存状态栏+标题栏的高度
+			const query = wx.createSelectorQuery()
+			query.select('.search-input-box').boundingClientRect((rect) => {
+				// console.log('状态栏+标题栏：',rect.height);
+				this.titleHeight = rect.height
+			}).exec()
 		},
 		methods: {
-			
+			chooseShopCate(index){//大分类选择事件
+				this.activeIndex = index;
+				this.isClick = false;
+				this.bingIndex = 0;
+				if(!this.isXiao) {
+					this.isXiao = true;
+				}
+				if(this.activeIndex==0) {
+					this.cateTitle = '病种选择';
+					this.bingzList = ['全部','秃顶植发','眉毛种植','发际线种植','耳发种植','胡须种植','植发失败修复','其他'];
+				}
+				if(this.activeIndex==1) {
+					this.cateTitle = '职位选择';
+					this.bingzList = ['全部','植发','医师','主任'];
+				}
+				if(this.activeIndex==2) {
+					this.cateTitle = '活动选择';
+					this.bingzList = ['全部','拼团活动','团购活动','限时促销'];
+				}
+			},
+			chooseBing(index){//小分类选择事件
+				this.bingIndex = index;
+				let cun = this.shaiList.indexOf(this.bingzList[index]);
+				if(cun==-1){
+					this.shaiList.push(this.bingzList[index]);
+				}
+				console.log(this.shaiList);
+			},
+			chongz(){//重置
+				this.bingIndex = 0
+				this.isClick = false;
+				this.shaiList = []
+			},
+			shaix(){//筛选
+				this.isXiao = false
+				this.isClick = true;
+			},
+			deleteSX(index){//删除筛选
+				this.shaiList.splice(index,1);
+				if(this.shaiList.length==0){
+					this.isClick = false;
+				}
+			}
 		}
 	}
 </script>
 
 <style>
-
+ page{background: #F5F5F5;}
 </style>

pagesA/getReadyDan/getReadyDan.vue

@@ -0,0 +1,187 @@
+<template>
+	<view>
+		<!-- 状态栏 -->
+		<status-nav :titleVal="'购物车'" :statusTitle="true"></status-nav>
+		<view :style="{paddingTop: statusHNH+'px'}" class="pad-zy30" style="padding-bottom: 150rpx;">
+			<view class="bacf radius20 mar-s20 disjbac" style="padding: 27rpx 20rpx;">
+				<view class="bold">配送方式</view>
+				<view class="fon26 col3 disac">
+					<view @tap="isExpress=true" :class="isExpress?'activeT':'expressT'" :style="{background:isExpress?publicColor:''}">快递</view>
+					<view @tap="isExpress=false" :class="!isExpress?'activeT':'expressT'"  :style="{background:isExpress?'':publicColor}">自提</view>
+				</view>
+			</view>
+			<!-- 地址信息 -->
+			<view v-if="isExpress" class="bacf radius20 mar-s20" style="padding: 27rpx 20rpx;">
+				<view class="bold">收件人信息</view>
+				<view class="fon26 col3 disjbac">
+					<view>
+						<view class="fon28 col3 bold" style="margin: 52rpx 0 20rpx 0;">蒋灰灰 <span>188****0362</span></view>
+						<view class="fon24 col9">四川省成都市成华区中环路双店路段奥园广场</view>
+					</view>
+					<image src="/static/public/nextM.png" style="width: 16px;height: 16px;flex-shrink: 0;" mode="aspectFill"></image>
+				</view>
+			</view>
+			<!-- 自提地址 -->
+			<view v-else class="bacf radius20 mar-s20" style="padding: 27rpx 20rpx;">
+				<view class="bold">自提地址</view>
+				<view class="fon26 col3 disjbac" style="margin-top: 50rpx;">
+					<view>
+						<view class="fon28 col3 bold" style="margin-bottom: 20rpx;">恒美植发</view>
+						<view class="fon24 col9">四川省成都市青羊区青羊大道213号</view>
+					</view>
+					<image @tap="goThere" src="/static/public/daoh.png" style="width: 96rpx;height: 93rpx;flex-shrink: 0;" mode="aspectFill"></image>
+				</view>
+			</view>
+			<!-- 订单信息 -->
+			<view class="bacf radius20 mar-s20" style="padding: 27rpx 20rpx;">
+				<view class="bold">订单信息</view>
+				<view class="fon26 col3 disjbac pad-sx50 disjbac bbot">
+					<image src="/static/public/banner.png" class="flexs" style="width: 166rpx;height: 166rpx;border-radius: 15rpx;margin-right: 12rpx;" mode="aspectFill"></image>
+					<view class="width100">
+						<view class="fon28 col3 bold clips2">【99皮皮节】【种植发际线】1000单位FUE技术案例招募门美人</view>
+						<view style="font-size: 22rpx;color: #808080;font-weight: 500;">试用</view>
+						<view class="disjbac mar-s10">
+							<view style="color: #F85050;font-size: 32rpx;font-weight: bold;">￥3888</view>
+							<view class="fon28 col6">x2</view>
+						</view>
+					</view>
+				</view>
+			</view>
+			<!-- 优惠 -->
+			<view class="bacf radius20 mar-s20" style="padding: 27rpx 20rpx;">
+				<view class="bold">优惠</view>
+				<view @tap="showQuan=true" class="fon28 col3 disjbac mar-sx40">
+					<view>优惠券</view>
+					<view class="disac">
+						<view style="color: #F85050;font-weight: bold;">-￥99.00</view>
+						<image src="/static/public/nextM.png" style="width: 16px;height: 16px;flex-shrink: 0;" mode="aspectFill"></image>
+					</view>
+				</view>
+				<view class="fon28 col3 disjbac">
+					<view>立减优惠</view>
+					<view style="color: #F85050;font-weight: bold;">-￥99.00</view>
+				</view>
+			</view>
+			<!-- 快递费用 -->
+			<view class="bacf radius20 mar-s20 disjbac" style="padding: 27rpx 20rpx;">
+				<view class="bold">快递费用</view>
+				<view class="fon28" style="color: #F85050;font-weight: bold;">￥10.00</view>
+			</view>
+			<view class="disjbac posixzy bacf" style="height: 124rpx;line-height: 124rpx;padding: 0 32rpx;">
+				<!-- 去支付 -->
+				<view class="fon40 bold" style="color: #F85050;">合计：￥7166.00</view>
+				<view @tap="goPayment" style="color: #FFFFFF;font-size: 28rpx;font-weight: bold;width: 170rpx;height: 70rpx;line-height: 70rpx;text-align: center;background: #3875F6;border-radius: 35rpx;margin-left: 10rpx;">去支付</view>
+			</view>
+		</view>
+		<view v-if="showQuan" @tap.stop="showQuan=false" class="posAll">
+			<view class="bacf posixzy" style="border-radius: 40rpx 40rpx 0rpx 0rpx;" @tap.stop="showQuan=true">
+				<view style="padding: 20rpx 50rpx;">
+					<view class="disjbac">
+						<view class="fon28 bold col3">优惠券</view>
+						<image @tap.stop="showQuan=false" src="/static/public/cha-close.png" style="width: 30rpx;height: 30rpx;" mode="aspectFill"></image>
+					</view>
+					<view class="fon28 bold col3" style="display: flex;justify-content: space-around;align-items: center;padding: 50rpx 0 16rpx 0;">
+						<view class="posir" :class="switchQuan?'activeQuan':''" @tap="switchQuan=true">可用优惠券(1)</view>
+						<view class="posir" :class="!switchQuan?'activeQuan':''" @tap="switchQuan=false">失效优惠券(0)</view>
+					</view>
+					<view class="mar-s40">
+						<view style="height: 200rpx;" class="disjbac">
+							<view class="posir" style="width: 218rpx;height: 200rpx;flex-shrink: 0;text-align: center;color: #FFFFFF;">
+								<image class="posia" src="/static/public/quan-left.png" style="width: 218rpx;height: 200rpx;left: 0;top: 0;" mode=""></image>
+								<view class="posir" style="z-index: 1;">
+									<view style="margin: 40rpx 0 30rpx 0rpx;" class="fon28">￥<span style="font-size: 56rpx;font-weight: bold;">10</span></view>
+									<view class="fon24">满300元可使用</view>
+								</view>
+							</view>
+							<view style="display: flex;flex-direction: column;justify-content: space-between;width: 100%;height: 200rpx;padding: 0 20rpx;background-color: #F5F5F5;">
+								<view class="fon28 col3 mar-s20">黄金会员专属优惠券</view>
+								<view>
+									<image src="/static/public/chooseQuan.png" style="width: 40rpx;height: 40rpx;border-radius: 100%;float: right;"></image>
+								</view>
+								<view class="fon20 col3 mar-x20">有效期：2021-09-06至2021-09-15</view>
+							</view>
+						</view>
+					</view>
+					<view class="mar-s40">
+						<view style="height: 200rpx;" class="disjbac">
+							<view class="posir" style="width: 218rpx;height: 200rpx;flex-shrink: 0;text-align: center;color: #FFFFFF;">
+								<image class="posia" src="/static/public/quan-left.png" style="width: 218rpx;height: 200rpx;left: 0;top: 0;" mode=""></image>
+								<view class="posir" style="z-index: 1;">
+									<view style="margin: 40rpx 0 30rpx 0rpx;" class="fon28">￥<span style="font-size: 56rpx;font-weight: bold;">10</span></view>
+									<view class="fon24">满300元可使用</view>
+								</view>
+							</view>
+							<view style="display: flex;flex-direction: column;justify-content: space-between;width: 100%;height: 200rpx;padding: 0 20rpx;background-color: #F5F5F5;">
+								<view class="fon28 col3 mar-s20">黄金会员专属优惠券</view>
+								<view>
+									<image src="/static/public/cancleQuan.png" style="width: 40rpx;height: 40rpx;border-radius: 100%;float: right;"></image>
+								</view>
+								<view class="fon20 col3 mar-x20">有效期：2021-09-06至2021-09-15</view>
+							</view>
+						</view>
+					</view>
+					<!-- 领取优惠券按钮 -->
+					<view @tap.stop="showQuan=false" style="font-size: 36rpx;color: #FFFFFF;font-weight: bold;margin: 0 auto;background: #3875F6;border-radius: 20rpx;height: 90rpx;line-height: 90rpx;text-align: center;margin-top: 156rpx;margin-bottom: 20rpx;">领取优惠券</view>
+				</view>
+			</view>
+		</view>
+		<!-- 确认兑换弹框 -->
+		<view v-if="isDui" @tap.stop="isDui=false" class="posAll" style="display: flex;justify-content: center;align-items: center;padding: 0 85rpx;">
+			<view class="bacf radius20 width100 tc fon28 col3 pad20" @tap.stop="isDui=true">
+				<view class="bold" style="margin: 0rpx 0 56rpx 0;">兑换商品</view>
+				<view style="margin: 0rpx 0 66rpx 0;">您确定使用7666积分兑换吗？</view>
+				<view class="disjbac mar-x20 pad-zy20">
+					<view @tap.stop="isDui=false" style="width: 196rpx;height: 60rpx;line-height: 60rpx;text-align: center;font-size: 28rpx;font-weight: 500;border-radius: 10rpx;background: #C8C8C8;color: #FFFFFF;">暂不兑换</view>
+					<view @tap.stop="isDui=false" style="width: 196rpx;height: 60rpx;line-height: 60rpx;text-align: center;font-size: 28rpx;font-weight: 500;border-radius: 10rpx;background: #3875F6;color: #FFFFFF;">立即兑换</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				statusHNH:uni.getStorageSync('statusHNH'),
+				publicColor:uni.getStorageSync('publicColor'),//主题颜色
+				isExpress:true,
+				switchQuan:true,
+				showQuan:false,
+				isDui:false
+			}
+		},
+		onShow() {
+			this.$toolAll.tools.isLogin()
+		},
+		onLoad() {
+			
+		},
+		methods: {
+			goThere(){
+				wx.getLocation({//获取当前经纬度
+				    type: 'wgs84', //返回可以用于wx.openLocation的经纬度，官方提示bug: iOS 6.3.30 type 参数不生效，只会返回 wgs84 类型的坐标信息  
+					success: function (res) {
+						wx.openLocation({//​使用微信内置地图查看位置。
+							latitude: 22.5542080000,//要去的纬度-地址
+							longitude: 113.8878770000,//要去的经度-地址
+							name: "宝安中心A地铁口",
+							address:'宝安中心A地铁口'
+						})
+					}
+				})
+			},
+			goPayment(){
+				uni.navigateTo({
+					url:'/pagesA/immediatePayment/immediatePayment'
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+	page {
+		background-color: #F5F5F5;
+	}
+</style>

pagesA/immediatePayment/immediatePayment.vue

@@ -0,0 +1,95 @@
+<template>
+	<view>
+		<!-- 状态栏 -->
+		<status-nav :titleVal="'立即支付'" :statusTitle="true"></status-nav>
+		<view :style="{paddingTop: statusHNH+'px'}" class="pad-zy30" style="padding-bottom: 150rpx;">
+			<view v-if="!isSuccess">
+				<!-- 订单信息 -->
+				<view class="bacf radius20 mar-s20" style="padding: 27rpx 20rpx;">
+					<view class="bold fon28">订单支付</view>
+					<view class="fon26 col3 disjbac pad-sx50 disjbac bbot">
+						<image src="/static/public/banner.png" class="flexs" style="width: 166rpx;height: 166rpx;border-radius: 15rpx;margin-right: 12rpx;" mode="aspectFill"></image>
+						<view class="width100">
+							<view class="fon28 col3 bold clips2">【99皮皮节】【种植发际线】1000单位FUE技术案例招募门美人</view>
+							<view style="font-size: 22rpx;color: #808080;font-weight: 500;">试用</view>
+							<view class="disjbac mar-s10">
+								<view style="color: #F85050;font-size: 32rpx;font-weight: bold;">￥3888</view>
+								<view class="fon28 col6">x2</view>
+							</view>
+						</view>
+					</view>
+					<view class="fon28 disjbac" style="margin: 60rpx 0 20rpx 0;">
+						<view class="col6">共4件</view>
+						<view style="font-weight: bold;color: #F85050;">应付款：3888.00+300孔雀币</view>
+					</view>
+				</view>
+				<!-- 支付方式 -->
+				<view class="bacf radius20 mar-s20" style="padding: 27rpx 20rpx;font-size: 28rpx;color: #333333;">
+					<view class="disac">
+						<image src="/static/public/chooseFS.png" style="width: 40rpx;height: 40rpx;border-radius: 100%;" mode=""></image>
+						<view style="margin-left: 26rpx;">微信支付</view>
+					</view>
+					<view class="disjbac" style="margin-top: 30rpx;">
+						<view class="disac">
+							<image src="/static/public/cancle-FS.png" style="width: 40rpx;height: 40rpx;border-radius: 100%;" mode=""></image>
+							<view style="margin-left: 26rpx;">孔雀币</view>
+						</view>
+						<view>余3000</view>
+					</view>
+				</view>
+				<view class="fon28 col3" style="padding: 55rpx 0 64rpx 0;text-align: center;">请在<span style="color: #F85050;font-weight: bold;">23时25分36秒</span>完成支付</view>
+				<!-- 确认支付 -->
+				<view @tap="payment" style="margin: 0 auto;color: #FFFFFF;font-weight: bold;font-size: 36rpx;text-align: center;width: 546rpx;height: 90rpx;line-height: 90rpx;background-color: #3875F6;border-radius: 20rpx;">确认支付</view>
+			</view>
+			<!-- 支付成功 -->
+			<view v-if="isSuccess" class="bacf radius20 mar-s20" style="padding: 27rpx 20rpx;text-align: center;">
+				<image src="/static/public/pay-success.png" style="width: 194rpx;height: 194rpx;" mode=""></image>
+				<view class="fon28 col3" style="margin: 20rpx 0 40rpx 0;">支付成功</view>
+				<view class="" style="font-size: 46rpx;margin-bottom: 120rpx;color: #F85050;">￥3888.00</view>
+				<view class="disja" style="margin-bottom: 150rpx;">
+					<view @tap="goDetail" style="width: 244rpx;height: 70rpx;border-radius: 10rpx;text-align: center;line-height: 70rpx;background: #E9E9E9;color: #333333;">查看订单</view>
+					<view @tap="goShop" style="width: 244rpx;height: 70rpx;border-radius: 10rpx;text-align: center;line-height: 70rpx;background: #3875F6;color: #FFFFFF;">再逛一逛</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				statusHNH:uni.getStorageSync('statusHNH'),
+				publicColor:uni.getStorageSync('publicColor'),//主题颜色
+				isSuccess:false
+			}
+		},
+		onShow() {
+			this.$toolAll.tools.isLogin()
+		},
+		onLoad() {
+			
+		},
+		methods: {
+			payment(){
+				this.isSuccess = true
+			},
+			goDetail(){
+				uni.navigateTo({
+					url:'/pagesB/orderDetail/orderDetail'
+				})
+			},
+			goShop(){
+				uni.reLaunch({
+					url:'/pages/tabbar/shop/shop'
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+	page {
+		background-color: #F5F5F5;
+	}
+</style>

pagesA/shopCart/shopCart.vue

@@ -0,0 +1,120 @@
+<template>
+	<view>
+		<!-- 状态栏 -->
+		<status-nav :titleVal="'购物车'" :statusTitle="true"></status-nav>
+		<view :style="{paddingTop: statusHNH+'px'}" class="pad-zy30">
+			<view class="bacf radius20 mar-s20 pad20">
+				<view class="fon28 col3 disjbac" style="height: 43rpx;">
+					<view class="bold">订单信息</view>
+					<view v-if="!cancle_del" @tap="cancle_del=true">管理</view>
+					<view v-else @tap="cancle_del=false" style="width: 113rpx;height: 43rpx;border-radius: 20rpx;background: #3875F6;text-align: center;color: #FFFFFF;line-height: 43rpx;">管理 ×</view>
+				</view>
+				<view>
+					<view class="disjbac pad-sx40 bbot posir" style="overflow: hidden;" @touchstart="moveStart" @touchend="moveEnd">
+						<view class="disjbac" :style="{marginLeft:showDel?'-70px':'',paddingRight:showDel?'70px':''}">
+							<!-- 圈 -->
+							<image src="/static/public/chooseFS.png" style="width: 40rpx;height: 40rpx;flex-shrink: 0;" mode=""></image>
+							<image src="/static/tabbar/mya.png" style="width: 166rpx;height: 166rpx;border-radius: 15rpx;flex-shrink: 0;margin: 0 12rpx 0 24rpx;" mode=""></image>
+							<view>
+								<view class="fon28 col3 bold clips2">【99皮皮节】【种植发际线】1000单位FUE技术案例招募门美人</view>
+								<view style="font-size: 22rpx;color: #808080;">试用</view>
+								<view class="disjbac mar-s10">
+									<view style="font-size: 32rpx;color: #F85050;font-weight: bold;">￥3888</view>
+									<view class="fon26 col3 disac bold" style="border-radius: 4rpx;overflow: hidden;">
+										<image src="/static/public/del.png" mode="" style="width: 46rpx;height: 26px;"></image>
+										<input type="text" value="1" style="width: 60rpx;height: 24px;text-align: center;border-top: 2rpx solid #3875F6;border-bottom: 2rpx solid #3875F6;"/>
+										<image src="/static/public/add.png" mode="" style="width: 46rpx;height: 26px;"></image>
+									</view>
+								</view>
+							</view>
+						</view>
+						<view v-if="showDel" style="width: 117rpx;height: 205rpx;background: #F85050;line-height: 205rpx;text-align: center;color: #FFFFFF;font-size: 24rpx;flex-shrink: 0;position: absolute;right: 0;bottom: 40rpx;top: 2rpx;">删除</view>
+					</view>
+					<view class="disjbac pad-sx40 bbot posir" style="overflow: hidden;" @touchstart="moveStart" @touchend="moveEnd">
+						<view class="disjbac" :style="{marginLeft:showDel?'-70px':'',paddingRight:showDel?'70px':''}">
+							<!-- 圈 -->
+							<image src="/static/public/cancle-FS.png" style="width: 40rpx;height: 40rpx;flex-shrink: 0;" mode=""></image>
+							<image src="/static/tabbar/mya.png" style="width: 166rpx;height: 166rpx;border-radius: 15rpx;flex-shrink: 0;margin: 0 12rpx 0 24rpx;" mode=""></image>
+							<view>
+								<view class="fon28 col3 bold clips2">【99皮皮节】【种植发际线】1000单位FUE技术案例招募门美人</view>
+								<view style="font-size: 22rpx;color: #808080;">试用</view>
+								<view class="disjbac mar-s10">
+									<view style="font-size: 32rpx;color: #F85050;font-weight: bold;">￥3888</view>
+									<view class="fon26 col3 disac bold" style="border-radius: 4rpx;overflow: hidden;">
+										<image src="/static/public/del.png" mode="" style="width: 46rpx;height: 26px;"></image>
+										<input type="text" value="1" style="width: 60rpx;height: 24px;text-align: center;border-top: 2rpx solid #3875F6;border-bottom: 2rpx solid #3875F6;"/>
+										<image src="/static/public/add.png" mode="" style="width: 46rpx;height: 26px;"></image>
+									</view>
+								</view>
+							</view>
+						</view>
+						<view v-if="showDel" style="width: 117rpx;height: 205rpx;background: #F85050;line-height: 205rpx;text-align: center;color: #FFFFFF;font-size: 24rpx;flex-shrink: 0;position: absolute;right: 0;bottom: 40rpx;top: 2rpx;">删除</view>
+					</view>
+				</view>
+			</view>
+			<view class="disjbac posixzy bacf" style="height: 124rpx;line-height: 124rpx;padding: 0 32rpx;">
+				<view class="disac">
+					<view style="width: 40rpx;height: 40rpx;border-radius: 100%;border: 2rpx solid #3875F6;flex-shrink: 0;display: flex;justify-content: center;align-items: center;">
+						<!-- <view style="width: 24rpx;height: 24rpx;background-color: #3875F6;border-radius: 100%;"></view> -->
+					</view>
+					<view class="fon28 col3 mar-z10">全选</view>
+				</view>
+				<!-- 去支付 -->
+				<view v-if="!cancle_del" class="disjbac">
+					<view>
+						<view class="fon28">合计：<span class="fon40 bold" style="color: #F85050;">￥7166.00</span></view>
+					</view>
+					<view @tap="goGetReadyDan" style="color: #FFFFFF;font-size: 28rpx;font-weight: bold;width: 170rpx;height: 70rpx;line-height: 70rpx;text-align: center;background: #3875F6;border-radius: 35rpx;margin-left: 10rpx;">去支付</view>
+				</view>
+				<!-- 删除 -->
+				<view v-else style="color: #FFFFFF;font-size: 28rpx;font-weight: bold;width: 170rpx;height: 70rpx;line-height: 70rpx;text-align: center;background: #F85050;border-radius: 35rpx;">删除</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				statusHNH:uni.getStorageSync('statusHNH'),
+				publicColor:uni.getStorageSync('publicColor'),//主题颜色
+				showDel:false,
+				startX:'',//开始位置
+				endX:'',//结束位置
+				cancle_del:false
+			}
+		},
+		onShow() {
+			this.$toolAll.tools.isLogin()
+		},
+		onLoad() {
+			
+		},
+		methods: {
+			clickGL(){
+				console.log('管理');
+			},
+			moveStart(e){
+				this.startX = e.touches[0].pageX
+			},
+			moveEnd(e){
+				this.endX = e.changedTouches[0].pageX
+				if(this.startX-this.endX>0){
+					this.showDel = true;
+				} else this.showDel = false;
+			},
+			goGetReadyDan(){
+				uni.navigateTo({
+					url:'/pagesA/getReadyDan/getReadyDan'
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+	page {
+		background-color: #F5F5F5;
+	}
+</style>

pagesB/orderDetail/orderDetail.vue

@@ -0,0 +1,185 @@
+<template>
+	<view>
+		<!-- 状态栏 -->
+		<status-nav :titleVal="'订单详情'" :statusTitle="true"></status-nav>
+		<view :style="{paddingTop: statusHNH+'px'}" class="pad-zy30" style="padding-bottom: 150rpx;">
+			<!-- 订单类型 -->
+			<view class="bacf radius20 mar-s20 fon28" style="padding: 27rpx 20rpx;">
+				<view class="disjbac">
+					<view class="bold">商城订单</view>
+					<view style="color: #F85050;font-weight: bold;">待付款</view>
+				</view>
+				<view class="bold col3 mar-s40 mar-x20">订单号：1234567890</view>
+				<view class="fon24 col9">2021-09-06 10:30</view>
+			</view>
+			<!-- 物流信息 -->
+			<view class="bacf radius20 mar-s20 fon28" style="padding: 27rpx 20rpx;">
+				<view class="bold">物流信息</view>
+				<view class="bold col3 mar-s40 fon26 disjbac">
+					<view>韵达快递：2983625984729</view>
+					<view>复制</view>
+				</view>
+			</view>
+			<!-- 地址信息 -->
+			<view v-if="isExpress" class="bacf radius20 mar-s20" style="padding: 27rpx 20rpx;">
+				<view class="bold">收件人信息</view>
+				<view class="fon26 col3">
+					<view class="fon28 col3 bold" style="margin: 52rpx 0 20rpx 0;">蒋灰灰 <span>188****0362</span></view>
+					<view class="fon24 col9">四川省成都市成华区中环路双店路段奥园广场</view>
+				</view>
+			</view>
+			<!-- 订单信息 -->
+			<view class="bacf radius20 mar-s20" style="padding: 27rpx 20rpx;">
+				<view class="fon26 col3 disjbac pad-sx50 disjbac bbot">
+					<image src="/static/public/banner.png" class="flexs" style="width: 166rpx;height: 166rpx;border-radius: 15rpx;margin-right: 12rpx;" mode="aspectFill"></image>
+					<view class="width100">
+						<view class="fon28 col3 bold clips2">【99皮皮节】【种植发际线】1000单位FUE技术案例招募门美人</view>
+						<view style="font-size: 22rpx;color: #808080;font-weight: 500;">试用</view>
+						<view class="disjbac mar-s10">
+							<view style="color: #F85050;font-size: 32rpx;font-weight: bold;">￥3888</view>
+							<view class="fon28 col6">x2</view>
+						</view>
+					</view>
+				</view>
+				<view class="fon28 disjbac" style="margin: 60rpx 0 20rpx 0;">
+					<view class="col6">共4件</view>
+					<view style="font-weight: bold;color: #F85050;">应付款：3888.00+300孔雀币</view>
+				</view>
+			</view>
+			<!-- 优惠 -->
+			<view class="bacf radius20 mar-s20" style="padding: 27rpx 20rpx;">
+				<view class="bold">优惠</view>
+				<view @tap="showQuan=true" class="fon28 col3 disjbac mar-sx40">
+					<view>优惠券</view>
+					<view class="disac">
+						<view style="color: #F85050;font-weight: bold;">-￥99.00</view>
+						<image src="/static/public/nextM.png" style="width: 16px;height: 16px;flex-shrink: 0;" mode="aspectFill"></image>
+					</view>
+				</view>
+				<view class="fon28 col3 disjbac">
+					<view>立减优惠</view>
+					<view style="color: #F85050;font-weight: bold;">-￥99.00</view>
+				</view>
+			</view>
+			<!-- 快递费用 -->
+			<view class="bacf radius20 mar-s20 disjbac" style="padding: 27rpx 20rpx;">
+				<view class="bold">快递费用</view>
+				<view class="fon28" style="color: #F85050;font-weight: bold;">￥10.00</view>
+			</view>
+			<!-- 消费 -->
+			<view class="fon28 col3" style="margin: 40rpx 0 40rpx 0;text-align: right;">消费：<span style="font-size: 36rpx;font-weight: bold;color: #F85050;">￥3898+300孔雀币</span></view>
+			<view class="disjbac posixzy bacf" style="height: 124rpx;padding: 0 32rpx;display: flex;align-items: center;">
+				<view class="posir">
+					<image src="/static/public/weix.png" style="width: 56rpx;height: 56rpx;" mode=""></image>
+					<view class="fon28 col3">分享</view>
+					<button open-type="share" class="posia" style="top: 0;left: 0;right: 0;bottom: 0;opacity: 0;"></button>
+				</view>
+				<!-- 待收货 -->
+				<!-- <view class="disac">
+					<view style="width: 249rpx;height: 70rpx;border-radius: 35rpx;line-height: 70rpx;text-align: center;font-size: 28rpx;font-weight: bold;background: #E9E9E9;color: #808080;">取消订单</view>
+					<view style="width: 249rpx;height: 70rpx;border-radius: 35rpx;line-height: 70rpx;text-align: center;font-size: 28rpx;font-weight: bold;background: #3875F6;color: #FFFFFF;margin-left: 20rpx;">立即支付</view>
+				</view> -->
+				<!-- 确认收货 -->
+				<view style="width: 249rpx;height: 70rpx;border-radius: 35rpx;line-height: 70rpx;text-align: center;font-size: 28rpx;font-weight: bold;background: #3875F6;color: #FFFFFF;margin-left: 20rpx;">确认收货</view>
+			</view>
+		</view>
+		<view v-if="showQuan" @tap.stop="showQuan=false" class="posAll">
+			<view class="bacf posixzy" style="border-radius: 40rpx 40rpx 0rpx 0rpx;" @tap.stop="showQuan=true">
+				<view style="padding: 20rpx 50rpx;">
+					<view class="disjbac">
+						<view class="fon28 bold col3">优惠券</view>
+						<image @tap.stop="showQuan=false" src="/static/public/cha-close.png" style="width: 30rpx;height: 30rpx;" mode="aspectFill"></image>
+					</view>
+					<view class="fon28 bold col3" style="display: flex;justify-content: space-around;align-items: center;padding: 50rpx 0 16rpx 0;">
+						<view class="posir" :class="switchQuan?'activeQuan':''" @tap="switchQuan=true">可用优惠券(1)</view>
+						<view class="posir" :class="!switchQuan?'activeQuan':''" @tap="switchQuan=false">失效优惠券(0)</view>
+					</view>
+					<view class="mar-s40">
+						<view style="height: 200rpx;" class="disjbac">
+							<view class="posir" style="width: 218rpx;height: 200rpx;flex-shrink: 0;text-align: center;color: #FFFFFF;">
+								<image class="posia" src="/static/public/quan-left.png" style="width: 218rpx;height: 200rpx;left: 0;top: 0;" mode=""></image>
+								<view class="posir" style="z-index: 1;">
+									<view style="margin: 40rpx 0 30rpx 0rpx;" class="fon28">￥<span style="font-size: 56rpx;font-weight: bold;">10</span></view>
+									<view class="fon24">满300元可使用</view>
+								</view>
+							</view>
+							<view style="display: flex;flex-direction: column;justify-content: space-between;width: 100%;height: 200rpx;padding: 0 20rpx;background-color: #F5F5F5;">
+								<view class="fon28 col3 mar-s20">黄金会员专属优惠券</view>
+								<view>
+									<image src="/static/public/chooseQuan.png" style="width: 40rpx;height: 40rpx;border-radius: 100%;float: right;"></image>
+								</view>
+								<view class="fon20 col3 mar-x20">有效期：2021-09-06至2021-09-15</view>
+							</view>
+						</view>
+					</view>
+					<view class="mar-s40">
+						<view style="height: 200rpx;" class="disjbac">
+							<view class="posir" style="width: 218rpx;height: 200rpx;flex-shrink: 0;text-align: center;color: #FFFFFF;">
+								<image class="posia" src="/static/public/quan-left.png" style="width: 218rpx;height: 200rpx;left: 0;top: 0;" mode=""></image>
+								<view class="posir" style="z-index: 1;">
+									<view style="margin: 40rpx 0 30rpx 0rpx;" class="fon28">￥<span style="font-size: 56rpx;font-weight: bold;">10</span></view>
+									<view class="fon24">满300元可使用</view>
+								</view>
+							</view>
+							<view style="display: flex;flex-direction: column;justify-content: space-between;width: 100%;height: 200rpx;padding: 0 20rpx;background-color: #F5F5F5;">
+								<view class="fon28 col3 mar-s20">黄金会员专属优惠券</view>
+								<view>
+									<image src="/static/public/cancleQuan.png" style="width: 40rpx;height: 40rpx;border-radius: 100%;float: right;"></image>
+								</view>
+								<view class="fon20 col3 mar-x20">有效期：2021-09-06至2021-09-15</view>
+							</view>
+						</view>
+					</view>
+					<!-- 领取优惠券按钮 -->
+					<view @tap.stop="showQuan=false" style="font-size: 36rpx;color: #FFFFFF;font-weight: bold;margin: 0 auto;background: #3875F6;border-radius: 20rpx;height: 90rpx;line-height: 90rpx;text-align: center;margin-top: 156rpx;margin-bottom: 20rpx;">领取优惠券</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				statusHNH:uni.getStorageSync('statusHNH'),
+				publicColor:uni.getStorageSync('publicColor'),//主题颜色
+				isExpress:true,
+				switchQuan:true,
+				showQuan:false
+			}
+		},
+		onShow() {
+			this.$toolAll.tools.isLogin()
+		},
+		onLoad() {
+			
+		},
+		methods: {
+			goThere(){
+				wx.getLocation({//获取当前经纬度
+				    type: 'wgs84', //返回可以用于wx.openLocation的经纬度，官方提示bug: iOS 6.3.30 type 参数不生效，只会返回 wgs84 类型的坐标信息  
+					success: function (res) {
+						wx.openLocation({//​使用微信内置地图查看位置。
+							latitude: 22.5542080000,//要去的纬度-地址
+							longitude: 113.8878770000,//要去的经度-地址
+							name: "宝安中心A地铁口",
+							address:'宝安中心A地铁口'
+						})
+					}
+				})
+			},
+			goPayment(){
+				uni.navigateTo({
+					url:'/pagesA/immediatePayment/immediatePayment'
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+	page {
+		background-color: #F5F5F5;
+	}
+</style>

pagesB/shopDetail/shopDetail.vue

@@ -0,0 +1,719 @@
+<template>
+	<view>
+		<!-- 状态栏 -->
+		<status-nav v-if="invite_code==''" :titleVal="'商品详情'" :statusTitle="true"></status-nav>
+		<!-- 列表 -->
+		<view :style="{top: statusHNH+'px'}" class="posiszy" style="height: 50px;">
+			<view class="bacf pad-zy32 pad-sx20">
+				<cate-pu @choosecateEv="choosecateEv" :activeb="invite_code!=''?'#3875F6':publicColor" :newCurrent="cateCurrent*1" :newbmo="'#F2F2F2'" :isCenter="false" :newcateList="cateList"></cate-pu>
+			</view>
+		</view>
+		<view class="pad-x180" :style="{paddingTop: (statusHNH+50)+'px'}">
+			<!-- 自定义轮播 -->
+			<swiper-pu :browseP="true" :bannerList="bannerList" :newHeight="'250'" :newRadius="'0'" :newBottom="'5'"></swiper-pu>
+			<view v-if="isLoading">
+				<view v-show="cateCurrent==isNum">
+					<view class="pad20 bacf mar-zy20 radius20 mar-s20">
+						<!-- 标题 -->
+						<view class="mar-x20 fon36 col3 bold clips3">
+							<span class="radius15 colf fon20" style="padding: 6rpx 10rpx;" :style="{background:publicColor}">秃顶种植</span>
+							<span class="radius15 colf fon20 mar-z10" style="padding: 6rpx 10rpx;background: #F85050;">团购</span>
+							<span class="radius15 colf fon20 mar-z10" style="padding: 6rpx 10rpx;background: #F85050;">拼团活动</span>
+							<span class="radius15 colf fon20 mar-z10" style="padding: 6rpx 10rpx;background: #F85050;">促销活动</span>
+							<span style="line-height: 50rpx;">【99皮皮节】【种植发际线】1000单位FUE技术案例招募门美人尖/头顶加密/微针/纤维/脱发</span>
+						</view>
+						<view class="fon24" style="color: #7D7D7D;">无任何额外消费</view>
+						<!-- 团购商品详情时显示 -->
+						<view class="disjbac fon24 mar-s20" style="color: #7D7D7D;">
+							<view>团购累计参与人员：300人</view>
+							<view>还剩余：60人</view>
+						</view>
+						<view class="mar-s20" style="color: #F85050;font-size: 40rpx;font-weight: bold;"><span>团购价:</span>￥3888 <span style="color: #B3B3B3;font-size: 24rpx;text-decoration: line-through;font-weight: 400;margin-left: 20rpx;">￥4205</span></view>
+						<view class="mar-s20" style="color: #F85050;font-size: 40rpx;font-weight: bold;"><span>拼团价:</span>￥3888 <span style="color: #B3B3B3;font-size: 24rpx;text-decoration: line-through;font-weight: 400;margin-left: 20rpx;">￥4205</span></view>
+						<view class="disjbac" style="align-items: flex-end;margin-top: -20rpx;padding-bottom: 20rpx;">
+							<view class="disac">
+								<image class="flexs" src="/static/public/huiy.png" style="width: 42rpx;height: 30rpx;" mode="aspectFill"></image>
+								<view class="fon24 col9">黄金会员可购买</view>
+							</view>
+							<view class="disac flexs">
+								<view @tap="shareEv" class="disac fc mar-zy36 posir">
+									<image src="/static/public/weix.png" style="width: 42rpx;height: 42rpx;" mode=""></image>
+									<view class="fon24 col9">分享</view>
+									<button class="posia" open-type="share" style="top: 0;right: 0;left: 0;bottom: 0;opacity: 0;">分享</button>
+									<!-- <button v-if="haveImg" class="posia" open-type="share" style="top: 0;right: 0;left: 0;bottom: 0;opacity: 0;">分享</button> -->
+								</view>
+								<view class="disac fc" @tap="tapConllection">
+									<image v-if="isDetailConllection" src="/static/public/yconllection.png" style="width: 44rpx;height: 44rpx;" mode=""></image>
+									<image v-else src="/static/public/conllection.png" style="width: 44rpx;height: 44rpx;" mode=""></image>
+									<view class="fon24 col9">收藏</view>
+								</view>
+							</view>
+						</view>
+						<view class="pad-x30 pad-s10" style="border-bottom: 2rpx solid #E6E6E6;">
+							<view class="fon36 colf bold pbackc tc pad-sx20" style="border-radius: 45rpx;">倒计时：25小时35分26秒</view>
+						</view>
+						<!-- 规格 -->
+						<view class="disjbac tc mar-s20">
+							<view class="disjcac fon28 col3">规格：</view>
+							<view>
+								<view class="fon26 col3 mar-x20">上市时间</view>
+								<view class="fon24" style="color: #B3B3B3;">2021.02.01</view>
+							</view>
+							<view>
+								<view class="fon26 col3 mar-x20">有效期</view>
+								<view class="fon24" style="color: #B3B3B3;">三个月</view>
+							</view>
+							<view>
+								<view class="fon26 col3 mar-x20">可用时间</view>
+								<view class="fon24" style="color: #B3B3B3;">正常使用</view>
+							</view>
+							<view>
+								<view class="fon26 col3 mar-x20">术前须知</view>
+								<view class="fon24" style="color: #B3B3B3;">无</view>
+							</view>
+						</view>
+					</view>
+					<!-- 销量，库存 -->
+					<view class="pad20 bacf mar-zy20 radius20 mar-s20">
+						<view class="fon28 disjbac">
+							<view class="col3">销量：</view>
+							<view style="color: #B3B3B3;">已售30件</view>
+						</view>
+						<view class="fon28 disjbac mar-s40">
+							<view class="col3">库存：</view>
+							<view style="color: #B3B3B3;">剩余3000件</view>
+						</view>
+					</view>
+					<!-- 拼团 -->
+					<view class="pad20 bacf mar-zy20 radius20 mar-s20">
+						<view class="fon28 col3">2人正在拼团，可以直接参与</view>
+						<swiper :autoplay="true" :interval="3000" :duration="1000" circular="true" vertical="true" style="height: 176px;">
+							<swiper-item>
+								<view class="disjbac posir pad-sx20">
+									<image src="/static/public/like.png" mode="aspectFill" class="flexs" style="width: 70rpx;height: 70rpx; border-radius: 100%;"></image>
+									<view class="disjbac width100 mar-z20 pad-sx20">
+										<view class="fon28 col3" style="width: 45%;">廖恒利</view>
+										<view class="fon28 disjbac" style="color: #7D7D7D;width: 55%;">
+											<view>
+												<view>还差1人拼成</view>
+												<view style="margin-top: 7rpx;">剩余19:47:28</view>
+											</view>
+											<view @tap="comeTuan" class="colf bold" style="width: 140rpx;height: 80rpx;line-height: 80rpx;text-align: center;background: #F85050;border-radius: 20rpx;">去拼单</view>
+										</view>
+									</view>
+									<view style="border-bottom: 2rpx solid #E6E6E6;position: absolute;bottom: 0;width: 87%;right: 0;"></view>
+								</view>
+								<view class="disjbac posir pad-sx20">
+									<image src="/static/public/like.png" mode="aspectFill" class="flexs" style="width: 70rpx;height: 70rpx; border-radius: 100%;"></image>
+									<view class="disjbac width100 mar-z20 pad-sx20">
+										<view class="fon28 col3" style="width: 45%;">廖恒利</view>
+										<view class="fon28 disjbac" style="color: #7D7D7D;width: 55%;">
+											<view>
+												<view>还差1人拼成</view>
+												<view style="margin-top: 7rpx;">剩余19:47:28</view>
+											</view>
+											<view @tap="comeTuan" class="colf bold" style="width: 140rpx;height: 80rpx;line-height: 80rpx;text-align: center;background: #F85050;border-radius: 20rpx;">去拼单</view>
+										</view>
+									</view>
+									<!-- <view style="border-bottom: 2rpx solid #E6E6E6;position: absolute;bottom: 0;width: 87%;right: 0;"></view> -->
+								</view>
+							</swiper-item>
+							<swiper-item>
+								<view class="disjbac posir pad-sx20">
+									<image src="/static/public/like.png" mode="aspectFill" class="flexs" style="width: 70rpx;height: 70rpx; border-radius: 100%;"></image>
+									<view class="disjbac width100 mar-z20 pad-sx20">
+										<view class="fon28 col3" style="width: 45%;">廖恒利</view>
+										<view class="fon28 disjbac" style="color: #7D7D7D;width: 55%;">
+											<view>
+												<view>还差1人拼成</view>
+												<view style="margin-top: 7rpx;">剩余19:47:28</view>
+											</view>
+											<view @tap="comeTuan" class="colf bold" style="width: 140rpx;height: 80rpx;line-height: 80rpx;text-align: center;background: #F85050;border-radius: 20rpx;">去拼单</view>
+										</view>
+									</view>
+								</view>
+							</swiper-item>
+						</swiper>
+					</view>
+					<!-- 详情 -->
+					<view class="pad20 bacf mar-zy20 radius20 mar-s20">
+						<view class="fon28 col3 bold">产品详情</view>
+						<view class="fon28 mar-s20" style="color: #1A1A1A; line-height: 40rpx;">
+							<rich-text :nodes="detailInfo"></rich-text>
+						</view>
+					</view>
+					<!-- 医生 -->
+					<view class="pad20 bacf mar-zy20 radius20 mar-s20">
+						<view class="fon28 col3 bold">医生</view>
+						<view class="disjbac posir pad-sx20">
+							<image src="/static/public/like.png" mode="aspectFill" class="flexs" style="width: 70rpx;height: 70rpx; border-radius: 100%;"></image>
+							<view class="disjbac width100 mar-z20 pad-sx20">
+								<view class="fon28 col3" style="width: 50%;">廖恒利医生</view>
+								<view class="fon24" style="color: #7D7D7D;width: 50%;">擅长：毛发种植</view>
+							</view>
+							<view style="border-bottom: 2rpx solid #E6E6E6;position: absolute;bottom: 0;width: 87%;right: 0;"></view>
+						</view>
+						<view class="disjbac pad-sx20">
+							<image src="/static/public/like.png" mode="aspectFill" class="flexs" style="width: 70rpx;height: 70rpx; border-radius: 100%;"></image>
+							<view class="disjbac width100 mar-z20 pad-sx20">
+								<view class="fon28 col3" style="width: 50%;">廖恒利医生</view>
+								<view class="fon24" style="color: #7D7D7D;width: 50%;">擅长：毛发种植</view>
+							</view>
+						</view>
+					</view>
+					<!-- 产品推荐 -->
+					<view class="fon30 bold mar-s40 mar-x10 pad-zy50" style="color: #3875F6;">产品推荐</view>
+					<shopList></shopList>
+				</view>
+			</view>
+			<!-- 底部导航 -->
+			<view class="posixzy disjbac bacf pad-zy32 btnBKS">
+				<view class="posir">
+					<image @tap="backHome" class="posia backH" src="/static/public/back-home.png" mode="aspectFill"></image>
+				</view>
+				<view class="disac fon26 colf">
+					<view @tap="showTK=true" class="disjcac lianShare" style="background-color: #3875F6; border-top-left-radius: 51rpx;border-bottom-left-radius: 51rpx;">加入购物车</view>
+					<view @tap="showTK=true" class="disjcac lianShare" style="background-color: #F85050;border-top-right-radius: 51rpx;border-bottom-right-radius: 51rpx;">立即购买</view>
+				</view>
+			</view>
+			<!-- 购物车 -->
+			<navigator url="/pagesA/shopCart/shopCart" hover-class="none">
+				<view style="position: fixed;right: 30rpx;bottom: 300rpx;">
+					<view class="posir" style="width: 112rpx;height: 112rpx;">
+						<image src="/static/public/cart.png" mode="aspectFill" style="width: 112rpx;height: 112rpx;"></image>
+						<view class="posia" style="background: #F85050;width: 28rpx;height: 28rpx;border-radius: 100%;color: #FFFFFF;font-size: 24rpx;text-align: center;line-height: 28rpx;top: 20rpx;right: 20rpx;"><view style="transform: scale(.8);">99</view></view>
+					</view>
+				</view>
+			</navigator>
+			<!-- 客服 -->
+			<view style="position: fixed;right: 16rpx;bottom: 140rpx;">
+				<view class="posir" style="width: 142rpx;height: 142rpx;">
+					<image src="/static/public/kf-logo.png" mode="aspectFill" style="width: 142rpx;height: 142rpx;"></image>
+					<button open-type="share" class="posia syxzo"></button>
+				</view>
+			</view>
+			<!-- 立即购买，加入购物车弹框 -->
+			<view v-if="showTK" class="posAll" @tap="showTK=false">
+				<view class="bacf posixzy" @tap.stop="showTK=true" style="border-radius: 40rpx 40rpx 0rpx 0rpx;">
+					<view class="disjb pad-zy50">
+						<image src="/static/public/like.png" mode="aspectFill" style="width: 214rpx;height: 214rpx;border-radius: 15rpx;bottom: 0;flex-shrink: 0;margin-top: -107rpx;margin-right: 30rpx;"></image>
+						<view class="disjb width100">
+							<view>
+								<view class="fon40 mar-sx10" style="color: #F85050;">￥3888</view>
+								<view><span style="color: #B3B3B3;font-size: 24rpx;text-decoration: line-through;font-weight: 400;">￥4205</span></view>
+							</view>
+							<image @tap.stop="showTK=false" src="../../static/public/cha-close.png" style="width: 24px;height: 24px;margin-top: 20rpx;" mode=""></image>
+						</view>
+					</view>
+					<!-- 标题 -->
+					<view class="fon36 col3 bold clips3 pad-zy30 mar-s20">
+						<span class="radius10 colf fon20" style="padding: 6rpx 10rpx;" :style="{background:publicColor}">秃顶种植</span>
+						<span class="radius10 colf fon20 mar-z10" style="padding: 6rpx 10rpx;background: #F85050;">团购</span>
+						<span class="radius10 colf fon20 mar-z10" style="padding: 6rpx 10rpx;background: #F85050;">拼团活动</span>
+						<span class="radius10 colf fon20 mar-z10" style="padding: 6rpx 10rpx;background: #F85050;">促销活动</span>
+						<span style="line-height: 50rpx;">【99皮皮节】【种植发际线】1000单位FUE技术案例招募门美人尖/头顶加密/微针/纤维/脱发</span>
+					</view>
+					<view class="disjbac mar-sx40 pad-zy30 col3">
+						<view class="fon28">类型：</view>
+						<view class="fon26 disac">
+							<view @tap="chooselei(indexl)" v-for="(item,indexl) in leiList" :key="indexl" :class="leiIndex==indexl?'activelei':'molei'" :style="{background:leiIndex==indexl?publicColor:'#F2F2F2'}">{{item}}</view>
+						</view>
+					</view>
+					<view class="disjbac mar-sx40 pad-zy30 fon28">
+						<view class="col3">库存：</view>
+						<view class="fon26 col3" style="color: #5B5B5B;">1000件</view>
+					</view>
+					<view class="disjbac mar-sx40 pad-zy30 fon28">
+						<view class="col3">购买数量：</view>
+						<view class="fon26 col3 disac bold">
+							<image src="../../static/public/del.png" mode="" style="width: 65rpx;height: 30px;"></image>
+							<input type="text" value="1" style="width: 100rpx;height: 28px;text-align: center;border-top: 2rpx solid #3875F6;border-bottom: 2rpx solid #3875F6;"/>
+							<image src="../../static/public/add.png" mode="" style="width: 65rpx;height: 30px;"></image>
+						</view>
+					</view>
+					<!-- 加入购物车，立即购买 -->
+					<view class="disjbac pad-zy30 colf fon28 mar-x20">
+						<view style="width: 294rpx;height: 70rpx;line-height: 70rpx;text-align: center;border-radius: 10rpx; background: #3875F6;">加入购物车</view>
+						<view style="width: 294rpx;height: 70rpx;line-height: 70rpx;text-align: center;border-radius: 10rpx; background: #F85050;">立即购买</view>
+					</view>
+					<!-- 单独购买，立即拼团 -->
+					<view class="disjbac pad-zy30 colf fon28 mar-x20">
+						<view style="width: 294rpx;height: 70rpx;line-height: 70rpx;text-align: center;border-radius: 10rpx; background: #C8C8C8;">单独购买</view>
+						<view style="width: 294rpx;height: 70rpx;line-height: 70rpx;text-align: center;border-radius: 10rpx; background: #F85050;">立即拼团</view>
+					</view>
+				</view>
+			</view>
+			<!-- 去拼单弹框 -->
+			<view v-if="showPD" @tap.stop="showPD=false" style="position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 6;background: rgba(0,0,0,.54);display: flex;justify-content: center;align-items: center;">
+				<view class="bacf radius20 width100 posir" @tap.stop="showPD=true" style="font-weight: 500;text-align: center;margin: 0 85rpx;height: 458rpx;">
+					<view class="fon28 col3" style="margin: 34rpx 0 27rpx 0;">参与廖恒利的拼单</view>
+					<view class="fon24 col3" style="margin-bottom: 63rpx;">仅剩1个名额，19:05:28后结束</view>
+					<view class="disjcac" style="margin-bottom: 77rpx;">
+						<image src="/static/public/like.png" mode="" style="width: 100rpx;height: 100rpx;border-radius: 100%;"></image>
+						<image src="/static/public/pin-jie.png" mode="" style="width: 42rpx;height: 42rpx;margin: 0 47rpx;"></image>
+						<image src="/static/public/weiz.png" mode="" style="width: 100rpx;height: 100rpx;border-radius: 100%;"></image>
+					</view>
+					<view style="width: 464rpx;height: 60rpx;line-height: 60rpx;color: #FFFFFF;background: #F85050;border-radius: 10rpx;margin: 0 auto;font-size: 28rpx;">参与拼单</view>
+					<image @tap.stop="showPD=false" src="../../static/public/pin-close.png" class="posia" style="width: 77rpx;height: 77rpx;right: -30rpx;top: -30rpx;" mode=""></image>
+				</view>
+			</view>
+			<!-- 返回顶部 -->
+			<!-- <back-top :showTop="showTop" @backTop="backTop"></back-top> -->
+			<!-- 弹框授权 -->
+			<empower @buttonH="buttonH" :vision="vision" :isWhere="2" @cancleEv="cancleEv"></empower>
+			<!-- 弹框 -->
+			<view v-if="isShowP" @touchmove.stop.prevent="moveHandle" class="disjcac posAll">
+				<view class="bacf radius20 width100 tank-box">
+					<view class="tc tank-box-itemone">请授权绑定手机号</view>
+					<view class="fon28 colf pad-x30 pad-zy30 tc disjb">
+						<view @tap="isShowP=false" class="pad-sx10 radius10 tank-btn" style="background-color: rgba(230, 230, 230,1);color: #000000;">暂不绑定</view>
+						<view class="pad-sx10 radius10 tank-btn posir pbackc">
+							立即绑定
+							<button open-type="getPhoneNumber" @getphonenumber="getphonenumber" class="posia syxzo">立即绑定</button>
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import listDoctor from '@/components/list-doctor.vue';
+	import swiperPu from '@/components/swiper-pu.vue';
+	import {collectionEV,cancleCollectionEV} from '@/jsFile/publicAPI.js';
+	import empower from '@/components/empower.vue';
+	import shopList from '@/components/shop-list.vue';
+	export default {
+		components:{
+			listDoctor,
+			swiperPu,
+			empower,
+			shopList
+		},
+		data() {
+			return {
+				statusBarHeight:uni.getSystemInfoSync().statusBarHeight,
+				isLoading:true,
+				vision:false,
+				statusHNH:uni.getStorageSync('statusHNH'),
+				publicColor:uni.getStorageSync('publicColor') || '#3875F6',//主题颜色
+				cateCurrent:0,
+				haveImg:true,
+				cateList:[
+					{
+						id:1,
+						title:'商品详情',
+						pid:11,
+						sort:4
+					},{
+						id:2,
+						title:'问题',
+						pid:22,
+						sort:4
+					},{
+						id:3,
+						title:'案例日记',
+						pid:33,
+						sort:4
+					},{
+						id:4,
+						title:'效果模拟',
+						pid:33,
+						sort:4
+					},{
+						id:5,
+						title:'科普视频',
+						pid:33,
+						sort:4
+					}],
+				bannerList:[
+					{imgSrc:'/static/public/banner.png',url:'',isVideo:true,poster:''},
+					{imgSrc:'/static/public/banner.png',url:'',isVideo:false,poster:''}
+				],//轮播
+				xgList:[//相关推荐
+				],
+				dataList:[//推荐医生
+				],
+				showTop:false,
+				isDetailConllection:false,//是否已收藏
+				isNum:0,
+				listArrone:[],//问题
+				listArrtwo:[//案例日记
+				],
+				listArrthree:[//效果模拟
+				],
+				listArrfour:[//科普视频
+				],
+				detailObj:{},//详情
+				detailInfo:'',//富文本
+				category_id:'',//栏目ID
+				active:'',//是否是详情页
+				// jieDuan:false,
+				share_id:0,
+				invite_code:'',
+				isShowP:false,
+				showTK:false,
+				leiIndex:0,
+				leiList:['体验装','正式装'],
+				showPD:false
+			}
+		},
+		onPageScroll(e) {
+		    e.scrollTop > 360 ? this.showTop = true : this.showTop = false
+		},
+		onReachBottom() {//触底事件
+			// for (let i = 0; i < 4; i++) {
+			// 	if(this.cateCurrent==0) {
+			// 		let obj = {status:false,main_img:'',title:'恒美小课堂',content:'饺子会吃肉？',head_img:'/static/public/like.png',name:'吃肉的饺子',isCate:0}
+			// 		this.listArrone.push(obj)
+			// 	}
+			// 	if(this.cateCurrent==1) {
+			// 		let obj = {status:false,main_img:'',title:'恒美小课堂',content:'饺子会吃肉？',head_img:'/static/public/like.png',name:'吃肉的饺子',isCate:1}
+			// 		this.listArrtwo.push(obj)
+			// 	}
+			// 	if(this.cateCurrent==2) {
+			// 		let obj = {status:false,main_img:'',title:'恒美小课堂',content:'饺子会吃肉？',head_img:'/static/public/like.png',name:'吃肉的饺子',isCate:2}
+			// 		this.listArrthree.push(obj)
+			// 	}
+			// 	if(this.cateCurrent==3) {
+			// 		let obj = {status:false,main_img:'',title:'恒美小课堂',content:'饺子会吃肉？',head_img:'/static/public/like.png',name:'吃肉的饺子',isCate:3}
+			// 		this.listArrfour.push(obj)
+			// 	}
+			// }
+		},
+		onShareTimeline() {},
+		onShareAppMessage(res) {
+		    var ya = this;
+			this.$requst.post('user/record',{type:'content',action:'share',id:this.detailObj.id}).then(res=>{console.log('分享成功：',res);},error=>{})
+			let maiOjb = {
+				e:4,//内容分享
+				c:this.detailObj.id*1,
+				t:new Date().getTime()//当前时间戳
+			}
+			this.$toolAll.tools.maiDian(maiOjb)
+			var shareObj = {
+		　　　　	title: `${ya.detailObj.title}`, // 默认是小程序的名称(可以写slogan等)
+		　　　　	path: `/pagesB/problemDetail/problemDetail?id=${this.detailObj.id}&category_id=${this.category_id}&share_id=${uni.getStorageSync('userId')}&invite_code=${uni.getStorageSync('invite_code')}`, // 默认是当前页面，必须是以‘/’开头的完整路径
+		　　　　	imageUrl: ya.$http + ya.detailObj.share_img//自定义图片路径，可以是本地文件路径、代码包文件路径或者网络图片路径，支持PNG及JPG，不传入 imageUrl 则使用默认截图。显示图片长宽比是 5:4
+		　	};
+		　　return shareObj;
+		},
+		onShow() {
+		},
+		onLoad(options) {
+			if(options.category_id!=undefined) {
+				this.category_id = options.category_id
+				this.conid = options.id
+				this.invite_code = options.invite_code
+				uni.setStorageSync('ninvite_code',this.invite_code)
+				if(this.invite_code!='' && this.invite_code!=undefined){
+					uni.login({
+						provider: 'weixin',
+						success: (res)=> {
+							if (res.code) {
+								var params = {
+									code:res.code,
+									invite_code:this.invite_code,//用户邀请码
+								}
+								this.$requst.post('user/login',params).then(res => {
+									if(res.data.token!=''){
+										if(res.data.is_active==0) {
+											this.haveImg = false
+											this.vision = true
+										}
+									}
+								},error => {})
+							}
+						},
+					});
+				} else {
+					this.$toolAll.tools.overdue()
+					this.$toolAll.tools.isLogin()
+				}
+			}
+			// this.checkDetail(this.conid)
+			if(options.share_id!=undefined) this.share_id = options.share_id
+			let maiOjb = {
+				e:4,//内容分享
+				c:this.conid*1,
+				t:new Date().getTime()//当前时间戳
+			}
+			this.$toolAll.tools.maiDian(maiOjb)
+		},
+		methods: {
+			comeTuan(){//去拼单
+				this.showPD = true;
+			},
+			chooselei(index){//类型选择
+				this.leiIndex = index
+			},
+			moveHandle(){//禁止底层滑动
+				return false
+			},
+			getphonenumber(e){//授权绑定手机号
+				if(e.detail.errMsg=="getPhoneNumber:ok"){
+					this.$requst.post('user/bind-phone',{iv:e.detail.iv,encryptedData:e.detail.encryptedData}).then(res=>{
+						// console.log('手机号信息：',res);
+						if(res.code==0){
+							this.isShowP = false
+							this.$toolAll.tools.showToast('手机号绑定成功','success')
+						}
+					},error=>{})
+				} else {
+					this.isShowP = false
+				}
+			},
+			chooseLike(e){//收藏事件
+				// console.log(this.dataList[e].is_collected);
+				let cateId = ''
+				let newArr = []
+				if(this.cateCurrent==0) {
+					newArr = this.listArrone
+					cateId = newArr[e].id
+				} 
+				if(this.cateCurrent==1) {
+					newArr = this.listArrtwo
+					cateId = newArr[e].id
+				} 
+				if(this.cateCurrent==2) {
+					newArr = this.listArrthree
+					cateId = newArr[e].id
+				} 
+				if(this.cateCurrent==3) {
+					newArr = this.listArrfour
+					cateId = newArr[e].id
+				} 
+				if(newArr[e].is_collected==0){
+					newArr[e].is_collected = 1
+					// 调用收藏事件
+					collectionEV({action:'collect',archive_id:cateId})
+				}
+			},
+			comfirmev(e){//确认取消收藏事件
+				let cateId = ''
+				if(this.cateCurrent==0) {
+					this.listArrone[e].is_collected = 0
+					cateId = this.listArrone[e].id
+				} 
+				if(this.cateCurrent==1) {
+					this.listArrtwo[e].is_collected = 0
+					cateId = this.listArrtwo[e].id
+				} 
+				if(this.cateCurrent==2) {
+					this.listArrthree[e].is_collected = 0
+					cateId = this.listArrthree[e].id
+				} 
+				if(this.cateCurrent==3) {
+					this.listArrfour[e].is_collected = 0
+					cateId = this.listArrfour[e].id
+				} 
+				this.$toolAll.tools.showToast('正在取消...','loading')
+				// 调用取消收藏事件
+				cancleCollectionEV({action:'collect',archive_id:cateId})	
+			},
+			chooseLikex(e){//收藏事件
+				if(this.xgList[e].is_collected==0){
+					this.xgList[e].is_collected = 1
+					// 调用收藏事件
+					collectionEV({action:'collect',archive_id:this.xgList[e].id})
+				}
+			},
+			comfirmevx(e){//确认取消收藏事件
+				this.xgList[e].is_collected = 0
+				this.$toolAll.tools.showToast('正在取消...','loading')
+				// 调用取消收藏事件
+				cancleCollectionEV({action:'collect',archive_id:this.xgList[e].id})	
+			},
+			buttonH(e){//授权成功
+				this.haveImg = e
+				if(e) {
+					this.vision = false
+					this.isShowP = true
+				}
+			},
+			cancleEv(e){//取消授权
+				if(e==0) this.vision = false
+			},
+			backHome(){
+				uni.navigateTo({
+					url:'/pages/tabbar/pagehome/pagehome'
+				})
+			},
+			shareEv(){
+				if(this.haveImg == false) {
+					this.vision = true
+				}
+			},
+			// checkDetail(newId){
+			// 	this.$requst.post('archives/detail',{id:newId,share_id:this.share_id}).then(res=>{
+			// 		// console.log('详情数据：',res);
+			// 		if(res.code==0){
+			// 			this.isLoading=true
+			// 			// 栏目类别
+			// 			if(res.data.category.length!=0){
+			// 				res.data.category.forEach((item,index)=>{
+			// 					let cateObj = {
+			// 						id:item.id,//栏目ID 
+			// 						title:item.title,//栏目名称
+			// 						active:item.active,//是否选中
+			// 						model_id:item.model_id,//模型ID
+			// 						model_name:item.model_name,//模型标识
+			// 						sort:item.sort
+			// 					}
+			// 					this.cateList.push(cateObj)
+			// 					// 默认选中的栏目
+			// 					if(item.active==1) this.active = this.cateCurrent = index
+			// 					// 默认展示栏目详情
+			// 					if(this.category_id==item.id) this.isNum = index
+			// 				})
+			// 			}
+			// 			if(this.invite_code!='' && this.invite_code!=undefined){
+			// 				const query = wx.createSelectorQuery()
+			// 				query.select('.statusHNH').boundingClientRect((rect) => {
+			// 					// console.log('状态栏+标题栏：',rect);
+			// 					this.statusHNH = rect.height
+			// 					// console.log(this.statusHNH );
+			// 				}).exec()
+			// 			}
+			// 			// 详情
+			// 			this.detailObj = res.data.detail
+			// 			let maiOjb = {
+			// 				e:1,//内容访问
+			// 				c:this.detailObj.id*1,
+			// 				t:new Date().getTime()//当前时间戳
+			// 			}
+			// 			this.$toolAll.tools.maiDian(maiOjb)
+			// 			// 轮播
+			// 			// 图片字符串转数组
+			// 			let arrImg = this.detailObj.images.split(',')
+			// 			arrImg.forEach(item=>{
+			// 				let newImgObj = {
+			// 					imgSrc:this.$http + item,
+			// 					url:'',
+			// 					isVideo:false,
+			// 					poster:'',
+			// 				}
+			// 				// 存图片
+			// 				this.bannerList.push(newImgObj)
+			// 			})
+			// 			// 存视频
+			// 			if(this.detailObj.video!=''){
+			// 				this.bannerList[0] = {
+			// 					imgSrc:this.$http + arrImg[0],
+			// 					url:this.$http + this.detailObj.video,
+			// 					isVideo:true,
+			// 					poster:'',
+			// 				}
+			// 			}
+			// 			// 默认显示是否收藏
+			// 			if(this.detailObj.is_collected==0) this.isDetailConllection = false
+			// 			if(this.detailObj.is_collected==1) this.isDetailConllection = true
+			// 			// 富文本
+			// 			this.detailInfo = this.$toolAll.tools.escape2Html(this.detailObj.content)
+			// 			// 相关推荐xgList
+			// 			if(res.data.diary.length!=0){
+			// 				res.data.diary.forEach(item=>{
+			// 					let tObj = {
+			// 						category_id:item.category_id,//栏目ID
+			// 						id:item.id,
+			// 						is_collected:item.is_collected,//是否已收藏
+			// 						collects:item.collects,//收藏量
+			// 						views:item.views,//查看量
+			// 						main_img:this.$http + item.cover,//封面图
+			// 						video:this.$http + item.video,//视频地址
+			// 						title:item.title,//标题
+			// 						content:item.subtitle,//副标题
+			// 						head_img:'/static/public/logo.png',//发布者头像
+			// 						name:'恒美植发',//发布者昵称
+			// 						isVideo:item.video.includes(".mp4")//是否是视频
+			// 					}
+			// 					if(item.cover!='' && item.video==''){
+			// 						this.xgList.push(tObj)
+			// 					}
+			// 				})
+			// 			}
+			// 			// 推荐医生
+			// 			if(res.data.doctor.length!=0){
+			// 				res.data.doctor.forEach(item=>{
+			// 					let doObj = {
+			// 						id:item.id,
+			// 						imgSrc: item.headimg!=null ? item.headimg : '',
+			// 						name:item.name,
+			// 						cyear:parseFloat(item.work_time),
+			// 						bmen:item.dept_name,
+			// 						zcheng:'主任医师',
+			// 						goodAt:item.diseases,
+			// 						show_detail:item.show_detail
+			// 					}
+			// 					this.dataList.push(doObj)
+			// 				})
+			// 			}
+			// 			this.choosecateEv(this.cateCurrent)
+			// 		}
+			// 	},error=>{})
+			// },
+			choosecateEv(e){
+				this.cateCurrent = e
+				this.$requst.post('archives/category',{category_id:this.cateList[e].id,keyword:''}).then(res=>{
+					// console.log('该分类下的列表：',res);
+					if(res.code==0){
+						if(e==0 && this.active!=e) this.listArrone = []
+						if(e==1 && this.active!=e) this.listArrtwo = []
+						if(e==2 && this.active!=e) this.listArrthree = []
+						if(e==3 && this.active!=e) this.listArrfour = []
+						if(res.data.list.list.length!=0){
+							res.data.list.list.forEach(item=>{
+								let num = item.video.search(".mp4")
+								let isVideo = false
+								if(num!='-1') isVideo = true
+								let arrObj = {
+									category_id:item.category_id,//栏目ID
+									id:item.id,
+									is_collected:item.is_collected,//是否已收藏
+									collects:item.collects,//收藏量
+									views:item.views,//查看量
+									main_img:this.$http + item.cover,//封面图
+									video:this.$http + item.video,//视频地址
+									title:item.title,//标题
+									content:item.subtitle,//副标题
+									head_img:'/static/public/logo.png',//发布者头像
+									name:'恒美植发',//发布者昵称
+									isVideo:isVideo//是否是视频
+								}
+								if(item.cover!=''){
+									if(e==0 && this.active!=e) this.listArrone.push(arrObj)
+									if(e==1 && this.active!=e) this.listArrtwo.push(arrObj)
+									if(e==2 && this.active!=e) this.listArrthree.push(arrObj)
+									if(e==3 && this.active!=e) this.listArrfour.push(arrObj)
+								}
+							})
+						}
+					}
+				},error=>{})
+			},
+			tapConllection(){//收藏、取消收藏事件
+				let isLikeCon = 'collect'
+				// if(!this.jieDuan){
+				// 	let isAuth = this.$toolAll.tools.returnAuth()
+				// 	if(!isAuth){
+						// 调用收藏事件
+						if(!this.isDetailConllection) collectionEV({action:isLikeCon,archive_id:this.detailObj.id})
+						// 调用取消收藏事件
+						else cancleCollectionEV({action:isLikeCon,archive_id:this.detailObj.id})	
+						this.isDetailConllection = !this.isDetailConllection
+				// 	} else this.jieDuan = true
+				// }
+			},
+			backTop(){//回到顶部事件
+			    uni.pageScrollTo({
+			        scrollTop: 0,
+			        duration: 300
+			    });
+			},
+		}
+	}
+</script>
+
+<style>
+</style>