1-5-item

common/http.api.js

@@ -413,7 +413,21 @@ const install = (Vue, vm) => {
 		// 新增提现
 		addReflectDetail: (params = '') => vm.$u.post(`/Customer/apiCustomer/addReflectDetail`, params),
 		// 获取所有提现记录
-		getAllReflectDetail: (params = '') => vm.$u.post(`/Customer/apiCustomer/getAllReflectDetail`, params),
+		getAllReflectDetail: (params = '') => vm.$u.post(`/Customer/apiCustomer/getAllReflectDetail`, params),
+		// 项目列表
+		getItemList:(params = '') => vm.$u.get(`/shop/ApiShopProject/list`, params),
+		// 项目详情
+		getItemDetail:(params = '') => vm.$u.get(`/shop/ApiShopProject/details`, params),
+		// 计算详情价格
+		calculation:(params = '') => vm.$u.post(`/shop/ApiShopProject/calculation`, params),
+		//获取门店列表
+		getStoreList: (params = '') => vm.$u.post(`/shop/ApiShop/getAll`, params),
+		//全部员工列表
+		getAllygList: (params = '') => vm.$u.get(`/Department/ApiStaff/staffAll`, params),
+		//选择时间员工 
+		getTimeYgList: (params = '') => vm.$u.post(`/shop/ApiShopProject/choice`, params),
+		//员工预约时间
+		getYgYyTimeArea: (params = '') => vm.$u.post(`/shop/ApiShopProject/choice`, params),
 	};
 }
 

components/its-calendar/its-calendar.vue

@@ -1,296 +1,310 @@
-<template>
-	<view>
-		<view class="calendar">
-			<scroll-view scroll-x="true" class="top-wrap" >
-				<view class="time-wrap" v-for="(dayitem,dayindex) in dayArr" :key="dayindex" :class="{'action':day_index ==dayindex }" @click.stop="dayList(dayitem,dayindex)">
-					<text class="time-val">{{dayitem.days}}</text>
-					<text class="time-xq">{{dayitem.weeks}}</text>
-				</view>
-			</scroll-view>
-			<!-- <view class="calendar_day">
-				
-				<view class="day_x" :style="{'color': (day_index == index ? '#FE3B3C' : '')}"
-					v-for="(item, index) in dayArr" :key="index" @click.stop="dayList(item,index)">
-					<view class="day_x_a">{{item.weeks}}</view>
-					<view class="day_x_b">{{item.days}}</view>
-				</view>
-			</view> -->
-			<view scroll-y class="calendar_time">
-				<view class="time_x" :class="host_index == item.timeStamp ? 'time_x_sty' : ''"
-					v-for="(item, index) in hostArr[day_index]" :key="index"
-					@click="nowTimes < item.timeStamp ? hosts(item) : ''"
-					:style="{'color': (nowTimes > item.timeStamp ? '#999999' : '')}">{{item.hours}}</view>
-			</view>
-		</view>
-		<!-- <view class="sub" @click="sub()">
-			立即预约
-		</view> -->
-	</view>
-</template>
-
-<script>
-	export default {
-		props: {
-			sta_num: {
-				type: Number | String,
-				default: 8
-			},
-			end_num: {
-				type: Number | String,
-				default: 23
-			},
-			int_num: {
-				type: Number | String,
-				default: 30
-			},
-		},
-		data() {
-			return {
-				dayArr: [],
-				hostArr: [],
-				day_index: 0,
-				host_index: '',
-				host_All: [],
-				nowTimes: '',
-			}
-		},
-		mounted() {
-			let dateArr = [];
-			let today = new Date();
-			let nowTime = today.getTime() // 当前时间戳
-			this.nowTimes = parseInt(nowTime / 1000)
-			for (let i = 0; i < 10; i++) {
-				let newDate = new Date(today.getTime() + i * 1000 * 60 * 60 * 24);
-				let month = (parseInt(newDate.getMonth()) + 1) > 9 ? (parseInt(newDate.getMonth()) + 1) : "0" + (parseInt(
-					newDate.getMonth()) + 1); // 当前月份
-				let day = (newDate.getDate()) > 9 ? newDate.getDate() : "0" + newDate.getDate(); //当前日期
-				let backTime = newDate.getTime(); // 几天后时间戳
-				let backDays = newDate.getDay();// 几天后周几
-				let remTime = (backTime - nowTime) / 1000; // 距离今天几天
-				let week = '';
-				// if (remTime == 0) {
-				// 	week = "今天"
-				// } else if (remTime == 86400) {
-				// 	week = "明天"
-				// } else if (remTime == 172800) {
-				// 	week = "后天"
-				// } else {
-					if (backDays == 0) {
-						week = "周日";
-					} else if (backDays == 1) {
-						week = "周一";
-					} else if (backDays == 2) {
-						week = "周二";
-					} else if (backDays == 3) {
-						week = "周三";
-					} else if (backDays == 4) {
-						week = "周四";
-					} else if (backDays == 5) {
-						week = "周五";
-					} else if (backDays == 6) {
-						week = "周六";
-					}
-				// }
-				// let fullDate = `${month}-${day}`;
-				let fullDate = `${day}`;
-				let ass = {
-					weeks: week,
-					days: fullDate
-				};
-				dateArr.push(ass);
-			}
-			this.dayArr = dateArr;
-
-			let timeArr = [];
-			for (let i = 0; i < 5; i++) {
-				// let as = new Date(new Date().toLocaleDateString()).getTime() / 1000
-				let as = new Date(new Date().toLocaleDateString()).getTime() / 1000 + i * 60 * 60 * 24;
-				let staTime = this.sta_num * 60 * 60 + as;
-				let endTime = this.end_num * 60 * 60 + as;
-				let int = this.int_num * 60;
-				let timeArr_s = [];
-				for (staTime; staTime < endTime - int; staTime + int) {
-					staTime = staTime + int;
-					let hours = this.times(staTime);
-					let asb = {
-						hours,
-						timeStamp: staTime
-					};
-					timeArr_s.push(asb);
-				}
-				timeArr.push(timeArr_s);
-			}
-			this.hostArr = timeArr;
-		},
-		methods: {
-			// 点击日期
-			dayList(e, index) {
-				this.day_index = index;
-			},
-			// 点击时间
-			hosts(e) {
-				this.host_All = e;
-				this.host_index = e.timeStamp;
-				this.sub()
-			},
-			// 点击立即预约
-			sub() {
-				if (this.host_index == '') {
-					this.$tool.toast('请选择时间');
-				} else {
-					let day = this.dayArr[this.day_index];
-					let time = this.time(this.host_index);
-					let comTime = {
-						days: day.days,
-						weeks: day.weeks,
-						hours: this.host_All.hours,
-						timeStamp: this.host_All.timeStamp,
-						time: time
-					};
-					this.$emit('getTime', comTime);
-				}
-			},
-			// 格式化时间
-			times(data) {
-				let date = new Date(data * 1000);
-				//时间戳为10位需*1000，时间戳为13位的话不需乘1000
-				let h = date.getHours();
-				h = h < 10 ? ('0' + h) : h; //小时补0
-				let m = date.getMinutes();
-				m = m < 10 ? ('0' + m) : m; //分钟补0
-				return h + ':' + m;
-			},
-			time(data, type){
-				let date = new Date(data * 1000);
-				//时间戳为10位需*1000，时间戳为13位的话不需乘1000
-				let y = date.getFullYear();
-				let MM = date.getMonth() + 1;
-				MM = MM < 10 ? ('0' + MM) : MM; //月补0
-				let d = date.getDate();
-				d = d < 10 ? ('0' + d) : d; //天补0
-				let h = date.getHours();
-				h = h < 10 ? ('0' + h) : h; //小时补0
-				let m = date.getMinutes();
-				m = m < 10 ? ('0' + m) : m; //分钟补0
-				let s = date.getSeconds();
-				s = s < 10 ? ('0' + s) : s; //秒补0
-				if (type == 'yymmdd') {
-					return y + '-' + MM + '-' + d;
-				} else if (type == 'hhmmss') {
-					return h + ':' + m + ':' + s;
-				} else {
-					return y + '-' + MM + '-' + d + ' ' + h + ':' + m + ':' + s;
-				}
-			}
-		}
-	}
-</script>
-
-<style lang="scss">
-	page {
-		background-color: #F4F4F4;
-	}
-
-	.calendar {
-		width: 710rpx;
-		height: 590rpx;
-		background-color: #FFFFFF;
-		margin: 20rpx auto 10rpx;
-		border-radius: 8rpx;
-	}
-
-	.calendar_day {
-		display: flex;
-		width: 100%;
-		height: 120rpx;
-
-		.day_x {
-			display: flex;
-			// flex-flow: column nowrap;
-			flex-flow: nowrap;
-			justify-content: center;
-			align-items: center;
-			width: 20%;
-			height: 100%;
-			font-size: 30rpx;
-			color: #333333;
-		}
-	}
-
-	.calendar_time {
-		display: flex;
-		width: 100%;
-		height: 448rpx;
-		flex-flow: row wrap;
-		align-content: flex-start;
-		margin: 20rpx 0;
-		overflow-y: auto;
-
-		.time_x {
-			display: flex;
-			flex-flow: row;
-			justify-content: center;
-			align-items: center;
-			width: 20%;
-			height: 54rpx;
-			border-radius: 26rpx;
-			margin: 10rpx 0;
-			font-size: 30rpx;
-			color: #333333;
-		}
-
-		.time_x_sty {
-			background-color: #262261;
-			color: #fff !important;
-		}
-	}
-
-	.sub {
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		width: 710rpx;
-		height: 100rpx;
-		border-radius: 50rpx;
-		margin: 30rpx auto;
-		color: #FFFFFF;
-		font-size: 36rpx;
-		// background-color: #FE3B3C;
-	}
-	.top-wrap {
-		
-		white-space: nowrap;
-		width: 700rpx;
-		// height: 100rpx;
-		padding:20rpx 0;
-		.time-wrap {
-			margin: auto 15rpx;
-			display: inline-block;
-			width: 158rpx;
-			height: 63rpx;
-			border-radius: 32rpx;
-			line-height: 63rpx;
-			text-align: center;
-			background-color: #FDF9FA;
-			.time-xq {
-				font-size: 22rpx;
-				font-weight: 500;
-				color: #999999;
-			}
-			.time-val {
-				font-size: 32rpx;
-				font-weight: bold;
-				color: #333333;
-			}
-		}
-		.action {
-			background-color: #262261;
-			.time-xq {
-				color: #FDF9FA;
-			}
-			.time-val {
-				color: #FDF9FA;
-			}
-		}
-	}
+<template>
+	<view>
+		<view class="calendar">
+			<scroll-view scroll-x="true" class="top-wrap">
+				<view class="time-wrap" v-for="(dayitem,dayindex) in dayArr" :key="dayindex"
+					:class="{'action':day_index ==dayindex }" @click.stop="dayList(dayitem,dayindex)">
+					<text class="time-val">{{dayitem.days}}</text>
+					<text class="time-xq">{{dayitem.weeks}}</text>
+				</view>
+			</scroll-view>
+			<view scroll-y class="calendar_time">
+				<view class="time_x" :class="host_index == item.timeStamp ? 'time_x_sty' : ''"
+					v-for="(item, index) in hostArr[day_index]" :key="index"
+					@click="nowTimes < item.timeStamp ? hosts(item) : ''"
+					:style="{'color': (nowTimes > item.timeStamp ? '#999999' : '')}">{{item.hours}}</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			sta_num: {
+				type: Number | String,
+				default: 8
+			},
+			end_num: {
+				type: Number | String,
+				default: 23
+			},
+			int_num: {
+				type: Number | String,
+				default: 30
+			},
+		},
+		watch: {
+			sta_num(xin,low) {
+				console.log('改变了')
+				this.sxym()
+			}
+		},
+		data() {
+			return {
+				dayArr: [],
+				hostArr: [],
+				day_index: 0,
+				host_index: '',
+				host_All: [],
+				nowTimes: '',
+			}
+		},
+		mounted() {
+			this.sxym()
+		},
+		methods: {
+			sxym() {
+				console.log('执行获取',this.sta_num,this.end_num)
+				try{
+					let dateArr = [];
+					let today = new Date();
+					let nowTime = today.getTime() // 当前时间戳
+					this.nowTimes = parseInt(nowTime / 1000)
+					for (let i = 0; i < 5; i++) {
+						let newDate = new Date(today.getTime() + i * 1000 * 60 * 60 * 24);
+						let month = (parseInt(newDate.getMonth()) + 1) > 9 ? (parseInt(newDate.getMonth()) + 1) : "0" + (parseInt(
+							newDate.getMonth()) + 1); // 当前月份
+						let day = (newDate.getDate()) > 9 ? newDate.getDate() : "0" + newDate.getDate(); //当前日期
+						let backTime = newDate.getTime(); // 几天后时间戳
+						let backDays = newDate.getDay(); // 几天后周几
+						let remTime = (backTime - nowTime) / 1000; // 距离今天几天
+						let week = '';
+						// if (remTime == 0) {
+						// 	week = "今天"
+						// } else if (remTime == 86400) {
+						// 	week = "明天"
+						// } else if (remTime == 172800) {
+						// 	week = "后天"
+						// } else {
+						if (backDays == 0) {
+							week = "周日";
+						} else if (backDays == 1) {
+							week = "周一";
+						} else if (backDays == 2) {
+							week = "周二";
+						} else if (backDays == 3) {
+							week = "周三";
+						} else if (backDays == 4) {
+							week = "周四";
+						} else if (backDays == 5) {
+							week = "周五";
+						} else if (backDays == 6) {
+							week = "周六";
+						}
+						// }
+						// let fullDate = `${month}-${day}`;
+						let fullDate = `${day}`;
+						let ass = {
+							weeks: week,
+							days: fullDate
+						};
+						dateArr.push(ass);
+					}
+					this.dayArr = dateArr;
+					
+					let timeArr = [];
+					for (let i = 0; i < 5; i++) {
+						// let as = new Date(new Date().toLocaleDateString()).getTime() / 1000
+						let as = new Date(new Date().toLocaleDateString()).getTime() / 1000 + i * 60 * 60 * 24;
+						let staTime = this.sta_num * 60 * 60 + as;
+						let endTime = this.end_num * 60 * 60 + as;
+						let int = this.int_num * 60;
+						let timeArr_s = [];
+						for (staTime; staTime < endTime - int; staTime + int) {
+							staTime = staTime + int;
+							let hours = this.times(staTime);
+							let asb = {
+								hours,
+								timeStamp: staTime
+							};
+							timeArr_s.push(asb);
+						}
+						timeArr.push(timeArr_s);
+					}
+					this.hostArr = timeArr;
+					console.log(this.hostArr,'hostArr')
+				}catch(e){
+					//TODO handle the exception
+					console.log(e)
+				}
+				
+			},
+			// 点击日期
+			dayList(e, index) {
+				this.day_index = index;
+			},
+			// 点击时间
+			hosts(e) {
+				this.host_All = e;
+				this.host_index = e.timeStamp;
+				this.sub()
+			},
+			// 点击立即预约
+			sub() {
+				if (this.host_index == '') {
+					this.$tool.toast('请选择时间');
+				} else {
+					let day = this.dayArr[this.day_index];
+					let time = this.time(this.host_index);
+					let comTime = {
+						days: day.days,
+						weeks: day.weeks,
+						hours: this.host_All.hours,
+						timeStamp: this.host_All.timeStamp,
+						time: time
+					};
+					this.$emit('getTime', comTime);
+				}
+			},
+			// 格式化时间
+			times(data) {
+				let date = new Date(data * 1000);
+				//时间戳为10位需*1000，时间戳为13位的话不需乘1000
+				let h = date.getHours();
+				h = h < 10 ? ('0' + h) : h; //小时补0
+				let m = date.getMinutes();
+				m = m < 10 ? ('0' + m) : m; //分钟补0
+				return h + ':' + m;
+			},
+			time(data, type) {
+				let date = new Date(data * 1000);
+				//时间戳为10位需*1000，时间戳为13位的话不需乘1000
+				let y = date.getFullYear();
+				let MM = date.getMonth() + 1;
+				MM = MM < 10 ? ('0' + MM) : MM; //月补0
+				let d = date.getDate();
+				d = d < 10 ? ('0' + d) : d; //天补0
+				let h = date.getHours();
+				h = h < 10 ? ('0' + h) : h; //小时补0
+				let m = date.getMinutes();
+				m = m < 10 ? ('0' + m) : m; //分钟补0
+				let s = date.getSeconds();
+				s = s < 10 ? ('0' + s) : s; //秒补0
+				if (type == 'yymmdd') {
+					return y + '-' + MM + '-' + d;
+				} else if (type == 'hhmmss') {
+					return h + ':' + m + ':' + s;
+				} else {
+					return y + '-' + MM + '-' + d + ' ' + h + ':' + m + ':' + s;
+				}
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	page {
+		background-color: #F4F4F4;
+	}
+
+	.calendar {
+		width: 710rpx;
+		height: 590rpx;
+		background-color: #FFFFFF;
+		margin: 20rpx auto 10rpx;
+		border-radius: 8rpx;
+	}
+
+	.calendar_day {
+		display: flex;
+		width: 100%;
+		height: 120rpx;
+
+		.day_x {
+			display: flex;
+			// flex-flow: column nowrap;
+			flex-flow: nowrap;
+			justify-content: center;
+			align-items: center;
+			width: 20%;
+			height: 100%;
+			font-size: 30rpx;
+			color: #333333;
+		}
+	}
+
+	.calendar_time {
+		display: flex;
+		width: 100%;
+		height: 448rpx;
+		flex-flow: row wrap;
+		align-content: flex-start;
+		margin: 20rpx 0;
+		overflow-y: auto;
+
+		.time_x {
+			display: flex;
+			flex-flow: row;
+			justify-content: center;
+			align-items: center;
+			width: 20%;
+			height: 54rpx;
+			border-radius: 26rpx;
+			margin: 10rpx 0;
+			font-size: 30rpx;
+			color: #333333;
+		}
+
+		.time_x_sty {
+			background-color: #262261;
+			color: #fff !important;
+		}
+	}
+
+	.sub {
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		width: 710rpx;
+		height: 100rpx;
+		border-radius: 50rpx;
+		margin: 30rpx auto;
+		color: #FFFFFF;
+		font-size: 36rpx;
+		// background-color: #FE3B3C;
+	}
+
+	.top-wrap {
+
+		white-space: nowrap;
+		width: 700rpx;
+		// height: 100rpx;
+		padding: 20rpx 0;
+
+		.time-wrap {
+			margin: auto 15rpx;
+			display: inline-block;
+			width: 158rpx;
+			height: 63rpx;
+			border-radius: 32rpx;
+			line-height: 63rpx;
+			text-align: center;
+			background-color: #FDF9FA;
+
+			.time-xq {
+				font-size: 22rpx;
+				font-weight: 500;
+				color: #999999;
+			}
+
+			.time-val {
+				font-size: 32rpx;
+				font-weight: bold;
+				color: #333333;
+			}
+		}
+
+		.action {
+			background-color: #262261;
+
+			.time-xq {
+				color: #FDF9FA;
+			}
+
+			.time-val {
+				color: #FDF9FA;
+			}
+		}
+	}
 </style>

pages.json

@@ -121,6 +121,18 @@
 				"style": {
 					"navigationBarTitleText": "项目"
 				}
+			},
+			{
+				"path": "unit/itemdetail",
+				"style": {
+					"navigationBarTitleText": "详情展示",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": {
+							"type": "transparent"
+						}
+					}
+				}
 			},
 			{
 				"path": "user/editUserInfo",

pagesT/unit/item.vue

@@ -1,9 +1,9 @@
 <template>
 	<view class="content">
 		<view class="gq-list">
-			<view class="gq-item" v-for="item in 11">
+			<view class="gq-item" v-for="item in list" @click="goPage('/pagesT/unit/itemdetail?id=' + item.id)">
 				<view class="gq-logo">
-					<image src="" mode="" class=""></image>
+					<image :src="item.image" mode="" class=""></image>
 				</view>
 
 				<view class="info">
@@ -11,7 +11,7 @@
 						名称：
 					</view>
 					<view class="info-val clamp">
-						创始人
+						{{item.name}}
 					</view>
 				</view>
 				<view class="info">
@@ -19,7 +19,7 @@
 						价格：
 					</view>
 					<view class="info-val clamp">
-						创始人
+						{{item.price}}
 					</view>
 				</view>
 				<view class="info">
@@ -27,7 +27,7 @@
 						服务时间：
 					</view>
 					<view class="info-val clamp">
-						创始人
+						{{item.service_time}}分钟
 					</view>
 				</view>
 				<view class="info">
@@ -35,7 +35,7 @@
 						可预约：
 					</view>
 					<view class="info-val clamp">
-						创始人
+						是
 					</view>
 				</view>
 				<view class="info">
@@ -43,11 +43,12 @@
 						可下单：
 					</view>
 					<view class="info-val clamp">
-						创始人
+						是
 					</view>
 				</view>
 			</view>
 		</view>
+		<u-loadmore :status="loadingType" />
 	</view>
 </template>
 
@@ -55,26 +56,51 @@
 	export default {
 		data() {
 			return {
-				type: ''
+				list: [],
+				type: '',
+				page: 1,
+				limit: 12,
+				loadingType: 'loadmore'
 			}
 		},
 		onLoad(opt) {
-
+			this.getList()
 		},
 		onShow() {
 
 		},
 		onReachBottom() {
-
+			this.getList()
 		},
 		onReady() {
-
+			
 		},
 		methods: {
 			navto(url) {
 				uni.navigateTo({
 					url
 				})
+			},
+			getList() {
+				let that = this
+				if (that.loadingType == 'nomore' || that.loadingType == 'loading') {
+					return
+				}
+				that.loadingType = 'loading'
+				this.$u.api.getItemList({
+					page: that.page,
+					pageSize: that.limit
+				}).then(res => {
+					console.log(res)
+					that.list = that.list.concat(res.data)
+					console.log(that.list)
+					that.page++
+					if(res.data.length == that.limit) {
+						that.loadingType = 'loadmore'
+					}else {
+						that.loadingType = 'nomore'
+					}
+				})
 			}
 		}
 	}
@@ -109,6 +135,7 @@
 			justify-content: center;
 			align-items: center;
 			margin-bottom: 20rpx;
+
 			image {
 				width: 182rpx;
 				height: 192rpx;

pagesT/unit/itemdetail.vue

@@ -0,0 +1,1766 @@
+<template>
+	<view :class="['qn-page-' + theme]">
+		<u-navbar :is-back="false" title-color="#000000" :title-bold="true" title-size="36" :title="goods_detail.title">
+			<view class="back-icon ibonfont ibonfanhui" @click="back"></view>
+		</u-navbar>
+		<!-- <block v-if="goods_detail.id"> -->
+		<block>
+			<!-- 底部菜单 -->
+			<view class="footer">
+				<view class="icons">
+					<view class="box" @click="goPage('/pages/index/index', 'switchTab')">
+						<view class="icon ibonfont ibonhome"></view>
+						<view class="text">首页</view>
+					</view>
+					<view class="box" @click="goPage('/pages/cart/cart', 'switchTab')">
+						<u-badge v-if="cartNum > 0" type="error" :offset="[-18, -24]" :count="cartNum"></u-badge>
+						<view class="icon ibonfont iboncart"></view>
+						<view class="text">购物车</view>
+					</view>
+					<!-- #ifdef MP-WEIXIN -->
+					<view class="box" @click="shareGoods">
+						<view class="icon ibonfont ibonfenxiang2"></view>
+						<view class="text">分享</view>
+					</view>
+					<!-- #endif -->
+				</view>
+				<block v-if="goods_detail.isDistribution === 4 && goods_detail.inventorTotal <= 0">
+					<view v-if="!(goods_detail.inventorTotal - 0) || goods_detail.inventorTotal - 0 <= 0" class="btn">
+						<view class="buy primary-bg" style="background-color: #666666 !important;">补货中</view>
+					</view>
+				</block>
+				<view v-else class="btn">
+					<view class="buy primary-fu-bg" @click="openaddcartPop('btn')">立即购买</view>
+					<!-- <view class="buy primary-bg" @click="openaddcartPop('btn')">加入购物车</view> -->
+				</view>
+			</view>
+			<!-- 商品主图轮播 -->
+			<view class="swiper-box">
+				<swiper circular="true" autoplay="true" @change="swiperChange">
+					<swiper-item v-for="(item, index) in imgList" :key="index">
+						<image :src="item" mode="aspectFit" @click="previewImage(index)"></image>
+					</swiper-item>
+				</swiper>
+				<view class="indicator">{{ currentSwiper + 1 }}/{{ imgList.length }}</view>
+			</view>
+			<!-- 标题 价格 -->
+			<view class="goods-info">
+				<!-- 商品信息 -->
+				<view class="price-view primary-bg clearfix">
+					<view class="price-out">
+						<view style="display: inline-block;">
+							<text class="rmb-ic">¥</text>
+							<view style="display: inline-block;">
+								{{goods_detail.price}}
+							</view>
+						</view>
+						<view class="market-price">￥{{ goods_detail.ot_price }}</view>
+					</view>
+					<view class="right-view">
+						<view class="goods-num">
+							<view class="num-li">
+								已售{{ goods_detail.sold }}</view>
+						</view>
+					</view>
+				</view>
+				<view class="goods-info-main">
+					<view class="clearfix top-title">
+						<view class="title float_left ellipsis">
+							{{ goods_detail.name || '' }}
+						</view>
+					</view>
+				</view>
+			</view>
+			<!--规则选择 -->
+			<view class="info-box" style="margin-top: 0;">
+				<view class="row" v-if="goods_detail.unitData.length > 1">
+					<view class="text">换算</view>
+					<view class="content">
+						<block v-for="(item, index) in goods_detail.unitData" :key="index">
+							<view v-if="item.isMaster === 4" class="conversion">
+								<text
+									v-if="goods_detail.isEq === 5">1{{ item.unitName }}≈{{ item.conversion }}{{ goods_detail.unitName }}</text>
+								<text
+									v-else>1{{ item.unitName }}={{ item.conversion }}{{ goods_detail.unitName }}</text>
+							</view>
+						</block>
+					</view>
+				</view>
+				
+			</view>
+			<!-- 详情 -->
+			<view class="description">
+				<view class="title">———— 商品详情 ————</view>
+				<view class="content">
+					<u-parse :html="goods_detail.result"></u-parse>
+				</view>
+			</view>
+		</block>
+		<u-popup mode="bottom" v-model="sharePop" v-if="sharePop">
+			<view class="share-tit">分享</view>
+			<view class="share-ul">
+				<!-- #ifdef MP -->
+				<view class="share-li">
+					<button class="share-btn" open-type="share">
+						<view class="icon-view">
+							<u-icon name="weixin-fill" top="12" color="#ffffff" size="60"></u-icon>
+						</view>
+						<view class="share-btn-label">分享给好友</view>
+					</button>
+				</view>
+				<!-- #endif -->
+				<view class="share-li" @click="generatePoster">
+					<button class="share-btn">
+						<view class="icon-view">
+							<u-icon name="photo-fill" top="12" color="#ffffff" size="60"></u-icon>
+						</view>
+						<view class="share-btn-label">生成分享海报</view>
+					</button>
+				</view>
+			</view>
+			<view class="share-cancel" @click="cancelPop">取消分享</view>
+		</u-popup>
+		<!-- 海报 -->
+		<u-popup class="no-pop-bg" v-model="canvasPop" mode="center" :border-radius="12" :mask-close-able="false">
+			<view v-if="imgList.length && QrSrc && is_poster">
+				<wm-poster :Width="600" :imgSrc="imgList[0]" :QrSrc="QrSrc" :Title="goods_detail.title"
+					:PriceTxt="!showGoodsPrice ? '¥' + goods_detail.salePrice : ''"
+					:OriginalTxt="!showGoodsPrice ? '¥' + goods_detail.marketPrice : ''" @saveImage="saveImage"
+					@cancelImg="cancelImg"></wm-poster>
+			</view>
+		</u-popup>
+		<!-- 加载动画 -->
+
+		<!-- 加入购物车弹窗 -->
+		<!-- <AddCardModel :isList="false" :selAddress="now_sel_address" @buyNumchange="buyNumchange" @skuChange="skuChange"
+			@close="is_add_show = false" @change="closeaddcartPop" :skuId="skuId" :isShow="is_add_show"
+			:goodsId="goods_id" />
+		<setMealMore :goods_id="goods_id" :shopId="goods_detail.shopId" :isShow="is_setMeal_show"
+			@close="is_setMeal_show = false" /> -->
+	</view>
+</template>
+
+<script>
+	import wmPoster from '../components/wm-poster/wm-poster.vue';
+	import webUrl from '../../config.js';
+	import AddCardModel from '@/components/AddCardModel';
+	import setMealMore from '@/components/setMealMore';
+	export default {
+		components: {
+			wmPoster,
+			AddCardModel,
+			setMealMore
+		},
+		computed: {
+			cartNum() {
+				return this.$store.state.cartNum;
+			},
+			showGoodsPrice() {
+				if (this.$store.state.baseSet.goodsPrice === 5 && this.$common.isLogin()) {
+					return '';
+				} else if (!this.$common.isLogin() && this.$store.state.baseSet.goodsPrice === 4) {
+					return '请登录';
+				} else if (this.$store.state.userStatus.enableStatus === 4 && this.$store.state.baseSet.goodsPrice === 4) {
+					return '已禁用';
+				} else if (this.$store.state.userStatus.status !== 2 && this.$store.state.baseSet.goodsPrice === 4) {
+					if (this.$store.state.userStatus.status === 0) {
+						return '待审核';
+					} else if (this.$store.state.userStatus.status === 1) {
+						return '审核中';
+					} else if (this.$store.state.userStatus.status === 3) {
+						return '已驳回';
+					}
+				} else {
+					return '';
+				}
+			},
+			isLogin() {
+				return this.$store.state.hasLogin;
+			},
+			// 辅助单位价格
+			unitsalePrice() {
+				if (this.goods_detail.isEq === 5) {
+					if (this.eq_sku_kg.enabledLadder !== 1) {
+						return this.eq_sku_kg.salePrice;
+					} else {
+						const unitnum = this.buy_num * Number(this.now_sku_data.conversion);
+						const priceData = this.eq_sku_kg.ladderPrice.find(item => {
+							return unitnum > item.from && unitnum <= item.to;
+						});
+						return priceData ? priceData.price : 0;
+					}
+				} else {
+					return this.eq_sku_kg.salePrice;
+				}
+			}
+		},
+		data() {
+			return {
+				eq_sku_kg: {}, // 抄码商品kg
+				eq_sku_jian: {}, // 抄码商品辅助单位
+				//轮播图下标
+				currentSwiper: 0,
+				service_pop: false,
+				sharePop: false, // 分享弹窗
+				canvasPop: false, // 海报弹窗
+				now_sel_address: {},
+				is_not_express: true, // 当前选择区域是否能够配送
+				address_data: {}, // 客户地址数据
+				not_dispatch_areas: {}, // 该商品不能配送区域
+				is_add_show: false,
+				is_poster: false,
+				buy_num: 1,
+				discountList: [],
+				activity: [],
+				maskState: false,
+				indicatorDots: true, //是否显示面板指示点
+				autoplay: true, //是否自动切换
+				interval: 2000,
+				duration: 500,
+				goods_detail: {},
+				goods_id: '',
+				unit_list: [],
+				uni_index: 0,
+				specClass: 'none',
+				specSelected: [],
+				specList: [],
+				isCollect: false,
+				imgList: [],
+				phaseTime: {
+					second: 0,
+					day: 0
+				},
+				coupon_price: '', //领券活动价格
+				skuId: '', //商品的规格
+				source: 5,
+				QrSrc: '',
+				base_set_info: {},
+				spec_id_group: [],
+				now_sku_data: {},
+				startDeliveryPrice: 0,
+				isSalesNum: 4, // 起送价
+				pageName: '', // 启动页标示
+				is_setMeal_show: false, //组合套餐弹窗
+				combinedPackage: [],
+				total: 0,
+				shopId: ''
+			};
+		},
+		onShow() {
+			if (this.now_sel_address.provinceCode) {
+				this.address_data = this.now_sel_address;
+				if (this.not_dispatch_areas.areas) {
+					if (this.address_data.districtCode) {
+						this.is_not_express = this.not_dispatch_areas.areas.indexOf(parseInt(this.address_data
+							.districtCode)) === -1;
+					} else if (this.address_data.cityCode) {
+						this.is_not_express = this.not_dispatch_areas.citys.indexOf(parseInt(this.address_data
+							.cityCode)) === -1;
+					} else {
+						this.is_not_express = this.not_dispatch_areas.provinces.indexOf(parseInt(this.address_data
+							.provinceCode)) === -1;
+					}
+				}
+			}
+		},
+		onShareAppMessage() {
+			return {
+				title: this.goods_detail.title,
+				path: `/pagesT/product/product?id=${this.goods_id}&businessmanId=${this.$store.state.userStatus.id || ''}`,
+				imageUrl: this.imgList[0],
+				success: res => {
+					console.log(res);
+				}
+			};
+		},
+		// #ifdef MP-WEIXIN
+		// 分享到朋友圈
+		onShareTimeline(obj) {
+			console.log('分享到朋友圈::', obj);
+		},
+		// 收藏小程序
+		onAddToFavorites() {},
+		// #endif
+		watch: {
+			async '$store.state.locationObj'(val) {
+				if (JSON.stringify(val) === '{}') {
+					this.getAuthorizeInfo();
+					return;
+				}
+				await this.getGoodsDetail();
+				await this.getQrSrc();
+			},
+			isLogin() {
+				this.getGoodsDetail();
+			}
+		},
+		async onLoad(options) {
+			if (options.pageName) {
+				this.pageName = options.pageName;
+			}
+			// 起送价
+			this.startDeliveryPrice = this.$store.state.baseSet.startDeliveryPrice || 0;
+			// #ifdef MP-WEIXIN
+			// 小程序的原生菜单中显示分享按钮
+			uni.showShareMenu({
+				withShareTicket: false,
+				menus: ['shareAppMessage', 'shareTimeline']
+			});
+			//  获取小程序分销商参数
+			if (options.businessmanId) {
+				this.$store.commit('commit_businessmanId', options.businessmanId);
+				this.relationshipBusinessman(options.businessmanId);
+			}
+			// #endif
+			// 接收传值
+			if (options.id) {
+				this.goods_id = options.id;
+			} else {
+				// 扫码进入
+				const scene = decodeURIComponent(options.scene);
+				this.goods_id = scene;
+			}
+			if (options.skuId) {
+				this.skuId = parseInt(options.skuId);
+			}
+			// this.goods_id = 78;
+			this.spec_id_group[0] = this.goods_id;
+			this.base_set_info = this.$store.state.baseSet;
+			if (JSON.stringify(this.$store.state.locationObj) === '{}') {
+				this.getAuthorizeInfo();
+				return;
+			}
+			this.getGoodsDetail();
+
+			if (this.isLogin) {
+				this.address_data = this.$store.state.nowAddress;
+				if (this.address_data.provinceCode) {
+					if (this.not_dispatch_areas.areas) {
+						if (this.address_data.districtCode) {
+							this.is_not_express = this.not_dispatch_areas.areas.indexOf(parseInt(this.address_data
+								.districtCode)) === -1;
+						} else if (this.address_data.cityCode) {
+							this.is_not_express = this.not_dispatch_areas.citys.indexOf(parseInt(this.address_data
+								.cityCode)) === -1;
+						} else {
+							this.is_not_express = this.not_dispatch_areas.provinces.indexOf(parseInt(this.address_data
+								.provinceCode)) === -1;
+						}
+					}
+				} else {
+					await this.getAllShippingAddress();
+				}
+			}
+			await this.getQrSrc();
+		},
+		methods: {
+			openService() {
+				this.service_pop = true;
+			},
+			// 商品服务弹窗
+			cancelService() {
+				this.service_pop = false;
+			},
+			// 获取地址列表
+			getAllShippingAddress() {
+				this.$u.api
+					.getAllShippingAddress({
+						page: 1,
+						pageSize: 10
+					})
+					.then(({
+						data
+					}) => {
+						if (data.length) {
+							const address = data.find(item => item.defaultStatus === 5) || data[0];
+							this.address_data = {
+								provinceCode: address.provinceCode,
+								cityCode: address.cityCode,
+								districtCode: address.districtCode,
+								provinceName: address.area.provinceName,
+								cityName: address.area.cityName,
+								districtName: address.area.districtName
+							};
+							this.$store.commit('commit_nowAddress', this.address_data);
+							if (this.not_dispatch_areas.areas) {
+								if (this.address_data.districtCode) {
+									this.is_not_express = this.not_dispatch_areas.areas.indexOf(parseInt(this
+										.address_data.districtCode)) === -1;
+								} else if (this.address_data.cityCode) {
+									this.is_not_express = this.not_dispatch_areas.citys.indexOf(parseInt(this
+										.address_data.cityCode)) === -1;
+								} else {
+									this.is_not_express = this.not_dispatch_areas.provinces.indexOf(parseInt(this
+										.address_data.provinceCode)) === -1;
+								}
+							}
+						}
+					});
+			},
+			// 修改购买金额
+			buyNumchange(val) {
+				this.buy_num = val;
+			},
+			// 切换商品规格属性
+			skuChange(val) {
+				this.now_sku_data = val;
+				if (this.now_sku_data.activity && this.now_sku_data.activity.activityId) {
+					let nowData = parseInt(new Date().getTime() / 1000);
+					if (this.now_sku_data.activity.endTime && this.now_sku_data.activity.endTime - nowData > 0) {
+						let totalSecond = this.now_sku_data.activity.endTime - nowData;
+						this.phaseTime = {
+							second: totalSecond % 86400,
+							day: totalSecond <= 0 ? 0 : parseInt(totalSecond / 86400)
+						};
+					}
+				}
+			},
+			// 收藏商品
+			collectGoods() {
+				if (!this.isLogin) {
+					this.$api.msg('请登录');
+					return;
+				}
+				if (this.goods_detail.isCollect) {
+					this.goods_detail.isCollect = false;
+				} else {
+					this.goods_detail.isCollect = true;
+				}
+				this.$u.api.collectGoods(this.goods_id).then(res => {
+					if (!this.goods_detail.isCollect) {
+						this.$api.msg('已取消收藏');
+					} else {
+						this.$api.msg('已收藏');
+					}
+				});
+			},
+
+			getQrSrc() {
+				// #ifdef MP-TOUTIAO
+				let pathT = 'pagesT/product/product?id=' + this.goods_id;
+				pathT = encodeURIComponent(pathT);
+				this.$u.api
+					.byteCreateQRCode({
+						path: pathT,
+						params: this.goods_id,
+						appname: 'toutiao'
+					})
+					.then(data => {
+						this.QrSrc = data.data.indexOf('https') > -1 ? data.data : webUrl.QRC_SRC + data.data;
+					});
+				// #endif
+				// #ifdef MP-WEIXIN || H5
+				let pathS = 'pagesT/product/product';
+				this.$u.api
+					.createwxaqrcode({
+						path: pathS,
+						params: this.goods_id
+					})
+					.then(data => {
+						this.QrSrc = data.data.indexOf('https') > -1 ? data.data : webUrl.QRC_SRC + data.data;
+						console.log(this.QrSrc);
+					});
+				// #endif
+			},
+			handelImg(url) {
+				if (url.indexOf('?imageView2/2/w/750/h/750') > -1) {
+					return url.replace('?imageView2/2/w/750/h/750', '');
+				} else if (url.indexOf('?imageView2/2/w/750') > -1) {
+					return url.replace('?imageView2/2/w/750', '');
+				} else {
+					return url;
+				}
+			},
+			generatePoster() {
+				// this.is_poster = true;
+				// this.canvasPop = true;
+				// this.sharePop = false;
+				const pramas = {
+					id: this.goods_detail.id,
+					priceShop: '¥' + this.goods_detail.maxMarketPrice,
+					headImgs: this.goods_detail.images.map(item => this.handelImg(item)),
+					goodsImg: this.handelImg(this.goods_detail.images[0]),
+					goodsName: this.goods_detail.title,
+					goodsPrice: '¥' + this.goods_detail.minSalePrice,
+					mainLogo: '',
+					recommendCodeGoods: this.QrSrc,
+					share: {
+						shareContent: this.$store.state.baseSet.shop || '',
+						shareImg: this.handelImg(this.goods_detail.images[0]),
+						shareTitle: this.goods_detail.title,
+						shareUrl: this.handelImg(this.goods_detail.images[0])
+					}
+				};
+				uni.setStorageSync('posterData', pramas)
+				uni.navigateTo({
+					url: '/pagesT/product/goodsPoster'
+				});
+			},
+			saveImage() {
+				this.canvasPop = false;
+			},
+			cancelImg() {
+				this.is_poster = false;
+				this.canvasPop = false;
+			},
+			shareGoods() {
+				this.sharePop = true;
+			},
+			//App分享为微信小程序（App中分享一个内容到微信好友，对方微信中呈现的是一个小程序卡片）
+			shareFriend() {
+				const path = '/pagesT/product/product?id=' + this.goods_id;
+				uni.share({
+					provider: 'weixin',
+					scene: 'WXSceneSession',
+					type: 5,
+					imageUrl: this.imgList[0],
+					title: this.goods_detail.title,
+					miniProgram: {
+						id: 'gh_16db94f79967', //微信小程序原始ID
+						path: path,
+						type: 0,
+						webUrl: ''
+					},
+					success: ret => {
+						console.log(JSON.stringify(ret));
+					}
+				});
+			},
+			// 分享弹窗关闭
+			cancelPop() {
+				this.sharePop = false;
+			},
+			// 如果是阶梯价
+			ladderPriceChange() {
+				return this.now_sku_data.ladderPrice.find(ladder => (this.buy_num || 1) >= ladder.from && (this.buy_num ||
+					1) <= ladder.to).price;
+			},
+			// 请求商品品详情
+			async getGoodsDetail() {
+				let that = this
+				that.$u.api.getItemDetail({
+					id: that.goods_id
+				}).then(({
+					data
+				}) => {
+					console.log(data, 'itemdetail+++')
+					// 轮播图
+					that.goods_detail = data;
+					that.imgList = data.slider_image;
+				})
+				// this.$u.api
+				// 	.getGoodsDetail(this.goods_id)
+				// 	.then(({
+				// 		data
+				// 	}) => {
+				// 		uni.setNavigationBarTitle({
+				// 			title: data.title
+				// 		});
+				// 		this.imgList = data.images;
+				// 		data.specGroup = data.specGroup.map(item => {
+				// 			return {
+				// 				...item,
+				// 				params: item.params.map(itemP => {
+				// 					return {
+				// 						...itemP,
+				// 						isdisabled: true
+				// 					};
+				// 				})
+				// 			};
+				// 		});
+				// 		this.goods_detail = data;
+				// 		// 抄码商品获取 KG 数据
+				// 		if (data.isEq === 5) {
+				// 			this.eq_sku_kg = data.specMultiple.find(item => item.isMaster === 5);
+				// 			this.eq_sku_jian = data.specMultiple.find(item => item.isMaster === 4);
+				// 		}
+				// 		this.not_dispatch_areas = data.express.ruleData.not_dispatch_areas;
+				// 		if (this.skuId) {
+				// 			// 如果已有选中的skuId 根据ID匹配对应规格数据
+				// 			const specMultiple = data.specMultiple.find(item => item.id === parseInt(this.skuId));
+				// 			if (specMultiple.isSale !== 4) {
+				// 				this.now_sku_data = specMultiple;
+				// 			}
+				// 		} else if (data.specMultiple.length === 1 && data.specMultiple[0].isSale !== 4) {
+				// 			this.now_sku_data = data.specMultiple[0];
+				// 		} else {
+				// 			// 如果当前商品是非抄码商品 默认选中默认规格
+				// 			if (data.isEq === 4) {
+				// 				const specMultiple = data.specMultiple.find(item => item.isDefault === 5);
+				// 				if (specMultiple && specMultiple.isSale !== 4) {
+				// 					this.now_sku_data = specMultiple;
+				// 				}
+				// 			} else {
+				// 				// 抄码商品默认选中一个
+				// 				const specMultiple = data.specMultiple.find(item => item.isMaster === 4);
+				// 				if (specMultiple && specMultiple.isSale !== 4) {
+				// 					this.now_sku_data = specMultiple;
+				// 				}
+				// 			}
+				// 		}
+				// 		if (this.now_sku_data.activity && this.now_sku_data.activity.activityId) {
+				// 			let nowData = parseInt(new Date().getTime() / 1000);
+				// 			if (this.now_sku_data.activity.endTime && this.now_sku_data.activity.endTime -
+				// 				nowData > 0) {
+				// 				let totalSecond = this.now_sku_data.activity.endTime - nowData;
+				// 				this.phaseTime = {
+				// 					second: totalSecond % 86400,
+				// 					day: totalSecond <= 0 ? 0 : parseInt(totalSecond / 86400)
+				// 				};
+				// 			}
+				// 		}
+				// 		// 获取该商品的组合套餐
+				// 		if (this.isLogin) {
+				// 			this.listsApiComBinPackage();
+				// 		}
+				// 	})
+				// 	.catch(err => {
+				// 		setTimeout(() => {
+				// 			uni.navigateBack();
+				// 		}, 1500);
+				// 	});
+			},
+			//分享
+			share() {
+				this.$refs.share.toggleMask();
+			},
+			openaddcartPop(type) {
+				// if (!this.is_not_express) return;
+				// this.is_add_show = true;
+				// this.$u.api.calculation({
+					
+				// })
+				this.goPage('/pagesT/order/createOrderT?id=' + this.goods_detail.id)
+			},
+			// 关闭加入购物车弹窗
+			closeaddcartPop(obj) {
+				if (!obj.show) {
+					this.is_add_show = false;
+				}
+			},
+			previewImage(index) {
+				let urls = JSON.parse(JSON.stringify(this.imgList));
+				if (index > 0) {
+					urls.unshift(urls[index]);
+				}
+				uni.previewImage({
+					urls: urls,
+					longPressActions: {
+						itemList: ['发送给朋友', '保存图片', '收藏'],
+						success: data => {
+							console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
+						},
+						fail: err => {
+							console.log(err.errMsg);
+						}
+					}
+				});
+			},
+			//轮播图指示器
+			swiperChange(event) {
+				this.currentSwiper = event.detail.current;
+			},
+			back() {
+				if (this.pageName) {
+					this.goPage('/pages/index/index', 'switchTab');
+				} else {
+					uni.navigateBack();
+				}
+			},
+			// 获取该商品的组合套餐
+			listsApiComBinPackage() {
+				if (!this.goods_detail.shopId) return;
+				this.$u.api
+					.listsApiComBinPackage({
+						page: 1,
+						pageSize: 10,
+						shopId: this.goods_detail.shopId,
+						goodsId: this.goods_id
+					})
+					.then(({
+						data
+					}) => {
+						this.shopId = this.goods_detail.shopId;
+						this.combinedPackage = data;
+						this.total = data.length;
+					});
+			},
+			// #ifdef MP
+			// 添加分销上下级关系 source: 1:首次点击链接 2:首次下单 3:首次付款'
+			async relationshipBusinessman(businessmanId) {
+				console.log('上级ID', businessmanId);
+				if (!this.$store.state.hasLogin) {
+					// 没有登录不请求接口
+					return;
+				}
+				await this.$u.api.relationshipBusinessman({
+					businessmanId: businessmanId,
+					source: 1
+				});
+
+				console.log('上下:', data.data);
+			}
+			// #endif
+		}
+	};
+</script>
+
+<style lang="scss">
+	@keyframes showPopup {
+		0% {
+			opacity: 0;
+		}
+
+		100% {
+			opacity: 1;
+		}
+	}
+
+	@keyframes hidePopup {
+		0% {
+			opacity: 1;
+		}
+
+		100% {
+			opacity: 0;
+		}
+	}
+
+	@keyframes showLayer {
+		0% {
+			transform: translateY(0);
+		}
+
+		100% {
+			transform: translateY(-100%);
+		}
+	}
+
+	@keyframes hideLayer {
+		0% {
+			transform: translateY(-100%);
+		}
+
+		100% {
+			transform: translateY(0);
+		}
+	}
+
+	.icon {
+		font-size: 26upx;
+	}
+
+	.back-icon {
+		font-size: 36rpx;
+		padding-left: 24rpx;
+		color: #2a2a2a;
+	}
+
+	.swiper-box {
+		background-color: #ffffff;
+		position: relative;
+		width: 100%;
+		height: 100vw;
+
+		swiper {
+			width: 100%;
+			height: 100vw;
+
+			swiper-item {
+				image {
+					width: 100%;
+					height: 100vw;
+					background-color: #f5f5f5;
+				}
+			}
+		}
+
+		.indicator {
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			padding: 0 25upx;
+			height: 40upx;
+			border-radius: 4upx;
+			font-size: 22upx;
+			position: absolute;
+			bottom: 50upx;
+			right: 30upx;
+			color: #fff;
+			background-color: rgba(0, 0, 0, 0.2);
+		}
+	}
+
+	.goods-info {
+		overflow: hidden;
+		transform: translateY(-36rpx);
+
+		.seckill-view {
+			padding: 0 20upx;
+			height: 80upx;
+			line-height: 80upx;
+			background: linear-gradient(to right, #ff3859, #ff2d2e);
+			color: #ffffff;
+
+			.ibonxianshimiaosha {
+				font-size: 36rpx;
+			}
+		}
+
+		.price-view {
+			padding: 0 30rpx;
+			height: 152rpx;
+			background-color: #fa6400;
+			color: #ffffff;
+			border-radius: 48rpx 48rpx 0 0;
+			position: relative;
+
+			.price-out {
+				position: absolute;
+				top: 50%;
+				transform: translateY(calc(-50% - 16rpx));
+				font-size: 48rpx;
+				font-family: DIN-Medium;
+
+				.rmb-ic {
+					font-size: 24rpx;
+				}
+
+				.market-price {
+					text-decoration: line-through;
+					font-size: 24upx;
+					color: #ffffff;
+					opacity: 0.6;
+					font-weight: 400;
+				}
+
+				.vip-price {
+					display: inline-block;
+					margin-left: 20rpx;
+					line-height: 32rpx;
+					height: 32rpx;
+					border-radius: 4rpx;
+					overflow: hidden;
+					font-family: DINPro-Regular;
+
+					.price-text {
+						float: left;
+						min-width: 80rpx;
+						text-align: center;
+						vertical-align: middle;
+						font-size: 20rpx;
+						color: #ffdfa2;
+						background: linear-gradient(270deg, #1e5657 0%, #0d2b2c 100%);
+						padding: 0 8rpx;
+					}
+
+					.price-bs {
+						text-align: center;
+						float: left;
+						vertical-align: middle;
+						width: 32rpx;
+						background-color: #ffdfa2;
+						font-size: 20rpx;
+						color: #2c7564;
+					}
+				}
+			}
+
+			.right-view {
+				position: absolute;
+				right: 30rpx;
+				top: calc(50% - 16rpx);
+				transform: translateY(-50%);
+				font-size: 24rpx;
+
+				.goods-num {
+					text-align: right;
+
+					.num-li {
+						display: inline-block;
+						font-weight: 400;
+						margin-left: 20rpx;
+					}
+				}
+			}
+		}
+
+		.active-view {
+			padding: 0;
+			overflow: hidden;
+
+			// 限时秒杀样式
+			.active-left {
+				padding-left: 30rpx;
+				width: 270rpx;
+				line-height: normal;
+				padding-top: 20rpx;
+
+				.goods-num {
+					height: 28rpx;
+					line-height: 28rpx;
+					display: flex;
+
+					.num-li {
+						font-weight: 400;
+						margin-right: 20rpx;
+						font-size: 20rpx;
+					}
+				}
+
+				.market-price {
+					text-decoration: line-through;
+					font-size: 24upx;
+					color: #ffffff;
+					opacity: 0.6;
+					font-weight: 400;
+				}
+			}
+
+			.active-right {
+				padding-right: 30rpx;
+				width: 480rpx;
+				background-color: #e02020;
+				height: 150rpx;
+				padding-left: 28rpx;
+				padding-top: 20rpx;
+
+				.ac-r-left {
+					.active-ic {
+						height: 32rpx;
+						line-height: 32rpx;
+						font-size: 32rpx;
+						font-weight: bold;
+
+						.ibonshijian {
+							font-size: 32rpx;
+							font-weight: normal;
+							margin-right: 6rpx;
+						}
+					}
+
+					.active-desc {
+						height: 32rpx;
+						line-height: 32rpx;
+						font-size: 24rpx;
+						margin-top: 15rpx;
+					}
+				}
+
+				.ac-r-right {
+					text-align: center;
+
+					.time-title {
+						font-size: 24rpx;
+						margin-bottom: 8rpx;
+					}
+
+					.count-down {
+						font-family: DIN-Medium;
+
+						.day-num {
+							height: 40rpx;
+							padding: 0 4rpx;
+							display: inline-block;
+							background-color: #000000;
+							color: #ffffff;
+							border-radius: 6rpx;
+							text-align: center;
+							line-height: 40rpx;
+							font-size: 28rpx;
+						}
+
+						.day-text {
+							display: inline-block;
+							line-height: 40rpx;
+							color: #ffffff;
+							font-size: 24rpx;
+							margin: 0 8rpx;
+						}
+					}
+				}
+			}
+		}
+
+		.goods-info-main {
+			transform: translateY(-32rpx);
+			padding: 30rpx;
+			background: #ffffff;
+			border-radius: 32rpx 32rpx 8rpx 8rpx;
+
+			.lap-info {
+				display: flex;
+				font-size: 24upx;
+
+				.lap-li {
+					text-align: center;
+					flex: 3;
+					padding: 0 20upx;
+
+					.laprice-text {
+						font-size: 28upx;
+						font-weight: 600;
+						color: #ff4d01;
+					}
+
+					.laprice-goods-num {
+						color: #333333;
+					}
+				}
+			}
+
+			.top-title {
+				.title {
+					width: 594rpx;
+					font-size: 32rpx;
+					letter-spacing: 1px;
+					color: #2a2a2a;
+					font-weight: 500;
+
+					.goods-brand {
+						letter-spacing: 0;
+						font-weight: 400;
+						padding: 0 16upx;
+						height: 40rpx;
+						line-height: 40rpx;
+						border-radius: 40rpx;
+						font-size: 24rpx;
+						font-weight: 500;
+						display: inline-block;
+						color: #ffffff;
+						margin-right: 16rpx;
+					}
+				}
+
+				.collection-btn {
+					text-align: center;
+					font-size: 20rpx;
+
+					.ibonfont {
+						font-size: 40rpx;
+					}
+				}
+			}
+
+			.describe {
+				font-size: 28rpx;
+				color: #9a9a9a;
+				padding-top: 20rpx;
+				font-weight: 500;
+				color: #e02020;
+			}
+
+			.active-box {
+				margin-top: 40rpx;
+
+				.row {
+					width: 100%;
+					display: flex;
+					align-items: center;
+					position: relative;
+
+					.text {
+						font-size: 28upx;
+						color: #9a9a9a;
+						margin-right: 40upx;
+					}
+
+					.content {
+						.ac-li {
+							margin-bottom: 10upx;
+
+							.ac-label {
+								background-color: #fa6400;
+								padding: 0 16upx;
+								height: 40rpx;
+								line-height: 40rpx;
+								border-radius: 40rpx;
+								font-size: 20rpx;
+								font-weight: 500;
+								display: inline-block;
+								color: #ffffff;
+								margin-right: 16rpx;
+							}
+
+							.ac-activityTitle {
+								display: inline-block;
+								font-size: 24upx;
+							}
+
+							.ac-value {
+								font-size: 24upx;
+								padding-top: 10rpx;
+
+								.ac-p {
+									color: $price-color;
+								}
+							}
+						}
+					}
+				}
+			}
+		}
+	}
+
+	.info-box {
+		padding: 16rpx 30upx;
+		background-color: #fff;
+		border-radius: 12upx;
+		transform: translateY(-48rpx);
+		margin-top: 16rpx;
+
+		.row {
+			width: 100%;
+			display: flex;
+			align-items: center;
+			position: relative;
+			line-height: 80rpx;
+
+			.text {
+				font-size: 28upx;
+				color: #9a9a9a;
+				margin-right: 40upx;
+			}
+
+			.content {
+				.conversion {
+					display: inline-block;
+					margin-right: 10rpx;
+				}
+
+				.no-sel {
+					color: #9a9a9a;
+				}
+
+				.service-li {
+					display: inline-block;
+					font-size: 22rpx;
+					color: #6c6c6c;
+					margin-left: 20rpx;
+					-webkit-line-clamp: 1;
+
+					.service-icon {
+						font-size: 28rpx;
+						margin-right: 12rpx;
+					}
+
+					.icon {
+						width: 28rpx;
+						height: 28rpx;
+						border-radius: 4rpx;
+						margin-right: 12rpx;
+					}
+				}
+			}
+
+			.arrow {
+				position: absolute;
+				right: 0;
+
+				.icon {
+					color: #afafaf;
+				}
+			}
+		}
+	}
+
+	.group-ul {
+		.group-li {
+			background-color: #ffffff;
+			border-radius: 12rpx;
+			margin-bottom: 20rpx;
+
+			.float_left {
+				.left-scroll {
+					width: 430rpx;
+					white-space: nowrap;
+
+					.goods-li {
+						display: inline-block;
+						vertical-align: middle;
+						margin-right: 5px;
+
+						image {
+							display: block;
+							width: 150rpx;
+							height: 150rpx;
+							border-radius: 10rpx;
+							margin: 0 auto;
+						}
+
+						text-align: center;
+
+						.goods-name {
+							width: 150rpx;
+							height: 36rpx;
+							line-height: 36rpx;
+							margin-top: 10rpx;
+							font-size: 24rpx;
+							-webkit-line-clamp: 1;
+						}
+					}
+
+					.plus-icon {
+						vertical-align: middle;
+						display: inline-block;
+						line-height: 150rpx;
+						padding: 0 10rpx;
+						height: 200rpx;
+					}
+				}
+			}
+
+			.dy-icon {
+				padding: 0 10rpx;
+				line-height: 150rpx;
+				padding: 0 10rpx;
+				height: 200rpx;
+				color: #cecece;
+
+				.ibonicon {
+					font-size: 26rpx;
+				}
+			}
+
+			.price-right {
+				color: #666666;
+				font-size: 24rpx;
+				text-align: center;
+				width: 190rpx;
+
+				.group-price {
+					font-family: DIN-Medium;
+
+					.primary-color {
+						font-weight: 700;
+						font-size: 28rpx;
+					}
+				}
+
+				.save-price {
+					font-family: DIN-Medium;
+					padding: 10rpx 0;
+				}
+
+				.buy-btn {
+					line-height: 56rpx;
+					height: 56rpx;
+					border-radius: 8rpx;
+					text-align: center;
+					color: #ffffff;
+					width: 150rpx;
+					margin: 10rpx auto 0;
+				}
+			}
+		}
+	}
+
+	.setMeal_more {
+		color: #999;
+		text-align: center;
+		font-size: 24rpx;
+	}
+
+	.description {
+		padding-bottom: 100upx;
+
+		.title {
+			width: 100%;
+			height: 80upx;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			font-size: 26upx;
+			color: #999;
+		}
+	}
+
+	.footer {
+		position: fixed;
+		bottom: 0upx;
+		width: 100%;
+		padding: 12upx 30rpx;
+		background-color: #ffffff;
+		z-index: 2;
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		box-shadow: 0px -3rpx 32rpx 0px rgba(156, 170, 175, 0.16);
+
+		.icons {
+			height: 74upx;
+
+			.box {
+				height: 64upx;
+				margin-left: 32rpx;
+				display: inline-block;
+				text-align: center;
+				position: relative;
+
+				.icon {
+					font-size: 36upx;
+					color: #000000;
+				}
+
+				.text {
+					display: flex;
+					justify-content: center;
+					width: 100%;
+					font-size: 20upx;
+					color: #3c3c3c;
+					padding-top: 5rpx;
+				}
+
+				&:first-child {
+					margin-left: 10rpx;
+					padding-right: 24rpx;
+					position: relative;
+
+					&::after {
+						position: absolute;
+						top: 10rpx;
+						right: 0;
+						content: ' ';
+						display: inline-block;
+						width: 1px;
+						height: 48rpx;
+						background: #d8d8d8;
+						border-radius: 2rpx;
+					}
+				}
+			}
+		}
+
+		.btn {
+			overflow: hidden;
+
+			.buy {
+				border-radius: 8upx;
+				height: 74upx;
+				width: 385rpx;
+				color: #ffffff;
+				display: inline-block;
+				line-height: 74upx;
+				text-align: center;
+				font-size: 28upx;
+				&:first-child {
+					margin-right: 10rpx;
+				}
+			}
+		}
+	}
+
+	.popup {
+		position: fixed;
+		top: 0;
+		width: 100%;
+		height: 100%;
+		z-index: 20;
+		display: none;
+
+		.mask {
+			position: fixed;
+			top: 0;
+			width: 100%;
+			height: 100%;
+			z-index: 21;
+			background-color: rgba(0, 0, 0, 0.6);
+		}
+
+		.layer {
+			position: fixed;
+			z-index: 22;
+			bottom: -70%;
+			width: 100%;
+			padding: 0 4%;
+			height: 70%;
+			border-radius: 20upx 20upx 0 0;
+			background-color: #fff;
+			display: flex;
+			flex-wrap: wrap;
+			align-content: space-between;
+
+			.content {
+				width: 100%;
+				padding: 20upx 0;
+			}
+
+			.btn {
+				width: 100%;
+				height: 100upx;
+
+				.button {
+					width: 100%;
+					height: 80upx;
+					border-radius: 40upx;
+					color: #fff;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					background-color: #f47952;
+					font-size: 28upx;
+				}
+			}
+		}
+
+		&.show {
+			display: block;
+
+			.mask {
+				animation: showPopup 0.2s linear both;
+			}
+
+			.layer {
+				animation: showLayer 0.2s linear both;
+			}
+		}
+
+		&.hide {
+			display: block;
+
+			.mask {
+				animation: hidePopup 0.2s linear both;
+			}
+
+			.layer {
+				animation: hideLayer 0.2s linear both;
+			}
+		}
+
+		&.none {
+			display: none;
+		}
+
+		&.service {
+			.row {
+				margin: 30upx 0;
+
+				.title {
+					font-size: 30upx;
+					margin: 10upx 0;
+				}
+
+				.description {
+					font-size: 28upx;
+					color: #999;
+				}
+			}
+		}
+
+		&.spec {
+			.title {
+				font-size: 30upx;
+				margin: 30upx 0;
+			}
+
+			.sp {
+				display: flex;
+
+				view {
+					font-size: 28upx;
+					padding: 5upx 20upx;
+					border-radius: 8upx;
+					margin: 0 30upx 20upx 0;
+					background-color: #f6f6f6;
+
+					&.on {
+						padding: 3upx 18upx;
+						border: solid 1upx #f47925;
+					}
+				}
+			}
+
+			.length {
+				margin-top: 30upx;
+				border-top: solid 1upx #aaa;
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				padding-top: 20upx;
+
+				.text {
+					font-size: 30upx;
+				}
+
+				.number {
+					display: flex;
+					justify-content: center;
+					align-items: center;
+
+					.input {
+						width: 80upx;
+						height: 60upx;
+						margin: 0 10upx;
+						background-color: #f3f3f3;
+						display: flex;
+						justify-content: center;
+						align-items: center;
+						text-align: center;
+
+						input {
+							width: 80upx;
+							height: 60upx;
+							display: flex;
+							justify-content: center;
+							align-items: center;
+							text-align: center;
+							font-size: 26upx;
+						}
+					}
+
+					.sub,
+					.add {
+						width: 60upx;
+						height: 60upx;
+						background-color: #f3f3f3;
+						border-radius: 5upx;
+
+						.icon {
+							font-size: 30upx;
+							width: 60upx;
+							height: 60upx;
+							display: flex;
+							justify-content: center;
+							align-items: center;
+						}
+					}
+				}
+			}
+		}
+	}
+
+	.share {
+		display: none;
+
+		&.show {
+			display: block;
+
+			.mask {
+				animation: showPopup 0.15s linear both;
+			}
+
+			.layer {
+				animation: showLayer 0.15s linear both;
+			}
+		}
+
+		&.hide {
+			display: block;
+
+			.mask {
+				animation: hidePopup 0.15s linear both;
+			}
+
+			.layer {
+				animation: hideLayer 0.15s linear both;
+			}
+		}
+
+		&.none {
+			display: none;
+		}
+
+		.mask {
+			background-color: rgba(0, 0, 0, 0.5);
+			position: fixed;
+			width: 100%;
+			height: 100%;
+			top: 0;
+			z-index: 11;
+		}
+
+		.layer {
+			width: 92%;
+			position: fixed;
+			z-index: 12;
+			padding: 0 4%;
+			top: 100%;
+			background-color: rgba(255, 255, 255, 0.9);
+
+			.list {
+				width: 100%;
+				display: flex;
+				padding: 10upx 0 30upx 0;
+
+				.box {
+					width: 25%;
+					display: flex;
+					justify-content: center;
+					flex-wrap: wrap;
+
+					image {
+						width: 13.8vw;
+						height: 13.8vw;
+					}
+
+					.title {
+						margin-top: 10upx;
+						display: flex;
+						justify-content: center;
+						width: 100%;
+						font-size: 26upx;
+					}
+				}
+			}
+
+			.btn {
+				width: 100%;
+				height: 100upx;
+				display: flex;
+				justify-content: center;
+				align-items: center;
+				font-size: 28upx;
+				border-top: solid 1upx #666666;
+			}
+
+			.h1 {
+				width: 100%;
+				height: 80upx;
+				display: flex;
+				justify-content: center;
+				align-items: center;
+				font-size: 34upx;
+			}
+		}
+	}
+
+	.coupon-box {
+		.row {
+			.content {
+				.coupon-li {
+					display: inline-block;
+					width: 120upx;
+					background-color: $price-color;
+					color: #ffffff;
+					line-height: 30upx;
+					font-size: 18upx;
+					text-align: center;
+				}
+			}
+		}
+	}
+
+	.share-tit {
+		line-height: 80upx;
+		text-align: center;
+		font-size: 32upx;
+	}
+
+	.share-cancel {
+		line-height: 80upx;
+		text-align: center;
+		font-size: 28upx;
+		border-top: 1px solid #f4f4f4;
+	}
+
+	.share-ul {
+		display: flex;
+		padding: 50upx 0;
+
+		.share-li {
+			flex: 3;
+
+			.share-btn {
+				background-color: #ffffff;
+				font-size: 26upx;
+
+				&::after {
+					border: 0 none;
+				}
+
+				.icon-view {
+					display: inline-block;
+					width: 100upx;
+					height: 100upx;
+					border-radius: 100%;
+					background-color: #18b566;
+					line-height: 100upx;
+					text-align: center;
+					margin-bottom: 10upx;
+				}
+			}
+		}
+	}
+
+	.poster-view {
+		// width: 600upx;
+		// margin: 0 auto;
+	}
+
+	.service-box {
+		.content {
+			width: 560rpx;
+			-webkit-line-clamp: 1;
+
+			.service-li {
+				display: inline-block;
+				color: #666666;
+				font-size: 24rpx;
+				margin-right: 30rpx;
+
+				.icon {
+					width: 50rpx;
+					height: 50rpx;
+					border-radius: 4rpx;
+				}
+
+				.ibonfont {
+					margin-right: 10rpx;
+					font-size: 24rpx;
+					color: $uni-color-primary;
+				}
+			}
+		}
+	}
+
+	.service-pop {
+		.title {
+			line-height: 100rpx;
+			height: 100rpx;
+			font-size: 32rpx;
+			text-align: center;
+			color: #222;
+		}
+
+		.service-ul {
+			padding: 0 30rpx;
+			max-height: 430rpx;
+			overflow-y: auto;
+			width: 100%;
+
+			.service-li {
+				font-size: 28rpx;
+				padding: 24rpx 0;
+
+				.icon {
+					width: 32rpx;
+					height: 32rpx;
+					border-radius: 4rpx;
+					margin-right: 20rpx;
+				}
+
+				.ibonfont {
+					font-size: 32rpx;
+					color: $uni-color-primary;
+					margin-right: 20rpx;
+				}
+
+				.desc {
+					padding-left: 54rpx;
+					padding-top: 10rpx;
+					font-size: 24rpx;
+					color: #999999;
+				}
+			}
+		}
+
+		.confirm-btn {
+			height: 80rpx;
+			line-height: 80rpx;
+			text-align: center;
+			color: #ffffff;
+			background-color: $uni-color-primary;
+			margin-top: 30rpx;
+		}
+	}
+</style>

pagesT/unit/official.vue

@@ -1,19 +1,19 @@
 <template>
 	<view class="content">
 		<view class="gq-list">
-			<view class="gq-item" v-for="item in 11" @click="gotoDetail(item)">
+			<view class="gq-item" v-for="item in list" @click="gotoDetail(item)">
 				<view class="gq-logo">
-					<image src="" mode="" class=""></image>
+					<image :src="item.avatar" mode="" class=""></image>
 				</view>
 				<view class="store-name ellipsis">
-					君海蓝
+					{{item.staffName}}
 				</view>
 				<view class="info">
 					<view class="info-tit">
 						职务：
 					</view>
 					<view class="info-val">
-						创始人
+						{{item.departmentName}}
 					</view>
 				</view>
 				<view class="info">
@@ -21,20 +21,21 @@
 						工号：
 					</view>
 					<view class="info-val">
-						创始人
+						{{item.staffCode}}
 					</view>
 				</view>
-				<view class="info">
+				<!-- <view class="info">
 					<view class="info-tit">
 						业务：
 					</view>
 					<view class="info-val">
 						创始人
 					</view>
-				</view>
-				
+				</view> -->
+
 			</view>
 		</view>
+		<u-loadmore :status="loadingType" />
 	</view>
 </template>
 
@@ -42,33 +43,41 @@
 	export default {
 		data() {
 			return {
-type: ''
+				type: '',
+				list: [],
+				loadingType: 'loadmore',
+				page: 1,
+				limit: 12,
+				typename: ''
 			}
 		},
 		onLoad(opt) {
-			if(opt.type) {
+			if (opt.type) {
 				this.type = opt.type
-				if(this.type == 1) {
+				if (this.type == 1) {
 					uni.setNavigationBarTitle({
 						title: '高管'
 					})
-				}else if(this.type == 2) {
+					this.typename = 'getAllygList'
+				} else if (this.type == 2) {
 					uni.setNavigationBarTitle({
 						title: '员工'
 					})
-				}else if(this.type == 3){
-					
+					this.typename = 'getAllygList'
+				} else if (this.type == 3) {
 					uni.setNavigationBarTitle({
 						title: '共享股东商家'
 					})
+					this.typename = 'getAllygList'
 				}
+				this.getList()
 			}
 		},
 		onShow() {
 
 		},
 		onReachBottom() {
-
+			this.getList()
 		},
 		onReady() {
 
@@ -81,9 +90,30 @@ type: ''
 			},
 			gotoDetail() {
 				// 员工详情
-				if(this.type == 2) {
+				if (this.type == 2) {
 					this.navto('/pagesT/unit/ygdetail')
 				}
+
+			},
+			getList() {
+				let that = this
+				if (that.loadingType == 'nomore' || that.loadingType == 'loading') {
+					return
+				}
+				that.loadingType = 'loading'
+				this.$u.api[that.typename]({
+					page: that.page,
+					pagesize: that.limit
+				}).then(res => {
+					console.log(res)
+					that.list = that.list.concat(res.data)
+					that.page++
+					if (res.data.length == that.limit) {
+						that.loadingType = 'loadmore'
+					} else {
+						that.loadingType = 'nomore'
+					}
+				})
 			}
 		}
 	}
@@ -119,6 +149,7 @@ type: ''
 			display: flex;
 			justify-content: center;
 			align-items: center;
+
 			image {
 				width: 135rpx;
 				height: 135rpx;
@@ -136,14 +167,17 @@ type: ''
 			color: #262261;
 			overflow: hidden;
 		}
+
 		.info {
 			width: 100%;
 			display: flex;
 			padding: 5rpx 0;
+
 			.info-tit {
 				font-size: 18rpx;
 				flex-shrink: 0;
 			}
+
 			.info-val {
 				text-align: center;
 				font-size: 20rpx;
@@ -151,6 +185,6 @@ type: ''
 				border-bottom: 1px #C7C7C7 solid;
 			}
 		}
-		
+
 	}
 </style>