新提交

.gitignore

@@ -0,0 +1,23 @@
+.DS_Store
+node_modules/
+unpackage/
+dist/
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Editor directories and files
+.project
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw*

App.vue

@@ -0,0 +1,572 @@
+<script>
+	import Vue from 'vue';
+
+	export default {
+		onLaunch: function(options) {
+			uni.removeStorageSync("token")
+			uni.removeStorageSync("websitData")
+			uni.removeStorageSync("websitIdSj")
+			let that = this;
+			console.log(options);
+			// 小程序更新
+			const updateManager = uni.getUpdateManager();
+			// 请求完新版本信息
+			updateManager.onCheckForUpdate(function(res) {
+				// console.log(res.hasUpdate);
+			});
+			// 新的版本已经下载好
+			updateManager.onUpdateReady(function(res) {
+				uni.showModal({
+					title: '更新提示',
+					content: '新版本已经准备好，是否重启应用？',
+					success(res) {
+						if (res.confirm) {
+							// 调用 applyUpdate 应用新版本并重启
+							updateManager.applyUpdate();
+						}
+					},
+				});
+			});
+			// 新的版本下载失败
+			updateManager.onUpdateFailed(function(res) {
+				that.$toast('更新失败！');
+			});
+
+			uni.getSystemInfo({
+				success: function(e) {
+					console.log(e);
+					Vue.prototype.StatusBar = e.statusBarHeight;
+					let custom = wx.getMenuButtonBoundingClientRect();
+					Vue.prototype.Custom = custom;
+					Vue.prototype.CustomBar =
+						custom.bottom + custom.top - e.statusBarHeight + 4;
+					//用来判断是否iphoneX类型的全面屏设备
+					if (e.model.indexOf('iPhone X') == 0) {
+						Vue.prototype.isIphoneX = 68;
+					} else {
+						Vue.prototype.isIphoneX = 0;
+					}
+
+					if (e.environment == 'wxwork') {
+						uni.setStorageSync('is_qywx', true);
+					} else {
+						uni.setStorageSync('is_qywx', false);
+					}
+				},
+			});
+
+			// 企业微信端
+			if (uni.getStorageSync('is_qywx') == true) {
+				wx.qy.login({
+					success: function(loginRes) {
+						if (loginRes.code) {
+							//发起网络请求
+							that
+								.$axios({
+									url: '/user/auth',
+									params: {
+										code: loginRes.code,
+										work: true,
+									},
+								})
+								.then((authRes) => {
+									// console.log(authRes);
+									that.$store.commit('changeUserId', authRes.data.userId);
+									that.$store.commit('changeUserInfo', authRes.data);
+									uni.setStorageSync('userInfo', authRes.data);
+									uni.setStorageSync('userId', authRes.data.userId);
+									uni.setStorageSync('token', authRes.data.token);
+									that.$isResolve();
+									this.userWebsit(authRes.data)
+								});
+						} else {
+							console.log('登录失败！' + loginRes.errMsg);
+						}
+					},
+				});
+			}
+
+			// 微信端
+			else {
+				uni.login({
+					provider: 'weixin',
+					success: (loginRes) => {
+						console.log(loginRes);
+						console.log('是否从企业微信端进入：' + uni.getStorageSync('is_qywx'));
+						that
+							.$axios({
+								url: '/user/auth',
+								params: {
+									code: loginRes.code,
+									work: uni.getStorageSync('is_qywx'),
+								},
+							})
+							.then((res) => {
+								try {
+									console.log(res);
+									that.$store.commit('changeUserId', res.data.userId);
+									that.$store.commit('changeUserInfo', res.data);
+									uni.setStorageSync('userInfo', res.data);
+									uni.setStorageSync('userId', res.data.userId);
+									uni.setStorageSync('token', res.data.token);
+									that.$isResolve();
+									this.userWebsit(res.data)
+								} catch (e) {
+									console.error(e);
+								}
+							});
+					},
+				});
+			}
+		},
+		onShow: function() {
+			console.log('App Show');
+		},
+		onHide: function() {
+			console.log('App Hide');
+		},
+		methods: {
+			userWebsit(userInfo) {
+				this.$axios({
+					url: '/user/user/detail',
+					method: 'get',
+					params: {
+						userId: userInfo.userId
+					}
+				}).then(resData => {
+					this.$store.commit('changeUserInfo', resData?.data);
+					uni.setStorageSync('userInfo', resData?.data);
+					if(resData?.data?.adminWebsit?.websitId){
+						this.$store.commit('changeWebsitObj', resData?.data?.adminWebsit);
+						uni.setStorageSync('websitData', resData?.data?.adminWebsit);
+						uni.setStorageSync("websitIdSj", resData?.data?.adminWebsit?.websitId);
+					}else{
+						uni.getLocation({
+							type: 'gcj02',
+							success: res => {
+								this.$axios({
+									url: '/user/userWebsit',
+									method: 'post',
+									params: {
+										lat: res.latitude,
+										lng: res.longitude,
+									},
+								}).then((res) => {
+									if(res?.data){
+										this.$store.commit('changeWebsitObj', res?.data);
+										uni.setStorageSync('websitData', res?.data);
+										uni.setStorageSync("websitIdSj", res?.data.websitId)
+									}else{
+										uni.reLaunch({
+											url: "/pages/mywebsit/index"
+										})
+									}
+								});
+							},
+							fail: err => {
+								uni.getSetting({
+									success: (res) => {
+										if (!res.authSetting['scope.userLocation']) {
+											uni.showModal({
+												title: '是否授权当前位置',
+												content: '需要获取您的地理位置，请确认授权，否则地图功能将无法使用',
+												success: (tip) => {
+													if (tip.confirm) {
+														uni.openSetting({
+															success: (data) => {
+																if (data
+																	.authSetting[
+																		"scope.userLocation"
+																	] === true) {
+																	this.$successToast(
+																		'授权成功');
+																	setTimeout(
+																		this
+																		.userWebsit,
+																		1000
+																	)
+																}
+															}
+														})
+													}
+												}
+											})
+										}
+									}
+								})
+							}
+						})
+					}
+				})
+			}
+		}
+	};
+</script>
+
+<style>
+	@import './static/style/utils';
+</style>
+<style lang="scss">
+	@import '@/uni_modules/uview-ui/index.scss';
+
+	/*每个页面公共css */
+
+	.clearfix:after {
+		content: '';
+		display: block;
+		height: 0;
+		clear: both;
+		visibility: hidden;
+	}
+
+	.ellipsis {
+		overflow: hidden;
+		white-space: nowrap;
+		text-overflow: ellipsis;
+	}
+
+	.ellipsis-2 {
+		display: -webkit-box;
+		overflow: hidden;
+		white-space: normal !important;
+		text-overflow: ellipsis;
+		word-wrap: break-word;
+		-webkit-line-clamp: 2;
+		-webkit-box-orient: vertical;
+	}
+
+	.ellipsis-3 {
+		display: -webkit-box;
+		overflow: hidden;
+		white-space: normal !important;
+		text-overflow: ellipsis;
+		word-wrap: break-word;
+		-webkit-line-clamp: 3;
+		-webkit-box-orient: vertical;
+	}
+
+	.app-container {
+		min-height: 100vh;
+		font-size: 28rpx;
+		color: #333333;
+		font-family: 'Microsoft YaHei';
+	}
+
+	.bt-container {
+		height: 100rpx;
+
+		.container {
+			position: fixed;
+			bottom: 0;
+			left: 0;
+			z-index: 99;
+			width: 100%;
+			padding: 10rpx 30rpx;
+			background: #ffffff;
+
+			button {
+				width: 690rpx;
+				height: 80rpx;
+				margin: 0;
+				background: #6da7ff;
+				border-radius: 80rpx;
+				color: #ffffff;
+				line-height: 80rpx;
+				font-size: 30rpx;
+			}
+		}
+	}
+
+	.global-mask {
+		position: fixed;
+		top: 0;
+		left: 0;
+		z-index: 998;
+		width: 100%;
+		height: 100%;
+		background: rgba($color: #000000, $alpha: 0.3);
+	}
+
+	.global-dialog {
+		position: fixed;
+		top: calc(50vh - 150rpx);
+		left: 60rpx;
+		z-index: 999;
+		width: 630rpx;
+		background: #ffffff;
+		border-radius: 15rpx;
+		overflow: hidden;
+
+		.title {
+			font-size: 36rpx;
+			font-weight: 500;
+			text-align: center;
+			line-height: 100rpx;
+			padding-bottom: 10rpx;
+		}
+
+		.content {
+			.text {
+				font-size: 32rpx;
+				text-align: center;
+				padding-bottom: 40rpx;
+			}
+
+			.form {
+				padding: 0 40rpx;
+
+				.item {
+					display: flex;
+					align-items: center;
+					justify-content: space-between;
+					margin-bottom: 40rpx;
+
+					input {
+						width: 340rpx;
+						height: 60rpx;
+						border: 1px solid #eaeaea;
+						border-radius: 10rpx;
+						padding: 0 20rpx;
+					}
+				}
+			}
+		}
+
+		.btn {
+			border-top: 1px solid #eaeaea;
+			display: flex;
+
+			&>view {
+				flex: 1;
+				text-align: center;
+				line-height: 100rpx;
+				font-size: 32rpx;
+
+				&.left {
+					color: #666666;
+				}
+
+				&.right {
+					color: #ffffff;
+					background: #ff3f42;
+				}
+			}
+		}
+	}
+
+	.goods-waterfall-list {
+		padding: 20rpx 20rpx 0;
+		box-sizing: border-box;
+		display: flex;
+		justify-content: space-between;
+
+		.left,
+		.right {
+			display: flex;
+			flex-direction: column;
+		}
+
+		.item {
+			width: 348rpx;
+			background: #ffffff;
+			box-sizing: border-box;
+			margin-bottom: 20rpx;
+			border-radius: 20rpx;
+			overflow: hidden;
+
+			.image {
+				width: 348rpx;
+				height: 348rpx;
+				flex-shrink: 0;
+				position: relative;
+
+				.img {
+					width: 348rpx;
+					height: 348rpx;
+					display: block;
+				}
+
+				.water {
+					width: 348rpx;
+					height: 348rpx;
+					display: block;
+					position: absolute;
+					left: 0;
+					top: 0;
+					z-index: 1;
+				}
+			}
+
+			.content {
+				padding: 15rpx 20rpx;
+
+				.title {
+					font-size: 30rpx;
+					color: #333333;
+					line-height: 36rpx;
+					font-weight: 600;
+					max-height: 72rpx;
+				}
+
+				.tags {
+					display: flex;
+					flex-wrap: wrap;
+
+					.it {
+						height: 28rpx;
+						padding: 0 10rpx;
+						line-height: 28rpx;
+						border-radius: 10rpx;
+						background: #e8e8e8;
+						font-size: 20rpx;
+						color: #666666;
+						margin-right: 10rpx;
+						margin-top: 10rpx;
+					}
+				}
+
+				.tags2 {
+					display: flex;
+					flex-wrap: wrap;
+
+					.it {
+						height: 36rpx;
+						padding: 0 6rpx;
+						font-size: 24rpx;
+						margin-right: 10rpx;
+						border: 1px solid #fe781f;
+						color: #fe781f;
+						box-sizing: border-box;
+						margin-top: 10rpx;
+						display: flex;
+						align-items: center;
+					}
+				}
+
+				.price {
+					display: flex;
+					align-items: flex-end;
+					margin-top: 10rpx;
+
+					.price-1 {
+						font-size: 32rpx;
+						color: #ff3f42;
+						line-height: 32rpx;
+					}
+
+					.price-2 {
+						font-size: 26rpx;
+						color: #666666;
+						line-height: 26rpx;
+						text-decoration: line-through;
+						margin-left: 12rpx;
+					}
+				}
+
+				.text {
+					font-size: 24rpx;
+					color: #999999;
+					margin-top: 10rpx;
+				}
+			}
+		}
+	}
+
+	.goods-row-list {
+		padding: 20rpx 20rpx 0;
+		box-sizing: border-box;
+
+		.item {
+			padding: 20rpx;
+			background: #ffffff;
+			border-radius: 20rpx;
+			display: flex;
+			margin-bottom: 20rpx;
+
+			.image {
+				width: 240rpx;
+				height: 240rpx;
+				flex-shrink: 0;
+				position: relative;
+
+				.img {
+					width: 240rpx;
+					height: 240rpx;
+					display: block;
+				}
+
+				.water {
+					width: 240rpx;
+					height: 240rpx;
+					display: block;
+					position: absolute;
+					left: 0;
+					top: 0;
+					z-index: 1;
+				}
+			}
+
+			.right {
+				flex: 1;
+				display: flex;
+				flex-direction: column;
+				justify-content: space-between;
+				margin-left: 20rpx;
+
+				.title {
+					font-size: 30rpx;
+					color: #333333;
+					line-height: 36rpx;
+					font-weight: 600;
+					max-height: 72rpx;
+				}
+
+				.tags {
+					display: flex;
+					flex-wrap: wrap;
+
+					.it {
+						height: 28rpx;
+						padding: 0 10rpx;
+						line-height: 28rpx;
+						border-radius: 10rpx;
+						background: #e8e8e8;
+						font-size: 20rpx;
+						color: #666666;
+						margin-right: 10rpx;
+						margin-top: 10rpx;
+					}
+				}
+
+				.bottom {
+					display: flex;
+					align-items: flex-end;
+					justify-content: space-between;
+
+					.price {
+						margin-top: 10rpx;
+
+						.price-1 {
+							font-size: 32rpx;
+							color: #ff3f42;
+							line-height: 32rpx;
+						}
+
+						.price-2 {
+							font-size: 26rpx;
+							color: #666666;
+							line-height: 26rpx;
+							text-decoration: line-through;
+							margin-top: 6rpx;
+						}
+					}
+
+					.text {
+						font-size: 24rpx;
+						color: #999999;
+					}
+				}
+			}
+		}
+	}
+</style>

api/axios.js

@@ -35,7 +35,9 @@ export const axios = function(obj = {}) {
 		// 获取用户详情
 		!!~_url.indexOf('/user/auth') ||
 		// 获取当前商家数据
-		(uni.getStorageSync('token') && !!~_url.indexOf("/user/userWebsit"))
+		(uni.getStorageSync('token') && !!~_url.indexOf("/user/userWebsit")) ||
+		(uni.getStorageSync('token') && !!~_url.indexOf("/user/websitList")) ||
+		(uni.getStorageSync('token') && !!~_url.indexOf("/user/getWebsitId"))
 	) {
 		return new Promise((resolve, reject) => {
 			uni.request({

components/custom.vue

@@ -1,99 +1,99 @@
-<template>
-	<view class="navigation" :style="{height:CustomBar+'px'}" >
-		<view class="me-container" :class="bgColor" :style="cuStyle" >
-			<view class="me-left flex_ac">
-				<!-- <view v-if="isBack" @tap="toBack" class="iconfont icon-back"></view> -->
-				<image v-if="isBack" @tap="toBack" src="@/static/icon/back.png"></image>
-				<slot name="left"></slot>
-			</view>
-			<view class="me-content">
-				<slot name="content"></slot>
-			</view>
-			<view class="me-right">
-				<slot name="right"></slot>
-			</view>
-		</view>
-	</view>
-</template>
-
-<script>
-	export default {
-		props:{
-			isBack:{
-				type:Boolean,
-				default:true
-			},
-			bgColor:{
-				type:String,
-				default:'bg-white'
-			}
-		},
-		computed:{
-			cuStyle(){
-				return `height:${this.CustomBar-this.StatusBar}px;padding-top:${this.StatusBar}px;`
-			}
-		},
-		data() {
-			return {
-				StatusBar:this.StatusBar,
-				CustomBar:this.CustomBar
-			};
-		},
-		methods:{
-			toBack(){
-				uni.navigateBack({
-					delta:1
-				})
-			}
-		}
-	}
-</script>
-
-<style scoped lang="scss">
-	cover-view{
-		box-sizing: border-box;
-	}
-.navigation{
-	position: relative;
-	.bg-none {
-		background: none;
-	}
-	.bg-white{
-		background: #FFFFFF;
-	}
-	.bg-tran{
-		background: transparent;
-	}
-	.bg-them{
-		background: #fb5152;
-	}
-	.bg-linear {
-		background: linear-gradient(-90deg,#6da7ff 0%, #7fdaff 100%);;
-	}
-	.me-container{
-		position: fixed;
-		width: 100%;
-		top: 0;
-		z-index: 1024;
-		// box-shadow: 0 1rpx 6rpx rgba(0, 0, 0, 0.1);
-		// padding: 0 30rpx;
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-		.me-content{
-			position: absolute;
-			left: 50%;
-			transform: translateX(-50%);
-		}
-		.me-left{
-			image {
-				width: 32rpx;
-				height: 32rpx;
-				display: block;
-				margin-left: 30rpx;
-			}
-		}
-		
-	}
-}
-</style>
+<template>
+	<view class="navigation" :style="{height:CustomBar+'px'}" >
+		<view class="me-container" :class="bgColor" :style="cuStyle" >
+			<view class="me-left flex_ac">
+				<!-- <view v-if="isBack" @tap="toBack" class="iconfont icon-back"></view> -->
+				<image v-if="isBack" @tap="toBack" src="@/static/icon/back.png"></image>
+				<slot name="left"></slot>
+			</view>
+			<view class="me-content">
+				<slot name="content"></slot>
+			</view>
+			<view class="me-right">
+				<slot name="right"></slot>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		props:{
+			isBack:{
+				type:Boolean,
+				default:true
+			},
+			bgColor:{
+				type:String,
+				default:'bg-white'
+			}
+		},
+		computed:{
+			cuStyle(){
+				return `height:${this.CustomBar-this.StatusBar}px;padding-top:${this.StatusBar}px;`
+			}
+		},
+		data() {
+			return {
+				StatusBar:this.StatusBar,
+				CustomBar:this.CustomBar
+			};
+		},
+		methods:{
+			toBack(){
+				uni.navigateBack({
+					delta:1
+				})
+			}
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	cover-view{
+		box-sizing: border-box;
+	}
+.navigation{
+	position: relative;
+	.bg-none {
+		background: none;
+	}
+	.bg-white{
+		background: #FFFFFF;
+	}
+	.bg-tran{
+		background: transparent;
+	}
+	.bg-them{
+		background: #fb5152;
+	}
+	.bg-linear {
+		background: linear-gradient(-90deg,#6da7ff 0%, #7fdaff 100%);;
+	}
+	.me-container{
+		position: fixed;
+		width: 100%;
+		top: 0;
+		z-index: 1024;
+		// box-shadow: 0 1rpx 6rpx rgba(0, 0, 0, 0.1);
+		// padding: 0 30rpx;
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		.me-content{
+			position: absolute;
+			left: 50%;
+			transform: translateX(-50%);
+		}
+		.me-left{
+			image {
+				width: 32rpx;
+				height: 32rpx;
+				display: block;
+				margin-left: 30rpx;
+			}
+		}
+		
+	}
+}
+</style>

components/drag-button.vue

@@ -1,172 +1,172 @@
-<template>
-	<view>
-		<view id="_drag_button" class="drag" :style="{top:top+'px',left:left+'px',opacity:firstIn?1:0}"
-			@touchstart="touchstart" @touchmove.stop.prevent="touchmove" @touchend="touchend"
-			@click.stop.prevent="click" :class="{transition: isDock && !isMove }">
-			<button class="btn" style="border: none;padding: 0;margin: 0;">
-				<image class="img" src="@/static/icon/cart.png" mode="widthFix"></image>
-				<text>购物车</text>
-			</button>
-		</view>
-	</view>
-</template>
-
-<script>
-	export default {
-		name: 'drag-button',
-		props: {
-			isDock: {
-				type: Boolean,
-				default: false
-			},
-			customBar: {
-				type: Boolean,
-				default: false
-			}
-		},
-		data() {
-			return {
-				top: 0,
-				left: 0,
-				width: 0,
-				height: 0,
-				offsetWidth: 0,
-				offsetHeight: 0,
-				windowWidth: 0,
-				windowHeight: 0,
-				isMove: true,
-				edge: 10,
-				firstIn: false,
-				customBarHeight: this.CustomBar
-			}
-		},
-		methods: {
-			init() {
-				// 获取手机信息配置接口
-				const sys = uni.getSystemInfoSync();
-				// 屏幕的宽高
-				this.windowWidth = sys.windowWidth;
-				this.windowHeight = sys.windowHeight;
-				if (sys.windowTop) {
-					this.windowHeight += sys.windowTop;
-				}
-				// 获取元素
-				const query = uni.createSelectorQuery().in(this);
-				query.select('#_drag_button').boundingClientRect(data => {
-					this.width = data.width;
-					this.height = data.height;
-					this.offsetWidth = data.width / 2;
-					this.offsetHeight = data.height / 2;
-					// this.left = this.windowWidth - this.width - this.edge;
-					// this.top = this.windowHeight - this.height - this.edge;
-					
-					// 若storage无值，设置初始值
-					if(!uni.getStorageSync('top')) {
-						uni.setStorageSync("top", this.windowHeight - this.height - this.edge - 100 - (this.customBar ? this.customBarHeight : 0));
-					}
-					if(!uni.getStorageSync('left')) {
-						uni.setStorageSync("left", this.windowWidth - this.width - this.edge);
-					}
-					
-					this.left = uni.getStorageSync('left');
-					this.top = uni.getStorageSync('top') - (this.customBar ? this.customBarHeight : 0);
-					this.$nextTick(() => {
-						this.firstIn = true;
-					})
-				}).exec();
-			},
-			click() {
-				uni.switchTab({
-					url:'/pages/cart/index'
-				})
-			},
-			touchstart(e) {
-				
-			},
-			touchmove(e) {
-				// 单指触摸
-				if (e.touches.length !== 1) {
-					return false;
-				}
-				this.isMove = true;
-
-				this.left = e.touches[0].clientX - this.offsetWidth;
-
-				let clientY = e.touches[0].clientY - this.offsetHeight;
-				
-				let edgeBottom = this.windowHeight - this.height - this.edge;
-
-				// 上下触及边界
-				if (clientY < this.edge) {
-					this.top = this.edge;
-				} else if (clientY > edgeBottom) {
-					this.top = edgeBottom;
-				} else {
-					this.top = clientY
-				}
-				uni.setStorageSync("top", this.top + (this.customBar ? this.customBarHeight : 0));
-			},
-			touchend(e) {
-				if (this.isDock) {
-					let edgeRigth = this.windowWidth - this.width - this.edge;
-
-					if (this.left < this.windowWidth / 2 - this.offsetWidth) {
-						this.left = this.edge;
-					} else {
-						this.left = edgeRigth;
-					}
-				}
-				uni.setStorageSync("left", this.left);
-				this.isMove = false;
-			},
-		}
-	}
-</script>
-
-<style lang="scss">
-	.drag {
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		width: 100rpx;
-		height: 100rpx;
-		border-radius: 50%;
-		font-size: $uni-font-size-sm;
-		position: fixed;
-		z-index: 999999;
-		background: #FFA162;
-		border: 4rpx solid #FE781F;
-
-		&.transition {
-			transition: left .3s ease, top .3s ease;
-		}
-	}
-
-	.btn {
-		background-color: transparent;
-		width: 100rpx;
-		height: 100rpx;
-		border-radius: 50%;
-		z-index: 9999;
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-		.img {
-			width: 36rpx;
-			display: block;
-		}
-		text {
-			font-size: 22rpx;
-			line-height: 24rpx;
-			color: #FFFFFF;
-			margin-top: 8rpx;
-		}
-	}
-
-	button::after {
-		border: none;
-	}
-
-</style>
-
+<template>
+	<view>
+		<view id="_drag_button" class="drag" :style="{top:top+'px',left:left+'px',opacity:firstIn?1:0}"
+			@touchstart="touchstart" @touchmove.stop.prevent="touchmove" @touchend="touchend"
+			@click.stop.prevent="click" :class="{transition: isDock && !isMove }">
+			<button class="btn" style="border: none;padding: 0;margin: 0;">
+				<image class="img" src="@/static/icon/cart.png" mode="widthFix"></image>
+				<text>购物车</text>
+			</button>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'drag-button',
+		props: {
+			isDock: {
+				type: Boolean,
+				default: false
+			},
+			customBar: {
+				type: Boolean,
+				default: false
+			}
+		},
+		data() {
+			return {
+				top: 0,
+				left: 0,
+				width: 0,
+				height: 0,
+				offsetWidth: 0,
+				offsetHeight: 0,
+				windowWidth: 0,
+				windowHeight: 0,
+				isMove: true,
+				edge: 10,
+				firstIn: false,
+				customBarHeight: this.CustomBar
+			}
+		},
+		methods: {
+			init() {
+				// 获取手机信息配置接口
+				const sys = uni.getSystemInfoSync();
+				// 屏幕的宽高
+				this.windowWidth = sys.windowWidth;
+				this.windowHeight = sys.windowHeight;
+				if (sys.windowTop) {
+					this.windowHeight += sys.windowTop;
+				}
+				// 获取元素
+				const query = uni.createSelectorQuery().in(this);
+				query.select('#_drag_button').boundingClientRect(data => {
+					this.width = data.width;
+					this.height = data.height;
+					this.offsetWidth = data.width / 2;
+					this.offsetHeight = data.height / 2;
+					// this.left = this.windowWidth - this.width - this.edge;
+					// this.top = this.windowHeight - this.height - this.edge;
+					
+					// 若storage无值，设置初始值
+					if(!uni.getStorageSync('top')) {
+						uni.setStorageSync("top", this.windowHeight - this.height - this.edge - 100 - (this.customBar ? this.customBarHeight : 0));
+					}
+					if(!uni.getStorageSync('left')) {
+						uni.setStorageSync("left", this.windowWidth - this.width - this.edge);
+					}
+					
+					this.left = uni.getStorageSync('left');
+					this.top = uni.getStorageSync('top') - (this.customBar ? this.customBarHeight : 0);
+					this.$nextTick(() => {
+						this.firstIn = true;
+					})
+				}).exec();
+			},
+			click() {
+				uni.switchTab({
+					url:'/pages/cart/index'
+				})
+			},
+			touchstart(e) {
+				
+			},
+			touchmove(e) {
+				// 单指触摸
+				if (e.touches.length !== 1) {
+					return false;
+				}
+				this.isMove = true;
+
+				this.left = e.touches[0].clientX - this.offsetWidth;
+
+				let clientY = e.touches[0].clientY - this.offsetHeight;
+				
+				let edgeBottom = this.windowHeight - this.height - this.edge;
+
+				// 上下触及边界
+				if (clientY < this.edge) {
+					this.top = this.edge;
+				} else if (clientY > edgeBottom) {
+					this.top = edgeBottom;
+				} else {
+					this.top = clientY
+				}
+				uni.setStorageSync("top", this.top + (this.customBar ? this.customBarHeight : 0));
+			},
+			touchend(e) {
+				if (this.isDock) {
+					let edgeRigth = this.windowWidth - this.width - this.edge;
+
+					if (this.left < this.windowWidth / 2 - this.offsetWidth) {
+						this.left = this.edge;
+					} else {
+						this.left = edgeRigth;
+					}
+				}
+				uni.setStorageSync("left", this.left);
+				this.isMove = false;
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.drag {
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		width: 100rpx;
+		height: 100rpx;
+		border-radius: 50%;
+		font-size: $uni-font-size-sm;
+		position: fixed;
+		z-index: 999999;
+		background: #FFA162;
+		border: 4rpx solid #FE781F;
+
+		&.transition {
+			transition: left .3s ease, top .3s ease;
+		}
+	}
+
+	.btn {
+		background-color: transparent;
+		width: 100rpx;
+		height: 100rpx;
+		border-radius: 50%;
+		z-index: 9999;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+		.img {
+			width: 36rpx;
+			display: block;
+		}
+		text {
+			font-size: 22rpx;
+			line-height: 24rpx;
+			color: #FFFFFF;
+			margin-top: 8rpx;
+		}
+	}
+
+	button::after {
+		border: none;
+	}
+
+</style>
+

components/floatButton.vue

@@ -1,122 +1,122 @@
-<template>
-  <view class="btn-group">
-    <view class="btn" @tap="toShare()" v-if="isShare">
-      <text class="iconfont icon-fenxiang"></text>
-      <text class="text">分享</text>
-    </view>
-    <view class="btn" @tap="toCart()" v-if="isCart">
-      <text class="iconfont icon-gouwuche"></text>
-      <text class="text">购物车</text>
-    </view>
-    <button class="btn" open-type="contact" v-if="isService">
-      <text class="iconfont icon-kefu"></text>
-      <text class="text">在线客服</text>
-    </button>
-  </view>
-</template>
-
-<script>
-export default {
-  props: {
-    isDock: {
-      type: Boolean,
-      default: false,
-    },
-    customBar: {
-      type: Boolean,
-      default: false,
-    },
-  },
-  data() {
-    return {};
-  },
-  computed: {
-    curRoute() {
-      let routes = getCurrentPages();
-      return routes[routes.length - 1].route;
-    },
-
-    isCart() {
-      return ![
-        'pages/login/index',
-        'pages/cart/index',
-        'pages/mine/index',
-        'packageGoods/pages/detail',
-        'packageGoods/pages/order',
-        'pages/mine/order/detail',
-        'packageGoods/pages/coupon',
-        'pages/mine/coupon/list',
-      ].includes(this.curRoute);
-    },
-
-    isService() {
-      return ![
-        'pages/login/index',
-        'pages/cart/index',
-        'pages/mine/index',
-        'packageGoods/pages/order',
-        'pages/mine/order/detail',
-        'packageGoods/pages/coupon',
-        'pages/mine/coupon/list',
-      ].includes(this.curRoute);
-    },
-
-    isShare() {
-      return [
-        'pages/mine/groupbuy/list',
-        // 'packageGoods/pages/activity',
-      ].includes(this.curRoute);
-    },
-  },
-  mounted() {},
-  methods: {
-    toCart() {
-      uni.switchTab({
-        url: '/pages/cart/index',
-      });
-    },
-
-    toShare() {
-      uni.$emit('hanbleShare');
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-.btn-group {
-  position: fixed;
-  bottom: 20vh;
-  right: 20rpx;
-  z-index: 999998;
-  .btn {
-    width: 92rpx;
-    height: 92rpx;
-    background: #ffffff;
-    box-shadow: 0 2rpx 8rpx 2rpx rgba(0, 0, 0, 0.3);
-    transition: all 0.5s;
-    text-align: center;
-    border-radius: 50%;
-    color: #333333;
-    margin-top: 15rpx;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    padding: 0;
-    padding-bottom: 8rpx;
-    line-height: 1;
-    box-sizing: border-box;
-    &::after {
-      border: none;
-    }
-    .iconfont {
-      font-size: 44rpx;
-    }
-    .text {
-      font-size: 18rpx;
-      margin-top: 6rpx;
-    }
-  }
-}
-</style>
+<template>
+  <view class="btn-group">
+    <view class="btn" @tap="toShare()" v-if="isShare">
+      <text class="iconfont icon-fenxiang"></text>
+      <text class="text">分享</text>
+    </view>
+    <view class="btn" @tap="toCart()" v-if="isCart">
+      <text class="iconfont icon-gouwuche"></text>
+      <text class="text">购物车</text>
+    </view>
+    <button class="btn" open-type="contact" v-if="isService">
+      <text class="iconfont icon-kefu"></text>
+      <text class="text">在线客服</text>
+    </button>
+  </view>
+</template>
+
+<script>
+export default {
+  props: {
+    isDock: {
+      type: Boolean,
+      default: false,
+    },
+    customBar: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data() {
+    return {};
+  },
+  computed: {
+    curRoute() {
+      let routes = getCurrentPages();
+      return routes[routes.length - 1].route;
+    },
+
+    isCart() {
+      return ![
+        'pages/login/index',
+        'pages/cart/index',
+        'pages/mine/index',
+        'packageGoods/pages/detail',
+        'packageGoods/pages/order',
+        'pages/mine/order/detail',
+        'packageGoods/pages/coupon',
+        'pages/mine/coupon/list',
+      ].includes(this.curRoute);
+    },
+
+    isService() {
+      return ![
+        'pages/login/index',
+        'pages/cart/index',
+        'pages/mine/index',
+        'packageGoods/pages/order',
+        'pages/mine/order/detail',
+        'packageGoods/pages/coupon',
+        'pages/mine/coupon/list',
+      ].includes(this.curRoute);
+    },
+
+    isShare() {
+      return [
+        'pages/mine/groupbuy/list',
+        // 'packageGoods/pages/activity',
+      ].includes(this.curRoute);
+    },
+  },
+  mounted() {},
+  methods: {
+    toCart() {
+      uni.switchTab({
+        url: '/pages/cart/index',
+      });
+    },
+
+    toShare() {
+      uni.$emit('hanbleShare');
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.btn-group {
+  position: fixed;
+  bottom: 20vh;
+  right: 20rpx;
+  z-index: 999998;
+  .btn {
+    width: 92rpx;
+    height: 92rpx;
+    background: #ffffff;
+    box-shadow: 0 2rpx 8rpx 2rpx rgba(0, 0, 0, 0.3);
+    transition: all 0.5s;
+    text-align: center;
+    border-radius: 50%;
+    color: #333333;
+    margin-top: 15rpx;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    padding: 0;
+    padding-bottom: 8rpx;
+    line-height: 1;
+    box-sizing: border-box;
+    &::after {
+      border: none;
+    }
+    .iconfont {
+      font-size: 44rpx;
+    }
+    .text {
+      font-size: 18rpx;
+      margin-top: 6rpx;
+    }
+  }
+}
+</style>

components/loadingText.vue

@@ -1,42 +1,42 @@
-<template>
-	<view class="container">
-		<text v-if="!loading && !noMore">上滑加载更多</text>
-		<view v-if="loading && !noMore">
-			<text class="iconfont icon-refrsh roate"></text>
-			<text>加载中...</text>
-		</view>
-		<text v-if="noMore">没有更多数据了</text>
-	</view>
-</template>
-
-<script>
-	export default {
-		props:{
-			loading:{
-				type: Boolean,
-				default: false
-			},
-			noMore:{
-				type: Boolean,
-				default: false
-			}
-		},
-		data() {
-			return {
-				
-			};
-		}
-	}
-</script>
-
-<style lang="scss" scoped>
-.container{
-	width: 100%;
-	height: 100rpx;
-	display: flex;
-	justify-content: center;
-	align-items: center;
-	color: #666666;
-	font-size: 28rpx;
-}
-</style>
+<template>
+	<view class="container">
+		<text v-if="!loading && !noMore">上滑加载更多</text>
+		<view v-if="loading && !noMore">
+			<text class="iconfont icon-refrsh roate"></text>
+			<text>加载中...</text>
+		</view>
+		<text v-if="noMore">没有更多数据了</text>
+	</view>
+</template>
+
+<script>
+	export default {
+		props:{
+			loading:{
+				type: Boolean,
+				default: false
+			},
+			noMore:{
+				type: Boolean,
+				default: false
+			}
+		},
+		data() {
+			return {
+				
+			};
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.container{
+	width: 100%;
+	height: 100rpx;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	color: #666666;
+	font-size: 28rpx;
+}
+</style>

components/logistics/common-logistics.vue

@@ -1,44 +1,44 @@
-<template>
-	<view class="bg-white">
-		<view class="common-logistics">
-			<view class="logistic-item" v-for="(item,index) in logisticsData" :key="index">
-				<view class="total-wrap" :style="{marginTop: item.isFirstNode ? '22rpx' : '6rpx'}">
-					<view class="item-container">
-						<view class="item-container-left flex flex-direction align-center"
-							:class="[index == 0 ? 'text-1A1A1A' : 'text-808080']">
-							<text class="text-df">{{item.time | dateTommdd}}</text>
-							<text class="text-sm">{{item.time | dateToHHmmss}}</text>
-						</view>
-						<view class="item-container-center">
-							<view class="tag-container">
-								<image v-if="item.isFirstNode && String(item.state) != 'null'" :src="nodeIconUrl(item.state, index)" mode="scaleToFill"></image>
-								<view v-else class="item-tag-container">
-									<image class="item-tag" :src="[index == 0 ? '/static/mine/logistics/active-line-state.png' : '/static/mine/logistics/line-state.png']" mode="scaleToFill"></image>
-								</view>
-							</view>
-							<view class="line-container"
-								:style="{height: item.isFirstNode ? '145rpx' : '88rpx' , paddingTop: item.isFirstNode ? '22rpx': '8rpx'}">
-								<view v-if="index !== logisticsData.length - 1" class="line" :style="{height: item.isFirstNode ? '120rpx':'80rpx'}"></view>
-							</view>
-						</view>
-						<view class="item-container-right" :style="{paddingTop: item.isFirstNode?'0':'8rpx'}">
-							<view v-if="item.isFirstNode" class="item-title text-dm text-bold" :class="[index == 0 ? 'text-1A1A1A' : 'text-808080']">{{item.state | stateFilter}}</view>
-							<view class="item-desc text-dm" :class="[index == 0 ? 'text-1A1A1A' : 'text-999999']" :style="{marginTop: item.isFirstNode ? '10rpx' : '0'}">{{item.context}}</view>
-							<!-- <view class="item-time">{{item.createTime}}</view> -->
-						</view>
-					</view>
-				</view>
-			</view>
-		</view>
-	</view>
-</template>
-
-<script>
-	export default {
-		props: {
-			logisticsData: {
-				type: [Object, Array]
-			}
+<template>
+	<view class="bg-white">
+		<view class="common-logistics">
+			<view class="logistic-item" v-for="(item,index) in logisticsData" :key="index">
+				<view class="total-wrap" :style="{marginTop: item.isFirstNode ? '22rpx' : '6rpx'}">
+					<view class="item-container">
+						<view class="item-container-left flex flex-direction align-center"
+							:class="[index == 0 ? 'text-1A1A1A' : 'text-808080']">
+							<text class="text-df">{{item.time | dateTommdd}}</text>
+							<text class="text-sm">{{item.time | dateToHHmmss}}</text>
+						</view>
+						<view class="item-container-center">
+							<view class="tag-container">
+								<image v-if="item.isFirstNode && String(item.state) != 'null'" :src="nodeIconUrl(item.state, index)" mode="scaleToFill"></image>
+								<view v-else class="item-tag-container">
+									<image class="item-tag" :src="[index == 0 ? '/static/mine/logistics/active-line-state.png' : '/static/mine/logistics/line-state.png']" mode="scaleToFill"></image>
+								</view>
+							</view>
+							<view class="line-container"
+								:style="{height: item.isFirstNode ? '145rpx' : '88rpx' , paddingTop: item.isFirstNode ? '22rpx': '8rpx'}">
+								<view v-if="index !== logisticsData.length - 1" class="line" :style="{height: item.isFirstNode ? '120rpx':'80rpx'}"></view>
+							</view>
+						</view>
+						<view class="item-container-right" :style="{paddingTop: item.isFirstNode?'0':'8rpx'}">
+							<view v-if="item.isFirstNode" class="item-title text-dm text-bold" :class="[index == 0 ? 'text-1A1A1A' : 'text-808080']">{{item.state | stateFilter}}</view>
+							<view class="item-desc text-dm" :class="[index == 0 ? 'text-1A1A1A' : 'text-999999']" :style="{marginTop: item.isFirstNode ? '10rpx' : '0'}">{{item.context}}</view>
+							<!-- <view class="item-time">{{item.createTime}}</view> -->
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			logisticsData: {
+				type: [Object, Array]
+			}
 		},
 		filters: {
 			stateFilter(val) {
@@ -53,147 +53,147 @@
 				}
 				return stateMap[val]
 			},
-		},
-		computed: {
-			nodeIconUrl() {
+		},
+		computed: {
+			nodeIconUrl() {
 				return function(data, isFirstIndex) {
-					// 物流状：0在途，1揽收，2疑难，3签收，4退签，5派件，6退回
-					if (data == 0) {
-						return isFirstIndex === 0 ? '/static/icon/select_1.png' : '/static/icon/select_1.png'
-					} else if (data == 1) {
-						return isFirstIndex === 0 ? '/static/icon/select_1.png' : '/static/icon/select_1.png'
-					} else if (data == 2) {
-						return isFirstIndex === 0 ? '/static/icon/select_1.png' : '/static/icon/select_1.png'
-					} else if (data == 3) {
-						return isFirstIndex === 0 ? '/static/icon/select_1.png' : '/static/icon/select_1.png'
-					} else if (data == 4) {
-						return isFirstIndex === 0 ? '/static/icon/select_1.png' : '/static/icon/select_1.png'
-					} else if (data == 5) {
-						return isFirstIndex === 0 ? '/static/icon/select_1.png' : '/static/icon/select_1.png'
-					} else if (data == 6) {
-						return isFirstIndex === 0 ? '/static/icon/select_1.png' : '/static/icon/select_1.png'
-					}
-				}
-			}
-		}
-	}
-</script>
-
+					// 物流状：0在途，1揽收，2疑难，3签收，4退签，5派件，6退回
+					if (data == 0) {
+						return isFirstIndex === 0 ? '/static/icon/select_1.png' : '/static/icon/select_1.png'
+					} else if (data == 1) {
+						return isFirstIndex === 0 ? '/static/icon/select_1.png' : '/static/icon/select_1.png'
+					} else if (data == 2) {
+						return isFirstIndex === 0 ? '/static/icon/select_1.png' : '/static/icon/select_1.png'
+					} else if (data == 3) {
+						return isFirstIndex === 0 ? '/static/icon/select_1.png' : '/static/icon/select_1.png'
+					} else if (data == 4) {
+						return isFirstIndex === 0 ? '/static/icon/select_1.png' : '/static/icon/select_1.png'
+					} else if (data == 5) {
+						return isFirstIndex === 0 ? '/static/icon/select_1.png' : '/static/icon/select_1.png'
+					} else if (data == 6) {
+						return isFirstIndex === 0 ? '/static/icon/select_1.png' : '/static/icon/select_1.png'
+					}
+				}
+			}
+		}
+	}
+</script>
+
 <style lang="scss" scoped>
 	@import url("@/components/logistics/main.css");
-	
-	.common-logistics {
-		height: auto;
+	
+	.common-logistics {
+		height: auto;
 		box-sizing: border-box;
-		background: #FFFFFF;
-	}
-
-	.item-container {
-		width: 100%;
-		height: auto;
-		display: flex;
-
-		.item-container-left {
-			width: 120rpx;
-			max-width: 120rpx;
-		}
-
-		.item-container-center {
-			width: 44rpx;
-			height: auto;
-
-			.tag-container {
-				width: 44rpx;
-				height: 44rpx;
-
-				image {
-					width: 44rpx;
-					height: 44rpx;
-					border-radius: 50%;
-				}
-
-				.item-tag-container {
-					width: 44rpx;
-					height: 44rpx;
-					display: flex;
-					justify-content: center;
-					align-items: center;
-
-					.item-tag {
-						width: 14rpx;
-						height: 14rpx;
-						border-radius: 50%;
-					}
-				}
-			}
-
-			.line-container {
-				box-sizing: border-box;
-				width: 44rpx;
-				display: flex;
-				align-items: center;
-				justify-content: center;
-
-				.line {
-					width: 2rpx;
-					background-color: #dcdcdc;
-				}
-			}
-		}
-
-		.item-container-right {
-			width: 510rpx;
-			max-width: 510rpx;
-			box-sizing: border-box;
-			padding: 0 10rpx 0 24rpx;
-
-			.item-title {
-				width: 100%;
-				height: 40rpx;
-				line-height: 44rpx;
-				color: #222;
-				font-size: 28rpx;
-			}
-
-			.item-desc {
-				margin-top: 16rpx;
-				width: 100%;
-				min-height: 30rpx;
-				line-height: 30rpx;
-				word-wrap: break-word;
-				word-break: normal;
-			}
-
-			.item-time {
-				margin-top: 12rpx;
-				width: 100%;
-				height: 34rpx;
-				line-height: 34rpx;
-				font-size: 24rpx;
-			}
-		}
-	}
-
-	.line-state {
-		width: 20rpx;
-		height: 20rpx;
-		border-radius: 50%;
-	}
-
-	.take-space {
-		width: 100%;
-		height: 80rpx;
-	}
-
-	.text-1A1A1A {
-		color: #1A1A1A;
-	}
-
-	.text-999999 {
-		color: #999999;
-	}
-
-	.text-808080 {
-		color: #808080;
-	}
-</style>
+		background: #FFFFFF;
+	}
+
+	.item-container {
+		width: 100%;
+		height: auto;
+		display: flex;
+
+		.item-container-left {
+			width: 120rpx;
+			max-width: 120rpx;
+		}
+
+		.item-container-center {
+			width: 44rpx;
+			height: auto;
+
+			.tag-container {
+				width: 44rpx;
+				height: 44rpx;
+
+				image {
+					width: 44rpx;
+					height: 44rpx;
+					border-radius: 50%;
+				}
+
+				.item-tag-container {
+					width: 44rpx;
+					height: 44rpx;
+					display: flex;
+					justify-content: center;
+					align-items: center;
+
+					.item-tag {
+						width: 14rpx;
+						height: 14rpx;
+						border-radius: 50%;
+					}
+				}
+			}
+
+			.line-container {
+				box-sizing: border-box;
+				width: 44rpx;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+
+				.line {
+					width: 2rpx;
+					background-color: #dcdcdc;
+				}
+			}
+		}
+
+		.item-container-right {
+			width: 510rpx;
+			max-width: 510rpx;
+			box-sizing: border-box;
+			padding: 0 10rpx 0 24rpx;
+
+			.item-title {
+				width: 100%;
+				height: 40rpx;
+				line-height: 44rpx;
+				color: #222;
+				font-size: 28rpx;
+			}
+
+			.item-desc {
+				margin-top: 16rpx;
+				width: 100%;
+				min-height: 30rpx;
+				line-height: 30rpx;
+				word-wrap: break-word;
+				word-break: normal;
+			}
+
+			.item-time {
+				margin-top: 12rpx;
+				width: 100%;
+				height: 34rpx;
+				line-height: 34rpx;
+				font-size: 24rpx;
+			}
+		}
+	}
+
+	.line-state {
+		width: 20rpx;
+		height: 20rpx;
+		border-radius: 50%;
+	}
+
+	.take-space {
+		width: 100%;
+		height: 80rpx;
+	}
+
+	.text-1A1A1A {
+		color: #1A1A1A;
+	}
+
+	.text-999999 {
+		color: #999999;
+	}
+
+	.text-808080 {
+		color: #808080;
+	}
+</style>

components/logistics/init-logistics.js

@@ -1,29 +1,29 @@
-import Vue from 'vue';
-export const setAttribute = function(data) {
-	if (Array.isArray(data) && data.length > 0) {
-		return data.map((item, index) => {
-			Vue.set(item, 'isFirstNode', false)
-			return item
-		})
-	} else {
-		return []
-	}
-}
-
-export const changeAttribute = function(testStrList, targetList) {
-	let cacheData = targetList;
-	testStrList.forEach((item, index) => {
-		let result_Index = targetList.findIndex(function(f_item, f_index) {
-			return String(f_item.state) == item
-		})
-		if (result_Index != -1) {
-			cacheData[result_Index].isFirstNode = true;
-		}
-	})
-	return cacheData;
-}
-
-export default {
-	setAttribute,
-	changeAttribute
-}
+import Vue from 'vue';
+export const setAttribute = function(data) {
+	if (Array.isArray(data) && data.length > 0) {
+		return data.map((item, index) => {
+			Vue.set(item, 'isFirstNode', false)
+			return item
+		})
+	} else {
+		return []
+	}
+}
+
+export const changeAttribute = function(testStrList, targetList) {
+	let cacheData = targetList;
+	testStrList.forEach((item, index) => {
+		let result_Index = targetList.findIndex(function(f_item, f_index) {
+			return String(f_item.state) == item
+		})
+		if (result_Index != -1) {
+			cacheData[result_Index].isFirstNode = true;
+		}
+	})
+	return cacheData;
+}
+
+export default {
+	setAttribute,
+	changeAttribute
+}

components/logistics/main.css

@@ -1,3916 +1,3916 @@
-/*
-  ColorUi for uniApp  v2.1.6 | by 文晓港 2019-05-31 10:44:24
-  仅供学习交流，如作它用所承受的法律责任一概与作者无关  
-  
-  *使用ColorUi开发扩展与插件时，请注明基于ColorUi开发 
-  
-  （QQ交流群：240787041）
-*/
-
-/* ==================
-        初始化
- ==================== */
-body {
-	background-color: #f1f1f1;
-	font-size: 28rpx;
-	color: #333333;
-	font-family: Helvetica Neue, Helvetica, sans-serif;
-}
-
-view,
-scroll-view,
-swiper,
-button,
-input,
-textarea,
-label,
-navigator,
-image {
-	box-sizing: border-box;
-}
-
-.round {
-	border-radius: 5000rpx;
-}
-
-.radius {
-	border-radius: 6rpx;
-}
-
-/* ==================
-          图片
- ==================== */
-
-image {
-	max-width: 100%;
-	display: inline-block;
-	position: relative;
-	z-index: 0;
-}
-
-image.loading::before {
-	content: "";
-	background-color: #f5f5f5;
-	display: block;
-	position: absolute;
-	width: 100%;
-	height: 100%;
-	z-index: -2;
-}
-
-image.loading::after {
-	content: "\e7f1";
-	font-family: "cuIcon";
-	position: absolute;
-	top: 0;
-	left: 0;
-	width: 32rpx;
-	height: 32rpx;
-	line-height: 32rpx;
-	right: 0;
-	bottom: 0;
-	z-index: -1;
-	font-size: 32rpx;
-	margin: auto;
-	color: #ccc;
-	-webkit-animation: cuIcon-spin 2s infinite linear;
-	animation: cuIcon-spin 2s infinite linear;
-	display: block;
-}
-
-.response {
-	width: 100%;
-}
-
-/* ==================
-         开关
- ==================== */
-
-switch,
-checkbox,
-radio {
-	position: relative;
-}
-
-switch::after,
-switch::before {
-	font-family: "cuIcon";
-	content: "\e645";
-	position: absolute;
-	color: #ffffff !important;
-	top: 0%;
-	left: 0rpx;
-	font-size: 26rpx;
-	line-height: 26px;
-	width: 50%;
-	text-align: center;
-	pointer-events: none;
-	transform: scale(0, 0);
-	transition: all 0.3s ease-in-out 0s;
-	z-index: 9;
-	bottom: 0;
-	height: 26px;
-	margin: auto;
-}
-
-switch::before {
-	content: "\e646";
-	right: 0;
-	transform: scale(1, 1);
-	left: auto;
-}
-
-switch[checked]::after,
-switch.checked::after {
-	transform: scale(1, 1);
-}
-
-switch[checked]::before,
-switch.checked::before {
-	transform: scale(0, 0);
-}
-
-/* #ifndef MP-ALIPAY */
-radio::before,
-checkbox::before {
-	font-family: "cuIcon";
-	content: "\e645";
-	position: absolute;
-	color: #ffffff !important;
-	top: 50%;
-	margin-top: -8px;
-	right: 5px;
-	font-size: 32rpx;
-	line-height: 16px;
-	pointer-events: none;
-	transform: scale(1, 1);
-	transition: all 0.3s ease-in-out 0s;
-	z-index: 9;
-}
-
-radio .wx-radio-input,
-checkbox .wx-checkbox-input,
-radio .uni-radio-input,
-checkbox .uni-checkbox-input {
-	margin: 0;
-	width: 24px;
-	height: 24px;
-}
-
-checkbox.round .wx-checkbox-input,
-checkbox.round .uni-checkbox-input {
-	border-radius: 100rpx;
-}
-
-/* #endif */
-
-switch[checked]::before {
-	transform: scale(0, 0);
-}
-
-switch .wx-switch-input,
-switch .uni-switch-input {
-	border: none;
-	padding: 0 24px;
-	width: 48px;
-	height: 26px;
-	margin: 0;
-	border-radius: 100rpx;
-}
-
-switch .wx-switch-input:not([class*="bg-"]),
-switch .uni-switch-input:not([class*="bg-"]) {
-	background: #8799a3 !important;
-}
-
-switch .wx-switch-input::after,
-switch .uni-switch-input::after {
-	margin: auto;
-	width: 26px;
-	height: 26px;
-	border-radius: 100rpx;
-	left: 0rpx;
-	top: 0rpx;
-	bottom: 0rpx;
-	position: absolute;
-	transform: scale(0.9, 0.9);
-	transition: all 0.1s ease-in-out 0s;
-}
-
-switch .wx-switch-input.wx-switch-input-checked::after,
-switch .uni-switch-input.uni-switch-input-checked::after {
-	margin: auto;
-	left: 22px;
-	box-shadow: none;
-	transform: scale(0.9, 0.9);
-}
-
-radio-group {
-	display: inline-block;
-}
-
-
-
-switch.radius .wx-switch-input::after,
-switch.radius .wx-switch-input,
-switch.radius .wx-switch-input::before,
-switch.radius .uni-switch-input::after,
-switch.radius .uni-switch-input,
-switch.radius .uni-switch-input::before {
-	border-radius: 10rpx;
-}
-
-switch .wx-switch-input::before,
-radio.radio::before,
-checkbox .wx-checkbox-input::before,
-radio .wx-radio-input::before,
-switch .uni-switch-input::before,
-radio.radio::before,
-checkbox .uni-checkbox-input::before,
-radio .uni-radio-input::before {
-	display: none;
-}
-
-radio.radio[checked]::after,
-radio.radio .uni-radio-input-checked::after {
-	content: "";
-	background-color: transparent;
-	display: block;
-	position: absolute;
-	width: 8px;
-	height: 8px;
-	z-index: 999;
-	top: 0rpx;
-	left: 0rpx;
-	right: 0;
-	bottom: 0;
-	margin: auto;
-	border-radius: 200rpx;
-	/* #ifndef MP */
-	border: 7px solid #ffffff !important;
-	/* #endif */
-
-	/* #ifdef MP */
-	border: 8px solid #ffffff !important;
-	/* #endif */
-}
-
-.switch-sex::after {
-	content: "\e71c";
-}
-
-.switch-sex::before {
-	content: "\e71a";
-}
-
-.switch-sex .wx-switch-input,
-.switch-sex .uni-switch-input {
-	background: #e54d42 !important;
-	border-color: #e54d42 !important;
-}
-
-.switch-sex[checked] .wx-switch-input,
-.switch-sex.checked .uni-switch-input {
-	background: #0081ff !important;
-	border-color: #0081ff !important;
-}
-
-switch.red[checked] .wx-switch-input.wx-switch-input-checked,
-checkbox.red[checked] .wx-checkbox-input,
-radio.red[checked] .wx-radio-input,
-switch.red.checked .uni-switch-input.uni-switch-input-checked,
-checkbox.red.checked .uni-checkbox-input,
-radio.red.checked .uni-radio-input {
-	background-color: #e54d42 !important;
-	border-color: #e54d42 !important;
-	color: #ffffff !important;
-}
-
-switch.orange[checked] .wx-switch-input,
-checkbox.orange[checked] .wx-checkbox-input,
-radio.orange[checked] .wx-radio-input,
-switch.orange.checked .uni-switch-input,
-checkbox.orange.checked .uni-checkbox-input,
-radio.orange.checked .uni-radio-input {
-	background-color: #f37b1d !important;
-	border-color: #f37b1d !important;
-	color: #ffffff !important;
-}
-
-switch.yellow[checked] .wx-switch-input,
-checkbox.yellow[checked] .wx-checkbox-input,
-radio.yellow[checked] .wx-radio-input,
-switch.yellow.checked .uni-switch-input,
-checkbox.yellow.checked .uni-checkbox-input,
-radio.yellow.checked .uni-radio-input {
-	background-color: #fbbd08 !important;
-	border-color: #fbbd08 !important;
-	color: #333333 !important;
-}
-
-switch.olive[checked] .wx-switch-input,
-checkbox.olive[checked] .wx-checkbox-input,
-radio.olive[checked] .wx-radio-input,
-switch.olive.checked .uni-switch-input,
-checkbox.olive.checked .uni-checkbox-input,
-radio.olive.checked .uni-radio-input {
-	background-color: #8dc63f !important;
-	border-color: #8dc63f !important;
-	color: #ffffff !important;
-}
-
-switch.green[checked] .wx-switch-input,
-switch[checked] .wx-switch-input,
-checkbox.green[checked] .wx-checkbox-input,
-checkbox[checked] .wx-checkbox-input,
-radio.green[checked] .wx-radio-input,
-radio[checked] .wx-radio-input,
-switch.green.checked .uni-switch-input,
-switch.checked .uni-switch-input,
-checkbox.green.checked .uni-checkbox-input,
-checkbox.checked .uni-checkbox-input,
-radio.green.checked .uni-radio-input,
-radio.checked .uni-radio-input {
-	background-color: #39b54a !important;
-	border-color: #39b54a !important;
-	color: #ffffff !important;
-	border-color: #39B54A !important;
-}
-
-switch.cyan[checked] .wx-switch-input,
-checkbox.cyan[checked] .wx-checkbox-input,
-radio.cyan[checked] .wx-radio-input,
-switch.cyan.checked .uni-switch-input,
-checkbox.cyan.checked .uni-checkbox-input,
-radio.cyan.checked .uni-radio-input {
-	background-color: #1cbbb4 !important;
-	border-color: #1cbbb4 !important;
-	color: #ffffff !important;
-}
-
-switch.blue[checked] .wx-switch-input,
-checkbox.blue[checked] .wx-checkbox-input,
-radio.blue[checked] .wx-radio-input,
-switch.blue.checked .uni-switch-input,
-checkbox.blue.checked .uni-checkbox-input,
-radio.blue.checked .uni-radio-input {
-	background-color: #0081ff !important;
-	border-color: #0081ff !important;
-	color: #ffffff !important;
-}
-
-switch.purple[checked] .wx-switch-input,
-checkbox.purple[checked] .wx-checkbox-input,
-radio.purple[checked] .wx-radio-input,
-switch.purple.checked .uni-switch-input,
-checkbox.purple.checked .uni-checkbox-input,
-radio.purple.checked .uni-radio-input {
-	background-color: #6739b6 !important;
-	border-color: #6739b6 !important;
-	color: #ffffff !important;
-}
-
-switch.mauve[checked] .wx-switch-input,
-checkbox.mauve[checked] .wx-checkbox-input,
-radio.mauve[checked] .wx-radio-input,
-switch.mauve.checked .uni-switch-input,
-checkbox.mauve.checked .uni-checkbox-input,
-radio.mauve.checked .uni-radio-input {
-	background-color: #9c26b0 !important;
-	border-color: #9c26b0 !important;
-	color: #ffffff !important;
-}
-
-switch.pink[checked] .wx-switch-input,
-checkbox.pink[checked] .wx-checkbox-input,
-radio.pink[checked] .wx-radio-input,
-switch.pink.checked .uni-switch-input,
-checkbox.pink.checked .uni-checkbox-input,
-radio.pink.checked .uni-radio-input {
-	background-color: #e03997 !important;
-	border-color: #e03997 !important;
-	color: #ffffff !important;
-}
-
-switch.brown[checked] .wx-switch-input,
-checkbox.brown[checked] .wx-checkbox-input,
-radio.brown[checked] .wx-radio-input,
-switch.brown.checked .uni-switch-input,
-checkbox.brown.checked .uni-checkbox-input,
-radio.brown.checked .uni-radio-input {
-	background-color: #a5673f !important;
-	border-color: #a5673f !important;
-	color: #ffffff !important;
-}
-
-switch.grey[checked] .wx-switch-input,
-checkbox.grey[checked] .wx-checkbox-input,
-radio.grey[checked] .wx-radio-input,
-switch.grey.checked .uni-switch-input,
-checkbox.grey.checked .uni-checkbox-input,
-radio.grey.checked .uni-radio-input {
-	background-color: #8799a3 !important;
-	border-color: #8799a3 !important;
-	color: #ffffff !important;
-}
-
-switch.gray[checked] .wx-switch-input,
-checkbox.gray[checked] .wx-checkbox-input,
-radio.gray[checked] .wx-radio-input,
-switch.gray.checked .uni-switch-input,
-checkbox.gray.checked .uni-checkbox-input,
-radio.gray.checked .uni-radio-input {
-	background-color: #f0f0f0 !important;
-	border-color: #f0f0f0 !important;
-	color: #333333 !important;
-}
-
-switch.black[checked] .wx-switch-input,
-checkbox.black[checked] .wx-checkbox-input,
-radio.black[checked] .wx-radio-input,
-switch.black.checked .uni-switch-input,
-checkbox.black.checked .uni-checkbox-input,
-radio.black.checked .uni-radio-input {
-	background-color: #333333 !important;
-	border-color: #333333 !important;
-	color: #ffffff !important;
-}
-
-switch.white[checked] .wx-switch-input,
-checkbox.white[checked] .wx-checkbox-input,
-radio.white[checked] .wx-radio-input,
-switch.white.checked .uni-switch-input,
-checkbox.white.checked .uni-checkbox-input,
-radio.white.checked .uni-radio-input {
-	background-color: #ffffff !important;
-	border-color: #ffffff !important;
-	color: #333333 !important;
-}
-
-/* ==================
-          边框
- ==================== */
-
-/* -- 实线 -- */
-
-.solid,
-.solid-top,
-.solid-right,
-.solid-bottom,
-.solid-left,
-.solids,
-.solids-top,
-.solids-right,
-.solids-bottom,
-.solids-left,
-.dashed,
-.dashed-top,
-.dashed-right,
-.dashed-bottom,
-.dashed-left {
-	position: relative;
-}
-
-.solid::after,
-.solid-top::after,
-.solid-right::after,
-.solid-bottom::after,
-.solid-left::after,
-.solids::after,
-.solids-top::after,
-.solids-right::after,
-.solids-bottom::after,
-.solids-left::after,
-.dashed::after,
-.dashed-top::after,
-.dashed-right::after,
-.dashed-bottom::after,
-.dashed-left::after {
-	content: " ";
-	width: 200%;
-	height: 200%;
-	position: absolute;
-	top: 0;
-	left: 0;
-	border-radius: inherit;
-	transform: scale(0.5);
-	transform-origin: 0 0;
-	pointer-events: none;
-	box-sizing: border-box;
-}
-
-.solid::after {
-	border: 1rpx solid rgba(0, 0, 0, 0.1);
-}
-
-.solid-top::after {
-	border-top: 1rpx solid rgba(0, 0, 0, 0.1);
-}
-
-.solid-right::after {
-	border-right: 1rpx solid rgba(0, 0, 0, 0.1);
-}
-
-.solid-bottom::after {
-	border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
-}
-
-.solid-left::after {
-	border-left: 1rpx solid rgba(0, 0, 0, 0.1);
-}
-
-.solids::after {
-	border: 8rpx solid #eee;
-}
-
-.solids-top::after {
-	border-top: 8rpx solid #eee;
-}
-
-.solids-right::after {
-	border-right: 8rpx solid #eee;
-}
-
-.solids-bottom::after {
-	border-bottom: 8rpx solid #eee;
-}
-
-.solids-left::after {
-	border-left: 8rpx solid #eee;
-}
-
-/* -- 虚线 -- */
-
-.dashed::after {
-	border: 1rpx dashed #ddd;
-}
-
-.dashed-top::after {
-	border-top: 1rpx dashed #ddd;
-}
-
-.dashed-right::after {
-	border-right: 1rpx dashed #ddd;
-}
-
-.dashed-bottom::after {
-	border-bottom: 1rpx dashed #ddd;
-}
-
-.dashed-left::after {
-	border-left: 1rpx dashed #ddd;
-}
-
-/* -- 阴影 -- */
-
-.shadow[class*='white'] {
-	--ShadowSize: 0 1rpx 6rpx;
-}
-
-.shadow-lg {
-	--ShadowSize: 0rpx 40rpx 100rpx 0rpx;
-}
-
-.shadow-warp {
-	position: relative;
-	box-shadow: 0 0 10rpx rgba(0, 0, 0, 0.1);
-}
-
-.shadow-warp:before,
-.shadow-warp:after {
-	position: absolute;
-	content: "";
-	top: 20rpx;
-	bottom: 30rpx;
-	left: 20rpx;
-	width: 50%;
-	box-shadow: 0 30rpx 20rpx rgba(0, 0, 0, 0.2);
-	transform: rotate(-3deg);
-	z-index: -1;
-}
-
-.shadow-warp:after {
-	right: 20rpx;
-	left: auto;
-	transform: rotate(3deg);
-}
-
-.shadow-blur {
-	position: relative;
-}
-
-.shadow-blur::before {
-	content: "";
-	display: block;
-	background: inherit;
-	filter: blur(10rpx);
-	position: absolute;
-	width: 100%;
-	height: 100%;
-	top: 10rpx;
-	left: 10rpx;
-	z-index: -1;
-	opacity: 0.4;
-	transform-origin: 0 0;
-	border-radius: inherit;
-	transform: scale(1, 1);
-}
-
-/* ==================
-          按钮
- ==================== */
-
-.cu-btn {
-	position: relative;
-	border: 0rpx;
-	display: inline-flex;
-	align-items: center;
-	justify-content: center;
-	box-sizing: border-box;
-	padding: 0 30rpx;
-	font-size: 28rpx;
-	height: 64rpx;
-	line-height: 1;
-	text-align: center;
-	text-decoration: none;
-	overflow: visible;
-	margin-left: initial;
-	transform: translate(0rpx, 0rpx);
-	margin-right: initial;
-}
-
-.cu-btn::after {
-	display: none;
-}
-
-.cu-btn:not([class*="bg-"]) {
-	background-color: #f0f0f0;
-}
-
-.cu-btn[class*="line"] {
-	background-color: transparent;
-}
-
-.cu-btn[class*="line"]::after {
-	content: " ";
-	display: block;
-	width: 200%;
-	height: 200%;
-	position: absolute;
-	top: 0;
-	left: 0;
-	border: 1rpx solid currentColor;
-	transform: scale(0.5);
-	transform-origin: 0 0;
-	box-sizing: border-box;
-	border-radius: 12rpx;
-	z-index: 1;
-	pointer-events: none;
-}
-
-.cu-btn.round[class*="line"]::after {
-	border-radius: 1000rpx;
-}
-
-.cu-btn[class*="lines"]::after {
-	border: 6rpx solid currentColor;
-}
-
-.cu-btn[class*="bg-"]::after {
-	display: none;
-}
-
-.cu-btn.sm {
-	padding: 0 20rpx;
-	font-size: 20rpx;
-	height: 48rpx;
-}
-
-.cu-btn.lg {
-	padding: 0 40rpx;
-	font-size: 32rpx;
-	height: 80rpx;
-}
-
-.cu-btn.cuIcon.sm {
-	width: 48rpx;
-	height: 48rpx;
-}
-
-.cu-btn.cuIcon {
-	width: 64rpx;
-	height: 64rpx;
-	border-radius: 500rpx;
-	padding: 0;
-}
-
-button.cuIcon.lg {
-	width: 80rpx;
-	height: 80rpx;
-}
-
-.cu-btn.shadow-blur::before {
-	top: 4rpx;
-	left: 4rpx;
-	filter: blur(6rpx);
-	opacity: 0.6;
-}
-
-.cu-btn.button-hover {
-	transform: translate(1rpx, 1rpx);
-}
-
-.block {
-	display: block;
-}
-
-.cu-btn.block {
-	display: flex;
-}
-
-.cu-btn[disabled] {
-	opacity: 0.6;
-	color: #ffffff;
-}
-
-/* ==================
-          徽章
- ==================== */
-
-.cu-tag {
-	font-size: 24rpx;
-	vertical-align: middle;
-	position: relative;
-	display: inline-flex;
-	align-items: center;
-	justify-content: center;
-	box-sizing: border-box;
-	padding: 0rpx 16rpx;
-	height: 48rpx;
-	font-family: Helvetica Neue, Helvetica, sans-serif;
-	white-space: nowrap;
-}
-
-.cu-tag:not([class*="bg"]):not([class*="line"]) {
-	background-color: #f1f1f1;
-}
-
-.cu-tag[class*="line-"]::after {
-	content: " ";
-	width: 200%;
-	height: 200%;
-	position: absolute;
-	top: 0;
-	left: 0;
-	border: 1rpx solid currentColor;
-	transform: scale(0.5);
-	transform-origin: 0 0;
-	box-sizing: border-box;
-	border-radius: inherit;
-	z-index: 1;
-	pointer-events: none;
-}
-
-.cu-tag.radius[class*="line"]::after {
-	border-radius: 12rpx;
-}
-
-.cu-tag.round[class*="line"]::after {
-	border-radius: 1000rpx;
-}
-
-.cu-tag[class*="line-"]::after {
-	border-radius: 0;
-}
-
-.cu-tag+.cu-tag {
-	margin-left: 10rpx;
-}
-
-.cu-tag.sm {
-	font-size: 20rpx;
-	padding: 0rpx 12rpx;
-	height: 32rpx;
-}
-
-.cu-capsule {
-	display: inline-flex;
-	vertical-align: middle;
-}
-
-.cu-capsule+.cu-capsule {
-	margin-left: 10rpx;
-}
-
-.cu-capsule .cu-tag {
-	margin: 0;
-}
-
-.cu-capsule .cu-tag[class*="line-"]:last-child::after {
-	border-left: 0rpx solid transparent;
-}
-
-.cu-capsule .cu-tag[class*="line-"]:first-child::after {
-	border-right: 0rpx solid transparent;
-}
-
-.cu-capsule.radius .cu-tag:first-child {
-	border-top-left-radius: 6rpx;
-	border-bottom-left-radius: 6rpx;
-}
-
-.cu-capsule.radius .cu-tag:last-child::after,
-.cu-capsule.radius .cu-tag[class*="line-"] {
-	border-top-right-radius: 12rpx;
-	border-bottom-right-radius: 12rpx;
-}
-
-.cu-capsule.round .cu-tag:first-child {
-	border-top-left-radius: 200rpx;
-	border-bottom-left-radius: 200rpx;
-	text-indent: 4rpx;
-}
-
-.cu-capsule.round .cu-tag:last-child::after,
-.cu-capsule.round .cu-tag:last-child {
-	border-top-right-radius: 200rpx;
-	border-bottom-right-radius: 200rpx;
-	text-indent: -4rpx;
-}
-
-.cu-tag.badge {
-	border-radius: 200rpx;
-	position: absolute;
-	top: -10rpx;
-	right: -10rpx;
-	font-size: 20rpx;
-	padding: 0rpx 10rpx;
-	height: 28rpx;
-	color: #ffffff;
-}
-
-.cu-tag.badge:not([class*="bg-"]) {
-	background-color: #dd514c;
-}
-
-.cu-tag:empty:not([class*="cuIcon-"]) {
-	padding: 0rpx;
-	width: 16rpx;
-	height: 16rpx;
-	top: -4rpx;
-	right: -4rpx;
-}
-
-.cu-tag[class*="cuIcon-"] {
-	width: 32rpx;
-	height: 32rpx;
-	top: -4rpx;
-	right: -4rpx;
-}
-
-/* ==================
-          头像
- ==================== */
-
-.cu-avatar {
-	font-variant: small-caps;
-	margin: 0;
-	padding: 0;
-	display: inline-flex;
-	text-align: center;
-	justify-content: center;
-	align-items: center;
-	background-color: #ccc;
-	color: #ffffff;
-	white-space: nowrap;
-	position: relative;
-	width: 64rpx;
-	height: 64rpx;
-	background-size: cover;
-	background-position: center;
-	vertical-align: middle;
-	font-size: 1.5em;
-}
-
-.cu-avatar.sm {
-	width: 48rpx;
-	height: 48rpx;
-	font-size: 1em;
-}
-
-.cu-avatar.lg {
-	width: 96rpx;
-	height: 96rpx;
-	font-size: 2em;
-}
-
-.cu-avatar.xl {
-	width: 128rpx;
-	height: 128rpx;
-	font-size: 2.5em;
-}
-
-.cu-avatar .avatar-text {
-	font-size: 0.4em;
-}
-
-.cu-avatar-group {
-	direction: rtl;
-	unicode-bidi: bidi-override;
-	padding: 0 10rpx 0 40rpx;
-	display: inline-block;
-}
-
-.cu-avatar-group .cu-avatar {
-	margin-left: -30rpx;
-	border: 4rpx solid #f1f1f1;
-	vertical-align: middle;
-}
-
-.cu-avatar-group .cu-avatar.sm {
-	margin-left: -20rpx;
-	border: 1rpx solid #f1f1f1;
-}
-
-/* ==================
-         进度条
- ==================== */
-
-.cu-progress {
-	overflow: hidden;
-	height: 28rpx;
-	background-color: #ebeef5;
-	display: inline-flex;
-	align-items: center;
-	width: 100%;
-}
-
-.cu-progress+view,
-.cu-progress+text {
-	line-height: 1;
-}
-
-.cu-progress.xs {
-	height: 10rpx;
-}
-
-.cu-progress.sm {
-	height: 20rpx;
-}
-
-.cu-progress view {
-	width: 0;
-	height: 100%;
-	align-items: center;
-	display: flex;
-	justify-items: flex-end;
-	justify-content: space-around;
-	font-size: 20rpx;
-	color: #ffffff;
-	transition: width 0.6s ease;
-}
-
-.cu-progress text {
-	align-items: center;
-	display: flex;
-	font-size: 20rpx;
-	color: #333333;
-	text-indent: 10rpx;
-}
-
-.cu-progress.text-progress {
-	padding-right: 60rpx;
-}
-
-.cu-progress.striped view {
-	background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
-	background-size: 72rpx 72rpx;
-}
-
-.cu-progress.active view {
-	animation: progress-stripes 2s linear infinite;
-}
-
-@keyframes progress-stripes {
-	from {
-		background-position: 72rpx 0;
-	}
-
-	to {
-		background-position: 0 0;
-	}
-}
-
-/* ==================
-          加载
- ==================== */
-
-.cu-load {
-	display: block;
-	line-height: 3em;
-	text-align: center;
-}
-
-.cu-load::before {
-	font-family: "cuIcon";
-	display: inline-block;
-	margin-right: 6rpx;
-}
-
-.cu-load.loading::before {
-	content: "\e67a";
-	animation: cuIcon-spin 2s infinite linear;
-}
-
-.cu-load.loading::after {
-	content: "加载中...";
-}
-
-.cu-load.over::before {
-	content: "\e64a";
-}
-
-.cu-load.over::after {
-	content: "没有更多了";
-}
-
-.cu-load.erro::before {
-	content: "\e658";
-}
-
-.cu-load.erro::after {
-	content: "加载失败";
-}
-
-.cu-load.load-cuIcon::before {
-	font-size: 32rpx;
-}
-
-.cu-load.load-cuIcon::after {
-	display: none;
-}
-
-.cu-load.load-cuIcon.over {
-	display: none;
-}
-
-.cu-load.load-modal {
-	position: fixed;
-	top: 0;
-	right: 0;
-	bottom: 140rpx;
-	left: 0;
-	margin: auto;
-	width: 260rpx;
-	height: 260rpx;
-	background-color: #ffffff;
-	border-radius: 10rpx;
-	box-shadow: 0 0 0rpx 2000rpx rgba(0, 0, 0, 0.5);
-	display: flex;
-	align-items: center;
-	flex-direction: column;
-	justify-content: center;
-	font-size: 28rpx;
-	z-index: 9999;
-	line-height: 2.4em;
-}
-
-.cu-load.load-modal [class*="cuIcon-"] {
-	font-size: 60rpx;
-}
-
-.cu-load.load-modal image {
-	width: 70rpx;
-	height: 70rpx;
-}
-
-.cu-load.load-modal::after {
-	content: "";
-	position: absolute;
-	background-color: #ffffff;
-	border-radius: 50%;
-	width: 200rpx;
-	height: 200rpx;
-	font-size: 10px;
-	border-top: 6rpx solid rgba(0, 0, 0, 0.05);
-	border-right: 6rpx solid rgba(0, 0, 0, 0.05);
-	border-bottom: 6rpx solid rgba(0, 0, 0, 0.05);
-	border-left: 6rpx solid #f37b1d;
-	animation: cuIcon-spin 1s infinite linear;
-	z-index: -1;
-}
-
-.load-progress {
-	pointer-events: none;
-	top: 0;
-	position: fixed;
-	width: 100%;
-	left: 0;
-	z-index: 2000;
-}
-
-.load-progress.hide {
-	display: none;
-}
-
-.load-progress .load-progress-bar {
-	position: relative;
-	width: 100%;
-	height: 4rpx;
-	overflow: hidden;
-	transition: all 200ms ease 0s;
-}
-
-.load-progress .load-progress-spinner {
-	position: absolute;
-	top: 10rpx;
-	right: 10rpx;
-	z-index: 2000;
-	display: block;
-}
-
-.load-progress .load-progress-spinner::after {
-	content: "";
-	display: block;
-	width: 24rpx;
-	height: 24rpx;
-	-webkit-box-sizing: border-box;
-	box-sizing: border-box;
-	border: solid 4rpx transparent;
-	border-top-color: inherit;
-	border-left-color: inherit;
-	border-radius: 50%;
-	-webkit-animation: load-progress-spinner 0.4s linear infinite;
-	animation: load-progress-spinner 0.4s linear infinite;
-}
-
-@-webkit-keyframes load-progress-spinner {
-	0% {
-		-webkit-transform: rotate(0);
-		transform: rotate(0);
-	}
-
-	100% {
-		-webkit-transform: rotate(360deg);
-		transform: rotate(360deg);
-	}
-}
-
-@keyframes load-progress-spinner {
-	0% {
-		-webkit-transform: rotate(0);
-		transform: rotate(0);
-	}
-
-	100% {
-		-webkit-transform: rotate(360deg);
-		transform: rotate(360deg);
-	}
-}
-
-/* ==================
-          列表
- ==================== */
-.grayscale {
-	filter: grayscale(1);
-}
-
-.cu-list+.cu-list {
-	margin-top: 30rpx
-}
-
-.cu-list>.cu-item {
-	transition: all .6s ease-in-out 0s;
-	transform: translateX(0rpx)
-}
-
-.cu-list>.cu-item.move-cur {
-	transform: translateX(-260rpx)
-}
-
-.cu-list>.cu-item .move {
-	position: absolute;
-	right: 0;
-	display: flex;
-	width: 260rpx;
-	height: 100%;
-	transform: translateX(100%)
-}
-
-.cu-list>.cu-item .move view {
-	display: flex;
-	flex: 1;
-	justify-content: center;
-	align-items: center
-}
-
-.cu-list.menu-avatar {
-	overflow: hidden;
-}
-
-.cu-list.menu-avatar>.cu-item {
-	position: relative;
-	display: flex;
-	padding-right: 10rpx;
-	height: 140rpx;
-	background-color: #ffffff;
-	justify-content: flex-end;
-	align-items: center
-}
-
-.cu-list.menu-avatar>.cu-item>.cu-avatar {
-	position: absolute;
-	left: 30rpx
-}
-
-.cu-list.menu-avatar>.cu-item .flex .text-cut {
-	max-width: 510rpx
-}
-
-.cu-list.menu-avatar>.cu-item .content {
-	position: absolute;
-	left: 146rpx;
-	width: calc(100% - 96rpx - 60rpx - 120rpx - 20rpx);
-	line-height: 1.6em;
-}
-
-.cu-list.menu-avatar>.cu-item .content.flex-sub {
-	width: calc(100% - 96rpx - 60rpx - 20rpx);
-}
-
-.cu-list.menu-avatar>.cu-item .content>view:first-child {
-	font-size: 30rpx;
-	display: flex;
-	align-items: center
-}
-
-.cu-list.menu-avatar>.cu-item .content .cu-tag.sm {
-	display: inline-block;
-	margin-left: 10rpx;
-	height: 28rpx;
-	font-size: 16rpx;
-	line-height: 32rpx
-}
-
-.cu-list.menu-avatar>.cu-item .action {
-	width: 100rpx;
-	text-align: center
-}
-
-.cu-list.menu-avatar>.cu-item .action view+view {
-	margin-top: 10rpx
-}
-
-.cu-list.menu-avatar.comment>.cu-item .content {
-	position: relative;
-	left: 0;
-	width: auto;
-	flex: 1;
-}
-
-.cu-list.menu-avatar.comment>.cu-item {
-	padding: 30rpx 30rpx 30rpx 120rpx;
-	height: auto
-}
-
-.cu-list.menu-avatar.comment .cu-avatar {
-	align-self: flex-start
-}
-
-.cu-list.menu>.cu-item {
-	position: relative;
-	display: flex;
-	padding: 0 30rpx;
-	min-height: 100rpx;
-	background-color: #ffffff;
-	justify-content: space-between;
-	align-items: center
-}
-
-.cu-list.menu>.cu-item:last-child:after {
-	border: none
-}
-
-.cu-list.menu-avatar>.cu-item:after,
-.cu-list.menu>.cu-item:after {
-	position: absolute;
-	top: 0;
-	left: 0;
-	box-sizing: border-box;
-	width: 200%;
-	height: 200%;
-	border-bottom: 1rpx solid #ddd;
-	border-radius: inherit;
-	content: " ";
-	transform: scale(.5);
-	transform-origin: 0 0;
-	pointer-events: none
-}
-
-.cu-list.menu>.cu-item.grayscale {
-	background-color: #f5f5f5
-}
-
-.cu-list.menu>.cu-item.cur {
-	background-color: #fcf7e9
-}
-
-.cu-list.menu>.cu-item.arrow {
-	padding-right: 90rpx
-}
-
-.cu-list.menu>.cu-item.arrow:before {
-	position: absolute;
-	top: 0;
-	right: 30rpx;
-	bottom: 0;
-	display: block;
-	margin: auto;
-	width: 30rpx;
-	height: 30rpx;
-	color: #8799a3;
-	content: "\e6a3";
-	text-align: center;
-	font-size: 34rpx;
-	font-family: cuIcon;
-	line-height: 30rpx
-}
-
-.cu-list.menu>.cu-item button.content {
-	padding: 0;
-	background-color: transparent;
-	justify-content: flex-start
-}
-
-.cu-list.menu>.cu-item button.content:after {
-	display: none
-}
-
-.cu-list.menu>.cu-item .cu-avatar-group .cu-avatar {
-	border-color: #ffffff
-}
-
-.cu-list.menu>.cu-item .content>view:first-child {
-	display: flex;
-	align-items: center
-}
-
-.cu-list.menu>.cu-item .content>text[class*=cuIcon] {
-	display: inline-block;
-	margin-right: 10rpx;
-	width: 1.6em;
-	text-align: center
-}
-
-.cu-list.menu>.cu-item .content>image {
-	display: inline-block;
-	margin-right: 10rpx;
-	width: 1.6em;
-	height: 1.6em;
-	vertical-align: middle
-}
-
-.cu-list.menu>.cu-item .content {
-	font-size: 30rpx;
-	line-height: 1.6em;
-	flex: 1
-}
-
-.cu-list.menu>.cu-item .content .cu-tag.sm {
-	display: inline-block;
-	margin-left: 10rpx;
-	height: 28rpx;
-	font-size: 16rpx;
-	line-height: 32rpx
-}
-
-.cu-list.menu>.cu-item .action .cu-tag:empty {
-	right: 10rpx
-}
-
-.cu-list.menu {
-	display: block;
-	overflow: hidden
-}
-
-.cu-list.menu.sm-border>.cu-item:after {
-	left: 30rpx;
-	width: calc(200% - 120rpx)
-}
-
-.cu-list.grid>.cu-item {
-	position: relative;
-	display: flex;
-	padding: 20rpx 0 30rpx;
-	transition-duration: 0s;
-	flex-direction: column
-}
-
-.cu-list.grid>.cu-item:after {
-	position: absolute;
-	top: 0;
-	left: 0;
-	box-sizing: border-box;
-	width: 200%;
-	height: 200%;
-	border-right: 1px solid rgba(0, 0, 0, .1);
-	border-bottom: 1px solid rgba(0, 0, 0, .1);
-	border-radius: inherit;
-	content: " ";
-	transform: scale(.5);
-	transform-origin: 0 0;
-	pointer-events: none
-}
-
-.cu-list.grid>.cu-item text {
-	display: block;
-	margin-top: 10rpx;
-	color: #888;
-	font-size: 26rpx;
-	line-height: 40rpx
-}
-
-.cu-list.grid>.cu-item [class*=cuIcon] {
-	position: relative;
-	display: block;
-	margin-top: 20rpx;
-	width: 100%;
-	font-size: 48rpx
-}
-
-.cu-list.grid>.cu-item .cu-tag {
-	right: auto;
-	left: 50%;
-	margin-left: 20rpx
-}
-
-.cu-list.grid {
-	background-color: #ffffff;
-	text-align: center
-}
-
-.cu-list.grid.no-border>.cu-item {
-	padding-top: 10rpx;
-	padding-bottom: 20rpx
-}
-
-.cu-list.grid.no-border>.cu-item:after {
-	border: none
-}
-
-.cu-list.grid.no-border {
-	padding: 20rpx 10rpx
-}
-
-.cu-list.grid.col-3>.cu-item:nth-child(3n):after,
-.cu-list.grid.col-4>.cu-item:nth-child(4n):after,
-.cu-list.grid.col-5>.cu-item:nth-child(5n):after {
-	border-right-width: 0
-}
-
-.cu-list.card-menu {
-	overflow: hidden;
-	margin-right: 30rpx;
-	margin-left: 30rpx;
-	border-radius: 20rpx
-}
-
-
-/* ==================
-          操作条
- ==================== */
-
-.cu-bar {
-	display: flex;
-	position: relative;
-	align-items: center;
-	min-height: 100rpx;
-	justify-content: space-between;
-}
-
-.cu-bar .action {
-	display: flex;
-	align-items: center;
-	height: 100%;
-	justify-content: center;
-	max-width: 100%;
-}
-
-.cu-bar .action.border-title {
-	position: relative;
-	top: -10rpx;
-}
-
-.cu-bar .action.border-title text[class*="bg-"]:last-child {
-	position: absolute;
-	bottom: -0.5rem;
-	min-width: 2rem;
-	height: 6rpx;
-	left: 0;
-}
-
-.cu-bar .action.sub-title {
-	position: relative;
-	top: -0.2rem;
-}
-
-.cu-bar .action.sub-title text {
-	position: relative;
-	z-index: 1;
-}
-
-.cu-bar .action.sub-title text[class*="bg-"]:last-child {
-	position: absolute;
-	display: inline-block;
-	bottom: -0.2rem;
-	border-radius: 6rpx;
-	width: 100%;
-	height: 0.6rem;
-	left: 0.6rem;
-	opacity: 0.3;
-	z-index: 0;
-}
-
-.cu-bar .action.sub-title text[class*="text-"]:last-child {
-	position: absolute;
-	display: inline-block;
-	bottom: -0.7rem;
-	left: 0.5rem;
-	opacity: 0.2;
-	z-index: 0;
-	text-align: right;
-	font-weight: 900;
-	font-size: 36rpx;
-}
-
-.cu-bar.justify-center .action.border-title text:last-child,
-.cu-bar.justify-center .action.sub-title text:last-child {
-	left: 0;
-	right: 0;
-	margin: auto;
-	text-align: center;
-}
-
-.cu-bar .action:first-child {
-	margin-left: 30rpx;
-	font-size: 30rpx;
-}
-
-.cu-bar .action text.text-cut {
-	text-align: left;
-	width: 100%;
-}
-
-.cu-bar .cu-avatar:first-child {
-	margin-left: 20rpx;
-}
-
-.cu-bar .action:first-child>text[class*="cuIcon-"] {
-	margin-left: -0.3em;
-	margin-right: 0.3em;
-}
-
-.cu-bar .action:last-child {
-	margin-right: 30rpx;
-}
-
-.cu-bar .action>text[class*="cuIcon-"],
-.cu-bar .action>view[class*="cuIcon-"] {
-	font-size: 36rpx;
-}
-
-.cu-bar .action>text[class*="cuIcon-"]+text[class*="cuIcon-"] {
-	margin-left: 0.5em;
-}
-
-.cu-bar .content {
-	position: absolute;
-	text-align: center;
-	width: calc(100% - 340rpx);
-	left: 0;
-	right: 0;
-	bottom: 0;
-	top: 0;
-	margin: auto;
-	height: 60rpx;
-	font-size: 32rpx;
-	line-height: 60rpx;
-	cursor: none;
-	pointer-events: none;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-	overflow: hidden;
-}
-
-.cu-bar.ios .content {
-	bottom: 7px;
-	height: 30px;
-	font-size: 32rpx;
-	line-height: 30px;
-}
-
-.cu-bar.btn-group {
-	justify-content: space-around;
-}
-
-.cu-bar.btn-group button {
-	padding: 20rpx 32rpx;
-}
-
-.cu-bar.btn-group button {
-	flex: 1;
-	margin: 0 20rpx;
-	max-width: 50%;
-}
-
-.cu-bar .search-form {
-	background-color: #f5f5f5;
-	line-height: 64rpx;
-	height: 64rpx;
-	font-size: 24rpx;
-	color: #333333;
-	flex: 1;
-	display: flex;
-	align-items: center;
-	margin: 0 30rpx;
-}
-
-.cu-bar .search-form+.action {
-	margin-right: 30rpx;
-}
-
-.cu-bar .search-form input {
-	flex: 1;
-	padding-right: 30rpx;
-	height: 64rpx;
-	line-height: 64rpx;
-	font-size: 26rpx;
-	background-color: transparent;
-}
-
-.cu-bar .search-form [class*="cuIcon-"] {
-	margin: 0 0.5em 0 0.8em;
-}
-
-.cu-bar .search-form [class*="cuIcon-"]::before {
-	top: 0rpx;
-}
-
-.cu-bar.fixed,
-.nav.fixed {
-	position: fixed;
-	width: 100%;
-	top: 0;
-	z-index: 1024;
-	box-shadow: 0 1rpx 6rpx rgba(0, 0, 0, 0.1);
-}
-
-.cu-bar.foot {
-	position: fixed;
-	width: 100%;
-	bottom: 0;
-	z-index: 1024;
-	box-shadow: 0 -1rpx 6rpx rgba(0, 0, 0, 0.1);
-}
-
-.cu-bar.tabbar {
-	padding: 0;
-	height: calc(100rpx + env(safe-area-inset-bottom) / 2);
-	padding-bottom: calc(env(safe-area-inset-bottom) / 2);
-}
-
-.cu-tabbar-height {
-	min-height: 100rpx;
-	height: calc(100rpx + env(safe-area-inset-bottom) / 2);
-}
-
-.cu-bar.tabbar.shadow {
-	box-shadow: 0 -1rpx 6rpx rgba(0, 0, 0, 0.1);
-}
-
-.cu-bar.tabbar .action {
-	font-size: 22rpx;
-	position: relative;
-	flex: 1;
-	text-align: center;
-	padding: 0;
-	display: block;
-	height: auto;
-	line-height: 1;
-	margin: 0;
-	background-color: inherit;
-	overflow: initial;
-}
-
-.cu-bar.tabbar.shop .action {
-	width: 140rpx;
-	flex: initial;
-}
-
-.cu-bar.tabbar .action.add-action {
-	position: relative;
-	z-index: 2;
-	padding-top: 50rpx;
-}
-
-.cu-bar.tabbar .action.add-action [class*="cuIcon-"] {
-	position: absolute;
-	width: 70rpx;
-	z-index: 2;
-	height: 70rpx;
-	border-radius: 50%;
-	line-height: 70rpx;
-	font-size: 50rpx;
-	top: -35rpx;
-	left: 0;
-	right: 0;
-	margin: auto;
-	padding: 0;
-}
-
-.cu-bar.tabbar .action.add-action::after {
-	content: "";
-	position: absolute;
-	width: 100rpx;
-	height: 100rpx;
-	top: -50rpx;
-	left: 0;
-	right: 0;
-	margin: auto;
-	box-shadow: 0 -3rpx 8rpx rgba(0, 0, 0, 0.08);
-	border-radius: 50rpx;
-	background-color: inherit;
-	z-index: 0;
-}
-
-.cu-bar.tabbar .action.add-action::before {
-	content: "";
-	position: absolute;
-	width: 100rpx;
-	height: 30rpx;
-	bottom: 30rpx;
-	left: 0;
-	right: 0;
-	margin: auto;
-	background-color: inherit;
-	z-index: 1;
-}
-
-.cu-bar.tabbar .btn-group {
-	flex: 1;
-	display: flex;
-	justify-content: space-around;
-	align-items: center;
-	padding: 0 10rpx;
-}
-
-.cu-bar.tabbar button.action::after {
-	border: 0;
-}
-
-.cu-bar.tabbar .action [class*="cuIcon-"] {
-	width: 100rpx;
-	position: relative;
-	display: block;
-	height: auto;
-	margin: 0 auto 10rpx;
-	text-align: center;
-	font-size: 40rpx;
-}
-
-.cu-bar.tabbar .action .cuIcon-cu-image {
-	margin: 0 auto;
-}
-
-.cu-bar.tabbar .action .cuIcon-cu-image image {
-	width: 50rpx;
-	height: 50rpx;
-	display: inline-block;
-}
-
-.cu-bar.tabbar .submit {
-	align-items: center;
-	display: flex;
-	justify-content: center;
-	text-align: center;
-	position: relative;
-	flex: 2;
-	align-self: stretch;
-}
-
-.cu-bar.tabbar .submit:last-child {
-	flex: 2.6;
-}
-
-.cu-bar.tabbar .submit+.submit {
-	flex: 2;
-}
-
-.cu-bar.tabbar.border .action::before {
-	content: " ";
-	width: 200%;
-	height: 200%;
-	position: absolute;
-	top: 0;
-	left: 0;
-	transform: scale(0.5);
-	transform-origin: 0 0;
-	border-right: 1rpx solid rgba(0, 0, 0, 0.1);
-	z-index: 3;
-}
-
-.cu-bar.tabbar.border .action:last-child:before {
-	display: none;
-}
-
-.cu-bar.input {
-	padding-right: 20rpx;
-	background-color: #ffffff;
-}
-
-.cu-bar.input input {
-	overflow: initial;
-	line-height: 64rpx;
-	height: 64rpx;
-	min-height: 64rpx;
-	flex: 1;
-	font-size: 30rpx;
-	margin: 0 20rpx;
-}
-
-.cu-bar.input .action {
-	margin-left: 20rpx;
-}
-
-.cu-bar.input .action [class*="cuIcon-"] {
-	font-size: 48rpx;
-}
-
-.cu-bar.input input+.action {
-	margin-right: 20rpx;
-	margin-left: 0rpx;
-}
-
-.cu-bar.input .action:first-child [class*="cuIcon-"] {
-	margin-left: 0rpx;
-}
-
-.cu-custom {
-	display: block;
-	position: relative;
-}
-
-.cu-custom .cu-bar .content {
-	width: calc(100% - 440rpx);
-}
-
-/* #ifdef MP-ALIPAY */
-.cu-custom .cu-bar .action .cuIcon-back {
-	opacity: 0;
-}
-
-/* #endif */
-
-.cu-custom .cu-bar .content image {
-	height: 60rpx;
-	width: 240rpx;
-}
-
-.cu-custom .cu-bar {
-	min-height: 0px;
-	/* #ifdef MP-WEIXIN */
-	padding-right: 220rpx;
-	/* #endif */
-	/* #ifdef MP-ALIPAY */
-	padding-right: 150rpx;
-	/* #endif */
-	box-shadow: 0rpx 0rpx 0rpx;
-	z-index: 9999;
-}
-
-.cu-custom .cu-bar .border-custom {
-	position: relative;
-	background: rgba(0, 0, 0, 0.15);
-	border-radius: 1000rpx;
-	height: 30px;
-}
-
-.cu-custom .cu-bar .border-custom::after {
-	content: " ";
-	width: 200%;
-	height: 200%;
-	position: absolute;
-	top: 0;
-	left: 0;
-	border-radius: inherit;
-	transform: scale(0.5);
-	transform-origin: 0 0;
-	pointer-events: none;
-	box-sizing: border-box;
-	border: 1rpx solid #ffffff;
-	opacity: 0.5;
-}
-
-.cu-custom .cu-bar .border-custom::before {
-	content: " ";
-	width: 1rpx;
-	height: 110%;
-	position: absolute;
-	top: 22.5%;
-	left: 0;
-	right: 0;
-	margin: auto;
-	transform: scale(0.5);
-	transform-origin: 0 0;
-	pointer-events: none;
-	box-sizing: border-box;
-	opacity: 0.6;
-	background-color: #ffffff;
-}
-
-.cu-custom .cu-bar .border-custom text {
-	display: block;
-	flex: 1;
-	margin: auto !important;
-	text-align: center;
-	font-size: 34rpx;
-}
-
-/* ==================
-         导航栏
- ==================== */
-
-.nav {
-	white-space: nowrap;
-}
-
-::-webkit-scrollbar {
-	display: none;
-}
-
-.nav .cu-item {
-	height: 90rpx;
-	display: inline-block;
-	line-height: 90rpx;
-	margin: 0 10rpx;
-	padding: 0 20rpx;
-}
-
-.nav .cu-item.cur {
-	border-bottom: 4rpx solid;
-}
-
-/* ==================
-         时间轴
- ==================== */
-
-.cu-timeline {
-	display: block;
-	background-color: #ffffff;
-}
-
-.cu-timeline .cu-time {
-	width: 120rpx;
-	text-align: center;
-	padding: 20rpx 0;
-	font-size: 26rpx;
-	color: #888;
-	display: block;
-}
-
-.cu-timeline>.cu-item {
-	padding: 30rpx 30rpx 30rpx 120rpx;
-	position: relative;
-	display: block;
-	z-index: 0;
-}
-
-.cu-timeline>.cu-item:not([class*="text-"]) {
-	color: #ccc;
-}
-
-.cu-timeline>.cu-item::after {
-	content: "";
-	display: block;
-	position: absolute;
-	width: 1rpx;
-	background-color: #ddd;
-	left: 60rpx;
-	height: 100%;
-	top: 0;
-	z-index: 8;
-}
-
-.cu-timeline>.cu-item::before {
-	font-family: "cuIcon";
-	display: block;
-	position: absolute;
-	top: 36rpx;
-	z-index: 9;
-	background-color: #ffffff;
-	width: 50rpx;
-	height: 50rpx;
-	text-align: center;
-	border: none;
-	line-height: 50rpx;
-	left: 36rpx;
-}
-
-.cu-timeline>.cu-item:not([class*="cuIcon-"])::before {
-	content: "\e763";
-}
-
-.cu-timeline>.cu-item[class*="cuIcon-"]::before {
-	background-color: #ffffff;
-	width: 50rpx;
-	height: 50rpx;
-	text-align: center;
-	border: none;
-	line-height: 50rpx;
-	left: 36rpx;
-}
-
-.cu-timeline>.cu-item>.content {
-	padding: 30rpx;
-	border-radius: 6rpx;
-	display: block;
-	line-height: 1.6;
-}
-
-.cu-timeline>.cu-item>.content:not([class*="bg-"]) {
-	background-color: #f1f1f1;
-	color: #333333;
-}
-
-.cu-timeline>.cu-item>.content+.content {
-	margin-top: 20rpx;
-}
-
-/* ==================
-         聊天
- ==================== */
-
-.cu-chat {
-	display: flex;
-	flex-direction: column;
-}
-
-.cu-chat .cu-item {
-	display: flex;
-	padding: 30rpx 30rpx 70rpx;
-	position: relative;
-}
-
-.cu-chat .cu-item>.cu-avatar {
-	width: 80rpx;
-	height: 80rpx;
-}
-
-.cu-chat .cu-item>.main {
-	max-width: calc(100% - 260rpx);
-	margin: 0 40rpx;
-	display: flex;
-	align-items: center;
-}
-
-.cu-chat .cu-item>image {
-	height: 320rpx;
-}
-
-.cu-chat .cu-item>.main .content {
-	padding: 20rpx;
-	border-radius: 6rpx;
-	display: inline-flex;
-	max-width: 100%;
-	align-items: center;
-	font-size: 30rpx;
-	position: relative;
-	min-height: 80rpx;
-	line-height: 40rpx;
-	text-align: left;
-}
-
-.cu-chat .cu-item>.main .content:not([class*="bg-"]) {
-	background-color: #ffffff;
-	color: #333333;
-}
-
-.cu-chat .cu-item .date {
-	position: absolute;
-	font-size: 24rpx;
-	color: #8799a3;
-	width: calc(100% - 320rpx);
-	bottom: 20rpx;
-	left: 160rpx;
-}
-
-.cu-chat .cu-item .action {
-	padding: 0 30rpx;
-	display: flex;
-	align-items: center;
-}
-
-.cu-chat .cu-item>.main .content::after {
-	content: "";
-	top: 27rpx;
-	transform: rotate(45deg);
-	position: absolute;
-	z-index: 100;
-	display: inline-block;
-	overflow: hidden;
-	width: 24rpx;
-	height: 24rpx;
-	left: -12rpx;
-	right: initial;
-	background-color: inherit;
-}
-
-.cu-chat .cu-item.self>.main .content::after {
-	left: auto;
-	right: -12rpx;
-}
-
-.cu-chat .cu-item>.main .content::before {
-	content: "";
-	top: 30rpx;
-	transform: rotate(45deg);
-	position: absolute;
-	z-index: -1;
-	display: inline-block;
-	overflow: hidden;
-	width: 24rpx;
-	height: 24rpx;
-	left: -12rpx;
-	right: initial;
-	background-color: inherit;
-	filter: blur(5rpx);
-	opacity: 0.3;
-}
-
-.cu-chat .cu-item>.main .content:not([class*="bg-"])::before {
-	background-color: #333333;
-	opacity: 0.1;
-}
-
-.cu-chat .cu-item.self>.main .content::before {
-	left: auto;
-	right: -12rpx;
-}
-
-.cu-chat .cu-item.self {
-	justify-content: flex-end;
-	text-align: right;
-}
-
-.cu-chat .cu-info {
-	display: inline-block;
-	margin: 20rpx auto;
-	font-size: 24rpx;
-	padding: 8rpx 12rpx;
-	background-color: rgba(0, 0, 0, 0.2);
-	border-radius: 6rpx;
-	color: #ffffff;
-	max-width: 400rpx;
-	line-height: 1.4;
-}
-
-/* ==================
-         卡片
- ==================== */
-
-.cu-card {
-	display: block;
-	overflow: hidden;
-}
-
-.cu-card>.cu-item {
-	display: block;
-	background-color: #ffffff;
-	overflow: hidden;
-	border-radius: 10rpx;
-	margin: 30rpx;
-}
-
-.cu-card>.cu-item.shadow-blur {
-	overflow: initial;
-}
-
-.cu-card.no-card>.cu-item {
-	margin: 0rpx;
-	border-radius: 0rpx;
-}
-
-.cu-card .grid.grid-square {
-	margin-bottom: -20rpx;
-}
-
-.cu-card.case .image {
-	position: relative;
-}
-
-.cu-card.case .image image {
-	width: 100%;
-}
-
-.cu-card.case .image .cu-tag {
-	position: absolute;
-	right: 0;
-	top: 0;
-}
-
-.cu-card.case .image .cu-bar {
-	position: absolute;
-	bottom: 0;
-	width: 100%;
-	background-color: transparent;
-	padding: 0rpx 30rpx;
-}
-
-.cu-card.case.no-card .image {
-	margin: 30rpx 30rpx 0;
-	overflow: hidden;
-	border-radius: 10rpx;
-}
-
-.cu-card.dynamic {
-	display: block;
-}
-
-.cu-card.dynamic>.cu-item {
-	display: block;
-	background-color: #ffffff;
-	overflow: hidden;
-}
-
-.cu-card.dynamic>.cu-item>.text-content {
-	padding: 0 30rpx 0;
-	max-height: 6.4em;
-	overflow: hidden;
-	font-size: 30rpx;
-	margin-bottom: 20rpx;
-}
-
-.cu-card.dynamic>.cu-item .square-img {
-	width: 100%;
-	height: 200rpx;
-	border-radius: 6rpx;
-}
-
-.cu-card.dynamic>.cu-item .only-img {
-	width: 100%;
-	height: 320rpx;
-	border-radius: 6rpx;
-}
-
-/* card.dynamic>.cu-item .comment {
-  padding: 20rpx;
-  background-color: #f1f1f1;
-  margin: 0 30rpx 30rpx;
-  border-radius: 6rpx;
-} */
-
-.cu-card.article {
-	display: block;
-}
-
-.cu-card.article>.cu-item {
-	padding-bottom: 30rpx;
-}
-
-.cu-card.article>.cu-item .title {
-	font-size: 30rpx;
-	font-weight: 900;
-	color: #333333;
-	line-height: 100rpx;
-	padding: 0 30rpx;
-}
-
-.cu-card.article>.cu-item .content {
-	display: flex;
-	padding: 0 30rpx;
-}
-
-.cu-card.article>.cu-item .content>image {
-	width: 240rpx;
-	height: 6.4em;
-	margin-right: 20rpx;
-	border-radius: 6rpx;
-}
-
-.cu-card.article>.cu-item .content .desc {
-	flex: 1;
-	display: flex;
-	flex-direction: column;
-	justify-content: space-between;
-}
-
-.cu-card.article>.cu-item .content .text-content {
-	font-size: 28rpx;
-	color: #888;
-	height: 4.8em;
-	overflow: hidden;
-}
-
-/* ==================
-         表单
- ==================== */
-
-.cu-form-group {
-	background-color: #ffffff;
-	padding: 1rpx 30rpx;
-	display: flex;
-	align-items: center;
-	min-height: 100rpx;
-	justify-content: space-between;
-}
-
-.cu-form-group+.cu-form-group {
-	border-top: 1rpx solid #eee;
-}
-
-.cu-form-group .title {
-	text-align: justify;
-	padding-right: 30rpx;
-	font-size: 30rpx;
-	position: relative;
-	height: 60rpx;
-	line-height: 60rpx;
-}
-
-.cu-form-group input {
-	flex: 1;
-	font-size: 30rpx;
-	color: #555;
-	padding-right: 20rpx;
-}
-
-.cu-form-group>text[class*="cuIcon-"] {
-	font-size: 36rpx;
-	padding: 0;
-	box-sizing: border-box;
-}
-
-.cu-form-group textarea {
-	margin: 32rpx 0 30rpx;
-	height: 4.6em;
-	width: 100%;
-	line-height: 1.2em;
-	flex: 1;
-	font-size: 28rpx;
-	padding: 0;
-}
-
-.cu-form-group.align-start .title {
-	height: 1em;
-	margin-top: 32rpx;
-	line-height: 1em;
-}
-
-.cu-form-group picker {
-	flex: 1;
-	padding-right: 40rpx;
-	overflow: hidden;
-	position: relative;
-}
-
-.cu-form-group picker .picker {
-	line-height: 100rpx;
-	font-size: 28rpx;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-	overflow: hidden;
-	width: 100%;
-	text-align: right;
-}
-
-.cu-form-group picker::after {
-	font-family: cuIcon;
-	display: block;
-	content: "\e6a3";
-	position: absolute;
-	font-size: 34rpx;
-	color: #8799a3;
-	line-height: 100rpx;
-	width: 60rpx;
-	text-align: center;
-	top: 0;
-	bottom: 0;
-	right: -20rpx;
-	margin: auto;
-}
-
-.cu-form-group textarea[disabled],
-.cu-form-group textarea[disabled] .placeholder {
-	color: transparent;
-}
-
-/* ==================
-         模态窗口
- ==================== */
-
-.cu-modal {
-	position: fixed;
-	top: 0;
-	right: 0;
-	bottom: 0;
-	left: 0;
-	z-index: 1110;
-	opacity: 0;
-	outline: 0;
-	text-align: center;
-	-ms-transform: scale(1.185);
-	transform: scale(1.185);
-	backface-visibility: hidden;
-	perspective: 2000rpx;
-	background: rgba(0, 0, 0, 0.6);
-	transition: all 0.3s ease-in-out 0s;
-	pointer-events: none;
-}
-
-.cu-modal::before {
-	content: "\200B";
-	display: inline-block;
-	height: 100%;
-	vertical-align: middle;
-}
-
-.cu-modal.show {
-	opacity: 1;
-	transition-duration: 0.3s;
-	-ms-transform: scale(1);
-	transform: scale(1);
-	overflow-x: hidden;
-	overflow-y: auto;
-	pointer-events: auto;
-}
-
-.cu-dialog {
-	position: relative;
-	display: inline-block;
-	vertical-align: middle;
-	margin-left: auto;
-	margin-right: auto;
-	width: 680rpx;
-	max-width: 100%;
-	background-color: #f8f8f8;
-	border-radius: 10rpx;
-	overflow: hidden;
-}
-
-.cu-modal.bottom-modal::before {
-	vertical-align: bottom;
-}
-
-.cu-modal.bottom-modal .cu-dialog {
-	width: 100%;
-	border-radius: 0;
-}
-
-.cu-modal.bottom-modal {
-	margin-bottom: -1000rpx;
-}
-
-.cu-modal.bottom-modal.show {
-	margin-bottom: 0;
-}
-
-.cu-modal.drawer-modal {
-	transform: scale(1);
-	display: flex;
-}
-
-.cu-modal.drawer-modal .cu-dialog {
-	height: 100%;
-	min-width: 200rpx;
-	border-radius: 0;
-	margin: initial;
-	transition-duration: 0.3s;
-}
-
-.cu-modal.drawer-modal.justify-start .cu-dialog {
-	transform: translateX(-100%);
-}
-
-.cu-modal.drawer-modal.justify-end .cu-dialog {
-	transform: translateX(100%);
-}
-
-.cu-modal.drawer-modal.show .cu-dialog {
-	transform: translateX(0%);
-}
-.cu-modal .cu-dialog>.cu-bar:first-child .action{
-  min-width: 100rpx;
-  margin-right: 0;
-  min-height: 100rpx;
-}
-/* ==================
-         轮播
- ==================== */
-swiper .a-swiper-dot {
-	display: inline-block;
-	width: 16rpx;
-	height: 16rpx;
-	background: rgba(0, 0, 0, .3);
-	border-radius: 50%;
-	vertical-align: middle;
-}
-
-swiper[class*="-dot"] .wx-swiper-dots,
-swiper[class*="-dot"] .a-swiper-dots,
-swiper[class*="-dot"] .uni-swiper-dots {
-	display: flex;
-	align-items: center;
-	width: 100%;
-	justify-content: center;
-}
-
-swiper.square-dot .wx-swiper-dot,
-swiper.square-dot .a-swiper-dot,
-swiper.square-dot .uni-swiper-dot {
-	background-color: #ffffff;
-	opacity: 0.4;
-	width: 10rpx;
-	height: 10rpx;
-	border-radius: 20rpx;
-	margin: 0 8rpx !important;
-}
-
-swiper.square-dot .wx-swiper-dot.wx-swiper-dot-active,
-swiper.square-dot .a-swiper-dot.a-swiper-dot-active,
-swiper.square-dot .uni-swiper-dot.uni-swiper-dot-active {
-	opacity: 1;
-	width: 30rpx;
-}
-
-swiper.round-dot .wx-swiper-dot,
-swiper.round-dot .a-swiper-dot,
-swiper.round-dot .uni-swiper-dot {
-	width: 10rpx;
-	height: 10rpx;
-	position: relative;
-	margin: 4rpx 8rpx !important;
-}
-
-swiper.round-dot .wx-swiper-dot.wx-swiper-dot-active::after,
-swiper.round-dot .a-swiper-dot.a-swiper-dot-active::after,
-swiper.round-dot .uni-swiper-dot.uni-swiper-dot-active::after {
-	content: "";
-	position: absolute;
-	width: 10rpx;
-	height: 10rpx;
-	top: 0rpx;
-	left: 0rpx;
-	right: 0;
-	bottom: 0;
-	margin: auto;
-	background-color: #ffffff;
-	border-radius: 20rpx;
-}
-
-swiper.round-dot .wx-swiper-dot.wx-swiper-dot-active,
-swiper.round-dot .a-swiper-dot.a-swiper-dot-active,
-swiper.round-dot .uni-swiper-dot.uni-swiper-dot-active {
-	width: 18rpx;
-	height: 18rpx;
-}
-
-.screen-swiper {
-	min-height: 375rpx;
-}
-
-.screen-swiper image,
-.screen-swiper video,
-.swiper-item image,
-.swiper-item video {
-	width: 100%;
-	display: block;
-	height: 100%;
-	margin: 0;
-	pointer-events: none;
-}
-
-.card-swiper {
-	height: 420rpx !important;
-}
-
-.card-swiper swiper-item {
-	width: 610rpx !important;
-	left: 70rpx;
-	box-sizing: border-box;
-	padding: 40rpx 0rpx 70rpx;
-	overflow: initial;
-}
-
-.card-swiper swiper-item .swiper-item {
-	width: 100%;
-	display: block;
-	height: 100%;
-	border-radius: 10rpx;
-	transform: scale(0.9);
-	transition: all 0.2s ease-in 0s;
-	overflow: hidden;
-}
-
-.card-swiper swiper-item.cur .swiper-item {
-	transform: none;
-	transition: all 0.2s ease-in 0s;
-}
-
-
-.tower-swiper {
-	height: 420rpx;
-	position: relative;
-	max-width: 750rpx;
-	overflow: hidden;
-}
-
-.tower-swiper .tower-item {
-	position: absolute;
-	width: 300rpx;
-	height: 380rpx;
-	top: 0;
-	bottom: 0;
-	left: 50%;
-	margin: auto;
-	transition: all 0.2s ease-in 0s;
-	opacity: 1;
-}
-
-.tower-swiper .tower-item.none {
-	opacity: 0;
-}
-
-.tower-swiper .tower-item .swiper-item {
-	width: 100%;
-	height: 100%;
-	border-radius: 6rpx;
-	overflow: hidden;
-}
-
-/* ==================
-          步骤条
- ==================== */
-
-.cu-steps {
-	display: flex;
-}
-
-scroll-view.cu-steps {
-	display: block;
-	white-space: nowrap;
-}
-
-scroll-view.cu-steps .cu-item {
-	display: inline-block;
-}
-
-.cu-steps .cu-item {
-	flex: 1;
-	text-align: center;
-	position: relative;
-	min-width: 100rpx;
-}
-
-.cu-steps .cu-item:not([class*="text-"]) {
-	color: #8799a3;
-}
-
-.cu-steps .cu-item [class*="cuIcon-"],
-.cu-steps .cu-item .num {
-	display: block;
-	font-size: 40rpx;
-	line-height: 80rpx;
-}
-
-.cu-steps .cu-item::before,
-.cu-steps .cu-item::after,
-.cu-steps.steps-arrow .cu-item::before,
-.cu-steps.steps-arrow .cu-item::after {
-	content: "";
-	display: block;
-	position: absolute;
-	height: 0px;
-	width: calc(100% - 80rpx);
-	border-bottom: 1px solid #ccc;
-	left: calc(0px - (100% - 80rpx) / 2);
-	top: 40rpx;
-	z-index: 0;
-}
-
-.cu-steps.steps-arrow .cu-item::before,
-.cu-steps.steps-arrow .cu-item::after {
-	content: "\e6a3";
-	font-family: 'cuIcon';
-	height: 30rpx;
-	border-bottom-width: 0px;
-	line-height: 30rpx;
-	top: 0;
-	bottom: 0;
-	margin: auto;
-	color: #ccc;
-}
-
-.cu-steps.steps-bottom .cu-item::before,
-.cu-steps.steps-bottom .cu-item::after {
-	bottom: 40rpx;
-	top: initial;
-}
-
-.cu-steps .cu-item::after {
-	border-bottom: 1px solid currentColor;
-	width: 0px;
-	transition: all 0.3s ease-in-out 0s;
-}
-
-.cu-steps .cu-item[class*="text-"]::after {
-	width: calc(100% - 80rpx);
-	color: currentColor;
-}
-
-.cu-steps .cu-item:first-child::before,
-.cu-steps .cu-item:first-child::after {
-	display: none;
-}
-
-.cu-steps .cu-item .num {
-	width: 40rpx;
-	height: 40rpx;
-	border-radius: 50%;
-	line-height: 40rpx;
-	margin: 20rpx auto;
-	font-size: 24rpx;
-	border: 1px solid currentColor;
-	position: relative;
-	overflow: hidden;
-}
-
-.cu-steps .cu-item[class*="text-"] .num {
-	background-color: currentColor;
-}
-
-.cu-steps .cu-item .num::before,
-.cu-steps .cu-item .num::after {
-	content: attr(data-index);
-	position: absolute;
-	left: 0;
-	right: 0;
-	top: 0;
-	bottom: 0;
-	margin: auto;
-	transition: all 0.3s ease-in-out 0s;
-	transform: translateY(0rpx);
-}
-
-.cu-steps .cu-item[class*="text-"] .num::before {
-	transform: translateY(-40rpx);
-	color: #ffffff;
-}
-
-.cu-steps .cu-item .num::after {
-	transform: translateY(40rpx);
-	color: #ffffff;
-	transition: all 0.3s ease-in-out 0s;
-}
-
-.cu-steps .cu-item[class*="text-"] .num::after {
-	content: "\e645";
-	font-family: 'cuIcon';
-	color: #ffffff;
-	transform: translateY(0rpx);
-}
-
-.cu-steps .cu-item[class*="text-"] .num.err::after {
-	content: "\e646";
-}
-
-/* ==================
-          布局
- ==================== */
-
-/*  -- flex弹性布局 -- */
-
-.flex {
-	display: flex;
-}
-
-.basis-xs {
-	flex-basis: 20%;
-}
-
-.basis-sm {
-	flex-basis: 40%;
-}
-
-.basis-df {
-	flex-basis: 50%;
-}
-
-.basis-lg {
-	flex-basis: 60%;
-}
-
-.basis-xl {
-	flex-basis: 80%;
-}
-
-.flex-sub {
-	flex: 1;
-}
-
-.flex-twice {
-	flex: 2;
-}
-
-.flex-treble {
-	flex: 3;
-}
-
-.flex-direction {
-	flex-direction: column;
-}
-
-.flex-wrap {
-	flex-wrap: wrap;
-}
-
-.align-start {
-	align-items: flex-start;
-}
-
-.align-end {
-	align-items: flex-end;
-}
-
-.align-center {
-	align-items: center;
-}
-
-.align-stretch {
-	align-items: stretch;
-}
-
-.self-start {
-	align-self: flex-start;
-}
-
-.self-center {
-	align-self: flex-center;
-}
-
-.self-end {
-	align-self: flex-end;
-}
-
-.self-stretch {
-	align-self: stretch;
-}
-
-.align-stretch {
-	align-items: stretch;
-}
-
-.justify-start {
-	justify-content: flex-start;
-}
-
-.justify-end {
-	justify-content: flex-end;
-}
-
-.justify-center {
-	justify-content: center;
-}
-
-.justify-between {
-	justify-content: space-between;
-}
-
-.justify-around {
-	justify-content: space-around;
-}
-
-/* grid布局 */
-
-.grid {
-	display: flex;
-	flex-wrap: wrap;
-}
-
-.grid.grid-square {
-	overflow: hidden;
-}
-
-.grid.grid-square .cu-tag {
-	position: absolute;
-	right: 0;
-	top: 0;
-	border-bottom-left-radius: 6rpx;
-	padding: 6rpx 12rpx;
-	height: auto;
-	background-color: rgba(0, 0, 0, 0.5);
-}
-
-.grid.grid-square>view>text[class*="cuIcon-"] {
-	font-size: 52rpx;
-	position: absolute;
-	color: #8799a3;
-	margin: auto;
-	top: 0;
-	bottom: 0;
-	left: 0;
-	right: 0;
-	display: flex;
-	justify-content: center;
-	align-items: center;
-	flex-direction: column;
-}
-
-.grid.grid-square>view {
-	margin-right: 20rpx;
-	margin-bottom: 20rpx;
-	border-radius: 6rpx;
-	position: relative;
-	overflow: hidden;
-}
-.grid.grid-square>view.bg-img image {
-	width: 100%;
-	height: 100%;
-	position: absolute;
-}
-.grid.col-1.grid-square>view {
-	padding-bottom: 100%;
-	height: 0;
-	margin-right: 0;
-}
-
-.grid.col-2.grid-square>view {
-	padding-bottom: calc((100% - 20rpx)/2);
-	height: 0;
-	width: calc((100% - 20rpx)/2);
-}
-
-.grid.col-3.grid-square>view {
-	padding-bottom: calc((100% - 40rpx)/3);
-	height: 0;
-	width: calc((100% - 40rpx)/3);
-}
-
-.grid.col-4.grid-square>view {
-	padding-bottom: calc((100% - 60rpx)/4);
-	height: 0;
-	width: calc((100% - 60rpx)/4);
-}
-
-.grid.col-5.grid-square>view {
-	padding-bottom: calc((100% - 80rpx)/5);
-	height: 0;
-	width: calc((100% - 80rpx)/5);
-}
-
-.grid.col-2.grid-square>view:nth-child(2n),
-.grid.col-3.grid-square>view:nth-child(3n),
-.grid.col-4.grid-square>view:nth-child(4n),
-.grid.col-5.grid-square>view:nth-child(5n) {
-	margin-right: 0;
-}
-
-.grid.col-1>view {
-	width: 100%;
-}
-
-.grid.col-2>view {
-	width: 50%;
-}
-
-.grid.col-3>view {
-	width: 33.33%;
-}
-
-.grid.col-4>view {
-	width: 25%;
-}
-
-.grid.col-5>view {
-	width: 20%;
-}
-
-/*  -- 内外边距 -- */
-
-.margin-0 {
-	margin: 0;
-}
-
-.margin-xs {
-	margin: 10rpx;
-}
-
-.margin-sm {
-	margin: 20rpx;
-}
-
-.margin {
-	margin: 30rpx;
-}
-
-.margin-lg {
-	margin: 40rpx;
-}
-
-.margin-xl {
-	margin: 50rpx;
-}
-
-.margin-top-xs {
-	margin-top: 10rpx;
-}
-
-.margin-top-sm {
-	margin-top: 20rpx;
-}
-
-.margin-top {
-	margin-top: 30rpx;
-}
-
-.margin-top-lg {
-	margin-top: 40rpx;
-}
-
-.margin-top-xl {
-	margin-top: 50rpx;
-}
-
-.margin-right-xs {
-	margin-right: 10rpx;
-}
-
-.margin-right-sm {
-	margin-right: 20rpx;
-}
-
-.margin-right {
-	margin-right: 30rpx;
-}
-
-.margin-right-lg {
-	margin-right: 40rpx;
-}
-
-.margin-right-xl {
-	margin-right: 50rpx;
-}
-
-.margin-bottom-xs {
-	margin-bottom: 10rpx;
-}
-
-.margin-bottom-sm {
-	margin-bottom: 20rpx;
-}
-
-.margin-bottom {
-	margin-bottom: 30rpx;
-}
-
-.margin-bottom-lg {
-	margin-bottom: 40rpx;
-}
-
-.margin-bottom-xl {
-	margin-bottom: 50rpx;
-}
-
-.margin-left-xs {
-	margin-left: 10rpx;
-}
-
-.margin-left-sm {
-	margin-left: 20rpx;
-}
-
-.margin-left {
-	margin-left: 30rpx;
-}
-
-.margin-left-lg {
-	margin-left: 40rpx;
-}
-
-.margin-left-xl {
-	margin-left: 50rpx;
-}
-
-.margin-lr-xs {
-	margin-left: 10rpx;
-	margin-right: 10rpx;
-}
-
-.margin-lr-sm {
-	margin-left: 20rpx;
-	margin-right: 20rpx;
-}
-
-.margin-lr {
-	margin-left: 30rpx;
-	margin-right: 30rpx;
-}
-
-.margin-lr-lg {
-	margin-left: 40rpx;
-	margin-right: 40rpx;
-}
-
-.margin-lr-xl {
-	margin-left: 50rpx;
-	margin-right: 50rpx;
-}
-
-.margin-tb-xs {
-	margin-top: 10rpx;
-	margin-bottom: 10rpx;
-}
-
-.margin-tb-sm {
-	margin-top: 20rpx;
-	margin-bottom: 20rpx;
-}
-
-.margin-tb {
-	margin-top: 30rpx;
-	margin-bottom: 30rpx;
-}
-
-.margin-tb-lg {
-	margin-top: 40rpx;
-	margin-bottom: 40rpx;
-}
-
-.margin-tb-xl {
-	margin-top: 50rpx;
-	margin-bottom: 50rpx;
-}
-
-.padding-0 {
-	padding: 0;
-}
-
-.padding-xs {
-	padding: 10rpx;
-}
-
-.padding-sm {
-	padding: 20rpx;
-}
-
-.padding {
-	padding: 30rpx;
-}
-
-.padding-lg {
-	padding: 40rpx;
-}
-
-.padding-xl {
-	padding: 50rpx;
-}
-
-.padding-top-xs {
-	padding-top: 10rpx;
-}
-
-.padding-top-sm {
-	padding-top: 20rpx;
-}
-
-.padding-top {
-	padding-top: 30rpx;
-}
-
-.padding-top-lg {
-	padding-top: 40rpx;
-}
-
-.padding-top-xl {
-	padding-top: 50rpx;
-}
-
-.padding-right-xs {
-	padding-right: 10rpx;
-}
-
-.padding-right-sm {
-	padding-right: 20rpx;
-}
-
-.padding-right {
-	padding-right: 30rpx;
-}
-
-.padding-right-lg {
-	padding-right: 40rpx;
-}
-
-.padding-right-xl {
-	padding-right: 50rpx;
-}
-
-.padding-bottom-xs {
-	padding-bottom: 10rpx;
-}
-
-.padding-bottom-sm {
-	padding-bottom: 20rpx;
-}
-
-.padding-bottom {
-	padding-bottom: 30rpx;
-}
-
-.padding-bottom-lg {
-	padding-bottom: 40rpx;
-}
-
-.padding-bottom-xl {
-	padding-bottom: 50rpx;
-}
-
-.padding-left-xs {
-	padding-left: 10rpx;
-}
-
-.padding-left-sm {
-	padding-left: 20rpx;
-}
-
-.padding-left {
-	padding-left: 30rpx;
-}
-
-.padding-left-lg {
-	padding-left: 40rpx;
-}
-
-.padding-left-xl {
-	padding-left: 50rpx;
-}
-
-.padding-lr-xs {
-	padding-left: 10rpx;
-	padding-right: 10rpx;
-}
-
-.padding-lr-sm {
-	padding-left: 20rpx;
-	padding-right: 20rpx;
-}
-
-.padding-lr {
-	padding-left: 30rpx;
-	padding-right: 30rpx;
-}
-
-.padding-lr-lg {
-	padding-left: 40rpx;
-	padding-right: 40rpx;
-}
-
-.padding-lr-xl {
-	padding-left: 50rpx;
-	padding-right: 50rpx;
-}
-
-.padding-tb-xs {
-	padding-top: 10rpx;
-	padding-bottom: 10rpx;
-}
-
-.padding-tb-sm {
-	padding-top: 20rpx;
-	padding-bottom: 20rpx;
-}
-
-.padding-tb {
-	padding-top: 30rpx;
-	padding-bottom: 30rpx;
-}
-
-.padding-tb-lg {
-	padding-top: 40rpx;
-	padding-bottom: 40rpx;
-}
-
-.padding-tb-xl {
-	padding-top: 50rpx;
-	padding-bottom: 50rpx;
-}
-
-/* -- 浮动 --  */
-
-.cf::after,
-.cf::before {
-	content: " ";
-	display: table;
-}
-
-.cf::after {
-	clear: both;
-}
-
-.fl {
-	float: left;
-}
-
-.fr {
-	float: right;
-}
-
-/* ==================
-          背景
- ==================== */
-
-.line-red::after,
-.lines-red::after {
-	border-color: #e54d42;
-}
-
-.line-orange::after,
-.lines-orange::after {
-	border-color: #f37b1d;
-}
-
-.line-yellow::after,
-.lines-yellow::after {
-	border-color: #fbbd08;
-}
-
-.line-olive::after,
-.lines-olive::after {
-	border-color: #8dc63f;
-}
-
-.line-green::after,
-.lines-green::after {
-	border-color: #39b54a;
-}
-
-.line-cyan::after,
-.lines-cyan::after {
-	border-color: #1cbbb4;
-}
-
-.line-blue::after,
-.lines-blue::after {
-	border-color: #0081ff;
-}
-
-.line-purple::after,
-.lines-purple::after {
-	border-color: #6739b6;
-}
-
-.line-mauve::after,
-.lines-mauve::after {
-	border-color: #9c26b0;
-}
-
-.line-pink::after,
-.lines-pink::after {
-	border-color: #e03997;
-}
-
-.line-brown::after,
-.lines-brown::after {
-	border-color: #a5673f;
-}
-
-.line-grey::after,
-.lines-grey::after {
-	border-color: #8799a3;
-}
-
-.line-gray::after,
-.lines-gray::after {
-	border-color: #aaaaaa;
-}
-
-.line-black::after,
-.lines-black::after {
-	border-color: #333333;
-}
-
-.line-white::after,
-.lines-white::after {
-	border-color: #ffffff;
-}
-
-.bg-red {
-	background-color: #e54d42;
-	color: #ffffff;
-}
-
-.bg-orange {
-	background-color: #f37b1d;
-	color: #ffffff;
-}
-
-.bg-yellow {
-	background-color: #fbbd08;
-	color: #333333;
-}
-
-.bg-olive {
-	background-color: #8dc63f;
-	color: #ffffff;
-}
-
-.bg-green {
-	background-color: #39b54a;
-	color: #ffffff;
-}
-
-.bg-cyan {
-	background-color: #1cbbb4;
-	color: #ffffff;
-}
-
-.bg-blue {
-	background-color: #0081ff;
-	color: #ffffff;
-}
-
-.bg-purple {
-	background-color: #6739b6;
-	color: #ffffff;
-}
-
-.bg-mauve {
-	background-color: #9c26b0;
-	color: #ffffff;
-}
-
-.bg-pink {
-	background-color: #e03997;
-	color: #ffffff;
-}
-
-.bg-brown {
-	background-color: #a5673f;
-	color: #ffffff;
-}
-
-.bg-grey {
-	background-color: #8799a3;
-	color: #ffffff;
-}
-
-.bg-gray {
-	background-color: #f0f0f0;
-	color: #333333;
-}
-
-.bg-black {
-	background-color: #333333;
-	color: #ffffff;
-}
-
-.bg-white {
-	background-color: #ffffff;
-	color: #666666;
-}
-
-.bg-shadeTop {
-	background-image: linear-gradient(rgba(0, 0, 0, 1), rgba(0, 0, 0, 0.01));
-	color: #ffffff;
-}
-
-.bg-shadeBottom {
-	background-image: linear-gradient(rgba(0, 0, 0, 0.01), rgba(0, 0, 0, 1));
-	color: #ffffff;
-}
-
-.bg-red.light {
-	color: #e54d42;
-	background-color: #fadbd9;
-}
-
-.bg-orange.light {
-	color: #f37b1d;
-	background-color: #fde6d2;
-}
-
-.bg-yellow.light {
-	color: #fbbd08;
-	background-color: #fef2ced2;
-}
-
-.bg-olive.light {
-	color: #8dc63f;
-	background-color: #e8f4d9;
-}
-
-.bg-green.light {
-	color: #39b54a;
-	background-color: #d7f0dbff;
-}
-
-.bg-cyan.light {
-	color: #1cbbb4;
-	background-color: #d2f1f0;
-}
-
-.bg-blue.light {
-	color: #0081ff;
-	background-color: #cce6ff;
-}
-
-.bg-purple.light {
-	color: #6739b6;
-	background-color: #e1d7f0;
-}
-
-.bg-mauve.light {
-	color: #9c26b0;
-	background-color: #ebd4ef;
-}
-
-.bg-pink.light {
-	color: #e03997;
-	background-color: #f9d7ea;
-}
-
-.bg-brown.light {
-	color: #a5673f;
-	background-color: #ede1d9;
-}
-
-.bg-grey.light {
-	color: #8799a3;
-	background-color: #e7ebed;
-}
-
-.bg-gradual-red {
-	background-image: linear-gradient(45deg, #f43f3b, #ec008c);
-	color: #ffffff;
-}
-
-.bg-gradual-orange {
-	background-image: linear-gradient(45deg, #ff9700, #ed1c24);
-	color: #ffffff;
-}
-
-.bg-gradual-green {
-	background-image: linear-gradient(45deg, #39b54a, #8dc63f);
-	color: #ffffff;
-}
-
-.bg-gradual-purple {
-	background-image: linear-gradient(45deg, #9000ff, #5e00ff);
-	color: #ffffff;
-}
-
-.bg-gradual-pink {
-	background-image: linear-gradient(45deg, #ec008c, #6739b6);
-	color: #ffffff;
-}
-
-.bg-gradual-blue {
-	background-image: linear-gradient(45deg, #0081ff, #1cbbb4);
-	color: #ffffff;
-}
-
-.shadow[class*="-red"] {
-	box-shadow: 6rpx 6rpx 8rpx rgba(204, 69, 59, 0.2);
-}
-
-.shadow[class*="-orange"] {
-	box-shadow: 6rpx 6rpx 8rpx rgba(217, 109, 26, 0.2);
-}
-
-.shadow[class*="-yellow"] {
-	box-shadow: 6rpx 6rpx 8rpx rgba(224, 170, 7, 0.2);
-}
-
-.shadow[class*="-olive"] {
-	box-shadow: 6rpx 6rpx 8rpx rgba(124, 173, 55, 0.2);
-}
-
-.shadow[class*="-green"] {
-	box-shadow: 6rpx 6rpx 8rpx rgba(48, 156, 63, 0.2);
-}
-
-.shadow[class*="-cyan"] {
-	box-shadow: 6rpx 6rpx 8rpx rgba(28, 187, 180, 0.2);
-}
-
-.shadow[class*="-blue"] {
-	box-shadow: 6rpx 6rpx 8rpx rgba(0, 102, 204, 0.2);
-}
-
-.shadow[class*="-purple"] {
-	box-shadow: 6rpx 6rpx 8rpx rgba(88, 48, 156, 0.2);
-}
-
-.shadow[class*="-mauve"] {
-	box-shadow: 6rpx 6rpx 8rpx rgba(133, 33, 150, 0.2);
-}
-
-.shadow[class*="-pink"] {
-	box-shadow: 6rpx 6rpx 8rpx rgba(199, 50, 134, 0.2);
-}
-
-.shadow[class*="-brown"] {
-	box-shadow: 6rpx 6rpx 8rpx rgba(140, 88, 53, 0.2);
-}
-
-.shadow[class*="-grey"] {
-	box-shadow: 6rpx 6rpx 8rpx rgba(114, 130, 138, 0.2);
-}
-
-.shadow[class*="-gray"] {
-	box-shadow: 6rpx 6rpx 8rpx rgba(114, 130, 138, 0.2);
-}
-
-.shadow[class*="-black"] {
-	box-shadow: 6rpx 6rpx 8rpx rgba(26, 26, 26, 0.2);
-}
-
-.shadow[class*="-white"] {
-	box-shadow: 6rpx 6rpx 8rpx rgba(26, 26, 26, 0.2);
-}
-
-.text-shadow[class*="-red"] {
-	text-shadow: 6rpx 6rpx 8rpx rgba(204, 69, 59, 0.2);
-}
-
-.text-shadow[class*="-orange"] {
-	text-shadow: 6rpx 6rpx 8rpx rgba(217, 109, 26, 0.2);
-}
-
-.text-shadow[class*="-yellow"] {
-	text-shadow: 6rpx 6rpx 8rpx rgba(224, 170, 7, 0.2);
-}
-
-.text-shadow[class*="-olive"] {
-	text-shadow: 6rpx 6rpx 8rpx rgba(124, 173, 55, 0.2);
-}
-
-.text-shadow[class*="-green"] {
-	text-shadow: 6rpx 6rpx 8rpx rgba(48, 156, 63, 0.2);
-}
-
-.text-shadow[class*="-cyan"] {
-	text-shadow: 6rpx 6rpx 8rpx rgba(28, 187, 180, 0.2);
-}
-
-.text-shadow[class*="-blue"] {
-	text-shadow: 6rpx 6rpx 8rpx rgba(0, 102, 204, 0.2);
-}
-
-.text-shadow[class*="-purple"] {
-	text-shadow: 6rpx 6rpx 8rpx rgba(88, 48, 156, 0.2);
-}
-
-.text-shadow[class*="-mauve"] {
-	text-shadow: 6rpx 6rpx 8rpx rgba(133, 33, 150, 0.2);
-}
-
-.text-shadow[class*="-pink"] {
-	text-shadow: 6rpx 6rpx 8rpx rgba(199, 50, 134, 0.2);
-}
-
-.text-shadow[class*="-brown"] {
-	text-shadow: 6rpx 6rpx 8rpx rgba(140, 88, 53, 0.2);
-}
-
-.text-shadow[class*="-grey"] {
-	text-shadow: 6rpx 6rpx 8rpx rgba(114, 130, 138, 0.2);
-}
-
-.text-shadow[class*="-gray"] {
-	text-shadow: 6rpx 6rpx 8rpx rgba(114, 130, 138, 0.2);
-}
-
-.text-shadow[class*="-black"] {
-	text-shadow: 6rpx 6rpx 8rpx rgba(26, 26, 26, 0.2);
-}
-
-.bg-img {
-	background-size: cover;
-	background-position: center;
-	background-repeat: no-repeat;
-}
-
-.bg-mask {
-	background-color: #333333;
-	position: relative;
-}
-
-.bg-mask::after {
-	content: "";
-	border-radius: inherit;
-	width: 100%;
-	height: 100%;
-	display: block;
-	background-color: rgba(0, 0, 0, 0.4);
-	position: absolute;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	top: 0;
-}
-
-.bg-mask view,
-.bg-mask cover-view {
-	z-index: 5;
-	position: relative;
-}
-
-.bg-video {
-	position: relative;
-}
-
-.bg-video video {
-	display: block;
-	height: 100%;
-	width: 100%;
-	-o-object-fit: cover;
-	object-fit: cover;
-	position: absolute;
-	top: 0;
-	z-index: 0;
-	pointer-events: none;
-}
-
-/* ==================
-          文本
- ==================== */
-
-.text-xs {
-	font-size: 20rpx;
-}
-
-.text-sm {
-	font-size: 24rpx;
-}
-
-.text-dm {
-	font-size: 26rpx;
-}
-
-.text-df {
-	font-size: 28rpx;
-}
-
-.text-lg {
-	font-size: 32rpx;
-}
-
-.text-xl {
-	font-size: 36rpx;
-}
-
-.text-xxl {
-	font-size: 44rpx;
-}
-
-.text-sl {
-	font-size: 80rpx;
-}
-
-.text-xsl {
-	font-size: 120rpx;
-}
-
-.text-Abc {
-	text-transform: Capitalize;
-}
-
-.text-ABC {
-	text-transform: Uppercase;
-}
-
-.text-abc {
-	text-transform: Lowercase;
-}
-
-.text-price::before {
-	content: "¥";
-	font-size: 80%;
-	margin-right: 4rpx;
-}
-
-.text-cut {
-	text-overflow: ellipsis;
-	white-space: nowrap;
-	overflow: hidden;
-}
-
-.text-bold {
-	font-weight: bold;
-}
-
-.text-center {
-	text-align: center;
-}
-
-.text-content {
-	line-height: 1.6;
-}
-
-.text-left {
-	text-align: left;
-}
-
-.text-right {
-	text-align: right;
-}
-
-.text-red,
-.line-red,
-.lines-red {
-	color: #e54d42;
-}
-
-.text-orange,
-.line-orange,
-.lines-orange {
-	color: #f37b1d;
-}
-
-.text-yellow,
-.line-yellow,
-.lines-yellow {
-	color: #fbbd08;
-}
-
-.text-olive,
-.line-olive,
-.lines-olive {
-	color: #8dc63f;
-}
-
-.text-green,
-.line-green,
-.lines-green {
-	color: #39b54a;
-}
-
-.text-cyan,
-.line-cyan,
-.lines-cyan {
-	color: #1cbbb4;
-}
-
-.text-blue,
-.line-blue,
-.lines-blue {
-	color: #0081ff;
-}
-
-.text-purple,
-.line-purple,
-.lines-purple {
-	color: #6739b6;
-}
-
-.text-mauve,
-.line-mauve,
-.lines-mauve {
-	color: #9c26b0;
-}
-
-.text-pink,
-.line-pink,
-.lines-pink {
-	color: #e03997;
-}
-
-.text-brown,
-.line-brown,
-.lines-brown {
-	color: #a5673f;
-}
-
-.text-grey,
-.line-grey,
-.lines-grey {
-	color: #8799a3;
-}
-
-.text-gray,
-.line-gray,
-.lines-gray {
-	color: #aaaaaa;
-}
-
-.text-black,
-.line-black,
-.lines-black {
-	color: #333333;
-}
-
-.text-white,
-.line-white,
-.lines-white {
-	color: #ffffff;
-}
+/*
+  ColorUi for uniApp  v2.1.6 | by 文晓港 2019-05-31 10:44:24
+  仅供学习交流，如作它用所承受的法律责任一概与作者无关  
+  
+  *使用ColorUi开发扩展与插件时，请注明基于ColorUi开发 
+  
+  （QQ交流群：240787041）
+*/
+
+/* ==================
+        初始化
+ ==================== */
+body {
+	background-color: #f1f1f1;
+	font-size: 28rpx;
+	color: #333333;
+	font-family: Helvetica Neue, Helvetica, sans-serif;
+}
+
+view,
+scroll-view,
+swiper,
+button,
+input,
+textarea,
+label,
+navigator,
+image {
+	box-sizing: border-box;
+}
+
+.round {
+	border-radius: 5000rpx;
+}
+
+.radius {
+	border-radius: 6rpx;
+}
+
+/* ==================
+          图片
+ ==================== */
+
+image {
+	max-width: 100%;
+	display: inline-block;
+	position: relative;
+	z-index: 0;
+}
+
+image.loading::before {
+	content: "";
+	background-color: #f5f5f5;
+	display: block;
+	position: absolute;
+	width: 100%;
+	height: 100%;
+	z-index: -2;
+}
+
+image.loading::after {
+	content: "\e7f1";
+	font-family: "cuIcon";
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 32rpx;
+	height: 32rpx;
+	line-height: 32rpx;
+	right: 0;
+	bottom: 0;
+	z-index: -1;
+	font-size: 32rpx;
+	margin: auto;
+	color: #ccc;
+	-webkit-animation: cuIcon-spin 2s infinite linear;
+	animation: cuIcon-spin 2s infinite linear;
+	display: block;
+}
+
+.response {
+	width: 100%;
+}
+
+/* ==================
+         开关
+ ==================== */
+
+switch,
+checkbox,
+radio {
+	position: relative;
+}
+
+switch::after,
+switch::before {
+	font-family: "cuIcon";
+	content: "\e645";
+	position: absolute;
+	color: #ffffff !important;
+	top: 0%;
+	left: 0rpx;
+	font-size: 26rpx;
+	line-height: 26px;
+	width: 50%;
+	text-align: center;
+	pointer-events: none;
+	transform: scale(0, 0);
+	transition: all 0.3s ease-in-out 0s;
+	z-index: 9;
+	bottom: 0;
+	height: 26px;
+	margin: auto;
+}
+
+switch::before {
+	content: "\e646";
+	right: 0;
+	transform: scale(1, 1);
+	left: auto;
+}
+
+switch[checked]::after,
+switch.checked::after {
+	transform: scale(1, 1);
+}
+
+switch[checked]::before,
+switch.checked::before {
+	transform: scale(0, 0);
+}
+
+/* #ifndef MP-ALIPAY */
+radio::before,
+checkbox::before {
+	font-family: "cuIcon";
+	content: "\e645";
+	position: absolute;
+	color: #ffffff !important;
+	top: 50%;
+	margin-top: -8px;
+	right: 5px;
+	font-size: 32rpx;
+	line-height: 16px;
+	pointer-events: none;
+	transform: scale(1, 1);
+	transition: all 0.3s ease-in-out 0s;
+	z-index: 9;
+}
+
+radio .wx-radio-input,
+checkbox .wx-checkbox-input,
+radio .uni-radio-input,
+checkbox .uni-checkbox-input {
+	margin: 0;
+	width: 24px;
+	height: 24px;
+}
+
+checkbox.round .wx-checkbox-input,
+checkbox.round .uni-checkbox-input {
+	border-radius: 100rpx;
+}
+
+/* #endif */
+
+switch[checked]::before {
+	transform: scale(0, 0);
+}
+
+switch .wx-switch-input,
+switch .uni-switch-input {
+	border: none;
+	padding: 0 24px;
+	width: 48px;
+	height: 26px;
+	margin: 0;
+	border-radius: 100rpx;
+}
+
+switch .wx-switch-input:not([class*="bg-"]),
+switch .uni-switch-input:not([class*="bg-"]) {
+	background: #8799a3 !important;
+}
+
+switch .wx-switch-input::after,
+switch .uni-switch-input::after {
+	margin: auto;
+	width: 26px;
+	height: 26px;
+	border-radius: 100rpx;
+	left: 0rpx;
+	top: 0rpx;
+	bottom: 0rpx;
+	position: absolute;
+	transform: scale(0.9, 0.9);
+	transition: all 0.1s ease-in-out 0s;
+}
+
+switch .wx-switch-input.wx-switch-input-checked::after,
+switch .uni-switch-input.uni-switch-input-checked::after {
+	margin: auto;
+	left: 22px;
+	box-shadow: none;
+	transform: scale(0.9, 0.9);
+}
+
+radio-group {
+	display: inline-block;
+}
+
+
+
+switch.radius .wx-switch-input::after,
+switch.radius .wx-switch-input,
+switch.radius .wx-switch-input::before,
+switch.radius .uni-switch-input::after,
+switch.radius .uni-switch-input,
+switch.radius .uni-switch-input::before {
+	border-radius: 10rpx;
+}
+
+switch .wx-switch-input::before,
+radio.radio::before,
+checkbox .wx-checkbox-input::before,
+radio .wx-radio-input::before,
+switch .uni-switch-input::before,
+radio.radio::before,
+checkbox .uni-checkbox-input::before,
+radio .uni-radio-input::before {
+	display: none;
+}
+
+radio.radio[checked]::after,
+radio.radio .uni-radio-input-checked::after {
+	content: "";
+	background-color: transparent;
+	display: block;
+	position: absolute;
+	width: 8px;
+	height: 8px;
+	z-index: 999;
+	top: 0rpx;
+	left: 0rpx;
+	right: 0;
+	bottom: 0;
+	margin: auto;
+	border-radius: 200rpx;
+	/* #ifndef MP */
+	border: 7px solid #ffffff !important;
+	/* #endif */
+
+	/* #ifdef MP */
+	border: 8px solid #ffffff !important;
+	/* #endif */
+}
+
+.switch-sex::after {
+	content: "\e71c";
+}
+
+.switch-sex::before {
+	content: "\e71a";
+}
+
+.switch-sex .wx-switch-input,
+.switch-sex .uni-switch-input {
+	background: #e54d42 !important;
+	border-color: #e54d42 !important;
+}
+
+.switch-sex[checked] .wx-switch-input,
+.switch-sex.checked .uni-switch-input {
+	background: #0081ff !important;
+	border-color: #0081ff !important;
+}
+
+switch.red[checked] .wx-switch-input.wx-switch-input-checked,
+checkbox.red[checked] .wx-checkbox-input,
+radio.red[checked] .wx-radio-input,
+switch.red.checked .uni-switch-input.uni-switch-input-checked,
+checkbox.red.checked .uni-checkbox-input,
+radio.red.checked .uni-radio-input {
+	background-color: #e54d42 !important;
+	border-color: #e54d42 !important;
+	color: #ffffff !important;
+}
+
+switch.orange[checked] .wx-switch-input,
+checkbox.orange[checked] .wx-checkbox-input,
+radio.orange[checked] .wx-radio-input,
+switch.orange.checked .uni-switch-input,
+checkbox.orange.checked .uni-checkbox-input,
+radio.orange.checked .uni-radio-input {
+	background-color: #f37b1d !important;
+	border-color: #f37b1d !important;
+	color: #ffffff !important;
+}
+
+switch.yellow[checked] .wx-switch-input,
+checkbox.yellow[checked] .wx-checkbox-input,
+radio.yellow[checked] .wx-radio-input,
+switch.yellow.checked .uni-switch-input,
+checkbox.yellow.checked .uni-checkbox-input,
+radio.yellow.checked .uni-radio-input {
+	background-color: #fbbd08 !important;
+	border-color: #fbbd08 !important;
+	color: #333333 !important;
+}
+
+switch.olive[checked] .wx-switch-input,
+checkbox.olive[checked] .wx-checkbox-input,
+radio.olive[checked] .wx-radio-input,
+switch.olive.checked .uni-switch-input,
+checkbox.olive.checked .uni-checkbox-input,
+radio.olive.checked .uni-radio-input {
+	background-color: #8dc63f !important;
+	border-color: #8dc63f !important;
+	color: #ffffff !important;
+}
+
+switch.green[checked] .wx-switch-input,
+switch[checked] .wx-switch-input,
+checkbox.green[checked] .wx-checkbox-input,
+checkbox[checked] .wx-checkbox-input,
+radio.green[checked] .wx-radio-input,
+radio[checked] .wx-radio-input,
+switch.green.checked .uni-switch-input,
+switch.checked .uni-switch-input,
+checkbox.green.checked .uni-checkbox-input,
+checkbox.checked .uni-checkbox-input,
+radio.green.checked .uni-radio-input,
+radio.checked .uni-radio-input {
+	background-color: #39b54a !important;
+	border-color: #39b54a !important;
+	color: #ffffff !important;
+	border-color: #39B54A !important;
+}
+
+switch.cyan[checked] .wx-switch-input,
+checkbox.cyan[checked] .wx-checkbox-input,
+radio.cyan[checked] .wx-radio-input,
+switch.cyan.checked .uni-switch-input,
+checkbox.cyan.checked .uni-checkbox-input,
+radio.cyan.checked .uni-radio-input {
+	background-color: #1cbbb4 !important;
+	border-color: #1cbbb4 !important;
+	color: #ffffff !important;
+}
+
+switch.blue[checked] .wx-switch-input,
+checkbox.blue[checked] .wx-checkbox-input,
+radio.blue[checked] .wx-radio-input,
+switch.blue.checked .uni-switch-input,
+checkbox.blue.checked .uni-checkbox-input,
+radio.blue.checked .uni-radio-input {
+	background-color: #0081ff !important;
+	border-color: #0081ff !important;
+	color: #ffffff !important;
+}
+
+switch.purple[checked] .wx-switch-input,
+checkbox.purple[checked] .wx-checkbox-input,
+radio.purple[checked] .wx-radio-input,
+switch.purple.checked .uni-switch-input,
+checkbox.purple.checked .uni-checkbox-input,
+radio.purple.checked .uni-radio-input {
+	background-color: #6739b6 !important;
+	border-color: #6739b6 !important;
+	color: #ffffff !important;
+}
+
+switch.mauve[checked] .wx-switch-input,
+checkbox.mauve[checked] .wx-checkbox-input,
+radio.mauve[checked] .wx-radio-input,
+switch.mauve.checked .uni-switch-input,
+checkbox.mauve.checked .uni-checkbox-input,
+radio.mauve.checked .uni-radio-input {
+	background-color: #9c26b0 !important;
+	border-color: #9c26b0 !important;
+	color: #ffffff !important;
+}
+
+switch.pink[checked] .wx-switch-input,
+checkbox.pink[checked] .wx-checkbox-input,
+radio.pink[checked] .wx-radio-input,
+switch.pink.checked .uni-switch-input,
+checkbox.pink.checked .uni-checkbox-input,
+radio.pink.checked .uni-radio-input {
+	background-color: #e03997 !important;
+	border-color: #e03997 !important;
+	color: #ffffff !important;
+}
+
+switch.brown[checked] .wx-switch-input,
+checkbox.brown[checked] .wx-checkbox-input,
+radio.brown[checked] .wx-radio-input,
+switch.brown.checked .uni-switch-input,
+checkbox.brown.checked .uni-checkbox-input,
+radio.brown.checked .uni-radio-input {
+	background-color: #a5673f !important;
+	border-color: #a5673f !important;
+	color: #ffffff !important;
+}
+
+switch.grey[checked] .wx-switch-input,
+checkbox.grey[checked] .wx-checkbox-input,
+radio.grey[checked] .wx-radio-input,
+switch.grey.checked .uni-switch-input,
+checkbox.grey.checked .uni-checkbox-input,
+radio.grey.checked .uni-radio-input {
+	background-color: #8799a3 !important;
+	border-color: #8799a3 !important;
+	color: #ffffff !important;
+}
+
+switch.gray[checked] .wx-switch-input,
+checkbox.gray[checked] .wx-checkbox-input,
+radio.gray[checked] .wx-radio-input,
+switch.gray.checked .uni-switch-input,
+checkbox.gray.checked .uni-checkbox-input,
+radio.gray.checked .uni-radio-input {
+	background-color: #f0f0f0 !important;
+	border-color: #f0f0f0 !important;
+	color: #333333 !important;
+}
+
+switch.black[checked] .wx-switch-input,
+checkbox.black[checked] .wx-checkbox-input,
+radio.black[checked] .wx-radio-input,
+switch.black.checked .uni-switch-input,
+checkbox.black.checked .uni-checkbox-input,
+radio.black.checked .uni-radio-input {
+	background-color: #333333 !important;
+	border-color: #333333 !important;
+	color: #ffffff !important;
+}
+
+switch.white[checked] .wx-switch-input,
+checkbox.white[checked] .wx-checkbox-input,
+radio.white[checked] .wx-radio-input,
+switch.white.checked .uni-switch-input,
+checkbox.white.checked .uni-checkbox-input,
+radio.white.checked .uni-radio-input {
+	background-color: #ffffff !important;
+	border-color: #ffffff !important;
+	color: #333333 !important;
+}
+
+/* ==================
+          边框
+ ==================== */
+
+/* -- 实线 -- */
+
+.solid,
+.solid-top,
+.solid-right,
+.solid-bottom,
+.solid-left,
+.solids,
+.solids-top,
+.solids-right,
+.solids-bottom,
+.solids-left,
+.dashed,
+.dashed-top,
+.dashed-right,
+.dashed-bottom,
+.dashed-left {
+	position: relative;
+}
+
+.solid::after,
+.solid-top::after,
+.solid-right::after,
+.solid-bottom::after,
+.solid-left::after,
+.solids::after,
+.solids-top::after,
+.solids-right::after,
+.solids-bottom::after,
+.solids-left::after,
+.dashed::after,
+.dashed-top::after,
+.dashed-right::after,
+.dashed-bottom::after,
+.dashed-left::after {
+	content: " ";
+	width: 200%;
+	height: 200%;
+	position: absolute;
+	top: 0;
+	left: 0;
+	border-radius: inherit;
+	transform: scale(0.5);
+	transform-origin: 0 0;
+	pointer-events: none;
+	box-sizing: border-box;
+}
+
+.solid::after {
+	border: 1rpx solid rgba(0, 0, 0, 0.1);
+}
+
+.solid-top::after {
+	border-top: 1rpx solid rgba(0, 0, 0, 0.1);
+}
+
+.solid-right::after {
+	border-right: 1rpx solid rgba(0, 0, 0, 0.1);
+}
+
+.solid-bottom::after {
+	border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
+}
+
+.solid-left::after {
+	border-left: 1rpx solid rgba(0, 0, 0, 0.1);
+}
+
+.solids::after {
+	border: 8rpx solid #eee;
+}
+
+.solids-top::after {
+	border-top: 8rpx solid #eee;
+}
+
+.solids-right::after {
+	border-right: 8rpx solid #eee;
+}
+
+.solids-bottom::after {
+	border-bottom: 8rpx solid #eee;
+}
+
+.solids-left::after {
+	border-left: 8rpx solid #eee;
+}
+
+/* -- 虚线 -- */
+
+.dashed::after {
+	border: 1rpx dashed #ddd;
+}
+
+.dashed-top::after {
+	border-top: 1rpx dashed #ddd;
+}
+
+.dashed-right::after {
+	border-right: 1rpx dashed #ddd;
+}
+
+.dashed-bottom::after {
+	border-bottom: 1rpx dashed #ddd;
+}
+
+.dashed-left::after {
+	border-left: 1rpx dashed #ddd;
+}
+
+/* -- 阴影 -- */
+
+.shadow[class*='white'] {
+	--ShadowSize: 0 1rpx 6rpx;
+}
+
+.shadow-lg {
+	--ShadowSize: 0rpx 40rpx 100rpx 0rpx;
+}
+
+.shadow-warp {
+	position: relative;
+	box-shadow: 0 0 10rpx rgba(0, 0, 0, 0.1);
+}
+
+.shadow-warp:before,
+.shadow-warp:after {
+	position: absolute;
+	content: "";
+	top: 20rpx;
+	bottom: 30rpx;
+	left: 20rpx;
+	width: 50%;
+	box-shadow: 0 30rpx 20rpx rgba(0, 0, 0, 0.2);
+	transform: rotate(-3deg);
+	z-index: -1;
+}
+
+.shadow-warp:after {
+	right: 20rpx;
+	left: auto;
+	transform: rotate(3deg);
+}
+
+.shadow-blur {
+	position: relative;
+}
+
+.shadow-blur::before {
+	content: "";
+	display: block;
+	background: inherit;
+	filter: blur(10rpx);
+	position: absolute;
+	width: 100%;
+	height: 100%;
+	top: 10rpx;
+	left: 10rpx;
+	z-index: -1;
+	opacity: 0.4;
+	transform-origin: 0 0;
+	border-radius: inherit;
+	transform: scale(1, 1);
+}
+
+/* ==================
+          按钮
+ ==================== */
+
+.cu-btn {
+	position: relative;
+	border: 0rpx;
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	box-sizing: border-box;
+	padding: 0 30rpx;
+	font-size: 28rpx;
+	height: 64rpx;
+	line-height: 1;
+	text-align: center;
+	text-decoration: none;
+	overflow: visible;
+	margin-left: initial;
+	transform: translate(0rpx, 0rpx);
+	margin-right: initial;
+}
+
+.cu-btn::after {
+	display: none;
+}
+
+.cu-btn:not([class*="bg-"]) {
+	background-color: #f0f0f0;
+}
+
+.cu-btn[class*="line"] {
+	background-color: transparent;
+}
+
+.cu-btn[class*="line"]::after {
+	content: " ";
+	display: block;
+	width: 200%;
+	height: 200%;
+	position: absolute;
+	top: 0;
+	left: 0;
+	border: 1rpx solid currentColor;
+	transform: scale(0.5);
+	transform-origin: 0 0;
+	box-sizing: border-box;
+	border-radius: 12rpx;
+	z-index: 1;
+	pointer-events: none;
+}
+
+.cu-btn.round[class*="line"]::after {
+	border-radius: 1000rpx;
+}
+
+.cu-btn[class*="lines"]::after {
+	border: 6rpx solid currentColor;
+}
+
+.cu-btn[class*="bg-"]::after {
+	display: none;
+}
+
+.cu-btn.sm {
+	padding: 0 20rpx;
+	font-size: 20rpx;
+	height: 48rpx;
+}
+
+.cu-btn.lg {
+	padding: 0 40rpx;
+	font-size: 32rpx;
+	height: 80rpx;
+}
+
+.cu-btn.cuIcon.sm {
+	width: 48rpx;
+	height: 48rpx;
+}
+
+.cu-btn.cuIcon {
+	width: 64rpx;
+	height: 64rpx;
+	border-radius: 500rpx;
+	padding: 0;
+}
+
+button.cuIcon.lg {
+	width: 80rpx;
+	height: 80rpx;
+}
+
+.cu-btn.shadow-blur::before {
+	top: 4rpx;
+	left: 4rpx;
+	filter: blur(6rpx);
+	opacity: 0.6;
+}
+
+.cu-btn.button-hover {
+	transform: translate(1rpx, 1rpx);
+}
+
+.block {
+	display: block;
+}
+
+.cu-btn.block {
+	display: flex;
+}
+
+.cu-btn[disabled] {
+	opacity: 0.6;
+	color: #ffffff;
+}
+
+/* ==================
+          徽章
+ ==================== */
+
+.cu-tag {
+	font-size: 24rpx;
+	vertical-align: middle;
+	position: relative;
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	box-sizing: border-box;
+	padding: 0rpx 16rpx;
+	height: 48rpx;
+	font-family: Helvetica Neue, Helvetica, sans-serif;
+	white-space: nowrap;
+}
+
+.cu-tag:not([class*="bg"]):not([class*="line"]) {
+	background-color: #f1f1f1;
+}
+
+.cu-tag[class*="line-"]::after {
+	content: " ";
+	width: 200%;
+	height: 200%;
+	position: absolute;
+	top: 0;
+	left: 0;
+	border: 1rpx solid currentColor;
+	transform: scale(0.5);
+	transform-origin: 0 0;
+	box-sizing: border-box;
+	border-radius: inherit;
+	z-index: 1;
+	pointer-events: none;
+}
+
+.cu-tag.radius[class*="line"]::after {
+	border-radius: 12rpx;
+}
+
+.cu-tag.round[class*="line"]::after {
+	border-radius: 1000rpx;
+}
+
+.cu-tag[class*="line-"]::after {
+	border-radius: 0;
+}
+
+.cu-tag+.cu-tag {
+	margin-left: 10rpx;
+}
+
+.cu-tag.sm {
+	font-size: 20rpx;
+	padding: 0rpx 12rpx;
+	height: 32rpx;
+}
+
+.cu-capsule {
+	display: inline-flex;
+	vertical-align: middle;
+}
+
+.cu-capsule+.cu-capsule {
+	margin-left: 10rpx;
+}
+
+.cu-capsule .cu-tag {
+	margin: 0;
+}
+
+.cu-capsule .cu-tag[class*="line-"]:last-child::after {
+	border-left: 0rpx solid transparent;
+}
+
+.cu-capsule .cu-tag[class*="line-"]:first-child::after {
+	border-right: 0rpx solid transparent;
+}
+
+.cu-capsule.radius .cu-tag:first-child {
+	border-top-left-radius: 6rpx;
+	border-bottom-left-radius: 6rpx;
+}
+
+.cu-capsule.radius .cu-tag:last-child::after,
+.cu-capsule.radius .cu-tag[class*="line-"] {
+	border-top-right-radius: 12rpx;
+	border-bottom-right-radius: 12rpx;
+}
+
+.cu-capsule.round .cu-tag:first-child {
+	border-top-left-radius: 200rpx;
+	border-bottom-left-radius: 200rpx;
+	text-indent: 4rpx;
+}
+
+.cu-capsule.round .cu-tag:last-child::after,
+.cu-capsule.round .cu-tag:last-child {
+	border-top-right-radius: 200rpx;
+	border-bottom-right-radius: 200rpx;
+	text-indent: -4rpx;
+}
+
+.cu-tag.badge {
+	border-radius: 200rpx;
+	position: absolute;
+	top: -10rpx;
+	right: -10rpx;
+	font-size: 20rpx;
+	padding: 0rpx 10rpx;
+	height: 28rpx;
+	color: #ffffff;
+}
+
+.cu-tag.badge:not([class*="bg-"]) {
+	background-color: #dd514c;
+}
+
+.cu-tag:empty:not([class*="cuIcon-"]) {
+	padding: 0rpx;
+	width: 16rpx;
+	height: 16rpx;
+	top: -4rpx;
+	right: -4rpx;
+}
+
+.cu-tag[class*="cuIcon-"] {
+	width: 32rpx;
+	height: 32rpx;
+	top: -4rpx;
+	right: -4rpx;
+}
+
+/* ==================
+          头像
+ ==================== */
+
+.cu-avatar {
+	font-variant: small-caps;
+	margin: 0;
+	padding: 0;
+	display: inline-flex;
+	text-align: center;
+	justify-content: center;
+	align-items: center;
+	background-color: #ccc;
+	color: #ffffff;
+	white-space: nowrap;
+	position: relative;
+	width: 64rpx;
+	height: 64rpx;
+	background-size: cover;
+	background-position: center;
+	vertical-align: middle;
+	font-size: 1.5em;
+}
+
+.cu-avatar.sm {
+	width: 48rpx;
+	height: 48rpx;
+	font-size: 1em;
+}
+
+.cu-avatar.lg {
+	width: 96rpx;
+	height: 96rpx;
+	font-size: 2em;
+}
+
+.cu-avatar.xl {
+	width: 128rpx;
+	height: 128rpx;
+	font-size: 2.5em;
+}
+
+.cu-avatar .avatar-text {
+	font-size: 0.4em;
+}
+
+.cu-avatar-group {
+	direction: rtl;
+	unicode-bidi: bidi-override;
+	padding: 0 10rpx 0 40rpx;
+	display: inline-block;
+}
+
+.cu-avatar-group .cu-avatar {
+	margin-left: -30rpx;
+	border: 4rpx solid #f1f1f1;
+	vertical-align: middle;
+}
+
+.cu-avatar-group .cu-avatar.sm {
+	margin-left: -20rpx;
+	border: 1rpx solid #f1f1f1;
+}
+
+/* ==================
+         进度条
+ ==================== */
+
+.cu-progress {
+	overflow: hidden;
+	height: 28rpx;
+	background-color: #ebeef5;
+	display: inline-flex;
+	align-items: center;
+	width: 100%;
+}
+
+.cu-progress+view,
+.cu-progress+text {
+	line-height: 1;
+}
+
+.cu-progress.xs {
+	height: 10rpx;
+}
+
+.cu-progress.sm {
+	height: 20rpx;
+}
+
+.cu-progress view {
+	width: 0;
+	height: 100%;
+	align-items: center;
+	display: flex;
+	justify-items: flex-end;
+	justify-content: space-around;
+	font-size: 20rpx;
+	color: #ffffff;
+	transition: width 0.6s ease;
+}
+
+.cu-progress text {
+	align-items: center;
+	display: flex;
+	font-size: 20rpx;
+	color: #333333;
+	text-indent: 10rpx;
+}
+
+.cu-progress.text-progress {
+	padding-right: 60rpx;
+}
+
+.cu-progress.striped view {
+	background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+	background-size: 72rpx 72rpx;
+}
+
+.cu-progress.active view {
+	animation: progress-stripes 2s linear infinite;
+}
+
+@keyframes progress-stripes {
+	from {
+		background-position: 72rpx 0;
+	}
+
+	to {
+		background-position: 0 0;
+	}
+}
+
+/* ==================
+          加载
+ ==================== */
+
+.cu-load {
+	display: block;
+	line-height: 3em;
+	text-align: center;
+}
+
+.cu-load::before {
+	font-family: "cuIcon";
+	display: inline-block;
+	margin-right: 6rpx;
+}
+
+.cu-load.loading::before {
+	content: "\e67a";
+	animation: cuIcon-spin 2s infinite linear;
+}
+
+.cu-load.loading::after {
+	content: "加载中...";
+}
+
+.cu-load.over::before {
+	content: "\e64a";
+}
+
+.cu-load.over::after {
+	content: "没有更多了";
+}
+
+.cu-load.erro::before {
+	content: "\e658";
+}
+
+.cu-load.erro::after {
+	content: "加载失败";
+}
+
+.cu-load.load-cuIcon::before {
+	font-size: 32rpx;
+}
+
+.cu-load.load-cuIcon::after {
+	display: none;
+}
+
+.cu-load.load-cuIcon.over {
+	display: none;
+}
+
+.cu-load.load-modal {
+	position: fixed;
+	top: 0;
+	right: 0;
+	bottom: 140rpx;
+	left: 0;
+	margin: auto;
+	width: 260rpx;
+	height: 260rpx;
+	background-color: #ffffff;
+	border-radius: 10rpx;
+	box-shadow: 0 0 0rpx 2000rpx rgba(0, 0, 0, 0.5);
+	display: flex;
+	align-items: center;
+	flex-direction: column;
+	justify-content: center;
+	font-size: 28rpx;
+	z-index: 9999;
+	line-height: 2.4em;
+}
+
+.cu-load.load-modal [class*="cuIcon-"] {
+	font-size: 60rpx;
+}
+
+.cu-load.load-modal image {
+	width: 70rpx;
+	height: 70rpx;
+}
+
+.cu-load.load-modal::after {
+	content: "";
+	position: absolute;
+	background-color: #ffffff;
+	border-radius: 50%;
+	width: 200rpx;
+	height: 200rpx;
+	font-size: 10px;
+	border-top: 6rpx solid rgba(0, 0, 0, 0.05);
+	border-right: 6rpx solid rgba(0, 0, 0, 0.05);
+	border-bottom: 6rpx solid rgba(0, 0, 0, 0.05);
+	border-left: 6rpx solid #f37b1d;
+	animation: cuIcon-spin 1s infinite linear;
+	z-index: -1;
+}
+
+.load-progress {
+	pointer-events: none;
+	top: 0;
+	position: fixed;
+	width: 100%;
+	left: 0;
+	z-index: 2000;
+}
+
+.load-progress.hide {
+	display: none;
+}
+
+.load-progress .load-progress-bar {
+	position: relative;
+	width: 100%;
+	height: 4rpx;
+	overflow: hidden;
+	transition: all 200ms ease 0s;
+}
+
+.load-progress .load-progress-spinner {
+	position: absolute;
+	top: 10rpx;
+	right: 10rpx;
+	z-index: 2000;
+	display: block;
+}
+
+.load-progress .load-progress-spinner::after {
+	content: "";
+	display: block;
+	width: 24rpx;
+	height: 24rpx;
+	-webkit-box-sizing: border-box;
+	box-sizing: border-box;
+	border: solid 4rpx transparent;
+	border-top-color: inherit;
+	border-left-color: inherit;
+	border-radius: 50%;
+	-webkit-animation: load-progress-spinner 0.4s linear infinite;
+	animation: load-progress-spinner 0.4s linear infinite;
+}
+
+@-webkit-keyframes load-progress-spinner {
+	0% {
+		-webkit-transform: rotate(0);
+		transform: rotate(0);
+	}
+
+	100% {
+		-webkit-transform: rotate(360deg);
+		transform: rotate(360deg);
+	}
+}
+
+@keyframes load-progress-spinner {
+	0% {
+		-webkit-transform: rotate(0);
+		transform: rotate(0);
+	}
+
+	100% {
+		-webkit-transform: rotate(360deg);
+		transform: rotate(360deg);
+	}
+}
+
+/* ==================
+          列表
+ ==================== */
+.grayscale {
+	filter: grayscale(1);
+}
+
+.cu-list+.cu-list {
+	margin-top: 30rpx
+}
+
+.cu-list>.cu-item {
+	transition: all .6s ease-in-out 0s;
+	transform: translateX(0rpx)
+}
+
+.cu-list>.cu-item.move-cur {
+	transform: translateX(-260rpx)
+}
+
+.cu-list>.cu-item .move {
+	position: absolute;
+	right: 0;
+	display: flex;
+	width: 260rpx;
+	height: 100%;
+	transform: translateX(100%)
+}
+
+.cu-list>.cu-item .move view {
+	display: flex;
+	flex: 1;
+	justify-content: center;
+	align-items: center
+}
+
+.cu-list.menu-avatar {
+	overflow: hidden;
+}
+
+.cu-list.menu-avatar>.cu-item {
+	position: relative;
+	display: flex;
+	padding-right: 10rpx;
+	height: 140rpx;
+	background-color: #ffffff;
+	justify-content: flex-end;
+	align-items: center
+}
+
+.cu-list.menu-avatar>.cu-item>.cu-avatar {
+	position: absolute;
+	left: 30rpx
+}
+
+.cu-list.menu-avatar>.cu-item .flex .text-cut {
+	max-width: 510rpx
+}
+
+.cu-list.menu-avatar>.cu-item .content {
+	position: absolute;
+	left: 146rpx;
+	width: calc(100% - 96rpx - 60rpx - 120rpx - 20rpx);
+	line-height: 1.6em;
+}
+
+.cu-list.menu-avatar>.cu-item .content.flex-sub {
+	width: calc(100% - 96rpx - 60rpx - 20rpx);
+}
+
+.cu-list.menu-avatar>.cu-item .content>view:first-child {
+	font-size: 30rpx;
+	display: flex;
+	align-items: center
+}
+
+.cu-list.menu-avatar>.cu-item .content .cu-tag.sm {
+	display: inline-block;
+	margin-left: 10rpx;
+	height: 28rpx;
+	font-size: 16rpx;
+	line-height: 32rpx
+}
+
+.cu-list.menu-avatar>.cu-item .action {
+	width: 100rpx;
+	text-align: center
+}
+
+.cu-list.menu-avatar>.cu-item .action view+view {
+	margin-top: 10rpx
+}
+
+.cu-list.menu-avatar.comment>.cu-item .content {
+	position: relative;
+	left: 0;
+	width: auto;
+	flex: 1;
+}
+
+.cu-list.menu-avatar.comment>.cu-item {
+	padding: 30rpx 30rpx 30rpx 120rpx;
+	height: auto
+}
+
+.cu-list.menu-avatar.comment .cu-avatar {
+	align-self: flex-start
+}
+
+.cu-list.menu>.cu-item {
+	position: relative;
+	display: flex;
+	padding: 0 30rpx;
+	min-height: 100rpx;
+	background-color: #ffffff;
+	justify-content: space-between;
+	align-items: center
+}
+
+.cu-list.menu>.cu-item:last-child:after {
+	border: none
+}
+
+.cu-list.menu-avatar>.cu-item:after,
+.cu-list.menu>.cu-item:after {
+	position: absolute;
+	top: 0;
+	left: 0;
+	box-sizing: border-box;
+	width: 200%;
+	height: 200%;
+	border-bottom: 1rpx solid #ddd;
+	border-radius: inherit;
+	content: " ";
+	transform: scale(.5);
+	transform-origin: 0 0;
+	pointer-events: none
+}
+
+.cu-list.menu>.cu-item.grayscale {
+	background-color: #f5f5f5
+}
+
+.cu-list.menu>.cu-item.cur {
+	background-color: #fcf7e9
+}
+
+.cu-list.menu>.cu-item.arrow {
+	padding-right: 90rpx
+}
+
+.cu-list.menu>.cu-item.arrow:before {
+	position: absolute;
+	top: 0;
+	right: 30rpx;
+	bottom: 0;
+	display: block;
+	margin: auto;
+	width: 30rpx;
+	height: 30rpx;
+	color: #8799a3;
+	content: "\e6a3";
+	text-align: center;
+	font-size: 34rpx;
+	font-family: cuIcon;
+	line-height: 30rpx
+}
+
+.cu-list.menu>.cu-item button.content {
+	padding: 0;
+	background-color: transparent;
+	justify-content: flex-start
+}
+
+.cu-list.menu>.cu-item button.content:after {
+	display: none
+}
+
+.cu-list.menu>.cu-item .cu-avatar-group .cu-avatar {
+	border-color: #ffffff
+}
+
+.cu-list.menu>.cu-item .content>view:first-child {
+	display: flex;
+	align-items: center
+}
+
+.cu-list.menu>.cu-item .content>text[class*=cuIcon] {
+	display: inline-block;
+	margin-right: 10rpx;
+	width: 1.6em;
+	text-align: center
+}
+
+.cu-list.menu>.cu-item .content>image {
+	display: inline-block;
+	margin-right: 10rpx;
+	width: 1.6em;
+	height: 1.6em;
+	vertical-align: middle
+}
+
+.cu-list.menu>.cu-item .content {
+	font-size: 30rpx;
+	line-height: 1.6em;
+	flex: 1
+}
+
+.cu-list.menu>.cu-item .content .cu-tag.sm {
+	display: inline-block;
+	margin-left: 10rpx;
+	height: 28rpx;
+	font-size: 16rpx;
+	line-height: 32rpx
+}
+
+.cu-list.menu>.cu-item .action .cu-tag:empty {
+	right: 10rpx
+}
+
+.cu-list.menu {
+	display: block;
+	overflow: hidden
+}
+
+.cu-list.menu.sm-border>.cu-item:after {
+	left: 30rpx;
+	width: calc(200% - 120rpx)
+}
+
+.cu-list.grid>.cu-item {
+	position: relative;
+	display: flex;
+	padding: 20rpx 0 30rpx;
+	transition-duration: 0s;
+	flex-direction: column
+}
+
+.cu-list.grid>.cu-item:after {
+	position: absolute;
+	top: 0;
+	left: 0;
+	box-sizing: border-box;
+	width: 200%;
+	height: 200%;
+	border-right: 1px solid rgba(0, 0, 0, .1);
+	border-bottom: 1px solid rgba(0, 0, 0, .1);
+	border-radius: inherit;
+	content: " ";
+	transform: scale(.5);
+	transform-origin: 0 0;
+	pointer-events: none
+}
+
+.cu-list.grid>.cu-item text {
+	display: block;
+	margin-top: 10rpx;
+	color: #888;
+	font-size: 26rpx;
+	line-height: 40rpx
+}
+
+.cu-list.grid>.cu-item [class*=cuIcon] {
+	position: relative;
+	display: block;
+	margin-top: 20rpx;
+	width: 100%;
+	font-size: 48rpx
+}
+
+.cu-list.grid>.cu-item .cu-tag {
+	right: auto;
+	left: 50%;
+	margin-left: 20rpx
+}
+
+.cu-list.grid {
+	background-color: #ffffff;
+	text-align: center
+}
+
+.cu-list.grid.no-border>.cu-item {
+	padding-top: 10rpx;
+	padding-bottom: 20rpx
+}
+
+.cu-list.grid.no-border>.cu-item:after {
+	border: none
+}
+
+.cu-list.grid.no-border {
+	padding: 20rpx 10rpx
+}
+
+.cu-list.grid.col-3>.cu-item:nth-child(3n):after,
+.cu-list.grid.col-4>.cu-item:nth-child(4n):after,
+.cu-list.grid.col-5>.cu-item:nth-child(5n):after {
+	border-right-width: 0
+}
+
+.cu-list.card-menu {
+	overflow: hidden;
+	margin-right: 30rpx;
+	margin-left: 30rpx;
+	border-radius: 20rpx
+}
+
+
+/* ==================
+          操作条
+ ==================== */
+
+.cu-bar {
+	display: flex;
+	position: relative;
+	align-items: center;
+	min-height: 100rpx;
+	justify-content: space-between;
+}
+
+.cu-bar .action {
+	display: flex;
+	align-items: center;
+	height: 100%;
+	justify-content: center;
+	max-width: 100%;
+}
+
+.cu-bar .action.border-title {
+	position: relative;
+	top: -10rpx;
+}
+
+.cu-bar .action.border-title text[class*="bg-"]:last-child {
+	position: absolute;
+	bottom: -0.5rem;
+	min-width: 2rem;
+	height: 6rpx;
+	left: 0;
+}
+
+.cu-bar .action.sub-title {
+	position: relative;
+	top: -0.2rem;
+}
+
+.cu-bar .action.sub-title text {
+	position: relative;
+	z-index: 1;
+}
+
+.cu-bar .action.sub-title text[class*="bg-"]:last-child {
+	position: absolute;
+	display: inline-block;
+	bottom: -0.2rem;
+	border-radius: 6rpx;
+	width: 100%;
+	height: 0.6rem;
+	left: 0.6rem;
+	opacity: 0.3;
+	z-index: 0;
+}
+
+.cu-bar .action.sub-title text[class*="text-"]:last-child {
+	position: absolute;
+	display: inline-block;
+	bottom: -0.7rem;
+	left: 0.5rem;
+	opacity: 0.2;
+	z-index: 0;
+	text-align: right;
+	font-weight: 900;
+	font-size: 36rpx;
+}
+
+.cu-bar.justify-center .action.border-title text:last-child,
+.cu-bar.justify-center .action.sub-title text:last-child {
+	left: 0;
+	right: 0;
+	margin: auto;
+	text-align: center;
+}
+
+.cu-bar .action:first-child {
+	margin-left: 30rpx;
+	font-size: 30rpx;
+}
+
+.cu-bar .action text.text-cut {
+	text-align: left;
+	width: 100%;
+}
+
+.cu-bar .cu-avatar:first-child {
+	margin-left: 20rpx;
+}
+
+.cu-bar .action:first-child>text[class*="cuIcon-"] {
+	margin-left: -0.3em;
+	margin-right: 0.3em;
+}
+
+.cu-bar .action:last-child {
+	margin-right: 30rpx;
+}
+
+.cu-bar .action>text[class*="cuIcon-"],
+.cu-bar .action>view[class*="cuIcon-"] {
+	font-size: 36rpx;
+}
+
+.cu-bar .action>text[class*="cuIcon-"]+text[class*="cuIcon-"] {
+	margin-left: 0.5em;
+}
+
+.cu-bar .content {
+	position: absolute;
+	text-align: center;
+	width: calc(100% - 340rpx);
+	left: 0;
+	right: 0;
+	bottom: 0;
+	top: 0;
+	margin: auto;
+	height: 60rpx;
+	font-size: 32rpx;
+	line-height: 60rpx;
+	cursor: none;
+	pointer-events: none;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+	overflow: hidden;
+}
+
+.cu-bar.ios .content {
+	bottom: 7px;
+	height: 30px;
+	font-size: 32rpx;
+	line-height: 30px;
+}
+
+.cu-bar.btn-group {
+	justify-content: space-around;
+}
+
+.cu-bar.btn-group button {
+	padding: 20rpx 32rpx;
+}
+
+.cu-bar.btn-group button {
+	flex: 1;
+	margin: 0 20rpx;
+	max-width: 50%;
+}
+
+.cu-bar .search-form {
+	background-color: #f5f5f5;
+	line-height: 64rpx;
+	height: 64rpx;
+	font-size: 24rpx;
+	color: #333333;
+	flex: 1;
+	display: flex;
+	align-items: center;
+	margin: 0 30rpx;
+}
+
+.cu-bar .search-form+.action {
+	margin-right: 30rpx;
+}
+
+.cu-bar .search-form input {
+	flex: 1;
+	padding-right: 30rpx;
+	height: 64rpx;
+	line-height: 64rpx;
+	font-size: 26rpx;
+	background-color: transparent;
+}
+
+.cu-bar .search-form [class*="cuIcon-"] {
+	margin: 0 0.5em 0 0.8em;
+}
+
+.cu-bar .search-form [class*="cuIcon-"]::before {
+	top: 0rpx;
+}
+
+.cu-bar.fixed,
+.nav.fixed {
+	position: fixed;
+	width: 100%;
+	top: 0;
+	z-index: 1024;
+	box-shadow: 0 1rpx 6rpx rgba(0, 0, 0, 0.1);
+}
+
+.cu-bar.foot {
+	position: fixed;
+	width: 100%;
+	bottom: 0;
+	z-index: 1024;
+	box-shadow: 0 -1rpx 6rpx rgba(0, 0, 0, 0.1);
+}
+
+.cu-bar.tabbar {
+	padding: 0;
+	height: calc(100rpx + env(safe-area-inset-bottom) / 2);
+	padding-bottom: calc(env(safe-area-inset-bottom) / 2);
+}
+
+.cu-tabbar-height {
+	min-height: 100rpx;
+	height: calc(100rpx + env(safe-area-inset-bottom) / 2);
+}
+
+.cu-bar.tabbar.shadow {
+	box-shadow: 0 -1rpx 6rpx rgba(0, 0, 0, 0.1);
+}
+
+.cu-bar.tabbar .action {
+	font-size: 22rpx;
+	position: relative;
+	flex: 1;
+	text-align: center;
+	padding: 0;
+	display: block;
+	height: auto;
+	line-height: 1;
+	margin: 0;
+	background-color: inherit;
+	overflow: initial;
+}
+
+.cu-bar.tabbar.shop .action {
+	width: 140rpx;
+	flex: initial;
+}
+
+.cu-bar.tabbar .action.add-action {
+	position: relative;
+	z-index: 2;
+	padding-top: 50rpx;
+}
+
+.cu-bar.tabbar .action.add-action [class*="cuIcon-"] {
+	position: absolute;
+	width: 70rpx;
+	z-index: 2;
+	height: 70rpx;
+	border-radius: 50%;
+	line-height: 70rpx;
+	font-size: 50rpx;
+	top: -35rpx;
+	left: 0;
+	right: 0;
+	margin: auto;
+	padding: 0;
+}
+
+.cu-bar.tabbar .action.add-action::after {
+	content: "";
+	position: absolute;
+	width: 100rpx;
+	height: 100rpx;
+	top: -50rpx;
+	left: 0;
+	right: 0;
+	margin: auto;
+	box-shadow: 0 -3rpx 8rpx rgba(0, 0, 0, 0.08);
+	border-radius: 50rpx;
+	background-color: inherit;
+	z-index: 0;
+}
+
+.cu-bar.tabbar .action.add-action::before {
+	content: "";
+	position: absolute;
+	width: 100rpx;
+	height: 30rpx;
+	bottom: 30rpx;
+	left: 0;
+	right: 0;
+	margin: auto;
+	background-color: inherit;
+	z-index: 1;
+}
+
+.cu-bar.tabbar .btn-group {
+	flex: 1;
+	display: flex;
+	justify-content: space-around;
+	align-items: center;
+	padding: 0 10rpx;
+}
+
+.cu-bar.tabbar button.action::after {
+	border: 0;
+}
+
+.cu-bar.tabbar .action [class*="cuIcon-"] {
+	width: 100rpx;
+	position: relative;
+	display: block;
+	height: auto;
+	margin: 0 auto 10rpx;
+	text-align: center;
+	font-size: 40rpx;
+}
+
+.cu-bar.tabbar .action .cuIcon-cu-image {
+	margin: 0 auto;
+}
+
+.cu-bar.tabbar .action .cuIcon-cu-image image {
+	width: 50rpx;
+	height: 50rpx;
+	display: inline-block;
+}
+
+.cu-bar.tabbar .submit {
+	align-items: center;
+	display: flex;
+	justify-content: center;
+	text-align: center;
+	position: relative;
+	flex: 2;
+	align-self: stretch;
+}
+
+.cu-bar.tabbar .submit:last-child {
+	flex: 2.6;
+}
+
+.cu-bar.tabbar .submit+.submit {
+	flex: 2;
+}
+
+.cu-bar.tabbar.border .action::before {
+	content: " ";
+	width: 200%;
+	height: 200%;
+	position: absolute;
+	top: 0;
+	left: 0;
+	transform: scale(0.5);
+	transform-origin: 0 0;
+	border-right: 1rpx solid rgba(0, 0, 0, 0.1);
+	z-index: 3;
+}
+
+.cu-bar.tabbar.border .action:last-child:before {
+	display: none;
+}
+
+.cu-bar.input {
+	padding-right: 20rpx;
+	background-color: #ffffff;
+}
+
+.cu-bar.input input {
+	overflow: initial;
+	line-height: 64rpx;
+	height: 64rpx;
+	min-height: 64rpx;
+	flex: 1;
+	font-size: 30rpx;
+	margin: 0 20rpx;
+}
+
+.cu-bar.input .action {
+	margin-left: 20rpx;
+}
+
+.cu-bar.input .action [class*="cuIcon-"] {
+	font-size: 48rpx;
+}
+
+.cu-bar.input input+.action {
+	margin-right: 20rpx;
+	margin-left: 0rpx;
+}
+
+.cu-bar.input .action:first-child [class*="cuIcon-"] {
+	margin-left: 0rpx;
+}
+
+.cu-custom {
+	display: block;
+	position: relative;
+}
+
+.cu-custom .cu-bar .content {
+	width: calc(100% - 440rpx);
+}
+
+/* #ifdef MP-ALIPAY */
+.cu-custom .cu-bar .action .cuIcon-back {
+	opacity: 0;
+}
+
+/* #endif */
+
+.cu-custom .cu-bar .content image {
+	height: 60rpx;
+	width: 240rpx;
+}
+
+.cu-custom .cu-bar {
+	min-height: 0px;
+	/* #ifdef MP-WEIXIN */
+	padding-right: 220rpx;
+	/* #endif */
+	/* #ifdef MP-ALIPAY */
+	padding-right: 150rpx;
+	/* #endif */
+	box-shadow: 0rpx 0rpx 0rpx;
+	z-index: 9999;
+}
+
+.cu-custom .cu-bar .border-custom {
+	position: relative;
+	background: rgba(0, 0, 0, 0.15);
+	border-radius: 1000rpx;
+	height: 30px;
+}
+
+.cu-custom .cu-bar .border-custom::after {
+	content: " ";
+	width: 200%;
+	height: 200%;
+	position: absolute;
+	top: 0;
+	left: 0;
+	border-radius: inherit;
+	transform: scale(0.5);
+	transform-origin: 0 0;
+	pointer-events: none;
+	box-sizing: border-box;
+	border: 1rpx solid #ffffff;
+	opacity: 0.5;
+}
+
+.cu-custom .cu-bar .border-custom::before {
+	content: " ";
+	width: 1rpx;
+	height: 110%;
+	position: absolute;
+	top: 22.5%;
+	left: 0;
+	right: 0;
+	margin: auto;
+	transform: scale(0.5);
+	transform-origin: 0 0;
+	pointer-events: none;
+	box-sizing: border-box;
+	opacity: 0.6;
+	background-color: #ffffff;
+}
+
+.cu-custom .cu-bar .border-custom text {
+	display: block;
+	flex: 1;
+	margin: auto !important;
+	text-align: center;
+	font-size: 34rpx;
+}
+
+/* ==================
+         导航栏
+ ==================== */
+
+.nav {
+	white-space: nowrap;
+}
+
+::-webkit-scrollbar {
+	display: none;
+}
+
+.nav .cu-item {
+	height: 90rpx;
+	display: inline-block;
+	line-height: 90rpx;
+	margin: 0 10rpx;
+	padding: 0 20rpx;
+}
+
+.nav .cu-item.cur {
+	border-bottom: 4rpx solid;
+}
+
+/* ==================
+         时间轴
+ ==================== */
+
+.cu-timeline {
+	display: block;
+	background-color: #ffffff;
+}
+
+.cu-timeline .cu-time {
+	width: 120rpx;
+	text-align: center;
+	padding: 20rpx 0;
+	font-size: 26rpx;
+	color: #888;
+	display: block;
+}
+
+.cu-timeline>.cu-item {
+	padding: 30rpx 30rpx 30rpx 120rpx;
+	position: relative;
+	display: block;
+	z-index: 0;
+}
+
+.cu-timeline>.cu-item:not([class*="text-"]) {
+	color: #ccc;
+}
+
+.cu-timeline>.cu-item::after {
+	content: "";
+	display: block;
+	position: absolute;
+	width: 1rpx;
+	background-color: #ddd;
+	left: 60rpx;
+	height: 100%;
+	top: 0;
+	z-index: 8;
+}
+
+.cu-timeline>.cu-item::before {
+	font-family: "cuIcon";
+	display: block;
+	position: absolute;
+	top: 36rpx;
+	z-index: 9;
+	background-color: #ffffff;
+	width: 50rpx;
+	height: 50rpx;
+	text-align: center;
+	border: none;
+	line-height: 50rpx;
+	left: 36rpx;
+}
+
+.cu-timeline>.cu-item:not([class*="cuIcon-"])::before {
+	content: "\e763";
+}
+
+.cu-timeline>.cu-item[class*="cuIcon-"]::before {
+	background-color: #ffffff;
+	width: 50rpx;
+	height: 50rpx;
+	text-align: center;
+	border: none;
+	line-height: 50rpx;
+	left: 36rpx;
+}
+
+.cu-timeline>.cu-item>.content {
+	padding: 30rpx;
+	border-radius: 6rpx;
+	display: block;
+	line-height: 1.6;
+}
+
+.cu-timeline>.cu-item>.content:not([class*="bg-"]) {
+	background-color: #f1f1f1;
+	color: #333333;
+}
+
+.cu-timeline>.cu-item>.content+.content {
+	margin-top: 20rpx;
+}
+
+/* ==================
+         聊天
+ ==================== */
+
+.cu-chat {
+	display: flex;
+	flex-direction: column;
+}
+
+.cu-chat .cu-item {
+	display: flex;
+	padding: 30rpx 30rpx 70rpx;
+	position: relative;
+}
+
+.cu-chat .cu-item>.cu-avatar {
+	width: 80rpx;
+	height: 80rpx;
+}
+
+.cu-chat .cu-item>.main {
+	max-width: calc(100% - 260rpx);
+	margin: 0 40rpx;
+	display: flex;
+	align-items: center;
+}
+
+.cu-chat .cu-item>image {
+	height: 320rpx;
+}
+
+.cu-chat .cu-item>.main .content {
+	padding: 20rpx;
+	border-radius: 6rpx;
+	display: inline-flex;
+	max-width: 100%;
+	align-items: center;
+	font-size: 30rpx;
+	position: relative;
+	min-height: 80rpx;
+	line-height: 40rpx;
+	text-align: left;
+}
+
+.cu-chat .cu-item>.main .content:not([class*="bg-"]) {
+	background-color: #ffffff;
+	color: #333333;
+}
+
+.cu-chat .cu-item .date {
+	position: absolute;
+	font-size: 24rpx;
+	color: #8799a3;
+	width: calc(100% - 320rpx);
+	bottom: 20rpx;
+	left: 160rpx;
+}
+
+.cu-chat .cu-item .action {
+	padding: 0 30rpx;
+	display: flex;
+	align-items: center;
+}
+
+.cu-chat .cu-item>.main .content::after {
+	content: "";
+	top: 27rpx;
+	transform: rotate(45deg);
+	position: absolute;
+	z-index: 100;
+	display: inline-block;
+	overflow: hidden;
+	width: 24rpx;
+	height: 24rpx;
+	left: -12rpx;
+	right: initial;
+	background-color: inherit;
+}
+
+.cu-chat .cu-item.self>.main .content::after {
+	left: auto;
+	right: -12rpx;
+}
+
+.cu-chat .cu-item>.main .content::before {
+	content: "";
+	top: 30rpx;
+	transform: rotate(45deg);
+	position: absolute;
+	z-index: -1;
+	display: inline-block;
+	overflow: hidden;
+	width: 24rpx;
+	height: 24rpx;
+	left: -12rpx;
+	right: initial;
+	background-color: inherit;
+	filter: blur(5rpx);
+	opacity: 0.3;
+}
+
+.cu-chat .cu-item>.main .content:not([class*="bg-"])::before {
+	background-color: #333333;
+	opacity: 0.1;
+}
+
+.cu-chat .cu-item.self>.main .content::before {
+	left: auto;
+	right: -12rpx;
+}
+
+.cu-chat .cu-item.self {
+	justify-content: flex-end;
+	text-align: right;
+}
+
+.cu-chat .cu-info {
+	display: inline-block;
+	margin: 20rpx auto;
+	font-size: 24rpx;
+	padding: 8rpx 12rpx;
+	background-color: rgba(0, 0, 0, 0.2);
+	border-radius: 6rpx;
+	color: #ffffff;
+	max-width: 400rpx;
+	line-height: 1.4;
+}
+
+/* ==================
+         卡片
+ ==================== */
+
+.cu-card {
+	display: block;
+	overflow: hidden;
+}
+
+.cu-card>.cu-item {
+	display: block;
+	background-color: #ffffff;
+	overflow: hidden;
+	border-radius: 10rpx;
+	margin: 30rpx;
+}
+
+.cu-card>.cu-item.shadow-blur {
+	overflow: initial;
+}
+
+.cu-card.no-card>.cu-item {
+	margin: 0rpx;
+	border-radius: 0rpx;
+}
+
+.cu-card .grid.grid-square {
+	margin-bottom: -20rpx;
+}
+
+.cu-card.case .image {
+	position: relative;
+}
+
+.cu-card.case .image image {
+	width: 100%;
+}
+
+.cu-card.case .image .cu-tag {
+	position: absolute;
+	right: 0;
+	top: 0;
+}
+
+.cu-card.case .image .cu-bar {
+	position: absolute;
+	bottom: 0;
+	width: 100%;
+	background-color: transparent;
+	padding: 0rpx 30rpx;
+}
+
+.cu-card.case.no-card .image {
+	margin: 30rpx 30rpx 0;
+	overflow: hidden;
+	border-radius: 10rpx;
+}
+
+.cu-card.dynamic {
+	display: block;
+}
+
+.cu-card.dynamic>.cu-item {
+	display: block;
+	background-color: #ffffff;
+	overflow: hidden;
+}
+
+.cu-card.dynamic>.cu-item>.text-content {
+	padding: 0 30rpx 0;
+	max-height: 6.4em;
+	overflow: hidden;
+	font-size: 30rpx;
+	margin-bottom: 20rpx;
+}
+
+.cu-card.dynamic>.cu-item .square-img {
+	width: 100%;
+	height: 200rpx;
+	border-radius: 6rpx;
+}
+
+.cu-card.dynamic>.cu-item .only-img {
+	width: 100%;
+	height: 320rpx;
+	border-radius: 6rpx;
+}
+
+/* card.dynamic>.cu-item .comment {
+  padding: 20rpx;
+  background-color: #f1f1f1;
+  margin: 0 30rpx 30rpx;
+  border-radius: 6rpx;
+} */
+
+.cu-card.article {
+	display: block;
+}
+
+.cu-card.article>.cu-item {
+	padding-bottom: 30rpx;
+}
+
+.cu-card.article>.cu-item .title {
+	font-size: 30rpx;
+	font-weight: 900;
+	color: #333333;
+	line-height: 100rpx;
+	padding: 0 30rpx;
+}
+
+.cu-card.article>.cu-item .content {
+	display: flex;
+	padding: 0 30rpx;
+}
+
+.cu-card.article>.cu-item .content>image {
+	width: 240rpx;
+	height: 6.4em;
+	margin-right: 20rpx;
+	border-radius: 6rpx;
+}
+
+.cu-card.article>.cu-item .content .desc {
+	flex: 1;
+	display: flex;
+	flex-direction: column;
+	justify-content: space-between;
+}
+
+.cu-card.article>.cu-item .content .text-content {
+	font-size: 28rpx;
+	color: #888;
+	height: 4.8em;
+	overflow: hidden;
+}
+
+/* ==================
+         表单
+ ==================== */
+
+.cu-form-group {
+	background-color: #ffffff;
+	padding: 1rpx 30rpx;
+	display: flex;
+	align-items: center;
+	min-height: 100rpx;
+	justify-content: space-between;
+}
+
+.cu-form-group+.cu-form-group {
+	border-top: 1rpx solid #eee;
+}
+
+.cu-form-group .title {
+	text-align: justify;
+	padding-right: 30rpx;
+	font-size: 30rpx;
+	position: relative;
+	height: 60rpx;
+	line-height: 60rpx;
+}
+
+.cu-form-group input {
+	flex: 1;
+	font-size: 30rpx;
+	color: #555;
+	padding-right: 20rpx;
+}
+
+.cu-form-group>text[class*="cuIcon-"] {
+	font-size: 36rpx;
+	padding: 0;
+	box-sizing: border-box;
+}
+
+.cu-form-group textarea {
+	margin: 32rpx 0 30rpx;
+	height: 4.6em;
+	width: 100%;
+	line-height: 1.2em;
+	flex: 1;
+	font-size: 28rpx;
+	padding: 0;
+}
+
+.cu-form-group.align-start .title {
+	height: 1em;
+	margin-top: 32rpx;
+	line-height: 1em;
+}
+
+.cu-form-group picker {
+	flex: 1;
+	padding-right: 40rpx;
+	overflow: hidden;
+	position: relative;
+}
+
+.cu-form-group picker .picker {
+	line-height: 100rpx;
+	font-size: 28rpx;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+	overflow: hidden;
+	width: 100%;
+	text-align: right;
+}
+
+.cu-form-group picker::after {
+	font-family: cuIcon;
+	display: block;
+	content: "\e6a3";
+	position: absolute;
+	font-size: 34rpx;
+	color: #8799a3;
+	line-height: 100rpx;
+	width: 60rpx;
+	text-align: center;
+	top: 0;
+	bottom: 0;
+	right: -20rpx;
+	margin: auto;
+}
+
+.cu-form-group textarea[disabled],
+.cu-form-group textarea[disabled] .placeholder {
+	color: transparent;
+}
+
+/* ==================
+         模态窗口
+ ==================== */
+
+.cu-modal {
+	position: fixed;
+	top: 0;
+	right: 0;
+	bottom: 0;
+	left: 0;
+	z-index: 1110;
+	opacity: 0;
+	outline: 0;
+	text-align: center;
+	-ms-transform: scale(1.185);
+	transform: scale(1.185);
+	backface-visibility: hidden;
+	perspective: 2000rpx;
+	background: rgba(0, 0, 0, 0.6);
+	transition: all 0.3s ease-in-out 0s;
+	pointer-events: none;
+}
+
+.cu-modal::before {
+	content: "\200B";
+	display: inline-block;
+	height: 100%;
+	vertical-align: middle;
+}
+
+.cu-modal.show {
+	opacity: 1;
+	transition-duration: 0.3s;
+	-ms-transform: scale(1);
+	transform: scale(1);
+	overflow-x: hidden;
+	overflow-y: auto;
+	pointer-events: auto;
+}
+
+.cu-dialog {
+	position: relative;
+	display: inline-block;
+	vertical-align: middle;
+	margin-left: auto;
+	margin-right: auto;
+	width: 680rpx;
+	max-width: 100%;
+	background-color: #f8f8f8;
+	border-radius: 10rpx;
+	overflow: hidden;
+}
+
+.cu-modal.bottom-modal::before {
+	vertical-align: bottom;
+}
+
+.cu-modal.bottom-modal .cu-dialog {
+	width: 100%;
+	border-radius: 0;
+}
+
+.cu-modal.bottom-modal {
+	margin-bottom: -1000rpx;
+}
+
+.cu-modal.bottom-modal.show {
+	margin-bottom: 0;
+}
+
+.cu-modal.drawer-modal {
+	transform: scale(1);
+	display: flex;
+}
+
+.cu-modal.drawer-modal .cu-dialog {
+	height: 100%;
+	min-width: 200rpx;
+	border-radius: 0;
+	margin: initial;
+	transition-duration: 0.3s;
+}
+
+.cu-modal.drawer-modal.justify-start .cu-dialog {
+	transform: translateX(-100%);
+}
+
+.cu-modal.drawer-modal.justify-end .cu-dialog {
+	transform: translateX(100%);
+}
+
+.cu-modal.drawer-modal.show .cu-dialog {
+	transform: translateX(0%);
+}
+.cu-modal .cu-dialog>.cu-bar:first-child .action{
+  min-width: 100rpx;
+  margin-right: 0;
+  min-height: 100rpx;
+}
+/* ==================
+         轮播
+ ==================== */
+swiper .a-swiper-dot {
+	display: inline-block;
+	width: 16rpx;
+	height: 16rpx;
+	background: rgba(0, 0, 0, .3);
+	border-radius: 50%;
+	vertical-align: middle;
+}
+
+swiper[class*="-dot"] .wx-swiper-dots,
+swiper[class*="-dot"] .a-swiper-dots,
+swiper[class*="-dot"] .uni-swiper-dots {
+	display: flex;
+	align-items: center;
+	width: 100%;
+	justify-content: center;
+}
+
+swiper.square-dot .wx-swiper-dot,
+swiper.square-dot .a-swiper-dot,
+swiper.square-dot .uni-swiper-dot {
+	background-color: #ffffff;
+	opacity: 0.4;
+	width: 10rpx;
+	height: 10rpx;
+	border-radius: 20rpx;
+	margin: 0 8rpx !important;
+}
+
+swiper.square-dot .wx-swiper-dot.wx-swiper-dot-active,
+swiper.square-dot .a-swiper-dot.a-swiper-dot-active,
+swiper.square-dot .uni-swiper-dot.uni-swiper-dot-active {
+	opacity: 1;
+	width: 30rpx;
+}
+
+swiper.round-dot .wx-swiper-dot,
+swiper.round-dot .a-swiper-dot,
+swiper.round-dot .uni-swiper-dot {
+	width: 10rpx;
+	height: 10rpx;
+	position: relative;
+	margin: 4rpx 8rpx !important;
+}
+
+swiper.round-dot .wx-swiper-dot.wx-swiper-dot-active::after,
+swiper.round-dot .a-swiper-dot.a-swiper-dot-active::after,
+swiper.round-dot .uni-swiper-dot.uni-swiper-dot-active::after {
+	content: "";
+	position: absolute;
+	width: 10rpx;
+	height: 10rpx;
+	top: 0rpx;
+	left: 0rpx;
+	right: 0;
+	bottom: 0;
+	margin: auto;
+	background-color: #ffffff;
+	border-radius: 20rpx;
+}
+
+swiper.round-dot .wx-swiper-dot.wx-swiper-dot-active,
+swiper.round-dot .a-swiper-dot.a-swiper-dot-active,
+swiper.round-dot .uni-swiper-dot.uni-swiper-dot-active {
+	width: 18rpx;
+	height: 18rpx;
+}
+
+.screen-swiper {
+	min-height: 375rpx;
+}
+
+.screen-swiper image,
+.screen-swiper video,
+.swiper-item image,
+.swiper-item video {
+	width: 100%;
+	display: block;
+	height: 100%;
+	margin: 0;
+	pointer-events: none;
+}
+
+.card-swiper {
+	height: 420rpx !important;
+}
+
+.card-swiper swiper-item {
+	width: 610rpx !important;
+	left: 70rpx;
+	box-sizing: border-box;
+	padding: 40rpx 0rpx 70rpx;
+	overflow: initial;
+}
+
+.card-swiper swiper-item .swiper-item {
+	width: 100%;
+	display: block;
+	height: 100%;
+	border-radius: 10rpx;
+	transform: scale(0.9);
+	transition: all 0.2s ease-in 0s;
+	overflow: hidden;
+}
+
+.card-swiper swiper-item.cur .swiper-item {
+	transform: none;
+	transition: all 0.2s ease-in 0s;
+}
+
+
+.tower-swiper {
+	height: 420rpx;
+	position: relative;
+	max-width: 750rpx;
+	overflow: hidden;
+}
+
+.tower-swiper .tower-item {
+	position: absolute;
+	width: 300rpx;
+	height: 380rpx;
+	top: 0;
+	bottom: 0;
+	left: 50%;
+	margin: auto;
+	transition: all 0.2s ease-in 0s;
+	opacity: 1;
+}
+
+.tower-swiper .tower-item.none {
+	opacity: 0;
+}
+
+.tower-swiper .tower-item .swiper-item {
+	width: 100%;
+	height: 100%;
+	border-radius: 6rpx;
+	overflow: hidden;
+}
+
+/* ==================
+          步骤条
+ ==================== */
+
+.cu-steps {
+	display: flex;
+}
+
+scroll-view.cu-steps {
+	display: block;
+	white-space: nowrap;
+}
+
+scroll-view.cu-steps .cu-item {
+	display: inline-block;
+}
+
+.cu-steps .cu-item {
+	flex: 1;
+	text-align: center;
+	position: relative;
+	min-width: 100rpx;
+}
+
+.cu-steps .cu-item:not([class*="text-"]) {
+	color: #8799a3;
+}
+
+.cu-steps .cu-item [class*="cuIcon-"],
+.cu-steps .cu-item .num {
+	display: block;
+	font-size: 40rpx;
+	line-height: 80rpx;
+}
+
+.cu-steps .cu-item::before,
+.cu-steps .cu-item::after,
+.cu-steps.steps-arrow .cu-item::before,
+.cu-steps.steps-arrow .cu-item::after {
+	content: "";
+	display: block;
+	position: absolute;
+	height: 0px;
+	width: calc(100% - 80rpx);
+	border-bottom: 1px solid #ccc;
+	left: calc(0px - (100% - 80rpx) / 2);
+	top: 40rpx;
+	z-index: 0;
+}
+
+.cu-steps.steps-arrow .cu-item::before,
+.cu-steps.steps-arrow .cu-item::after {
+	content: "\e6a3";
+	font-family: 'cuIcon';
+	height: 30rpx;
+	border-bottom-width: 0px;
+	line-height: 30rpx;
+	top: 0;
+	bottom: 0;
+	margin: auto;
+	color: #ccc;
+}
+
+.cu-steps.steps-bottom .cu-item::before,
+.cu-steps.steps-bottom .cu-item::after {
+	bottom: 40rpx;
+	top: initial;
+}
+
+.cu-steps .cu-item::after {
+	border-bottom: 1px solid currentColor;
+	width: 0px;
+	transition: all 0.3s ease-in-out 0s;
+}
+
+.cu-steps .cu-item[class*="text-"]::after {
+	width: calc(100% - 80rpx);
+	color: currentColor;
+}
+
+.cu-steps .cu-item:first-child::before,
+.cu-steps .cu-item:first-child::after {
+	display: none;
+}
+
+.cu-steps .cu-item .num {
+	width: 40rpx;
+	height: 40rpx;
+	border-radius: 50%;
+	line-height: 40rpx;
+	margin: 20rpx auto;
+	font-size: 24rpx;
+	border: 1px solid currentColor;
+	position: relative;
+	overflow: hidden;
+}
+
+.cu-steps .cu-item[class*="text-"] .num {
+	background-color: currentColor;
+}
+
+.cu-steps .cu-item .num::before,
+.cu-steps .cu-item .num::after {
+	content: attr(data-index);
+	position: absolute;
+	left: 0;
+	right: 0;
+	top: 0;
+	bottom: 0;
+	margin: auto;
+	transition: all 0.3s ease-in-out 0s;
+	transform: translateY(0rpx);
+}
+
+.cu-steps .cu-item[class*="text-"] .num::before {
+	transform: translateY(-40rpx);
+	color: #ffffff;
+}
+
+.cu-steps .cu-item .num::after {
+	transform: translateY(40rpx);
+	color: #ffffff;
+	transition: all 0.3s ease-in-out 0s;
+}
+
+.cu-steps .cu-item[class*="text-"] .num::after {
+	content: "\e645";
+	font-family: 'cuIcon';
+	color: #ffffff;
+	transform: translateY(0rpx);
+}
+
+.cu-steps .cu-item[class*="text-"] .num.err::after {
+	content: "\e646";
+}
+
+/* ==================
+          布局
+ ==================== */
+
+/*  -- flex弹性布局 -- */
+
+.flex {
+	display: flex;
+}
+
+.basis-xs {
+	flex-basis: 20%;
+}
+
+.basis-sm {
+	flex-basis: 40%;
+}
+
+.basis-df {
+	flex-basis: 50%;
+}
+
+.basis-lg {
+	flex-basis: 60%;
+}
+
+.basis-xl {
+	flex-basis: 80%;
+}
+
+.flex-sub {
+	flex: 1;
+}
+
+.flex-twice {
+	flex: 2;
+}
+
+.flex-treble {
+	flex: 3;
+}
+
+.flex-direction {
+	flex-direction: column;
+}
+
+.flex-wrap {
+	flex-wrap: wrap;
+}
+
+.align-start {
+	align-items: flex-start;
+}
+
+.align-end {
+	align-items: flex-end;
+}
+
+.align-center {
+	align-items: center;
+}
+
+.align-stretch {
+	align-items: stretch;
+}
+
+.self-start {
+	align-self: flex-start;
+}
+
+.self-center {
+	align-self: flex-center;
+}
+
+.self-end {
+	align-self: flex-end;
+}
+
+.self-stretch {
+	align-self: stretch;
+}
+
+.align-stretch {
+	align-items: stretch;
+}
+
+.justify-start {
+	justify-content: flex-start;
+}
+
+.justify-end {
+	justify-content: flex-end;
+}
+
+.justify-center {
+	justify-content: center;
+}
+
+.justify-between {
+	justify-content: space-between;
+}
+
+.justify-around {
+	justify-content: space-around;
+}
+
+/* grid布局 */
+
+.grid {
+	display: flex;
+	flex-wrap: wrap;
+}
+
+.grid.grid-square {
+	overflow: hidden;
+}
+
+.grid.grid-square .cu-tag {
+	position: absolute;
+	right: 0;
+	top: 0;
+	border-bottom-left-radius: 6rpx;
+	padding: 6rpx 12rpx;
+	height: auto;
+	background-color: rgba(0, 0, 0, 0.5);
+}
+
+.grid.grid-square>view>text[class*="cuIcon-"] {
+	font-size: 52rpx;
+	position: absolute;
+	color: #8799a3;
+	margin: auto;
+	top: 0;
+	bottom: 0;
+	left: 0;
+	right: 0;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	flex-direction: column;
+}
+
+.grid.grid-square>view {
+	margin-right: 20rpx;
+	margin-bottom: 20rpx;
+	border-radius: 6rpx;
+	position: relative;
+	overflow: hidden;
+}
+.grid.grid-square>view.bg-img image {
+	width: 100%;
+	height: 100%;
+	position: absolute;
+}
+.grid.col-1.grid-square>view {
+	padding-bottom: 100%;
+	height: 0;
+	margin-right: 0;
+}
+
+.grid.col-2.grid-square>view {
+	padding-bottom: calc((100% - 20rpx)/2);
+	height: 0;
+	width: calc((100% - 20rpx)/2);
+}
+
+.grid.col-3.grid-square>view {
+	padding-bottom: calc((100% - 40rpx)/3);
+	height: 0;
+	width: calc((100% - 40rpx)/3);
+}
+
+.grid.col-4.grid-square>view {
+	padding-bottom: calc((100% - 60rpx)/4);
+	height: 0;
+	width: calc((100% - 60rpx)/4);
+}
+
+.grid.col-5.grid-square>view {
+	padding-bottom: calc((100% - 80rpx)/5);
+	height: 0;
+	width: calc((100% - 80rpx)/5);
+}
+
+.grid.col-2.grid-square>view:nth-child(2n),
+.grid.col-3.grid-square>view:nth-child(3n),
+.grid.col-4.grid-square>view:nth-child(4n),
+.grid.col-5.grid-square>view:nth-child(5n) {
+	margin-right: 0;
+}
+
+.grid.col-1>view {
+	width: 100%;
+}
+
+.grid.col-2>view {
+	width: 50%;
+}
+
+.grid.col-3>view {
+	width: 33.33%;
+}
+
+.grid.col-4>view {
+	width: 25%;
+}
+
+.grid.col-5>view {
+	width: 20%;
+}
+
+/*  -- 内外边距 -- */
+
+.margin-0 {
+	margin: 0;
+}
+
+.margin-xs {
+	margin: 10rpx;
+}
+
+.margin-sm {
+	margin: 20rpx;
+}
+
+.margin {
+	margin: 30rpx;
+}
+
+.margin-lg {
+	margin: 40rpx;
+}
+
+.margin-xl {
+	margin: 50rpx;
+}
+
+.margin-top-xs {
+	margin-top: 10rpx;
+}
+
+.margin-top-sm {
+	margin-top: 20rpx;
+}
+
+.margin-top {
+	margin-top: 30rpx;
+}
+
+.margin-top-lg {
+	margin-top: 40rpx;
+}
+
+.margin-top-xl {
+	margin-top: 50rpx;
+}
+
+.margin-right-xs {
+	margin-right: 10rpx;
+}
+
+.margin-right-sm {
+	margin-right: 20rpx;
+}
+
+.margin-right {
+	margin-right: 30rpx;
+}
+
+.margin-right-lg {
+	margin-right: 40rpx;
+}
+
+.margin-right-xl {
+	margin-right: 50rpx;
+}
+
+.margin-bottom-xs {
+	margin-bottom: 10rpx;
+}
+
+.margin-bottom-sm {
+	margin-bottom: 20rpx;
+}
+
+.margin-bottom {
+	margin-bottom: 30rpx;
+}
+
+.margin-bottom-lg {
+	margin-bottom: 40rpx;
+}
+
+.margin-bottom-xl {
+	margin-bottom: 50rpx;
+}
+
+.margin-left-xs {
+	margin-left: 10rpx;
+}
+
+.margin-left-sm {
+	margin-left: 20rpx;
+}
+
+.margin-left {
+	margin-left: 30rpx;
+}
+
+.margin-left-lg {
+	margin-left: 40rpx;
+}
+
+.margin-left-xl {
+	margin-left: 50rpx;
+}
+
+.margin-lr-xs {
+	margin-left: 10rpx;
+	margin-right: 10rpx;
+}
+
+.margin-lr-sm {
+	margin-left: 20rpx;
+	margin-right: 20rpx;
+}
+
+.margin-lr {
+	margin-left: 30rpx;
+	margin-right: 30rpx;
+}
+
+.margin-lr-lg {
+	margin-left: 40rpx;
+	margin-right: 40rpx;
+}
+
+.margin-lr-xl {
+	margin-left: 50rpx;
+	margin-right: 50rpx;
+}
+
+.margin-tb-xs {
+	margin-top: 10rpx;
+	margin-bottom: 10rpx;
+}
+
+.margin-tb-sm {
+	margin-top: 20rpx;
+	margin-bottom: 20rpx;
+}
+
+.margin-tb {
+	margin-top: 30rpx;
+	margin-bottom: 30rpx;
+}
+
+.margin-tb-lg {
+	margin-top: 40rpx;
+	margin-bottom: 40rpx;
+}
+
+.margin-tb-xl {
+	margin-top: 50rpx;
+	margin-bottom: 50rpx;
+}
+
+.padding-0 {
+	padding: 0;
+}
+
+.padding-xs {
+	padding: 10rpx;
+}
+
+.padding-sm {
+	padding: 20rpx;
+}
+
+.padding {
+	padding: 30rpx;
+}
+
+.padding-lg {
+	padding: 40rpx;
+}
+
+.padding-xl {
+	padding: 50rpx;
+}
+
+.padding-top-xs {
+	padding-top: 10rpx;
+}
+
+.padding-top-sm {
+	padding-top: 20rpx;
+}
+
+.padding-top {
+	padding-top: 30rpx;
+}
+
+.padding-top-lg {
+	padding-top: 40rpx;
+}
+
+.padding-top-xl {
+	padding-top: 50rpx;
+}
+
+.padding-right-xs {
+	padding-right: 10rpx;
+}
+
+.padding-right-sm {
+	padding-right: 20rpx;
+}
+
+.padding-right {
+	padding-right: 30rpx;
+}
+
+.padding-right-lg {
+	padding-right: 40rpx;
+}
+
+.padding-right-xl {
+	padding-right: 50rpx;
+}
+
+.padding-bottom-xs {
+	padding-bottom: 10rpx;
+}
+
+.padding-bottom-sm {
+	padding-bottom: 20rpx;
+}
+
+.padding-bottom {
+	padding-bottom: 30rpx;
+}
+
+.padding-bottom-lg {
+	padding-bottom: 40rpx;
+}
+
+.padding-bottom-xl {
+	padding-bottom: 50rpx;
+}
+
+.padding-left-xs {
+	padding-left: 10rpx;
+}
+
+.padding-left-sm {
+	padding-left: 20rpx;
+}
+
+.padding-left {
+	padding-left: 30rpx;
+}
+
+.padding-left-lg {
+	padding-left: 40rpx;
+}
+
+.padding-left-xl {
+	padding-left: 50rpx;
+}
+
+.padding-lr-xs {
+	padding-left: 10rpx;
+	padding-right: 10rpx;
+}
+
+.padding-lr-sm {
+	padding-left: 20rpx;
+	padding-right: 20rpx;
+}
+
+.padding-lr {
+	padding-left: 30rpx;
+	padding-right: 30rpx;
+}
+
+.padding-lr-lg {
+	padding-left: 40rpx;
+	padding-right: 40rpx;
+}
+
+.padding-lr-xl {
+	padding-left: 50rpx;
+	padding-right: 50rpx;
+}
+
+.padding-tb-xs {
+	padding-top: 10rpx;
+	padding-bottom: 10rpx;
+}
+
+.padding-tb-sm {
+	padding-top: 20rpx;
+	padding-bottom: 20rpx;
+}
+
+.padding-tb {
+	padding-top: 30rpx;
+	padding-bottom: 30rpx;
+}
+
+.padding-tb-lg {
+	padding-top: 40rpx;
+	padding-bottom: 40rpx;
+}
+
+.padding-tb-xl {
+	padding-top: 50rpx;
+	padding-bottom: 50rpx;
+}
+
+/* -- 浮动 --  */
+
+.cf::after,
+.cf::before {
+	content: " ";
+	display: table;
+}
+
+.cf::after {
+	clear: both;
+}
+
+.fl {
+	float: left;
+}
+
+.fr {
+	float: right;
+}
+
+/* ==================
+          背景
+ ==================== */
+
+.line-red::after,
+.lines-red::after {
+	border-color: #e54d42;
+}
+
+.line-orange::after,
+.lines-orange::after {
+	border-color: #f37b1d;
+}
+
+.line-yellow::after,
+.lines-yellow::after {
+	border-color: #fbbd08;
+}
+
+.line-olive::after,
+.lines-olive::after {
+	border-color: #8dc63f;
+}
+
+.line-green::after,
+.lines-green::after {
+	border-color: #39b54a;
+}
+
+.line-cyan::after,
+.lines-cyan::after {
+	border-color: #1cbbb4;
+}
+
+.line-blue::after,
+.lines-blue::after {
+	border-color: #0081ff;
+}
+
+.line-purple::after,
+.lines-purple::after {
+	border-color: #6739b6;
+}
+
+.line-mauve::after,
+.lines-mauve::after {
+	border-color: #9c26b0;
+}
+
+.line-pink::after,
+.lines-pink::after {
+	border-color: #e03997;
+}
+
+.line-brown::after,
+.lines-brown::after {
+	border-color: #a5673f;
+}
+
+.line-grey::after,
+.lines-grey::after {
+	border-color: #8799a3;
+}
+
+.line-gray::after,
+.lines-gray::after {
+	border-color: #aaaaaa;
+}
+
+.line-black::after,
+.lines-black::after {
+	border-color: #333333;
+}
+
+.line-white::after,
+.lines-white::after {
+	border-color: #ffffff;
+}
+
+.bg-red {
+	background-color: #e54d42;
+	color: #ffffff;
+}
+
+.bg-orange {
+	background-color: #f37b1d;
+	color: #ffffff;
+}
+
+.bg-yellow {
+	background-color: #fbbd08;
+	color: #333333;
+}
+
+.bg-olive {
+	background-color: #8dc63f;
+	color: #ffffff;
+}
+
+.bg-green {
+	background-color: #39b54a;
+	color: #ffffff;
+}
+
+.bg-cyan {
+	background-color: #1cbbb4;
+	color: #ffffff;
+}
+
+.bg-blue {
+	background-color: #0081ff;
+	color: #ffffff;
+}
+
+.bg-purple {
+	background-color: #6739b6;
+	color: #ffffff;
+}
+
+.bg-mauve {
+	background-color: #9c26b0;
+	color: #ffffff;
+}
+
+.bg-pink {
+	background-color: #e03997;
+	color: #ffffff;
+}
+
+.bg-brown {
+	background-color: #a5673f;
+	color: #ffffff;
+}
+
+.bg-grey {
+	background-color: #8799a3;
+	color: #ffffff;
+}
+
+.bg-gray {
+	background-color: #f0f0f0;
+	color: #333333;
+}
+
+.bg-black {
+	background-color: #333333;
+	color: #ffffff;
+}
+
+.bg-white {
+	background-color: #ffffff;
+	color: #666666;
+}
+
+.bg-shadeTop {
+	background-image: linear-gradient(rgba(0, 0, 0, 1), rgba(0, 0, 0, 0.01));
+	color: #ffffff;
+}
+
+.bg-shadeBottom {
+	background-image: linear-gradient(rgba(0, 0, 0, 0.01), rgba(0, 0, 0, 1));
+	color: #ffffff;
+}
+
+.bg-red.light {
+	color: #e54d42;
+	background-color: #fadbd9;
+}
+
+.bg-orange.light {
+	color: #f37b1d;
+	background-color: #fde6d2;
+}
+
+.bg-yellow.light {
+	color: #fbbd08;
+	background-color: #fef2ced2;
+}
+
+.bg-olive.light {
+	color: #8dc63f;
+	background-color: #e8f4d9;
+}
+
+.bg-green.light {
+	color: #39b54a;
+	background-color: #d7f0dbff;
+}
+
+.bg-cyan.light {
+	color: #1cbbb4;
+	background-color: #d2f1f0;
+}
+
+.bg-blue.light {
+	color: #0081ff;
+	background-color: #cce6ff;
+}
+
+.bg-purple.light {
+	color: #6739b6;
+	background-color: #e1d7f0;
+}
+
+.bg-mauve.light {
+	color: #9c26b0;
+	background-color: #ebd4ef;
+}
+
+.bg-pink.light {
+	color: #e03997;
+	background-color: #f9d7ea;
+}
+
+.bg-brown.light {
+	color: #a5673f;
+	background-color: #ede1d9;
+}
+
+.bg-grey.light {
+	color: #8799a3;
+	background-color: #e7ebed;
+}
+
+.bg-gradual-red {
+	background-image: linear-gradient(45deg, #f43f3b, #ec008c);
+	color: #ffffff;
+}
+
+.bg-gradual-orange {
+	background-image: linear-gradient(45deg, #ff9700, #ed1c24);
+	color: #ffffff;
+}
+
+.bg-gradual-green {
+	background-image: linear-gradient(45deg, #39b54a, #8dc63f);
+	color: #ffffff;
+}
+
+.bg-gradual-purple {
+	background-image: linear-gradient(45deg, #9000ff, #5e00ff);
+	color: #ffffff;
+}
+
+.bg-gradual-pink {
+	background-image: linear-gradient(45deg, #ec008c, #6739b6);
+	color: #ffffff;
+}
+
+.bg-gradual-blue {
+	background-image: linear-gradient(45deg, #0081ff, #1cbbb4);
+	color: #ffffff;
+}
+
+.shadow[class*="-red"] {
+	box-shadow: 6rpx 6rpx 8rpx rgba(204, 69, 59, 0.2);
+}
+
+.shadow[class*="-orange"] {
+	box-shadow: 6rpx 6rpx 8rpx rgba(217, 109, 26, 0.2);
+}
+
+.shadow[class*="-yellow"] {
+	box-shadow: 6rpx 6rpx 8rpx rgba(224, 170, 7, 0.2);
+}
+
+.shadow[class*="-olive"] {
+	box-shadow: 6rpx 6rpx 8rpx rgba(124, 173, 55, 0.2);
+}
+
+.shadow[class*="-green"] {
+	box-shadow: 6rpx 6rpx 8rpx rgba(48, 156, 63, 0.2);
+}
+
+.shadow[class*="-cyan"] {
+	box-shadow: 6rpx 6rpx 8rpx rgba(28, 187, 180, 0.2);
+}
+
+.shadow[class*="-blue"] {
+	box-shadow: 6rpx 6rpx 8rpx rgba(0, 102, 204, 0.2);
+}
+
+.shadow[class*="-purple"] {
+	box-shadow: 6rpx 6rpx 8rpx rgba(88, 48, 156, 0.2);
+}
+
+.shadow[class*="-mauve"] {
+	box-shadow: 6rpx 6rpx 8rpx rgba(133, 33, 150, 0.2);
+}
+
+.shadow[class*="-pink"] {
+	box-shadow: 6rpx 6rpx 8rpx rgba(199, 50, 134, 0.2);
+}
+
+.shadow[class*="-brown"] {
+	box-shadow: 6rpx 6rpx 8rpx rgba(140, 88, 53, 0.2);
+}
+
+.shadow[class*="-grey"] {
+	box-shadow: 6rpx 6rpx 8rpx rgba(114, 130, 138, 0.2);
+}
+
+.shadow[class*="-gray"] {
+	box-shadow: 6rpx 6rpx 8rpx rgba(114, 130, 138, 0.2);
+}
+
+.shadow[class*="-black"] {
+	box-shadow: 6rpx 6rpx 8rpx rgba(26, 26, 26, 0.2);
+}
+
+.shadow[class*="-white"] {
+	box-shadow: 6rpx 6rpx 8rpx rgba(26, 26, 26, 0.2);
+}
+
+.text-shadow[class*="-red"] {
+	text-shadow: 6rpx 6rpx 8rpx rgba(204, 69, 59, 0.2);
+}
+
+.text-shadow[class*="-orange"] {
+	text-shadow: 6rpx 6rpx 8rpx rgba(217, 109, 26, 0.2);
+}
+
+.text-shadow[class*="-yellow"] {
+	text-shadow: 6rpx 6rpx 8rpx rgba(224, 170, 7, 0.2);
+}
+
+.text-shadow[class*="-olive"] {
+	text-shadow: 6rpx 6rpx 8rpx rgba(124, 173, 55, 0.2);
+}
+
+.text-shadow[class*="-green"] {
+	text-shadow: 6rpx 6rpx 8rpx rgba(48, 156, 63, 0.2);
+}
+
+.text-shadow[class*="-cyan"] {
+	text-shadow: 6rpx 6rpx 8rpx rgba(28, 187, 180, 0.2);
+}
+
+.text-shadow[class*="-blue"] {
+	text-shadow: 6rpx 6rpx 8rpx rgba(0, 102, 204, 0.2);
+}
+
+.text-shadow[class*="-purple"] {
+	text-shadow: 6rpx 6rpx 8rpx rgba(88, 48, 156, 0.2);
+}
+
+.text-shadow[class*="-mauve"] {
+	text-shadow: 6rpx 6rpx 8rpx rgba(133, 33, 150, 0.2);
+}
+
+.text-shadow[class*="-pink"] {
+	text-shadow: 6rpx 6rpx 8rpx rgba(199, 50, 134, 0.2);
+}
+
+.text-shadow[class*="-brown"] {
+	text-shadow: 6rpx 6rpx 8rpx rgba(140, 88, 53, 0.2);
+}
+
+.text-shadow[class*="-grey"] {
+	text-shadow: 6rpx 6rpx 8rpx rgba(114, 130, 138, 0.2);
+}
+
+.text-shadow[class*="-gray"] {
+	text-shadow: 6rpx 6rpx 8rpx rgba(114, 130, 138, 0.2);
+}
+
+.text-shadow[class*="-black"] {
+	text-shadow: 6rpx 6rpx 8rpx rgba(26, 26, 26, 0.2);
+}
+
+.bg-img {
+	background-size: cover;
+	background-position: center;
+	background-repeat: no-repeat;
+}
+
+.bg-mask {
+	background-color: #333333;
+	position: relative;
+}
+
+.bg-mask::after {
+	content: "";
+	border-radius: inherit;
+	width: 100%;
+	height: 100%;
+	display: block;
+	background-color: rgba(0, 0, 0, 0.4);
+	position: absolute;
+	left: 0;
+	right: 0;
+	bottom: 0;
+	top: 0;
+}
+
+.bg-mask view,
+.bg-mask cover-view {
+	z-index: 5;
+	position: relative;
+}
+
+.bg-video {
+	position: relative;
+}
+
+.bg-video video {
+	display: block;
+	height: 100%;
+	width: 100%;
+	-o-object-fit: cover;
+	object-fit: cover;
+	position: absolute;
+	top: 0;
+	z-index: 0;
+	pointer-events: none;
+}
+
+/* ==================
+          文本
+ ==================== */
+
+.text-xs {
+	font-size: 20rpx;
+}
+
+.text-sm {
+	font-size: 24rpx;
+}
+
+.text-dm {
+	font-size: 26rpx;
+}
+
+.text-df {
+	font-size: 28rpx;
+}
+
+.text-lg {
+	font-size: 32rpx;
+}
+
+.text-xl {
+	font-size: 36rpx;
+}
+
+.text-xxl {
+	font-size: 44rpx;
+}
+
+.text-sl {
+	font-size: 80rpx;
+}
+
+.text-xsl {
+	font-size: 120rpx;
+}
+
+.text-Abc {
+	text-transform: Capitalize;
+}
+
+.text-ABC {
+	text-transform: Uppercase;
+}
+
+.text-abc {
+	text-transform: Lowercase;
+}
+
+.text-price::before {
+	content: "¥";
+	font-size: 80%;
+	margin-right: 4rpx;
+}
+
+.text-cut {
+	text-overflow: ellipsis;
+	white-space: nowrap;
+	overflow: hidden;
+}
+
+.text-bold {
+	font-weight: bold;
+}
+
+.text-center {
+	text-align: center;
+}
+
+.text-content {
+	line-height: 1.6;
+}
+
+.text-left {
+	text-align: left;
+}
+
+.text-right {
+	text-align: right;
+}
+
+.text-red,
+.line-red,
+.lines-red {
+	color: #e54d42;
+}
+
+.text-orange,
+.line-orange,
+.lines-orange {
+	color: #f37b1d;
+}
+
+.text-yellow,
+.line-yellow,
+.lines-yellow {
+	color: #fbbd08;
+}
+
+.text-olive,
+.line-olive,
+.lines-olive {
+	color: #8dc63f;
+}
+
+.text-green,
+.line-green,
+.lines-green {
+	color: #39b54a;
+}
+
+.text-cyan,
+.line-cyan,
+.lines-cyan {
+	color: #1cbbb4;
+}
+
+.text-blue,
+.line-blue,
+.lines-blue {
+	color: #0081ff;
+}
+
+.text-purple,
+.line-purple,
+.lines-purple {
+	color: #6739b6;
+}
+
+.text-mauve,
+.line-mauve,
+.lines-mauve {
+	color: #9c26b0;
+}
+
+.text-pink,
+.line-pink,
+.lines-pink {
+	color: #e03997;
+}
+
+.text-brown,
+.line-brown,
+.lines-brown {
+	color: #a5673f;
+}
+
+.text-grey,
+.line-grey,
+.lines-grey {
+	color: #8799a3;
+}
+
+.text-gray,
+.line-gray,
+.lines-gray {
+	color: #aaaaaa;
+}
+
+.text-black,
+.line-black,
+.lines-black {
+	color: #333333;
+}
+
+.text-white,
+.line-white,
+.lines-white {
+	color: #ffffff;
+}

components/modalDialog.vue

@@ -1,69 +1,69 @@
-<template>
-	<view>
-		<view class="global-mask" v-show="isShowDialog"></view>
-		<view class="global-dialog" v-show="isShowDialog">
-			<view class="title">{{showTitle}}</view>
-			<view class="content">
-				<view class="text">{{showText}}</view>
-			</view>
-			<view class="btn">
-				<view class="left" @tap="cancel" v-if="isShowCancel">{{cancelText}}</view>
-				<view class="right" @tap="confirm" v-if="isShowConfirm">{{confirmText}}</view>
-			</view>
-		</view>
-	</view>
-</template>
-
-<script>
-	export default {
-		name: 'modalDialog',
-		props: {
-			showTitle: {
-				type: String,
-				default: '温馨提示'
-			},
-			showText: {
-				type: String,
-				default: '提示内容'
-			},
-			isShowDialog: {
-				type: Boolean,
-				default: false
-			},
-			isShowCancel: {
-				type: Boolean,
-				default: true
-			},
-			cancelText: {
-				type: String,
-				default: '取消'
-			},
-			isShowConfirm: {
-				type: Boolean,
-				default: true
-			},
-			confirmText: {
-				type: String,
-				default: '确定'
-			}
-		},
-		data() {
-			return {
-				
-			};
-		},
-		methods: {
-			cancel() {
-				this.$emit('cancel');
-			},
-			
-			confirm() {
-				this.$emit('confirm');
-			}
-		}
-	}
-</script>
-
-<style lang="scss">
-
-</style>
+<template>
+	<view>
+		<view class="global-mask" v-show="isShowDialog"></view>
+		<view class="global-dialog" v-show="isShowDialog">
+			<view class="title">{{showTitle}}</view>
+			<view class="content">
+				<view class="text">{{showText}}</view>
+			</view>
+			<view class="btn">
+				<view class="left" @tap="cancel" v-if="isShowCancel">{{cancelText}}</view>
+				<view class="right" @tap="confirm" v-if="isShowConfirm">{{confirmText}}</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'modalDialog',
+		props: {
+			showTitle: {
+				type: String,
+				default: '温馨提示'
+			},
+			showText: {
+				type: String,
+				default: '提示内容'
+			},
+			isShowDialog: {
+				type: Boolean,
+				default: false
+			},
+			isShowCancel: {
+				type: Boolean,
+				default: true
+			},
+			cancelText: {
+				type: String,
+				default: '取消'
+			},
+			isShowConfirm: {
+				type: Boolean,
+				default: true
+			},
+			confirmText: {
+				type: String,
+				default: '确定'
+			}
+		},
+		data() {
+			return {
+				
+			};
+		},
+		methods: {
+			cancel() {
+				this.$emit('cancel');
+			},
+			
+			confirm() {
+				this.$emit('confirm');
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+
+</style>

components/neil-modal/neil-modal.vue

@@ -1,260 +1,260 @@
-<template>
-    <view class="neil-modal" @touchmove.stop.prevent="bindTouchmove" :class="{'neil-modal--show':isOpen}">
-        <view class="neil-modal__mask" @click="clickMask"></view>
-        <view class="neil-modal__container">
-            <view class="neil-modal__header" v-if="title.length > 0">{{title}}</view>
-            <view class="neil-modal__content" :class="content ? 'neil-modal--padding' : ''" :style="{textAlign:align}">
-                <template v-if="content">
-                    <text class="modal-content">{{content}}</text>
-                </template>
-                <template v-else>
-                    <slot />
-                </template>
-            </view>
-            <view class="neil-modal__footer">
-                <view v-if="showCancel" class="neil-modal__footer-left" @click="clickLeft" :style="{color:cancelColor}"
-                    hover-class="neil-modal__footer-hover" :hover-start-time="20" :hover-stay-time="70">
-                    {{cancelText}}
-                </view>
-                <view class="neil-modal__footer-right" @click="clickRight" :style="{color:confirmColor}" hover-class="neil-modal__footer-hover"
-                    :hover-start-time="20" :hover-stay-time="70">
-                    {{confirmText}}
-                </view>
-            </view>
-        </view>
-    </view>
-</template>
-
-<script>
-    export default {
-        name: 'neil-modal',
-        props: {
-            title: { //标题
-                type: String,
-                default: ''
-            },
-            content: String, //提示的内容
-            align: { //content 的对齐方式left/center/right
-                type: String,
-                default: 'left'
-            },
-            cancelText: { //取消按钮的文字，默认为"取消"
-                type: String,
-                default: '取消'
-            },
-            cancelColor: { //取消按钮颜色
-                type: String,
-                default: '#333333'
-            },
-            confirmText: { //确定按钮的文字，默认为"确定"
-                type: String,
-                default: '确定'
-            },
-            confirmColor: { //确认按钮颜色
-                type: String,
-                default: '#007aff'
-            },
-            showCancel: { //是否显示取消按钮，默认为 true
-                type: [Boolean, String],
-                default: true
-            },
-            show: { //是否显示模态框
-                type: [Boolean, String],
-                default: false
-            },
-            autoClose: { //点击遮罩是否自动关闭弹窗
-                type: [Boolean, String],
-                default: true
-            }
-        },
-        data() {
-            return {
-                isOpen: false
-            }
-        },
-        watch: {
-            show(val) {
-				this.isOpen = val
-            }
-        },
-        created() {
-        	this.isOpen = this.show
-        },
-        methods: {
-            bindTouchmove() {},
-            clickLeft() {
-                setTimeout(() => {
-                	this.$emit('cancel')
-                }, 200)
-                this.closeModal()
-            },
-            clickRight() {
-                setTimeout(() => {
-                	this.$emit('confirm')
-                }, 200)
-                this.closeModal()
-            },
-			clickMask(){
-				if(this.autoClose){
-					this.closeModal()
-				}
-			},
-            closeModal() {
-                this.showAnimation = false
-				this.isOpen = false
-				this.$emit('close')
-            }
-        }
-    }
-</script>
-
-<style lang="scss">
-    $bg-color-mask:rgba(0, 0, 0, 0.5); //遮罩颜色
-    $bg-color-hover:#f1f1f1; //点击状态颜色
-
-    .neil-modal {
-        position: fixed;
-		visibility: hidden;
-        width: 100%;
-        height: 100%;
-        top: 0;
-        left: 0;
-        z-index: 1000;
-		transition:visibility 200ms ease-in;
-		
-		&.neil-modal--show{
-			visibility: visible;
-		}
-
-        &__header {
-            position: relative;
-            overflow: hidden;
-            text-overflow: ellipsis;
-            white-space: nowrap;
-            padding: 18upx 24upx;
-            line-height: 1.5;
-            color: #333;
-            font-size: 32upx;
-            text-align: center;
-
-            &::after {
-                content: " ";
-                position: absolute;
-                left: 0;
-                bottom: 0;
-                right: 0;
-                height: 1px;
-                border-top: 1px solid #e5e5e5;
-                transform-origin: 0 0;
-                transform: scaleY(.5);
-            }
-        }
-
-        &__container {
-            position: absolute;
-			z-index: 999;
-            top: 50%;
-            left: 50%;
-            transform: translate(-50%, -50%) ;
-            transition: transform 0.3s;
-            width: 540upx;
-            border-radius: 20upx;
-            background-color: #fff;
-            overflow: hidden;
-            opacity: 0;
-            transition: opacity 200ms ease-in;
-        }
-
-        &__content {
-            position: relative;
-            color: #333;
-            font-size: 28upx;
-            box-sizing: border-box;
-            line-height: 1.5;
-
-            &::after {
-                content: " ";
-                position: absolute;
-                left: 0;
-                bottom: -1px;
-                right: 0;
-                height: 1px;
-                border-bottom: 1px solid #e5e5e5;
-                transform-origin: 0 0;
-                transform: scaleY(.5);
-            }
-        }
-
-        &__footer {
-            position: relative;
-            overflow: hidden;
-            text-overflow: ellipsis;
-            white-space: nowrap;
-            color: #333;
-            font-size: 32upx;
-            display: flex;
-            flex-direction: row;
-
-            &-left,
-            &-right {
-                position: relative;
-                flex: 1;
-                overflow: hidden;
-                text-overflow: ellipsis;
-                white-space: nowrap;
-                height: 88upx;
-                font-size: 28upx;
-                line-height: 88upx;
-                text-align: center;
-                background-color: #fff;
-                color: #333;
-            }
-
-            &-right {
-                color: #007aff;
-            }
-
-            &-left::after {
-                content: " ";
-                position: absolute;
-                right: -1px;
-                top: 0;
-                width: 1px;
-                bottom: 0;
-                border-right: 1px solid #e5e5e5;
-                transform-origin: 0 0;
-                transform: scaleX(.5);
-            }
-
-            &-hover {
-                background-color: $bg-color-hover;
-            }
-        }
-
-        &__mask {
-            display: block;
-            position: absolute;
-			z-index: 998;
-            top: 0;
-            left: 0;
-            width: 100%;
-            height: 100%;
-            background: $bg-color-mask;
-            opacity: 0;
-            transition: opacity 200ms ease-in;
-			&.neil-modal--show{
-				opacity: 1;
-			}
-        }
-
-        &--padding {
-            padding: 32upx 24upx;
-            min-height: 90upx;
-        }
-		&--show {
-		    .neil-modal__container,.neil-modal__mask{
-				opacity: 1;
-			}
-		}
-    }
+<template>
+    <view class="neil-modal" @touchmove.stop.prevent="bindTouchmove" :class="{'neil-modal--show':isOpen}">
+        <view class="neil-modal__mask" @click="clickMask"></view>
+        <view class="neil-modal__container">
+            <view class="neil-modal__header" v-if="title.length > 0">{{title}}</view>
+            <view class="neil-modal__content" :class="content ? 'neil-modal--padding' : ''" :style="{textAlign:align}">
+                <template v-if="content">
+                    <text class="modal-content">{{content}}</text>
+                </template>
+                <template v-else>
+                    <slot />
+                </template>
+            </view>
+            <view class="neil-modal__footer">
+                <view v-if="showCancel" class="neil-modal__footer-left" @click="clickLeft" :style="{color:cancelColor}"
+                    hover-class="neil-modal__footer-hover" :hover-start-time="20" :hover-stay-time="70">
+                    {{cancelText}}
+                </view>
+                <view class="neil-modal__footer-right" @click="clickRight" :style="{color:confirmColor}" hover-class="neil-modal__footer-hover"
+                    :hover-start-time="20" :hover-stay-time="70">
+                    {{confirmText}}
+                </view>
+            </view>
+        </view>
+    </view>
+</template>
+
+<script>
+    export default {
+        name: 'neil-modal',
+        props: {
+            title: { //标题
+                type: String,
+                default: ''
+            },
+            content: String, //提示的内容
+            align: { //content 的对齐方式left/center/right
+                type: String,
+                default: 'left'
+            },
+            cancelText: { //取消按钮的文字，默认为"取消"
+                type: String,
+                default: '取消'
+            },
+            cancelColor: { //取消按钮颜色
+                type: String,
+                default: '#333333'
+            },
+            confirmText: { //确定按钮的文字，默认为"确定"
+                type: String,
+                default: '确定'
+            },
+            confirmColor: { //确认按钮颜色
+                type: String,
+                default: '#007aff'
+            },
+            showCancel: { //是否显示取消按钮，默认为 true
+                type: [Boolean, String],
+                default: true
+            },
+            show: { //是否显示模态框
+                type: [Boolean, String],
+                default: false
+            },
+            autoClose: { //点击遮罩是否自动关闭弹窗
+                type: [Boolean, String],
+                default: true
+            }
+        },
+        data() {
+            return {
+                isOpen: false
+            }
+        },
+        watch: {
+            show(val) {
+				this.isOpen = val
+            }
+        },
+        created() {
+        	this.isOpen = this.show
+        },
+        methods: {
+            bindTouchmove() {},
+            clickLeft() {
+                setTimeout(() => {
+                	this.$emit('cancel')
+                }, 200)
+                this.closeModal()
+            },
+            clickRight() {
+                setTimeout(() => {
+                	this.$emit('confirm')
+                }, 200)
+                this.closeModal()
+            },
+			clickMask(){
+				if(this.autoClose){
+					this.closeModal()
+				}
+			},
+            closeModal() {
+                this.showAnimation = false
+				this.isOpen = false
+				this.$emit('close')
+            }
+        }
+    }
+</script>
+
+<style lang="scss">
+    $bg-color-mask:rgba(0, 0, 0, 0.5); //遮罩颜色
+    $bg-color-hover:#f1f1f1; //点击状态颜色
+
+    .neil-modal {
+        position: fixed;
+		visibility: hidden;
+        width: 100%;
+        height: 100%;
+        top: 0;
+        left: 0;
+        z-index: 1000;
+		transition:visibility 200ms ease-in;
+		
+		&.neil-modal--show{
+			visibility: visible;
+		}
+
+        &__header {
+            position: relative;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+            padding: 18upx 24upx;
+            line-height: 1.5;
+            color: #333;
+            font-size: 32upx;
+            text-align: center;
+
+            &::after {
+                content: " ";
+                position: absolute;
+                left: 0;
+                bottom: 0;
+                right: 0;
+                height: 1px;
+                border-top: 1px solid #e5e5e5;
+                transform-origin: 0 0;
+                transform: scaleY(.5);
+            }
+        }
+
+        &__container {
+            position: absolute;
+			z-index: 999;
+            top: 50%;
+            left: 50%;
+            transform: translate(-50%, -50%) ;
+            transition: transform 0.3s;
+            width: 540upx;
+            border-radius: 20upx;
+            background-color: #fff;
+            overflow: hidden;
+            opacity: 0;
+            transition: opacity 200ms ease-in;
+        }
+
+        &__content {
+            position: relative;
+            color: #333;
+            font-size: 28upx;
+            box-sizing: border-box;
+            line-height: 1.5;
+
+            &::after {
+                content: " ";
+                position: absolute;
+                left: 0;
+                bottom: -1px;
+                right: 0;
+                height: 1px;
+                border-bottom: 1px solid #e5e5e5;
+                transform-origin: 0 0;
+                transform: scaleY(.5);
+            }
+        }
+
+        &__footer {
+            position: relative;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+            color: #333;
+            font-size: 32upx;
+            display: flex;
+            flex-direction: row;
+
+            &-left,
+            &-right {
+                position: relative;
+                flex: 1;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                white-space: nowrap;
+                height: 88upx;
+                font-size: 28upx;
+                line-height: 88upx;
+                text-align: center;
+                background-color: #fff;
+                color: #333;
+            }
+
+            &-right {
+                color: #007aff;
+            }
+
+            &-left::after {
+                content: " ";
+                position: absolute;
+                right: -1px;
+                top: 0;
+                width: 1px;
+                bottom: 0;
+                border-right: 1px solid #e5e5e5;
+                transform-origin: 0 0;
+                transform: scaleX(.5);
+            }
+
+            &-hover {
+                background-color: $bg-color-hover;
+            }
+        }
+
+        &__mask {
+            display: block;
+            position: absolute;
+			z-index: 998;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            background: $bg-color-mask;
+            opacity: 0;
+            transition: opacity 200ms ease-in;
+			&.neil-modal--show{
+				opacity: 1;
+			}
+        }
+
+        &--padding {
+            padding: 32upx 24upx;
+            min-height: 90upx;
+        }
+		&--show {
+		    .neil-modal__container,.neil-modal__mask{
+				opacity: 1;
+			}
+		}
+    }
 </style>

components/neil-modal/readme.md

@@ -1,84 +1,84 @@
-### Modal 模态框
-
-自定义 Modal 模态框组件
-
-**使用方式：**
-
-在 script 中引用组件
-
-```javascript
-import neilModal from '@/components/neil-modal/neil-modal.vue';
-export default {
-    components: {neilModal}
-}
-```
-
-基础使用方式
-
-```html
-<neil-modal 
-    :show="show" 
-    @close="closeModal" 
-    title="标题" 
-    content="这里是正文内容，这里是正文内容，这里是正文内容，这里是正文内容，这里是正文内容，这里是正文内容"
-    @cancel="bindBtn('cancel')" 
-    @confirm="bindBtn('confirm')">
-</neil-modal>
-```
-
-单个确认按钮
-
-```html
-<neil-modal 
-    :show="show" 
-    title="标题" 
-    content="这里是正文内容，这里是正文内容，这里是正文内容，这里是正文内容，这里是正文内容，这里是正文内容"
-    :show-cancel="false">
-</neil-modal>
-```
-
-**属性说明：**
-
-|属性名	|类型		|默认值	|说明	|
-|---	|----		|---	|---	|
-|title|String||标题	|
-|content|String||内容|
-|align|String|left|内容对齐方式，值为：left（左对齐）、center（居中对齐）、right（右对齐）|
-|show   |Boolean	|false	|Modal的显示状态	|
-|show-cancel|Boolean|true	|是否显示取消按钮|
-|auto-close|Boolean|true	|点击遮罩是否自动关闭模态框|
-|confirm-color|String|#007aff|确认按钮的颜色	|
-|confirm-text|String|确定|确定按钮的文字	|
-|cancel-color|String|#333333|取消按钮的颜色	|
-|cancel-text|String|取消|取消按钮的文字	|
-
-**事件说明：**
-
-|事件名|说明		|
-|close|组件关闭时触发事件|
-|confirm|点击确认按钮时触发事件|
-|cancel|点击取消按钮时触发事件|
-
-**slot**
-
-在 ``neil-modal`` 节点下，可以通过插入节点实现自定义 content 的需求（只有 content 属性为空的时候才会加载 slot）
-
-使用示例：
-
-```html
-<neil-modal :show="show" @close="closeModal" title="更新提示" confirm-text="立即更新" cancel-text="暂不更新">
-    <view style="min-height: 90upx;padding: 32upx 24upx;">
-        <view>1. 修复标题颜色不对的问题</view>
-        <view>2. 增加支付宝支付功能</view>
-        <view>3. 增加更多示例</view>
-    </view>
-</neil-modal>
-```
-
-**其他**
-
-* Modal 组件 z-index 为 1000；
-* Modal 组件非原生组件，使用时会被原生组件所覆盖；
-* 通过本页面下载按钮下载的zip为一个完整 ``uni-app`` 工程，拖入 HBuilderX即可运行体验效果；
-* 若想集成本组件到现有工程，可以将 components 目录下的 neil-modal 目录拷贝到自己工程的 components 目录；
-* 使用过程出现问题或有新的需求可在评论区留言。
+### Modal 模态框
+
+自定义 Modal 模态框组件
+
+**使用方式：**
+
+在 script 中引用组件
+
+```javascript
+import neilModal from '@/components/neil-modal/neil-modal.vue';
+export default {
+    components: {neilModal}
+}
+```
+
+基础使用方式
+
+```html
+<neil-modal 
+    :show="show" 
+    @close="closeModal" 
+    title="标题" 
+    content="这里是正文内容，这里是正文内容，这里是正文内容，这里是正文内容，这里是正文内容，这里是正文内容"
+    @cancel="bindBtn('cancel')" 
+    @confirm="bindBtn('confirm')">
+</neil-modal>
+```
+
+单个确认按钮
+
+```html
+<neil-modal 
+    :show="show" 
+    title="标题" 
+    content="这里是正文内容，这里是正文内容，这里是正文内容，这里是正文内容，这里是正文内容，这里是正文内容"
+    :show-cancel="false">
+</neil-modal>
+```
+
+**属性说明：**
+
+|属性名	|类型		|默认值	|说明	|
+|---	|----		|---	|---	|
+|title|String||标题	|
+|content|String||内容|
+|align|String|left|内容对齐方式，值为：left（左对齐）、center（居中对齐）、right（右对齐）|
+|show   |Boolean	|false	|Modal的显示状态	|
+|show-cancel|Boolean|true	|是否显示取消按钮|
+|auto-close|Boolean|true	|点击遮罩是否自动关闭模态框|
+|confirm-color|String|#007aff|确认按钮的颜色	|
+|confirm-text|String|确定|确定按钮的文字	|
+|cancel-color|String|#333333|取消按钮的颜色	|
+|cancel-text|String|取消|取消按钮的文字	|
+
+**事件说明：**
+
+|事件名|说明		|
+|close|组件关闭时触发事件|
+|confirm|点击确认按钮时触发事件|
+|cancel|点击取消按钮时触发事件|
+
+**slot**
+
+在 ``neil-modal`` 节点下，可以通过插入节点实现自定义 content 的需求（只有 content 属性为空的时候才会加载 slot）
+
+使用示例：
+
+```html
+<neil-modal :show="show" @close="closeModal" title="更新提示" confirm-text="立即更新" cancel-text="暂不更新">
+    <view style="min-height: 90upx;padding: 32upx 24upx;">
+        <view>1. 修复标题颜色不对的问题</view>
+        <view>2. 增加支付宝支付功能</view>
+        <view>3. 增加更多示例</view>
+    </view>
+</neil-modal>
+```
+
+**其他**
+
+* Modal 组件 z-index 为 1000；
+* Modal 组件非原生组件，使用时会被原生组件所覆盖；
+* 通过本页面下载按钮下载的zip为一个完整 ``uni-app`` 工程，拖入 HBuilderX即可运行体验效果；
+* 若想集成本组件到现有工程，可以将 components 目录下的 neil-modal 目录拷贝到自己工程的 components 目录；
+* 使用过程出现问题或有新的需求可在评论区留言。

components/noData.vue

@@ -1,44 +1,44 @@
-<template>
-	<view class="container">
-		<view class="content">
-			<image src="/static/common/noData.png" mode="widthFix"></image>
-			<view>{{showText}}</view>
-		</view>
-	</view>
-</template>
-
-<script>
-	export default {
-		name: "noData",
-		props: {
-			showText: {
-				type: String,
-				default: '暂无数据'
-			},
-		},
-		data() {
-			return {}
-		}
-	}
-</script>
-
-<style lang="scss">
-	.content {
-		padding: 100rpx 0 120rpx;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		flex-direction: column;
-
-		image {
-			width: 300rpx;
-			display: block;
-		}
-
-		view {
-			font-size: 28rpx;
-			color: #999999;
-			margin-top: 20rpx;
-		}
-	}
+<template>
+	<view class="container">
+		<view class="content">
+			<image src="/static/common/noData.png" mode="widthFix"></image>
+			<view>{{showText}}</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: "noData",
+		props: {
+			showText: {
+				type: String,
+				default: '暂无数据'
+			},
+		},
+		data() {
+			return {}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.content {
+		padding: 100rpx 0 120rpx;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		flex-direction: column;
+
+		image {
+			width: 300rpx;
+			display: block;
+		}
+
+		view {
+			font-size: 28rpx;
+			color: #999999;
+			margin-top: 20rpx;
+		}
+	}
 </style>

components/pt-images-verification/pt-images-verification.vue

@@ -1,60 +1,60 @@
 <template>
-	<view class="pt">
-		<view class="pt-verification-box">
-			<view class="pt-verification-images">
-				<view class="iconfont refresh" @click="refresh">&#xe64c;</view>
-				<image mode="widthFix" :src="'data:image/jpeg;base64,'+bgImg" class="bg-img"></image>
+	<view class="pt">
+		<view class="pt-verification-box">
+			<view class="pt-verification-images">
+				<view class="iconfont refresh" @click="refresh">&#xe64c;</view>
+				<image mode="widthFix" :src="'data:image/jpeg;base64,'+bgImg" class="bg-img"></image>
 				<image :src="'data:image/jpeg;base64,'+maskImg" class="drag-img" mode="widthFix" :style="{ left: dragWidth + 'px', top: top + 'px'}"></image>
-				<view class="mask"></view>
-			</view>
-			<view class="pt-dragbar">
-				<view :class="['pt-drag-area',{fail: isFail,success: isSuccess}]" :style="{ width: dragWidth + 'px'}" v-if="dragWidth"></view>
-				<movable-area class="pt-dragbar-area">
-					<movable-view
-						:class="['pt-dragbar-view',{active: dragWidth > 2,fail: isFail,success: isSuccess}]"
-						:direction="direction"
-						@change="dragStart"
-						@touchend="dragEnd"
-						:damping="200"
-						:x="x"
-						:animation="false"
-						:disabled="disabled"
+				<view class="mask"></view>
+			</view>
+			<view class="pt-dragbar">
+				<view :class="['pt-drag-area',{fail: isFail,success: isSuccess}]" :style="{ width: dragWidth + 'px'}" v-if="dragWidth"></view>
+				<movable-area class="pt-dragbar-area">
+					<movable-view
+						:class="['pt-dragbar-view',{active: dragWidth > 2,fail: isFail,success: isSuccess}]"
+						:direction="direction"
+						@change="dragStart"
+						@touchend="dragEnd"
+						:damping="200"
+						:x="x"
+						:animation="false"
+						:disabled="disabled"
 						:data-dragWidth="dragWidth">
-						<text class="iconfont">
-							<block v-if="isSuccess">&#xe687;</block>
-							<block v-else-if="isFail">&#xe65c;</block>
-							<block v-else>&#xe62a;</block>
-						</text>
-					</movable-view>
-					<text v-if="dragWidth==0" class="tips">{{tips}}</text>
-				</movable-area>
-			</view>
+						<text class="iconfont">
+							<block v-if="isSuccess">&#xe687;</block>
+							<block v-else-if="isFail">&#xe65c;</block>
+							<block v-else>&#xe62a;</block>
+						</text>
+					</movable-view>
+					<text v-if="dragWidth==0" class="tips">{{tips}}</text>
+				</movable-area>
+			</view>
 		</view>
 	</view>
 </template>
 
 <script>
-	export default {
+	export default {
 		props: {
-			// 背景大图
-			bgImg: {
-				type: String,
-				default: ''
+			// 背景大图
+			bgImg: {
+				type: String,
+				default: ''
 			},
-			// 块状小图
-			maskImg: {
-				type: String,
-				default: ''
+			// 块状小图
+			maskImg: {
+				type: String,
+				default: ''
 			},
 			// 坑位的top值
 			top: {
 				type: Number,
 				default: 0
-			},
-			// 滑块滑动的方向
-			direction: {
-				type: String,
-				default: 'horizontal'
+			},
+			// 滑块滑动的方向
+			direction: {
+				type: String,
+				default: 'horizontal'
 			},
 			// 判断是否成功
 			isSuccess: {
@@ -65,76 +65,76 @@
 			isFail: {
 				type: Boolean,
 				default: false,
-			}
+			}
 		},
 		data() {
 			return {
-				tips: '向右拖动滑块填充拼图',
+				tips: '向右拖动滑块填充拼图',
 				disabled: false,
-				dragWidth: 0,
+				dragWidth: 0,
 				x: 0
 			};
-		},
-		methods: {
-			// 开始滑动
-			dragStart(e){
-				this.dragWidth = e.detail.x
+		},
+		methods: {
+			// 开始滑动
+			dragStart(e){
+				this.dragWidth = e.detail.x
 			},
-			
-			// 停止滑动
+			
+			// 停止滑动
 			dragEnd(e){
-				this.x = this.dragWidth;
-				this.$emit('finish', this.dragWidth);
+				this.x = this.dragWidth;
+				this.$emit('finish', this.dragWidth);
 			},
-			
+			
 			refresh(){
-				console.log(1);
-				this.dragWidth = 0;
-				this.isFail = false;
-				this.isSuccess = false;
-				this.x = 0;
-				this.disabled = false;
-				this.$emit('refresh');
-			}
+				console.log(1);
+				this.dragWidth = 0;
+				this.isFail = false;
+				this.isSuccess = false;
+				this.x = 0;
+				this.disabled = false;
+				this.$emit('refresh');
+			}
 		}
 	}
 </script>
 
-<style lang="scss">
-	@font-face {
-	  font-family: 'iconfont';  /* project id 2047533 */
-	  src: url('https://at.alicdn.com/t/font_2047533_o8axbabfs3.ttf') format('truetype')
-	}
-	.iconfont {
-	  font-family: iconfont !important;
-	  font-size: 16px;
-	  font-style: normal;
-	  -webkit-font-smoothing: antialiased;
-	  -moz-osx-font-smoothing: grayscale;
+<style lang="scss">
+	@font-face {
+	  font-family: 'iconfont';  /* project id 2047533 */
+	  src: url('https://at.alicdn.com/t/font_2047533_o8axbabfs3.ttf') format('truetype')
 	}
-	.pt{
-		width: 300px;
-		margin: 0 auto;
-		&-verification-images{
-			position: relative;
-			.refresh{
-				position: absolute;
-				right: 20rpx;
-				top: 20rpx;
-				z-index: 10;
-				color: #FFF;
-				font-weight: bold;
-			}
-			.bg-img{
-				width: 100%;
-				vertical-align: top;
-			}
-			.drag-img{
-				position: absolute;
-				width: 112rpx;
-				top: 0;
-				left: 0;
-				z-index: 1;
+	.iconfont {
+	  font-family: iconfont !important;
+	  font-size: 16px;
+	  font-style: normal;
+	  -webkit-font-smoothing: antialiased;
+	  -moz-osx-font-smoothing: grayscale;
+	}
+	.pt{
+		width: 300px;
+		margin: 0 auto;
+		&-verification-images{
+			position: relative;
+			.refresh{
+				position: absolute;
+				right: 20rpx;
+				top: 20rpx;
+				z-index: 10;
+				color: #FFF;
+				font-weight: bold;
+			}
+			.bg-img{
+				width: 100%;
+				vertical-align: top;
+			}
+			.drag-img{
+				position: absolute;
+				width: 112rpx;
+				top: 0;
+				left: 0;
+				z-index: 1;
 			}
 			.mask {
 				position: absolute;
@@ -143,68 +143,68 @@
 				width: 100%;
 				height: 100%;
 				background: rgba($color: #000000, $alpha: .2);
-			}
-		}
-		&-dragbar{
-			position: relative;
-			height: 80rpx;
-			background-color: #F7F7F7;
-			border: solid 2rpx #EEE;
-			margin-top: 20rpx;
-			.pt-drag-area{
-				position: absolute;
-				height: 80rpx;
-				border: solid 2rpx $uni-color-primary;
-				background-color: #D1E9F1;
-				top: -2rpx;
-				&.fail{
-					border-color: $uni-color-error;
-					background-color: #ffdbdb;
-				}
-				&.success{
-					border-color: $uni-color-success;
-					background-color: #d7ffe1;
-				}
-			}
-			&-area{
-				position: absolute;
-				width: 100%;
-				height: 100%;
-				left: 0;
-				top: 0;
-				.tips{
-					font-size: 24rpx;
-					color: #999;
-					position: absolute;
-					left: 50%;
-					top: 50%;
-					transform: translate(-50%,-50%);
-				}
-			}
-			&-view{
-				width: 80rpx;
-				height: 80rpx;
-				display: flex;
-				align-items: center;
-				justify-content: center;
-				border: solid 2rpx #EEE;
-				background-color: #FFF;
-				top: -2rpx;
-				left: 0;
-				&.active{
-					background-color: $uni-color-primary;
-					border-color: $uni-color-primary;
-					color: #FFF;
-				}
-				&.fail{
-					background-color: $uni-color-error;
-					border-color: $uni-color-error;
-				}
-				&.success{
-					border-color: $uni-color-success;
-					background-color: #00a029;
-				}
-			}
-		}
+			}
+		}
+		&-dragbar{
+			position: relative;
+			height: 80rpx;
+			background-color: #F7F7F7;
+			border: solid 2rpx #EEE;
+			margin-top: 20rpx;
+			.pt-drag-area{
+				position: absolute;
+				height: 80rpx;
+				border: solid 2rpx $uni-color-primary;
+				background-color: #D1E9F1;
+				top: -2rpx;
+				&.fail{
+					border-color: $uni-color-error;
+					background-color: #ffdbdb;
+				}
+				&.success{
+					border-color: $uni-color-success;
+					background-color: #d7ffe1;
+				}
+			}
+			&-area{
+				position: absolute;
+				width: 100%;
+				height: 100%;
+				left: 0;
+				top: 0;
+				.tips{
+					font-size: 24rpx;
+					color: #999;
+					position: absolute;
+					left: 50%;
+					top: 50%;
+					transform: translate(-50%,-50%);
+				}
+			}
+			&-view{
+				width: 80rpx;
+				height: 80rpx;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				border: solid 2rpx #EEE;
+				background-color: #FFF;
+				top: -2rpx;
+				left: 0;
+				&.active{
+					background-color: $uni-color-primary;
+					border-color: $uni-color-primary;
+					color: #FFF;
+				}
+				&.fail{
+					background-color: $uni-color-error;
+					border-color: $uni-color-error;
+				}
+				&.success{
+					border-color: $uni-color-success;
+					background-color: #00a029;
+				}
+			}
+		}
 	}
 </style>

components/zhifutanchuan.vue

@@ -1,251 +1,251 @@
-<template>
-	<view :style="{ top: 0 }" class="z-popup">
-		<view class="anniukuang" v-if="
-        infoSync.miniProgram.appId == 'wxb80d6a6523463b70' ? !showYSF : true
-      ">
-			<button class="btn" @click="WeiXinPay">
-				<uni-icons type="weixin" size="30" style="margin-right: 20rpx"></uni-icons>
-				微信支付
-			</button>
-		</view>
-		<view class="anniukuang" v-if="showYSF">
-			<button class="btn" @click="YunFlashPay">
-				<uni-icons type="cloud-upload" size="30" style="margin-right: 20rpx"></uni-icons>
-				云闪付
-			</button>
-		</view>
-		<neil-modal v-if="isShow" :show="isShow" title="以旧换新参与人信息" @cancel="fail" @confirm="success">
-			<view style="min-height: 90upx; padding: 32upx 24upx">
-				<view>应'政府以旧换新补贴'政策要求发票抬头需与享受以旧换新者(领券人)实名信息完全一致，请务必填写准确!若不一致，后续有补贴失败追回风险。</view>
-				<view style="height: 20rpx"></view>
-				<view class="uni-form-item uni-column">
-					<view class="title">用户姓名</view>
-					<input class="uni-input" v-model="buyerName" :placeholder="isShow ? '请输入' : ''" />
-				</view>
-				<view class="uni-form-item uni-column">
-					<view class="title">身份证</view>
-					<input class="uni-input" v-model="buyerIdCard" :placeholder="isShow ? '请输入' : ''" />
-				</view>
-			</view>
-		</neil-modal>
-	</view>
-</template>
-
-<script>
-	import neilModal from '@/components/neil-modal/neil-modal.vue';
-	export default {
-		props: {
-			orderInfo: {
-				type: Object,
-				default: () => ({}),
-			},
-		},
-		components: {
-			neilModal,
-		},
-		computed: {
-			showYSF() {
-				return (
-					this.orderInfo.isRecordBuyer &&
-					((this.orderInfo.goods &&
-							!this.orderInfo.goods.find((item) => item.num > 1)) ||
-						(this.orderInfo.orderDetails &&
-							!this.orderInfo.orderDetails.find((item) => item.num > 1)))
-				);
-			},
-		},
-		data() {
-			return {
-				infoSync: uni.getAccountInfoSync(),
-				isShow: false,
-				buyerName: '',
-				buyerIdCard: '',
-			};
-		},
-		methods: {
-			WeiXinPay() {
-				this.$emit('PAY_TYPE_STR', {
-					payType: '微信支付',
-					wechatPay: true,
-				});
-			},
-			YunFlashPay() {
-				if (this.orderInfo.isRecordBuyer) {
-					this.isShow = true;
-				} else {
-					this.$emit('PAY_TYPE_STR', {
-						payType: '云闪付',
-						wechatPay: false,
-					});
-				}
-			},
-			isIdCard(idCard) {
-				// 15位和18位身份证号码的正则表达式
-				var regIdCard =
-					/^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[Xx])$)$/;
-
-				// 如果通过该验证，说明身份证格式正确，但准确性还需计算
-				if (regIdCard.test(idCard)) {
-					if (idCard.length == 18) {
-						var idCardWi = new Array(
-							7,
-							9,
-							10,
-							5,
-							8,
-							4,
-							2,
-							1,
-							6,
-							3,
-							7,
-							9,
-							10,
-							5,
-							8,
-							4,
-							2
-						); // 将前17位加权因子保存在数组里
-						var idCardY = new Array(1, 0, 10, 9, 8, 7, 6, 5, 4, 3, 2); // 这是除以11后，可能产生的11位余数、验证码，也保存成数组
-						var idCardWiSum = 0; // 用来保存前17位各自乖以加权因子后的总和
-						for (var i = 0; i < 17; i++) {
-							idCardWiSum += idCard.substring(i, i + 1) * idCardWi[i];
-						}
-
-						var idCardMod = idCardWiSum % 11; // 计算出校验码所在数组的位置
-						var idCardLast = idCard.substring(17); // 得到最后一位身份证号码
-
-						// 如果等于2，则说明校验码是10，身份证号码最后一位应该是X
-						if (idCardMod == 2) {
-							if (idCardLast == 'X' || idCardLast == 'x') {
-								//alert("恭喜通过验证啦！");
-								return true;
-							} else {
-								//alert("身份证号码错误！");
-								return false;
-							}
-						} else {
-							// 用计算出的验证码与最后一位身份证号码匹配，如果一致，说明通过，否则是无效的身份证号码
-							if (idCardLast == idCardY[idCardMod]) {
-								//alert("恭喜通过验证啦！");
-								return true;
-							} else {
-								//alert("身份证号码错误！");
-								return false;
-							}
-						}
-					} else {
-						return true;
-					}
-				} else {
-					//alert("身份证格式不正确!");
-					return false;
-				}
-			},
-			checkChinese(val) {
-				return val.charCodeAt() > 255 ? true : false;
-			},
-			success() {
-				this.isShow = false;
-				if (!this.buyerName || !this.buyerIdCard) {
-					this.$toast('用户姓名与身份证必须填写！');
-					return;
-				}
-				if (!(this.buyerName.length >= 2 && this.checkChinese(this.buyerName))) {
-					this.$toast('姓名必须至少两个字并且为中文！');
-					return;
-				}
-				if (!this.isIdCard(this.buyerIdCard)) {
-					this.$toast('身份证不符合规格！');
-					return;
-				}
-				this.$emit('PAY_TYPE_STR', {
-					payType: '云闪付',
-					wechatPay: false,
-					buyerName: this.buyerName,
-					buyerIdCard: this.buyerIdCard,
-				});
-			},
-			fail() {
-				this.isShow = false;
-			},
-		},
-	};
-</script>
-
-<style scoped lang="scss">
-	.btn {
-		width: 100%;
-		font-size: 36rpx;
-		display: flex;
-		flex-direction: row;
-		align-items: center;
-		justify-content: center;
-		box-sizing: border-box;
-	}
-
-	.z-popup {
-		position: fixed;
-		background: #efefef;
-		width: 100%;
-		height: 100vh;
-		z-index: 1000000000;
-		left: 0;
-		right: 0;
-		transition: top 0.5s;
-		box-sizing: border-box;
-		padding: 40rpx;
-
-		.zhuangtaitubiao {
-			width: 100%;
-			height: auto;
-			box-sizing: border-box;
-			padding: 40rpx;
-			background: #fff;
-			border-radius: 20rpx;
-			margin-bottom: 50rpx;
-			display: flex;
-			justify-content: center;
-			align-items: center;
-			flex-direction: column;
-			box-sizing: border-box;
-
-			.textclass {
-				font-size: 32rpx;
-				font-weight: 500;
-				box-sizing: border-box;
-			}
-		}
-
-		.anniukuang {
-			width: 100%;
-			margin-bottom: 20rpx;
-			box-sizing: border-box;
-			box-sizing: border-box;
-		}
-
-		.title {
-			font-size: 32rpx;
-			font-weight: 500;
-			align-items: left;
-			box-sizing: border-box;
-		}
-
-		.row {
-			display: flex;
-			align-items: left;
-			margin-top: 30rpx;
-			width: 100%;
-			box-sizing: border-box;
-
-			// .label {
-			// 	color: $sec-font;
-			// }
-
-			// .price {
-			// 	color: $minor-color;
-			// 	font-weight: 500;
-			// }
-		}
-	}
+<template>
+	<view :style="{ top: 0 }" class="z-popup">
+		<view class="anniukuang" v-if="
+        infoSync.miniProgram.appId == 'wxb80d6a6523463b70' ? !showYSF : true
+      ">
+			<button class="btn" @click="WeiXinPay">
+				<uni-icons type="weixin" size="30" style="margin-right: 20rpx"></uni-icons>
+				微信支付
+			</button>
+		</view>
+		<view class="anniukuang" v-if="showYSF">
+			<button class="btn" @click="YunFlashPay">
+				<uni-icons type="cloud-upload" size="30" style="margin-right: 20rpx"></uni-icons>
+				云闪付
+			</button>
+		</view>
+		<neil-modal v-if="isShow" :show="isShow" title="以旧换新参与人信息" @cancel="fail" @confirm="success">
+			<view style="min-height: 90upx; padding: 32upx 24upx">
+				<view>应'政府以旧换新补贴'政策要求发票抬头需与享受以旧换新者(领券人)实名信息完全一致，请务必填写准确!若不一致，后续有补贴失败追回风险。</view>
+				<view style="height: 20rpx"></view>
+				<view class="uni-form-item uni-column">
+					<view class="title">用户姓名</view>
+					<input class="uni-input" v-model="buyerName" :placeholder="isShow ? '请输入' : ''" />
+				</view>
+				<view class="uni-form-item uni-column">
+					<view class="title">身份证</view>
+					<input class="uni-input" v-model="buyerIdCard" :placeholder="isShow ? '请输入' : ''" />
+				</view>
+			</view>
+		</neil-modal>
+	</view>
+</template>
+
+<script>
+	import neilModal from '@/components/neil-modal/neil-modal.vue';
+	export default {
+		props: {
+			orderInfo: {
+				type: Object,
+				default: () => ({}),
+			},
+		},
+		components: {
+			neilModal,
+		},
+		computed: {
+			showYSF() {
+				return (
+					this.orderInfo.isRecordBuyer &&
+					((this.orderInfo.goods &&
+							!this.orderInfo.goods.find((item) => item.num > 1)) ||
+						(this.orderInfo.orderDetails &&
+							!this.orderInfo.orderDetails.find((item) => item.num > 1)))
+				);
+			},
+		},
+		data() {
+			return {
+				infoSync: uni.getAccountInfoSync(),
+				isShow: false,
+				buyerName: '',
+				buyerIdCard: '',
+			};
+		},
+		methods: {
+			WeiXinPay() {
+				this.$emit('PAY_TYPE_STR', {
+					payType: '微信支付',
+					wechatPay: true,
+				});
+			},
+			YunFlashPay() {
+				if (this.orderInfo.isRecordBuyer) {
+					this.isShow = true;
+				} else {
+					this.$emit('PAY_TYPE_STR', {
+						payType: '云闪付',
+						wechatPay: false,
+					});
+				}
+			},
+			isIdCard(idCard) {
+				// 15位和18位身份证号码的正则表达式
+				var regIdCard =
+					/^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[Xx])$)$/;
+
+				// 如果通过该验证，说明身份证格式正确，但准确性还需计算
+				if (regIdCard.test(idCard)) {
+					if (idCard.length == 18) {
+						var idCardWi = new Array(
+							7,
+							9,
+							10,
+							5,
+							8,
+							4,
+							2,
+							1,
+							6,
+							3,
+							7,
+							9,
+							10,
+							5,
+							8,
+							4,
+							2
+						); // 将前17位加权因子保存在数组里
+						var idCardY = new Array(1, 0, 10, 9, 8, 7, 6, 5, 4, 3, 2); // 这是除以11后，可能产生的11位余数、验证码，也保存成数组
+						var idCardWiSum = 0; // 用来保存前17位各自乖以加权因子后的总和
+						for (var i = 0; i < 17; i++) {
+							idCardWiSum += idCard.substring(i, i + 1) * idCardWi[i];
+						}
+
+						var idCardMod = idCardWiSum % 11; // 计算出校验码所在数组的位置
+						var idCardLast = idCard.substring(17); // 得到最后一位身份证号码
+
+						// 如果等于2，则说明校验码是10，身份证号码最后一位应该是X
+						if (idCardMod == 2) {
+							if (idCardLast == 'X' || idCardLast == 'x') {
+								//alert("恭喜通过验证啦！");
+								return true;
+							} else {
+								//alert("身份证号码错误！");
+								return false;
+							}
+						} else {
+							// 用计算出的验证码与最后一位身份证号码匹配，如果一致，说明通过，否则是无效的身份证号码
+							if (idCardLast == idCardY[idCardMod]) {
+								//alert("恭喜通过验证啦！");
+								return true;
+							} else {
+								//alert("身份证号码错误！");
+								return false;
+							}
+						}
+					} else {
+						return true;
+					}
+				} else {
+					//alert("身份证格式不正确!");
+					return false;
+				}
+			},
+			checkChinese(val) {
+				return val.charCodeAt() > 255 ? true : false;
+			},
+			success() {
+				this.isShow = false;
+				if (!this.buyerName || !this.buyerIdCard) {
+					this.$toast('用户姓名与身份证必须填写！');
+					return;
+				}
+				if (!(this.buyerName.length >= 2 && this.checkChinese(this.buyerName))) {
+					this.$toast('姓名必须至少两个字并且为中文！');
+					return;
+				}
+				if (!this.isIdCard(this.buyerIdCard)) {
+					this.$toast('身份证不符合规格！');
+					return;
+				}
+				this.$emit('PAY_TYPE_STR', {
+					payType: '云闪付',
+					wechatPay: false,
+					buyerName: this.buyerName,
+					buyerIdCard: this.buyerIdCard,
+				});
+			},
+			fail() {
+				this.isShow = false;
+			},
+		},
+	};
+</script>
+
+<style scoped lang="scss">
+	.btn {
+		width: 100%;
+		font-size: 36rpx;
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		justify-content: center;
+		box-sizing: border-box;
+	}
+
+	.z-popup {
+		position: fixed;
+		background: #efefef;
+		width: 100%;
+		height: 100vh;
+		z-index: 1000000000;
+		left: 0;
+		right: 0;
+		transition: top 0.5s;
+		box-sizing: border-box;
+		padding: 40rpx;
+
+		.zhuangtaitubiao {
+			width: 100%;
+			height: auto;
+			box-sizing: border-box;
+			padding: 40rpx;
+			background: #fff;
+			border-radius: 20rpx;
+			margin-bottom: 50rpx;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			flex-direction: column;
+			box-sizing: border-box;
+
+			.textclass {
+				font-size: 32rpx;
+				font-weight: 500;
+				box-sizing: border-box;
+			}
+		}
+
+		.anniukuang {
+			width: 100%;
+			margin-bottom: 20rpx;
+			box-sizing: border-box;
+			box-sizing: border-box;
+		}
+
+		.title {
+			font-size: 32rpx;
+			font-weight: 500;
+			align-items: left;
+			box-sizing: border-box;
+		}
+
+		.row {
+			display: flex;
+			align-items: left;
+			margin-top: 30rpx;
+			width: 100%;
+			box-sizing: border-box;
+
+			// .label {
+			// 	color: $sec-font;
+			// }
+
+			// .price {
+			// 	color: $minor-color;
+			// 	font-weight: 500;
+			// }
+		}
+	}
 </style>

components/zj-container/zj-fiex-column.vue

@@ -1,145 +1,145 @@
-<template>
-  <view
-    :class="{
-      'zj-page-container': true,
-      'zj-page-container-column': direction === 'column'
-    }"
-    :style="{
-      width,
-      height,
-      background
-    }"
-  >
-    <slot name="before"></slot>
-    <view :class="['zj-page-fill', zjPageFillClass]">
-      <view class="zj-page-fill-absolute">
-        <template v-if="scroll">
-          <scroll-view
-            class="zj-page-fill-scroll"
-            scroll-y
-            enable-flex
-            @scrolltoupper="
-              (...p) => {
-                $emit('scrolltoupper', p)
-              }
-            "
-            @scrolltolower="
-              (...p) => {
-                $emit('scrolltolower', p)
-              }
-            "
-            @scroll="
-              (...p) => {
-                $emit('scroll', p)
-              }
-            "
-            @refresherpulling="
-              (...p) => {
-                $emit('refresherpulling', p)
-              }
-            "
-            @refresherrefresh="
-              (...p) => {
-                $emit('refresherrefresh', p)
-              }
-            "
-            @refresherrestore="
-              (...p) => {
-                $emit('refresherrestore', p)
-              }
-            "
-            @refresherabort="
-              (...p) => {
-                $emit('refresherabort', p)
-              }
-            "
-            :refresher-enabled="refresherEnabled"
-            :refresher-triggered="refresherTriggered"
-          >
-            <slot></slot>
-          </scroll-view>
-        </template>
-        <template v-else>
-          <slot></slot>
-        </template>
-      </view>
-    </view>
-    <slot name="after"></slot>
-  </view>
-</template>
-
-<script>
-export default {
-  props: {
-    background: {
-      type: String,
-      default: ''
-    },
-    width: {
-      type: String,
-      default: '100%'
-    },
-    height: {
-      type: String,
-      default: '100%'
-    },
-    direction: {
-      type: String,
-      default: 'column'
-    },
-    scroll: {
-      type: Boolean,
-      default: true
-    },
-    zjPageFillClass: {
-      type: String,
-      default: ''
-    },
-    refresherEnabled: {
-      type: Boolean,
-      default: false
-    },
-    refresherTriggered: {
-      type: Boolean,
-      default: false
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.zj-page-container {
-  display: flex;
-  display: -webkit-flex;
-  box-sizing: border-box;
-}
-
-.zj-page-container-row {
-  flex-direction: row;
-}
-
-.zj-page-container-column {
-  flex-direction: column;
-}
-
-.zj-page-fill {
-  box-sizing: border-box;
-  flex: 1;
-  overflow: hidden;
-  position: relative;
-
-  .zj-page-fill-absolute {
-    position: absolute;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-  }
-
-  .zj-page-fill-scroll {
-    width: 100%;
-    height: 100%;
-    box-sizing: border-box;
-  }
-}
-</style>
+<template>
+  <view
+    :class="{
+      'zj-page-container': true,
+      'zj-page-container-column': direction === 'column'
+    }"
+    :style="{
+      width,
+      height,
+      background
+    }"
+  >
+    <slot name="before"></slot>
+    <view :class="['zj-page-fill', zjPageFillClass]">
+      <view class="zj-page-fill-absolute">
+        <template v-if="scroll">
+          <scroll-view
+            class="zj-page-fill-scroll"
+            scroll-y
+            enable-flex
+            @scrolltoupper="
+              (...p) => {
+                $emit('scrolltoupper', p)
+              }
+            "
+            @scrolltolower="
+              (...p) => {
+                $emit('scrolltolower', p)
+              }
+            "
+            @scroll="
+              (...p) => {
+                $emit('scroll', p)
+              }
+            "
+            @refresherpulling="
+              (...p) => {
+                $emit('refresherpulling', p)
+              }
+            "
+            @refresherrefresh="
+              (...p) => {
+                $emit('refresherrefresh', p)
+              }
+            "
+            @refresherrestore="
+              (...p) => {
+                $emit('refresherrestore', p)
+              }
+            "
+            @refresherabort="
+              (...p) => {
+                $emit('refresherabort', p)
+              }
+            "
+            :refresher-enabled="refresherEnabled"
+            :refresher-triggered="refresherTriggered"
+          >
+            <slot></slot>
+          </scroll-view>
+        </template>
+        <template v-else>
+          <slot></slot>
+        </template>
+      </view>
+    </view>
+    <slot name="after"></slot>
+  </view>
+</template>
+
+<script>
+export default {
+  props: {
+    background: {
+      type: String,
+      default: ''
+    },
+    width: {
+      type: String,
+      default: '100%'
+    },
+    height: {
+      type: String,
+      default: '100%'
+    },
+    direction: {
+      type: String,
+      default: 'column'
+    },
+    scroll: {
+      type: Boolean,
+      default: true
+    },
+    zjPageFillClass: {
+      type: String,
+      default: ''
+    },
+    refresherEnabled: {
+      type: Boolean,
+      default: false
+    },
+    refresherTriggered: {
+      type: Boolean,
+      default: false
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.zj-page-container {
+  display: flex;
+  display: -webkit-flex;
+  box-sizing: border-box;
+}
+
+.zj-page-container-row {
+  flex-direction: row;
+}
+
+.zj-page-container-column {
+  flex-direction: column;
+}
+
+.zj-page-fill {
+  box-sizing: border-box;
+  flex: 1;
+  overflow: hidden;
+  position: relative;
+
+  .zj-page-fill-absolute {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+  }
+
+  .zj-page-fill-scroll {
+    width: 100%;
+    height: 100%;
+    box-sizing: border-box;
+  }
+}
+</style>

components/zj-container/zj-fiex-row.vue

@@ -1,144 +1,144 @@
-<template>
-  <view
-    :class="{
-      'zj-page-container': true,
-      'zj-page-container-row': direction === 'row'
-    }"
-    :style="{
-      width,
-      height,
-      background
-    }"
-  >
-    <slot name="before"></slot>
-    <view :class="['zj-page-fill', zjPageFillClass]">
-      <view class="zj-page-fill-absolute">
-        <template v-if="scroll">
-          <scroll-view
-            class="zj-page-fill-scroll"
-            scroll-y
-            scroll-x
-            enable-flex
-            @scrolltoupper="
-              (...p) => {
-                $emit('scrolltoupper', p)
-              }
-            "
-            @scrolltolower="
-              (...p) => {
-                $emit('scrolltolower', p)
-              }
-            "
-            @scroll="
-              (...p) => {
-                $emit('scroll', p)
-              }
-            "
-            @refresherpulling="
-              (...p) => {
-                $emit('refresherpulling', p)
-              }
-            "
-            @refresherrefresh="
-              (...p) => {
-                $emit('refresherrefresh', p)
-              }
-            "
-            @refresherrestore="
-              (...p) => {
-                $emit('refresherrestore', p)
-              }
-            "
-            @refresherabort="
-              (...p) => {
-                $emit('refresherabort', p)
-              }
-            "
-          >
-            <slot></slot>
-          </scroll-view>
-        </template>
-        <template v-else>
-          <slot></slot>
-        </template>
-      </view>
-    </view>
-    <slot name="after"></slot>
-  </view>
-</template>
-
-<script>
-export default {
-  props: {
-    background: {
-      type: String,
-      default: ''
-    },
-    width: {
-      type: String,
-      default: '100%'
-    },
-    height: {
-      type: String,
-      default: '100%'
-    },
-    direction: {
-      type: String,
-      default: 'column'
-    },
-    scroll: {
-      type: Boolean,
-      default: true
-    },
-    zjPageFillClass: {
-      type: String,
-      default: ''
-    },
-    refresherEnabled: {
-      type: Boolean,
-      default: false
-    },
-    refresherTriggered: {
-      type: Boolean,
-      default: false
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.zj-page-container {
-  display: flex;
-  display: -webkit-flex;
-  box-sizing: border-box;
-}
-
-.zj-page-container-row {
-  flex-direction: row;
-}
-
-.zj-page-container-column {
-  flex-direction: column;
-}
-
-.zj-page-fill {
-  box-sizing: border-box;
-  flex: 1;
-  overflow: hidden;
-  position: relative;
-
-  .zj-page-fill-absolute {
-    position: absolute;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-  }
-
-  .zj-page-fill-scroll {
-    width: 100%;
-    height: 100%;
-    box-sizing: border-box;
-  }
-}
-</style>
+<template>
+  <view
+    :class="{
+      'zj-page-container': true,
+      'zj-page-container-row': direction === 'row'
+    }"
+    :style="{
+      width,
+      height,
+      background
+    }"
+  >
+    <slot name="before"></slot>
+    <view :class="['zj-page-fill', zjPageFillClass]">
+      <view class="zj-page-fill-absolute">
+        <template v-if="scroll">
+          <scroll-view
+            class="zj-page-fill-scroll"
+            scroll-y
+            scroll-x
+            enable-flex
+            @scrolltoupper="
+              (...p) => {
+                $emit('scrolltoupper', p)
+              }
+            "
+            @scrolltolower="
+              (...p) => {
+                $emit('scrolltolower', p)
+              }
+            "
+            @scroll="
+              (...p) => {
+                $emit('scroll', p)
+              }
+            "
+            @refresherpulling="
+              (...p) => {
+                $emit('refresherpulling', p)
+              }
+            "
+            @refresherrefresh="
+              (...p) => {
+                $emit('refresherrefresh', p)
+              }
+            "
+            @refresherrestore="
+              (...p) => {
+                $emit('refresherrestore', p)
+              }
+            "
+            @refresherabort="
+              (...p) => {
+                $emit('refresherabort', p)
+              }
+            "
+          >
+            <slot></slot>
+          </scroll-view>
+        </template>
+        <template v-else>
+          <slot></slot>
+        </template>
+      </view>
+    </view>
+    <slot name="after"></slot>
+  </view>
+</template>
+
+<script>
+export default {
+  props: {
+    background: {
+      type: String,
+      default: ''
+    },
+    width: {
+      type: String,
+      default: '100%'
+    },
+    height: {
+      type: String,
+      default: '100%'
+    },
+    direction: {
+      type: String,
+      default: 'column'
+    },
+    scroll: {
+      type: Boolean,
+      default: true
+    },
+    zjPageFillClass: {
+      type: String,
+      default: ''
+    },
+    refresherEnabled: {
+      type: Boolean,
+      default: false
+    },
+    refresherTriggered: {
+      type: Boolean,
+      default: false
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.zj-page-container {
+  display: flex;
+  display: -webkit-flex;
+  box-sizing: border-box;
+}
+
+.zj-page-container-row {
+  flex-direction: row;
+}
+
+.zj-page-container-column {
+  flex-direction: column;
+}
+
+.zj-page-fill {
+  box-sizing: border-box;
+  flex: 1;
+  overflow: hidden;
+  position: relative;
+
+  .zj-page-fill-absolute {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+  }
+
+  .zj-page-fill-scroll {
+    width: 100%;
+    height: 100%;
+    box-sizing: border-box;
+  }
+}
+</style>

components/zj-container/zj-page-container.vue

@@ -1,25 +1,25 @@
-<template>
-  <view class="page-bottom" :style="{ background }">
-    <slot></slot>
-  </view>
-</template>
-
-<script>
-export default {
-  props: {
-    background: {
-      type: String,
-      default: ''
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.page-bottom {
-  width: 100%;
-  height: 100vh;
-  box-sizing: border-box;
-  padding-bottom: env(safe-area-inset-bottom);
-}
-</style>
+<template>
+  <view class="page-bottom" :style="{ background }">
+    <slot></slot>
+  </view>
+</template>
+
+<script>
+export default {
+  props: {
+    background: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.page-bottom {
+  width: 100%;
+  height: 100vh;
+  box-sizing: border-box;
+  padding-bottom: env(safe-area-inset-bottom);
+}
+</style>

components/zj-container/zj-page-layout.vue

@@ -1,134 +1,134 @@
-<template>
-  <view class="app-container" :class="hasFooter || isTabbar ? '':'pb'"
-    :style="{background: bgColor, height: 'calc(100vh - ' + aHeight + 'px)'}">
-    <u-loading-page color="#333333" fontSize="17" icon-size="44" :loading="isLoading"></u-loading-page>
-
-    <block v-if="!isLoading">
-      <view class="header-container">
-        <slot name="header"></slot>
-      </view>
-      <view class="content-container">
-        <template v-if="isScroll">
-          <scroll-view scroll-y enable-flex refresher-enabled style="width: 100%; height: 100%; box-sizing: border-box;"
-            :refresher-background="refresherBackground" @scrolltoupper="(...p)=>{$emit('scrolltoupper',p)}"
-            @scrolltolower="(...p)=>{$emit('scrolltolower',p)}" @scroll="(...p)=>{$emit('scroll',p)}"
-            @refresherpulling="(...p)=>{$emit('refresherpulling',p)}"
-            @refresherrefresh="(...p)=>{$emit('refresherrefresh',p)}"
-            @refresherrestore="(...p)=>{$emit('refresherrestore',p)}"
-            @refresherabort="(...p)=>{$emit('refresherabort',p)}" :refresher-triggered="refresherTriggered">
-            <slot></slot>
-          </scroll-view>
-        </template>
-        <template v-else>
-          <view style="width: 100%; height: 100%; box-sizing: border-box; overflow-y: scroll;">
-            <slot></slot>
-          </view>
-        </template>
-      </view>
-      <view class="footer-container" v-if="hasFooter">
-        <slot name="footer"></slot>
-      </view>
-    </block>
-  </view>
-</template>
-
-<script>
-  export default {
-    props: {
-      bgColor: {
-        type: String,
-        default: '#F7F8FF',
-      },
-      refresherBackground: {
-        type: String,
-        default: '#F7F8FF',
-      },
-      hasFooter: {
-        type: Boolean,
-        default: false,
-      },
-      isScroll: {
-        type: Boolean,
-        default: false,
-      },
-      refresherTriggered: {
-        type: Boolean,
-        default: false,
-      },
-      isLoading: {
-        type: Boolean,
-        default: false,
-      },
-      isWxCustomPage: {
-        type: Boolean,
-        default: false,
-      },
-    },
-
-    computed: {
-      isTabbar() {
-        let pages = getCurrentPages();
-        if (pages.length > 0) {
-          let prevPage = pages[pages.length - 1];
-          if (prevPage.route === 'pages/index/index' || prevPage.route === 'pages/workorder/index' || prevPage.route ===
-            'pages/goods/index' || prevPage.route === 'pages/mine/index') {
-            return true;
-          } else {
-            return false;
-          }
-        }
-      },
-
-      aHeight() {
-        let num = 0;
-        // #ifdef H5
-        if(this.isWxCustomPage) {
-          num = 50;
-        } else if (this.isTabbar) {
-          num = 0+50;
-        } else {
-          num = 0;
-        }
-        // #endif
-        return num;
-      },
-    }
-  }
-</script>
-
-<style lang="scss" scoped>
-  ::v-deep .u-loading-page {
-    z-index: 999999;
-  }
-
-  .app-container {
-    width: 100%;
-    height: 100vh;
-    box-sizing: border-box;
-    display: flex;
-    flex-direction: column;
-
-    &.pb {
-      padding-bottom: env(safe-area-inset-bottom);
-    }
-
-    .header-container {
-      flex-shrink: 0;
-    }
-
-    .content-container {
-      flex: 1;
-      height: 0;
-    }
-
-    .footer-container {
-      flex-shrink: 0;
-      padding-bottom: env(safe-area-inset-bottom);
-      background: #ffffff;
-      box-sizing: border-box;
-      box-shadow: $bottom-shadow;
-      position: relative;
-      z-index: 1;
-    }
-  }
-</style>
+<template>
+  <view class="app-container" :class="hasFooter || isTabbar ? '':'pb'"
+    :style="{background: bgColor, height: 'calc(100vh - ' + aHeight + 'px)'}">
+    <u-loading-page color="#333333" fontSize="17" icon-size="44" :loading="isLoading"></u-loading-page>
+
+    <block v-if="!isLoading">
+      <view class="header-container">
+        <slot name="header"></slot>
+      </view>
+      <view class="content-container">
+        <template v-if="isScroll">
+          <scroll-view scroll-y enable-flex refresher-enabled style="width: 100%; height: 100%; box-sizing: border-box;"
+            :refresher-background="refresherBackground" @scrolltoupper="(...p)=>{$emit('scrolltoupper',p)}"
+            @scrolltolower="(...p)=>{$emit('scrolltolower',p)}" @scroll="(...p)=>{$emit('scroll',p)}"
+            @refresherpulling="(...p)=>{$emit('refresherpulling',p)}"
+            @refresherrefresh="(...p)=>{$emit('refresherrefresh',p)}"
+            @refresherrestore="(...p)=>{$emit('refresherrestore',p)}"
+            @refresherabort="(...p)=>{$emit('refresherabort',p)}" :refresher-triggered="refresherTriggered">
+            <slot></slot>
+          </scroll-view>
+        </template>
+        <template v-else>
+          <view style="width: 100%; height: 100%; box-sizing: border-box; overflow-y: scroll;">
+            <slot></slot>
+          </view>
+        </template>
+      </view>
+      <view class="footer-container" v-if="hasFooter">
+        <slot name="footer"></slot>
+      </view>
+    </block>
+  </view>
+</template>
+
+<script>
+  export default {
+    props: {
+      bgColor: {
+        type: String,
+        default: '#F7F8FF',
+      },
+      refresherBackground: {
+        type: String,
+        default: '#F7F8FF',
+      },
+      hasFooter: {
+        type: Boolean,
+        default: false,
+      },
+      isScroll: {
+        type: Boolean,
+        default: false,
+      },
+      refresherTriggered: {
+        type: Boolean,
+        default: false,
+      },
+      isLoading: {
+        type: Boolean,
+        default: false,
+      },
+      isWxCustomPage: {
+        type: Boolean,
+        default: false,
+      },
+    },
+
+    computed: {
+      isTabbar() {
+        let pages = getCurrentPages();
+        if (pages.length > 0) {
+          let prevPage = pages[pages.length - 1];
+          if (prevPage.route === 'pages/index/index' || prevPage.route === 'pages/workorder/index' || prevPage.route ===
+            'pages/goods/index' || prevPage.route === 'pages/mine/index') {
+            return true;
+          } else {
+            return false;
+          }
+        }
+      },
+
+      aHeight() {
+        let num = 0;
+        // #ifdef H5
+        if(this.isWxCustomPage) {
+          num = 50;
+        } else if (this.isTabbar) {
+          num = 0+50;
+        } else {
+          num = 0;
+        }
+        // #endif
+        return num;
+      },
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  ::v-deep .u-loading-page {
+    z-index: 999999;
+  }
+
+  .app-container {
+    width: 100%;
+    height: 100vh;
+    box-sizing: border-box;
+    display: flex;
+    flex-direction: column;
+
+    &.pb {
+      padding-bottom: env(safe-area-inset-bottom);
+    }
+
+    .header-container {
+      flex-shrink: 0;
+    }
+
+    .content-container {
+      flex: 1;
+      height: 0;
+    }
+
+    .footer-container {
+      flex-shrink: 0;
+      padding-bottom: env(safe-area-inset-bottom);
+      background: #ffffff;
+      box-sizing: border-box;
+      box-shadow: $bottom-shadow;
+      position: relative;
+      z-index: 1;
+    }
+  }
+</style>

components/zj-page-container/zj-page-container.vue

@@ -1,49 +1,49 @@
-<template>
-  <view
-    :class="{
-      'zj-page-container': true,
-      'zj-page-container-row': direction === 'row',
-      'zj-page-container-column': direction === 'column'
-    }"
-    :style="{
-      width: width,
-      height: height
-    }"
-  >
-    <slot></slot>
-  </view>
-</template>
-
-<script>
-export default {
-  name: 'ZjPageContainer',
-  props: {
-    width: {
-      type: String,
-      default: '100%'
-    },
-    height: {
-      type: String,
-      default: '100%'
-    },
-    direction: {
-      type: String,
-      default: 'column'
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.zj-page-container {
-  display: flex;
-}
-
-.zj-page-container-row {
-  flex-direction: row;
-}
-
-.zj-page-container-column {
-  flex-direction: column;
-}
-</style>
+<template>
+  <view
+    :class="{
+      'zj-page-container': true,
+      'zj-page-container-row': direction === 'row',
+      'zj-page-container-column': direction === 'column'
+    }"
+    :style="{
+      width: width,
+      height: height
+    }"
+  >
+    <slot></slot>
+  </view>
+</template>
+
+<script>
+export default {
+  name: 'ZjPageContainer',
+  props: {
+    width: {
+      type: String,
+      default: '100%'
+    },
+    height: {
+      type: String,
+      default: '100%'
+    },
+    direction: {
+      type: String,
+      default: 'column'
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.zj-page-container {
+  display: flex;
+}
+
+.zj-page-container-row {
+  flex-direction: row;
+}
+
+.zj-page-container-column {
+  flex-direction: column;
+}
+</style>

components/zj-page-container/zj-page-fill.vue

@@ -1,86 +1,86 @@
-<template>
-	<view :class="['zj-page-fill', zjPageFillClass]">
-		<view class="zj-page-fill-absolute">
-			<template v-if="scroll">
-				<!-- v-bind="scrollAttribute" -->
-				<scroll-view class="zj-page-fill-scroll" scroll-y enable-flex @scrolltoupper="
-            (...p) => {
-              $emit('scrolltoupper', p)
-            }
-          " @scrolltolower="
-            (...p) => {
-              $emit('scrolltolower', p)
-            }
-          " @scroll="
-            (...p) => {
-              $emit('scroll', p)
-            }
-          " @refresherpulling="
-            (...p) => {
-              $emit('refresherpulling', p)
-            }
-          " @refresherrefresh="
-            (...p) => {
-              $emit('refresherrefresh', p)
-            }
-          " @refresherrestore="
-            (...p) => {
-              $emit('refresherrestore', p)
-            }
-          " @refresherabort="
-            (...p) => {
-              $emit('refresherabort', p)
-            }
-          ">
-					<slot></slot>
-				</scroll-view>
-			</template>
-			<template v-else>
-				<slot></slot>
-			</template>
-		</view>
-	</view>
-</template>
-
-<script>
-	export default {
-		name: 'ZjPageFill',
-		props: {
-			scroll: {
-				type: Boolean,
-				default: true
-			},
-			scrollAttribute: {
-				type: Object,
-				default: () => ({})
-			},
-			zjPageFillClass: {
-				type: String,
-				default: ''
-			}
-		}
-	}
-</script>
-
-<style lang="scss" scoped>
-	.zj-page-fill {
-		flex: 1;
-		overflow: hidden;
-		position: relative;
-		height: 100%;
-
-		.zj-page-fill-absolute {
-			position: absolute;
-			top: 0;
-			right: 0;
-			bottom: 0;
-			left: 0;
-		}
-
-		.zj-page-fill-scroll {
-			width: 100%;
-			height: 100%;
-			box-sizing: border-box;
-		}
-	}
+<template>
+	<view :class="['zj-page-fill', zjPageFillClass]">
+		<view class="zj-page-fill-absolute">
+			<template v-if="scroll">
+				<!-- v-bind="scrollAttribute" -->
+				<scroll-view class="zj-page-fill-scroll" scroll-y enable-flex @scrolltoupper="
+            (...p) => {
+              $emit('scrolltoupper', p)
+            }
+          " @scrolltolower="
+            (...p) => {
+              $emit('scrolltolower', p)
+            }
+          " @scroll="
+            (...p) => {
+              $emit('scroll', p)
+            }
+          " @refresherpulling="
+            (...p) => {
+              $emit('refresherpulling', p)
+            }
+          " @refresherrefresh="
+            (...p) => {
+              $emit('refresherrefresh', p)
+            }
+          " @refresherrestore="
+            (...p) => {
+              $emit('refresherrestore', p)
+            }
+          " @refresherabort="
+            (...p) => {
+              $emit('refresherabort', p)
+            }
+          ">
+					<slot></slot>
+				</scroll-view>
+			</template>
+			<template v-else>
+				<slot></slot>
+			</template>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'ZjPageFill',
+		props: {
+			scroll: {
+				type: Boolean,
+				default: true
+			},
+			scrollAttribute: {
+				type: Object,
+				default: () => ({})
+			},
+			zjPageFillClass: {
+				type: String,
+				default: ''
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.zj-page-fill {
+		flex: 1;
+		overflow: hidden;
+		position: relative;
+		height: 100%;
+
+		.zj-page-fill-absolute {
+			position: absolute;
+			top: 0;
+			right: 0;
+			bottom: 0;
+			left: 0;
+		}
+
+		.zj-page-fill-scroll {
+			width: 100%;
+			height: 100%;
+			box-sizing: border-box;
+		}
+	}
 </style>

index.html

@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title></title>
+    <!--preload-links-->
+    <!--app-context-->
+  </head>
+  <body>
+    <div id="app"><!--app-html--></div>
+    <script type="module" src="/main.js"></script>
+  </body>
+</html>

main.js

@@ -0,0 +1,73 @@
+import Vue from 'vue'
+import App from './App'
+
+import uView from '@/uni_modules/uview-ui'
+Vue.use(uView)
+
+import store from './store'
+Vue.prototype.$store = store
+
+import custom from '@/components/custom.vue';
+import loadingText from '@/components/loadingText.vue';
+import noData from '@/components/noData.vue';
+Vue.component('custom', custom);
+Vue.component('loading-text', loadingText);
+Vue.component('no-data', noData);
+
+import {axios} from '@/api/axios.js';
+Vue.prototype.$axios = axios;
+
+import * as filters from './filters/index.js' // global filters
+// register global utility filters
+Object.keys(filters).forEach(key => {
+  Vue.filter(key, filters[key])
+})
+
+import {toast, successToast, modal, navPage, redPage, backPage} from '@/utils/common.js'
+Vue.prototype.$toast = toast;
+Vue.prototype.$successToast = successToast;
+Vue.prototype.$modal = modal;
+Vue.prototype.$navPage = navPage;
+Vue.prototype.$redPage = redPage;
+Vue.prototype.$backPage = backPage;
+
+import {compareTime} from '@/utils/utils.js'
+Vue.prototype.$compareTime = compareTime;
+
+import { getUserInfo } from '@/api/index.js';
+Vue.prototype.$getUserInfo = getUserInfo;
+
+// 渲染图片文件
+import { base_url } from '@/utils/config.js';
+Vue.prototype.$imageUrl = base_url + '/common/img/get?key=';
+
+Vue.prototype.$onLaunched = new Promise(resolve => {
+    Vue.prototype.$isResolve = resolve
+})
+
+import floatButton from '@/components/floatButton.vue';
+Vue.component('floatButton', floatButton)
+
+Vue.prototype.$auth = (url)=>{
+	if(store.state.isLogin){
+		uni.navigateTo({
+			url,
+			fail:err=>{
+				console.log('auth跳转失败',url,err)
+			}
+		})
+	}else{
+		uni.navigateTo({
+			url:'/pages/login/index'
+		})
+	}
+}
+
+Vue.config.productionTip = false
+
+App.mpType = 'app'
+
+const app = new Vue({
+    ...App
+})
+app.$mount()

manifest.json

@@ -0,0 +1,70 @@
+{
+    "name" : "greemall-wxapp",
+    "appid" : "__UNI__02F6D0D",
+    "description" : "",
+    "versionName" : "1.0.0",
+    "versionCode" : "100",
+    "transformPx" : false,
+    "app-plus" : {
+        /* 5+App特有相关 */
+        "usingComponents" : true,
+        "nvueCompiler" : "uni-app",
+        "splashscreen" : {
+            "alwaysShowBeforeRender" : true,
+            "waiting" : true,
+            "autoclose" : true,
+            "delay" : 0
+        },
+        "modules" : {},
+        /* 模块配置 */
+        "distribute" : {
+            /* 应用发布信息 */
+            "android" : {
+                /* android打包配置 */
+                "permissions" : [
+                    "<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
+                    "<uses-permission android:name=\"android.permission.VIBRATE\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
+                    "<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.CAMERA\"/>",
+                    "<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
+                    "<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
+                    "<uses-feature android:name=\"android.hardware.camera\"/>",
+                    "<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
+                ]
+            },
+            "ios" : {},
+            /* ios打包配置 */
+            "sdkConfigs" : {
+                "geolocation" : {},
+                "maps" : {}
+            }
+        }
+    },
+    /* SDK配置 */
+    "quickapp" : {},
+    /* 快应用特有相关 */
+    "mp-weixin" : {
+        /* 小程序特有相关 */
+        "requiredPrivateInfos" : [ "chooseLocation", "getLocation", "chooseAddress" ],
+        "appid" : "wxd935838591c00e16",
+        "setting" : {
+            "urlCheck" : false,
+            "es6" : true,
+            "minified" : true
+        },
+        "usingComponents" : true,
+        "permission" : {
+            "scope.userLocation" : {
+                "desc" : "用户选择收货地址"
+            }
+        },
+        "libVersion" : "latest"
+    }
+}

package-lock.json

@@ -0,0 +1,41 @@
+{
+  "name": "greemall-wxapp",
+  "version": "1.0.0",
+  "lockfileVersion": 1,
+  "requires": true,
+  "dependencies": {
+    "de-indent": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmmirror.com/de-indent/-/de-indent-1.0.2.tgz",
+      "integrity": "sha512-e/1zu3xH5MQryN2zdVaF0OrdNLUbvWxzMbi+iNA6Bky7l1RoP8a2fIbRocyHclXt/arDrrR6lL3TqFD9pMQTsg=="
+    },
+    "he": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmmirror.com/he/-/he-1.2.0.tgz",
+      "integrity": "sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw=="
+    },
+    "strip-json-comments": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/strip-json-comments/-/strip-json-comments-2.0.1.tgz",
+      "integrity": "sha512-4gB8na07fecVVkOI6Rs4e7T6NOTki5EmL7TUduTs6bu3EdnSycntVJ4re8kgZA+wx9IueI2Y11bfbgwtzuE0KQ=="
+    },
+    "vue-inset-loader": {
+      "version": "1.2.6",
+      "resolved": "https://registry.npmmirror.com/vue-inset-loader/-/vue-inset-loader-1.2.6.tgz",
+      "integrity": "sha512-P4j8QT4baCBSvuVsWdBEBd2UlUKWRWYBmlGj4KIgFPnEar656DSlQmVRMFCRzb24vgY2nQpg8fH+qT24D4nOWA==",
+      "requires": {
+        "strip-json-comments": "^2.0.1",
+        "vue-template-compiler": "^2.6.10"
+      }
+    },
+    "vue-template-compiler": {
+      "version": "2.7.16",
+      "resolved": "https://registry.npmmirror.com/vue-template-compiler/-/vue-template-compiler-2.7.16.tgz",
+      "integrity": "sha512-AYbUWAJHLGGQM7+cNTELw+KsOG9nl2CnSv467WobS5Cv9uk3wFcnr1Etsz2sEIHEZvw1U+o9mRlEO6QbZvUPGQ==",
+      "requires": {
+        "de-indent": "^1.0.2",
+        "he": "^1.2.0"
+      }
+    }
+  }
+}

package.json

@@ -0,0 +1,18 @@
+{
+  "name": "greemall-wxapp",
+  "version": "1.0.0",
+  "description": "",
+  "main": "main.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://gogs.zfire.top/zfire-front/greemall-wxapp.git"
+  },
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "vue-inset-loader": "^1.2.6"
+  }
+}

packageGoods/pages/activity.vue

@@ -1,455 +1,455 @@
-<template>
-  <view
-    class="app-container"
-    :style="
-      'background:' + (pageConfig[2] && hasData ? pageConfig[2] : '#F5F5F5')
-    "
-  >
-    <view class="banner-container" v-if="pageConfig[1]">
-      <image :src="pageConfig[1]" mode="widthFix"></image>
-    </view>
-
-    <view class="top-container">
-      <view class="tab">
-        <view
-          class="item"
-          :class="screenType === 0 ? 'current' : ''"
-          @tap="changeScreen(0)"
-          >综合</view
-        >
-        <view
-          class="item"
-          :class="screenType === 1 ? 'current' : ''"
-          @tap="changeScreen(1)"
-          >销量</view
-        >
-        <view
-          class="item"
-          :class="screenType === 2 || screenType === 3 ? 'current' : ''"
-          @tap="changeScreen(2)"
-          >价格
-          <image
-            src="@/static/icon/price_1.png"
-            v-if="screenType === 2"
-          ></image>
-          <image
-            src="@/static/icon/price_2.png"
-            v-if="screenType === 3"
-          ></image>
-          <image
-            src="@/static/icon/price_0.png"
-            v-if="screenType != 2 && screenType != 3"
-          ></image>
-        </view>
-        <view
-          class="item"
-          :class="screenType === 4 ? 'current' : ''"
-          @tap="changeScreen(4)"
-          >上架时间</view
-        >
-      </view>
-      <view class="icon">
-        <image
-          src="@/static/icon/show_1.png"
-          v-if="showType == 1"
-          @tap="showType = 2"
-        ></image>
-        <image
-          src="@/static/icon/show_2.png"
-          v-if="showType == 2"
-          @tap="showType = 1"
-        ></image>
-      </view>
-    </view>
-
-    <view class="goods-waterfall-list" v-show="showType == 1">
-      <view class="left">
-        <block v-for="(item, index) in goodsList" :key="index">
-          <view
-            class="item"
-            v-if="index % 2 == 0"
-            @tap="toGoodsDetail(item.goodsId)"
-          >
-            <view class="image">
-              <image :src="item.imgUrl" mode="aspectFill" class="img"></image>
-              <image
-                :src="item.logo"
-                mode="aspectFill"
-                class="water"
-                v-if="item.isShowWater"
-              ></image>
-            </view>
-            <view class="content">
-              <view class="title ellipsis-2">{{ item.goodsName }}</view>
-              <view class="tags" v-if="item.tags1 && item.tags1.length > 0">
-                <view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{
-                  it
-                }}</view>
-              </view>
-              <view class="price">
-                <view class="price-1">¥{{ item.goodsPrice | numToFixed }}</view>
-                <view class="price-2"
-                  >¥{{ item.orgGoodsPrice | numToFixed }}</view
-                >
-              </view>
-              <view class="tags2" v-if="item.tags2 && item.tags2.length > 0">
-                <view class="it" v-for="(it, idx) in item.tags2" :key="idx">{{
-                  it
-                }}</view>
-              </view>
-              <view class="text">销量：{{ item.soldNum }}</view>
-            </view>
-          </view>
-        </block>
-      </view>
-      <view class="right">
-        <block v-for="(item, index) in goodsList" :key="index">
-          <view
-            class="item"
-            v-if="index % 2 == 1"
-            @tap="toGoodsDetail(item.goodsId)"
-          >
-            <view class="image">
-              <image :src="item.imgUrl" mode="aspectFill" class="img"></image>
-              <image
-                :src="item.logo"
-                mode="aspectFill"
-                class="water"
-                v-if="item.isShowWater"
-              ></image>
-            </view>
-            <view class="content">
-              <view class="title ellipsis-2">{{ item.goodsName }}</view>
-              <view class="tags" v-if="item.tags1 && item.tags1.length > 0">
-                <view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{
-                  it
-                }}</view>
-              </view>
-              <view class="price">
-                <view class="price-1">¥{{ item.goodsPrice | numToFixed }}</view>
-                <view class="price-2"
-                  >¥{{ item.orgGoodsPrice | numToFixed }}</view
-                >
-              </view>
-              <view class="tags2" v-if="item.tags2 && item.tags2.length > 0">
-                <view class="it" v-for="(it, idx) in item.tags2" :key="idx">{{
-                  it
-                }}</view>
-              </view>
-              <view class="text">销量：{{ item.soldNum }}</view>
-            </view>
-          </view>
-        </block>
-      </view>
-    </view>
-
-    <view class="goods-row-list" v-show="showType == 2">
-      <block v-for="(item, index) in goodsList" :key="index">
-        <view class="item" @tap="toGoodsDetail(item.goodsId)">
-          <view class="image">
-            <image :src="item.imgUrl" mode="aspectFill" class="img"></image>
-            <image
-              :src="item.logo"
-              mode="aspectFill"
-              class="water"
-              v-if="item.isShowWater"
-            ></image>
-          </view>
-          <view class="right">
-            <view>
-              <view class="title ellipsis-2">{{ item.goodsName }}</view>
-              <view class="tags" v-if="item.tags1 && item.tags1.length > 0">
-                <view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{
-                  it
-                }}</view>
-              </view>
-            </view>
-            <view>
-              <view class="bottom">
-                <view class="price">
-                  <view class="price-1"
-                    >¥{{ item.goodsPrice | numToFixed }}</view
-                  >
-                  <view class="price-2"
-                    >¥{{ item.orgGoodsPrice | numToFixed }}</view
-                  >
-                </view>
-                <view class="text">销量：{{ item.soldNum }}</view>
-              </view>
-            </view>
-          </view>
-        </view>
-      </block>
-    </view>
-
-    <no-data v-if="!goodsList.length" :showText="'暂无商品'"></no-data>
-    <loading-text
-      v-if="goodsList.length"
-      :loading="loading"
-      :noMore="noMore"
-    ></loading-text>
-  </view>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      type: null,
-      screenType: '',
-      goodsList: [],
-      pageNum: 1,
-      pageSize: 8,
-      noMore: false,
-      loading: false,
-      showType: 1,
-      hasData: false,
-    };
-  },
-
-  computed: {
-    pageConfig() {
-      const templateInfo = uni.getStorageSync('templateInfo');
-      const MAP = {
-        2: [
-          '首页弹窗',
-          templateInfo.popupHeadImage,
-          templateInfo.popupBackgroundColor,
-        ],
-        3: [
-          '活动专区1',
-          templateInfo.active1HeadImage,
-          templateInfo.active1BackgroundColor,
-        ],
-        4: [
-          '活动专区2左侧',
-          templateInfo.active2LeftHeadImage,
-          templateInfo.active2LeftBackgroundColor,
-        ],
-        5: [
-          '活动专区2右侧',
-          templateInfo.active2RightHeadImage,
-          templateInfo.active2RightBackgroundColor,
-        ],
-        6: [
-          '专场专区1',
-          templateInfo.only1HeadImage,
-          templateInfo.only1BackgroundColor,
-        ],
-        7: [
-          '专场专区2',
-          templateInfo.only2HeadImage,
-          templateInfo.only2BackgroundColor,
-        ],
-        8: [
-          '专场专区3',
-          templateInfo.only3HeadImage,
-          templateInfo.only3BackgroundColor,
-        ],
-        9: [
-          '专场专区4',
-          templateInfo.only4HeadImage,
-          templateInfo.only4BackgroundColor,
-        ],
-        10: [
-          '专题精选1',
-          templateInfo.topics1HeadImage,
-          templateInfo.topics1BackgroundColor,
-        ],
-        11: [
-          '专题精选2',
-          templateInfo.topics2HeadImage,
-          templateInfo.topics2BackgroundColor,
-        ],
-        12: [
-          '专题精选3',
-          templateInfo.topics3HeadImage,
-          templateInfo.topics3BackgroundColor,
-        ],
-        13: [
-          '底部广告图',
-          templateInfo.bottomBannerHeadImage,
-          templateInfo.bottomBannerBackgroundColor,
-        ],
-      };
-      console.log(this.type ? MAP[this.type] : ['', '', '']);
-      return this.type ? MAP[this.type] : ['', '', ''];
-    },
-    cuStyle() {
-      return `height:${this.CustomBar - this.StatusBar}px; padding-top:${
-        this.StatusBar
-      }px;`;
-    },
-  },
-
-  onShow() {
-    uni.$on('hanbleShare', () => {});
-  },
-
-  onHide() {
-    uni.$off('hanbleShare');
-  },
-
-  onLoad({ type }) {
-    // uni.setNavigationBarTitle({
-    // 　　title: cname
-    // })
-    this.type = type;
-    this.getGoodsList();
-  },
-
-  // 下拉刷新
-  onPullDownRefresh() {
-    this.pageNum = 1;
-    this.getGoodsList();
-  },
-
-  // 上拉加载
-  onReachBottom() {
-    this.getGoodsList(1);
-  },
-
-  methods: {
-    // 获取商品列表
-    getGoodsList(loadMore) {
-      if (this.noMore && loadMore) return;
-      this.noMore = false;
-      if (!loadMore) {
-        this.pageNum = 1;
-      } else {
-        this.loading = true;
-      }
-      this.$axios({
-        url: '/renovation/goods/list',
-        method: 'get',
-        params: {
-          pageNo: this.pageNum,
-          pageSize: this.pageSize,
-          type: this.type,
-          objId: uni.getStorageSync('templateInfo').companyWechatTemplateId,
-          sort: this.screenType,
-        },
-        isLoading: !loadMore,
-      }).then((res) => {
-        res.data.records.forEach((item) => {
-          if (item.logo && item.logoStartTime) {
-            item.isShowWater = this.$compareTime(
-              item.logoStartTime,
-              item.logoEndTime
-            );
-          } else {
-            item.isShowWater = false;
-          }
-        });
-        let _list = res.data.records;
-        let pageTotal = res.data.pages;
-        if (this.pageNum >= pageTotal) {
-          this.noMore = true;
-        }
-        if (_list.length) {
-          this.pageNum += 1;
-        }
-        if (loadMore) {
-          this.goodsList = this.goodsList.concat(_list);
-          this.loading = false;
-        } else {
-          this.goodsList = _list;
-        }
-        if (this.goodsList.length > 0) {
-          this.hasData = true;
-        } else {
-          this.hasData = false;
-        }
-
-        uni.stopPullDownRefresh();
-      });
-    },
-
-    // 切换筛选类型
-    changeScreen(type) {
-      if (type != 2) {
-        if (this.screenType !== type) {
-          this.screenType = type;
-        } else {
-          this.screenType = '';
-        }
-      } else {
-        if (this.screenType != 2 && this.screenType != 3) {
-          this.screenType = 2;
-        } else if (this.screenType == 2) {
-          this.screenType = 3;
-        } else {
-          this.screenType = '';
-        }
-      }
-      this.pageNum = 1;
-      this.getGoodsList();
-    },
-
-    toGoodsDetail(id) {
-      uni.navigateTo({
-        url: '/packageGoods/pages/detail?id=' + id,
-      });
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-.app-container {
-  box-sizing: border-box;
-  &.noBg {
-    background: #f4f2f2 !important;
-  }
-}
-.banner-container {
-  image {
-    width: 100%;
-    display: block;
-  }
-}
-.top-container {
-  position: sticky;
-  top: 0;
-  left: 0;
-  z-index: 99;
-  width: 100%;
-  background: #ffffff;
-  display: flex;
-  padding: 0 20rpx;
-  align-items: center;
-  box-sizing: border-box;
-  .tab {
-    flex: 1;
-    display: flex;
-    padding: 0 80rpx 0 30rpx;
-    box-sizing: border-box;
-    justify-content: space-between;
-    .item {
-      height: 88rpx;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      font-size: 30rpx;
-      color: #666666;
-      &.current {
-        color: #ff3f42;
-      }
-      image {
-        width: 18rpx;
-        height: 30rpx;
-        display: block;
-        margin-left: 10rpx;
-      }
-    }
-  }
-  .icon {
-    padding-right: 10rpx;
-    image {
-      width: 36rpx;
-      height: 36rpx;
-      display: block;
-    }
-  }
-}
-</style>
+<template>
+  <view
+    class="app-container"
+    :style="
+      'background:' + (pageConfig[2] && hasData ? pageConfig[2] : '#F5F5F5')
+    "
+  >
+    <view class="banner-container" v-if="pageConfig[1]">
+      <image :src="pageConfig[1]" mode="widthFix"></image>
+    </view>
+
+    <view class="top-container">
+      <view class="tab">
+        <view
+          class="item"
+          :class="screenType === 0 ? 'current' : ''"
+          @tap="changeScreen(0)"
+          >综合</view
+        >
+        <view
+          class="item"
+          :class="screenType === 1 ? 'current' : ''"
+          @tap="changeScreen(1)"
+          >销量</view
+        >
+        <view
+          class="item"
+          :class="screenType === 2 || screenType === 3 ? 'current' : ''"
+          @tap="changeScreen(2)"
+          >价格
+          <image
+            src="@/static/icon/price_1.png"
+            v-if="screenType === 2"
+          ></image>
+          <image
+            src="@/static/icon/price_2.png"
+            v-if="screenType === 3"
+          ></image>
+          <image
+            src="@/static/icon/price_0.png"
+            v-if="screenType != 2 && screenType != 3"
+          ></image>
+        </view>
+        <view
+          class="item"
+          :class="screenType === 4 ? 'current' : ''"
+          @tap="changeScreen(4)"
+          >上架时间</view
+        >
+      </view>
+      <view class="icon">
+        <image
+          src="@/static/icon/show_1.png"
+          v-if="showType == 1"
+          @tap="showType = 2"
+        ></image>
+        <image
+          src="@/static/icon/show_2.png"
+          v-if="showType == 2"
+          @tap="showType = 1"
+        ></image>
+      </view>
+    </view>
+
+    <view class="goods-waterfall-list" v-show="showType == 1">
+      <view class="left">
+        <block v-for="(item, index) in goodsList" :key="index">
+          <view
+            class="item"
+            v-if="index % 2 == 0"
+            @tap="toGoodsDetail(item.goodsId)"
+          >
+            <view class="image">
+              <image :src="item.imgUrl" mode="aspectFill" class="img"></image>
+              <image
+                :src="item.logo"
+                mode="aspectFill"
+                class="water"
+                v-if="item.isShowWater"
+              ></image>
+            </view>
+            <view class="content">
+              <view class="title ellipsis-2">{{ item.goodsName }}</view>
+              <view class="tags" v-if="item.tags1 && item.tags1.length > 0">
+                <view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{
+                  it
+                }}</view>
+              </view>
+              <view class="price">
+                <view class="price-1">¥{{ item.goodsPrice | numToFixed }}</view>
+                <view class="price-2"
+                  >¥{{ item.orgGoodsPrice | numToFixed }}</view
+                >
+              </view>
+              <view class="tags2" v-if="item.tags2 && item.tags2.length > 0">
+                <view class="it" v-for="(it, idx) in item.tags2" :key="idx">{{
+                  it
+                }}</view>
+              </view>
+              <view class="text">销量：{{ item.soldNum }}</view>
+            </view>
+          </view>
+        </block>
+      </view>
+      <view class="right">
+        <block v-for="(item, index) in goodsList" :key="index">
+          <view
+            class="item"
+            v-if="index % 2 == 1"
+            @tap="toGoodsDetail(item.goodsId)"
+          >
+            <view class="image">
+              <image :src="item.imgUrl" mode="aspectFill" class="img"></image>
+              <image
+                :src="item.logo"
+                mode="aspectFill"
+                class="water"
+                v-if="item.isShowWater"
+              ></image>
+            </view>
+            <view class="content">
+              <view class="title ellipsis-2">{{ item.goodsName }}</view>
+              <view class="tags" v-if="item.tags1 && item.tags1.length > 0">
+                <view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{
+                  it
+                }}</view>
+              </view>
+              <view class="price">
+                <view class="price-1">¥{{ item.goodsPrice | numToFixed }}</view>
+                <view class="price-2"
+                  >¥{{ item.orgGoodsPrice | numToFixed }}</view
+                >
+              </view>
+              <view class="tags2" v-if="item.tags2 && item.tags2.length > 0">
+                <view class="it" v-for="(it, idx) in item.tags2" :key="idx">{{
+                  it
+                }}</view>
+              </view>
+              <view class="text">销量：{{ item.soldNum }}</view>
+            </view>
+          </view>
+        </block>
+      </view>
+    </view>
+
+    <view class="goods-row-list" v-show="showType == 2">
+      <block v-for="(item, index) in goodsList" :key="index">
+        <view class="item" @tap="toGoodsDetail(item.goodsId)">
+          <view class="image">
+            <image :src="item.imgUrl" mode="aspectFill" class="img"></image>
+            <image
+              :src="item.logo"
+              mode="aspectFill"
+              class="water"
+              v-if="item.isShowWater"
+            ></image>
+          </view>
+          <view class="right">
+            <view>
+              <view class="title ellipsis-2">{{ item.goodsName }}</view>
+              <view class="tags" v-if="item.tags1 && item.tags1.length > 0">
+                <view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{
+                  it
+                }}</view>
+              </view>
+            </view>
+            <view>
+              <view class="bottom">
+                <view class="price">
+                  <view class="price-1"
+                    >¥{{ item.goodsPrice | numToFixed }}</view
+                  >
+                  <view class="price-2"
+                    >¥{{ item.orgGoodsPrice | numToFixed }}</view
+                  >
+                </view>
+                <view class="text">销量：{{ item.soldNum }}</view>
+              </view>
+            </view>
+          </view>
+        </view>
+      </block>
+    </view>
+
+    <no-data v-if="!goodsList.length" :showText="'暂无商品'"></no-data>
+    <loading-text
+      v-if="goodsList.length"
+      :loading="loading"
+      :noMore="noMore"
+    ></loading-text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      type: null,
+      screenType: '',
+      goodsList: [],
+      pageNum: 1,
+      pageSize: 8,
+      noMore: false,
+      loading: false,
+      showType: 1,
+      hasData: false,
+    };
+  },
+
+  computed: {
+    pageConfig() {
+      const templateInfo = uni.getStorageSync('templateInfo');
+      const MAP = {
+        2: [
+          '首页弹窗',
+          templateInfo.popupHeadImage,
+          templateInfo.popupBackgroundColor,
+        ],
+        3: [
+          '活动专区1',
+          templateInfo.active1HeadImage,
+          templateInfo.active1BackgroundColor,
+        ],
+        4: [
+          '活动专区2左侧',
+          templateInfo.active2LeftHeadImage,
+          templateInfo.active2LeftBackgroundColor,
+        ],
+        5: [
+          '活动专区2右侧',
+          templateInfo.active2RightHeadImage,
+          templateInfo.active2RightBackgroundColor,
+        ],
+        6: [
+          '专场专区1',
+          templateInfo.only1HeadImage,
+          templateInfo.only1BackgroundColor,
+        ],
+        7: [
+          '专场专区2',
+          templateInfo.only2HeadImage,
+          templateInfo.only2BackgroundColor,
+        ],
+        8: [
+          '专场专区3',
+          templateInfo.only3HeadImage,
+          templateInfo.only3BackgroundColor,
+        ],
+        9: [
+          '专场专区4',
+          templateInfo.only4HeadImage,
+          templateInfo.only4BackgroundColor,
+        ],
+        10: [
+          '专题精选1',
+          templateInfo.topics1HeadImage,
+          templateInfo.topics1BackgroundColor,
+        ],
+        11: [
+          '专题精选2',
+          templateInfo.topics2HeadImage,
+          templateInfo.topics2BackgroundColor,
+        ],
+        12: [
+          '专题精选3',
+          templateInfo.topics3HeadImage,
+          templateInfo.topics3BackgroundColor,
+        ],
+        13: [
+          '底部广告图',
+          templateInfo.bottomBannerHeadImage,
+          templateInfo.bottomBannerBackgroundColor,
+        ],
+      };
+      console.log(this.type ? MAP[this.type] : ['', '', '']);
+      return this.type ? MAP[this.type] : ['', '', ''];
+    },
+    cuStyle() {
+      return `height:${this.CustomBar - this.StatusBar}px; padding-top:${
+        this.StatusBar
+      }px;`;
+    },
+  },
+
+  onShow() {
+    uni.$on('hanbleShare', () => {});
+  },
+
+  onHide() {
+    uni.$off('hanbleShare');
+  },
+
+  onLoad({ type }) {
+    // uni.setNavigationBarTitle({
+    // 　　title: cname
+    // })
+    this.type = type;
+    this.getGoodsList();
+  },
+
+  // 下拉刷新
+  onPullDownRefresh() {
+    this.pageNum = 1;
+    this.getGoodsList();
+  },
+
+  // 上拉加载
+  onReachBottom() {
+    this.getGoodsList(1);
+  },
+
+  methods: {
+    // 获取商品列表
+    getGoodsList(loadMore) {
+      if (this.noMore && loadMore) return;
+      this.noMore = false;
+      if (!loadMore) {
+        this.pageNum = 1;
+      } else {
+        this.loading = true;
+      }
+      this.$axios({
+        url: '/renovation/goods/list',
+        method: 'get',
+        params: {
+          pageNo: this.pageNum,
+          pageSize: this.pageSize,
+          type: this.type,
+          objId: uni.getStorageSync('templateInfo').companyWechatTemplateId,
+          sort: this.screenType,
+        },
+        isLoading: !loadMore,
+      }).then((res) => {
+        res.data.records.forEach((item) => {
+          if (item.logo && item.logoStartTime) {
+            item.isShowWater = this.$compareTime(
+              item.logoStartTime,
+              item.logoEndTime
+            );
+          } else {
+            item.isShowWater = false;
+          }
+        });
+        let _list = res.data.records;
+        let pageTotal = res.data.pages;
+        if (this.pageNum >= pageTotal) {
+          this.noMore = true;
+        }
+        if (_list.length) {
+          this.pageNum += 1;
+        }
+        if (loadMore) {
+          this.goodsList = this.goodsList.concat(_list);
+          this.loading = false;
+        } else {
+          this.goodsList = _list;
+        }
+        if (this.goodsList.length > 0) {
+          this.hasData = true;
+        } else {
+          this.hasData = false;
+        }
+
+        uni.stopPullDownRefresh();
+      });
+    },
+
+    // 切换筛选类型
+    changeScreen(type) {
+      if (type != 2) {
+        if (this.screenType !== type) {
+          this.screenType = type;
+        } else {
+          this.screenType = '';
+        }
+      } else {
+        if (this.screenType != 2 && this.screenType != 3) {
+          this.screenType = 2;
+        } else if (this.screenType == 2) {
+          this.screenType = 3;
+        } else {
+          this.screenType = '';
+        }
+      }
+      this.pageNum = 1;
+      this.getGoodsList();
+    },
+
+    toGoodsDetail(id) {
+      uni.navigateTo({
+        url: '/packageGoods/pages/detail?id=' + id,
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.app-container {
+  box-sizing: border-box;
+  &.noBg {
+    background: #f4f2f2 !important;
+  }
+}
+.banner-container {
+  image {
+    width: 100%;
+    display: block;
+  }
+}
+.top-container {
+  position: sticky;
+  top: 0;
+  left: 0;
+  z-index: 99;
+  width: 100%;
+  background: #ffffff;
+  display: flex;
+  padding: 0 20rpx;
+  align-items: center;
+  box-sizing: border-box;
+  .tab {
+    flex: 1;
+    display: flex;
+    padding: 0 80rpx 0 30rpx;
+    box-sizing: border-box;
+    justify-content: space-between;
+    .item {
+      height: 88rpx;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      font-size: 30rpx;
+      color: #666666;
+      &.current {
+        color: #ff3f42;
+      }
+      image {
+        width: 18rpx;
+        height: 30rpx;
+        display: block;
+        margin-left: 10rpx;
+      }
+    }
+  }
+  .icon {
+    padding-right: 10rpx;
+    image {
+      width: 36rpx;
+      height: 36rpx;
+      display: block;
+    }
+  }
+}
+</style>

packageGoods/pages/coupon.vue

@@ -1,233 +1,233 @@
-<template>
-	<view class="app-container">
-		<view class="list-container">
-			<block v-for="(item, index) in couponList" :key='index'>
-				<view class="item" @tap="chooseCoupon(index, item.useableFlag)">
-					<view class="bg">
-						<image src="@/static/mine/coupon/bg_0.png" v-if="!item.useableFlag"></image>
-						<image src="@/static/mine/coupon/bg_1.png" v-if="item.useableFlag"></image>
-					</view>
-					<view class="content">
-						<view class="left">
-							<view class="price">{{item.couponValue}}<text>元</text></view>
-							<view class="text" v-if="item.couponType == 'SATISFY'">满{{item.orderAmount}}可用</view>
-						</view>
-						<view class="right">
-							<view class="main">
-								<view class="row1 ellipsis-2">{{item.couponName}}</view>
-								<view class="row2">
-									<view class="date">
-										<view>使用时间：</view>
-										<view>{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}</view>
-									</view>
-									<view class="button2" v-if="!item.useableFlag">不可用</view>
-									<view class="button" v-if="item.useableFlag">使用</view>
-								</view>
-							</view>
-						</view>
-					</view>
-				</view>
-			</block>
-		</view>
-		<no-data v-if="!couponList.length" :showText="'暂无可用优惠券'"></no-data>
-		
-		<view class="bottom-container">
-			<view class="button" @tap="noUseCoupon">不使用优惠券</view>
-		</view>
-	</view>
-</template>
-
-<script>
-	import {mapState} from 'vuex';
-	import EventBus from '@/utils/eventbus.js';
-	
-	export default {
-		data() {
-			return {
-				couponList: [],
-				orderAmount: 0,
-				goodsIds: [],
-			}
-		},
-		
-		computed:{
-			...mapState(['userInfo', 'isLogin', 'userId'])
-		},
-		
-		onLoad({orderAmount, goodsIds}) {
-			this.orderAmount = orderAmount;
-			this.goodsIds = JSON.parse(goodsIds);
-			this.getCouponList();
-		},
-		
-		methods: {
-			getCouponList() {
-				this.$axios({
-					url: '/coupon/list/useable',
-					method: 'get',
-					params: {
-						orderAmount: this.orderAmount,
-						goodsSpecIds: this.goodsIds.join(','),
-						userId: this.userId
-					},
-					isLoading: 1
-				}).then(res => {
-					this.couponList = res.data;
-				})
-			},
-			
-			// 选择优惠券
-			chooseCoupon(index, canUse) {
-				if(!canUse) {
-					return this.$toast('该优惠券不可用');
-				}
-				EventBus.$emit('chooseCoupon', this.couponList[index]);
-				uni.navigateBack({
-					delta: 1
-				})
-			},
-			
-			// 不使用优惠券
-			noUseCoupon() {
-				uni.$emit('chooseCoupon', '');
-				uni.navigateBack({
-					delta: 1
-				})
-			}
-		}
-	}
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #F4F2F2;
-		padding: 20rpx 20rpx 120rpx;
-		box-sizing: border-box;
-	}
-	.list-container {
-		.item {
-			position: relative;
-			margin-bottom: 20rpx;
-			.bg {
-				image {
-					width: 710rpx;
-					height: 160rpx;
-					display: block;
-				}
-			}
-			.content {
-				position: absolute;
-				left: 0;
-				top: 0;
-				width: 710rpx;
-				height: 160rpx;
-				display: flex;
-				align-items: center;
-				.left {
-					width: 240rpx;
-					display: flex;
-					align-items: center;
-					justify-content: center;
-					flex-direction: column;
-					.price {
-						font-size: 60rpx;
-						color: #FFFFFF;
-						text {
-							font-size: 28rpx;
-							margin-top: 20rpx;
-						}
-					}
-					.text {
-						color: #FFFFFF;
-						font-size: 28rpx;
-					}
-				}
-				.right {
-					display: flex;
-					align-items: center;
-					justify-content: space-between;
-					padding: 0 20rpx;
-					width: 470rpx;
-					height: 160rpx;
-					box-sizing: border-box;
-					.main {
-						width: 430rpx;
-						height: 160rpx;
-						padding: 16rpx 0;
-						box-sizing: border-box;
-						display: flex;
-						flex-direction: column;
-						justify-content: space-between;
-						.row1 {
-							font-size: 28rpx;
-							line-height: 32rpx;
-						}
-						.row2 {
-							display: flex;
-							justify-content: space-between;
-							align-items: center;
-							.date {
-								font-size: 24rpx;
-								color: #999999;
-								line-height: 28rpx;
-							}
-							.button {
-								width: 100rpx;
-								height: 40rpx;
-								text-align: center;
-								line-height: 40rpx;
-								border-radius: 40rpx;
-								border: 1px solid #FF3F42;
-								font-size: 24rpx;
-								color: #FF3F42;
-								flex-shrink: 0;
-							}
-							.button2 {
-								width: 100rpx;
-								height: 40rpx;
-								text-align: center;
-								line-height: 40rpx;
-								border-radius: 40rpx;
-								border: 1px solid #b0b0b0;
-								font-size: 24rpx;
-								color: #999999;
-								flex-shrink: 0;
-							}
-						}
-					}
-					.tag {
-						position: absolute;
-						right: 20rpx;
-						top: 10rpx;
-						image {
-							width: 80rpx;
-							height: 80rpx;
-						}
-					}
-				}
-			}
-		}
-	}
-	.bottom-container {
-		position: fixed;
-		bottom: 0;
-		left: 0;
-		width: 100%;
-		padding: 0 20rpx;
-		box-sizing: border-box;
-		background: #FFFFFF;
-		display: flex;
-		align-items: center;
-		height: 100rpx;
-		.button {
-			width: 100%;
-			height: 68rpx;
-			line-height: 68rpx;
-			border-radius: 68rpx;
-			text-align: center;
-			font-size: 28rpx;
-			color: #666666;
-			border: 1px solid #B0B0B0;
-		}
-	}
-</style>
+<template>
+	<view class="app-container">
+		<view class="list-container">
+			<block v-for="(item, index) in couponList" :key='index'>
+				<view class="item" @tap="chooseCoupon(index, item.useableFlag)">
+					<view class="bg">
+						<image src="@/static/mine/coupon/bg_0.png" v-if="!item.useableFlag"></image>
+						<image src="@/static/mine/coupon/bg_1.png" v-if="item.useableFlag"></image>
+					</view>
+					<view class="content">
+						<view class="left">
+							<view class="price">{{item.couponValue}}<text>元</text></view>
+							<view class="text" v-if="item.couponType == 'SATISFY'">满{{item.orderAmount}}可用</view>
+						</view>
+						<view class="right">
+							<view class="main">
+								<view class="row1 ellipsis-2">{{item.couponName}}</view>
+								<view class="row2">
+									<view class="date">
+										<view>使用时间：</view>
+										<view>{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}</view>
+									</view>
+									<view class="button2" v-if="!item.useableFlag">不可用</view>
+									<view class="button" v-if="item.useableFlag">使用</view>
+								</view>
+							</view>
+						</view>
+					</view>
+				</view>
+			</block>
+		</view>
+		<no-data v-if="!couponList.length" :showText="'暂无可用优惠券'"></no-data>
+		
+		<view class="bottom-container">
+			<view class="button" @tap="noUseCoupon">不使用优惠券</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import {mapState} from 'vuex';
+	import EventBus from '@/utils/eventbus.js';
+	
+	export default {
+		data() {
+			return {
+				couponList: [],
+				orderAmount: 0,
+				goodsIds: [],
+			}
+		},
+		
+		computed:{
+			...mapState(['userInfo', 'isLogin', 'userId'])
+		},
+		
+		onLoad({orderAmount, goodsIds}) {
+			this.orderAmount = orderAmount;
+			this.goodsIds = JSON.parse(goodsIds);
+			this.getCouponList();
+		},
+		
+		methods: {
+			getCouponList() {
+				this.$axios({
+					url: '/coupon/list/useable',
+					method: 'get',
+					params: {
+						orderAmount: this.orderAmount,
+						goodsSpecIds: this.goodsIds.join(','),
+						userId: this.userId
+					},
+					isLoading: 1
+				}).then(res => {
+					this.couponList = res.data;
+				})
+			},
+			
+			// 选择优惠券
+			chooseCoupon(index, canUse) {
+				if(!canUse) {
+					return this.$toast('该优惠券不可用');
+				}
+				EventBus.$emit('chooseCoupon', this.couponList[index]);
+				uni.navigateBack({
+					delta: 1
+				})
+			},
+			
+			// 不使用优惠券
+			noUseCoupon() {
+				EventBus.$emit('chooseCoupon', "");
+				uni.navigateBack({
+					delta: 1
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		padding: 20rpx 20rpx 120rpx;
+		box-sizing: border-box;
+	}
+	.list-container {
+		.item {
+			position: relative;
+			margin-bottom: 20rpx;
+			.bg {
+				image {
+					width: 710rpx;
+					height: 160rpx;
+					display: block;
+				}
+			}
+			.content {
+				position: absolute;
+				left: 0;
+				top: 0;
+				width: 710rpx;
+				height: 160rpx;
+				display: flex;
+				align-items: center;
+				.left {
+					width: 240rpx;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					flex-direction: column;
+					.price {
+						font-size: 60rpx;
+						color: #FFFFFF;
+						text {
+							font-size: 28rpx;
+							margin-top: 20rpx;
+						}
+					}
+					.text {
+						color: #FFFFFF;
+						font-size: 28rpx;
+					}
+				}
+				.right {
+					display: flex;
+					align-items: center;
+					justify-content: space-between;
+					padding: 0 20rpx;
+					width: 470rpx;
+					height: 160rpx;
+					box-sizing: border-box;
+					.main {
+						width: 430rpx;
+						height: 160rpx;
+						padding: 16rpx 0;
+						box-sizing: border-box;
+						display: flex;
+						flex-direction: column;
+						justify-content: space-between;
+						.row1 {
+							font-size: 28rpx;
+							line-height: 32rpx;
+						}
+						.row2 {
+							display: flex;
+							justify-content: space-between;
+							align-items: center;
+							.date {
+								font-size: 24rpx;
+								color: #999999;
+								line-height: 28rpx;
+							}
+							.button {
+								width: 100rpx;
+								height: 40rpx;
+								text-align: center;
+								line-height: 40rpx;
+								border-radius: 40rpx;
+								border: 1px solid #FF3F42;
+								font-size: 24rpx;
+								color: #FF3F42;
+								flex-shrink: 0;
+							}
+							.button2 {
+								width: 100rpx;
+								height: 40rpx;
+								text-align: center;
+								line-height: 40rpx;
+								border-radius: 40rpx;
+								border: 1px solid #b0b0b0;
+								font-size: 24rpx;
+								color: #999999;
+								flex-shrink: 0;
+							}
+						}
+					}
+					.tag {
+						position: absolute;
+						right: 20rpx;
+						top: 10rpx;
+						image {
+							width: 80rpx;
+							height: 80rpx;
+						}
+					}
+				}
+			}
+		}
+	}
+	.bottom-container {
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		width: 100%;
+		padding: 0 20rpx;
+		box-sizing: border-box;
+		background: #FFFFFF;
+		display: flex;
+		align-items: center;
+		height: 100rpx;
+		.button {
+			width: 100%;
+			height: 68rpx;
+			line-height: 68rpx;
+			border-radius: 68rpx;
+			text-align: center;
+			font-size: 28rpx;
+			color: #666666;
+			border: 1px solid #B0B0B0;
+		}
+	}
+</style>

packageGoods/pages/detail.vue

@@ -1,2075 +1,2097 @@
-<template>
-	<view class="app-container">
-		<view class="recommender-container" v-if="isGroupbuyGoods && !isHeadUser">
-			<view class="content">
-				<image :src="detail.groupPic"></image>
-				<view class="name ellipsis">{{ detail.groupUserName }}</view>
-				<view>向你推荐</view>
-			</view>
-		</view>
-
-		<!-- <no-data v-if="!isLoaded" :showText="'加载中'"></no-data> -->
-		<no-data v-if="isLoaded && noData" :showText="'该商品已失效'"></no-data>
-		<block v-if="isLoaded && !noData">
-			<view class="swiper-container">
-				<swiper @change="changeBanner">
-					<swiper-item v-if="detail.vedio">
-						<video id="video1" :src="detail.vedio" @play="playVideo" @pause="pauseVideo" controls loop
-							:enable-progress-gesture="false" :muted="isFixedVideo"></video>
-					</swiper-item>
-					<block v-for="(item, index) in bannerList" :key="index" v-if="bannerList.length > 0">
-						<swiper-item>
-							<!-- <image :src="item.url" mode="aspectFill" @tap="previewImage(item.url)" ></image> -->
-							<view class="image" @tap="previewImage(item.url)">
-								<image :src="item.url" mode="aspectFill" class="img"></image>
-								<image :src="detail.logo" mode="aspectFill" class="water"
-									v-if="isShowWater && index == 0"></image>
-							</view>
-						</swiper-item>
-					</block>
-				</swiper>
-				<view class="nums" v-show="(detail.vedio && bannerCurrent != 0) || !detail.vedio">
-					{{ bannerCurrent + 1 }}/{{
-            bannerList.length + (detail.vedio ? 1 : 0)
-          }}
-				</view>
-			</view>
-			<view class="video-container" :class="isFixedVideo ? 'isFixed' : ''">
-				<view class="content">
-					<view class="close" @tap="closeFixedVideo">
-						<image src="@/static/icon/close.png"></image>
-					</view>
-					<video id="video2" :src="detail.vedio" @error="videoErrorCallback" controls loop
-						:enable-progress-gesture="false"></video>
-				</view>
-			</view>
-			<view class="seckill-container" v-if="isSeckillGoods">
-				<view class="price">
-					<view class="price-1">¥{{ detail.goodsPrice | numToFixed }}</view>
-					<view class="price-2">¥{{ detail.orgGoodsPrice | numToFixed }}</view>
-				</view>
-				<view class="right">
-					<text>距结束还剩：</text>
-					<view class="time">
-						<text>{{ countdownTime[0] }}</text>时<text>{{ countdownTime[1] }}</text>分<text>{{ countdownTime[2] }}</text>秒
-					</view>
-				</view>
-				<view class="clock">
-					<image src="@/static/icon/clock.png"></image>
-				</view>
-			</view>
-			<view class="main-container">
-				<view class="title">{{ detail.goodsName }}</view>
-				<view class="des">{{
-          detail.describeText ? detail.describeText : ''
-        }}</view>
-				<view class="stock">
-					<block v-if="!isSeckillGoods">
-						<view class="left">
-							<text>剩余{{ detail.stock }}件</text>
-						</view>
-					</block>
-					<block v-if="isSeckillGoods">
-						<view class="left">
-							<text>剩余{{ detail.secStockNum }}件</text>
-							<view class="progress-box">
-								<progress :percent="(detail.secStockNum / detail.limitBuy) * 100" activeColor="#FF3F42"
-									active stroke-width="6" />
-							</view>
-						</view>
-						<view class="right" @tap="isOpen = !isOpen" v-if="
-                (isServiceUser && !isGroupbuyGoods) ||
-                (isHeadUser && isGroupbuyGoods)
-              ">
-							<text>{{ isOpen ? '收起' : '展开' }}</text>
-							<image :src="
-                  isOpen
-                    ? '../../static/icon/arrow_2.png'
-                    : '../../static/icon/arrow_1.png'
-                "></image>
-						</view>
-					</block>
-				</view>
-				<view class="price" v-if="!isSeckillGoods">
-					<view class="left">
-						<view class="price-1">¥{{ detail.goodsPrice | numToFixed }}</view>
-						<view class="price-2">¥{{ detail.orgGoodsPrice | numToFixed }}</view>
-					</view>
-					<view class="right" @tap="isOpen = !isOpen" v-if="
-              (isServiceUser && !isGroupbuyGoods) ||
-              (isHeadUser && isGroupbuyGoods)
-            ">
-						<text>{{ isOpen ? '收起' : '展开' }}</text>
-						<image :src="
-                isOpen
-                  ? '../../static/icon/arrow_2.png'
-                  : '../../static/icon/arrow_1.png'
-              "></image>
-					</view>
-				</view>
-				<view class="bottom" v-if="isOpen">
-					<view v-if="isHeadUser && isGroupbuyGoods">团长分佣金额</view>
-					<view v-else>分享可获得收益</view>
-					<view>￥{{ commission | numToFixed
-            }}{{ detail.goodsSpecs.length > 1 ? '起' : '' }}</view>
-				</view>
-			</view>
-			<view class="line-container">
-				<view v-if="
-            accountInfo.miniProgram &&
-            accountInfo.miniProgram.appId !== 'wxf89d330c7b0e718d'
-          ">运费：包邮</view>
-				<view>销量：<text>{{ detail.soldNum }}</text></view>
-			</view>
-
-			<view class="evaluate-container" v-if="evaluateList.length">
-				<view class="title">商品评价</view>
-				<view class="list">
-					<view class="item" :class="evaluateList.length === 1 ? 'onlyOne' : ''"
-						v-for="(item, index) in evaluateList">
-						<view class="top">
-							<view class="user">
-								<image :src="item.avatar" mode="aspectFill" v-if="item.avatar.indexOf('http') >= 0">
-								</image>
-								<image :src="imageUrl + item.avatar" mode="aspectFill" v-else></image>
-								<view class="name ellipsis">{{ item.userName }}</view>
-							</view>
-							<view class="date">{{ item.createTime }}</view>
-						</view>
-						<view class="rate">
-							<view class="it"><text>商品质量</text><uni-rate :size="14" :margin="4"
-									:value="item.commentGoods" color="#fff" active-color="#FE781F" :readonly="true" />
-							</view>
-							<view class="it"><text>服务质量</text><uni-rate :size="14" :margin="4"
-									:value="item.commentService" color="#fff" active-color="#FE781F" :readonly="true" />
-							</view>
-							<view class="it"><text>配送质量</text><uni-rate :size="14" :margin="4"
-									:value="item.commentExpress" color="#fff" active-color="#FE781F" :readonly="true" />
-							</view>
-						</view>
-						<view class="tags">
-							<view class="it" v-for="(it, idx) in item.tags">{{ it }}</view>
-						</view>
-						<view class="content">{{ item.content }}</view>
-						<view class="images" v-if="item.imgs && item.imgs.length > 0">
-							<image v-for="(it, idx) in item.imgs" :src="it" @tap="previewEvaluateImage(it, item.imgs)">
-							</image>
-						</view>
-					</view>
-				</view>
-				<view class="more">
-					<view class="btn" @tap="toAllEvaluate">查看全部评价</view>
-				</view>
-			</view>
-
-			<view class="detail-container">
-				<view class="title">商品详情</view>
-				<view class="content" v-if="detail.pubCommonTemplate">
-					<u-parse :content="detail.pubCommonTemplate.content"></u-parse>
-				</view>
-				<view class="content" v-if="detail.commonTemplate">
-					<u-parse :content="detail.commonTemplate.content"></u-parse>
-				</view>
-				<view class="content">
-					<u-parse :content="detail.content"></u-parse>
-				</view>
-			</view>
-			<view class="bottom-container">
-				<view class="left">
-					<view class="item" @tap="clickShare">
-						<image src="@/static/icon/share.png"></image>
-						<text>分享</text>
-					</view>
-					<view class="item" @tap="handleCollect" v-if="!isGroupbuyGoods && !isPackageGoods">
-						<block v-if="detail.favorite">
-							<image src="@/static/icon/collect2.png"></image>
-							<text>已收藏</text>
-						</block>
-						<block v-else>
-							<image src="@/static/icon/collect.png"></image>
-							<text>收藏</text>
-						</block>
-					</view>
-					<view class="item" @tap="toCart">
-						<image src="@/static/icon/cart2.png"></image>
-						<text>购物车</text>
-						<view class="dot" v-if="cartCount > 0">{{
-              cartCount <= 99 ? cartCount : '99+'
-            }}</view>
-					</view>
-				</view>
-				<view class="right" v-if="!isSeckillGoods && !isGroupbuyGoods && !isPackageGoods">
-					<view class="button cart" @tap="clickCartOrBuy(1)">加入购物车</view>
-					<view class="button buy" @tap="clickCartOrBuy(2)">立即购买</view>
-				</view>
-				<view class="right" v-if="!isSeckillGoods && isGroupbuyGoods">
-					<view class="button cart" @tap="clickCartOrBuy(1)">加入购物车</view>
-					<view class="button buy" @tap="clickCartOrBuy(4)">立即拼团</view>
-				</view>
-				<view class="right" v-if="isSeckillGoods">
-					<view class="button cart" @tap="clickCartOrBuy(1)">加入购物车</view>
-					<view class="button buy" @tap="clickCartOrBuy(3)">马上抢购</view>
-				</view>
-				<view class="right" v-if="isPackageGoods">
-					<view class="button buy" @tap="clickPackageBuy()">立即购买</view>
-				</view>
-			</view>
-
-			<u-popup :round="10" :closeable="true" :show="isBuyDialog" @close="isBuyDialog = false">
-				<view class="cart-container">
-					<view class="main">
-						<image :src="specList[specCurrent].imgUrl"></image>
-						<view class="right">
-							<view class="title ellipsis-2">{{ detail.goodsName }}</view>
-							<block v-if="isGroupbuyGoods">
-								<view class="price">
-									<view class="price-1">¥{{ specList[specCurrent].price }}</view>
-									<view class="price-2">¥{{ specList[specCurrent].orgPrice }}</view>
-								</view>
-								<view class="stock">剩余{{ specList[specCurrent].stockNum }}件</view>
-							</block>
-							<block v-else-if="isSeckillGoods">
-								<view class="price">
-									<view class="price-1">¥{{ specList[specCurrent].secPrice }}</view>
-									<view class="price-2">¥{{ specList[specCurrent].price }}</view>
-								</view>
-								<view class="stock">剩余{{ detail.secStockNum }}件</view>
-							</block>
-							<block v-else>
-								<view class="price">
-									<view class="price-1">¥{{ specList[specCurrent].price }}</view>
-									<view class="price-2">¥{{ detail.orgGoodsPrice }}</view>
-								</view>
-								<view class="stock">剩余{{ specList[specCurrent].stockNum }}件</view>
-							</block>
-						</view>
-					</view>
-					<view class="attr">
-						<view class="title">已选属性</view>
-						<view class="list">
-							<block v-for="(item, index) in specList" :key="index">
-								<view class="item" @tap="changeSpec(index)"
-									:class="specCurrent == index ? 'current' : ''">{{ item.name }}-{{ item.specValue }}
-								</view>
-							</block>
-						</view>
-					</view>
-					<view class="num">
-						<view class="title">购买数量</view>
-						<u-number-box v-model="buyNum" :min="1" :buttonSize="26" iconStyle="font-size: 12px;">
-						</u-number-box>
-					</view>
-					<view class="button" v-if="dialogType == 1" @tap="addToCart">加入购物车</view>
-					<view class="button" v-if="dialogType == 2" @tap="nowBuy">立即购买</view>
-					<view class="button" v-if="dialogType == 3" @tap="rushBuy">马上抢购</view>
-					<view class="button" v-if="dialogType == 4" @tap="nowBuy">马上拼团</view>
-				</view>
-			</u-popup>
-
-			<u-popup :round="10" :closeable="false" :show="isShareDialog" @close="isShareDialog = false">
-				<view class="sharelist-container">
-					<button class="item" open-type="share" @tap="isShareDialog = false">
-						<image src="@/static/icon/wechat.png"></image>
-						<text>分享给微信好友</text>
-					</button>
-
-					<view class="item" @tap="markImage">
-						<image src="@/static/icon/image.png"></image>
-						<text>生成图片分享</text>
-					</view>
-				</view>
-			</u-popup>
-
-			<view class="global-mask" v-show="isShowCanvas" @tap="closeCanvas"></view>
-			<view class="canvas-container" v-show="isShowCanvas">
-				<view class="content">
-					<canvas style="width: 300px; height: 520px" canvas-id="myCanvas" id="myCanvas"></canvas>
-				</view>
-				<view class="button"><text @tap="saveImage">保存图片</text></view>
-			</view>
-
-			<u-popup :round="10" :closeable="true" :show="isPackageDialog" @close="isPackageDialog = false">
-				<view class="package-container">
-					<view class="main">
-						<view class="group" v-for="(item, index) in packageList" :key="index">
-							<view class="title">请选择商品{{ item.num }}件</view>
-							<view class="goods-list">
-								<view class="item" v-for="(it, idx) in item.goodsList" :key="idx">
-									<image :src="it.imgUrl"></image>
-									<view class="right">
-										<view class="name ellipsis-2">{{ it.goodsName }}</view>
-										<view class="des">{{ it.specValue }}</view>
-										<view class="bottom">
-											<view class="price">
-												<view class="price-1">¥{{ it.price | numToFixed }}</view>
-												<view class="price-2">¥{{ it.orgPrice | numToFixed }}</view>
-											</view>
-
-											<u-number-box v-model="it.num" :min="0" :max="it.limitNum" :buttonSize="26"
-												iconStyle="font-size: 12px;">
-											</u-number-box>
-										</view>
-									</view>
-								</view>
-							</view>
-						</view>
-					</view>
-					<view class="button" @tap="packageBuy()">立即购买</view>
-				</view>
-			</u-popup>
-
-			<u-popup :round="10" :show="isShowPhoneDialog">
-				<view class="phone-dialog">
-					<view class="content">
-						<view>申请获取以下权限</view>
-						<text>获得你的公开信息(手机号码)</text>
-					</view>
-					<view class="btn">
-						<button @tap="isShowPhoneDialog = false">取消</button>
-						<button type="primary" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
-							确定授权
-						</button>
-					</view>
-				</view>
-			</u-popup>
-		</block>
-
-		<canvas style="
-        width: 800px;
-        height: 800px;
-        z-index: -1;
-        position: fixed;
-        bottom: -1000px;
-        right: -1000px;
-      " canvas-id="myCanvas22" id="myCanvas22"></canvas>
-	</view>
-</template>
-
-<script>
-	import {
-		mapState
-	} from 'vuex';
-	import {
-		base64src
-	} from '@/utils/base.js';
-	import {
-		appId
-	} from '@/utils/config.js';
-	import {
-		uploadImg
-	} from '@/api/axios.js';
-	export default {
-		data() {
-			return {
-				isShowPhoneDialog: false,
-				imageUrl: this.$imageUrl,
-				configInfo: uni.getStorageSync('configInfo'),
-				isLoaded: false,
-				noData: true,
-				goodsId: null, // 商品id
-				detail: {}, // 商品详情
-				commission: 0, // 分佣金额
-				bannerList: [], // 轮播图列表
-				bannerCurrent: 0, // 轮播图当前值
-				specList: [], // 规格列表
-				specCurrent: 0, // 规格当前值
-				isOpen: false, // 是否展开
-				isBuyDialog: false, // 是否显示购买/加入购物车弹窗
-				dialogType: 1, // 弹窗类型: 1加入购物车，2立即购买，3秒杀抢购
-				isShareDialog: false, // 是否显示分享弹窗
-				isShowCanvas: false, // 是否显示海报弹窗
-				buyNum: 1, // 购买/加入购物车 数量
-				isSeckillGoods: false, // 是否秒杀商品
-				isGroupbuyGoods: false, // 是否团购商品
-				isPackageGoods: false, // 是否套购商品
-				isPackageDialog: false, // 是否显示套购购买弹窗
-				packageList: [], // 套购选择列表
-				cartCount: 0, // 购物车内商品数
-				isFinishCanvas: false, // 是否已完成海报
-				codeUrl: '', // 商品码
-				videoContext1: '', // 视频对象
-				videoContext2: '', // 视频对象
-				isFixedVideo: false, // 是否显示视频弹窗
-				isPlayVideo: false, // 视频是否播放中
-				isCloseMyself: false, // 是否亲自关闭视频弹窗
-				countdownTime: '', // 倒计时
-				endHour: 0, // 倒计时结束时间
-				evaluateList: [],
-				isShowWater: false,
-				accountInfo: {},
-			};
-		},
-		computed: {
-			...mapState(['userInfo', 'isLogin', 'userId']),
-
-			isHeadUser() {
-				// 是否团长
-				return this.userInfo.promotionGroupLeader;
-			},
-			isServiceUser() {
-				// 是否业务员
-				return this.userInfo.type === 'SERVICE';
-			},
-		},
-		watch: {
-			countdownTime() {
-				if (
-					this.countdownTime[0] == 0 &&
-					this.countdownTime[1] == 0 &&
-					this.countdownTime[2] == 0
-				) {
-					this.getDetail();
-				}
-			},
-		},
-		onPageScroll(res) {
-			if (
-				res.scrollTop > 300 &&
-				this.isPlayVideo &&
-				!this.isCloseMyself &&
-				this.detail.vedio
-			) {
-				this.isFixedVideo = true;
-				this.videoContext2.play();
-			} else {
-				this.isFixedVideo = false;
-				this.videoContext2.pause();
-			}
-			if (res.scrollTop < 300) {
-				this.isCloseMyself = false;
-			}
-		},
-		onLoad({
-			id
-		}) {
-			this.accountInfo = uni.getAccountInfoSync();
-			this.goodsId = id;
-			this.getDetail();
-			this.getEvaluateList();
-			this.getCartCount();
-			uni.showLoading({
-				title: '加载中',
-			});
-		},
-		onShow() {
-			this.isBuyDialog = false;
-		},
-		onReady() {
-			this.videoContext1 = uni.createVideoContext('video1');
-			this.videoContext2 = uni.createVideoContext('video2');
-		},
-		async onShareAppMessage(options) {
-			if (options && options.from == 'button') {
-				// 来自页面内的转发按钮
-			} else {
-				// 点击微信右上角的分享按钮
-			}
-			return {
-				title: '分享商品「' + this.detail.goodsName + '」',
-				imageUrl: await this.markImage222(),
-				path: '/pages/index/index?goodsId=' +
-					this.goodsId +
-					'&serviceId=' +
-					this.userId,
-				query: {
-					// id: this.goodsId,
-				},
-				success: function(res) {
-					if (res.errMsg == 'shareAppMessage:ok') {
-						this.$successToast('分享完成');
-					}
-				},
-			};
-		},
-		methods: {
-			// 获取手机号
-			getPhoneNumber(e) {
-				if (e?.detail?.iv && e?.detail?.encryptedData) {
-					this.$axios({
-						url: '/user/mobile/grant',
-						params: {
-							userId: this.userId,
-							iv: e.detail.iv,
-							encryptedData: e.detail.encryptedData,
-						},
-					}).then((res) => {
-						uni.setStorageSync('token', res.data.token);
-						uni.setStorageSync('isActiveLogout', false);
-						this.isShowPhoneDialog = false;
-						this.$getUserInfo();
-					});
-				}
-			},
-			// 获取详情
-			getDetail() {
-				this.$axios({
-						url: '/goods/detail',
-						method: 'get',
-						params: {
-							goodsId: this.goodsId,
-							userId: this.userId,
-						},
-					})
-					.then((res) => {
-						this.detail = res.data;
-						this.noData = false;
-						this.isLoaded = true;
-						// 团购
-						this.isGroupbuyGoods = res.data.promotionGroup;
-						// 秒杀
-						this.isSeckillGoods = res.data.secType;
-						this.endHour = res.data.endHour;
-						this.countTime();
-						// 套购
-						this.isPackageGoods = res.data.goodsType === 'PACKAGE';
-
-						this.bannerList = res.data.images;
-						this.specList = res.data.goodsSpecs;
-						this.specCurrent = 0;
-
-						if (!this.isPackageGoods) {
-							let commissionList = [];
-							this.specList.forEach((item, index) => {
-								item.price = item.price.toFixed(2);
-								item.orgPrice = item.orgPrice.toFixed(2);
-								commissionList.push(item.shareAmount);
-							});
-							this.commission = Math.min(...commissionList);
-						} else {
-							this.commission = res.data.shareAmount;
-						}
-
-						// 水印
-						if (res.data.logo && res.data.logoStartTime) {
-							this.isShowWater = this.$compareTime(
-								res.data.logoStartTime,
-								res.data.logoEndTime
-							);
-						} else {
-							this.isShowWater = false;
-						}
-						this.markImage222(false);
-					})
-					.catch((res) => {
-						this.noData = true;
-						this.isLoaded = true;
-					})
-					.finally((res) => {
-						uni.hideLoading();
-					});
-			},
-
-			// 获取评价列表
-			getEvaluateList() {
-				this.$axios({
-					url: '/order/comment/goods',
-					method: 'get',
-					params: {
-						pageNo: 1,
-						pageSize: 5,
-						goodsId: this.goodsId,
-					},
-				}).then((res) => {
-					this.evaluateList = res.data.records;
-				});
-			},
-
-			// 查询结束时间
-			checkEndTime(val) {
-				let yy = new Date().getFullYear();
-				let mm = new Date().getMonth() + 1;
-				let dd = new Date().getDate();
-				// dd = val == 10 ? dd + 1 : dd;
-
-				// 每月有多少天
-				let days = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
-				if ((yy % 4 == 0 && yy % 100 != 0) || yy % 400 == 0) {
-					days[1] = 29;
-				}
-
-				// 如果结束时间=10（表示第二天10点），dd需加一天
-				if (val == 10) {
-					if (dd >= days[mm - 1]) {
-						mm = mm + 1;
-					} else {
-						dd = dd + 1;
-					}
-				}
-
-				let date = yy + '/' + mm + '/' + dd;
-				let dateTime = date + ' ' + val + ':00:00';
-				return dateTime;
-			},
-
-			// 计算倒计时
-			countTime() {
-				let endDateTime = this.checkEndTime(this.endHour);
-				var nowtime = new Date(), //获取当前时间
-					endtime = new Date(endDateTime); //定义结束时间
-				var lefttime = endtime.getTime() - nowtime.getTime(), //距离结束时间的毫秒数
-					hh = Math.floor(lefttime / (1000 * 60 * 60)), //计算小时数
-					mm = Math.floor((lefttime / (1000 * 60)) % 60), //计算分钟数
-					ss = Math.floor((lefttime / 1000) % 60); //计算秒数
-				function checkTime(i) {
-					if (i < 10) {
-						i = '0' + i;
-					}
-					return i;
-				}
-				setTimeout(() => {
-					this.countTime();
-				}, 1000);
-				this.countdownTime = [checkTime(hh), checkTime(mm), checkTime(ss)];
-			},
-
-			// 获取商品二维码
-			getGoodsCode(success) {
-				const that = this;
-				this.$axios({
-					url: '/goods/qrcode',
-					method: 'get',
-					params: {
-						goodsId: this.goodsId,
-						userId: this.userId,
-					},
-				}).then((res) => {
-					// this.codeUrl = 'data:image/jpeg;base64,' + res.data;
-					that.codeUrl = res.data;
-					console.log(this.codeUrl, typeof success);
-					if (typeof success === 'function') {
-						success();
-					}
-				});
-			},
-
-			// 视频播放
-			playVideo(e) {
-				this.isPlayVideo = true;
-			},
-
-			// 视频暂停
-			pauseVideo(e) {
-				this.isPlayVideo = false;
-			},
-
-			// 关闭视频弹窗
-			closeFixedVideo() {
-				this.isFixedVideo = false;
-				this.isCloseMyself = true;
-				this.videoContext2.pause();
-			},
-
-			// 从个人信息获取购物车商品数量
-			getCartCount() {
-				this.$axios({
-					url: '/user/user/detail',
-					method: 'get',
-					params: {
-						userId: this.userId,
-					},
-				}).then((res) => {
-					this.cartCount = res.data.shoppingCartNums;
-
-					if (!res.data.openId) {
-						return uni.navigateTo({
-							url: '/pages/login/index?isNotOpenid=' + true,
-						});
-					}
-				});
-			},
-
-			// 查看所有评价
-			toAllEvaluate() {
-				uni.navigateTo({
-					url: '/packageGoods/pages/evaluate?goodsId=' + this.goodsId,
-				});
-			},
-
-			// 收藏/取消收藏
-			handleCollect() {
-				if (!this.isLogin) {
-					return uni.navigateTo({
-						url: '/pages/login/index',
-					});
-				}
-				if (!this.detail.favorite) {
-					this.$axios({
-						url: '/goods/favorite/add',
-						params: {
-							goodsId: this.goodsId,
-							userId: this.userId,
-						},
-					}).then((res) => {
-						this.$successToast('收藏成功');
-						this.getDetail();
-					});
-				} else {
-					this.$axios({
-						url: '/goods/favorite/detail/del',
-						params: {
-							goodsId: this.goodsId,
-							userId: this.userId,
-						},
-					}).then((res) => {
-						this.$successToast('取消收藏成功');
-						this.getDetail();
-					});
-				}
-			},
-
-			// 切换图片
-			changeBanner(e) {
-				this.bannerCurrent = e.detail.current;
-				if (this.bannerCurrent > 0 && this.detail.vedio) {
-					this.videoContext1.pause();
-				}
-			},
-
-			// 预览图片
-			previewImage(url) {
-				let imgs = [];
-				this.bannerList.forEach((item, index) => {
-					imgs.push(item.url);
-				});
-				uni.previewImage({
-					urls: imgs,
-					current: url,
-				});
-			},
-
-			// 预览评价图片
-			previewEvaluateImage(url, imgs) {
-				uni.previewImage({
-					urls: imgs,
-					current: url,
-				});
-			},
-
-			// 点击分享
-			clickShare() {
-				if (!this.isLogin) {
-					return uni.navigateTo({
-						url: '/pages/login/index',
-					});
-				}
-				// this.getGoodsCode();
-				this.isShareDialog = true;
-			},
-
-			// 点击加入购物车/立即购买
-			clickCartOrBuy(type) {
-				if (!this.isLogin) {
-					return uni.navigateTo({
-						url: '/pages/login/index',
-					});
-				}
-				this.dialogType = type;
-				this.isBuyDialog = true;
-			},
-
-			// 切换规格
-			changeSpec(index) {
-				this.specCurrent = index;
-			},
-
-			// 加入购物车
-			addToCart() {
-				if (this.specList[this.specCurrent].stockNum == 0) {
-					return this.$toast('该规格库存不足');
-				}
-				this.$axios({
-					url: '/shpping/cart/add/one',
-					type: 'application/json',
-					params: {
-						userId: this.userId,
-						buyGoods: [{
-							goodsId: this.goodsId,
-							goodsSpecId: this.specList[this.specCurrent].goodsSpecId,
-							num: this.buyNum,
-							secKillId: this.detail.secKillId || '',
-							promotionGroupId: this.detail.promotionGroupId || '',
-						}, ],
-					},
-					isLoading: 1,
-				}).then((res) => {
-					this.$successToast('添加成功');
-					this.getCartCount();
-					this.isBuyDialog = false;
-				});
-			},
-
-			// 立即购买
-			nowBuy() {
-				if (this.specList[this.specCurrent].stockNum == 0) {
-					return this.$toast('该规格库存不足');
-				}
-				if (!this.userInfo.mobile) {
-					this.isShowPhoneDialog = true;
-					return;
-				}
-				let buyList = [{
-					goodsId: this.goodsId,
-					goodsSpecId: this.specList[this.specCurrent].goodsSpecId,
-					num: this.buyNum,
-					secKillId: this.detail.secKillId || '',
-					promotionGroupId: this.detail.promotionGroupId || '',
-				}, ];
-				let url = '/packageGoods/pages/order?buyList=' + JSON.stringify(buyList);
-				if (this.detail.promotionGroupId) {
-					url = url + '&groupbuyId=' + this.detail.promotionGroupId;
-				}
-				uni.navigateTo({
-					url,
-				});
-			},
-
-			// 马上抢购（秒杀）
-			rushBuy() {
-				if (this.detail.secStockNum == 0) {
-					return this.$toast('该规格库存不足');
-				}
-				if (!this.userInfo.mobile) {
-					this.isShowPhoneDialog = true;
-					return;
-				}
-				this.$axios({
-					url: '/goods/sec/kill/start',
-					method: 'post',
-					params: {
-						secKillId: this.detail.secKillId,
-					},
-				}).then((res) => {
-					if (res.data) {
-						let buyList = [{
-							goodsId: this.goodsId,
-							goodsSpecId: this.specList[this.specCurrent].goodsSpecId,
-							num: this.buyNum,
-							secKillId: this.detail.secKillId || '',
-							promotionGroupId: this.detail.promotionGroupId || '',
-						}, ];
-						uni.navigateTo({
-							url: '/packageGoods/pages/order?buyList=' +
-								JSON.stringify(buyList) +
-								'&secKillId=' +
-								this.detail.secKillId +
-								'&secKillSpecId=' +
-								this.detail.secKillSpecId +
-								'&secToken=' +
-								res.data,
-						});
-					} else {
-						this.$toast('活动异常');
-					}
-				});
-			},
-
-			// 去购物车页面
-			toCart() {
-				uni.switchTab({
-					url: '/pages/cart/index',
-				});
-			},
-
-			// 打开套购购买弹窗
-			clickPackageBuy() {
-				this.packageList = [];
-				this.$axios({
-					url: '/goods/package/choice',
-					method: 'get',
-					params: {
-						goodsId: this.goodsId,
-					},
-				}).then((res) => {
-					let goodsList = res.data;
-					for (let i = 0; i < goodsList.length; i++) {
-						for (let j = 0; j < goodsList[i].length; j++) {
-							goodsList[i][j].num = 0;
-						}
-					}
-					let pops = this.detail.packagePop.split(':');
-					pops.forEach((item, index) => {
-						this.packageList.push({
-							num: item,
-							goodsList: goodsList[index],
-						});
-					});
-					console.log(this.packageList);
-					this.isPackageDialog = true;
-				});
-			},
-
-			// 套购购买
-			packageBuy() {
-				if (!this.userInfo.mobile) {
-					this.isShowPhoneDialog = true;
-					return;
-				}
-				let buyList = [];
-				for (let i = 0; i < this.packageList.length; i++) {
-					for (let j = 0; j < this.packageList[i].goodsList.length; j++) {
-						if (this.packageList[i].goodsList[j].num > 0) {
-							buyList.push({
-								goodsId: this.packageList[i].goodsList[j].goodsId,
-								goodsSpecId: this.packageList[i].goodsList[j].goodsSpecId,
-								popType: this.packageList[i].goodsList[j].type,
-								num: this.packageList[i].goodsList[j].num,
-							});
-						}
-					}
-				}
-				uni.navigateTo({
-					url: '/packageGoods/pages/order?buyList=' +
-						JSON.stringify(buyList) +
-						'&packageId=' +
-						this.detail.goodsId,
-				});
-			},
-
-			// 分享
-			share() {
-				uni.share({
-					provider: 'weixin',
-					scene: 'WXSceneSession',
-					type: 5,
-					summary: '我正在使用HBuilderX开发uni-app，赶紧跟我一起来体验！',
-					success: function(res) {
-						console.log('success:' + JSON.stringify(res));
-					},
-					fail: function(err) {
-						console.log('fail:' + JSON.stringify(err));
-					},
-				});
-			},
-
-			async markImage222(bool = true) {
-				return new Promise((r) => {
-					if (
-						this.detail.logo &&
-						this.detail.imgUrl &&
-						this.$compareTime(this.detail.logoStartTime, this.detail.logoEndTime)
-					) {
-						if (!!this.detail.mergeImage) {
-							r(this.detail.mergeImage);
-						} else {
-							if (bool) {
-								uni.showLoading({
-									title: '图片生成中',
-								});
-							}
-							this.getGoodsCode(() => {
-								let img = this.detail.imgUrl;
-								let logo = this.detail.logo;
-								var ctx = uni.createCanvasContext('myCanvas22');
-								ctx.rect(0, 0, 800, 800);
-								ctx.setFillStyle('#FFFFFF');
-								ctx.fill();
-								ctx.stroke();
-								uni.downloadFile({
-									url: img,
-									success: (res) => {
-										ctx.drawImage(res.tempFilePath, 0, 0, 800, 800);
-										uni.downloadFile({
-											url: logo,
-											success: (res2) => {
-												ctx.drawImage(res2
-													.tempFilePath, 0, 0,
-													800, 800);
-												ctx.draw();
-												uni.canvasToTempFilePath({
-													x: 0,
-													y: 0,
-													width: 800,
-													height: 800,
-													canvasId: 'myCanvas22',
-													success: (
-														res33) => {
-														uploadImg({
-																path: res33
-																	.tempFilePath,
-															})
-															.then((
-																data
-																) => {
-																this.$axios({
-																		url: '/goods/update/mergeImage',
-																		method: 'post',
-																		params: {
-																			goodsId: this
-																				.goodsId,
-																			imgUrl: data
-																				.url,
-																		},
-																	})
-																	.then(
-																		(
-																			res
-																			) => {
-																			if (
-																				bool
-																				) {
-																				uni
-																					.hideLoading();
-																				this
-																					.getDetail();
-																			}
-																			r(res
-																				.data
-																				);
-																		}
-																	);
-															});
-													},
-												});
-											},
-										});
-									},
-								});
-							});
-						}
-					} else {
-						r(this.detail.imgUrl);
-					}
-				});
-			},
-
-			// 生成图片
-			markImage() {
-				this.isShareDialog = false;
-				this.isShowCanvas = true;
-
-				if (this.isFinishCanvas) {
-					return false;
-				}
-
-				uni.showLoading({
-					title: '海报生成中',
-				});
-
-				// 调用获取二维图接口后执行匿名函数
-				this.getGoodsCode(() => {
-					let img = this.detail.imgUrl;
-					let logo = this.detail.logo;
-					let title = this.detail.goodsName;
-					let des = this.detail.describeText;
-					let price1 = this.detail.goodsPrice;
-					let price2 = this.detail.orgGoodsPrice;
-					let sales = this.detail.soldNum;
-					// let code = this.codeUrl;
-					// base64src(this.codeUrl , resCurrent => {
-					// 	code = resCurrent;
-					// })
-
-					var ctx = uni.createCanvasContext('myCanvas');
-
-					/**
-					 * @param {Object} str 要绘制的字符串
-					 * @param {Number} initX 绘制字符串起始x坐标
-					 * @param {Number} initY 绘制字符串起始y坐标
-					 * @param {Number} lineHeight 字行高
-					 */
-					function canvasTextAutoLine(str, initX, initY, lineHeight) {
-						var lineWidth = 0;
-						var canvasWidth = 260;
-						var lastSubStrIndex = 0;
-						var lineNum = 0;
-						var state = true;
-						for (let i = 0; i < str.length; i++) {
-							lineWidth += ctx.measureText(str[i]).width;
-							if (lineWidth > canvasWidth && lineNum < 1) {
-								ctx.fillText(str.substring(lastSubStrIndex, i), initX, initY);
-								initY += lineHeight;
-								lineWidth = 0;
-								lastSubStrIndex = i;
-								lineNum++;
-							} else if (lineWidth > canvasWidth && lineNum < 2) {
-								ctx.fillText(
-									str.substring(lastSubStrIndex + 2, i) + '...',
-									initX,
-									initY
-								);
-								lineNum++;
-								state = false;
-							}
-							if (i == str.length - 1 && state) {
-								ctx.fillText(str.substring(lastSubStrIndex, i + 1), initX, initY);
-							}
-						}
-					}
-
-					// 白色背景
-					ctx.rect(0, 0, 300, 520);
-					ctx.setFillStyle('#FFFFFF');
-					ctx.fill();
-					ctx.stroke();
-
-					// 商品名称
-					ctx.setFontSize(14);
-					ctx.setFillStyle('#333333');
-					canvasTextAutoLine(title, 20, 300, 18);
-
-					// 商品描述
-					if (des) {
-						ctx.setFontSize(12);
-						ctx.setFillStyle('#999999');
-						canvasTextAutoLine(des, 20, 336, 16);
-					}
-
-					// 现价
-					ctx.setFontSize(16);
-					ctx.setFillStyle('#FF3F42');
-					ctx.fillText('¥' + price1, 20, 380);
-
-					// 原价
-					ctx.setFontSize(13);
-					ctx.setFillStyle('#666666');
-					ctx.fillText('¥' + price2, 20, 396);
-					ctx.setStrokeStyle('#666666');
-					ctx.moveTo(20, 392);
-					ctx.lineTo(ctx.measureText('¥' + price2).width + 20, 392);
-					ctx.stroke();
-
-					// 销量
-					ctx.setFontSize(12);
-					ctx.setFillStyle('#666666');
-					ctx.fillText(
-						'销量：' + sales,
-						260 - ctx.measureText('销量：' + sales).width + 20,
-						380
-					);
-
-					// 二维码
-					// ctx.drawImage(code, 110, 404, 80, 80)
-
-					// 提示
-					ctx.setFontSize(12);
-					ctx.setFillStyle('#FE781F');
-					ctx.fillText('打开微信扫描识别查看商品', 78, 500);
-					// 图片
-					uni.downloadFile({
-						url: img,
-						success: (res) => {
-							ctx.drawImage(res.tempFilePath, 20, 20, 260, 260);
-							// 二维码
-							uni.downloadFile({
-								url: this.codeUrl,
-								success: (res) => {
-									ctx.drawImage(res.tempFilePath, 110, 404, 80, 80);
-									if (this.isShowWater) {
-										uni.downloadFile({
-											url: logo,
-											success: (res2) => {
-												ctx.drawImage(res2
-													.tempFilePath, 20, 20,
-													260, 260);
-												ctx.draw();
-												uni.hideLoading();
-												this.isFinishCanvas = true;
-											},
-										});
-									} else {
-										console.log('生成画布成功');
-										ctx.draw();
-										uni.hideLoading();
-										this.isFinishCanvas = true;
-									}
-								},
-							});
-						},
-					});
-				});
-			},
-
-			// 保存图片
-			saveImage() {
-				let that = this;
-				uni.canvasToTempFilePath({
-					x: 0,
-					y: 0,
-					width: 300,
-					height: 520,
-					canvasId: 'myCanvas',
-					success: function(res) {
-						uni.saveImageToPhotosAlbum({
-							filePath: res.tempFilePath,
-							success: function() {
-								that.$successToast('保存成功');
-							},
-						});
-					},
-				});
-			},
-
-			// 关闭canvas
-			closeCanvas() {
-				this.isShowCanvas = false;
-				uni.hideLoading();
-			},
-		},
-	};
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #f4f2f2;
-		box-sizing: border-box;
-		padding-bottom: 100rpx;
-	}
-
-	.recommender-container {
-		position: fixed;
-		top: 20rpx;
-		left: 0;
-		z-index: 99;
-		display: flex;
-		justify-content: center;
-		width: 100%;
-
-		.content {
-			font-size: 28rpx;
-			color: #ffffff;
-			background: rgba($color: #000000, $alpha: 0.8);
-			display: flex;
-			padding: 0 15rpx;
-			height: 60rpx;
-			border-radius: 60rpx;
-			justify-content: center;
-			align-items: center;
-
-			image {
-				width: 40rpx;
-				height: 40rpx;
-				display: block;
-				border-radius: 50%;
-				margin-right: 10rpx;
-			}
-
-			.name {
-				max-width: 160rpx;
-				margin-right: 6rpx;
-			}
-		}
-	}
-
-	.swiper-container {
-		position: relative;
-
-		swiper {
-			height: 750rpx;
-		}
-
-		.image {
-			width: 750rpx;
-			height: 750rpx;
-			display: block;
-			margin: 0 auto;
-			overflow: hidden;
-			position: relative;
-
-			.img {
-				width: 750rpx;
-				height: 750rpx;
-				display: block;
-			}
-
-			.water {
-				width: 750rpx;
-				height: 750rpx;
-				display: block;
-				position: absolute;
-				left: 0;
-				top: 0;
-				z-index: 1;
-			}
-		}
-
-		// image {
-		// 	height: 750rpx;
-		// 	width: 750rpx;
-		// 	display: block;
-		// 	margin: 0 auto;
-		// 	overflow: hidden;
-		// }
-		video {
-			height: 750rpx;
-			width: 750rpx;
-			display: block;
-			margin: 0 auto;
-			overflow: hidden;
-		}
-
-		.nums {
-			position: absolute;
-			right: 20rpx;
-			bottom: 20rpx;
-			background: rgba($color: #000000, $alpha: 0.2);
-			border-radius: 8rpx;
-			line-height: 48rpx;
-			padding: 0 12rpx;
-			font-size: 28rpx;
-			color: #ffffff;
-		}
-	}
-
-	.video-container {
-		position: fixed;
-		right: 20rpx;
-		bottom: 300rpx;
-		z-index: -99;
-
-		&.isFixed {
-			z-index: 99;
-		}
-
-		.content {
-			position: relative;
-		}
-
-		video {
-			height: 200rpx;
-			width: 375rpx;
-		}
-
-		.close {
-			position: absolute;
-			right: 0;
-			top: 0;
-			z-index: 100;
-			background: rgba($color: #000000, $alpha: 0.4);
-			padding: 10rpx;
-
-			image {
-				width: 28rpx;
-				height: 28rpx;
-				display: block;
-			}
-		}
-	}
-
-	.seckill-container {
-		height: 120rpx;
-		background: linear-gradient(-90deg, rgba(255, 37, 118, 1) 0%, #ff5648 100%);
-		display: flex;
-		justify-content: space-between;
-		align-items: center;
-		padding: 0 20rpx;
-		position: relative;
-
-		.clock {
-			position: absolute;
-			right: 220rpx;
-			top: 20rpx;
-
-			image {
-				width: 74rpx;
-				height: 72rpx;
-				display: block;
-			}
-		}
-
-		.price-1 {
-			font-size: 40rpx;
-			color: #ffffff;
-			line-height: 44rpx;
-		}
-
-		.price-2 {
-			font-size: 28rpx;
-			line-height: 32rpx;
-			color: #dddddd;
-			text-decoration: line-through;
-		}
-
-		.right {
-			display: flex;
-			flex-direction: column;
-			align-items: center;
-
-			text {
-				font-size: 24rpx;
-				color: #ffffff;
-			}
-
-			.time {
-				font-size: 24rpx;
-				color: #ffffff;
-				display: flex;
-				align-items: center;
-				margin-top: 6rpx;
-
-				text {
-					width: 40rpx;
-					height: 40rpx;
-					background: #ffffff;
-					border-radius: 4rpx;
-					color: #ff2775;
-					font-size: 24rpx;
-					line-height: 40rpx;
-					text-align: center;
-					margin: 0 4rpx;
-				}
-			}
-		}
-	}
-
-	.main-container {
-		background: #ffffff;
-		padding: 20rpx 20rpx 0;
-
-		.title {
-			font-size: 32rpx;
-			color: #333333;
-			line-height: 40rpx;
-			font-weight: 600;
-		}
-
-		.des {
-			font-size: 24rpx;
-			color: #999999;
-			line-height: 28rpx;
-			margin-top: 8rpx;
-		}
-
-		.stock {
-			display: flex;
-			justify-content: space-between;
-			align-items: flex-end;
-			margin-top: 20rpx;
-			padding-bottom: 20rpx;
-
-			.left {
-				display: flex;
-				align-items: center;
-
-				text {
-					font-size: 24rpx;
-					color: #666666;
-				}
-
-				.progress-box {
-					width: 140rpx;
-					border-radius: 6px;
-					overflow: hidden;
-					margin-left: 10rpx;
-				}
-			}
-
-			.right {
-				font-size: 28rpx;
-				color: #999999;
-				display: flex;
-				align-items: center;
-
-				image {
-					width: 20rpx;
-					height: 20rpx;
-					display: block;
-					margin-left: 10rpx;
-				}
-			}
-		}
-
-		.price {
-			display: flex;
-			justify-content: space-between;
-			align-items: flex-end;
-			// margin-top: 10rpx;
-			padding-bottom: 20rpx;
-
-			.left {
-				display: flex;
-				flex-direction: column;
-			}
-
-			.price-1 {
-				font-size: 32rpx;
-				color: #ff3f42;
-				line-height: 36rpx;
-			}
-
-			.price-2 {
-				font-size: 26rpx;
-				color: #666666;
-				line-height: 30rpx;
-				text-decoration: line-through;
-			}
-
-			.right {
-				font-size: 28rpx;
-				color: #999999;
-				display: flex;
-				align-items: center;
-
-				image {
-					width: 20rpx;
-					height: 20rpx;
-					display: block;
-					margin-left: 10rpx;
-				}
-			}
-		}
-
-		.bottom {
-			display: flex;
-			align-items: center;
-			justify-content: space-between;
-			height: 76rpx;
-			border-top: 1px solid #eaeaea;
-			font-size: 28rpx;
-			color: #666666;
-		}
-	}
-
-	.line-container {
-		background: #ffffff;
-		margin-top: 20rpx;
-		display: flex;
-		justify-content: space-between;
-		align-items: center;
-		height: 88rpx;
-		font-size: 28rpx;
-		color: #333333;
-		padding: 0 20rpx;
-
-		text {
-			color: #fe781f;
-		}
-	}
-
-	.detail-container {
-		background: #ffffff;
-		margin-top: 20rpx;
-
-		.title {
-			font-size: 32rpx;
-			color: #333333;
-			line-height: 88rpx;
-			text-align: center;
-			font-weight: 600;
-		}
-
-		.content {
-			image {
-				width: 100%;
-			}
-		}
-	}
-
-	.evaluate-container {
-		background: #ffffff;
-		margin-top: 20rpx;
-
-		.title {
-			font-size: 32rpx;
-			color: #333333;
-			line-height: 88rpx;
-			text-align: center;
-			font-weight: 600;
-		}
-
-		.list {
-			display: flex;
-			overflow-x: scroll;
-			padding: 0 20rpx;
-
-			.item {
-				width: 650rpx;
-				padding-right: 30rpx;
-				flex-shrink: 0;
-
-				&:last-child {
-					padding-right: 20rpx;
-				}
-
-				&.onlyOne {
-					width: 710rpx;
-				}
-
-				.top {
-					display: flex;
-					justify-content: space-between;
-					align-items: center;
-
-					.user {
-						display: flex;
-						align-items: center;
-
-						image {
-							width: 80rpx;
-							height: 80rpx;
-							display: block;
-							border-radius: 50%;
-							margin-right: 20rpx;
-						}
-
-						.name {
-							font-size: 28rpx;
-							color: #333333;
-							width: 250rpx;
-						}
-					}
-
-					.date {
-						font-size: 28rpx;
-						color: #999999;
-					}
-				}
-
-				.rate {
-					margin-top: 14rpx;
-
-					.it {
-						display: flex;
-						align-items: center;
-						font-size: 24rpx;
-						color: #666666;
-						margin-top: 5rpx;
-
-						&>text {
-							margin-right: 10rpx;
-						}
-					}
-				}
-
-				.tags {
-					display: flex;
-					flex-wrap: wrap;
-
-					.it {
-						line-height: 44rpx;
-						padding: 0 15rpx;
-						border: 1px solid #eaeaea;
-						border-radius: 44rpx;
-						font-size: 24rpx;
-						margin-right: 14rpx;
-						margin-top: 14rpx;
-						color: #666666;
-					}
-				}
-
-				.content {
-					font-size: 28rpx;
-					color: #333333;
-					margin-top: 14rpx;
-				}
-
-				.images {
-					display: flex;
-					flex-wrap: wrap;
-					margin-top: 14rpx;
-
-					image {
-						width: 140rpx;
-						height: 140rpx;
-						margin-right: 20rpx;
-						margin-bottom: 20rpx;
-					}
-				}
-			}
-		}
-
-		.more {
-			display: flex;
-			justify-content: center;
-			padding: 10rpx 0 30rpx;
-
-			.btn {
-				width: 220rpx;
-				height: 68rpx;
-				line-height: 68rpx;
-				text-align: center;
-				border-radius: 68rpx;
-				border: 1px solid #eaeaea;
-				font-size: 28rpx;
-				color: #666666;
-			}
-		}
-	}
-
-	.bottom-container {
-		position: fixed;
-		bottom: 0;
-		left: 0;
-		width: 100%;
-		box-sizing: border-box;
-		padding: 0 20rpx;
-		background: #ffffff;
-		display: flex;
-		justify-content: space-between;
-		align-items: center;
-		height: 100rpx;
-		border-top: 1px solid #eaeaea;
-
-		.left {
-			display: flex;
-			width: 280rpx;
-
-			.item {
-				display: flex;
-				flex-direction: column;
-				align-items: center;
-				justify-content: center;
-				margin-right: 40rpx;
-				position: relative;
-				width: 66rpx;
-
-				&:last-child {
-					margin-right: 0;
-				}
-
-				image {
-					width: 40rpx;
-					height: 40rpx;
-					display: block;
-				}
-
-				text {
-					font-size: 22rpx;
-					color: #333333;
-					margin-top: 4rpx;
-				}
-
-				.dot {
-					position: absolute;
-					right: -4rpx;
-					top: -8rpx;
-					background: #ff3f42;
-					width: 32rpx;
-					height: 32rpx;
-					line-height: 32rpx;
-					text-align: center;
-					border-radius: 32rpx;
-					font-size: 20rpx;
-					color: #ffffff;
-				}
-			}
-		}
-
-		.right {
-			display: flex;
-
-			.button {
-				width: 190rpx;
-				height: 80rpx;
-				line-height: 80rpx;
-				text-align: center;
-				border-radius: 80rpx;
-				font-size: 28rpx;
-				color: #ffffff;
-
-				&.cart {
-					background: #fe781f;
-				}
-
-				&.buy {
-					background: #ff3f42;
-					margin-left: 10rpx;
-				}
-
-				&.sec {
-					background: linear-gradient(-90deg, #ff3f42 0%, #fe781f 100%);
-				}
-			}
-		}
-	}
-
-	.cart-container {
-		padding: 50rpx 20rpx 30rpx;
-
-		.main {
-			display: flex;
-			padding: 20rpx 0;
-			border-bottom: 1px solid #eaeaea;
-
-			image {
-				width: 200rpx;
-				height: 200rpx;
-				display: block;
-				flex-shrink: 0;
-			}
-
-			.right {
-				margin-left: 26rpx;
-				display: flex;
-				flex-direction: column;
-				justify-content: space-between;
-
-				.title {
-					font-size: 28rpx;
-					color: #333333;
-					line-height: 36rpx;
-				}
-
-				.price {
-					display: flex;
-					flex-direction: column;
-				}
-
-				.price-1 {
-					font-size: 32rpx;
-					color: #ff3f42;
-					line-height: 36rpx;
-				}
-
-				.price-2 {
-					font-size: 26rpx;
-					color: #666666;
-					line-height: 30rpx;
-					text-decoration: line-through;
-				}
-
-				.stock {
-					font-size: 24rpx;
-					color: #999999;
-				}
-			}
-		}
-
-		.attr {
-			padding: 20rpx 0;
-			border-bottom: 1px solid #eaeaea;
-
-			.title {
-				font-size: 28rpx;
-				color: #333333;
-			}
-
-			.list {
-				display: flex;
-				flex-wrap: wrap;
-
-				.item {
-					margin-top: 16rpx;
-					padding: 10rpx 16rpx;
-					font-size: 24rpx;
-					color: #666666;
-					background: #f5f5f5;
-					border-radius: 5rpx;
-					margin-right: 16rpx;
-
-					&.current {
-						color: #ff3f42;
-						background: rgba($color: #ff3f42, $alpha: 0.2);
-					}
-				}
-			}
-		}
-
-		.num {
-			padding: 20rpx 0;
-			display: flex;
-			justify-content: space-between;
-			align-items: center;
-
-			.title {
-				font-size: 28rpx;
-				color: #333333;
-			}
-		}
-
-		.button {
-			text-align: center;
-			line-height: 74rpx;
-			border-radius: 74rpx;
-			background: linear-gradient(-90deg, #ff3f42 0%, #fe781f 100%);
-			font-size: 28rpx;
-			color: #ffffff;
-			margin-top: 20rpx;
-		}
-	}
-
-	.package-container {
-		padding: 30rpx 20rpx;
-
-		.main {
-			max-height: 75vh;
-			overflow-y: scroll;
-
-			.group {
-				border-bottom: 1px solid #eaeaea;
-
-				&:last-child {
-					border: none;
-				}
-
-				.title {
-					font-size: 28rpx;
-					color: #ff3f42;
-					line-height: 28rpx;
-					margin: 20rpx 0;
-				}
-
-				.goods-list {
-					.item {
-						display: flex;
-						align-items: center;
-						background: #ffffff;
-						margin-bottom: 20rpx;
-
-						image {
-							width: 180rpx;
-							height: 180rpx;
-							display: block;
-							margin-right: 20rpx;
-							flex-shrink: 0;
-						}
-
-						.right {
-							flex: 1;
-							height: 190rpx;
-							display: flex;
-							justify-content: space-between;
-							flex-direction: column;
-
-							.name {
-								font-size: 28rpx;
-								color: #333333;
-								line-height: 36rpx;
-								height: 72rpx;
-							}
-
-							.des {
-								font-size: 24rpx;
-								color: #999999;
-								line-height: 36rpx;
-							}
-
-							.bottom {
-								display: flex;
-								justify-content: space-between;
-								align-items: center;
-
-								.price {
-									display: flex;
-									flex-direction: column;
-								}
-
-								.price-1 {
-									font-size: 32rpx;
-									color: #ff3f42;
-									line-height: 36rpx;
-								}
-
-								.price-2 {
-									font-size: 26rpx;
-									color: #666666;
-									line-height: 30rpx;
-									text-decoration: line-through;
-								}
-							}
-						}
-					}
-				}
-			}
-		}
-
-		.button {
-			text-align: center;
-			line-height: 74rpx;
-			border-radius: 74rpx;
-			background: linear-gradient(-90deg, #ff3f42 0%, #fe781f 100%);
-			font-size: 28rpx;
-			color: #ffffff;
-			margin-top: 20rpx;
-		}
-	}
-
-	.sharelist-container {
-		padding: 30rpx 0;
-		display: flex;
-
-		button {
-			background: none;
-			border-radius: 0;
-
-			&::after {
-				border: none;
-			}
-		}
-
-		.item {
-			display: flex;
-			width: 50%;
-			flex-direction: column;
-			align-items: center;
-
-			image {
-				width: 100rpx;
-				height: 100rpx;
-				display: block;
-				margin-bottom: 20rpx;
-			}
-
-			text {
-				font-size: 28rpx;
-				line-height: 32rpx;
-				color: #333333;
-			}
-		}
-	}
-
-	.canvas-container {
-		position: fixed;
-		left: 50%;
-		top: 50%;
-		z-index: 999;
-		margin-left: -150px;
-		margin-top: -280px;
-
-		.button {
-			display: flex;
-			justify-content: center;
-
-			text {
-				display: block;
-				width: 280rpx;
-				height: 70rpx;
-				border-radius: 70rpx;
-				background: linear-gradient(-90deg, #ff3f42 0%, #fe781f 100%);
-				font-size: 28rpx;
-				color: #ffffff;
-				text-align: center;
-				line-height: 70rpx;
-				margin-top: 20rpx;
-			}
-		}
-	}
-
-	.phone-dialog {
-		padding: 40rpx;
-		box-sizing: border-box;
-
-		.content {
-			margin-top: 30rpx;
-			margin-bottom: 30rpx;
-			line-height: 50rpx;
-
-			text {
-				color: #9d9d9d;
-			}
-		}
-
-		.btn {
-			display: flex;
-			justify-content: center;
-			margin-top: 60rpx;
-
-			button::after {
-				border: none;
-			}
-
-			button {
-				width: 180rpx;
-				height: 70rpx;
-				line-height: 70rpx;
-				margin: 0;
-				font-size: 28rpx;
-				margin: 0 30rpx;
-
-				&:first-child {
-					background: #f5f5f5;
-					color: #00ba5c;
-				}
-			}
-		}
-	}
+<template>
+	<view class="app-container">
+		<view class="recommender-container" v-if="isGroupbuyGoods && !isHeadUser">
+			<view class="content">
+				<image :src="detail.groupPic"></image>
+				<view class="name ellipsis">{{ detail.groupUserName }}</view>
+				<view>向你推荐</view>
+			</view>
+		</view>
+
+		<!-- <no-data v-if="!isLoaded" :showText="'加载中'"></no-data> -->
+		<no-data v-if="isLoaded && noData" :showText="'该商品已失效'"></no-data>
+		<block v-if="isLoaded && !noData">
+			<view class="swiper-container">
+				<swiper @change="changeBanner">
+					<swiper-item v-if="detail.vedio">
+						<video id="video1" :src="detail.vedio" @play="playVideo" @pause="pauseVideo" controls loop
+							:enable-progress-gesture="false" :muted="isFixedVideo"></video>
+					</swiper-item>
+					<block v-for="(item, index) in bannerList" :key="index" v-if="bannerList.length > 0">
+						<swiper-item>
+							<!-- <image :src="item.url" mode="aspectFill" @tap="previewImage(item.url)" ></image> -->
+							<view class="image" @tap="previewImage(item.url)">
+								<image :src="item.url" mode="aspectFill" class="img"></image>
+								<image :src="detail.logo" mode="aspectFill" class="water"
+									v-if="isShowWater && index == 0"></image>
+							</view>
+						</swiper-item>
+					</block>
+				</swiper>
+				<view class="nums" v-show="(detail.vedio && bannerCurrent != 0) || !detail.vedio">
+					{{ bannerCurrent + 1 }}/{{
+            bannerList.length + (detail.vedio ? 1 : 0)
+          }}
+				</view>
+			</view>
+			<view class="video-container" :class="isFixedVideo ? 'isFixed' : ''">
+				<view class="content">
+					<view class="close" @tap="closeFixedVideo">
+						<image src="@/static/icon/close.png"></image>
+					</view>
+					<video id="video2" :src="detail.vedio" @error="videoErrorCallback" controls loop
+						:enable-progress-gesture="false"></video>
+				</view>
+			</view>
+			<!-- goodsTagRelas -->
+			<view class="seckill-container" v-if="isSeckillGoods">
+				<view class="price">
+					<view class="price-1">¥{{ detail.goodsPrice | numToFixed }}</view>
+					<view class="price-2">¥{{ detail.orgGoodsPrice | numToFixed }}</view>
+				</view>
+				<view class="right">
+					<text>距结束还剩：</text>
+					<view class="time">
+						<text>{{ countdownTime[0] }}</text>时<text>{{ countdownTime[1] }}</text>分<text>{{ countdownTime[2] }}</text>秒
+					</view>
+				</view>
+				<view class="clock">
+					<image src="@/static/icon/clock.png"></image>
+				</view>
+			</view>
+			<view class="main-container">
+				<view class="title">{{ detail.goodsName }}</view>
+				<view class="des">{{detail.describeText ? detail.describeText : ''}}</view>
+				<view class="tags2" v-if="(detail.goodsTagRelas && detail.goodsTagRelas.length > 0)">
+					<view class="it" v-for="(it, idx) in detail.goodsTagRelas" :key="idx">{{it.goodsTagName}}</view>
+				</view>
+				<view class="stock">
+					<block v-if="!isSeckillGoods">
+						<view class="left">
+							<text>剩余{{ detail.stock }}件</text>
+						</view>
+					</block>
+					<block v-if="isSeckillGoods">
+						<view class="left">
+							<text>剩余{{ detail.secStockNum }}件</text>
+							<view class="progress-box">
+								<progress :percent="(detail.secStockNum / detail.limitBuy) * 100" activeColor="#FF3F42"
+									active stroke-width="6" />
+							</view>
+						</view>
+						<view class="right" @tap="isOpen = !isOpen" v-if="
+                (isServiceUser && !isGroupbuyGoods) ||
+                (isHeadUser && isGroupbuyGoods)
+              ">
+							<text>{{ isOpen ? '收起' : '展开' }}</text>
+							<image :src="
+                  isOpen
+                    ? '../../static/icon/arrow_2.png'
+                    : '../../static/icon/arrow_1.png'
+                "></image>
+						</view>
+					</block>
+				</view>
+				<view class="price" v-if="!isSeckillGoods">
+					<view class="left">
+						<view class="price-1">¥{{ detail.goodsPrice | numToFixed }}</view>
+						<view class="price-2">¥{{ detail.orgGoodsPrice | numToFixed }}</view>
+					</view>
+					<view class="right" @tap="isOpen = !isOpen" v-if="
+              (isServiceUser && !isGroupbuyGoods) ||
+              (isHeadUser && isGroupbuyGoods)
+            ">
+						<text>{{ isOpen ? '收起' : '展开' }}</text>
+						<image :src="
+                isOpen
+                  ? '../../static/icon/arrow_2.png'
+                  : '../../static/icon/arrow_1.png'
+              "></image>
+					</view>
+				</view>
+				<view class="bottom" v-if="isOpen">
+					<view v-if="isHeadUser && isGroupbuyGoods">团长分佣金额</view>
+					<view v-else>分享可获得收益</view>
+					<view>￥{{ commission | numToFixed
+            }}{{ detail.goodsSpecs.length > 1 ? '起' : '' }}</view>
+				</view>
+			</view>
+			<view class="line-container">
+				<view v-if="
+            accountInfo.miniProgram &&
+            accountInfo.miniProgram.appId !== 'wxf89d330c7b0e718d'
+          ">运费：包邮</view>
+				<view>销量：<text>{{ detail.soldNum }}</text></view>
+			</view>
+
+			<view class="evaluate-container" v-if="evaluateList.length">
+				<view class="title">商品评价</view>
+				<view class="list">
+					<view class="item" :class="evaluateList.length === 1 ? 'onlyOne' : ''"
+						v-for="(item, index) in evaluateList">
+						<view class="top">
+							<view class="user">
+								<image :src="item.avatar" mode="aspectFill" v-if="item.avatar.indexOf('http') >= 0">
+								</image>
+								<image :src="imageUrl + item.avatar" mode="aspectFill" v-else></image>
+								<view class="name ellipsis">{{ item.userName }}</view>
+							</view>
+							<view class="date">{{ item.createTime }}</view>
+						</view>
+						<view class="rate">
+							<view class="it"><text>商品质量</text><uni-rate :size="14" :margin="4"
+									:value="item.commentGoods" color="#fff" active-color="#FE781F" :readonly="true" />
+							</view>
+							<view class="it"><text>服务质量</text><uni-rate :size="14" :margin="4"
+									:value="item.commentService" color="#fff" active-color="#FE781F" :readonly="true" />
+							</view>
+							<view class="it"><text>配送质量</text><uni-rate :size="14" :margin="4"
+									:value="item.commentExpress" color="#fff" active-color="#FE781F" :readonly="true" />
+							</view>
+						</view>
+						<view class="tags">
+							<view class="it" v-for="(it, idx) in item.tags">{{ it }}</view>
+						</view>
+						<view class="content">{{ item.content }}</view>
+						<view class="images" v-if="item.imgs && item.imgs.length > 0">
+							<image v-for="(it, idx) in item.imgs" :src="it" @tap="previewEvaluateImage(it, item.imgs)">
+							</image>
+						</view>
+					</view>
+				</view>
+				<view class="more">
+					<view class="btn" @tap="toAllEvaluate">查看全部评价</view>
+				</view>
+			</view>
+
+			<view class="detail-container">
+				<view class="title">商品详情</view>
+				<view class="content" v-if="detail.pubCommonTemplate">
+					<u-parse :content="detail.pubCommonTemplate.content"></u-parse>
+				</view>
+				<view class="content" v-if="detail.commonTemplate">
+					<u-parse :content="detail.commonTemplate.content"></u-parse>
+				</view>
+				<view class="content">
+					<u-parse :content="detail.content"></u-parse>
+				</view>
+			</view>
+			<view class="bottom-container">
+				<view class="left">
+					<view class="item" @tap="clickShare">
+						<image src="@/static/icon/share.png"></image>
+						<text>分享</text>
+					</view>
+					<view class="item" @tap="handleCollect" v-if="!isGroupbuyGoods && !isPackageGoods">
+						<block v-if="detail.favorite">
+							<image src="@/static/icon/collect2.png"></image>
+							<text>已收藏</text>
+						</block>
+						<block v-else>
+							<image src="@/static/icon/collect.png"></image>
+							<text>收藏</text>
+						</block>
+					</view>
+					<view class="item" @tap="toCart">
+						<image src="@/static/icon/cart2.png"></image>
+						<text>购物车</text>
+						<view class="dot" v-if="cartCount > 0">{{
+              cartCount <= 99 ? cartCount : '99+'
+            }}</view>
+					</view>
+				</view>
+				<view class="right" v-if="!isSeckillGoods && !isGroupbuyGoods && !isPackageGoods">
+					<view class="button cart" @tap="clickCartOrBuy(1)">加入购物车</view>
+					<view class="button buy" @tap="clickCartOrBuy(2)">立即购买</view>
+				</view>
+				<view class="right" v-if="!isSeckillGoods && isGroupbuyGoods">
+					<view class="button cart" @tap="clickCartOrBuy(1)">加入购物车</view>
+					<view class="button buy" @tap="clickCartOrBuy(4)">立即拼团</view>
+				</view>
+				<view class="right" v-if="isSeckillGoods">
+					<view class="button cart" @tap="clickCartOrBuy(1)">加入购物车</view>
+					<view class="button buy" @tap="clickCartOrBuy(3)">马上抢购</view>
+				</view>
+				<view class="right" v-if="isPackageGoods">
+					<view class="button buy" @tap="clickPackageBuy()">立即购买</view>
+				</view>
+			</view>
+
+			<u-popup :round="10" :closeable="true" :show="isBuyDialog" @close="isBuyDialog = false">
+				<view class="cart-container">
+					<view class="main">
+						<image :src="specList[specCurrent].imgUrl"></image>
+						<view class="right">
+							<view class="title ellipsis-2">{{ detail.goodsName }}</view>
+							<block v-if="isGroupbuyGoods">
+								<view class="price">
+									<view class="price-1">¥{{ specList[specCurrent].price }}</view>
+									<view class="price-2">¥{{ specList[specCurrent].orgPrice }}</view>
+								</view>
+								<view class="stock">剩余{{ specList[specCurrent].stockNum }}件</view>
+							</block>
+							<block v-else-if="isSeckillGoods">
+								<view class="price">
+									<view class="price-1">¥{{ specList[specCurrent].secPrice }}</view>
+									<view class="price-2">¥{{ specList[specCurrent].price }}</view>
+								</view>
+								<view class="stock">剩余{{ detail.secStockNum }}件</view>
+							</block>
+							<block v-else>
+								<view class="price">
+									<view class="price-1">¥{{ specList[specCurrent].price }}</view>
+									<view class="price-2">¥{{ detail.orgGoodsPrice }}</view>
+								</view>
+								<view class="stock">剩余{{ specList[specCurrent].stockNum }}件</view>
+							</block>
+						</view>
+					</view>
+					<view class="attr">
+						<view class="title">已选属性</view>
+						<view class="list">
+							<block v-for="(item, index) in specList" :key="index">
+								<view class="item" @tap="changeSpec(index)"
+									:class="specCurrent == index ? 'current' : ''">{{ item.name }}-{{ item.specValue }}
+								</view>
+							</block>
+						</view>
+					</view>
+					<view class="num">
+						<view class="title">购买数量</view>
+						<u-number-box v-model="buyNum" :min="1" :buttonSize="26" iconStyle="font-size: 12px;">
+						</u-number-box>
+					</view>
+					<view class="button" v-if="dialogType == 1" @tap="addToCart">加入购物车</view>
+					<view class="button" v-if="dialogType == 2" @tap="nowBuy">立即购买</view>
+					<view class="button" v-if="dialogType == 3" @tap="rushBuy">马上抢购</view>
+					<view class="button" v-if="dialogType == 4" @tap="nowBuy">马上拼团</view>
+				</view>
+			</u-popup>
+
+			<u-popup :round="10" :closeable="false" :show="isShareDialog" @close="isShareDialog = false">
+				<view class="sharelist-container">
+					<button class="item" open-type="share" @tap="isShareDialog = false">
+						<image src="@/static/icon/wechat.png"></image>
+						<text>分享给微信好友</text>
+					</button>
+
+					<view class="item" @tap="markImage">
+						<image src="@/static/icon/image.png"></image>
+						<text>生成图片分享</text>
+					</view>
+				</view>
+			</u-popup>
+
+			<view class="global-mask" v-show="isShowCanvas" @tap="closeCanvas"></view>
+			<view class="canvas-container" v-show="isShowCanvas">
+				<view class="content">
+					<canvas style="width: 300px; height: 520px" canvas-id="myCanvas" id="myCanvas"></canvas>
+				</view>
+				<view class="button"><text @tap="saveImage">保存图片</text></view>
+			</view>
+
+			<u-popup :round="10" :closeable="true" :show="isPackageDialog" @close="isPackageDialog = false">
+				<view class="package-container">
+					<view class="main">
+						<view class="group" v-for="(item, index) in packageList" :key="index">
+							<view class="title">请选择商品{{ item.num }}件</view>
+							<view class="goods-list">
+								<view class="item" v-for="(it, idx) in item.goodsList" :key="idx">
+									<image :src="it.imgUrl"></image>
+									<view class="right">
+										<view class="name ellipsis-2">{{ it.goodsName }}</view>
+										<view class="des">{{ it.specValue }}</view>
+										<view class="bottom">
+											<view class="price">
+												<view class="price-1">¥{{ it.price | numToFixed }}</view>
+												<view class="price-2">¥{{ it.orgPrice | numToFixed }}</view>
+											</view>
+
+											<u-number-box v-model="it.num" :min="0" :max="it.limitNum" :buttonSize="26"
+												iconStyle="font-size: 12px;">
+											</u-number-box>
+										</view>
+									</view>
+								</view>
+							</view>
+						</view>
+					</view>
+					<view class="button" @tap="packageBuy()">立即购买</view>
+				</view>
+			</u-popup>
+
+			<u-popup :round="10" :show="isShowPhoneDialog">
+				<view class="phone-dialog">
+					<view class="content">
+						<view>申请获取以下权限</view>
+						<text>获得你的公开信息(手机号码)</text>
+					</view>
+					<view class="btn">
+						<button @tap="isShowPhoneDialog = false">取消</button>
+						<button type="primary" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
+							确定授权
+						</button>
+					</view>
+				</view>
+			</u-popup>
+		</block>
+
+		<canvas style="
+        width: 800px;
+        height: 800px;
+        z-index: -1;
+        position: fixed;
+        bottom: -1000px;
+        right: -1000px;
+      " canvas-id="myCanvas22" id="myCanvas22"></canvas>
+	</view>
+</template>
+
+<script>
+	import {
+		mapState
+	} from 'vuex';
+	import {
+		base64src
+	} from '@/utils/base.js';
+	import {
+		appId
+	} from '@/utils/config.js';
+	import {
+		uploadImg
+	} from '@/api/axios.js';
+	export default {
+		data() {
+			return {
+				isShowPhoneDialog: false,
+				imageUrl: this.$imageUrl,
+				configInfo: uni.getStorageSync('configInfo'),
+				isLoaded: false,
+				noData: true,
+				goodsId: null, // 商品id
+				detail: {}, // 商品详情
+				commission: 0, // 分佣金额
+				bannerList: [], // 轮播图列表
+				bannerCurrent: 0, // 轮播图当前值
+				specList: [], // 规格列表
+				specCurrent: 0, // 规格当前值
+				isOpen: false, // 是否展开
+				isBuyDialog: false, // 是否显示购买/加入购物车弹窗
+				dialogType: 1, // 弹窗类型: 1加入购物车，2立即购买，3秒杀抢购
+				isShareDialog: false, // 是否显示分享弹窗
+				isShowCanvas: false, // 是否显示海报弹窗
+				buyNum: 1, // 购买/加入购物车 数量
+				isSeckillGoods: false, // 是否秒杀商品
+				isGroupbuyGoods: false, // 是否团购商品
+				isPackageGoods: false, // 是否套购商品
+				isPackageDialog: false, // 是否显示套购购买弹窗
+				packageList: [], // 套购选择列表
+				cartCount: 0, // 购物车内商品数
+				isFinishCanvas: false, // 是否已完成海报
+				codeUrl: '', // 商品码
+				videoContext1: '', // 视频对象
+				videoContext2: '', // 视频对象
+				isFixedVideo: false, // 是否显示视频弹窗
+				isPlayVideo: false, // 视频是否播放中
+				isCloseMyself: false, // 是否亲自关闭视频弹窗
+				countdownTime: '', // 倒计时
+				endHour: 0, // 倒计时结束时间
+				evaluateList: [],
+				isShowWater: false,
+				accountInfo: {},
+			};
+		},
+		computed: {
+			...mapState(['userInfo', 'isLogin', 'userId']),
+
+			isHeadUser() {
+				// 是否团长
+				return this.userInfo.promotionGroupLeader;
+			},
+			isServiceUser() {
+				// 是否业务员
+				return this.userInfo.type === 'SERVICE';
+			},
+		},
+		watch: {
+			countdownTime() {
+				if (
+					this.countdownTime[0] == 0 &&
+					this.countdownTime[1] == 0 &&
+					this.countdownTime[2] == 0
+				) {
+					this.getDetail();
+				}
+			},
+		},
+		onPageScroll(res) {
+			if (
+				res.scrollTop > 300 &&
+				this.isPlayVideo &&
+				!this.isCloseMyself &&
+				this.detail.vedio
+			) {
+				this.isFixedVideo = true;
+				this.videoContext2.play();
+			} else {
+				this.isFixedVideo = false;
+				this.videoContext2.pause();
+			}
+			if (res.scrollTop < 300) {
+				this.isCloseMyself = false;
+			}
+		},
+		onLoad({
+			id
+		}) {
+			this.accountInfo = uni.getAccountInfoSync();
+			this.goodsId = id;
+			this.getDetail();
+			this.getEvaluateList();
+			this.getCartCount();
+			uni.showLoading({
+				title: '加载中',
+			});
+		},
+		onShow() {
+			this.isBuyDialog = false;
+		},
+		onReady() {
+			this.videoContext1 = uni.createVideoContext('video1');
+			this.videoContext2 = uni.createVideoContext('video2');
+		},
+		async onShareAppMessage(options) {
+			if (options && options.from == 'button') {
+				// 来自页面内的转发按钮
+			} else {
+				// 点击微信右上角的分享按钮
+			}
+			return {
+				title: '分享商品「' + this.detail.goodsName + '」',
+				imageUrl: await this.markImage222(),
+				path: '/pages/index/index?goodsId=' +
+					this.goodsId +
+					'&serviceId=' +
+					this.userId,
+				query: {
+					// id: this.goodsId,
+				},
+				success: function(res) {
+					if (res.errMsg == 'shareAppMessage:ok') {
+						this.$successToast('分享完成');
+					}
+				},
+			};
+		},
+		methods: {
+			// 获取手机号
+			getPhoneNumber(e) {
+				if (e?.detail?.iv && e?.detail?.encryptedData) {
+					this.$axios({
+						url: '/user/mobile/grant',
+						params: {
+							userId: this.userId,
+							iv: e.detail.iv,
+							encryptedData: e.detail.encryptedData,
+						},
+					}).then((res) => {
+						uni.setStorageSync('token', res.data.token);
+						uni.setStorageSync('isActiveLogout', false);
+						this.isShowPhoneDialog = false;
+						this.$getUserInfo();
+					});
+				}
+			},
+			// 获取详情
+			getDetail() {
+				this.$axios({
+						url: '/goods/detail',
+						method: 'get',
+						params: {
+							goodsId: this.goodsId,
+							userId: this.userId,
+						},
+					})
+					.then((res) => {
+						this.detail = res.data;
+						this.noData = false;
+						this.isLoaded = true;
+						// 团购
+						this.isGroupbuyGoods = res.data.promotionGroup;
+						// 秒杀
+						this.isSeckillGoods = res.data.secType;
+						this.endHour = res.data.endHour;
+						this.countTime();
+						// 套购
+						this.isPackageGoods = res.data.goodsType === 'PACKAGE';
+
+						this.bannerList = res.data.images;
+						this.specList = res.data.goodsSpecs;
+						this.specCurrent = 0;
+
+						if (!this.isPackageGoods) {
+							let commissionList = [];
+							this.specList.forEach((item, index) => {
+								item.price = item.price.toFixed(2);
+								item.orgPrice = item.orgPrice.toFixed(2);
+								commissionList.push(item.shareAmount);
+							});
+							this.commission = Math.min(...commissionList);
+						} else {
+							this.commission = res.data.shareAmount;
+						}
+
+						// 水印
+						if (res.data.logo && res.data.logoStartTime) {
+							this.isShowWater = this.$compareTime(
+								res.data.logoStartTime,
+								res.data.logoEndTime
+							);
+						} else {
+							this.isShowWater = false;
+						}
+						this.markImage222(false);
+					})
+					.catch((res) => {
+						this.noData = true;
+						this.isLoaded = true;
+					})
+					.finally((res) => {
+						uni.hideLoading();
+					});
+			},
+
+			// 获取评价列表
+			getEvaluateList() {
+				this.$axios({
+					url: '/order/comment/goods',
+					method: 'get',
+					params: {
+						pageNo: 1,
+						pageSize: 5,
+						goodsId: this.goodsId,
+					},
+				}).then((res) => {
+					this.evaluateList = res.data.records;
+				});
+			},
+
+			// 查询结束时间
+			checkEndTime(val) {
+				let yy = new Date().getFullYear();
+				let mm = new Date().getMonth() + 1;
+				let dd = new Date().getDate();
+				// dd = val == 10 ? dd + 1 : dd;
+
+				// 每月有多少天
+				let days = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
+				if ((yy % 4 == 0 && yy % 100 != 0) || yy % 400 == 0) {
+					days[1] = 29;
+				}
+
+				// 如果结束时间=10（表示第二天10点），dd需加一天
+				if (val == 10) {
+					if (dd >= days[mm - 1]) {
+						mm = mm + 1;
+					} else {
+						dd = dd + 1;
+					}
+				}
+
+				let date = yy + '/' + mm + '/' + dd;
+				let dateTime = date + ' ' + val + ':00:00';
+				return dateTime;
+			},
+
+			// 计算倒计时
+			countTime() {
+				let endDateTime = this.checkEndTime(this.endHour);
+				var nowtime = new Date(), //获取当前时间
+					endtime = new Date(endDateTime); //定义结束时间
+				var lefttime = endtime.getTime() - nowtime.getTime(), //距离结束时间的毫秒数
+					hh = Math.floor(lefttime / (1000 * 60 * 60)), //计算小时数
+					mm = Math.floor((lefttime / (1000 * 60)) % 60), //计算分钟数
+					ss = Math.floor((lefttime / 1000) % 60); //计算秒数
+				function checkTime(i) {
+					if (i < 10) {
+						i = '0' + i;
+					}
+					return i;
+				}
+				setTimeout(() => {
+					this.countTime();
+				}, 1000);
+				this.countdownTime = [checkTime(hh), checkTime(mm), checkTime(ss)];
+			},
+
+			// 获取商品二维码
+			getGoodsCode(success) {
+				const that = this;
+				this.$axios({
+					url: '/goods/qrcode',
+					method: 'get',
+					params: {
+						goodsId: this.goodsId,
+						userId: this.userId,
+					},
+				}).then((res) => {
+					// this.codeUrl = 'data:image/jpeg;base64,' + res.data;
+					that.codeUrl = res.data;
+					console.log(this.codeUrl, typeof success);
+					if (typeof success === 'function') {
+						success();
+					}
+				});
+			},
+
+			// 视频播放
+			playVideo(e) {
+				this.isPlayVideo = true;
+			},
+
+			// 视频暂停
+			pauseVideo(e) {
+				this.isPlayVideo = false;
+			},
+
+			// 关闭视频弹窗
+			closeFixedVideo() {
+				this.isFixedVideo = false;
+				this.isCloseMyself = true;
+				this.videoContext2.pause();
+			},
+
+			// 从个人信息获取购物车商品数量
+			getCartCount() {
+				this.$axios({
+					url: '/user/user/detail',
+					method: 'get',
+					params: {
+						userId: this.userId,
+					},
+				}).then((res) => {
+					this.cartCount = res.data.shoppingCartNums;
+
+					if (!res.data.openId) {
+						return uni.navigateTo({
+							url: '/pages/login/index?isNotOpenid=' + true,
+						});
+					}
+				});
+			},
+
+			// 查看所有评价
+			toAllEvaluate() {
+				uni.navigateTo({
+					url: '/packageGoods/pages/evaluate?goodsId=' + this.goodsId,
+				});
+			},
+
+			// 收藏/取消收藏
+			handleCollect() {
+				if (!this.isLogin) {
+					return uni.navigateTo({
+						url: '/pages/login/index',
+					});
+				}
+				if (!this.detail.favorite) {
+					this.$axios({
+						url: '/goods/favorite/add',
+						params: {
+							goodsId: this.goodsId,
+							userId: this.userId,
+						},
+					}).then((res) => {
+						this.$successToast('收藏成功');
+						this.getDetail();
+					});
+				} else {
+					this.$axios({
+						url: '/goods/favorite/detail/del',
+						params: {
+							goodsId: this.goodsId,
+							userId: this.userId,
+						},
+					}).then((res) => {
+						this.$successToast('取消收藏成功');
+						this.getDetail();
+					});
+				}
+			},
+
+			// 切换图片
+			changeBanner(e) {
+				this.bannerCurrent = e.detail.current;
+				if (this.bannerCurrent > 0 && this.detail.vedio) {
+					this.videoContext1.pause();
+				}
+			},
+
+			// 预览图片
+			previewImage(url) {
+				let imgs = [];
+				this.bannerList.forEach((item, index) => {
+					imgs.push(item.url);
+				});
+				uni.previewImage({
+					urls: imgs,
+					current: url,
+				});
+			},
+
+			// 预览评价图片
+			previewEvaluateImage(url, imgs) {
+				uni.previewImage({
+					urls: imgs,
+					current: url,
+				});
+			},
+
+			// 点击分享
+			clickShare() {
+				if (!this.isLogin) {
+					return uni.navigateTo({
+						url: '/pages/login/index',
+					});
+				}
+				// this.getGoodsCode();
+				this.isShareDialog = true;
+			},
+
+			// 点击加入购物车/立即购买
+			clickCartOrBuy(type) {
+				if (!this.isLogin) {
+					return uni.navigateTo({
+						url: '/pages/login/index',
+					});
+				}
+				this.dialogType = type;
+				this.isBuyDialog = true;
+			},
+
+			// 切换规格
+			changeSpec(index) {
+				this.specCurrent = index;
+			},
+
+			// 加入购物车
+			addToCart() {
+				if (this.specList[this.specCurrent].stockNum == 0) {
+					return this.$toast('该规格库存不足');
+				}
+				this.$axios({
+					url: '/shpping/cart/add/one',
+					type: 'application/json',
+					params: {
+						userId: this.userId,
+						buyGoods: [{
+							goodsId: this.goodsId,
+							goodsSpecId: this.specList[this.specCurrent].goodsSpecId,
+							num: this.buyNum,
+							secKillId: this.detail.secKillId || '',
+							promotionGroupId: this.detail.promotionGroupId || '',
+						}, ],
+					},
+					isLoading: 1,
+				}).then((res) => {
+					this.$successToast('添加成功');
+					this.getCartCount();
+					this.isBuyDialog = false;
+				});
+			},
+
+			// 立即购买
+			nowBuy() {
+				if (this.specList[this.specCurrent].stockNum == 0) {
+					return this.$toast('该规格库存不足');
+				}
+				if (!this.userInfo.mobile) {
+					this.isShowPhoneDialog = true;
+					return;
+				}
+				let buyList = [{
+					goodsId: this.goodsId,
+					goodsSpecId: this.specList[this.specCurrent].goodsSpecId,
+					num: this.buyNum,
+					secKillId: this.detail.secKillId || '',
+					promotionGroupId: this.detail.promotionGroupId || '',
+				}, ];
+				let url = '/packageGoods/pages/order?buyList=' + JSON.stringify(buyList);
+				if (this.detail.promotionGroupId) {
+					url = url + '&groupbuyId=' + this.detail.promotionGroupId;
+				}
+				uni.navigateTo({
+					url,
+				});
+			},
+
+			// 马上抢购（秒杀）
+			rushBuy() {
+				if (this.detail.secStockNum == 0) {
+					return this.$toast('该规格库存不足');
+				}
+				if (!this.userInfo.mobile) {
+					this.isShowPhoneDialog = true;
+					return;
+				}
+				this.$axios({
+					url: '/goods/sec/kill/start',
+					method: 'post',
+					params: {
+						secKillId: this.detail.secKillId,
+					},
+				}).then((res) => {
+					if (res.data) {
+						let buyList = [{
+							goodsId: this.goodsId,
+							goodsSpecId: this.specList[this.specCurrent].goodsSpecId,
+							num: this.buyNum,
+							secKillId: this.detail.secKillId || '',
+							promotionGroupId: this.detail.promotionGroupId || '',
+						}, ];
+						uni.navigateTo({
+							url: '/packageGoods/pages/order?buyList=' +
+								JSON.stringify(buyList) +
+								'&secKillId=' +
+								this.detail.secKillId +
+								'&secKillSpecId=' +
+								this.detail.secKillSpecId +
+								'&secToken=' +
+								res.data,
+						});
+					} else {
+						this.$toast('活动异常');
+					}
+				});
+			},
+
+			// 去购物车页面
+			toCart() {
+				uni.switchTab({
+					url: '/pages/cart/index',
+				});
+			},
+
+			// 打开套购购买弹窗
+			clickPackageBuy() {
+				this.packageList = [];
+				this.$axios({
+					url: '/goods/package/choice',
+					method: 'get',
+					params: {
+						goodsId: this.goodsId,
+					},
+				}).then((res) => {
+					let goodsList = res.data;
+					for (let i = 0; i < goodsList.length; i++) {
+						for (let j = 0; j < goodsList[i].length; j++) {
+							goodsList[i][j].num = 0;
+						}
+					}
+					let pops = this.detail.packagePop.split(':');
+					pops.forEach((item, index) => {
+						this.packageList.push({
+							num: item,
+							goodsList: goodsList[index],
+						});
+					});
+					console.log(this.packageList);
+					this.isPackageDialog = true;
+				});
+			},
+
+			// 套购购买
+			packageBuy() {
+				if (!this.userInfo.mobile) {
+					this.isShowPhoneDialog = true;
+					return;
+				}
+				let buyList = [];
+				for (let i = 0; i < this.packageList.length; i++) {
+					for (let j = 0; j < this.packageList[i].goodsList.length; j++) {
+						if (this.packageList[i].goodsList[j].num > 0) {
+							buyList.push({
+								goodsId: this.packageList[i].goodsList[j].goodsId,
+								goodsSpecId: this.packageList[i].goodsList[j].goodsSpecId,
+								popType: this.packageList[i].goodsList[j].type,
+								num: this.packageList[i].goodsList[j].num,
+							});
+						}
+					}
+				}
+				uni.navigateTo({
+					url: '/packageGoods/pages/order?buyList=' +
+						JSON.stringify(buyList) +
+						'&packageId=' +
+						this.detail.goodsId,
+				});
+			},
+
+			// 分享
+			share() {
+				uni.share({
+					provider: 'weixin',
+					scene: 'WXSceneSession',
+					type: 5,
+					summary: '我正在使用HBuilderX开发uni-app，赶紧跟我一起来体验！',
+					success: function(res) {
+						console.log('success:' + JSON.stringify(res));
+					},
+					fail: function(err) {
+						console.log('fail:' + JSON.stringify(err));
+					},
+				});
+			},
+
+			async markImage222(bool = true) {
+				return new Promise((r) => {
+					if (
+						this.detail.logo &&
+						this.detail.imgUrl &&
+						this.$compareTime(this.detail.logoStartTime, this.detail.logoEndTime)
+					) {
+						if (!!this.detail.mergeImage) {
+							r(this.detail.mergeImage);
+						} else {
+							if (bool) {
+								uni.showLoading({
+									title: '图片生成中',
+								});
+							}
+							this.getGoodsCode(() => {
+								let img = this.detail.imgUrl;
+								let logo = this.detail.logo;
+								var ctx = uni.createCanvasContext('myCanvas22');
+								ctx.rect(0, 0, 800, 800);
+								ctx.setFillStyle('#FFFFFF');
+								ctx.fill();
+								ctx.stroke();
+								uni.downloadFile({
+									url: img,
+									success: (res) => {
+										ctx.drawImage(res.tempFilePath, 0, 0, 800, 800);
+										uni.downloadFile({
+											url: logo,
+											success: (res2) => {
+												ctx.drawImage(res2
+													.tempFilePath, 0, 0,
+													800, 800);
+												ctx.draw();
+												uni.canvasToTempFilePath({
+													x: 0,
+													y: 0,
+													width: 800,
+													height: 800,
+													canvasId: 'myCanvas22',
+													success: (
+														res33) => {
+														uploadImg({
+																path: res33
+																	.tempFilePath,
+															})
+															.then((
+																data
+																) => {
+																this.$axios({
+																		url: '/goods/update/mergeImage',
+																		method: 'post',
+																		params: {
+																			goodsId: this
+																				.goodsId,
+																			imgUrl: data
+																				.url,
+																		},
+																	})
+																	.then(
+																		(
+																			res
+																			) => {
+																			if (
+																				bool
+																				) {
+																				uni
+																					.hideLoading();
+																				this
+																					.getDetail();
+																			}
+																			r(res
+																				.data
+																				);
+																		}
+																	);
+															});
+													},
+												});
+											},
+										});
+									},
+								});
+							});
+						}
+					} else {
+						r(this.detail.imgUrl);
+					}
+				});
+			},
+
+			// 生成图片
+			markImage() {
+				this.isShareDialog = false;
+				this.isShowCanvas = true;
+
+				if (this.isFinishCanvas) {
+					return false;
+				}
+
+				uni.showLoading({
+					title: '海报生成中',
+				});
+
+				// 调用获取二维图接口后执行匿名函数
+				this.getGoodsCode(() => {
+					let img = this.detail.imgUrl;
+					let logo = this.detail.logo;
+					let title = this.detail.goodsName;
+					let des = this.detail.describeText;
+					let price1 = this.detail.goodsPrice;
+					let price2 = this.detail.orgGoodsPrice;
+					let sales = this.detail.soldNum;
+					// let code = this.codeUrl;
+					// base64src(this.codeUrl , resCurrent => {
+					// 	code = resCurrent;
+					// })
+
+					var ctx = uni.createCanvasContext('myCanvas');
+
+					/**
+					 * @param {Object} str 要绘制的字符串
+					 * @param {Number} initX 绘制字符串起始x坐标
+					 * @param {Number} initY 绘制字符串起始y坐标
+					 * @param {Number} lineHeight 字行高
+					 */
+					function canvasTextAutoLine(str, initX, initY, lineHeight) {
+						var lineWidth = 0;
+						var canvasWidth = 260;
+						var lastSubStrIndex = 0;
+						var lineNum = 0;
+						var state = true;
+						for (let i = 0; i < str.length; i++) {
+							lineWidth += ctx.measureText(str[i]).width;
+							if (lineWidth > canvasWidth && lineNum < 1) {
+								ctx.fillText(str.substring(lastSubStrIndex, i), initX, initY);
+								initY += lineHeight;
+								lineWidth = 0;
+								lastSubStrIndex = i;
+								lineNum++;
+							} else if (lineWidth > canvasWidth && lineNum < 2) {
+								ctx.fillText(
+									str.substring(lastSubStrIndex + 2, i) + '...',
+									initX,
+									initY
+								);
+								lineNum++;
+								state = false;
+							}
+							if (i == str.length - 1 && state) {
+								ctx.fillText(str.substring(lastSubStrIndex, i + 1), initX, initY);
+							}
+						}
+					}
+
+					// 白色背景
+					ctx.rect(0, 0, 300, 520);
+					ctx.setFillStyle('#FFFFFF');
+					ctx.fill();
+					ctx.stroke();
+
+					// 商品名称
+					ctx.setFontSize(14);
+					ctx.setFillStyle('#333333');
+					canvasTextAutoLine(title, 20, 300, 18);
+
+					// 商品描述
+					if (des) {
+						ctx.setFontSize(12);
+						ctx.setFillStyle('#999999');
+						canvasTextAutoLine(des, 20, 336, 16);
+					}
+
+					// 现价
+					ctx.setFontSize(16);
+					ctx.setFillStyle('#FF3F42');
+					ctx.fillText('¥' + price1, 20, 380);
+
+					// 原价
+					ctx.setFontSize(13);
+					ctx.setFillStyle('#666666');
+					ctx.fillText('¥' + price2, 20, 396);
+					ctx.setStrokeStyle('#666666');
+					ctx.moveTo(20, 392);
+					ctx.lineTo(ctx.measureText('¥' + price2).width + 20, 392);
+					ctx.stroke();
+
+					// 销量
+					ctx.setFontSize(12);
+					ctx.setFillStyle('#666666');
+					ctx.fillText(
+						'销量：' + sales,
+						260 - ctx.measureText('销量：' + sales).width + 20,
+						380
+					);
+
+					// 二维码
+					// ctx.drawImage(code, 110, 404, 80, 80)
+
+					// 提示
+					ctx.setFontSize(12);
+					ctx.setFillStyle('#FE781F');
+					ctx.fillText('打开微信扫描识别查看商品', 78, 500);
+					// 图片
+					uni.downloadFile({
+						url: img,
+						success: (res) => {
+							ctx.drawImage(res.tempFilePath, 20, 20, 260, 260);
+							// 二维码
+							uni.downloadFile({
+								url: this.codeUrl,
+								success: (res) => {
+									ctx.drawImage(res.tempFilePath, 110, 404, 80, 80);
+									if (this.isShowWater) {
+										uni.downloadFile({
+											url: logo,
+											success: (res2) => {
+												ctx.drawImage(res2
+													.tempFilePath, 20, 20,
+													260, 260);
+												ctx.draw();
+												uni.hideLoading();
+												this.isFinishCanvas = true;
+											},
+										});
+									} else {
+										console.log('生成画布成功');
+										ctx.draw();
+										uni.hideLoading();
+										this.isFinishCanvas = true;
+									}
+								},
+							});
+						},
+					});
+				});
+			},
+
+			// 保存图片
+			saveImage() {
+				let that = this;
+				uni.canvasToTempFilePath({
+					x: 0,
+					y: 0,
+					width: 300,
+					height: 520,
+					canvasId: 'myCanvas',
+					success: function(res) {
+						uni.saveImageToPhotosAlbum({
+							filePath: res.tempFilePath,
+							success: function() {
+								that.$successToast('保存成功');
+							},
+						});
+					},
+				});
+			},
+
+			// 关闭canvas
+			closeCanvas() {
+				this.isShowCanvas = false;
+				uni.hideLoading();
+			},
+		},
+	};
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #f4f2f2;
+		box-sizing: border-box;
+		padding-bottom: 100rpx;
+	}
+
+	.recommender-container {
+		position: fixed;
+		top: 20rpx;
+		left: 0;
+		z-index: 99;
+		display: flex;
+		justify-content: center;
+		width: 100%;
+
+		.content {
+			font-size: 28rpx;
+			color: #ffffff;
+			background: rgba($color: #000000, $alpha: 0.8);
+			display: flex;
+			padding: 0 15rpx;
+			height: 60rpx;
+			border-radius: 60rpx;
+			justify-content: center;
+			align-items: center;
+
+			image {
+				width: 40rpx;
+				height: 40rpx;
+				display: block;
+				border-radius: 50%;
+				margin-right: 10rpx;
+			}
+
+			.name {
+				max-width: 160rpx;
+				margin-right: 6rpx;
+			}
+		}
+	}
+
+	.swiper-container {
+		position: relative;
+
+		swiper {
+			height: 750rpx;
+		}
+
+		.image {
+			width: 750rpx;
+			height: 750rpx;
+			display: block;
+			margin: 0 auto;
+			overflow: hidden;
+			position: relative;
+
+			.img {
+				width: 750rpx;
+				height: 750rpx;
+				display: block;
+			}
+
+			.water {
+				width: 750rpx;
+				height: 750rpx;
+				display: block;
+				position: absolute;
+				left: 0;
+				top: 0;
+				z-index: 1;
+			}
+		}
+
+		// image {
+		// 	height: 750rpx;
+		// 	width: 750rpx;
+		// 	display: block;
+		// 	margin: 0 auto;
+		// 	overflow: hidden;
+		// }
+		video {
+			height: 750rpx;
+			width: 750rpx;
+			display: block;
+			margin: 0 auto;
+			overflow: hidden;
+		}
+
+		.nums {
+			position: absolute;
+			right: 20rpx;
+			bottom: 20rpx;
+			background: rgba($color: #000000, $alpha: 0.2);
+			border-radius: 8rpx;
+			line-height: 48rpx;
+			padding: 0 12rpx;
+			font-size: 28rpx;
+			color: #ffffff;
+		}
+	}
+
+	.video-container {
+		position: fixed;
+		right: 20rpx;
+		bottom: 300rpx;
+		z-index: -99;
+
+		&.isFixed {
+			z-index: 99;
+		}
+
+		.content {
+			position: relative;
+		}
+
+		video {
+			height: 200rpx;
+			width: 375rpx;
+		}
+
+		.close {
+			position: absolute;
+			right: 0;
+			top: 0;
+			z-index: 100;
+			background: rgba($color: #000000, $alpha: 0.4);
+			padding: 10rpx;
+
+			image {
+				width: 28rpx;
+				height: 28rpx;
+				display: block;
+			}
+		}
+	}
+
+	.seckill-container {
+		height: 120rpx;
+		background: linear-gradient(-90deg, rgba(255, 37, 118, 1) 0%, #ff5648 100%);
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		padding: 0 20rpx;
+		position: relative;
+
+		.clock {
+			position: absolute;
+			right: 220rpx;
+			top: 20rpx;
+
+			image {
+				width: 74rpx;
+				height: 72rpx;
+				display: block;
+			}
+		}
+
+		.price-1 {
+			font-size: 40rpx;
+			color: #ffffff;
+			line-height: 44rpx;
+		}
+
+		.price-2 {
+			font-size: 28rpx;
+			line-height: 32rpx;
+			color: #dddddd;
+			text-decoration: line-through;
+		}
+
+		.right {
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+
+			text {
+				font-size: 24rpx;
+				color: #ffffff;
+			}
+
+			.time {
+				font-size: 24rpx;
+				color: #ffffff;
+				display: flex;
+				align-items: center;
+				margin-top: 6rpx;
+
+				text {
+					width: 40rpx;
+					height: 40rpx;
+					background: #ffffff;
+					border-radius: 4rpx;
+					color: #ff2775;
+					font-size: 24rpx;
+					line-height: 40rpx;
+					text-align: center;
+					margin: 0 4rpx;
+				}
+			}
+		}
+	}
+	
+	.tags2 {
+		display: flex;
+		flex-wrap: wrap;
+		.it {
+			font-size: 20rpx;
+			height: 30rpx;
+			line-height: 30rpx;
+			padding: 0 6rpx;
+			margin-right: 10rpx;
+			border: 1px solid #FE781F;
+			color: #FE781F;
+			box-sizing: border-box;
+			margin-top: 10rpx;
+			display: flex;
+			align-items: center;
+			flex-direction: row;
+			border-radius: 10rpx;
+		}
+	}
+
+	.main-container {
+		background: #ffffff;
+		padding: 20rpx 20rpx 0;
+
+		.title {
+			font-size: 32rpx;
+			color: #333333;
+			line-height: 40rpx;
+			font-weight: 600;
+		}
+
+		.des {
+			font-size: 24rpx;
+			color: #999999;
+			line-height: 28rpx;
+			margin-top: 8rpx;
+		}
+
+		.stock {
+			display: flex;
+			justify-content: space-between;
+			align-items: flex-end;
+			margin-top: 20rpx;
+			padding-bottom: 20rpx;
+
+			.left {
+				display: flex;
+				align-items: center;
+
+				text {
+					font-size: 24rpx;
+					color: #666666;
+				}
+
+				.progress-box {
+					width: 140rpx;
+					border-radius: 6px;
+					overflow: hidden;
+					margin-left: 10rpx;
+				}
+			}
+
+			.right {
+				font-size: 28rpx;
+				color: #999999;
+				display: flex;
+				align-items: center;
+
+				image {
+					width: 20rpx;
+					height: 20rpx;
+					display: block;
+					margin-left: 10rpx;
+				}
+			}
+		}
+
+		.price {
+			display: flex;
+			justify-content: space-between;
+			align-items: flex-end;
+			// margin-top: 10rpx;
+			padding-bottom: 20rpx;
+
+			.left {
+				display: flex;
+				flex-direction: column;
+			}
+
+			.price-1 {
+				font-size: 32rpx;
+				color: #ff3f42;
+				line-height: 36rpx;
+			}
+
+			.price-2 {
+				font-size: 26rpx;
+				color: #666666;
+				line-height: 30rpx;
+				text-decoration: line-through;
+			}
+
+			.right {
+				font-size: 28rpx;
+				color: #999999;
+				display: flex;
+				align-items: center;
+
+				image {
+					width: 20rpx;
+					height: 20rpx;
+					display: block;
+					margin-left: 10rpx;
+				}
+			}
+		}
+
+		.bottom {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			height: 76rpx;
+			border-top: 1px solid #eaeaea;
+			font-size: 28rpx;
+			color: #666666;
+		}
+	}
+
+	.line-container {
+		background: #ffffff;
+		margin-top: 20rpx;
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		height: 88rpx;
+		font-size: 28rpx;
+		color: #333333;
+		padding: 0 20rpx;
+
+		text {
+			color: #fe781f;
+		}
+	}
+
+	.detail-container {
+		background: #ffffff;
+		margin-top: 20rpx;
+
+		.title {
+			font-size: 32rpx;
+			color: #333333;
+			line-height: 88rpx;
+			text-align: center;
+			font-weight: 600;
+		}
+
+		.content {
+			image {
+				width: 100%;
+			}
+		}
+	}
+
+	.evaluate-container {
+		background: #ffffff;
+		margin-top: 20rpx;
+
+		.title {
+			font-size: 32rpx;
+			color: #333333;
+			line-height: 88rpx;
+			text-align: center;
+			font-weight: 600;
+		}
+
+		.list {
+			display: flex;
+			overflow-x: scroll;
+			padding: 0 20rpx;
+
+			.item {
+				width: 650rpx;
+				padding-right: 30rpx;
+				flex-shrink: 0;
+
+				&:last-child {
+					padding-right: 20rpx;
+				}
+
+				&.onlyOne {
+					width: 710rpx;
+				}
+
+				.top {
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+
+					.user {
+						display: flex;
+						align-items: center;
+
+						image {
+							width: 80rpx;
+							height: 80rpx;
+							display: block;
+							border-radius: 50%;
+							margin-right: 20rpx;
+						}
+
+						.name {
+							font-size: 28rpx;
+							color: #333333;
+							width: 250rpx;
+						}
+					}
+
+					.date {
+						font-size: 28rpx;
+						color: #999999;
+					}
+				}
+
+				.rate {
+					margin-top: 14rpx;
+
+					.it {
+						display: flex;
+						align-items: center;
+						font-size: 24rpx;
+						color: #666666;
+						margin-top: 5rpx;
+
+						&>text {
+							margin-right: 10rpx;
+						}
+					}
+				}
+
+				.tags {
+					display: flex;
+					flex-wrap: wrap;
+
+					.it {
+						line-height: 44rpx;
+						padding: 0 15rpx;
+						border: 1px solid #eaeaea;
+						border-radius: 44rpx;
+						font-size: 24rpx;
+						margin-right: 14rpx;
+						margin-top: 14rpx;
+						color: #666666;
+					}
+				}
+
+				.content {
+					font-size: 28rpx;
+					color: #333333;
+					margin-top: 14rpx;
+				}
+
+				.images {
+					display: flex;
+					flex-wrap: wrap;
+					margin-top: 14rpx;
+
+					image {
+						width: 140rpx;
+						height: 140rpx;
+						margin-right: 20rpx;
+						margin-bottom: 20rpx;
+					}
+				}
+			}
+		}
+
+		.more {
+			display: flex;
+			justify-content: center;
+			padding: 10rpx 0 30rpx;
+
+			.btn {
+				width: 220rpx;
+				height: 68rpx;
+				line-height: 68rpx;
+				text-align: center;
+				border-radius: 68rpx;
+				border: 1px solid #eaeaea;
+				font-size: 28rpx;
+				color: #666666;
+			}
+		}
+	}
+
+	.bottom-container {
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		width: 100%;
+		box-sizing: border-box;
+		padding: 0 20rpx;
+		background: #ffffff;
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		height: 100rpx;
+		border-top: 1px solid #eaeaea;
+
+		.left {
+			display: flex;
+			width: 280rpx;
+
+			.item {
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				justify-content: center;
+				margin-right: 40rpx;
+				position: relative;
+				width: 66rpx;
+
+				&:last-child {
+					margin-right: 0;
+				}
+
+				image {
+					width: 40rpx;
+					height: 40rpx;
+					display: block;
+				}
+
+				text {
+					font-size: 22rpx;
+					color: #333333;
+					margin-top: 4rpx;
+				}
+
+				.dot {
+					position: absolute;
+					right: -4rpx;
+					top: -8rpx;
+					background: #ff3f42;
+					width: 32rpx;
+					height: 32rpx;
+					line-height: 32rpx;
+					text-align: center;
+					border-radius: 32rpx;
+					font-size: 20rpx;
+					color: #ffffff;
+				}
+			}
+		}
+
+		.right {
+			display: flex;
+
+			.button {
+				width: 190rpx;
+				height: 80rpx;
+				line-height: 80rpx;
+				text-align: center;
+				border-radius: 80rpx;
+				font-size: 28rpx;
+				color: #ffffff;
+
+				&.cart {
+					background: #fe781f;
+				}
+
+				&.buy {
+					background: #ff3f42;
+					margin-left: 10rpx;
+				}
+
+				&.sec {
+					background: linear-gradient(-90deg, #ff3f42 0%, #fe781f 100%);
+				}
+			}
+		}
+	}
+
+	.cart-container {
+		padding: 50rpx 20rpx 30rpx;
+
+		.main {
+			display: flex;
+			padding: 20rpx 0;
+			border-bottom: 1px solid #eaeaea;
+
+			image {
+				width: 200rpx;
+				height: 200rpx;
+				display: block;
+				flex-shrink: 0;
+			}
+
+			.right {
+				margin-left: 26rpx;
+				display: flex;
+				flex-direction: column;
+				justify-content: space-between;
+
+				.title {
+					font-size: 28rpx;
+					color: #333333;
+					line-height: 36rpx;
+				}
+
+				.price {
+					display: flex;
+					flex-direction: column;
+				}
+
+				.price-1 {
+					font-size: 32rpx;
+					color: #ff3f42;
+					line-height: 36rpx;
+				}
+
+				.price-2 {
+					font-size: 26rpx;
+					color: #666666;
+					line-height: 30rpx;
+					text-decoration: line-through;
+				}
+
+				.stock {
+					font-size: 24rpx;
+					color: #999999;
+				}
+			}
+		}
+
+		.attr {
+			padding: 20rpx 0;
+			border-bottom: 1px solid #eaeaea;
+
+			.title {
+				font-size: 28rpx;
+				color: #333333;
+			}
+
+			.list {
+				display: flex;
+				flex-wrap: wrap;
+
+				.item {
+					margin-top: 16rpx;
+					padding: 10rpx 16rpx;
+					font-size: 24rpx;
+					color: #666666;
+					background: #f5f5f5;
+					border-radius: 5rpx;
+					margin-right: 16rpx;
+
+					&.current {
+						color: #ff3f42;
+						background: rgba($color: #ff3f42, $alpha: 0.2);
+					}
+				}
+			}
+		}
+
+		.num {
+			padding: 20rpx 0;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+
+			.title {
+				font-size: 28rpx;
+				color: #333333;
+			}
+		}
+
+		.button {
+			text-align: center;
+			line-height: 74rpx;
+			border-radius: 74rpx;
+			background: linear-gradient(-90deg, #ff3f42 0%, #fe781f 100%);
+			font-size: 28rpx;
+			color: #ffffff;
+			margin-top: 20rpx;
+		}
+	}
+
+	.package-container {
+		padding: 30rpx 20rpx;
+
+		.main {
+			max-height: 75vh;
+			overflow-y: scroll;
+
+			.group {
+				border-bottom: 1px solid #eaeaea;
+
+				&:last-child {
+					border: none;
+				}
+
+				.title {
+					font-size: 28rpx;
+					color: #ff3f42;
+					line-height: 28rpx;
+					margin: 20rpx 0;
+				}
+
+				.goods-list {
+					.item {
+						display: flex;
+						align-items: center;
+						background: #ffffff;
+						margin-bottom: 20rpx;
+
+						image {
+							width: 180rpx;
+							height: 180rpx;
+							display: block;
+							margin-right: 20rpx;
+							flex-shrink: 0;
+						}
+
+						.right {
+							flex: 1;
+							height: 190rpx;
+							display: flex;
+							justify-content: space-between;
+							flex-direction: column;
+
+							.name {
+								font-size: 28rpx;
+								color: #333333;
+								line-height: 36rpx;
+								height: 72rpx;
+							}
+
+							.des {
+								font-size: 24rpx;
+								color: #999999;
+								line-height: 36rpx;
+							}
+
+							.bottom {
+								display: flex;
+								justify-content: space-between;
+								align-items: center;
+
+								.price {
+									display: flex;
+									flex-direction: column;
+								}
+
+								.price-1 {
+									font-size: 32rpx;
+									color: #ff3f42;
+									line-height: 36rpx;
+								}
+
+								.price-2 {
+									font-size: 26rpx;
+									color: #666666;
+									line-height: 30rpx;
+									text-decoration: line-through;
+								}
+							}
+						}
+					}
+				}
+			}
+		}
+
+		.button {
+			text-align: center;
+			line-height: 74rpx;
+			border-radius: 74rpx;
+			background: linear-gradient(-90deg, #ff3f42 0%, #fe781f 100%);
+			font-size: 28rpx;
+			color: #ffffff;
+			margin-top: 20rpx;
+		}
+	}
+
+	.sharelist-container {
+		padding: 30rpx 0;
+		display: flex;
+
+		button {
+			background: none;
+			border-radius: 0;
+
+			&::after {
+				border: none;
+			}
+		}
+
+		.item {
+			display: flex;
+			width: 50%;
+			flex-direction: column;
+			align-items: center;
+
+			image {
+				width: 100rpx;
+				height: 100rpx;
+				display: block;
+				margin-bottom: 20rpx;
+			}
+
+			text {
+				font-size: 28rpx;
+				line-height: 32rpx;
+				color: #333333;
+			}
+		}
+	}
+
+	.canvas-container {
+		position: fixed;
+		left: 50%;
+		top: 50%;
+		z-index: 999;
+		margin-left: -150px;
+		margin-top: -280px;
+
+		.button {
+			display: flex;
+			justify-content: center;
+
+			text {
+				display: block;
+				width: 280rpx;
+				height: 70rpx;
+				border-radius: 70rpx;
+				background: linear-gradient(-90deg, #ff3f42 0%, #fe781f 100%);
+				font-size: 28rpx;
+				color: #ffffff;
+				text-align: center;
+				line-height: 70rpx;
+				margin-top: 20rpx;
+			}
+		}
+	}
+
+	.phone-dialog {
+		padding: 40rpx;
+		box-sizing: border-box;
+
+		.content {
+			margin-top: 30rpx;
+			margin-bottom: 30rpx;
+			line-height: 50rpx;
+
+			text {
+				color: #9d9d9d;
+			}
+		}
+
+		.btn {
+			display: flex;
+			justify-content: center;
+			margin-top: 60rpx;
+
+			button::after {
+				border: none;
+			}
+
+			button {
+				width: 180rpx;
+				height: 70rpx;
+				line-height: 70rpx;
+				margin: 0;
+				font-size: 28rpx;
+				margin: 0 30rpx;
+
+				&:first-child {
+					background: #f5f5f5;
+					color: #00ba5c;
+				}
+			}
+		}
+	}
 </style>

packageGoods/pages/evaluate.vue

@@ -1,365 +1,365 @@
-<template>
-  <view class="app-container">
-    <view class="top-container" v-if="dataList.length">
-      <view class="top">
-        <view class="left">
-          <text>综合评分</text
-          ><uni-rate
-            :size="18"
-            :margin="4"
-            :value="5"
-            color="#fff"
-            active-color="#FE781F"
-            :readonly="true"
-          />
-        </view>
-        <view class="right">{{ countDetail.goodRate }}%好评</view>
-      </view>
-      <view class="tabs">
-        <view
-          class="item"
-          :class="currentTab === '' ? 'current' : ''"
-          @tap="changeTabs('')"
-          >全部</view
-        >
-        <block v-for="(item, index) in countDetail.tagCountList" :key="index">
-          <view
-            class="item"
-            :class="currentTab === item.tag ? 'current' : ''"
-            @tap="changeTabs(item.tag)"
-            >{{ item.tag }}({{ item.total }})</view
-          >
-        </block>
-      </view>
-    </view>
-
-    <view class="list-container">
-      <view class="item" v-for="(item, index) in dataList" :key="index">
-        <view class="top">
-          <view class="user">
-            <image
-              :src="item.avatar"
-              mode="aspectFill"
-              v-if="item.avatar.indexOf('http') >= 0"
-            ></image>
-            <image
-              :src="imageUrl + item.avatar"
-              mode="aspectFill"
-              v-else
-            ></image>
-            <view class="name ellipsis">{{ item.userName }}</view>
-          </view>
-          <view class="date">{{ item.createTime }}</view>
-        </view>
-        <view class="rate">
-          <view class="it"
-            ><text>商品质量</text
-            ><uni-rate
-              :size="14"
-              :margin="4"
-              :value="item.commentGoods"
-              color="#fff"
-              active-color="#FE781F"
-              :readonly="true"
-          /></view>
-          <view class="it"
-            ><text>服务质量</text
-            ><uni-rate
-              :size="14"
-              :margin="4"
-              :value="item.commentService"
-              color="#fff"
-              active-color="#FE781F"
-              :readonly="true"
-          /></view>
-          <view class="it"
-            ><text>配送质量</text
-            ><uni-rate
-              :size="14"
-              :margin="4"
-              :value="item.commentExpress"
-              color="#fff"
-              active-color="#FE781F"
-              :readonly="true"
-          /></view>
-        </view>
-        <view class="tags">
-          <view class="it" v-for="(it, idx) in item.tags" :key="idx">{{
-            it
-          }}</view>
-        </view>
-        <!-- <view class="tagss">
-					<view class="it" v-for="(it, idx) in item.tags">#{{it}}#</view>
-				</view> -->
-        <view class="content">{{ item.content }}</view>
-        <view class="images" v-if="item.imgs && item.imgs.length > 0">
-          <image
-            v-for="(it, idx) in item.imgs"
-            :key="idx"
-            :src="it"
-            @tap="previewEvaluateImage(it, item.imgs)"
-          ></image>
-        </view>
-      </view>
-    </view>
-    <no-data v-if="!dataList.length" :showText="'暂无记录'"></no-data>
-    <loading-text
-      v-if="dataList.length"
-      :loading="loading"
-      :noMore="noMore"
-    ></loading-text>
-  </view>
-</template>
-
-<script>
-import { mapState } from 'vuex';
-
-export default {
-  data() {
-    return {
-      imageUrl: this.$imageUrl,
-      configInfo: uni.getStorageSync('configInfo'),
-      goodsId: null,
-      countDetail: {},
-      dataList: [],
-      total: 0,
-      pageNum: 1,
-      pageSize: 10,
-      noMore: false,
-      loading: false,
-      currentTab: '',
-    };
-  },
-
-  computed: {
-    ...mapState(['userInfo', 'isLogin', 'userId']),
-  },
-
-  onLoad({ goodsId }) {
-    this.goodsId = goodsId;
-    this.getList();
-    this.getCount();
-  },
-
-  // 下拉刷新
-  onPullDownRefresh() {
-    this.pageNum = 1;
-    this.getList();
-    this.getCount();
-  },
-
-  // 上拉加载
-  onReachBottom() {
-    this.getList(1);
-  },
-
-  methods: {
-    // 获取统计
-    getCount() {
-      this.$axios({
-        url: '/order/comment/goods/count',
-        method: 'get',
-        params: {
-          goodsId: this.goodsId,
-        },
-      }).then((res) => {
-        this.countDetail = res.data;
-      });
-    },
-
-    // 获取列表
-    getList(loadMore) {
-      if (this.noMore && loadMore) return;
-      this.noMore = false;
-      if (!loadMore) {
-        this.pageNum = 1;
-      } else {
-        this.loading = true;
-      }
-      this.$axios({
-        url: '/order/comment/goods',
-        method: 'get',
-        params: {
-          pageNo: this.pageNum,
-          pageSize: this.pageSize,
-          goodsId: this.goodsId,
-          tag: this.currentTab,
-        },
-        isLoading: !loadMore,
-      }).then((res) => {
-        let _list = res.data.records;
-        let pageTotal = res.data.pages;
-        if (this.pageNum >= pageTotal) {
-          this.noMore = true;
-        }
-        if (_list.length) {
-          this.pageNum += 1;
-        }
-        if (loadMore) {
-          this.dataList = this.dataList.concat(_list);
-          this.loading = false;
-        } else {
-          this.dataList = _list;
-        }
-        this.total = res.data.total || 0;
-
-        uni.stopPullDownRefresh();
-      });
-    },
-
-    changeTabs(tag) {
-      this.currentTab = tag;
-      this.pageNum = 1;
-      this.getList();
-    },
-
-    // 预览评价图片
-    previewEvaluateImage(url, imgs) {
-      uni.previewImage({
-        urls: imgs,
-        current: url,
-      });
-    },
-  },
-};
-</script>
-
-<style lang="scss">
-.app-container {
-  background: #f4f2f2;
-  box-sizing: border-box;
-}
-.top-container {
-  background: #ffffff;
-  padding: 20rpx;
-  margin-bottom: 20rpx;
-  .top {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    .left {
-      display: flex;
-      align-items: center;
-      font-size: 28rpx;
-      color: #333333;
-      margin-top: 5rpx;
-      & > text {
-        margin-right: 14rpx;
-      }
-    }
-    .right {
-      font-size: 24rpx;
-      color: #666666;
-    }
-  }
-  .tabs {
-    display: flex;
-    overflow-x: scroll;
-    .item {
-      flex-shrink: 0;
-      height: 52rpx;
-      line-height: 52rpx;
-      border-radius: 52rpx;
-      padding: 0 25rpx;
-      border: 1px solid #eaeaea;
-      color: #333333;
-      font-size: 24rpx;
-      margin-right: 16rpx;
-      margin-top: 16rpx;
-      &.current {
-        border: 1px solid #fe781f;
-        background: #fe781f;
-        color: #ffffff;
-      }
-    }
-  }
-}
-.list-container {
-  padding: 0 20rpx;
-  background: #ffffff;
-  .item {
-    padding: 20rpx 0;
-    border-bottom: 1px solid #eaeaea;
-    &:last-child {
-      border-bottom: none;
-    }
-    .top {
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-      .user {
-        display: flex;
-        align-items: center;
-        image {
-          width: 80rpx;
-          height: 80rpx;
-          display: block;
-          border-radius: 50%;
-          margin-right: 20rpx;
-        }
-        .name {
-          font-size: 28rpx;
-          color: #333333;
-          width: 300rpx;
-        }
-      }
-      .date {
-        font-size: 28rpx;
-        color: #999999;
-      }
-    }
-    .rate {
-      margin-top: 14rpx;
-      .it {
-        display: flex;
-        align-items: center;
-        font-size: 24rpx;
-        color: #666666;
-        margin-top: 5rpx;
-        & > text {
-          margin-right: 10rpx;
-        }
-      }
-    }
-    .tags {
-      display: flex;
-      flex-wrap: wrap;
-      .it {
-        line-height: 44rpx;
-        padding: 0 15rpx;
-        border: 1px solid #eaeaea;
-        border-radius: 44rpx;
-        font-size: 24rpx;
-        margin-right: 14rpx;
-        margin-top: 14rpx;
-        color: #666666;
-      }
-    }
-    .tagss {
-      display: flex;
-      flex-wrap: wrap;
-      margin-top: 14rpx;
-      .it {
-        font-size: 24rpx;
-        color: #fe781f;
-        margin-right: 6rpx;
-      }
-    }
-    .content {
-      font-size: 28rpx;
-      color: #333333;
-      margin-top: 14rpx;
-    }
-    .images {
-      display: flex;
-      flex-wrap: wrap;
-      image {
-        width: 140rpx;
-        height: 140rpx;
-        margin-right: 20rpx;
-        margin-top: 20rpx;
-      }
-    }
-  }
-}
-</style>
+<template>
+  <view class="app-container">
+    <view class="top-container" v-if="dataList.length">
+      <view class="top">
+        <view class="left">
+          <text>综合评分</text
+          ><uni-rate
+            :size="18"
+            :margin="4"
+            :value="5"
+            color="#fff"
+            active-color="#FE781F"
+            :readonly="true"
+          />
+        </view>
+        <view class="right">{{ countDetail.goodRate }}%好评</view>
+      </view>
+      <view class="tabs">
+        <view
+          class="item"
+          :class="currentTab === '' ? 'current' : ''"
+          @tap="changeTabs('')"
+          >全部</view
+        >
+        <block v-for="(item, index) in countDetail.tagCountList" :key="index">
+          <view
+            class="item"
+            :class="currentTab === item.tag ? 'current' : ''"
+            @tap="changeTabs(item.tag)"
+            >{{ item.tag }}({{ item.total }})</view
+          >
+        </block>
+      </view>
+    </view>
+
+    <view class="list-container">
+      <view class="item" v-for="(item, index) in dataList" :key="index">
+        <view class="top">
+          <view class="user">
+            <image
+              :src="item.avatar"
+              mode="aspectFill"
+              v-if="item.avatar.indexOf('http') >= 0"
+            ></image>
+            <image
+              :src="imageUrl + item.avatar"
+              mode="aspectFill"
+              v-else
+            ></image>
+            <view class="name ellipsis">{{ item.userName }}</view>
+          </view>
+          <view class="date">{{ item.createTime }}</view>
+        </view>
+        <view class="rate">
+          <view class="it"
+            ><text>商品质量</text
+            ><uni-rate
+              :size="14"
+              :margin="4"
+              :value="item.commentGoods"
+              color="#fff"
+              active-color="#FE781F"
+              :readonly="true"
+          /></view>
+          <view class="it"
+            ><text>服务质量</text
+            ><uni-rate
+              :size="14"
+              :margin="4"
+              :value="item.commentService"
+              color="#fff"
+              active-color="#FE781F"
+              :readonly="true"
+          /></view>
+          <view class="it"
+            ><text>配送质量</text
+            ><uni-rate
+              :size="14"
+              :margin="4"
+              :value="item.commentExpress"
+              color="#fff"
+              active-color="#FE781F"
+              :readonly="true"
+          /></view>
+        </view>
+        <view class="tags">
+          <view class="it" v-for="(it, idx) in item.tags" :key="idx">{{
+            it
+          }}</view>
+        </view>
+        <!-- <view class="tagss">
+					<view class="it" v-for="(it, idx) in item.tags">#{{it}}#</view>
+				</view> -->
+        <view class="content">{{ item.content }}</view>
+        <view class="images" v-if="item.imgs && item.imgs.length > 0">
+          <image
+            v-for="(it, idx) in item.imgs"
+            :key="idx"
+            :src="it"
+            @tap="previewEvaluateImage(it, item.imgs)"
+          ></image>
+        </view>
+      </view>
+    </view>
+    <no-data v-if="!dataList.length" :showText="'暂无记录'"></no-data>
+    <loading-text
+      v-if="dataList.length"
+      :loading="loading"
+      :noMore="noMore"
+    ></loading-text>
+  </view>
+</template>
+
+<script>
+import { mapState } from 'vuex';
+
+export default {
+  data() {
+    return {
+      imageUrl: this.$imageUrl,
+      configInfo: uni.getStorageSync('configInfo'),
+      goodsId: null,
+      countDetail: {},
+      dataList: [],
+      total: 0,
+      pageNum: 1,
+      pageSize: 10,
+      noMore: false,
+      loading: false,
+      currentTab: '',
+    };
+  },
+
+  computed: {
+    ...mapState(['userInfo', 'isLogin', 'userId']),
+  },
+
+  onLoad({ goodsId }) {
+    this.goodsId = goodsId;
+    this.getList();
+    this.getCount();
+  },
+
+  // 下拉刷新
+  onPullDownRefresh() {
+    this.pageNum = 1;
+    this.getList();
+    this.getCount();
+  },
+
+  // 上拉加载
+  onReachBottom() {
+    this.getList(1);
+  },
+
+  methods: {
+    // 获取统计
+    getCount() {
+      this.$axios({
+        url: '/order/comment/goods/count',
+        method: 'get',
+        params: {
+          goodsId: this.goodsId,
+        },
+      }).then((res) => {
+        this.countDetail = res.data;
+      });
+    },
+
+    // 获取列表
+    getList(loadMore) {
+      if (this.noMore && loadMore) return;
+      this.noMore = false;
+      if (!loadMore) {
+        this.pageNum = 1;
+      } else {
+        this.loading = true;
+      }
+      this.$axios({
+        url: '/order/comment/goods',
+        method: 'get',
+        params: {
+          pageNo: this.pageNum,
+          pageSize: this.pageSize,
+          goodsId: this.goodsId,
+          tag: this.currentTab,
+        },
+        isLoading: !loadMore,
+      }).then((res) => {
+        let _list = res.data.records;
+        let pageTotal = res.data.pages;
+        if (this.pageNum >= pageTotal) {
+          this.noMore = true;
+        }
+        if (_list.length) {
+          this.pageNum += 1;
+        }
+        if (loadMore) {
+          this.dataList = this.dataList.concat(_list);
+          this.loading = false;
+        } else {
+          this.dataList = _list;
+        }
+        this.total = res.data.total || 0;
+
+        uni.stopPullDownRefresh();
+      });
+    },
+
+    changeTabs(tag) {
+      this.currentTab = tag;
+      this.pageNum = 1;
+      this.getList();
+    },
+
+    // 预览评价图片
+    previewEvaluateImage(url, imgs) {
+      uni.previewImage({
+        urls: imgs,
+        current: url,
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss">
+.app-container {
+  background: #f4f2f2;
+  box-sizing: border-box;
+}
+.top-container {
+  background: #ffffff;
+  padding: 20rpx;
+  margin-bottom: 20rpx;
+  .top {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    .left {
+      display: flex;
+      align-items: center;
+      font-size: 28rpx;
+      color: #333333;
+      margin-top: 5rpx;
+      & > text {
+        margin-right: 14rpx;
+      }
+    }
+    .right {
+      font-size: 24rpx;
+      color: #666666;
+    }
+  }
+  .tabs {
+    display: flex;
+    overflow-x: scroll;
+    .item {
+      flex-shrink: 0;
+      height: 52rpx;
+      line-height: 52rpx;
+      border-radius: 52rpx;
+      padding: 0 25rpx;
+      border: 1px solid #eaeaea;
+      color: #333333;
+      font-size: 24rpx;
+      margin-right: 16rpx;
+      margin-top: 16rpx;
+      &.current {
+        border: 1px solid #fe781f;
+        background: #fe781f;
+        color: #ffffff;
+      }
+    }
+  }
+}
+.list-container {
+  padding: 0 20rpx;
+  background: #ffffff;
+  .item {
+    padding: 20rpx 0;
+    border-bottom: 1px solid #eaeaea;
+    &:last-child {
+      border-bottom: none;
+    }
+    .top {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      .user {
+        display: flex;
+        align-items: center;
+        image {
+          width: 80rpx;
+          height: 80rpx;
+          display: block;
+          border-radius: 50%;
+          margin-right: 20rpx;
+        }
+        .name {
+          font-size: 28rpx;
+          color: #333333;
+          width: 300rpx;
+        }
+      }
+      .date {
+        font-size: 28rpx;
+        color: #999999;
+      }
+    }
+    .rate {
+      margin-top: 14rpx;
+      .it {
+        display: flex;
+        align-items: center;
+        font-size: 24rpx;
+        color: #666666;
+        margin-top: 5rpx;
+        & > text {
+          margin-right: 10rpx;
+        }
+      }
+    }
+    .tags {
+      display: flex;
+      flex-wrap: wrap;
+      .it {
+        line-height: 44rpx;
+        padding: 0 15rpx;
+        border: 1px solid #eaeaea;
+        border-radius: 44rpx;
+        font-size: 24rpx;
+        margin-right: 14rpx;
+        margin-top: 14rpx;
+        color: #666666;
+      }
+    }
+    .tagss {
+      display: flex;
+      flex-wrap: wrap;
+      margin-top: 14rpx;
+      .it {
+        font-size: 24rpx;
+        color: #fe781f;
+        margin-right: 6rpx;
+      }
+    }
+    .content {
+      font-size: 28rpx;
+      color: #333333;
+      margin-top: 14rpx;
+    }
+    .images {
+      display: flex;
+      flex-wrap: wrap;
+      image {
+        width: 140rpx;
+        height: 140rpx;
+        margin-right: 20rpx;
+        margin-top: 20rpx;
+      }
+    }
+  }
+}
+</style>

packageGoods/pages/list.vue

@@ -1,310 +1,310 @@
-<template>
-  <view class="app-container">
-    <view class="top-container">
-      <view
-        class="item"
-        :class="screenType === 0 ? 'current' : ''"
-        @tap="changeScreen(0)"
-        >综合</view
-      >
-      <view
-        class="item"
-        :class="screenType === 1 ? 'current' : ''"
-        @tap="changeScreen(1)"
-        >销量</view
-      >
-      <view
-        class="item"
-        :class="screenType === 2 || screenType === 3 ? 'current' : ''"
-        @tap="changeScreen(2)"
-        >价格
-        <image src="@/static/icon/price_1.png" v-if="screenType === 2"></image>
-        <image src="@/static/icon/price_2.png" v-if="screenType === 3"></image>
-        <image
-          src="@/static/icon/price_0.png"
-          v-if="screenType != 2 && screenType != 3"
-        ></image>
-      </view>
-      <view
-        class="item"
-        :class="screenType === 4 ? 'current' : ''"
-        @tap="changeScreen(4)"
-        >上新</view
-      >
-    </view>
-    <view class="list-container">
-      <block v-for="(item, index) in goodsList" :key="index">
-        <view class="item" @tap="toGoodsDetail(item.goodsId)">
-          <view class="image">
-            <image :src="item.imgUrl" mode="aspectFill" class="img"></image>
-            <image
-              :src="item.logo"
-              mode="aspectFill"
-              class="water"
-              v-if="item.isShowWater"
-            ></image>
-          </view>
-          <view class="content">
-            <view class="title ellipsis-2">{{ item.goodsName }}</view>
-            <view class="bottom">
-              <view class="price">
-                <view class="price-1">¥{{ item.goodsPrice | numToFixed }}</view>
-                <view class="price-2"
-                  >¥{{ item.orgGoodsPrice | numToFixed }}</view
-                >
-              </view>
-              <view class="btn"
-                ><image src="@/static/icon/cart.png" mode="aspectFill"></image
-              ></view>
-            </view>
-          </view>
-        </view>
-      </block>
-    </view>
-    <no-data v-if="!goodsList.length" :showText="'暂无商品'"></no-data>
-    <loading-text
-      v-if="goodsList.length"
-      :loading="loading"
-      :noMore="noMore"
-    ></loading-text>
-
-    <!-- <drag-button :isDock="true" :customBar="true" ref="dragButton"></drag-button> -->
-  </view>
-</template>
-
-<script>
-// import dragButton from '@/components/drag-button.vue';
-
-export default {
-  // components:{
-  // 	dragButton
-  // },
-  data() {
-    return {
-      cid: '',
-      screenType: '',
-      goodsList: [],
-      pageNum: 1,
-      pageSize: 8,
-      noMore: false,
-      loading: false,
-    };
-  },
-
-  onShow() {
-    // this.$refs.dragButton.init();
-  },
-
-  onLoad({ cid, cname }) {
-    uni.setNavigationBarTitle({
-      title: cname,
-    });
-    this.cid = cid;
-    this.getGoodsList();
-  },
-
-  // 下拉刷新
-  onPullDownRefresh() {
-    this.pageNum = 1;
-    this.getGoodsList();
-  },
-
-  // 上拉加载
-  onReachBottom() {
-    this.getGoodsList(1);
-  },
-
-  methods: {
-    // 切换筛选类型
-    changeScreen(type) {
-      if (type != 2) {
-        if (this.screenType !== type) {
-          this.screenType = type;
-        } else {
-          this.screenType = '';
-        }
-      } else {
-        if (this.screenType != 2 && this.screenType != 3) {
-          this.screenType = 2;
-        } else if (this.screenType == 2) {
-          this.screenType = 3;
-        } else {
-          this.screenType = '';
-        }
-      }
-      this.pageNum = 1;
-      this.getGoodsList();
-    },
-
-    // 获取商品列表
-    getGoodsList(loadMore) {
-      if (this.noMore && loadMore) return;
-      this.noMore = false;
-      if (!loadMore) {
-        this.pageNum = 1;
-      } else {
-        this.loading = true;
-      }
-      this.$axios({
-        url: '/goods/list/sort/page',
-        method: 'get',
-        params: {
-          pageNum: this.pageNum,
-          pageSize: this.pageSize,
-          categoryId: this.cid,
-          sort: this.screenType,
-        },
-        isLoading: !loadMore,
-      }).then((res) => {
-        res.data.records.forEach((item) => {
-          if (item.logo && item.logoStartTime) {
-            item.isShowWater = this.$compareTime(
-              item.logoStartTime,
-              item.logoEndTime
-            );
-          } else {
-            item.isShowWater = false;
-          }
-        });
-        let _list = res.data.records;
-        let pageTotal = res.data.pages;
-        if (this.pageNum >= pageTotal) {
-          this.noMore = true;
-        }
-        if (_list.length) {
-          this.pageNum += 1;
-        }
-        if (loadMore) {
-          this.goodsList = this.goodsList.concat(_list);
-          this.loading = false;
-        } else {
-          this.goodsList = _list;
-        }
-
-        uni.stopPullDownRefresh();
-      });
-    },
-
-    toGoodsDetail(id) {
-      uni.navigateTo({
-        url: '/packageGoods/pages/detail?id=' + id,
-      });
-    },
-  },
-};
-</script>
-
-<style lang="scss">
-.app-container {
-  background: #f4f2f2;
-  padding-top: 88rpx;
-  box-sizing: border-box;
-}
-.top-container {
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 100%;
-  background: #ffffff;
-  display: flex;
-  .item {
-    width: 25%;
-    height: 88rpx;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    font-size: 30rpx;
-    color: #666666;
-    &.current {
-      color: #ff3f42;
-    }
-    image {
-      width: 20rpx;
-      height: 30rpx;
-      display: block;
-      margin-left: 10rpx;
-    }
-  }
-}
-.list-container {
-  display: flex;
-  flex-wrap: wrap;
-  padding: 20rpx;
-  .item {
-    width: 348rpx;
-    background: #ffffff;
-    margin-right: 14rpx;
-    margin-bottom: 20rpx;
-    border-radius: 20rpx;
-    overflow: hidden;
-    &:nth-child(2n) {
-      margin-right: 0;
-    }
-    .image {
-      width: 348rpx;
-      height: 348rpx;
-      flex-shrink: 0;
-      position: relative;
-      .img {
-        width: 348rpx;
-        height: 348rpx;
-        display: block;
-      }
-      .water {
-        width: 348rpx;
-        height: 348rpx;
-        display: block;
-        position: absolute;
-        left: 0;
-        top: 0;
-        z-index: 1;
-      }
-    }
-    .content {
-      padding: 15rpx 20rpx;
-      .title {
-        font-size: 30rpx;
-        color: #333333;
-        line-height: 36rpx;
-        font-weight: 600;
-        height: 72rpx;
-      }
-      .bottom {
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        margin-top: 10rpx;
-        .price {
-          display: flex;
-          flex-direction: column;
-        }
-        .price-1 {
-          font-size: 32rpx;
-          color: #ff3f42;
-          line-height: 36rpx;
-        }
-        .price-2 {
-          font-size: 26rpx;
-          color: #666666;
-          line-height: 30rpx;
-          text-decoration: line-through;
-        }
-        .btn {
-          width: 60rpx;
-          height: 60rpx;
-          background: #fe781f;
-          border-radius: 50%;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          image {
-            width: 41rpx;
-            height: 36rpx;
-            display: block;
-          }
-        }
-      }
-    }
-  }
-}
-</style>
+<template>
+  <view class="app-container">
+    <view class="top-container">
+      <view
+        class="item"
+        :class="screenType === 0 ? 'current' : ''"
+        @tap="changeScreen(0)"
+        >综合</view
+      >
+      <view
+        class="item"
+        :class="screenType === 1 ? 'current' : ''"
+        @tap="changeScreen(1)"
+        >销量</view
+      >
+      <view
+        class="item"
+        :class="screenType === 2 || screenType === 3 ? 'current' : ''"
+        @tap="changeScreen(2)"
+        >价格
+        <image src="@/static/icon/price_1.png" v-if="screenType === 2"></image>
+        <image src="@/static/icon/price_2.png" v-if="screenType === 3"></image>
+        <image
+          src="@/static/icon/price_0.png"
+          v-if="screenType != 2 && screenType != 3"
+        ></image>
+      </view>
+      <view
+        class="item"
+        :class="screenType === 4 ? 'current' : ''"
+        @tap="changeScreen(4)"
+        >上新</view
+      >
+    </view>
+    <view class="list-container">
+      <block v-for="(item, index) in goodsList" :key="index">
+        <view class="item" @tap="toGoodsDetail(item.goodsId)">
+          <view class="image">
+            <image :src="item.imgUrl" mode="aspectFill" class="img"></image>
+            <image
+              :src="item.logo"
+              mode="aspectFill"
+              class="water"
+              v-if="item.isShowWater"
+            ></image>
+          </view>
+          <view class="content">
+            <view class="title ellipsis-2">{{ item.goodsName }}</view>
+            <view class="bottom">
+              <view class="price">
+                <view class="price-1">¥{{ item.goodsPrice | numToFixed }}</view>
+                <view class="price-2"
+                  >¥{{ item.orgGoodsPrice | numToFixed }}</view
+                >
+              </view>
+              <view class="btn"
+                ><image src="@/static/icon/cart.png" mode="aspectFill"></image
+              ></view>
+            </view>
+          </view>
+        </view>
+      </block>
+    </view>
+    <no-data v-if="!goodsList.length" :showText="'暂无商品'"></no-data>
+    <loading-text
+      v-if="goodsList.length"
+      :loading="loading"
+      :noMore="noMore"
+    ></loading-text>
+
+    <!-- <drag-button :isDock="true" :customBar="true" ref="dragButton"></drag-button> -->
+  </view>
+</template>
+
+<script>
+// import dragButton from '@/components/drag-button.vue';
+
+export default {
+  // components:{
+  // 	dragButton
+  // },
+  data() {
+    return {
+      cid: '',
+      screenType: '',
+      goodsList: [],
+      pageNum: 1,
+      pageSize: 8,
+      noMore: false,
+      loading: false,
+    };
+  },
+
+  onShow() {
+    // this.$refs.dragButton.init();
+  },
+
+  onLoad({ cid, cname }) {
+    uni.setNavigationBarTitle({
+      title: cname,
+    });
+    this.cid = cid;
+    this.getGoodsList();
+  },
+
+  // 下拉刷新
+  onPullDownRefresh() {
+    this.pageNum = 1;
+    this.getGoodsList();
+  },
+
+  // 上拉加载
+  onReachBottom() {
+    this.getGoodsList(1);
+  },
+
+  methods: {
+    // 切换筛选类型
+    changeScreen(type) {
+      if (type != 2) {
+        if (this.screenType !== type) {
+          this.screenType = type;
+        } else {
+          this.screenType = '';
+        }
+      } else {
+        if (this.screenType != 2 && this.screenType != 3) {
+          this.screenType = 2;
+        } else if (this.screenType == 2) {
+          this.screenType = 3;
+        } else {
+          this.screenType = '';
+        }
+      }
+      this.pageNum = 1;
+      this.getGoodsList();
+    },
+
+    // 获取商品列表
+    getGoodsList(loadMore) {
+      if (this.noMore && loadMore) return;
+      this.noMore = false;
+      if (!loadMore) {
+        this.pageNum = 1;
+      } else {
+        this.loading = true;
+      }
+      this.$axios({
+        url: '/goods/list/sort/page',
+        method: 'get',
+        params: {
+          pageNum: this.pageNum,
+          pageSize: this.pageSize,
+          categoryId: this.cid,
+          sort: this.screenType,
+        },
+        isLoading: !loadMore,
+      }).then((res) => {
+        res.data.records.forEach((item) => {
+          if (item.logo && item.logoStartTime) {
+            item.isShowWater = this.$compareTime(
+              item.logoStartTime,
+              item.logoEndTime
+            );
+          } else {
+            item.isShowWater = false;
+          }
+        });
+        let _list = res.data.records;
+        let pageTotal = res.data.pages;
+        if (this.pageNum >= pageTotal) {
+          this.noMore = true;
+        }
+        if (_list.length) {
+          this.pageNum += 1;
+        }
+        if (loadMore) {
+          this.goodsList = this.goodsList.concat(_list);
+          this.loading = false;
+        } else {
+          this.goodsList = _list;
+        }
+
+        uni.stopPullDownRefresh();
+      });
+    },
+
+    toGoodsDetail(id) {
+      uni.navigateTo({
+        url: '/packageGoods/pages/detail?id=' + id,
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss">
+.app-container {
+  background: #f4f2f2;
+  padding-top: 88rpx;
+  box-sizing: border-box;
+}
+.top-container {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  background: #ffffff;
+  display: flex;
+  .item {
+    width: 25%;
+    height: 88rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 30rpx;
+    color: #666666;
+    &.current {
+      color: #ff3f42;
+    }
+    image {
+      width: 20rpx;
+      height: 30rpx;
+      display: block;
+      margin-left: 10rpx;
+    }
+  }
+}
+.list-container {
+  display: flex;
+  flex-wrap: wrap;
+  padding: 20rpx;
+  .item {
+    width: 348rpx;
+    background: #ffffff;
+    margin-right: 14rpx;
+    margin-bottom: 20rpx;
+    border-radius: 20rpx;
+    overflow: hidden;
+    &:nth-child(2n) {
+      margin-right: 0;
+    }
+    .image {
+      width: 348rpx;
+      height: 348rpx;
+      flex-shrink: 0;
+      position: relative;
+      .img {
+        width: 348rpx;
+        height: 348rpx;
+        display: block;
+      }
+      .water {
+        width: 348rpx;
+        height: 348rpx;
+        display: block;
+        position: absolute;
+        left: 0;
+        top: 0;
+        z-index: 1;
+      }
+    }
+    .content {
+      padding: 15rpx 20rpx;
+      .title {
+        font-size: 30rpx;
+        color: #333333;
+        line-height: 36rpx;
+        font-weight: 600;
+        height: 72rpx;
+      }
+      .bottom {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-top: 10rpx;
+        .price {
+          display: flex;
+          flex-direction: column;
+        }
+        .price-1 {
+          font-size: 32rpx;
+          color: #ff3f42;
+          line-height: 36rpx;
+        }
+        .price-2 {
+          font-size: 26rpx;
+          color: #666666;
+          line-height: 30rpx;
+          text-decoration: line-through;
+        }
+        .btn {
+          width: 60rpx;
+          height: 60rpx;
+          background: #fe781f;
+          border-radius: 50%;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          image {
+            width: 41rpx;
+            height: 36rpx;
+            display: block;
+          }
+        }
+      }
+    }
+  }
+}
+</style>

packageGoods/pages/order.vue

@@ -1,1256 +1,1256 @@
-<template>
-	<view class="app-container" :class="isNoticebar ? 'hasNoticebar' : ''">
-		<view class="noticebar" v-if="isNoticebar">
-			<uni-notice-bar v-if="noticeContent" scrollable="true" single="true" showClose="true" :text="noticeContent"
-				background-color="#f6e6e7" color="#de3749" @close="closeNoticebar"></uni-notice-bar>
-		</view>
-
-		<view class="address-container" @tap="chooseAddress">
-			<view class="left">
-				<view class="icon">
-					<image src="../../static/icon/address.png"></image>
-				</view>
-				<view class="nodata" v-if="!hasAddress">选择收货地址</view>
-				<view class="hasdata" v-else>
-					<view class="name">{{ addressInfo.name }}<text>{{ addressInfo.phone }}</text></view>
-					<view class="address ellipsis-2">{{ addressInfo.province }}{{ addressInfo.city
-            }}{{ addressInfo.area }}{{ addressInfo.street
-            }}{{ addressInfo.address }}{{ addressInfo.houseNo }}</view>
-				</view>
-			</view>
-			<image class="right" src="../../static/icon/right.png"></image>
-		</view>
-
-		<view class="card goods-container">
-			<view class="title">商品信息</view>
-			<block v-for="(item, index) in goodsList" :key="index">
-				<view>
-					<view class="item">
-						<image v-if="
-                item.logo && 
-				$compareTime(item.logoStartTime, item.logoEndTime) && item.mergeImage
-              " :src="item.mergeImage"></image>
-						<image v-else :src="item.imgUrl"></image>
-						<view class="right">
-							<view class="name ellipsis-2">{{ item.goodsName }}</view>
-							<view class="des">{{ item.specValue }}</view>
-							<view class="bottom">
-								<view class="price">
-									<view class="price-1">¥{{ item.price | numToFixed }}</view>
-									<view class="price-2">¥{{ item.orgPrice | numToFixed }}</view>
-								</view>
-
-								<u-number-box @tap.stop v-model="item.num" :min="1" :buttonSize="26"
-									iconStyle="font-size: 12px;" :disabled="!hasAddress"
-									@change="changeCount($event, index)">
-								</u-number-box>
-							</view>
-						</view>
-					</view>
-					<view style="box-sizing: border-box; padding: 10rpx 0">
-						<view class="guobutishi" v-if="
-                goodsList.length == 1 &&
-                item.num == 1 &&
-                [
-                  'GDYJKT',
-                  'GDYJBX',
-                  'GDYJXYJ',
-                  'GDYJXYYJ',
-                  'GDYJDZ',
-                  'GDYJRSQ',
-                ].includes(item.umsDiscountCode)
-              ">
-							<view class="guobutishi1">云闪付</view>
-							<view class="guobutishi2">用券新机补贴预估{{ (item.price * 0.2).toFixed(2) }}元</view>
-						</view>
-						<view class="guobutishi" v-if="
-                goodsList.length == 1 &&
-                item.num == 1 &&
-                [
-                  'GDEJKT',
-                  'GDEJBX',
-                  'GDEJXYJ',
-                  'GDEJXYYJ',
-                  'GDEJDZ',
-                  'GDEJRSQ',
-                ].includes(item.umsDiscountCode)
-              ">
-							<view class="guobutishi1">云闪付</view>
-							<view class="guobutishi2">用券新机补贴预估{{ (item.price * 0.15).toFixed(2) }}元</view>
-						</view>
-					</view>
-				</view>
-			</block>
-		</view>
-
-		<view class="card row-container">
-			<view class="item">
-				<view class="title">优惠券</view>
-				<view class="coupon" @tap="chooseCoupon">
-					<text v-if="hasCoupon">{{ couponInfo.couponName }}</text>
-					<text v-else style="color: #666666">未使用优惠券</text>
-					<image src="../../static/icon/right.png"></image>
-				</view>
-			</view>
-			<view class="item">
-				<view class="title">配送方式</view>
-				<view class="right" v-if="freight == 0">快递包邮</view>
-				<view class="right" v-if="freight != 0">快递自费</view>
-			</view>
-			<!-- <view class="item" v-if="isServiceUser">
-        <view class="title">工单派单方式</view>
-        <view class="radio-group">
-          <view class="radio" @tap="dispatchType = 1">
-            <text
-              class="iconfont"
-              :class="
-                dispatchType === 1 ? 'icon-danxuan2 active' : 'icon-danxuan'
-              "
-            ></text>
-            自卖自装
-          </view>
-          <view class="radio" @tap="dispatchType = 2">
-            <text
-              class="iconfont"
-              :class="
-                dispatchType === 2 ? 'icon-danxuan2 active' : 'icon-danxuan'
-              "
-            ></text>
-            当地安装
-          </view>
-        </view>
-      </view> -->
-			<view class="item">
-				<view class="title">买家留言</view>
-				<view class="remark">
-					<textarea auto-height :placeholder="isApplyDialog ? '' : '选填，留言建议50字内'" v-model="remark"></textarea>
-				</view>
-			</view>
-		</view>
-
-		<view class="card row-container">
-			<view class="item">
-				<view class="title">商品金额</view>
-				<view class="orange">¥{{ orderInfo.totalAmount | numToFixed }}</view>
-			</view>
-			<view class="item">
-				<view class="title">运费</view>
-				<view class="orange">¥{{ freight | numToFixed }}</view>
-			</view>
-			<view class="item">
-				<view class="title">优惠</view>
-				<view class="orange">-¥{{
-            (couponInfo.couponValue
-              ? couponInfo.couponValue
-              : orderInfo.exchangeAmount || 0) | numToFixed
-          }}</view>
-			</view>
-			<view class="item" v-if="orderInfo.promotionDiscountRate">
-				<view class="title">折扣优惠</view>
-				<view class="orange">-¥{{ orderInfo.discountAmount | numToFixed }}({{
-            orderInfo.promotionDiscountRate * 10
-          }}折)</view>
-			</view>
-		</view>
-
-		<view class="card row-container">
-			<view class="item">
-				<view class="title">优惠码</view>
-				<view class="input"><input placeholder="请输入优惠码" v-model="exchangeCode" @blur="exchangeCodeBlur()" />
-				</view>
-			</view>
-		</view>
-
-		<view class="card row-container">
-			<view class="item">
-				<view class="title">订单总金额</view>
-				<view class="orange">¥{{ orderInfo.payAmount | numToFixed }}</view>
-			</view>
-			<!-- <view class="item">
-				<view class="title">减免金额申请</view>
-				<view class="orange">-¥0.00</view>
-			</view>
-			<view class="item">
-				<view class="title">应付总金额</view>
-				<view class="orange">¥{{orderInfo.payAmount | numToFixed}}</view>
-			</view> -->
-		</view>
-
-		<view class="bottom-container">
-			<!-- <view class="left">共{{orderInfo.totalNum}}件，合计：<text>¥{{orderInfo.payAmount | numToFixed}}</text></view> -->
-			<view class="btn-group">
-				<view class="button3" @tap="toApply" v-if="isServiceUser && isInnerrUser && !isGiftGoods">申请减免金额</view>
-				<view class="button2" @tap="replaceOrder" v-if="(isServiceUser || isHeadUser) && !isGiftGoods">代客下单
-				</view>
-				<view class="button" @tap="submitOrder">提交订单</view>
-			</view>
-		</view>
-
-		<!-- 代客下单 -->
-		<view class="global-mask" v-show="isCodeDialog"></view>
-		<view class="codeDialog" v-show="isCodeDialog">
-			<view class="close">
-				<image src="@/static/icon/close.png" @tap="isCodeDialog = false"></image>
-			</view>
-			<!-- <view class="code"><image :src="'data:image/jpeg;base64,' + codeUrl" mode="aspectFill"></image></view> -->
-			<view class="code">
-				<image :src="codeUrl" mode="aspectFill"></image>
-			</view>
-			<view class="tips">请让客户扫码下单</view>
-		</view>
-
-		<modal-dialog showTitle="提示" showText="优惠券和优惠码只能使用其中一个" :isShowDialog="isBothDialog"
-			@cancel="chooseDiscountWay(1)" @confirm="chooseDiscountWay(2)" cancelText="使用优惠券"
-			confirmText="使用优惠码"></modal-dialog>
-
-		<modal-dialog showTitle="提示" :showText="errorMsg" :isShowDialog="isErrorDialog" :isShowCancel="false"
-			@confirm="isErrorDialog = false"></modal-dialog>
-
-		<view class="apply-dialog" v-show="isApplyDialog">
-			<view class="dialog">
-				<view class="title">减免金额申请</view>
-				<view class="content">
-					<view class="row">
-						<text>订单金额：¥{{ orderInfo.payAmount | numToFixed }}</text>
-					</view>
-					<view class="row">
-						<text>减免金额：</text><input type="digit" v-model="applyForm.amount" /><text></text>
-					</view>
-					<view class="row">
-						<text>应付金额：¥{{
-                ((orderInfo.payAmount * 100 - applyForm.amount * 100) / 100)
-                  | numToFixed
-              }}</text>
-					</view>
-					<view class="row">
-						<text>申请备注：</text><input type="text" v-model="applyForm.remark" /><text></text>
-					</view>
-				</view>
-				<view class="btn">
-					<view class="left" @tap="cancelApplyForm">取消</view>
-					<view class="right" @tap="confirmApplyForm">提交</view>
-				</view>
-			</view>
-		</view>
-
-		<zhifutanchuan v-if="detail_" :orderInfo="orderInfo" @PAY_TYPE_STR="PAY_TYPE_STR" />
-	</view>
-</template>
-
-<script>
-	import {
-		mapState
-	} from 'vuex';
-	import EventBus from '@/utils/eventbus.js';
-	import modalDialog from '@/components/modalDialog.vue';
-	import zhifutanchuan from '@/components/zhifutanchuan.vue';
-	export default {
-		components: {
-			modalDialog,
-			zhifutanchuan,
-		},
-		data() {
-			return {
-				detail_: null,
-				configInfo: uni.getStorageSync('configInfo'),
-				hasAddress: false, // 是否有收货地址
-				addressInfo: {}, // 收货地址信息
-				hasCoupon: false, // 是否有优惠券
-				couponInfo: {}, // 优惠券信息
-				buyList: [], // 商品列表（从商品详情带入，用于请求订单信息接口）
-				orderInfo: {}, // 订单信息
-				goodsList: [], // 商品列表（从订单信息接口获取，用于渲染）
-				freight: 0, // 运费
-				remark: '', // 买家留言
-				isCodeDialog: false, // 代客下单弹窗
-				codeUrl: '', // 代客下单二维码
-				isSeckill: false, // 是否秒杀订单
-				secKillId: null, // 秒杀id
-				secKillSpecId: null,
-				secToken: null,
-				orderId: null, // 订单id
-				isGiftGoods: false, // 是否福利商品
-				exchangeCode: '', // 优惠码
-				isNoticebar: false, // 是否显示公告栏
-				noticeContent: '', // 公告内容
-				groupbuyId: null, // 团购id
-				isBothDialog: false, // 优惠券和优惠码都选择的提示
-				packageId: null, // 套购id
-
-				isErrorDialog: false,
-				errorMsg: '',
-
-				dispatchType: 1,
-				isApplyDialog: false,
-				applyForm: {
-					amount: '',
-					remark: '',
-				},
-			};
-		},
-		computed: {
-			...mapState(['userInfo', 'isLogin', 'userId']),
-
-			isServiceUser() {
-				// 是否业务员
-				return this.userInfo.type === 'SERVICE';
-			},
-			isHeadUser() {
-				// 是否团长
-				return this.userInfo.promotionGroupLeader;
-			},
-			isInnerrUser() {
-				// 是否内部人员
-				return this.userInfo.innerr;
-			},
-
-			total() {
-				let price = Number(this.orderInfo.totalAmount); // 商品金额
-				let freight = Number(this.freight); // 运费
-				let coupon = this.couponInfo.couponValue ?
-					Number(this.couponInfo.couponValue) :
-					Number(this.orderInfo.exchangeAmount || 0); // 优惠金额
-				let total = price + freight - coupon; // 合计
-				return total < 0 ? 0 : total;
-			},
-		},
-		async onLoad({
-			buyList,
-			secKillId,
-			secKillSpecId,
-			secToken,
-			groupbuyId,
-			packageId,
-		}) {
-			this.getNoticebar();
-
-			this.buyList = JSON.parse(buyList);
-			console.log(this.buyList);
-			this.secKillId = secKillId;
-			this.secKillSpecId = secKillSpecId;
-			this.secToken = secToken;
-			this.groupbuyId = groupbuyId;
-			this.packageId = packageId;
-
-			// 进入页面先获取默认地址
-			await this.getAddress();
-
-			// 获取订单信息
-			this.getOrderInfo();
-
-			// 接收地址信息
-			EventBus.$on('chooseAddress', (result) => {
-				this.hasAddress = true;
-				this.addressInfo = result;
-				this.getOrderInfo();
-			});
-
-			// 接收优惠券信息
-			EventBus.$on('chooseCoupon', (result) => {
-				if (result) {
-					this.hasCoupon = true;
-					this.couponInfo = result;
-				} else {
-					this.hasCoupon = false;
-					this.couponInfo = {};
-				}
-				this.getOrderInfo();
-			});
-		},
-		destroyed() {
-			EventBus.$off(['chooseAddress', 'chooseCoupon']);
-		},
-		methods: {
-			findElem(array, attr, val) {
-				for (var i = 0; i < array.length; i++) {
-					if (array[i][attr] == val) {
-						return i; //返回当前索引值
-					}
-				}
-				return -1;
-			},
-
-			// 获取公告栏
-			getNoticebar() {
-				this.$axios({
-					url: '/shpping/cart/notice',
-					method: 'get',
-					params: {
-						userId: this.userId,
-					},
-				}).then((res) => {
-					this.noticeContent = res.data;
-					this.isNoticebar = res.data ? true : false;
-				});
-			},
-
-			// 关闭通告栏
-			closeNoticebar() {
-				this.isNoticebar = false;
-			},
-
-			// 获取订单信息
-			getOrderInfo(type) {
-				this.$axios({
-						url: '/order/ackdata',
-						type: 'application/json',
-						params: {
-							buyGoods: this.buyList,
-							userAddressId: this.addressInfo.userAddressId,
-							userCouponId: this.hasCoupon ? this.couponInfo.id : '',
-							exchangeCode: this.exchangeCode,
-							promotionGroupId: this.groupbuyId || '',
-							goodsPackageId: this.packageId || '',
-						},
-					})
-					.then((res) => {
-						if (res.code == 1100) {
-							this.errorMsg = res.message;
-							this.isErrorDialog = true;
-							uni.hideLoading();
-							setTimeout(() => {
-								uni.showToast({
-									title: res.message,
-									icon: 'none'
-								});
-							}, 500)
-							return false;
-							// return this.$toast(res.message);
-						} else if (res.code !== 200) {
-							setTimeout(() => {
-								uni.navigateBack({
-									delta: 1,
-								});
-							}, 1000);
-						}
-						this.orderInfo = res.data;
-						this.goodsList = res.data.goods;
-						this.isSeckill = res.data.isSecKill;
-						this.freight = res.data.freight;
-						this.isGiftGoods = this.findElem(res.data.goods, 'isGift', true) >= 0;
-					})
-					.catch((res) => {
-						setTimeout(() => {
-							uni.navigateBack({
-								delta: 1,
-							});
-						}, 1000);
-					});
-			},
-
-			// 获取地址信息
-			async getAddress() {
-				const result = new Promise((resolve, reject) => {
-					this.$axios({
-						url: '/user/address/list',
-						method: 'get',
-						params: {
-							pageNum: 1,
-							pageSize: 100,
-							userId: this.userId,
-						},
-					}).then((res) => {
-						let hasDefault = this.findElem(res.data.records, 'defaultAddr', true);
-						if (hasDefault >= 0) {
-							this.hasAddress = true;
-							this.addressInfo = res.data.records[hasDefault];
-						} else {
-							this.hasAddress = false;
-						}
-						resolve();
-					});
-				});
-				return result;
-			},
-
-			findElem(array, attr, val) {
-				for (var i = 0; i < array.length; i++) {
-					if (array[i][attr] == val) {
-						return i; //返回当前索引值
-					}
-				}
-				return -1;
-			},
-
-			// 去选择优惠券
-			chooseCoupon() {
-				// if(this.isSeckill) {
-				// 	return this.$toast('秒杀商品不可使用优惠券');
-				// }
-				let goodsIds = [];
-				this.goodsList.forEach((item) => {
-					goodsIds.push(item.goodsId);
-				});
-
-				let amount = Number(this.orderInfo.totalAmount) + Number(this.freight);
-
-				uni.navigateTo({
-					url: '/packageGoods/pages/coupon?orderAmount=' +
-						amount +
-						'&goodsIds=' +
-						JSON.stringify(goodsIds),
-				});
-			},
-
-			// 去选择地址
-			chooseAddress() {
-				uni.navigateTo({
-					url: '/pages/mine/address/list?isChoose=' + true,
-				});
-			},
-
-			// 更改数量
-			changeCount(e, index) {
-				this.buyList[index].num = e.value;
-				this.getOrderInfo();
-			},
-
-			// 礼品卡密码失去光标
-			exchangeCodeBlur() {
-				if (this.exchangeCode.length >= 8) {
-					this.getOrderInfo('psw');
-				}
-			},
-
-			// 选择优惠方式
-			chooseDiscountWay(type) {
-				if (type === 1) {
-					this.exchangeCode = '';
-				} else {
-					this.hasCoupon = false;
-					this.couponInfo = {};
-				}
-				this.isBothDialog = false;
-				this.getOrderInfo();
-				this.orderPay();
-			},
-
-			PAY_TYPE_STR(ewPam) {
-				this.orderPay(ewPam);
-			},
-
-			// 提交订单
-			submitOrder() {
-				let that = this;
-				if (!this.hasAddress) {
-					return this.$toast('请先选择收货地址');
-				}
-				if (!this.orderInfo.openId) {
-					return uni.redirectTo({
-						url: '/pages/login/index?isNotOpenid=' + true,
-					});
-				}
-
-				if (this.exchangeCode && this.hasCoupon) {
-					return (this.isBothDialog = true);
-				}
-
-				this.detail_ = true;
-			},
-
-			// 下单支付
-			orderPay(ewPam = {}) {
-				let that = this;
-				this.$axios({
-					url: '/order/buy',
-					type: 'application/json',
-					params: {
-						...ewPam,
-						userId: this.userId,
-						buyGoods: this.buyList,
-						buyerMsg: this.remark,
-						userAddressId: this.addressInfo.userAddressId,
-						userCouponId: this.hasCoupon ? this.couponInfo.id : '',
-						exchangeCode: this.exchangeCode,
-						promotionGroupId: this.groupbuyId || '',
-						goodsPackageId: this.packageId || '',
-						// dispatchType: this.isServiceUser
-						//   ? this.dispatchType === 1
-						//     ? '自卖自装'
-						//     : '当地安装'
-						//   : '',
-					},
-					isLoading: 1,
-				}).then((res) => {
-					that.orderId = res.data.id;
-					if (res.code === 1100) {
-						this.detail_ = false;
-						this.errorMsg = res.message;
-						this.isErrorDialog = true;
-						uni.hideLoading();
-						setTimeout(() => {
-							uni.showToast({
-								title: res.message,
-								icon: 'none'
-							});
-						}, 500)
-						return false;
-					}
-					if (res.data.isPay === false) {
-						this.detail_ = false;
-						this.$successToast('购买成功');
-						this.requestMessage();
-					} else {
-						if (ewPam.payType == '微信支付') {
-							uni.getProvider({
-								service: 'payment',
-								success: (e) => {
-									uni.requestPayment({
-										provider: e.provider[0],
-										orderInfo: res.data,
-										timeStamp: res.data.timeStamp,
-										nonceStr: res.data.nonceStr,
-										package: res.data.payPackage,
-										signType: 'MD5',
-										paySign: res.data.paySign,
-										success: (payRes) => {
-											this.detail_ = false;
-											that.$successToast('购买成功');
-											that.requestMessage();
-											uni.reLaunch({
-												url: '/pages/mine/order/detail?orderId=' +
-													that.orderId,
-											});
-										},
-										fail: (err) => {
-											this.detail_ = false;
-											that.$toast('支付失败');
-											uni.reLaunch({
-												url: '/pages/mine/order/detail?orderId=' +
-													that.orderId,
-											});
-										},
-									});
-								},
-							});
-						} else if (
-							ewPam.payType == '云闪付' &&
-							res?.data?.umsMiniRep?.miniPayRequest?.cqpMpAppId
-						) {
-							uni.navigateToMiniProgram({
-								appId: res.data?.umsMiniRep?.miniPayRequest?.cqpMpAppId,
-								path: res.data?.umsMiniRep?.miniPayRequest?.cqpMpPath,
-								success(res) {
-									uni.onAppShow(({
-										scene
-									}) => {
-										// if (scene == 1038) {
-										// }
-										this.detail_ = false;
-										uni.reLaunch({
-											url: '/pages/mine/order/detail?orderId=' + that
-												.orderId,
-										});
-										uni.offAppShow();
-									});
-								},
-							});
-						}
-					}
-				});
-			},
-
-			// 消息推送
-			requestMessage() {
-				let that = this;
-				uni.showModal({
-					title: '温馨提示',
-					content: '为更好的促进您与买家的交流，需要在您的订单成交时向您发送消息',
-					confirmText: '同意',
-					cancelText: '拒绝',
-					success: function(res) {
-						if (res.confirm) {
-							let tmplIds = [that.configInfo.template];
-							uni.requestSubscribeMessage({
-								tmplIds: tmplIds,
-								success(res) {
-									let status = null;
-									tmplIds.map((item, index) => {
-										if (res[item] == 'accept') {
-											status = 'accept';
-										}
-									});
-									if (status == 'accept') {
-										that.$successToast('订阅成功');
-									} else {
-										that.$toast('订阅取消');
-									}
-									setTimeout(() => {
-										uni.reLaunch({
-											url: '/pages/mine/order/list?tab=DFH' +
-												'&orderId=' +
-												that.orderId,
-										});
-									}, 1000);
-								},
-								fail(res) {
-									console.log(res);
-									that.$toast('订阅失败');
-									setTimeout(() => {
-										uni.reLaunch({
-											url: '/pages/mine/order/list?tab=DFH' +
-												'&orderId=' +
-												that.orderId,
-										});
-									}, 1000);
-								},
-							});
-						} else if (res.cancel) {
-							uni.showModal({
-								title: '温馨提示',
-								content: '拒绝后您将无法获取实时的与卖家（买家）的交易消息',
-								confirmText: '知道了',
-								showCancel: false,
-								success: function(res) {
-									uni.reLaunch({
-										url: '/pages/mine/order/list?tab=DFH' +
-											'&orderId=' +
-											that.orderId,
-									});
-								},
-							});
-						}
-					},
-				});
-			},
-
-			// 代客下单
-			replaceOrder() {
-				if (!this.hasAddress) {
-					return this.$toast('请先选择收货地址');
-				}
-				this.$axios({
-					url: '/order/buy',
-					type: 'application/json',
-					params: {
-						userId: this.userId,
-						buyGoods: this.buyList,
-						buyerMsg: this.remark,
-						userAddressId: this.addressInfo.userAddressId,
-						userCouponId: this.hasCoupon ? this.couponInfo.id : '',
-						exchangeCode: this.exchangeCode,
-						proxyUser: true,
-						// dispatchType: this.isServiceUser
-						//   ? this.dispatchType === 1
-						//     ? '自卖自装'
-						//     : '当地安装'
-						//   : '',
-					},
-					isLoading: 1,
-				}).then((res) => {
-					if (res.code === 1100) {
-						this.errorMsg = res.message;
-						this.isErrorDialog = true;
-						uni.hideLoading();
-						setTimeout(() => {
-							uni.showToast({
-								title: res.message,
-								icon: 'none'
-							});
-						}, 500)
-						return false;
-						// return this.$toast(res.message);
-					}
-					this.codeUrl = res.data.codeUrl.replace(/[\r\n]/g, '');
-					this.isCodeDialog = true;
-				});
-			},
-
-			// 打开申请减免金额表单
-			toApply(id) {
-				this.isApplyDialog = true;
-			},
-
-			// 取消申请减免金额表单
-			cancelApplyForm() {
-				this.applyForm.amount = '';
-				this.isApplyDialog = false;
-			},
-
-			// 提交申请减免金额表单
-			confirmApplyForm() {
-				if (!this.applyForm.amount) {
-					return this.$toast('请填写优惠金额');
-				}
-				if (this.applyForm.amount > this.orderInfo.payAmount) {
-					return this.$toast('优惠金额不能大于订单总金额');
-				}
-				this.$axios({
-					url: '/promotion/apply/apply',
-					method: 'post',
-					type: 'application/json',
-					params: {
-						userId: this.userId,
-						buyGoods: this.buyList,
-						buyerMsg: this.remark,
-						userAddressId: this.addressInfo.userAddressId,
-						userCouponId: this.hasCoupon ? this.couponInfo.id : '',
-						exchangeCode: this.exchangeCode,
-						promotionGroupId: this.groupbuyId || '',
-						goodsPackageId: this.packageId || '',
-
-						applyAmount: this.applyForm.amount,
-						applyRemark: this.applyForm.remark,
-					},
-					isLoading: 1,
-				}).then((res) => {
-					this.cancelApplyForm();
-					this.$successToast('提交成功');
-					setTimeout(() => {
-						uni.redirectTo({
-							url: '/pages/mine/discount/list',
-						});
-					}, 500);
-				});
-			},
-		},
-	};
-</script>
-
-<style lang="scss">
-	.guobutishi {
-		width: 65%;
-		display: inline-block;
-		height: 100%;
-		z-index: 100;
-		display: flex;
-		border: 1px solid #fe781f;
-		box-sizing: border-box;
-		padding: 10rpx;
-		border-radius: 10rpx;
-
-		.guobutishi1 {
-			font-size: 22rpx;
-			border-radius: 10rpx;
-			background: red;
-			box-sizing: border-box;
-			padding: 0 10rpx;
-			color: #e5e5e5;
-			margin-right: 10rpx;
-		}
-
-		.guobutishi2 {
-			font-size: 24rpx;
-			color: #fe781f;
-		}
-	}
-
-	.app-container {
-		background: #f4f2f2;
-		padding: 20rpx 20rpx 160rpx;
-		box-sizing: border-box;
-
-		&.hasNoticebar {
-			padding-top: 84rpx;
-		}
-
-		.noticebar {
-			position: fixed;
-			top: 0;
-			left: 0;
-			width: 100%;
-			z-index: 100;
-		}
-	}
-
-	.card {
-		background: #ffffff;
-		border-radius: 20rpx;
-		margin-top: 20rpx;
-		padding: 0 20rpx;
-	}
-
-	.address-container {
-		background: #ffffff;
-		border-radius: 20rpx;
-		display: flex;
-		justify-content: space-between;
-		align-items: center;
-		height: 150rpx;
-		padding: 0 20rpx;
-
-		.right {
-			width: 16rpx;
-			height: 28rpx;
-			flex-shrink: 0;
-		}
-
-		.left {
-			display: flex;
-			align-items: center;
-			margin-right: 20rpx;
-
-			.icon {
-				width: 52rpx;
-				height: 52rpx;
-				border-radius: 50%;
-				background: linear-gradient(-90deg, #ff4042 0%, #fe781f 100%);
-				display: flex;
-				flex-shrink: 0;
-				justify-content: center;
-				align-items: center;
-				margin-right: 20rpx;
-
-				image {
-					width: 28rpx;
-					height: 36rpx;
-				}
-			}
-
-			.nodata {
-				font-size: 28rpx;
-				color: #999999;
-			}
-
-			.hasdata {
-				.name {
-					font-size: 32rpx;
-					color: #333333;
-
-					text {
-						color: #999999;
-						font-size: 28rpx;
-						margin-left: 16rpx;
-					}
-				}
-
-				.address {
-					font-size: 28rpx;
-					color: #666666;
-					line-height: 34rpx;
-					margin-top: 10rpx;
-				}
-			}
-		}
-	}
-
-	.goods-container {
-		.title {
-			font-size: 32rpx;
-			color: #333333;
-			line-height: 32rpx;
-			padding-top: 20rpx;
-		}
-
-		.item {
-			padding: 20rpx 0;
-			display: flex;
-			align-items: center;
-			background: #ffffff;
-			border-bottom: 1px solid #eaeaea;
-
-			&:last-child {
-				border: none;
-			}
-
-			image {
-				width: 180rpx;
-				height: 180rpx;
-				display: block;
-				margin-right: 20rpx;
-				flex-shrink: 0;
-			}
-
-			.right {
-				width: 470rpx;
-				height: 190rpx;
-				display: flex;
-				justify-content: space-between;
-				flex-direction: column;
-
-				.name {
-					font-size: 28rpx;
-					color: #333333;
-					line-height: 36rpx;
-					height: 72rpx;
-				}
-
-				.des {
-					font-size: 24rpx;
-					color: #999999;
-					line-height: 36rpx;
-				}
-
-				.bottom {
-					display: flex;
-					justify-content: space-between;
-					align-items: center;
-
-					.price {
-						display: flex;
-						flex-direction: column;
-					}
-
-					.price-1 {
-						font-size: 32rpx;
-						color: #ff3f42;
-						line-height: 36rpx;
-					}
-
-					.price-2 {
-						font-size: 26rpx;
-						color: #666666;
-						line-height: 30rpx;
-						text-decoration: line-through;
-					}
-				}
-			}
-		}
-	}
-
-	.row-container {
-		.item {
-			display: flex;
-			justify-content: space-between;
-			align-items: center;
-			min-height: 88rpx;
-			border-bottom: 1px solid #eaeaea;
-
-			&:last-child {
-				border: none;
-			}
-
-			.title {
-				font-size: 28rpx;
-				color: #333333;
-			}
-
-			.coupon {
-				display: flex;
-				align-items: center;
-
-				image {
-					width: 16rpx;
-					height: 28rpx;
-					margin-left: 15rpx;
-				}
-			}
-
-			.input {
-				width: 500rpx;
-
-				input {
-					width: 500rpx;
-					height: 88rpx;
-					text-align: right;
-				}
-			}
-
-			.radio-group {
-				display: flex;
-				height: 48rpx;
-				align-items: center;
-
-				.radio {
-					display: flex;
-					align-items: center;
-					margin-left: 30rpx;
-
-					.iconfont {
-						font-size: 36rpx;
-						color: #999999;
-						margin-right: 10rpx;
-
-						&.active {
-							color: #ff3f42;
-						}
-					}
-				}
-			}
-
-			.remark {
-				width: 500rpx;
-
-				textarea {
-					width: 500rpx;
-					padding: 20rpx 0;
-				}
-			}
-
-			.orange {
-				font-size: 28rpx;
-				color: #fe781f;
-			}
-		}
-	}
-
-	.bottom-container {
-		position: fixed;
-		bottom: 0;
-		left: 0;
-		z-index: 99;
-		width: 100%;
-		box-sizing: border-box;
-		background: #ffffff;
-		padding: 0 20rpx;
-		display: flex;
-		justify-content: flex-end;
-		align-items: center;
-		height: 100rpx;
-
-		.left {
-			font-size: 28rpx;
-			color: #333333;
-
-			text {
-				color: #ff3f42;
-			}
-		}
-
-		.btn-group {
-			display: flex;
-		}
-
-		.button {
-			width: 190rpx;
-			height: 80rpx;
-			border-radius: 80rpx;
-			background: linear-gradient(-90deg, #ff3f42 0%, #fe781f 100%);
-			font-size: 28rpx;
-			color: #ffffff;
-			text-align: center;
-			line-height: 80rpx;
-		}
-
-		.button2 {
-			width: 190rpx;
-			height: 80rpx;
-			border-radius: 80rpx;
-			font-size: 28rpx;
-			color: #ff3f42;
-			text-align: center;
-			line-height: 80rpx;
-			margin-right: 10rpx;
-			border: 1px solid #ff3f42;
-			box-sizing: border-box;
-		}
-
-		.button3 {
-			width: 220rpx;
-			height: 80rpx;
-			border-radius: 80rpx;
-			font-size: 28rpx;
-			color: #ffffff;
-			text-align: center;
-			line-height: 80rpx;
-			margin-right: 10rpx;
-			border: 1px solid #ff3f42;
-			background: #ff3f42;
-			box-sizing: border-box;
-		}
-	}
-
-	.codeDialog {
-		position: fixed;
-		top: 40%;
-		left: 150rpx;
-		z-index: 999;
-		width: 400rpx;
-		background: #ffffff;
-		border-radius: 10rpx;
-		box-sizing: border-box;
-		padding: 20rpx 20rpx 40rpx;
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-
-		.close {
-			width: 100%;
-			display: flex;
-			justify-content: flex-end;
-
-			image {
-				width: 32rpx;
-				height: 32rpx;
-				display: block;
-			}
-		}
-
-		.code {
-			margin-top: 10rpx;
-
-			image {
-				width: 280rpx;
-				height: 280rpx;
-				display: block;
-			}
-		}
-
-		.tips {
-			font-size: 28rpx;
-			color: #666666;
-			margin-top: 20rpx;
-		}
-	}
-
-	.apply-dialog {
-		position: fixed;
-		top: 0;
-		left: 0;
-		z-index: 9999;
-		width: 100%;
-		height: 100%;
-		background: rgba(0, 0, 0, 0.3);
-		display: flex;
-		align-items: center;
-		justify-content: center;
-
-		.dialog {
-			width: 600rpx;
-			background: #ffffff;
-			border-radius: 20rpx;
-			overflow: hidden;
-
-			.title {
-				font-size: 36rpx;
-				font-weight: 500;
-				text-align: center;
-				line-height: 100rpx;
-				padding-bottom: 10rpx;
-			}
-
-			.content {
-				padding: 0 40rpx 30rpx;
-
-				.row {
-					height: 50rpx;
-					display: flex;
-					align-items: center;
-					margin-bottom: 10rpx;
-					font-size: 28rpx;
-					color: #333333;
-
-					input {
-						flex: 1;
-						height: 50rpx;
-						border: 1px solid #e5e5e5;
-						margin-right: 16rpx;
-						padding: 0 12rpx;
-						font-size: 28rpx;
-					}
-				}
-			}
-
-			.btn {
-				border-top: 1px solid #eaeaea;
-				display: flex;
-
-				&>view {
-					flex: 1;
-					text-align: center;
-					line-height: 100rpx;
-					font-size: 32rpx;
-
-					&.left {
-						color: #666666;
-					}
-
-					&.right {
-						color: #ffffff;
-						background: #ff3f42;
-					}
-				}
-			}
-		}
-	}
+<template>
+	<view class="app-container" :class="isNoticebar ? 'hasNoticebar' : ''">
+		<view class="noticebar" v-if="isNoticebar">
+			<uni-notice-bar v-if="noticeContent" scrollable="true" single="true" showClose="true" :text="noticeContent"
+				background-color="#f6e6e7" color="#de3749" @close="closeNoticebar"></uni-notice-bar>
+		</view>
+
+		<view class="address-container" @tap="chooseAddress">
+			<view class="left">
+				<view class="icon">
+					<image src="../../static/icon/address.png"></image>
+				</view>
+				<view class="nodata" v-if="!hasAddress">选择收货地址</view>
+				<view class="hasdata" v-else>
+					<view class="name">{{ addressInfo.name }}<text>{{ addressInfo.phone }}</text></view>
+					<view class="address ellipsis-2">{{ addressInfo.province }}{{ addressInfo.city
+            }}{{ addressInfo.area }}{{ addressInfo.street
+            }}{{ addressInfo.address }}{{ addressInfo.houseNo }}</view>
+				</view>
+			</view>
+			<image class="right" src="../../static/icon/right.png"></image>
+		</view>
+
+		<view class="card goods-container">
+			<view class="title">商品信息</view>
+			<block v-for="(item, index) in goodsList" :key="index">
+				<view>
+					<view class="item">
+						<image v-if="
+                item.logo && 
+				$compareTime(item.logoStartTime, item.logoEndTime) && item.mergeImage
+              " :src="item.mergeImage"></image>
+						<image v-else :src="item.imgUrl"></image>
+						<view class="right">
+							<view class="name ellipsis-2">{{ item.goodsName }}</view>
+							<view class="des">{{ item.specValue }}</view>
+							<view class="bottom">
+								<view class="price">
+									<view class="price-1">¥{{ item.price | numToFixed }}</view>
+									<view class="price-2">¥{{ item.orgPrice | numToFixed }}</view>
+								</view>
+
+								<u-number-box @tap.stop v-model="item.num" :min="1" :buttonSize="26"
+									iconStyle="font-size: 12px;" :disabled="!hasAddress"
+									@change="changeCount($event, index)">
+								</u-number-box>
+							</view>
+						</view>
+					</view>
+					<view style="box-sizing: border-box; padding: 10rpx 0">
+						<view class="guobutishi" v-if="
+                goodsList.length == 1 &&
+                item.num == 1 &&
+                [
+                  'GDYJKT',
+                  'GDYJBX',
+                  'GDYJXYJ',
+                  'GDYJXYYJ',
+                  'GDYJDZ',
+                  'GDYJRSQ',
+                ].includes(item.umsDiscountCode)
+              ">
+							<view class="guobutishi1">云闪付</view>
+							<view class="guobutishi2">用券新机补贴预估{{ (item.price * 0.2).toFixed(2) }}元</view>
+						</view>
+						<view class="guobutishi" v-if="
+                goodsList.length == 1 &&
+                item.num == 1 &&
+                [
+                  'GDEJKT',
+                  'GDEJBX',
+                  'GDEJXYJ',
+                  'GDEJXYYJ',
+                  'GDEJDZ',
+                  'GDEJRSQ',
+                ].includes(item.umsDiscountCode)
+              ">
+							<view class="guobutishi1">云闪付</view>
+							<view class="guobutishi2">用券新机补贴预估{{ (item.price * 0.15).toFixed(2) }}元</view>
+						</view>
+					</view>
+				</view>
+			</block>
+		</view>
+
+		<view class="card row-container">
+			<view class="item">
+				<view class="title">优惠券</view>
+				<view class="coupon" @tap="chooseCoupon">
+					<text v-if="hasCoupon">{{ couponInfo.couponName }}</text>
+					<text v-else style="color: #666666">未使用优惠券</text>
+					<image src="../../static/icon/right.png"></image>
+				</view>
+			</view>
+			<view class="item">
+				<view class="title">配送方式</view>
+				<view class="right" v-if="freight == 0">快递包邮</view>
+				<view class="right" v-if="freight != 0">快递自费</view>
+			</view>
+			<!-- <view class="item" v-if="isServiceUser">
+        <view class="title">工单派单方式</view>
+        <view class="radio-group">
+          <view class="radio" @tap="dispatchType = 1">
+            <text
+              class="iconfont"
+              :class="
+                dispatchType === 1 ? 'icon-danxuan2 active' : 'icon-danxuan'
+              "
+            ></text>
+            自卖自装
+          </view>
+          <view class="radio" @tap="dispatchType = 2">
+            <text
+              class="iconfont"
+              :class="
+                dispatchType === 2 ? 'icon-danxuan2 active' : 'icon-danxuan'
+              "
+            ></text>
+            当地安装
+          </view>
+        </view>
+      </view> -->
+			<view class="item">
+				<view class="title">买家留言</view>
+				<view class="remark">
+					<textarea auto-height :placeholder="isApplyDialog ? '' : '选填，留言建议50字内'" v-model="remark"></textarea>
+				</view>
+			</view>
+		</view>
+
+		<view class="card row-container">
+			<view class="item">
+				<view class="title">商品金额</view>
+				<view class="orange">¥{{ orderInfo.totalAmount | numToFixed }}</view>
+			</view>
+			<view class="item">
+				<view class="title">运费</view>
+				<view class="orange">¥{{ freight | numToFixed }}</view>
+			</view>
+			<view class="item">
+				<view class="title">优惠</view>
+				<view class="orange">-¥{{
+            (couponInfo.couponValue
+              ? couponInfo.couponValue
+              : orderInfo.exchangeAmount || 0) | numToFixed
+          }}</view>
+			</view>
+			<view class="item" v-if="orderInfo.promotionDiscountRate">
+				<view class="title">折扣优惠</view>
+				<view class="orange">-¥{{ orderInfo.discountAmount | numToFixed }}({{
+            orderInfo.promotionDiscountRate * 10
+          }}折)</view>
+			</view>
+		</view>
+
+		<!-- <view class="card row-container">
+			<view class="item">
+				<view class="title">优惠码</view>
+				<view class="input"><input placeholder="请输入优惠码" v-model="exchangeCode" @blur="exchangeCodeBlur()" />
+				</view>
+			</view>
+		</view> -->
+
+		<view class="card row-container">
+			<view class="item">
+				<view class="title">订单总金额</view>
+				<view class="orange">¥{{ orderInfo.payAmount | numToFixed }}</view>
+			</view>
+			<!-- <view class="item">
+				<view class="title">减免金额申请</view>
+				<view class="orange">-¥0.00</view>
+			</view>
+			<view class="item">
+				<view class="title">应付总金额</view>
+				<view class="orange">¥{{orderInfo.payAmount | numToFixed}}</view>
+			</view> -->
+		</view>
+
+		<view class="bottom-container">
+			<!-- <view class="left">共{{orderInfo.totalNum}}件，合计：<text>¥{{orderInfo.payAmount | numToFixed}}</text></view> -->
+			<view class="btn-group">
+				<!-- <view class="button3" @tap="toApply" v-if="isServiceUser && isInnerrUser && !isGiftGoods">申请减免金额</view> -->
+				<view class="button2" @tap="replaceOrder" v-if="(isServiceUser || isHeadUser) && !isGiftGoods">代客下单
+				</view>
+				<view class="button" @tap="submitOrder">提交订单</view>
+			</view>
+		</view>
+
+		<!-- 代客下单 -->
+		<view class="global-mask" v-show="isCodeDialog"></view>
+		<view class="codeDialog" v-show="isCodeDialog">
+			<view class="close">
+				<image src="@/static/icon/close.png" @tap="isCodeDialog = false"></image>
+			</view>
+			<!-- <view class="code"><image :src="'data:image/jpeg;base64,' + codeUrl" mode="aspectFill"></image></view> -->
+			<view class="code">
+				<image :src="codeUrl" mode="aspectFill"></image>
+			</view>
+			<view class="tips">请让客户扫码下单</view>
+		</view>
+
+		<modal-dialog showTitle="提示" showText="优惠券和优惠码只能使用其中一个" :isShowDialog="isBothDialog"
+			@cancel="chooseDiscountWay(1)" @confirm="chooseDiscountWay(2)" cancelText="使用优惠券"
+			confirmText="使用优惠码"></modal-dialog>
+
+		<modal-dialog showTitle="提示" :showText="errorMsg" :isShowDialog="isErrorDialog" :isShowCancel="false"
+			@confirm="isErrorDialog = false"></modal-dialog>
+
+		<view class="apply-dialog" v-show="isApplyDialog">
+			<view class="dialog">
+				<view class="title">减免金额申请</view>
+				<view class="content">
+					<view class="row">
+						<text>订单金额：¥{{ orderInfo.payAmount | numToFixed }}</text>
+					</view>
+					<view class="row">
+						<text>减免金额：</text><input type="digit" v-model="applyForm.amount" /><text></text>
+					</view>
+					<view class="row">
+						<text>应付金额：¥{{
+                ((orderInfo.payAmount * 100 - applyForm.amount * 100) / 100)
+                  | numToFixed
+              }}</text>
+					</view>
+					<view class="row">
+						<text>申请备注：</text><input type="text" v-model="applyForm.remark" /><text></text>
+					</view>
+				</view>
+				<view class="btn">
+					<view class="left" @tap="cancelApplyForm">取消</view>
+					<view class="right" @tap="confirmApplyForm">提交</view>
+				</view>
+			</view>
+		</view>
+
+		<zhifutanchuan v-if="detail_" :orderInfo="orderInfo" @PAY_TYPE_STR="PAY_TYPE_STR" />
+	</view>
+</template>
+
+<script>
+	import {
+		mapState
+	} from 'vuex';
+	import EventBus from '@/utils/eventbus.js';
+	import modalDialog from '@/components/modalDialog.vue';
+	import zhifutanchuan from '@/components/zhifutanchuan.vue';
+	export default {
+		components: {
+			modalDialog,
+			zhifutanchuan,
+		},
+		data() {
+			return {
+				detail_: null,
+				configInfo: uni.getStorageSync('configInfo'),
+				hasAddress: false, // 是否有收货地址
+				addressInfo: {}, // 收货地址信息
+				hasCoupon: false, // 是否有优惠券
+				couponInfo: {}, // 优惠券信息
+				buyList: [], // 商品列表（从商品详情带入，用于请求订单信息接口）
+				orderInfo: {}, // 订单信息
+				goodsList: [], // 商品列表（从订单信息接口获取，用于渲染）
+				freight: 0, // 运费
+				remark: '', // 买家留言
+				isCodeDialog: false, // 代客下单弹窗
+				codeUrl: '', // 代客下单二维码
+				isSeckill: false, // 是否秒杀订单
+				secKillId: null, // 秒杀id
+				secKillSpecId: null,
+				secToken: null,
+				orderId: null, // 订单id
+				isGiftGoods: false, // 是否福利商品
+				exchangeCode: '', // 优惠码
+				isNoticebar: false, // 是否显示公告栏
+				noticeContent: '', // 公告内容
+				groupbuyId: null, // 团购id
+				isBothDialog: false, // 优惠券和优惠码都选择的提示
+				packageId: null, // 套购id
+
+				isErrorDialog: false,
+				errorMsg: '',
+
+				dispatchType: 1,
+				isApplyDialog: false,
+				applyForm: {
+					amount: '',
+					remark: '',
+				},
+			};
+		},
+		computed: {
+			...mapState(['userInfo', 'isLogin', 'userId']),
+
+			isServiceUser() {
+				// 是否业务员
+				return this.userInfo.type === 'SERVICE';
+			},
+			isHeadUser() {
+				// 是否团长
+				return this.userInfo.promotionGroupLeader;
+			},
+			isInnerrUser() {
+				// 是否内部人员
+				return this.userInfo.innerr;
+			},
+
+			total() {
+				let price = Number(this.orderInfo.totalAmount); // 商品金额
+				let freight = Number(this.freight); // 运费
+				let coupon = this.couponInfo.couponValue ?
+					Number(this.couponInfo.couponValue) :
+					Number(this.orderInfo.exchangeAmount || 0); // 优惠金额
+				let total = price + freight - coupon; // 合计
+				return total < 0 ? 0 : total;
+			},
+		},
+		async onLoad({
+			buyList,
+			secKillId,
+			secKillSpecId,
+			secToken,
+			groupbuyId,
+			packageId,
+		}) {
+			this.getNoticebar();
+
+			this.buyList = JSON.parse(buyList);
+			console.log(this.buyList);
+			this.secKillId = secKillId;
+			this.secKillSpecId = secKillSpecId;
+			this.secToken = secToken;
+			this.groupbuyId = groupbuyId;
+			this.packageId = packageId;
+
+			// 进入页面先获取默认地址
+			await this.getAddress();
+
+			// 获取订单信息
+			this.getOrderInfo();
+
+			// 接收地址信息
+			EventBus.$on('chooseAddress', (result) => {
+				this.hasAddress = true;
+				this.addressInfo = result;
+				this.getOrderInfo();
+			});
+
+			// 接收优惠券信息
+			EventBus.$on('chooseCoupon', (result) => {
+				if (result) {
+					this.hasCoupon = true;
+					this.couponInfo = result;
+				} else {
+					this.hasCoupon = false;
+					this.couponInfo = {};
+				}
+				this.getOrderInfo();
+			});
+		},
+		destroyed() {
+			EventBus.$off(['chooseAddress', 'chooseCoupon']);
+		},
+		methods: {
+			findElem(array, attr, val) {
+				for (var i = 0; i < array.length; i++) {
+					if (array[i][attr] == val) {
+						return i; //返回当前索引值
+					}
+				}
+				return -1;
+			},
+
+			// 获取公告栏
+			getNoticebar() {
+				this.$axios({
+					url: '/shpping/cart/notice',
+					method: 'get',
+					params: {
+						userId: this.userId,
+					},
+				}).then((res) => {
+					this.noticeContent = res.data;
+					this.isNoticebar = res.data ? true : false;
+				});
+			},
+
+			// 关闭通告栏
+			closeNoticebar() {
+				this.isNoticebar = false;
+			},
+
+			// 获取订单信息
+			getOrderInfo(type) {
+				this.$axios({
+						url: '/order/ackdata',
+						type: 'application/json',
+						params: {
+							buyGoods: this.buyList,
+							userAddressId: this.addressInfo.userAddressId,
+							userCouponId: this.hasCoupon ? this.couponInfo.id : '',
+							exchangeCode: this.exchangeCode,
+							promotionGroupId: this.groupbuyId || '',
+							goodsPackageId: this.packageId || '',
+						},
+					})
+					.then((res) => {
+						if (res.code == 1100) {
+							this.errorMsg = res.message;
+							this.isErrorDialog = true;
+							uni.hideLoading();
+							setTimeout(() => {
+								uni.showToast({
+									title: res.message,
+									icon: 'none'
+								});
+							}, 500)
+							return false;
+							// return this.$toast(res.message);
+						} else if (res.code !== 200) {
+							setTimeout(() => {
+								uni.navigateBack({
+									delta: 1,
+								});
+							}, 1000);
+						}
+						this.orderInfo = res.data;
+						this.goodsList = res.data.goods;
+						this.isSeckill = res.data.isSecKill;
+						this.freight = res.data.freight;
+						this.isGiftGoods = this.findElem(res.data.goods, 'isGift', true) >= 0;
+					})
+					.catch((res) => {
+						setTimeout(() => {
+							uni.navigateBack({
+								delta: 1,
+							});
+						}, 1000);
+					});
+			},
+
+			// 获取地址信息
+			async getAddress() {
+				const result = new Promise((resolve, reject) => {
+					this.$axios({
+						url: '/user/address/list',
+						method: 'get',
+						params: {
+							pageNum: 1,
+							pageSize: 100,
+							userId: this.userId,
+						},
+					}).then((res) => {
+						let hasDefault = this.findElem(res.data.records, 'defaultAddr', true);
+						if (hasDefault >= 0) {
+							this.hasAddress = true;
+							this.addressInfo = res.data.records[hasDefault];
+						} else {
+							this.hasAddress = false;
+						}
+						resolve();
+					});
+				});
+				return result;
+			},
+
+			findElem(array, attr, val) {
+				for (var i = 0; i < array.length; i++) {
+					if (array[i][attr] == val) {
+						return i; //返回当前索引值
+					}
+				}
+				return -1;
+			},
+
+			// 去选择优惠券
+			chooseCoupon() {
+				// if(this.isSeckill) {
+				// 	return this.$toast('秒杀商品不可使用优惠券');
+				// }
+				let goodsIds = [];
+				this.goodsList.forEach((item) => {
+					goodsIds.push(item.goodsId);
+				});
+
+				let amount = Number(this.orderInfo.totalAmount) + Number(this.freight);
+
+				uni.navigateTo({
+					url: '/packageGoods/pages/coupon?orderAmount=' +
+						amount +
+						'&goodsIds=' +
+						JSON.stringify(goodsIds),
+				});
+			},
+
+			// 去选择地址
+			chooseAddress() {
+				uni.navigateTo({
+					url: '/pages/mine/address/list?isChoose=' + true,
+				});
+			},
+
+			// 更改数量
+			changeCount(e, index) {
+				this.buyList[index].num = e.value;
+				this.getOrderInfo();
+			},
+
+			// 礼品卡密码失去光标
+			exchangeCodeBlur() {
+				if (this.exchangeCode.length >= 8) {
+					this.getOrderInfo('psw');
+				}
+			},
+
+			// 选择优惠方式
+			chooseDiscountWay(type) {
+				if (type === 1) {
+					this.exchangeCode = '';
+				} else {
+					this.hasCoupon = false;
+					this.couponInfo = {};
+				}
+				this.isBothDialog = false;
+				this.getOrderInfo();
+				this.orderPay();
+			},
+
+			PAY_TYPE_STR(ewPam) {
+				this.orderPay(ewPam);
+			},
+
+			// 提交订单
+			submitOrder() {
+				let that = this;
+				if (!this.hasAddress) {
+					return this.$toast('请先选择收货地址');
+				}
+				if (!this.orderInfo.openId) {
+					return uni.redirectTo({
+						url: '/pages/login/index?isNotOpenid=' + true,
+					});
+				}
+
+				if (this.exchangeCode && this.hasCoupon) {
+					return (this.isBothDialog = true);
+				}
+
+				this.detail_ = true;
+			},
+
+			// 下单支付
+			orderPay(ewPam = {}) {
+				let that = this;
+				this.$axios({
+					url: '/order/buy',
+					type: 'application/json',
+					params: {
+						...ewPam,
+						userId: this.userId,
+						buyGoods: this.buyList,
+						buyerMsg: this.remark,
+						userAddressId: this.addressInfo.userAddressId,
+						userCouponId: this.hasCoupon ? this.couponInfo.id : '',
+						exchangeCode: this.exchangeCode,
+						promotionGroupId: this.groupbuyId || '',
+						goodsPackageId: this.packageId || '',
+						// dispatchType: this.isServiceUser
+						//   ? this.dispatchType === 1
+						//     ? '自卖自装'
+						//     : '当地安装'
+						//   : '',
+					},
+					isLoading: 1,
+				}).then((res) => {
+					that.orderId = res.data.id;
+					if (res.code === 1100) {
+						this.detail_ = false;
+						this.errorMsg = res.message;
+						this.isErrorDialog = true;
+						uni.hideLoading();
+						setTimeout(() => {
+							uni.showToast({
+								title: res.message,
+								icon: 'none'
+							});
+						}, 500)
+						return false;
+					}
+					if (res.data.isPay === false) {
+						this.detail_ = false;
+						this.$successToast('购买成功');
+						this.requestMessage();
+					} else {
+						if (ewPam.payType == '微信支付') {
+							uni.getProvider({
+								service: 'payment',
+								success: (e) => {
+									uni.requestPayment({
+										provider: e.provider[0],
+										orderInfo: res.data,
+										timeStamp: res.data.timeStamp,
+										nonceStr: res.data.nonceStr,
+										package: res.data.payPackage,
+										signType: 'MD5',
+										paySign: res.data.paySign,
+										success: (payRes) => {
+											this.detail_ = false;
+											that.$successToast('购买成功');
+											that.requestMessage();
+											uni.reLaunch({
+												url: '/pages/mine/order/detail?orderId=' +
+													that.orderId,
+											});
+										},
+										fail: (err) => {
+											this.detail_ = false;
+											that.$toast('支付失败');
+											uni.reLaunch({
+												url: '/pages/mine/order/detail?orderId=' +
+													that.orderId,
+											});
+										},
+									});
+								},
+							});
+						} else if (
+							ewPam.payType == '云闪付' &&
+							res?.data?.umsMiniRep?.miniPayRequest?.cqpMpAppId
+						) {
+							uni.navigateToMiniProgram({
+								appId: res.data?.umsMiniRep?.miniPayRequest?.cqpMpAppId,
+								path: res.data?.umsMiniRep?.miniPayRequest?.cqpMpPath,
+								success(res) {
+									uni.onAppShow(({
+										scene
+									}) => {
+										// if (scene == 1038) {
+										// }
+										this.detail_ = false;
+										uni.reLaunch({
+											url: '/pages/mine/order/detail?orderId=' + that
+												.orderId,
+										});
+										uni.offAppShow();
+									});
+								},
+							});
+						}
+					}
+				});
+			},
+
+			// 消息推送
+			requestMessage() {
+				let that = this;
+				uni.showModal({
+					title: '温馨提示',
+					content: '为更好的促进您与买家的交流，需要在您的订单成交时向您发送消息',
+					confirmText: '同意',
+					cancelText: '拒绝',
+					success: function(res) {
+						if (res.confirm) {
+							let tmplIds = [that.configInfo.template];
+							uni.requestSubscribeMessage({
+								tmplIds: tmplIds,
+								success(res) {
+									let status = null;
+									tmplIds.map((item, index) => {
+										if (res[item] == 'accept') {
+											status = 'accept';
+										}
+									});
+									if (status == 'accept') {
+										that.$successToast('订阅成功');
+									} else {
+										that.$toast('订阅取消');
+									}
+									setTimeout(() => {
+										uni.reLaunch({
+											url: '/pages/mine/order/list?tab=DFH' +
+												'&orderId=' +
+												that.orderId,
+										});
+									}, 1000);
+								},
+								fail(res) {
+									console.log(res);
+									that.$toast('订阅失败');
+									setTimeout(() => {
+										uni.reLaunch({
+											url: '/pages/mine/order/list?tab=DFH' +
+												'&orderId=' +
+												that.orderId,
+										});
+									}, 1000);
+								},
+							});
+						} else if (res.cancel) {
+							uni.showModal({
+								title: '温馨提示',
+								content: '拒绝后您将无法获取实时的与卖家（买家）的交易消息',
+								confirmText: '知道了',
+								showCancel: false,
+								success: function(res) {
+									uni.reLaunch({
+										url: '/pages/mine/order/list?tab=DFH' +
+											'&orderId=' +
+											that.orderId,
+									});
+								},
+							});
+						}
+					},
+				});
+			},
+
+			// 代客下单
+			replaceOrder() {
+				if (!this.hasAddress) {
+					return this.$toast('请先选择收货地址');
+				}
+				this.$axios({
+					url: '/order/buy',
+					type: 'application/json',
+					params: {
+						userId: this.userId,
+						buyGoods: this.buyList,
+						buyerMsg: this.remark,
+						userAddressId: this.addressInfo.userAddressId,
+						userCouponId: this.hasCoupon ? this.couponInfo.id : '',
+						exchangeCode: this.exchangeCode,
+						proxyUser: true,
+						// dispatchType: this.isServiceUser
+						//   ? this.dispatchType === 1
+						//     ? '自卖自装'
+						//     : '当地安装'
+						//   : '',
+					},
+					isLoading: 1,
+				}).then((res) => {
+					if (res.code === 1100) {
+						this.errorMsg = res.message;
+						this.isErrorDialog = true;
+						uni.hideLoading();
+						setTimeout(() => {
+							uni.showToast({
+								title: res.message,
+								icon: 'none'
+							});
+						}, 500)
+						return false;
+						// return this.$toast(res.message);
+					}
+					this.codeUrl = res.data.codeUrl.replace(/[\r\n]/g, '');
+					this.isCodeDialog = true;
+				});
+			},
+
+			// 打开申请减免金额表单
+			toApply(id) {
+				this.isApplyDialog = true;
+			},
+
+			// 取消申请减免金额表单
+			cancelApplyForm() {
+				this.applyForm.amount = '';
+				this.isApplyDialog = false;
+			},
+
+			// 提交申请减免金额表单
+			confirmApplyForm() {
+				if (!this.applyForm.amount) {
+					return this.$toast('请填写优惠金额');
+				}
+				if (this.applyForm.amount > this.orderInfo.payAmount) {
+					return this.$toast('优惠金额不能大于订单总金额');
+				}
+				this.$axios({
+					url: '/promotion/apply/apply',
+					method: 'post',
+					type: 'application/json',
+					params: {
+						userId: this.userId,
+						buyGoods: this.buyList,
+						buyerMsg: this.remark,
+						userAddressId: this.addressInfo.userAddressId,
+						userCouponId: this.hasCoupon ? this.couponInfo.id : '',
+						exchangeCode: this.exchangeCode,
+						promotionGroupId: this.groupbuyId || '',
+						goodsPackageId: this.packageId || '',
+
+						applyAmount: this.applyForm.amount,
+						applyRemark: this.applyForm.remark,
+					},
+					isLoading: 1,
+				}).then((res) => {
+					this.cancelApplyForm();
+					this.$successToast('提交成功');
+					setTimeout(() => {
+						uni.redirectTo({
+							url: '/pages/mine/discount/list',
+						});
+					}, 500);
+				});
+			},
+		},
+	};
+</script>
+
+<style lang="scss">
+	.guobutishi {
+		width: 65%;
+		display: inline-block;
+		height: 100%;
+		z-index: 100;
+		display: flex;
+		border: 1px solid #fe781f;
+		box-sizing: border-box;
+		padding: 10rpx;
+		border-radius: 10rpx;
+
+		.guobutishi1 {
+			font-size: 22rpx;
+			border-radius: 10rpx;
+			background: red;
+			box-sizing: border-box;
+			padding: 0 10rpx;
+			color: #e5e5e5;
+			margin-right: 10rpx;
+		}
+
+		.guobutishi2 {
+			font-size: 24rpx;
+			color: #fe781f;
+		}
+	}
+
+	.app-container {
+		background: #f4f2f2;
+		padding: 20rpx 20rpx 160rpx;
+		box-sizing: border-box;
+
+		&.hasNoticebar {
+			padding-top: 84rpx;
+		}
+
+		.noticebar {
+			position: fixed;
+			top: 0;
+			left: 0;
+			width: 100%;
+			z-index: 100;
+		}
+	}
+
+	.card {
+		background: #ffffff;
+		border-radius: 20rpx;
+		margin-top: 20rpx;
+		padding: 0 20rpx;
+	}
+
+	.address-container {
+		background: #ffffff;
+		border-radius: 20rpx;
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		height: 150rpx;
+		padding: 0 20rpx;
+
+		.right {
+			width: 16rpx;
+			height: 28rpx;
+			flex-shrink: 0;
+		}
+
+		.left {
+			display: flex;
+			align-items: center;
+			margin-right: 20rpx;
+
+			.icon {
+				width: 52rpx;
+				height: 52rpx;
+				border-radius: 50%;
+				background: linear-gradient(-90deg, #ff4042 0%, #fe781f 100%);
+				display: flex;
+				flex-shrink: 0;
+				justify-content: center;
+				align-items: center;
+				margin-right: 20rpx;
+
+				image {
+					width: 28rpx;
+					height: 36rpx;
+				}
+			}
+
+			.nodata {
+				font-size: 28rpx;
+				color: #999999;
+			}
+
+			.hasdata {
+				.name {
+					font-size: 32rpx;
+					color: #333333;
+
+					text {
+						color: #999999;
+						font-size: 28rpx;
+						margin-left: 16rpx;
+					}
+				}
+
+				.address {
+					font-size: 28rpx;
+					color: #666666;
+					line-height: 34rpx;
+					margin-top: 10rpx;
+				}
+			}
+		}
+	}
+
+	.goods-container {
+		.title {
+			font-size: 32rpx;
+			color: #333333;
+			line-height: 32rpx;
+			padding-top: 20rpx;
+		}
+
+		.item {
+			padding: 20rpx 0;
+			display: flex;
+			align-items: center;
+			background: #ffffff;
+			border-bottom: 1px solid #eaeaea;
+
+			&:last-child {
+				border: none;
+			}
+
+			image {
+				width: 180rpx;
+				height: 180rpx;
+				display: block;
+				margin-right: 20rpx;
+				flex-shrink: 0;
+			}
+
+			.right {
+				width: 470rpx;
+				height: 190rpx;
+				display: flex;
+				justify-content: space-between;
+				flex-direction: column;
+
+				.name {
+					font-size: 28rpx;
+					color: #333333;
+					line-height: 36rpx;
+					height: 72rpx;
+				}
+
+				.des {
+					font-size: 24rpx;
+					color: #999999;
+					line-height: 36rpx;
+				}
+
+				.bottom {
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+
+					.price {
+						display: flex;
+						flex-direction: column;
+					}
+
+					.price-1 {
+						font-size: 32rpx;
+						color: #ff3f42;
+						line-height: 36rpx;
+					}
+
+					.price-2 {
+						font-size: 26rpx;
+						color: #666666;
+						line-height: 30rpx;
+						text-decoration: line-through;
+					}
+				}
+			}
+		}
+	}
+
+	.row-container {
+		.item {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			min-height: 88rpx;
+			border-bottom: 1px solid #eaeaea;
+
+			&:last-child {
+				border: none;
+			}
+
+			.title {
+				font-size: 28rpx;
+				color: #333333;
+			}
+
+			.coupon {
+				display: flex;
+				align-items: center;
+
+				image {
+					width: 16rpx;
+					height: 28rpx;
+					margin-left: 15rpx;
+				}
+			}
+
+			.input {
+				width: 500rpx;
+
+				input {
+					width: 500rpx;
+					height: 88rpx;
+					text-align: right;
+				}
+			}
+
+			.radio-group {
+				display: flex;
+				height: 48rpx;
+				align-items: center;
+
+				.radio {
+					display: flex;
+					align-items: center;
+					margin-left: 30rpx;
+
+					.iconfont {
+						font-size: 36rpx;
+						color: #999999;
+						margin-right: 10rpx;
+
+						&.active {
+							color: #ff3f42;
+						}
+					}
+				}
+			}
+
+			.remark {
+				width: 500rpx;
+
+				textarea {
+					width: 500rpx;
+					padding: 20rpx 0;
+				}
+			}
+
+			.orange {
+				font-size: 28rpx;
+				color: #fe781f;
+			}
+		}
+	}
+
+	.bottom-container {
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		z-index: 99;
+		width: 100%;
+		box-sizing: border-box;
+		background: #ffffff;
+		padding: 0 20rpx;
+		display: flex;
+		justify-content: flex-end;
+		align-items: center;
+		height: 100rpx;
+
+		.left {
+			font-size: 28rpx;
+			color: #333333;
+
+			text {
+				color: #ff3f42;
+			}
+		}
+
+		.btn-group {
+			display: flex;
+		}
+
+		.button {
+			width: 190rpx;
+			height: 80rpx;
+			border-radius: 80rpx;
+			background: linear-gradient(-90deg, #ff3f42 0%, #fe781f 100%);
+			font-size: 28rpx;
+			color: #ffffff;
+			text-align: center;
+			line-height: 80rpx;
+		}
+
+		.button2 {
+			width: 190rpx;
+			height: 80rpx;
+			border-radius: 80rpx;
+			font-size: 28rpx;
+			color: #ff3f42;
+			text-align: center;
+			line-height: 80rpx;
+			margin-right: 10rpx;
+			border: 1px solid #ff3f42;
+			box-sizing: border-box;
+		}
+
+		.button3 {
+			width: 220rpx;
+			height: 80rpx;
+			border-radius: 80rpx;
+			font-size: 28rpx;
+			color: #ffffff;
+			text-align: center;
+			line-height: 80rpx;
+			margin-right: 10rpx;
+			border: 1px solid #ff3f42;
+			background: #ff3f42;
+			box-sizing: border-box;
+		}
+	}
+
+	.codeDialog {
+		position: fixed;
+		top: 40%;
+		left: 150rpx;
+		z-index: 999;
+		width: 400rpx;
+		background: #ffffff;
+		border-radius: 10rpx;
+		box-sizing: border-box;
+		padding: 20rpx 20rpx 40rpx;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+
+		.close {
+			width: 100%;
+			display: flex;
+			justify-content: flex-end;
+
+			image {
+				width: 32rpx;
+				height: 32rpx;
+				display: block;
+			}
+		}
+
+		.code {
+			margin-top: 10rpx;
+
+			image {
+				width: 280rpx;
+				height: 280rpx;
+				display: block;
+			}
+		}
+
+		.tips {
+			font-size: 28rpx;
+			color: #666666;
+			margin-top: 20rpx;
+		}
+	}
+
+	.apply-dialog {
+		position: fixed;
+		top: 0;
+		left: 0;
+		z-index: 9999;
+		width: 100%;
+		height: 100%;
+		background: rgba(0, 0, 0, 0.3);
+		display: flex;
+		align-items: center;
+		justify-content: center;
+
+		.dialog {
+			width: 600rpx;
+			background: #ffffff;
+			border-radius: 20rpx;
+			overflow: hidden;
+
+			.title {
+				font-size: 36rpx;
+				font-weight: 500;
+				text-align: center;
+				line-height: 100rpx;
+				padding-bottom: 10rpx;
+			}
+
+			.content {
+				padding: 0 40rpx 30rpx;
+
+				.row {
+					height: 50rpx;
+					display: flex;
+					align-items: center;
+					margin-bottom: 10rpx;
+					font-size: 28rpx;
+					color: #333333;
+
+					input {
+						flex: 1;
+						height: 50rpx;
+						border: 1px solid #e5e5e5;
+						margin-right: 16rpx;
+						padding: 0 12rpx;
+						font-size: 28rpx;
+					}
+				}
+			}
+
+			.btn {
+				border-top: 1px solid #eaeaea;
+				display: flex;
+
+				&>view {
+					flex: 1;
+					text-align: center;
+					line-height: 100rpx;
+					font-size: 32rpx;
+
+					&.left {
+						color: #666666;
+					}
+
+					&.right {
+						color: #ffffff;
+						background: #ff3f42;
+					}
+				}
+			}
+		}
+	}
 </style>

packageGoods/pages/search.vue

@@ -1,248 +1,248 @@
-<template>
-	<view class="app-container">
-		<view class="search-container">
-			<view class="search">
-				<image src="/static/icon/search.png" class=""></image>
-				<input type="text" confirm-type="search" placeholder="搜索商品名称或型号" v-model="keyword" @confirm="searchSubmit">
-			</view>
-		</view>
-		
-		<view class="list-container">
-			<block v-for="(item, index) in goodsList" :key='index'>
-				<view class="item" @tap="toGoodsDetail(item.goodsId)">
-					<view class="image">
-					  <image :src="item.imgUrl" mode="aspectFill" class="img"></image>
-					  <image
-					    :src="item.logo"
-					    mode="aspectFill"
-					    class="water"
-					    v-if="item.isShowWater"
-					  ></image>
-					</view>
-					<view class="content">
-						<view class="title ellipsis-2">{{item.goodsName}}</view>
-						<view class="bottom">
-							<view class="price">
-								<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
-								<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
-							</view>
-							<view class="btn"><image src="@/static/icon/cart.png" mode="aspectFill"></image></view>
-						</view>
-					</view>
-				</view>
-			</block>
-		</view>
-		<no-data v-if="!goodsList.length" :showText="'暂无商品'"></no-data>
-		<loading-text v-if="goodsList.length"  :loading="loading" :noMore="noMore" ></loading-text>
-	</view>
-</template>
-
-<script>
-	export default {
-		data() {
-			return {
-				keyword: '',
-				goodsList: [],
-				pageNum: 1,
-				pageSize: 8,
-				noMore: false,
-				loading: false,
-			}
-		},
-		
-		onLoad({keyword}) {
-			this.keyword = keyword;
-			this.getGoodsList();
-		},
-		
-		// 下拉刷新
-		onPullDownRefresh() {
-			this.pageNum = 1;
-			this.getGoodsList();
-		},
-		
-		// 上拉加载
-		onReachBottom() {
-			this.getGoodsList(1);
-		},
-		
-		methods: {
-			// 获取商品列表
-			getGoodsList(loadMore) {
-				if(this.noMore && loadMore)return;
-				this.noMore = false
-				if(!loadMore){
-					this.pageNum = 1;
-				}else{
-					this.loading = true;
-				}
-				this.$axios({
-					url: '/goods/list/sort/page',
-					method: 'get',
-					params: {
-						pageNum: this.pageNum,
-						pageSize: this.pageSize,
-						keyword: this.keyword,
-					},
-					isLoading: !loadMore
-				}).then(res => {
-					res.data.records.forEach((item) => {
-					  if (item.logo && item.logoStartTime) {
-					    item.isShowWater = this.$compareTime(
-					      item.logoStartTime,
-					      item.logoEndTime
-					    );
-					  } else {
-					    item.isShowWater = false;
-					  }
-					});
-					let _list = res.data.records;
-					let pageTotal = res.data.pages;
-					if(this.pageNum >= pageTotal){
-						this.noMore = true;
-					}
-					if (_list.length) {
-						this.pageNum += 1
-					}
-					if (loadMore) {
-						this.goodsList = this.goodsList.concat(_list);
-						this.loading = false;
-					} else {
-						this.goodsList = _list;
-					}
-					
-					uni.stopPullDownRefresh();
-				})
-			},
-			
-			searchSubmit() {
-				this.getGoodsList();
-			},
-			
-			toGoodsDetail(id) {
-				uni.navigateTo({
-					url:'/packageGoods/pages/detail?id=' + id
-				})
-			}
-		}
-	}
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #F4F2F2;
-		box-sizing: border-box;
-		padding-top: 90rpx;
-	}
-	.search-container {
-		background: #FFFFFF;
-		padding: 12rpx 20rpx;
-		border-bottom: 1px solid #F4F2F2;
-		position: fixed;
-		top: 0;
-		left: 0;
-		width: 100%;
-		box-sizing: border-box;
-		.search {
-			height: 64rpx;
-			display: flex;
-			align-items: center;
-			background: #F0F0F0;
-			border-radius: 64rpx;
-			padding: 0 20rpx;
-			image {
-				width: 28rpx;
-				height: 28rpx;
-			}
-			input {
-				width: 100%;
-				padding-left: 15rpx;
-			}
-		}
-	}
-	.list-container {
-		display: flex;
-		flex-wrap: wrap;
-		padding: 20rpx;
-		.item {
-			width: 348rpx;
-			background: #FFFFFF;
-			margin-right: 14rpx;
-			margin-bottom: 20rpx;
-			border-radius: 20rpx;
-			overflow: hidden;
-			&:nth-child(2n) {
-				margin-right: 0;
-			}
-			// image {
-			// 	width: 348rpx;
-			// 	height: 348rpx;
-			// }
-			.image {
-			  width: 348rpx;
-			  height: 348rpx;
-			  flex-shrink: 0;
-			  position: relative;
-			  .img {
-			    width: 348rpx;
-			    height: 348rpx;
-			    display: block;
-			  }
-			  .water {
-			    width: 348rpx;
-			    height: 348rpx;
-			    display: block;
-			    position: absolute;
-			    left: 0;
-			    top: 0;
-			    z-index: 1;
-			  }
-			}
-			.content {
-				padding: 15rpx 20rpx;
-				.title {
-					font-size: 30rpx;
-					color: #333333;
-					line-height: 36rpx;
-					font-weight: 600;
-					height: 72rpx;
-				}
-				.bottom {
-					display: flex;
-					justify-content: space-between;
-					align-items: center;
-					margin-top: 10rpx;
-					.price {
-						display: flex;
-						flex-direction: column;
-					}
-					.price-1 {
-						font-size: 32rpx;
-						color: #FF3F42;
-						line-height: 36rpx;
-					}
-					.price-2 {
-						font-size: 26rpx;
-						color: #666666;
-						line-height: 30rpx;
-						text-decoration: line-through;
-					}
-					.btn {
-						width: 60rpx;
-						height: 60rpx;
-						background: #FE781F;
-						border-radius: 50%;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						image {
-							width: 41rpx;
-							height: 36rpx;
-							display: block;
-						}
-					}
-				}
-			}
-		}
-	}
-</style>
+<template>
+	<view class="app-container">
+		<view class="search-container">
+			<view class="search">
+				<image src="/static/icon/search.png" class=""></image>
+				<input type="text" confirm-type="search" placeholder="搜索商品名称或型号" v-model="keyword" @confirm="searchSubmit">
+			</view>
+		</view>
+		
+		<view class="list-container">
+			<block v-for="(item, index) in goodsList" :key='index'>
+				<view class="item" @tap="toGoodsDetail(item.goodsId)">
+					<view class="image">
+					  <image :src="item.imgUrl" mode="aspectFill" class="img"></image>
+					  <image
+					    :src="item.logo"
+					    mode="aspectFill"
+					    class="water"
+					    v-if="item.isShowWater"
+					  ></image>
+					</view>
+					<view class="content">
+						<view class="title ellipsis-2">{{item.goodsName}}</view>
+						<view class="bottom">
+							<view class="price">
+								<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
+								<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
+							</view>
+							<view class="btn"><image src="@/static/icon/cart.png" mode="aspectFill"></image></view>
+						</view>
+					</view>
+				</view>
+			</block>
+		</view>
+		<no-data v-if="!goodsList.length" :showText="'暂无商品'"></no-data>
+		<loading-text v-if="goodsList.length"  :loading="loading" :noMore="noMore" ></loading-text>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				keyword: '',
+				goodsList: [],
+				pageNum: 1,
+				pageSize: 8,
+				noMore: false,
+				loading: false,
+			}
+		},
+		
+		onLoad({keyword}) {
+			this.keyword = keyword;
+			this.getGoodsList();
+		},
+		
+		// 下拉刷新
+		onPullDownRefresh() {
+			this.pageNum = 1;
+			this.getGoodsList();
+		},
+		
+		// 上拉加载
+		onReachBottom() {
+			this.getGoodsList(1);
+		},
+		
+		methods: {
+			// 获取商品列表
+			getGoodsList(loadMore) {
+				if(this.noMore && loadMore)return;
+				this.noMore = false
+				if(!loadMore){
+					this.pageNum = 1;
+				}else{
+					this.loading = true;
+				}
+				this.$axios({
+					url: '/goods/list/sort/page',
+					method: 'get',
+					params: {
+						pageNum: this.pageNum,
+						pageSize: this.pageSize,
+						keyword: this.keyword,
+					},
+					isLoading: !loadMore
+				}).then(res => {
+					res.data.records.forEach((item) => {
+					  if (item.logo && item.logoStartTime) {
+					    item.isShowWater = this.$compareTime(
+					      item.logoStartTime,
+					      item.logoEndTime
+					    );
+					  } else {
+					    item.isShowWater = false;
+					  }
+					});
+					let _list = res.data.records;
+					let pageTotal = res.data.pages;
+					if(this.pageNum >= pageTotal){
+						this.noMore = true;
+					}
+					if (_list.length) {
+						this.pageNum += 1
+					}
+					if (loadMore) {
+						this.goodsList = this.goodsList.concat(_list);
+						this.loading = false;
+					} else {
+						this.goodsList = _list;
+					}
+					
+					uni.stopPullDownRefresh();
+				})
+			},
+			
+			searchSubmit() {
+				this.getGoodsList();
+			},
+			
+			toGoodsDetail(id) {
+				uni.navigateTo({
+					url:'/packageGoods/pages/detail?id=' + id
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		box-sizing: border-box;
+		padding-top: 90rpx;
+	}
+	.search-container {
+		background: #FFFFFF;
+		padding: 12rpx 20rpx;
+		border-bottom: 1px solid #F4F2F2;
+		position: fixed;
+		top: 0;
+		left: 0;
+		width: 100%;
+		box-sizing: border-box;
+		.search {
+			height: 64rpx;
+			display: flex;
+			align-items: center;
+			background: #F0F0F0;
+			border-radius: 64rpx;
+			padding: 0 20rpx;
+			image {
+				width: 28rpx;
+				height: 28rpx;
+			}
+			input {
+				width: 100%;
+				padding-left: 15rpx;
+			}
+		}
+	}
+	.list-container {
+		display: flex;
+		flex-wrap: wrap;
+		padding: 20rpx;
+		.item {
+			width: 348rpx;
+			background: #FFFFFF;
+			margin-right: 14rpx;
+			margin-bottom: 20rpx;
+			border-radius: 20rpx;
+			overflow: hidden;
+			&:nth-child(2n) {
+				margin-right: 0;
+			}
+			// image {
+			// 	width: 348rpx;
+			// 	height: 348rpx;
+			// }
+			.image {
+			  width: 348rpx;
+			  height: 348rpx;
+			  flex-shrink: 0;
+			  position: relative;
+			  .img {
+			    width: 348rpx;
+			    height: 348rpx;
+			    display: block;
+			  }
+			  .water {
+			    width: 348rpx;
+			    height: 348rpx;
+			    display: block;
+			    position: absolute;
+			    left: 0;
+			    top: 0;
+			    z-index: 1;
+			  }
+			}
+			.content {
+				padding: 15rpx 20rpx;
+				.title {
+					font-size: 30rpx;
+					color: #333333;
+					line-height: 36rpx;
+					font-weight: 600;
+					height: 72rpx;
+				}
+				.bottom {
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+					margin-top: 10rpx;
+					.price {
+						display: flex;
+						flex-direction: column;
+					}
+					.price-1 {
+						font-size: 32rpx;
+						color: #FF3F42;
+						line-height: 36rpx;
+					}
+					.price-2 {
+						font-size: 26rpx;
+						color: #666666;
+						line-height: 30rpx;
+						text-decoration: line-through;
+					}
+					.btn {
+						width: 60rpx;
+						height: 60rpx;
+						background: #FE781F;
+						border-radius: 50%;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+						image {
+							width: 41rpx;
+							height: 36rpx;
+							display: block;
+						}
+					}
+				}
+			}
+		}
+	}
+</style>

packageGoods/pages/seckill.vue

@@ -1,458 +1,458 @@
-<template>
-	<view class="app-container">
-		<view class="bg-container">
-			<image src="@/static/home/top_bg.png" mode="widthFix"></image>
-		</view>
-		<view class="top-container">
-			<image src="@/static/home/top_bg2.png" mode="widthFix" class="front-bg" v-if="StatusBar <= 20"></image>
-			<image src="@/static/home/top_bg3.png" mode="widthFix" class="front-bg" v-if="StatusBar > 20"></image>
-			
-			<view class="content" :style="'height:' + (StatusBar > 20 ? getpx(350) : getpx(300)) + 'px'">
-				<view class="title" :style="cuStyle">
-					<view class="left" @tap="toBack">
-						<image src="@/static/icon/back.png"></image>
-					</view>
-					<view class="tit">限时秒杀</view>
-					<view class="right"></view>
-				</view>
-				<view class="time-list">
-					<block v-for="(item, index) in seckillTimeList" :key='index'>
-						<view class="item" :class="seckillTimeCurrent == index ? 'current':''" @tap="changeSeckillTime(index)">
-							<view class="time">{{item.startHour}}:00</view>
-							<view class="tag" v-if="item.type == 'yjs'">已结束</view>
-							<view class="tag" v-if="item.type == 'jxz'">{{countdownTime}}</view>
-							<view class="tag" v-if="item.type == 'wks'">即将开始</view>
-						</view>
-					</block>
-				</view>
-			</view>
-		</view>
-		<view class="list-container">
-			<scroll-view class="scroll-view" scroll-y :refresher-triggered="refresherTriggered" @scrolltolower="scrolltolower" @refresherrefresh="refresherrefresh" refresher-enabled  :class="StatusBar > 20 ? 'higher':''">
-				<block v-for="(item, index) in goodsList" :key='index'>
-					<div class="item" @tap="toSeckillGoodsDetail(item.goodsId)">
-						<image :src="item.imgUrl" mode="aspectFill"></image>
-						<view class="right">
-							<view class="title ellipsis-2">{{item.goodsName}}</view>
-							<view class="des ellipsis-2">{{item.describeText ? item.describeText : ''}}</view>
-							<view class="stock-sales">
-								<view class="stock">
-									<text>剩余{{item.secStockNum}}件</text>
-									<view class="progress-box">
-										<!-- 库存 / 总数 * 100 = 剩余百分比 -->
-										<progress :percent="item.secStockNum / item.limitBuy * 100" activeColor="#FF3F42" active stroke-width="6" />
-									</view>
-								</view>
-								<view class="sales">销量：{{item.salesVolume}}</view>
-							</view>
-							<view class="bottom">
-								<view class="price">
-									<view class="price-1">¥{{item.price | numToFixed}}</view>
-									<view class="price-2">¥{{item.goodsPrice | numToFixed}}</view>
-								</view>
-								<view class="btn" v-if="seckillTimeList[seckillTimeCurrent].type == 'jxz'">马上抢</view>
-								<view class="btn2" v-else>马上抢</view>
-							</view>
-						</view>
-					</div>
-				</block>
-				<no-data v-if="!goodsList.length" :showText="'暂无商品'"></no-data>
-				<loading-text v-if="goodsList.length"  :loading="loading" :noMore="noMore" ></loading-text>
-			</scroll-view>
-		</view>
-		
-		<!-- <drag-button :isDock="true" :customBar="false" ref="dragButton"></drag-button> -->
-	</view>
-</template>
-
-<script>
-	import {mapState} from 'vuex';
-	// import dragButton from '@/components/drag-button.vue';
-	
-	export default {
-		// components:{
-		// 	dragButton
-		// },
-		data() {
-			return {
-				scrollTop: 0, // 滚动高度（用于控制自定义导航）
-				seckillTimeList: [], // 秒杀时间段列表
-				seckillTimeCurrent: 0, // 秒杀时间段选择
-				goodsList: [], // 秒杀商品列表
-				pageNum: 1,
-				pageSize: 8,
-				noMore: false,
-				loading: false,
-				countdownTime: '', // 倒计时
-				endDatetime: '', // 倒计时结束时间
-				nowDate: null, // 当前时间
-				dateInterval: null, // 时间定时器
-				refresherTriggered: false,
-				StatusBar: this.StatusBar
-			}
-		},
-		computed:{
-			cuStyle(){
-				return `height:${this.CustomBar-this.StatusBar}px; padding-top:${this.StatusBar}px;`
-			},
-			...mapState(['userInfo', 'isLogin', 'userId']),
-			isLoaded() {
-				uni.hideLoading();
-				return this.isLoaded_banner && this.isLoaded_coupon && this.isLoaded_seckill && this.isLoaded_tab && this.isLoaded_myManager;
-			}
-		},
-		watch: {
-			nowDate() {
-				let hh = this.nowDate.getHours(),
-					mm = this.nowDate.getMinutes(),
-					ss = this.nowDate.getSeconds();
-				let hs = [10, 12, 15, 18, 20];
-				if(mm == 0 && ss == 0 && hs.indexOf(hh) >= 0) {
-					setTimeout(() => {
-						this.getSeckillTimeList();
-					}, 1000)
-				}
-			}
-		},
-		onShow() {
-			// this.$refs.dragButton.init();
-		},
-		onLoad() {
-			this.getSeckillTimeList();
-		},
-		methods: {
-			toBack(){
-				uni.navigateBack({
-					delta:1
-				})
-			},
-			
-			getpx(val) {
-				return uni.upx2px(val);
-			},
-			
-			// 下拉刷新
-			refresherrefresh() {
-				this.refresherTriggered = true;
-				this.pageNum = 1;
-				this.getSeckillGoodsList();
-			},
-			
-			// 上拉加载
-			scrolltolower() {
-				this.getSeckillGoodsList(true);
-			},
-			
-			findElem(array, attr, val) {
-			    for (var i = 0; i < array.length; i++) {
-			        if (array[i][attr] == val) {
-			            return i; //返回当前索引值
-			        }
-			    }
-			    return -1;
-			},
-			
-			// 计算倒计时
-			countTime() {
-				let endDatetime = this.endDatetime.replace(/\-/g, '/');
-				// console.log(endDatetime)
-			    var nowtime = new Date(),  //获取当前时间
-			        endtime = new Date(endDatetime);  //定义结束时间
-			    var lefttime = endtime.getTime() - nowtime.getTime(),  //距离结束时间的毫秒数
-			        hh = Math.floor(lefttime/(1000*60*60)),  //计算小时数
-			        mm = Math.floor(lefttime/(1000*60)%60),  //计算分钟数
-			        ss = Math.floor(lefttime/1000%60);  //计算秒数
-				// console.log(new Date(endDatetime))
-				function checkTime(i){
-					if (i<10) {
-						i = "0"+i;
-					}
-					return i;
-				}
-				setTimeout(() => {
-					this.countTime();
-				}, 1000);
-				this.countdownTime = checkTime(hh) + ":" + checkTime(mm) + ":" + checkTime(ss);
-				// console.log(this.countdownTime)
-			},
-			
-			// 获取秒杀时间列表
-			getSeckillTimeList() {
-				this.$axios({
-					url: '/goods/sec/time',
-					method: 'get',
-					params: {}
-				}).then(res => {
-					if(res.data.length < 1) {return false;}
-					this.seckillTimeList = res.data;
-					this.seckillTimeCurrent = this.findElem(this.seckillTimeList, 'type', 'jxz');
-					if(this.seckillTimeCurrent == -1) {
-						this.seckillTimeCurrent = 0;
-						this.getSeckillGoodsList();
-					}else {
-						this.endDatetime = this.seckillTimeList[this.seckillTimeCurrent].endDatetime;
-						this.countTime();
-						this.getSeckillGoodsList();
-					}
-				}).finally(res => {
-					this.isLoaded_seckill = true;
-				})
-			},
-			
-			// 切换秒杀时间
-			changeSeckillTime(index) {
-				this.seckillTimeCurrent = index;
-				this.getSeckillGoodsList();
-			},
-			
-			// 获取秒杀商品列表
-			getSeckillGoodsList(loadMore) {
-				if(this.noMore && loadMore)return;
-				this.noMore = false;
-				if(!loadMore){
-					this.pageNum = 1;
-				}else{
-					this.loading = true;
-				}
-				let secKillId = this.seckillTimeList[this.seckillTimeCurrent].secKillId;
-				this.$axios({
-					url: '/goods/sec/goods/list',
-					method: 'get',
-					params: {
-						pageNum: this.pageNum,
-						pageSize: this.pageSize,
-						secKillId: secKillId,
-					}
-				}).then(res => {
-					let _list = res.data.records;
-					let pageTotal = res.data.pages;
-					if(this.pageNum >= pageTotal){
-						this.noMore = true;
-					}
-					if (_list.length) {
-						this.pageNum += 1
-					}
-					if (loadMore) {
-						this.goodsList = this.goodsList.concat(_list);
-						this.loading = false;
-					} else {
-						this.goodsList = _list;
-					}
-				}).finally(res => {
-					this.refresherTriggered = false;
-				})
-			},
-			
-			// 进入秒杀商品详情
-			toSeckillGoodsDetail(id) {
-				if(!id) {
-					return false;
-				}
-				if(this.seckillTimeList[this.seckillTimeCurrent].type == 'wks') {
-					return this.$toast('活动未开始');
-				}
-				uni.navigateTo({
-					url: '/packageGoods/pages/detail?id=' + id
-				})
-			},
-		}
-	}
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #F4F2F2;
-		box-sizing: border-box;
-	}
-	.bg-container {
-		position: fixed;
-		top: 0;
-		left: 0;
-		z-index: 0;
-		image {
-			width: 750rpx;
-		}
-	}
-	.top-container {
-		position: relative;
-		.front-bg {
-			display: block;
-			width: 750rpx;
-			position: absolute;
-			top: 0;
-			z-index: 0;
-		}
-		.content {
-			width: 750rpx;
-			padding: 0 20rpx;
-			position: relative;
-			box-sizing: border-box;
-			z-index: 1;
-			display: flex;
-			flex-direction: column;
-			justify-content: space-between;
-		}
-		.title {
-			display: flex;
-			align-items: center;
-			justify-content: space-between;
-			color: #FFFFFF;
-			font-size: 36rpx;
-			.left {
-				width: 50rpx;
-				height: 50rpx;
-				display: flex;
-				align-items: center;
-				justify-content: center;
-			}
-			image {
-				width: 32rpx;
-				height: 32rpx;
-				display: block;
-			}
-			.right {
-				width: 50rpx;
-				height: 50rpx;
-			}
-		}
-		.time-list {
-			flex: 1;
-			display: flex;
-			overflow-x: scroll;
-			align-items: center;
-			.item {
-				display: flex;
-				flex-direction: column;
-				align-items: center;
-				flex-shrink: 0;
-				width: 140rpx;
-				margin-right: 48rpx;
-				.time {
-					font-size: 32rpx;
-					color: #FFFFFF;
-				}
-				.tag {
-					width: 140rpx;
-					height: 44rpx;
-					border-radius: 44rpx;
-					border: 1px solid #FFFFFF;
-					font-size: 24rpx;
-					color: #FFFFFF;
-					box-sizing: border-box;
-					margin-top: 12rpx;
-					display: flex;
-					align-items: center;
-					justify-content: center;
-				}
-				&.current {
-					.tag {
-						background: #FFFFFF;
-						color: #FF3F42;
-					}
-				}
-			}
-		}
-	}
-	.list-container {
-		padding: 0 20rpx;
-		.scroll-view {
-			height: calc(100vh - 300rpx);
-			&.higher {
-				height: calc(100vh - 350rpx);
-			}
-		}
-		.item {
-			background: #FFFFFF;
-			border-radius: 10rpx;
-			display: flex;
-			padding: 20rpx;
-			margin-bottom: 20rpx;
-			image {
-				display: block;
-				width: 180rpx;
-				height: 180rpx;
-				flex-shrink: 0;
-			}
-			.right {
-				width: 490rpx;
-				box-sizing: border-box;
-				padding-left: 20rpx;
-				.title {
-					font-size: 30rpx;
-					color: #333333;
-					line-height: 36rpx;
-					font-weight: 600;
-				}
-				.des {
-					font-size: 24rpx;
-					line-height: 30rpx;
-					color: #999999;
-					margin-top: 6rpx;
-				}
-				.stock-sales {
-					display: flex;
-					justify-content: space-between;
-					align-items: center;
-					margin-top: 10rpx;
-					font-size: 24rpx;
-					color: #666666;
-					.stock {
-						display: flex;
-						align-items: center;
-						text {
-							font-size: 24rpx;
-							color: #666666;
-						}
-						.progress-box {
-							width: 140rpx;
-							border-radius: 6px;
-							overflow: hidden;
-							margin-left: 10rpx;
-						}
-					}
-				}
-				.bottom {
-					display: flex;
-					justify-content: space-between;
-					align-items: center;
-					margin-top: 10rpx;
-					.price {
-						display: flex;
-						flex-direction: column;
-					}
-					.price-1 {
-						font-size: 32rpx;
-						color: #FF3F42;
-						line-height: 36rpx;
-					}
-					.price-2 {
-						font-size: 26rpx;
-						color: #666666;
-						line-height: 30rpx;
-						text-decoration: line-through;
-					}
-					.btn {
-						width: 110rpx;
-						height: 44rpx;
-						background: #FF3F42;
-						border-radius: 5rpx;
-						font-size: 28rpx;
-						color: #FFFFFF;
-						text-align: center;
-						line-height: 44rpx;
-					}
-					.btn2 {
-						width: 110rpx;
-						height: 44rpx;
-						background: #AAAAAA;
-						border-radius: 5rpx;
-						font-size: 28rpx;
-						color: #FFFFFF;
-						text-align: center;
-						line-height: 44rpx;
-					}
-				}
-			}
-		}
-	}
-</style>
+<template>
+	<view class="app-container">
+		<view class="bg-container">
+			<image src="@/static/home/top_bg.png" mode="widthFix"></image>
+		</view>
+		<view class="top-container">
+			<image src="@/static/home/top_bg2.png" mode="widthFix" class="front-bg" v-if="StatusBar <= 20"></image>
+			<image src="@/static/home/top_bg3.png" mode="widthFix" class="front-bg" v-if="StatusBar > 20"></image>
+			
+			<view class="content" :style="'height:' + (StatusBar > 20 ? getpx(350) : getpx(300)) + 'px'">
+				<view class="title" :style="cuStyle">
+					<view class="left" @tap="toBack">
+						<image src="@/static/icon/back.png"></image>
+					</view>
+					<view class="tit">限时秒杀</view>
+					<view class="right"></view>
+				</view>
+				<view class="time-list">
+					<block v-for="(item, index) in seckillTimeList" :key='index'>
+						<view class="item" :class="seckillTimeCurrent == index ? 'current':''" @tap="changeSeckillTime(index)">
+							<view class="time">{{item.startHour}}:00</view>
+							<view class="tag" v-if="item.type == 'yjs'">已结束</view>
+							<view class="tag" v-if="item.type == 'jxz'">{{countdownTime}}</view>
+							<view class="tag" v-if="item.type == 'wks'">即将开始</view>
+						</view>
+					</block>
+				</view>
+			</view>
+		</view>
+		<view class="list-container">
+			<scroll-view class="scroll-view" scroll-y :refresher-triggered="refresherTriggered" @scrolltolower="scrolltolower" @refresherrefresh="refresherrefresh" refresher-enabled  :class="StatusBar > 20 ? 'higher':''">
+				<block v-for="(item, index) in goodsList" :key='index'>
+					<div class="item" @tap="toSeckillGoodsDetail(item.goodsId)">
+						<image :src="item.imgUrl" mode="aspectFill"></image>
+						<view class="right">
+							<view class="title ellipsis-2">{{item.goodsName}}</view>
+							<view class="des ellipsis-2">{{item.describeText ? item.describeText : ''}}</view>
+							<view class="stock-sales">
+								<view class="stock">
+									<text>剩余{{item.secStockNum}}件</text>
+									<view class="progress-box">
+										<!-- 库存 / 总数 * 100 = 剩余百分比 -->
+										<progress :percent="item.secStockNum / item.limitBuy * 100" activeColor="#FF3F42" active stroke-width="6" />
+									</view>
+								</view>
+								<view class="sales">销量：{{item.salesVolume}}</view>
+							</view>
+							<view class="bottom">
+								<view class="price">
+									<view class="price-1">¥{{item.price | numToFixed}}</view>
+									<view class="price-2">¥{{item.goodsPrice | numToFixed}}</view>
+								</view>
+								<view class="btn" v-if="seckillTimeList[seckillTimeCurrent].type == 'jxz'">马上抢</view>
+								<view class="btn2" v-else>马上抢</view>
+							</view>
+						</view>
+					</div>
+				</block>
+				<no-data v-if="!goodsList.length" :showText="'暂无商品'"></no-data>
+				<loading-text v-if="goodsList.length"  :loading="loading" :noMore="noMore" ></loading-text>
+			</scroll-view>
+		</view>
+		
+		<!-- <drag-button :isDock="true" :customBar="false" ref="dragButton"></drag-button> -->
+	</view>
+</template>
+
+<script>
+	import {mapState} from 'vuex';
+	// import dragButton from '@/components/drag-button.vue';
+	
+	export default {
+		// components:{
+		// 	dragButton
+		// },
+		data() {
+			return {
+				scrollTop: 0, // 滚动高度（用于控制自定义导航）
+				seckillTimeList: [], // 秒杀时间段列表
+				seckillTimeCurrent: 0, // 秒杀时间段选择
+				goodsList: [], // 秒杀商品列表
+				pageNum: 1,
+				pageSize: 8,
+				noMore: false,
+				loading: false,
+				countdownTime: '', // 倒计时
+				endDatetime: '', // 倒计时结束时间
+				nowDate: null, // 当前时间
+				dateInterval: null, // 时间定时器
+				refresherTriggered: false,
+				StatusBar: this.StatusBar
+			}
+		},
+		computed:{
+			cuStyle(){
+				return `height:${this.CustomBar-this.StatusBar}px; padding-top:${this.StatusBar}px;`
+			},
+			...mapState(['userInfo', 'isLogin', 'userId']),
+			isLoaded() {
+				uni.hideLoading();
+				return this.isLoaded_banner && this.isLoaded_coupon && this.isLoaded_seckill && this.isLoaded_tab && this.isLoaded_myManager;
+			}
+		},
+		watch: {
+			nowDate() {
+				let hh = this.nowDate.getHours(),
+					mm = this.nowDate.getMinutes(),
+					ss = this.nowDate.getSeconds();
+				let hs = [10, 12, 15, 18, 20];
+				if(mm == 0 && ss == 0 && hs.indexOf(hh) >= 0) {
+					setTimeout(() => {
+						this.getSeckillTimeList();
+					}, 1000)
+				}
+			}
+		},
+		onShow() {
+			// this.$refs.dragButton.init();
+		},
+		onLoad() {
+			this.getSeckillTimeList();
+		},
+		methods: {
+			toBack(){
+				uni.navigateBack({
+					delta:1
+				})
+			},
+			
+			getpx(val) {
+				return uni.upx2px(val);
+			},
+			
+			// 下拉刷新
+			refresherrefresh() {
+				this.refresherTriggered = true;
+				this.pageNum = 1;
+				this.getSeckillGoodsList();
+			},
+			
+			// 上拉加载
+			scrolltolower() {
+				this.getSeckillGoodsList(true);
+			},
+			
+			findElem(array, attr, val) {
+			    for (var i = 0; i < array.length; i++) {
+			        if (array[i][attr] == val) {
+			            return i; //返回当前索引值
+			        }
+			    }
+			    return -1;
+			},
+			
+			// 计算倒计时
+			countTime() {
+				let endDatetime = this.endDatetime.replace(/\-/g, '/');
+				// console.log(endDatetime)
+			    var nowtime = new Date(),  //获取当前时间
+			        endtime = new Date(endDatetime);  //定义结束时间
+			    var lefttime = endtime.getTime() - nowtime.getTime(),  //距离结束时间的毫秒数
+			        hh = Math.floor(lefttime/(1000*60*60)),  //计算小时数
+			        mm = Math.floor(lefttime/(1000*60)%60),  //计算分钟数
+			        ss = Math.floor(lefttime/1000%60);  //计算秒数
+				// console.log(new Date(endDatetime))
+				function checkTime(i){
+					if (i<10) {
+						i = "0"+i;
+					}
+					return i;
+				}
+				setTimeout(() => {
+					this.countTime();
+				}, 1000);
+				this.countdownTime = checkTime(hh) + ":" + checkTime(mm) + ":" + checkTime(ss);
+				// console.log(this.countdownTime)
+			},
+			
+			// 获取秒杀时间列表
+			getSeckillTimeList() {
+				this.$axios({
+					url: '/goods/sec/time',
+					method: 'get',
+					params: {}
+				}).then(res => {
+					if(res.data.length < 1) {return false;}
+					this.seckillTimeList = res.data;
+					this.seckillTimeCurrent = this.findElem(this.seckillTimeList, 'type', 'jxz');
+					if(this.seckillTimeCurrent == -1) {
+						this.seckillTimeCurrent = 0;
+						this.getSeckillGoodsList();
+					}else {
+						this.endDatetime = this.seckillTimeList[this.seckillTimeCurrent].endDatetime;
+						this.countTime();
+						this.getSeckillGoodsList();
+					}
+				}).finally(res => {
+					this.isLoaded_seckill = true;
+				})
+			},
+			
+			// 切换秒杀时间
+			changeSeckillTime(index) {
+				this.seckillTimeCurrent = index;
+				this.getSeckillGoodsList();
+			},
+			
+			// 获取秒杀商品列表
+			getSeckillGoodsList(loadMore) {
+				if(this.noMore && loadMore)return;
+				this.noMore = false;
+				if(!loadMore){
+					this.pageNum = 1;
+				}else{
+					this.loading = true;
+				}
+				let secKillId = this.seckillTimeList[this.seckillTimeCurrent].secKillId;
+				this.$axios({
+					url: '/goods/sec/goods/list',
+					method: 'get',
+					params: {
+						pageNum: this.pageNum,
+						pageSize: this.pageSize,
+						secKillId: secKillId,
+					}
+				}).then(res => {
+					let _list = res.data.records;
+					let pageTotal = res.data.pages;
+					if(this.pageNum >= pageTotal){
+						this.noMore = true;
+					}
+					if (_list.length) {
+						this.pageNum += 1
+					}
+					if (loadMore) {
+						this.goodsList = this.goodsList.concat(_list);
+						this.loading = false;
+					} else {
+						this.goodsList = _list;
+					}
+				}).finally(res => {
+					this.refresherTriggered = false;
+				})
+			},
+			
+			// 进入秒杀商品详情
+			toSeckillGoodsDetail(id) {
+				if(!id) {
+					return false;
+				}
+				if(this.seckillTimeList[this.seckillTimeCurrent].type == 'wks') {
+					return this.$toast('活动未开始');
+				}
+				uni.navigateTo({
+					url: '/packageGoods/pages/detail?id=' + id
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		box-sizing: border-box;
+	}
+	.bg-container {
+		position: fixed;
+		top: 0;
+		left: 0;
+		z-index: 0;
+		image {
+			width: 750rpx;
+		}
+	}
+	.top-container {
+		position: relative;
+		.front-bg {
+			display: block;
+			width: 750rpx;
+			position: absolute;
+			top: 0;
+			z-index: 0;
+		}
+		.content {
+			width: 750rpx;
+			padding: 0 20rpx;
+			position: relative;
+			box-sizing: border-box;
+			z-index: 1;
+			display: flex;
+			flex-direction: column;
+			justify-content: space-between;
+		}
+		.title {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			color: #FFFFFF;
+			font-size: 36rpx;
+			.left {
+				width: 50rpx;
+				height: 50rpx;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+			}
+			image {
+				width: 32rpx;
+				height: 32rpx;
+				display: block;
+			}
+			.right {
+				width: 50rpx;
+				height: 50rpx;
+			}
+		}
+		.time-list {
+			flex: 1;
+			display: flex;
+			overflow-x: scroll;
+			align-items: center;
+			.item {
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				flex-shrink: 0;
+				width: 140rpx;
+				margin-right: 48rpx;
+				.time {
+					font-size: 32rpx;
+					color: #FFFFFF;
+				}
+				.tag {
+					width: 140rpx;
+					height: 44rpx;
+					border-radius: 44rpx;
+					border: 1px solid #FFFFFF;
+					font-size: 24rpx;
+					color: #FFFFFF;
+					box-sizing: border-box;
+					margin-top: 12rpx;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+				}
+				&.current {
+					.tag {
+						background: #FFFFFF;
+						color: #FF3F42;
+					}
+				}
+			}
+		}
+	}
+	.list-container {
+		padding: 0 20rpx;
+		.scroll-view {
+			height: calc(100vh - 300rpx);
+			&.higher {
+				height: calc(100vh - 350rpx);
+			}
+		}
+		.item {
+			background: #FFFFFF;
+			border-radius: 10rpx;
+			display: flex;
+			padding: 20rpx;
+			margin-bottom: 20rpx;
+			image {
+				display: block;
+				width: 180rpx;
+				height: 180rpx;
+				flex-shrink: 0;
+			}
+			.right {
+				width: 490rpx;
+				box-sizing: border-box;
+				padding-left: 20rpx;
+				.title {
+					font-size: 30rpx;
+					color: #333333;
+					line-height: 36rpx;
+					font-weight: 600;
+				}
+				.des {
+					font-size: 24rpx;
+					line-height: 30rpx;
+					color: #999999;
+					margin-top: 6rpx;
+				}
+				.stock-sales {
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+					margin-top: 10rpx;
+					font-size: 24rpx;
+					color: #666666;
+					.stock {
+						display: flex;
+						align-items: center;
+						text {
+							font-size: 24rpx;
+							color: #666666;
+						}
+						.progress-box {
+							width: 140rpx;
+							border-radius: 6px;
+							overflow: hidden;
+							margin-left: 10rpx;
+						}
+					}
+				}
+				.bottom {
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+					margin-top: 10rpx;
+					.price {
+						display: flex;
+						flex-direction: column;
+					}
+					.price-1 {
+						font-size: 32rpx;
+						color: #FF3F42;
+						line-height: 36rpx;
+					}
+					.price-2 {
+						font-size: 26rpx;
+						color: #666666;
+						line-height: 30rpx;
+						text-decoration: line-through;
+					}
+					.btn {
+						width: 110rpx;
+						height: 44rpx;
+						background: #FF3F42;
+						border-radius: 5rpx;
+						font-size: 28rpx;
+						color: #FFFFFF;
+						text-align: center;
+						line-height: 44rpx;
+					}
+					.btn2 {
+						width: 110rpx;
+						height: 44rpx;
+						background: #AAAAAA;
+						border-radius: 5rpx;
+						font-size: 28rpx;
+						color: #FFFFFF;
+						text-align: center;
+						line-height: 44rpx;
+					}
+				}
+			}
+		}
+	}
+</style>

packageGoods/pages/template.vue

@@ -1,27 +1,27 @@
-<template>
-	<view class="app-container">
-		
-	</view>
-</template>
-
-<script>
-	export default {
-		data() {
-			return {
-				
-			}
-		},
-		methods: {
-			
-		}
-	}
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #F4F2F2;
-		padding: 0 30rpx;
-		padding-top: 20rpx;
-		box-sizing: border-box;
-	}
-</style>
+<template>
+	<view class="app-container">
+		
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		padding: 0 30rpx;
+		padding-top: 20rpx;
+		box-sizing: border-box;
+	}
+</style>

pages.json

@@ -0,0 +1,337 @@
+{
+	"insetLoader": {
+		//配置
+		"config": {
+			//将需要引入的组件名起了个confirm的名字在下面label中使用
+			//右侧"<floatButton ref='confirm' />"为需要插入的组件标签
+			"confirm": "<floatButton ref='confirm' />"
+		},
+		// 全局配置  
+		//需要挂在的组件名
+		"label": ["confirm"],
+		//根元素的标签类型 也就是插入到页面哪个根元素下默认为div 但是uniapp中需要写为view
+		"rootEle": "view"
+	},
+	
+	"pages": [{
+		"path": "pages/index/index",
+		"style": {
+			"navigationStyle": "custom",
+			"navigationBarTitleText": "首页",
+			"enablePullDownRefresh": true
+		}
+	}, {
+		"path": "pages/address/list",
+		"style": {
+			"navigationBarTitleText": "切换地址"
+		}
+	}, {
+		"path": "pages/mywebsit/index",
+		"style": {
+			"navigationBarTitleText": "选择门店"
+		}
+	}, {
+		"path": "pages/index/chakanyyzz",
+		"style": {
+			"navigationBarTitleText": "查看营业执照"
+		}
+	}, {
+		"path": "pages/index/coupon",
+		"style": {
+			"navigationBarTitleText": "领取优惠券"
+		}
+	}, {
+		"path": "pages/index/webview",
+		"style": {
+			"navigationBarTitleText": "打开企业微信小程序"
+		}
+	}, {
+		"path": "pages/login/index",
+		"style": {
+			"navigationBarTitleText": "登录"
+		}
+	}, {
+		"path": "pages/login/agreement",
+		"style": {
+			"navigationBarTitleText": "用户协议"
+		}
+	}, {
+		"path": "pages/goods/classify",
+		"style": {
+			"navigationBarTitleText": "分类"
+		}
+	}, {
+		"path": "pages/goods/all",
+		"style": {
+			"navigationBarTitleText": "全部宝贝",
+			"enablePullDownRefresh": true
+		}
+	}, {
+		"path": "pages/cart/index",
+		"style": {
+			"navigationBarTitleText": "购物车"
+		}
+	}, {
+		"path": "pages/mine/index",
+		"style": {
+			"navigationStyle": "custom",
+			"navigationBarTitleText": "我的"
+		}
+	}, {
+		"path": "pages/mine/address/list",
+		"style": {
+			"navigationBarTitleText": "我的收货地址"
+		}
+	}, {
+		"path": "pages/mine/address/form",
+		"style": {
+			"navigationBarTitleText": "新增收货地址"
+		}
+	}, {
+		"path": "pages/mine/customer/list",
+		"style": {
+			"navigationBarTitleText": "客户列表"
+		}
+	}, {
+		"path": "pages/mine/customer/tag",
+		"style": {
+			"navigationBarTitleText": "选择标签"
+		}
+	}, {
+		"path": "pages/mine/collection",
+		"style": {
+			"navigationBarTitleText": "我的收藏",
+			"enablePullDownRefresh": true
+		}
+	}, {
+		"path": "pages/mine/order/list",
+		"style": {
+			"navigationBarTitleText": "我的订单",
+			"enablePullDownRefresh": true
+		}
+	}, {
+		"path": "pages/mine/order/detail",
+		"style": {
+			"navigationBarTitleText": "订单详情"
+		}
+	}, {
+		"path": "pages/mine/order/invoice",
+		"style": {
+			"navigationBarTitleText": "发票详情"
+		}
+	}, {
+		"path": "pages/mine/order/evaluate",
+		"style": {
+			"navigationBarTitleText": "评价"
+		}
+	}, {
+		"path": "pages/mine/order/return/apply",
+		"style": {
+			"navigationBarTitleText": "退货申请"
+		}
+	}, {
+		"path": "pages/mine/order/return/detail",
+		"style": {
+			"navigationBarTitleText": "售后详情"
+		}
+	}, {
+		"path": "pages/mine/coupon/list",
+		"style": {
+			"navigationBarTitleText": "优惠券",
+			"enablePullDownRefresh": true
+		}
+	}, {
+		"path": "pages/mine/discode/list",
+		"style": {
+			"navigationBarTitleText": "我的优惠码",
+			"enablePullDownRefresh": true
+		}
+	}, {
+		"path": "pages/mine/order/logistics",
+		"style": {
+			"navigationBarTitleText": "物流详情"
+		}
+	}, {
+		"path": "pages/mine/profit/list",
+		"style": {
+			"navigationBarTitleText": "我的收益",
+			"enablePullDownRefresh": true
+		}
+	}, {
+		"path": "pages/mine/profit/return",
+		"style": {
+			"navigationBarTitleText": "退款明细",
+			"enablePullDownRefresh": true
+		}
+	}, {
+		"path": "pages/mine/profit/detail",
+		"style": {
+			"navigationBarTitleText": "收益详情"
+		}
+	}, {
+		"path": "pages/mine/wxCode",
+		"style": {
+			"navigationBarTitleText": "企微二维码"
+		}
+	}, {
+		"path": "pages/mine/mallCode",
+		"style": {
+			"navigationBarTitleText": "商城二维码"
+		}
+	}, {
+		"path": "pages/mine/ranking/list",
+		"style": {
+			"navigationStyle": "custom",
+			"navigationBarTitleText": "收益排行榜"
+		}
+	}, {
+		"path": "pages/mine/ranking/report",
+		"style": {
+			"navigationBarTitleText": "我的月报"
+		}
+	}, {
+		"path": "pages/mine/applySalesman",
+		"style": {
+			"navigationBarTitleText": "申请成为业务员"
+		}
+	}, {
+		"path": "pages/mine/workOrder/list",
+		"style": {
+			"navigationBarTitleText": "我的工单信息",
+			"enablePullDownRefresh": true
+		}
+	}, {
+		"path": "pages/mine/workOrder/detail",
+		"style": {
+			"navigationBarTitleText": "工单详情"
+		}
+	}, {
+		"path": "pages/mine/groupbuy/list",
+		"style": {
+			"navigationBarTitleText": "我的团购",
+			"enablePullDownRefresh": true
+		}
+	}, {
+		"path": "pages/mine/discount/list",
+		"style": {
+			"navigationBarTitleText": "用户减免金额",
+			"enablePullDownRefresh": true
+		}
+	}, {
+		"path": "pages/mine/discount/detail",
+		"style": {
+			"navigationBarTitleText": "订单详情"
+		}
+	}, {
+		"path": "pages/mine/exchange/index",
+		"style": {
+			"navigationBarTitleText": "兑换中心"
+		}
+	}, {
+		"path": "pages/mine/exchange/list",
+		"style": {
+			"navigationBarTitleText": "历史兑换记录",
+			"enablePullDownRefresh": true
+		}
+	}, {
+		"path": "pages/mine/exchange/detail",
+		"style": {
+			"navigationBarTitleText": "兑换码详情"
+		}
+	}],
+	
+	"subpackages": [{
+		"root": "packageGoods",
+		"name": "packageGoods",
+		"pages": [
+			{
+				"path": "pages/list",
+				"style": {
+					"navigationBarTitleText": "列表",
+					"enablePullDownRefresh": true
+				}
+			}, {
+				"path": "pages/search",
+				"style": {
+					"navigationBarTitleText": "搜索商品",
+					"enablePullDownRefresh": true
+				}
+			}, {
+				"path": "pages/detail",
+				"style": {
+					"navigationBarTitleText": "商品详情"
+				}
+			}, {
+				"path": "pages/evaluate",
+				"style": {
+					"navigationBarTitleText": "全部评价",
+					"enablePullDownRefresh": true
+				}
+			}, {
+				"path": "pages/order",
+				"style": {
+					"navigationBarTitleText": "确认订单"
+				}
+			}, {
+				"path": "pages/coupon",
+				"style": {
+					"navigationBarTitleText": "我的优惠券"
+				}
+			}, {
+				"path": "pages/seckill",
+				"style": {
+					"navigationStyle": "custom",
+					"navigationBarTitleText": "限时秒杀"
+				}
+			}, {
+				"path": "pages/activity",
+				"style": {
+					"navigationBarTitleText": "活动专区",
+					"enablePullDownRefresh": true
+				}
+			}
+		]
+	}],
+	
+	"globalStyle": {
+		"navigationBarTextStyle": "black",
+		"navigationBarTitleText": "商城",
+		"navigationBarBackgroundColor": "#F8F8F8",
+		"backgroundColor": "#F8F8F8",
+		"app-plus": {
+			"background": "#efeff4"
+		}
+	},
+	"tabBar": {
+		"color": "#7A7E83",
+		"selectedColor": "#FF3F42",
+		"borderStyle": "black",
+		"backgroundColor": "#ffffff",
+		"list": [{
+			"pagePath": "pages/index/index",
+			"iconPath": "static/tabbar/icon_home.png",
+			"selectedIconPath": "static/tabbar/icon_home_cur.png",
+			"text": "首页"
+		}, {
+			"pagePath": "pages/goods/all",
+			"iconPath": "static/tabbar/icon_goods.png",
+			"selectedIconPath": "static/tabbar/icon_goods_cur.png",
+			"text": "全部宝贝"
+		}, {
+			"pagePath": "pages/goods/classify",
+			"iconPath": "static/tabbar/icon_classify.png",
+			"selectedIconPath": "static/tabbar/icon_classify_cur.png",
+			"text": "分类"
+		}, {
+			"pagePath": "pages/cart/index",
+			"iconPath": "static/tabbar/icon_cart.png",
+			"selectedIconPath": "static/tabbar/icon_cart_cur.png",
+			"text": "购物车"
+		}, {
+			"pagePath": "pages/mine/index",
+			"iconPath": "static/tabbar/icon_mine.png",
+			"selectedIconPath": "static/tabbar/icon_mine_cur.png",
+			"text": "我的"
+		}]
+	}
+}

pages/address/list.vue

@@ -1,303 +1,303 @@
-<template>
-	<view class="app-container">
-		<view class="congxindingwei">
-			<view class="header-container">
-				<view class="left">
-					<image src="@/static/home/location.png"></image>
-					<text>{{websitData.address}}</text>
-				</view>
-				<view class="right" style="min-width: 120rpx;" @tap="getLocation">
-					<view class="item">
-						重新定位
-					</view>
-				</view>
-			</view>
-		</view>
-		<view class="wodeshouhuodiz">我的收货地址</view>
-		<view class="list-container">
-			<block v-for="(item, index) in addressList" :key="index">
-				<view class="item" @tap="chooseAddress(item)">
-					<view class="top">
-						<view class="left">
-							<view class="name">{{ item.name }}</view>
-							<view class="phone">{{ item.phone }}</view>
-							<view class="default" v-if="item.defaultAddr">默认</view>
-						</view>
-					</view>
-					<view class="bottom">{{ item.province }}{{ item.city }}{{ item.area }}{{ item.street
-            }}{{ item.address }}{{ item.houseNo }}</view>
-				</view>
-			</block>
-		</view>
-		<no-data v-if="!addressList.length" :showText="'暂无收货地址'"></no-data>
-	</view>
-</template>
-
-<script>
-	import {
-		mapState
-	} from 'vuex';
-	import EventBus from '@/utils/eventbus.js';
-	import {
-		getArea
-	} from '@/utils/utils.js';
-	export default {
-		data() {
-			return {
-				addressList: [], // 收货地址列表
-				isChoose: false, // 是否进来选择地址
-			};
-		},
-		computed: {
-			...mapState(['userInfo', 'isLogin', 'userId', 'websitData']),
-		},
-		onShow() {
-			this.getAddressList();
-		},
-		onLoad({
-			isChoose
-		}) {
-			this.isChoose = isChoose;
-		},
-		methods: {
-			// 获取收货地址列表
-			getAddressList() {
-				this.$axios({
-					url: '/user/address/list',
-					method: 'get',
-					params: {
-						pageNum: 1,
-						pageSize: 100,
-						userId: this.userId,
-					},
-				}).then((res) => {
-					this.addressList = res.data.records;
-				});
-			},
-			getLocation() {
-				let that = this;
-				uni.chooseLocation({
-					success: (res) => {
-						this.$axios({
-							url: '/user/userWebsit',
-							method: 'post',
-							params: {
-								lat: res.latitude,
-								lng: res.longitude,
-							},
-						}).then((res) => {
-							if (res?.data) {
-								this.$store.commit('changeWebsitObj', res?.data);
-								uni.setStorageSync('websitData', res?.data);
-								uni.setStorageSync("websitIdSj", res?.data.websitId);
-								uni.reLaunch({
-									url: "/pages/index/index"
-								})
-							} else {
-								uni.showModal({
-									title: '提示',
-									content: '当前定位附件暂无门店，请重新选择定位地址!',
-									success: (res) => {
-										if (res.confirm) {
-											this.getLocation()
-										} else if (res.cancel) {
-											console.log('用户点击取消');
-										}
-									}
-								});
-							}
-						});
-					},
-					fail: (res) => {
-						uni.getSetting({
-							success: function(res) {
-								if (!res.authSetting['scope.userLocation']) {
-									uni.showModal({
-										title: '是否授权当前位置',
-										content: '需要获取您的地理位置，请确认授权，否则地图功能将无法使用',
-										success(tip) {
-											if (tip.confirm) {
-												uni.openSetting({
-													success: function(data) {
-														if (data.authSetting[
-																"scope.userLocation"
-															] === true) {
-															that.$successToast(
-																'授权成功');
-															setTimeout(() => {
-																that
-																	.getLocation();
-															}, 1000)
-														}
-													}
-												})
-											}
-										}
-									})
-								}
-							}
-						})
-					}
-				});
-			},
-
-
-			// 选择地址
-			chooseAddress(item) {
-				this.$axios({
-					url: '/user/userWebsit',
-					method: 'post',
-					params: {
-						lat: item.lat,
-						lng: item.lng,
-					},
-				}).then((res) => {
-					if (res?.data) {
-						this.$store.commit('changeWebsitObj', res?.data);
-						uni.setStorageSync('websitData', res?.data);
-						uni.setStorageSync("websitIdSj", res?.data.websitId);
-						uni.reLaunch({
-							url: "/pages/index/index"
-						})
-					} else {
-						uni.showModal({
-							title: '提示',
-							content: '当前收货地址暂无门店，请重新选择收货地址!',
-							success: (res) => {
-								if (res.confirm) {} else if (res.cancel) {}
-							}
-						});
-					}
-				});
-			},
-		},
-	};
-</script>
-
-<style lang="scss">
-	.wodeshouhuodiz {
-		font-size: 32rpx;
-		font-weight: bold;
-		box-sizing: border-box;
-		padding: 30rpx 16rpx;
-	}
-
-	.congxindingwei {}
-
-	.header-container {
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-		padding: 0 10rpx 10rpx;
-
-		.left {
-			display: flex;
-			align-items: center;
-
-			image {
-				width: 48rpx;
-				height: 48rpx;
-			}
-		}
-
-		.right {
-			display: flex;
-
-			.item {
-				margin-left: 40rpx;
-				position: relative;
-				color: blue;
-			}
-		}
-	}
-
-	.app-container {
-		background: #f4f2f2;
-		padding: 20rpx;
-		padding-bottom: 250rpx;
-		box-sizing: border-box;
-	}
-
-	.list-container {
-		.item {
-			background: #ffffff;
-			border-radius: 20rpx;
-			margin-bottom: 20rpx;
-			padding: 20rpx;
-
-			.top {
-				display: flex;
-				justify-content: space-between;
-				align-items: center;
-
-				.left {
-					display: flex;
-					align-items: flex-end;
-
-					.name {
-						font-size: 32rpx;
-						color: #333333;
-						line-height: 32rpx;
-					}
-
-					.phone {
-						font-size: 28rpx;
-						color: #666666;
-						margin-left: 20rpx;
-						line-height: 28rpx;
-					}
-
-					.default {
-						font-size: 22rpx;
-						color: #ffffff;
-						background: #fe781f;
-						padding: 6rpx 8rpx;
-						line-height: 20rpx;
-						margin-left: 20rpx;
-					}
-				}
-
-				.right {
-					width: 32rpx;
-					height: 32rpx;
-				}
-			}
-
-			.bottom {
-				font-size: 28rpx;
-				color: #333333;
-				line-height: 38rpx;
-				margin-top: 20rpx;
-			}
-		}
-	}
-
-	.bottom-container {
-		position: fixed;
-		bottom: 0;
-		left: 0;
-		width: 100%;
-		box-sizing: border-box;
-		padding: 20rpx 20rpx 60rpx;
-		background: #f4f2f2;
-
-		.button {
-			width: 100%;
-			height: 72rpx;
-			border-radius: 72rpx;
-			text-align: center;
-			line-height: 72rpx;
-
-			&.red {
-				background: #ff3f42;
-				color: #ffffff;
-				margin-bottom: 20rpx;
-			}
-
-			&.white {
-				background: #ffffff;
-				color: #333333;
-			}
-		}
-	}
+<template>
+	<view class="app-container">
+		<view class="congxindingwei">
+			<view class="header-container">
+				<view class="left">
+					<image src="@/static/home/location.png"></image>
+					<text>{{websitData.address}}</text>
+				</view>
+				<view class="right" style="min-width: 120rpx;" @tap="getLocation">
+					<view class="item" style="min-width: 200rpx;">
+						重新定位
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="wodeshouhuodiz">我的收货地址</view>
+		<view class="list-container">
+			<block v-for="(item, index) in addressList" :key="index">
+				<view class="item" @tap="chooseAddress(item)">
+					<view class="top">
+						<view class="left">
+							<view class="name">{{ item.name }}</view>
+							<view class="phone">{{ item.phone }}</view>
+							<view class="default" v-if="item.defaultAddr">默认</view>
+						</view>
+					</view>
+					<view class="bottom">{{ item.province }}{{ item.city }}{{ item.area }}{{ item.street
+            }}{{ item.address }}{{ item.houseNo }}</view>
+				</view>
+			</block>
+		</view>
+		<no-data v-if="!addressList.length" :showText="'暂无收货地址'"></no-data>
+	</view>
+</template>
+
+<script>
+	import {
+		mapState
+	} from 'vuex';
+	import EventBus from '@/utils/eventbus.js';
+	import {
+		getArea
+	} from '@/utils/utils.js';
+	export default {
+		data() {
+			return {
+				addressList: [], // 收货地址列表
+				isChoose: false, // 是否进来选择地址
+			};
+		},
+		computed: {
+			...mapState(['userInfo', 'isLogin', 'userId', 'websitData']),
+		},
+		onShow() {
+			this.getAddressList();
+		},
+		onLoad({
+			isChoose
+		}) {
+			this.isChoose = isChoose;
+		},
+		methods: {
+			// 获取收货地址列表
+			getAddressList() {
+				this.$axios({
+					url: '/user/address/list',
+					method: 'get',
+					params: {
+						pageNum: 1,
+						pageSize: 100,
+						userId: this.userId,
+					},
+				}).then((res) => {
+					this.addressList = res.data.records;
+				});
+			},
+			getLocation() {
+				let that = this;
+				uni.chooseLocation({
+					success: (res) => {
+						this.$axios({
+							url: '/user/userWebsit',
+							method: 'post',
+							params: {
+								lat: res.latitude,
+								lng: res.longitude,
+							},
+						}).then((res) => {
+							if (res?.data) {
+								this.$store.commit('changeWebsitObj', res?.data);
+								uni.setStorageSync('websitData', res?.data);
+								uni.setStorageSync("websitIdSj", res?.data.websitId);
+								uni.reLaunch({
+									url: "/pages/index/index"
+								})
+							} else {
+								uni.showModal({
+									title: '提示',
+									content: '当前定位附件暂无门店，请重新选择定位地址!',
+									success: (res) => {
+										if (res.confirm) {
+											this.getLocation()
+										} else if (res.cancel) {
+											console.log('用户点击取消');
+										}
+									}
+								});
+							}
+						});
+					},
+					fail: (res) => {
+						uni.getSetting({
+							success: function(res) {
+								if (!res.authSetting['scope.userLocation']) {
+									uni.showModal({
+										title: '是否授权当前位置',
+										content: '需要获取您的地理位置，请确认授权，否则地图功能将无法使用',
+										success(tip) {
+											if (tip.confirm) {
+												uni.openSetting({
+													success: function(data) {
+														if (data.authSetting[
+																"scope.userLocation"
+															] === true) {
+															that.$successToast(
+																'授权成功');
+															setTimeout(() => {
+																that
+																	.getLocation();
+															}, 1000)
+														}
+													}
+												})
+											}
+										}
+									})
+								}
+							}
+						})
+					}
+				});
+			},
+
+
+			// 选择地址
+			chooseAddress(item) {
+				this.$axios({
+					url: '/user/userWebsit',
+					method: 'post',
+					params: {
+						lat: item.lat,
+						lng: item.lng,
+					},
+				}).then((res) => {
+					if (res?.data) {
+						this.$store.commit('changeWebsitObj', res?.data);
+						uni.setStorageSync('websitData', res?.data);
+						uni.setStorageSync("websitIdSj", res?.data.websitId);
+						uni.reLaunch({
+							url: "/pages/index/index"
+						})
+					} else {
+						uni.showModal({
+							title: '提示',
+							content: '当前收货地址暂无门店，请重新选择收货地址!',
+							success: (res) => {
+								if (res.confirm) {} else if (res.cancel) {}
+							}
+						});
+					}
+				});
+			},
+		},
+	};
+</script>
+
+<style lang="scss">
+	.wodeshouhuodiz {
+		font-size: 32rpx;
+		font-weight: bold;
+		box-sizing: border-box;
+		padding: 30rpx 16rpx;
+	}
+
+	.congxindingwei {}
+
+	.header-container {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		padding: 0 10rpx 10rpx;
+
+		.left {
+			display: flex;
+			align-items: center;
+
+			image {
+				width: 48rpx;
+				height: 48rpx;
+			}
+		}
+
+		.right {
+			display: flex;
+
+			.item {
+				margin-left: 40rpx;
+				position: relative;
+				color: blue;
+			}
+		}
+	}
+
+	.app-container {
+		background: #f4f2f2;
+		padding: 20rpx;
+		padding-bottom: 250rpx;
+		box-sizing: border-box;
+	}
+
+	.list-container {
+		.item {
+			background: #ffffff;
+			border-radius: 20rpx;
+			margin-bottom: 20rpx;
+			padding: 20rpx;
+
+			.top {
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+
+				.left {
+					display: flex;
+					align-items: flex-end;
+
+					.name {
+						font-size: 32rpx;
+						color: #333333;
+						line-height: 32rpx;
+					}
+
+					.phone {
+						font-size: 28rpx;
+						color: #666666;
+						margin-left: 20rpx;
+						line-height: 28rpx;
+					}
+
+					.default {
+						font-size: 22rpx;
+						color: #ffffff;
+						background: #fe781f;
+						padding: 6rpx 8rpx;
+						line-height: 20rpx;
+						margin-left: 20rpx;
+					}
+				}
+
+				.right {
+					width: 32rpx;
+					height: 32rpx;
+				}
+			}
+
+			.bottom {
+				font-size: 28rpx;
+				color: #333333;
+				line-height: 38rpx;
+				margin-top: 20rpx;
+			}
+		}
+	}
+
+	.bottom-container {
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		width: 100%;
+		box-sizing: border-box;
+		padding: 20rpx 20rpx 60rpx;
+		background: #f4f2f2;
+
+		.button {
+			width: 100%;
+			height: 72rpx;
+			border-radius: 72rpx;
+			text-align: center;
+			line-height: 72rpx;
+
+			&.red {
+				background: #ff3f42;
+				color: #ffffff;
+				margin-bottom: 20rpx;
+			}
+
+			&.white {
+				background: #ffffff;
+				color: #333333;
+			}
+		}
+	}
 </style>

pages/cart/index.vue

@@ -1,709 +1,709 @@
-<template>
-	<view class="app-container" :class="isNoticebar ? 'hasNoticebar' : ''">
-		<view class="noticebar" v-if="isNoticebar">
-			<uni-notice-bar v-if="noticeContent" scrollable="true" single="true" showClose="true" :text="noticeContent"
-				background-color="#f6e6e7" color="#de3749" @close="closeNoticebar"></uni-notice-bar>
-		</view>
-
-		<view class="top" :class="isNoticebar ? 'hasNoticebar' : ''">
-			<view class="total">共{{ totalNum }}件商品</view>
-			<view v-if="!isEditor" @tap="isEditor = !isEditor">编辑</view>
-			<view v-else @tap="isEditor = !isEditor">完成</view>
-		</view>
-		<view class="list">
-			<block v-for="(item, index) in goodsList" :key="index">
-				<view class="item">
-					<view class="check" v-if="item.selected" @tap="selectList(index)">
-						<image src="@/static/icon/select_1.png" mode=""></image>
-					</view>
-					<view class="check" v-else @tap="selectList(index)">
-						<image src="@/static/icon/select_0.png" mode="" />
-					</view>
-					<image :src="item.goodsImg" mode="aspectFill" class="img"></image>
-					<view class="right">
-						<view class="title ellipsis-2">{{ item.goodsName }}</view>
-						<view class="des ellipsis">{{ item.specValue }}</view>
-						<view class="last">
-							<view class="price">
-								<view class="price-1">¥{{ item.price | numToFixed }}</view>
-								<view class="price-2">¥{{ item.orgPrice | numToFixed }}</view>
-							</view>
-							<u-number-box @tap.stop v-model="item.num" :min="1" :buttonSize="26"
-								iconStyle="font-size: 12px;" @change="changeCount($event, index)">
-							</u-number-box>
-						</view>
-					</view>
-				</view>
-			</block>
-		</view>
-		<no-data v-if="!goodsList.length" :showText="'购物车暂无商品'"></no-data>
-
-
-		<view
-			style="width: 100%;display: flex;justify-content: space-between;align-items: center;margin-bottom: 20rpx;margin-top: 20rpx;">
-			<view style="width: 30%;height: 2rpx;background: #a8a8a8;"></view>
-			<view style="font-size: 24rpx;color: #8a8a8a;">猜你想要</view>
-			<view style="width: 30%;height: 2rpx;background: #a8a8a8;"></view>
-		</view>
-		<view class="goods-waterfall-list">
-			<view class="left">
-				<block v-for="(item, index) in goodsList2" :key='index'>
-					<view class="item" v-if="index%2==0" @tap="toGoodsDetail(item.goodsId)">
-						<view class="image">
-							<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
-							<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
-						</view>
-						<view class="content">
-							<view class="title ellipsis-2">{{item.goodsName}}</view>
-							<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
-								<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
-							</view>
-							<view class="price">
-								<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
-								<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
-							</view>
-							<view class="tags2" v-if="item.tags2 && item.tags2.length > 0">
-								<view class="it" v-for="(it, idx) in item.tags2" :key="idx">{{it}}</view>
-							</view>
-							<view class="text">销量：{{item.soldNum}}</view>
-						</view>
-					</view>
-				</block>
-			</view>
-			<view class="right">
-				<block v-for="(item, index) in goodsList2" :key='index'>
-					<view class="item" v-if="index%2==1" @tap="toGoodsDetail(item.goodsId)">
-						<view class="image">
-							<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
-							<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
-						</view>
-						<view class="content">
-							<view class="title ellipsis-2">{{item.goodsName}}</view>
-							<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
-								<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
-							</view>
-							<view class="price">
-								<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
-								<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
-							</view>
-							<view class="tags2" v-if="item.tags2 && item.tags2.length > 0">
-								<view class="it" v-for="(it, idx) in item.tags2" :key="idx">{{it}}</view>
-							</view>
-							<view class="text">销量：{{item.soldNum}}</view>
-						</view>
-					</view>
-				</block>
-			</view>
-		</view>
-
-
-
-		<view class="bottom">
-			<view class="check" @tap="selectAll">
-				<image src="@/static/icon/select_1.png" mode="" v-if="selectAllStatus" />
-				<image src="@/static/icon/select_0.png" mode="" v-else />
-				<text class="text">全选</text>
-			</view>
-			<view class="right" v-if="!isEditor">
-				<view class="price">
-					合计:<text>￥{{ totalPrice }}</text>
-				</view>
-				<view class="button"><button @tap="toOrder">去结算</button></view>
-			</view>
-			<view class="right" v-else>
-				<button class="delete" @tap="clickDelete">删除</button>
-			</view>
-		</view>
-
-		<u-popup :round="10" :show="isShowPhoneDialog">
-			<view class="phone-dialog">
-				<view class="content">
-					<view>申请获取以下权限</view>
-					<text>获得你的公开信息(手机号码)</text>
-				</view>
-				<view class="btn">
-					<button @tap="isShowPhoneDialog = false">取消</button>
-					<button type="primary" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
-						确定授权
-					</button>
-				</view>
-			</view>
-		</u-popup>
-
-		<modal-dialog showText="确定要删除选中的商品吗？" :isShowDialog="isDialog" @cancel="isDialog = false"
-			@confirm="confirmDelete"></modal-dialog>
-	</view>
-</template>
-
-<script>
-	import {
-		mapState
-	} from 'vuex';
-	import modalDialog from '@/components/modalDialog.vue';
-
-	export default {
-		components: {
-			modalDialog,
-		},
-		data() {
-			return {
-				goodsList: [],
-				totalPrice: 0, // 总价，初始为0
-				totalNum: 0,
-				selectAllStatus: true, // 全选状态，默认全选
-				isEditor: false, // 是否编辑
-				isDialog: false, // 是否显示删除弹窗
-				isNoticebar: false, // 是否显示通告栏
-				noticeContent: '', // 公告内容
-				isShowPhoneDialog: false,
-
-				goodsList2: [],
-				pageNum: 1,
-				pageSize: 8,
-				noMore: false,
-			};
-		},
-		computed: {
-			...mapState(['userInfo', 'isLogin', 'userId']),
-		},
-		onShow() {
-			this.getGoodsList();
-			this.goodsList2 = [];
-			this.getGoodsList22();
-		},
-		onLoad() {
-			this.getNoticebar();
-		},
-
-		// 下拉刷新
-		onPullDownRefresh() {
-			this.pageNum = 1;
-			this.getGoodsList22();
-		},
-
-		// 上拉加载
-		onReachBottom() {
-			this.getGoodsList22(1);
-		},
-
-		methods: {
-
-			// 获取商品列表
-			getGoodsList22(loadMore) {
-				if (this.noMore && loadMore) return;
-				this.noMore = false
-				if (!loadMore) {
-					this.pageNum = 1;
-				}
-				this.$axios({
-					url: '/goods/list/sort/page',
-					method: 'get',
-					params: {
-						pageNum: this.pageNum,
-						pageSize: this.pageSize,
-						categoryId: '',
-						sort: 5,
-					},
-					isLoading: !loadMore
-				}).then(res => {
-					res.data.records.forEach(item => {
-						if (item.logo && item.logoStartTime) {
-							item.isShowWater = this.$compareTime(item.logoStartTime, item.logoEndTime);
-						} else {
-							item.isShowWater = false;
-						}
-					})
-					let _list = res.data.records;
-					let pageTotal = res.data.pages;
-					if (this.pageNum >= pageTotal) {
-						this.noMore = true;
-					}
-					if (_list.length) {
-						this.pageNum += 1
-					}
-					if (loadMore) {
-						this.goodsList2 = this.goodsList.concat(_list);
-					} else {
-						this.goodsList2 = _list;
-					}
-				})
-			},
-
-			// 进入商品详情
-			toGoodsDetail(id) {
-				if (!id) {
-					return false;
-				}
-
-				this.$axios({
-						url: '/goods/detail',
-						method: 'get',
-						params: {
-							goodsId: id,
-							userId: this.userId,
-						},
-					})
-					.then((res) => {
-						uni.navigateTo({
-							url: '/packageGoods/pages/detail?id=' + id
-						})
-					})
-					.catch((res) => {
-						uni.switchTab({
-							url: '/pages/goods/all'
-						});
-					})
-					.finally((res) => {});
-			},
-			// 获取手机号
-			getPhoneNumber(e) {
-				if (e?.detail?.iv && e?.detail?.encryptedData) {
-					this.$axios({
-						url: '/user/mobile/grant',
-						params: {
-							userId: this.userId,
-							iv: e.detail.iv,
-							encryptedData: e.detail.encryptedData,
-						},
-					}).then((res) => {
-						uni.setStorageSync('token', res.data.token);
-						uni.setStorageSync('isActiveLogout', false);
-						this.isShowPhoneDialog = false;
-						this.$getUserInfo();
-					});
-				}
-			},
-			// 获取公告栏
-			getNoticebar() {
-				this.$axios({
-					url: '/shpping/cart/notice',
-					method: 'get',
-					params: {
-						userId: this.userId,
-					},
-				}).then((res) => {
-					this.noticeContent = res.data;
-					this.isNoticebar = res.data ? true : false;
-				});
-			},
-
-			// 获取商品列表
-			getGoodsList() {
-				this.$axios({
-					url: '/shpping/cart/list',
-					method: 'get',
-					params: {
-						userId: this.userId,
-					},
-				}).then((res) => {
-					this.goodsList = res.data.shoppingCartLists;
-					this.totalNum = res.data.totalNum;
-					this.goodsList.forEach((item, index) => {
-						item.selected = true;
-					});
-					this.selectAllStatus = true;
-					this.getTotalPrice();
-				});
-			},
-
-			// 统计总价
-			getTotalPrice() {
-				// 获取购物车列表
-				let goodsList = this.goodsList;
-				let total = 0;
-				// 循环列表
-				for (let i = 0; i < goodsList.length; i++) {
-					// 判断选中才会计算价格
-					if (goodsList[i].selected) {
-						// 所有价格加起来
-						total += goodsList[i].num * goodsList[i].price;
-					}
-				}
-				// 赋值到data中渲染到页面
-				this.goodsList = goodsList;
-				this.totalPrice = total.toFixed(2);
-			},
-
-			// 选择事件
-			selectList(index) {
-				// 获取购物车列表
-				let goodsList = this.goodsList;
-				// 获取当前商品的选中状态
-				let selected = goodsList[index].selected;
-				// 改变状态
-				goodsList[index].selected = !selected;
-				this.goodsList = goodsList;
-
-				// 改变全选状态
-				for (var i = 0; i < this.goodsList.length; i++) {
-					// 当状态为全选时，每个元素其中有一个为false，则取消全选
-					// 当状态为非全选时，每个元素都为true，则全选
-					if (this.selectAllStatus) {
-						if (!this.goodsList[i].selected) {
-							this.selectAllStatus = false;
-							break;
-						}
-					} else {
-						if (this.goodsList[i].selected) {
-							this.selectAllStatus = true;
-						} else {
-							this.selectAllStatus = false;
-							break;
-						}
-					}
-				}
-
-				// 重新获取总价
-				this.getTotalPrice();
-			},
-
-			// 全选事件
-			selectAll(e) {
-				// 是否全选状态
-				let selectAllStatus = this.selectAllStatus;
-				selectAllStatus = !selectAllStatus;
-				let goodsList = this.goodsList;
-				for (let i = 0; i < goodsList.length; i++) {
-					// 改变所有商品状态
-					goodsList[i].selected = selectAllStatus;
-				}
-				this.selectAllStatus = selectAllStatus;
-				this.goodsList = goodsList;
-				// 重新获取总价
-				this.getTotalPrice();
-			},
-
-			// 更改数量
-			changeCount(e, index) {
-				this.goodsList[index].num = e.value;
-				this.initCart();
-			},
-
-			// 修改数量后更新购物车数据
-			initCart() {
-				let buyGoods = [];
-				this.goodsList.forEach((item, index) => {
-					let goodsItem = {
-						goodsId: item.goodsId,
-						goodsSpecId: item.goodsSpecId,
-						num: item.num,
-						shoppingCartId: item.shoppingCartId,
-						secKillId: item.secKillId || '',
-						promotionGroupId: item.promotionGroupId || '',
-					};
-					buyGoods.push(goodsItem);
-				});
-				this.$axios({
-					url: '/shpping/cart/add',
-					type: 'application/json',
-					params: {
-						userId: this.userId,
-						buyGoods: buyGoods,
-					},
-				}).then((res) => {
-					this.totalNum = res.data.totalNum;
-					this.getTotalPrice();
-				});
-			},
-
-			// 点击删除
-			clickDelete() {
-				let delIds = [];
-				for (let i = 0; i < this.goodsList.length; i++) {
-					if (this.goodsList[i].selected) {
-						delIds.push(this.goodsList[i].shoppingCartId);
-					}
-				}
-				if (delIds.length < 1) {
-					return this.$toast('至少选择一件商品');
-				}
-				this.isDialog = true;
-			},
-
-			// 确认删除
-			confirmDelete() {
-				let delIds = [];
-				for (let i = 0; i < this.goodsList.length; i++) {
-					if (this.goodsList[i].selected) {
-						delIds.push(this.goodsList[i].shoppingCartId);
-					}
-				}
-				this.$axios({
-					url: '/shpping/cart/remove',
-					params: {
-						shoppingCartIds: delIds,
-						userId: this.userId,
-					},
-				}).then((res) => {
-					this.isDialog = false;
-					this.isEditor = false;
-					this.$successToast('删除成功');
-					this.getGoodsList();
-				});
-			},
-
-			// 去结算
-			toOrder() {
-				let buyList = [];
-				this.goodsList.forEach((item, index) => {
-					if (item.selected) {
-						let goodsItem = {
-							goodsId: item.goodsId,
-							goodsSpecId: item.goodsSpecId,
-							num: item.num,
-							shoppingCartId: item.shoppingCartId,
-							secKillId: item.secKillId || '',
-							promotionGroupId: item.promotionGroupId || '',
-						};
-						buyList.push(goodsItem);
-					}
-				});
-				if (buyList.length < 1) {
-					return this.$toast('至少选择一件商品');
-				}
-				if (!this.userInfo.mobile) {
-					this.isShowPhoneDialog = true;
-					return;
-				}
-				// 跳转结算页面
-				uni.navigateTo({
-					url: '/packageGoods/pages/order?buyList=' + JSON.stringify(buyList),
-				});
-			},
-
-			// 关闭通告栏
-			closeNoticebar() {
-				this.isNoticebar = false;
-			},
-		},
-	};
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #f4f2f2;
-		box-sizing: border-box;
-	}
-
-	.app-container {
-		height: auto;
-		padding: 110rpx 0;
-
-		&.hasNoticebar {
-			padding-top: 174rpx;
-		}
-
-		.noticebar {
-			position: fixed;
-			top: 0;
-			left: 0;
-			width: 100%;
-			z-index: 100;
-		}
-
-		.top {
-			position: fixed;
-			top: 0;
-			left: 0;
-			z-index: 99;
-			width: 100%;
-			padding: 0 20rpx;
-			box-sizing: border-box;
-			background: #ffffff;
-			height: 88rpx;
-			display: flex;
-			justify-content: space-between;
-			align-items: center;
-			border-bottom: 1px solid #f4f2f2;
-
-			&.hasNoticebar {
-				top: 64rpx;
-			}
-
-			.total {
-				font-size: 32rpx;
-			}
-		}
-
-		.list {
-			padding: 0 20rpx;
-
-			.item {
-				margin-bottom: 20rpx;
-				border-radius: 10rpx;
-				padding: 20rpx 20rpx;
-				display: flex;
-				align-items: center;
-				background: #ffffff;
-
-				.check {
-					image {
-						width: 32rpx;
-						height: 32rpx;
-						display: block;
-					}
-				}
-
-				.img {
-					width: 180rpx;
-					height: 180rpx;
-					display: block;
-					margin: 0 20rpx;
-					flex-shrink: 0;
-				}
-
-				.right {
-					width: 420rpx;
-					height: 190rpx;
-					display: flex;
-					justify-content: space-between;
-					flex-direction: column;
-
-					.title {
-						font-size: 28rpx;
-						color: #333333;
-						line-height: 36rpx;
-					}
-
-					.des {
-						font-size: 24rpx;
-						color: #999999;
-						line-height: 36rpx;
-					}
-
-					.last {
-						display: flex;
-						justify-content: space-between;
-						align-items: center;
-
-						.price {
-							display: flex;
-							flex-direction: column;
-						}
-
-						.price-1 {
-							font-size: 32rpx;
-							color: #ff3f42;
-							line-height: 36rpx;
-						}
-
-						.price-2 {
-							font-size: 26rpx;
-							color: #666666;
-							line-height: 30rpx;
-							text-decoration: line-through;
-						}
-					}
-				}
-			}
-		}
-
-		.bottom {
-			position: fixed;
-			left: 0;
-			bottom: 0;
-			z-index: 99;
-			width: 100%;
-			box-sizing: border-box;
-			background: #ffffff;
-			height: 100rpx;
-			display: flex;
-			align-items: center;
-			justify-content: space-between;
-			padding: 0 20rpx;
-			border-top: 1px solid #f4f2f2;
-
-			.check {
-				display: flex;
-				align-items: center;
-
-				image {
-					width: 32rpx;
-					height: 32rpx;
-					display: block;
-					margin-right: 20rpx;
-				}
-			}
-
-			.right {
-				display: flex;
-				align-items: center;
-
-				.price {
-					font-size: 28rpx;
-					line-height: 36rpx;
-
-					text {
-						color: #ff3f42;
-					}
-
-					margin-right: 20rpx;
-				}
-
-				.button {
-					button {
-						height: 80rpx;
-						line-height: 80rpx;
-						padding: 0;
-						border-radius: 80rpx;
-						font-size: 30rpx;
-						color: #fff;
-						background: linear-gradient(-90deg, #ff3f42 0%, #fe781f 100%);
-						padding: 0 40rpx;
-					}
-				}
-
-				.delete {
-					width: 170rpx;
-					height: 80rpx;
-					line-height: 80rpx;
-					text-align: center;
-					padding: 0;
-					border-radius: 80rpx;
-					font-size: 30rpx;
-					color: #ff3f42;
-					border: 1px solid #ff3f42;
-				}
-			}
-		}
-	}
-
-	.phone-dialog {
-		padding: 40rpx;
-		box-sizing: border-box;
-
-		.content {
-			margin-top: 30rpx;
-			margin-bottom: 30rpx;
-			line-height: 50rpx;
-
-			text {
-				color: #9d9d9d;
-			}
-		}
-
-		.btn {
-			display: flex;
-			justify-content: center;
-			margin-top: 60rpx;
-
-			button::after {
-				border: none;
-			}
-
-			button {
-				width: 180rpx;
-				height: 70rpx;
-				line-height: 70rpx;
-				margin: 0;
-				font-size: 28rpx;
-				margin: 0 30rpx;
-
-				&:first-child {
-					background: #f5f5f5;
-					color: #00ba5c;
-				}
-			}
-		}
-	}
+<template>
+	<view class="app-container" :class="isNoticebar ? 'hasNoticebar' : ''">
+		<view class="noticebar" v-if="isNoticebar">
+			<uni-notice-bar v-if="noticeContent" scrollable="true" single="true" showClose="true" :text="noticeContent"
+				background-color="#f6e6e7" color="#de3749" @close="closeNoticebar"></uni-notice-bar>
+		</view>
+
+		<view class="top" :class="isNoticebar ? 'hasNoticebar' : ''">
+			<view class="total">共{{ totalNum }}件商品</view>
+			<view v-if="!isEditor" @tap="isEditor = !isEditor">编辑</view>
+			<view v-else @tap="isEditor = !isEditor">完成</view>
+		</view>
+		<view class="list">
+			<block v-for="(item, index) in goodsList" :key="index">
+				<view class="item">
+					<view class="check" v-if="item.selected" @tap="selectList(index)">
+						<image src="@/static/icon/select_1.png" mode=""></image>
+					</view>
+					<view class="check" v-else @tap="selectList(index)">
+						<image src="@/static/icon/select_0.png" mode="" />
+					</view>
+					<image :src="item.goodsImg" mode="aspectFill" class="img"></image>
+					<view class="right">
+						<view class="title ellipsis-2">{{ item.goodsName }}</view>
+						<view class="des ellipsis">{{ item.specValue }}</view>
+						<view class="last">
+							<view class="price">
+								<view class="price-1">¥{{ item.price | numToFixed }}</view>
+								<view class="price-2">¥{{ item.orgPrice | numToFixed }}</view>
+							</view>
+							<u-number-box @tap.stop v-model="item.num" :min="1" :buttonSize="26"
+								iconStyle="font-size: 12px;" @change="changeCount($event, index)">
+							</u-number-box>
+						</view>
+					</view>
+				</view>
+			</block>
+		</view>
+		<no-data v-if="!goodsList.length" :showText="'购物车暂无商品'"></no-data>
+
+
+		<view
+			style="width: 100%;display: flex;justify-content: space-between;align-items: center;margin-bottom: 20rpx;margin-top: 20rpx;">
+			<view style="width: 30%;height: 2rpx;background: #a8a8a8;"></view>
+			<view style="font-size: 24rpx;color: #8a8a8a;">猜你想要</view>
+			<view style="width: 30%;height: 2rpx;background: #a8a8a8;"></view>
+		</view>
+		<view class="goods-waterfall-list">
+			<view class="left">
+				<block v-for="(item, index) in goodsList2" :key='index'>
+					<view class="item" v-if="index%2==0" @tap="toGoodsDetail(item.goodsId)">
+						<view class="image">
+							<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
+							<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
+						</view>
+						<view class="content">
+							<view class="title ellipsis-2">{{item.goodsName}}</view>
+							<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
+								<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
+							</view>
+							<view class="price">
+								<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
+								<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
+							</view>
+							<view class="tags2" v-if="item.tags2 && item.tags2.length > 0">
+								<view class="it" v-for="(it, idx) in item.tags2" :key="idx">{{it}}</view>
+							</view>
+							<view class="text">销量：{{item.soldNum}}</view>
+						</view>
+					</view>
+				</block>
+			</view>
+			<view class="right">
+				<block v-for="(item, index) in goodsList2" :key='index'>
+					<view class="item" v-if="index%2==1" @tap="toGoodsDetail(item.goodsId)">
+						<view class="image">
+							<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
+							<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
+						</view>
+						<view class="content">
+							<view class="title ellipsis-2">{{item.goodsName}}</view>
+							<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
+								<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
+							</view>
+							<view class="price">
+								<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
+								<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
+							</view>
+							<view class="tags2" v-if="item.tags2 && item.tags2.length > 0">
+								<view class="it" v-for="(it, idx) in item.tags2" :key="idx">{{it}}</view>
+							</view>
+							<view class="text">销量：{{item.soldNum}}</view>
+						</view>
+					</view>
+				</block>
+			</view>
+		</view>
+
+
+
+		<view class="bottom">
+			<view class="check" @tap="selectAll">
+				<image src="@/static/icon/select_1.png" mode="" v-if="selectAllStatus" />
+				<image src="@/static/icon/select_0.png" mode="" v-else />
+				<text class="text">全选</text>
+			</view>
+			<view class="right" v-if="!isEditor">
+				<view class="price">
+					合计:<text>￥{{ totalPrice }}</text>
+				</view>
+				<view class="button"><button @tap="toOrder">去结算</button></view>
+			</view>
+			<view class="right" v-else>
+				<button class="delete" @tap="clickDelete">删除</button>
+			</view>
+		</view>
+
+		<u-popup :round="10" :show="isShowPhoneDialog">
+			<view class="phone-dialog">
+				<view class="content">
+					<view>申请获取以下权限</view>
+					<text>获得你的公开信息(手机号码)</text>
+				</view>
+				<view class="btn">
+					<button @tap="isShowPhoneDialog = false">取消</button>
+					<button type="primary" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
+						确定授权
+					</button>
+				</view>
+			</view>
+		</u-popup>
+
+		<modal-dialog showText="确定要删除选中的商品吗？" :isShowDialog="isDialog" @cancel="isDialog = false"
+			@confirm="confirmDelete"></modal-dialog>
+	</view>
+</template>
+
+<script>
+	import {
+		mapState
+	} from 'vuex';
+	import modalDialog from '@/components/modalDialog.vue';
+
+	export default {
+		components: {
+			modalDialog,
+		},
+		data() {
+			return {
+				goodsList: [],
+				totalPrice: 0, // 总价，初始为0
+				totalNum: 0,
+				selectAllStatus: true, // 全选状态，默认全选
+				isEditor: false, // 是否编辑
+				isDialog: false, // 是否显示删除弹窗
+				isNoticebar: false, // 是否显示通告栏
+				noticeContent: '', // 公告内容
+				isShowPhoneDialog: false,
+
+				goodsList2: [],
+				pageNum: 1,
+				pageSize: 8,
+				noMore: false,
+			};
+		},
+		computed: {
+			...mapState(['userInfo', 'isLogin', 'userId']),
+		},
+		onShow() {
+			this.getGoodsList();
+			this.goodsList2 = [];
+			this.getGoodsList22();
+		},
+		onLoad() {
+			this.getNoticebar();
+		},
+
+		// 下拉刷新
+		onPullDownRefresh() {
+			this.pageNum = 1;
+			this.getGoodsList22();
+		},
+
+		// 上拉加载
+		onReachBottom() {
+			this.getGoodsList22(1);
+		},
+
+		methods: {
+
+			// 获取商品列表
+			getGoodsList22(loadMore) {
+				if (this.noMore && loadMore) return;
+				this.noMore = false
+				if (!loadMore) {
+					this.pageNum = 1;
+				}
+				this.$axios({
+					url: '/goods/list/sort/page',
+					method: 'get',
+					params: {
+						pageNum: this.pageNum,
+						pageSize: this.pageSize,
+						categoryId: '',
+						sort: 5,
+					},
+					isLoading: !loadMore
+				}).then(res => {
+					res.data.records.forEach(item => {
+						if (item.logo && item.logoStartTime) {
+							item.isShowWater = this.$compareTime(item.logoStartTime, item.logoEndTime);
+						} else {
+							item.isShowWater = false;
+						}
+					})
+					let _list = res.data.records;
+					let pageTotal = res.data.pages;
+					if (this.pageNum >= pageTotal) {
+						this.noMore = true;
+					}
+					if (_list.length) {
+						this.pageNum += 1
+					}
+					if (loadMore) {
+						this.goodsList2 = this.goodsList.concat(_list);
+					} else {
+						this.goodsList2 = _list;
+					}
+				})
+			},
+
+			// 进入商品详情
+			toGoodsDetail(id) {
+				if (!id) {
+					return false;
+				}
+
+				this.$axios({
+						url: '/goods/detail',
+						method: 'get',
+						params: {
+							goodsId: id,
+							userId: this.userId,
+						},
+					})
+					.then((res) => {
+						uni.navigateTo({
+							url: '/packageGoods/pages/detail?id=' + id
+						})
+					})
+					.catch((res) => {
+						uni.switchTab({
+							url: '/pages/goods/all'
+						});
+					})
+					.finally((res) => {});
+			},
+			// 获取手机号
+			getPhoneNumber(e) {
+				if (e?.detail?.iv && e?.detail?.encryptedData) {
+					this.$axios({
+						url: '/user/mobile/grant',
+						params: {
+							userId: this.userId,
+							iv: e.detail.iv,
+							encryptedData: e.detail.encryptedData,
+						},
+					}).then((res) => {
+						uni.setStorageSync('token', res.data.token);
+						uni.setStorageSync('isActiveLogout', false);
+						this.isShowPhoneDialog = false;
+						this.$getUserInfo();
+					});
+				}
+			},
+			// 获取公告栏
+			getNoticebar() {
+				this.$axios({
+					url: '/shpping/cart/notice',
+					method: 'get',
+					params: {
+						userId: this.userId,
+					},
+				}).then((res) => {
+					this.noticeContent = res.data;
+					this.isNoticebar = res.data ? true : false;
+				});
+			},
+
+			// 获取商品列表
+			getGoodsList() {
+				this.$axios({
+					url: '/shpping/cart/list',
+					method: 'get',
+					params: {
+						userId: this.userId,
+					},
+				}).then((res) => {
+					this.goodsList = res.data.shoppingCartLists;
+					this.totalNum = res.data.totalNum;
+					this.goodsList.forEach((item, index) => {
+						item.selected = true;
+					});
+					this.selectAllStatus = true;
+					this.getTotalPrice();
+				});
+			},
+
+			// 统计总价
+			getTotalPrice() {
+				// 获取购物车列表
+				let goodsList = this.goodsList;
+				let total = 0;
+				// 循环列表
+				for (let i = 0; i < goodsList.length; i++) {
+					// 判断选中才会计算价格
+					if (goodsList[i].selected) {
+						// 所有价格加起来
+						total += goodsList[i].num * goodsList[i].price;
+					}
+				}
+				// 赋值到data中渲染到页面
+				this.goodsList = goodsList;
+				this.totalPrice = total.toFixed(2);
+			},
+
+			// 选择事件
+			selectList(index) {
+				// 获取购物车列表
+				let goodsList = this.goodsList;
+				// 获取当前商品的选中状态
+				let selected = goodsList[index].selected;
+				// 改变状态
+				goodsList[index].selected = !selected;
+				this.goodsList = goodsList;
+
+				// 改变全选状态
+				for (var i = 0; i < this.goodsList.length; i++) {
+					// 当状态为全选时，每个元素其中有一个为false，则取消全选
+					// 当状态为非全选时，每个元素都为true，则全选
+					if (this.selectAllStatus) {
+						if (!this.goodsList[i].selected) {
+							this.selectAllStatus = false;
+							break;
+						}
+					} else {
+						if (this.goodsList[i].selected) {
+							this.selectAllStatus = true;
+						} else {
+							this.selectAllStatus = false;
+							break;
+						}
+					}
+				}
+
+				// 重新获取总价
+				this.getTotalPrice();
+			},
+
+			// 全选事件
+			selectAll(e) {
+				// 是否全选状态
+				let selectAllStatus = this.selectAllStatus;
+				selectAllStatus = !selectAllStatus;
+				let goodsList = this.goodsList;
+				for (let i = 0; i < goodsList.length; i++) {
+					// 改变所有商品状态
+					goodsList[i].selected = selectAllStatus;
+				}
+				this.selectAllStatus = selectAllStatus;
+				this.goodsList = goodsList;
+				// 重新获取总价
+				this.getTotalPrice();
+			},
+
+			// 更改数量
+			changeCount(e, index) {
+				this.goodsList[index].num = e.value;
+				this.initCart();
+			},
+
+			// 修改数量后更新购物车数据
+			initCart() {
+				let buyGoods = [];
+				this.goodsList.forEach((item, index) => {
+					let goodsItem = {
+						goodsId: item.goodsId,
+						goodsSpecId: item.goodsSpecId,
+						num: item.num,
+						shoppingCartId: item.shoppingCartId,
+						secKillId: item.secKillId || '',
+						promotionGroupId: item.promotionGroupId || '',
+					};
+					buyGoods.push(goodsItem);
+				});
+				this.$axios({
+					url: '/shpping/cart/add',
+					type: 'application/json',
+					params: {
+						userId: this.userId,
+						buyGoods: buyGoods,
+					},
+				}).then((res) => {
+					this.totalNum = res.data.totalNum;
+					this.getTotalPrice();
+				});
+			},
+
+			// 点击删除
+			clickDelete() {
+				let delIds = [];
+				for (let i = 0; i < this.goodsList.length; i++) {
+					if (this.goodsList[i].selected) {
+						delIds.push(this.goodsList[i].shoppingCartId);
+					}
+				}
+				if (delIds.length < 1) {
+					return this.$toast('至少选择一件商品');
+				}
+				this.isDialog = true;
+			},
+
+			// 确认删除
+			confirmDelete() {
+				let delIds = [];
+				for (let i = 0; i < this.goodsList.length; i++) {
+					if (this.goodsList[i].selected) {
+						delIds.push(this.goodsList[i].shoppingCartId);
+					}
+				}
+				this.$axios({
+					url: '/shpping/cart/remove',
+					params: {
+						shoppingCartIds: delIds,
+						userId: this.userId,
+					},
+				}).then((res) => {
+					this.isDialog = false;
+					this.isEditor = false;
+					this.$successToast('删除成功');
+					this.getGoodsList();
+				});
+			},
+
+			// 去结算
+			toOrder() {
+				let buyList = [];
+				this.goodsList.forEach((item, index) => {
+					if (item.selected) {
+						let goodsItem = {
+							goodsId: item.goodsId,
+							goodsSpecId: item.goodsSpecId,
+							num: item.num,
+							shoppingCartId: item.shoppingCartId,
+							secKillId: item.secKillId || '',
+							promotionGroupId: item.promotionGroupId || '',
+						};
+						buyList.push(goodsItem);
+					}
+				});
+				if (buyList.length < 1) {
+					return this.$toast('至少选择一件商品');
+				}
+				if (!this.userInfo.mobile) {
+					this.isShowPhoneDialog = true;
+					return;
+				}
+				// 跳转结算页面
+				uni.navigateTo({
+					url: '/packageGoods/pages/order?buyList=' + JSON.stringify(buyList),
+				});
+			},
+
+			// 关闭通告栏
+			closeNoticebar() {
+				this.isNoticebar = false;
+			},
+		},
+	};
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #f4f2f2;
+		box-sizing: border-box;
+	}
+
+	.app-container {
+		height: auto;
+		padding: 110rpx 0;
+
+		&.hasNoticebar {
+			padding-top: 174rpx;
+		}
+
+		.noticebar {
+			position: fixed;
+			top: 0;
+			left: 0;
+			width: 100%;
+			z-index: 100;
+		}
+
+		.top {
+			position: fixed;
+			top: 0;
+			left: 0;
+			z-index: 99;
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			background: #ffffff;
+			height: 88rpx;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			border-bottom: 1px solid #f4f2f2;
+
+			&.hasNoticebar {
+				top: 64rpx;
+			}
+
+			.total {
+				font-size: 32rpx;
+			}
+		}
+
+		.list {
+			padding: 0 20rpx;
+
+			.item {
+				margin-bottom: 20rpx;
+				border-radius: 10rpx;
+				padding: 20rpx 20rpx;
+				display: flex;
+				align-items: center;
+				background: #ffffff;
+
+				.check {
+					image {
+						width: 32rpx;
+						height: 32rpx;
+						display: block;
+					}
+				}
+
+				.img {
+					width: 180rpx;
+					height: 180rpx;
+					display: block;
+					margin: 0 20rpx;
+					flex-shrink: 0;
+				}
+
+				.right {
+					width: 420rpx;
+					height: 190rpx;
+					display: flex;
+					justify-content: space-between;
+					flex-direction: column;
+
+					.title {
+						font-size: 28rpx;
+						color: #333333;
+						line-height: 36rpx;
+					}
+
+					.des {
+						font-size: 24rpx;
+						color: #999999;
+						line-height: 36rpx;
+					}
+
+					.last {
+						display: flex;
+						justify-content: space-between;
+						align-items: center;
+
+						.price {
+							display: flex;
+							flex-direction: column;
+						}
+
+						.price-1 {
+							font-size: 32rpx;
+							color: #ff3f42;
+							line-height: 36rpx;
+						}
+
+						.price-2 {
+							font-size: 26rpx;
+							color: #666666;
+							line-height: 30rpx;
+							text-decoration: line-through;
+						}
+					}
+				}
+			}
+		}
+
+		.bottom {
+			position: fixed;
+			left: 0;
+			bottom: 0;
+			z-index: 99;
+			width: 100%;
+			box-sizing: border-box;
+			background: #ffffff;
+			height: 100rpx;
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			padding: 0 20rpx;
+			border-top: 1px solid #f4f2f2;
+
+			.check {
+				display: flex;
+				align-items: center;
+
+				image {
+					width: 32rpx;
+					height: 32rpx;
+					display: block;
+					margin-right: 20rpx;
+				}
+			}
+
+			.right {
+				display: flex;
+				align-items: center;
+
+				.price {
+					font-size: 28rpx;
+					line-height: 36rpx;
+
+					text {
+						color: #ff3f42;
+					}
+
+					margin-right: 20rpx;
+				}
+
+				.button {
+					button {
+						height: 80rpx;
+						line-height: 80rpx;
+						padding: 0;
+						border-radius: 80rpx;
+						font-size: 30rpx;
+						color: #fff;
+						background: linear-gradient(-90deg, #ff3f42 0%, #fe781f 100%);
+						padding: 0 40rpx;
+					}
+				}
+
+				.delete {
+					width: 170rpx;
+					height: 80rpx;
+					line-height: 80rpx;
+					text-align: center;
+					padding: 0;
+					border-radius: 80rpx;
+					font-size: 30rpx;
+					color: #ff3f42;
+					border: 1px solid #ff3f42;
+				}
+			}
+		}
+	}
+
+	.phone-dialog {
+		padding: 40rpx;
+		box-sizing: border-box;
+
+		.content {
+			margin-top: 30rpx;
+			margin-bottom: 30rpx;
+			line-height: 50rpx;
+
+			text {
+				color: #9d9d9d;
+			}
+		}
+
+		.btn {
+			display: flex;
+			justify-content: center;
+			margin-top: 60rpx;
+
+			button::after {
+				border: none;
+			}
+
+			button {
+				width: 180rpx;
+				height: 70rpx;
+				line-height: 70rpx;
+				margin: 0;
+				font-size: 28rpx;
+				margin: 0 30rpx;
+
+				&:first-child {
+					background: #f5f5f5;
+					color: #00ba5c;
+				}
+			}
+		}
+	}
 </style>

pages/goods/all.vue

@@ -1,269 +1,269 @@
-<template>
-	<view class="app-container">
-		<view class="top-container">
-			<view class="tab">
-				<view class="item" :class="screenType === 0 ? 'current':''" @tap="changeScreen(0)">综合</view>
-				<view class="item" :class="screenType === 1 ? 'current':''" @tap="changeScreen(1)">销量</view>
-				<view class="item" :class="screenType === 2 || screenType === 3 ? 'current':''"  @tap="changeScreen(2)">价格
-					<image src="@/static/icon/price_1.png" v-if="screenType === 2"></image>
-					<image src="@/static/icon/price_2.png" v-if="screenType === 3"></image>
-					<image src="@/static/icon/price_0.png" v-if="screenType != 2 && screenType != 3"></image>
-				</view>
-				<view class="item" :class="screenType === 4 ? 'current':''" @tap="changeScreen(4)">上架时间</view>
-			</view>
-			<view class="icon">
-				<image src="@/static/icon/show_1.png" v-if="showType == 1" @tap="showType = 2"></image>
-				<image src="@/static/icon/show_2.png" v-if="showType == 2" @tap="showType = 1"></image>
-			</view>
-		</view>
-		<view class="goods-waterfall-list" v-show="showType == 1">
-			<view class="left">
-				<block v-for="(item, index) in goodsList" :key='index'>
-					<view class="item" v-if="index%2==0" @tap="toGoodsDetail(item.goodsId)">
-						<view class="image">
-							<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
-							<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
-						</view>
-						<view class="content">
-							<view class="title ellipsis-2">{{item.goodsName}}</view>
-							<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
-								<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
-							</view>
-							<view class="price">
-								<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
-								<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
-							</view>
-							<view class="tags2" v-if="item.tags2 && item.tags2.length > 0">
-								<view class="it" v-for="(it, idx) in item.tags2" :key="idx">{{it}}</view>
-							</view>
-							<view class="text">销量：{{item.soldNum}}</view>
-						</view>
-					</view>
-				</block>
-			</view>
-			<view class="right">
-				<block v-for="(item, index) in goodsList" :key='index'>
-					<view class="item" v-if="index%2==1" @tap="toGoodsDetail(item.goodsId)">
-						<view class="image">
-							<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
-							<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
-						</view>
-						<view class="content">
-							<view class="title ellipsis-2">{{item.goodsName}}</view>
-							<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
-								<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
-							</view>
-							<view class="price">
-								<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
-								<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
-							</view>
-							<view class="tags2" v-if="item.tags2 && item.tags2.length > 0">
-								<view class="it" v-for="(it, idx) in item.tags2" :key="idx">{{it}}</view>
-							</view>
-							<view class="text">销量：{{item.soldNum}}</view>
-						</view>
-					</view>
-				</block>
-			</view>
-		</view>
-		
-		<view class="goods-row-list" v-show="showType == 2">
-			<block v-for="(item, index) in goodsList" :key='index'>
-				<view class="item" @tap="toGoodsDetail(item.goodsId)">
-					<view class="image">
-						<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
-						<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
-					</view>
-					<view class="right">
-						<view>
-							<view class="title ellipsis-2">{{item.goodsName}}</view>
-							<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
-								<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
-							</view>
-						</view>
-						<view>
-							<view class="bottom">
-								<view class="price">
-									<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
-									<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
-								</view>
-								<view class="text">销量：{{item.soldNum}}</view>
-							</view>
-						</view>
-					</view>
-				</view>
-			</block>
-		</view>
-		<no-data v-if="!goodsList.length" :showText="'暂无商品'"></no-data>
-		<loading-text v-if="goodsList.length"  :loading="loading" :noMore="noMore" ></loading-text>
-		
-		<!-- <drag-button :isDock="true" :customBar="true" ref="dragButton"></drag-button> -->
-	</view>
-</template>
-
-<script>
-	// import dragButton from '@/components/drag-button.vue';
-	
-	export default {
-		// components:{
-		// 	dragButton
-		// },
-		data() {
-			return {
-				screenType: '',
-				goodsList: [],
-				pageNum: 1,
-				pageSize: 8,
-				noMore: false,
-				loading: false,
-				showType: 1
-			}
-		},
-		
-		onShow() {
-			// this.$refs.dragButton.init();
-		},
-		
-		onLoad() {
-			this.getGoodsList();
-		},
-		
-		// 下拉刷新
-		onPullDownRefresh() {
-			this.pageNum = 1;
-			this.getGoodsList();
-		},
-		
-		// 上拉加载
-		onReachBottom() {
-			this.getGoodsList(1);
-		},
-		
-		methods: {
-			// 切换筛选类型
-			changeScreen(type) {
-				if(type != 2) {
-					if(this.screenType !== type) {
-						this.screenType = type;
-					}else {
-						this.screenType = '';
-					}
-				}else {
-					if(this.screenType != 2 && this.screenType != 3) {
-						this.screenType = 2;
-					}else if(this.screenType == 2) {
-						this.screenType = 3;
-					}else {
-						this.screenType = '';
-					}
-				}
-				this.pageNum = 1;
-				this.getGoodsList();
-			},
-			
-			// 获取商品列表
-			getGoodsList(loadMore) {
-				if(this.noMore && loadMore)return;
-				this.noMore = false
-				if(!loadMore){
-					this.pageNum = 1;
-				}else{
-					this.loading = true;
-				}
-				this.$axios({
-					url: '/goods/list/sort/page',
-					method: 'get',
-					params: {
-						pageNum: this.pageNum,
-						pageSize: this.pageSize,
-						categoryId: '',
-						sort: this.screenType
-					},
-					isLoading: !loadMore
-				}).then(res => {
-					res.data.records.forEach(item => {
-						if(item.logo && item.logoStartTime) {
-							item.isShowWater = this.$compareTime(item.logoStartTime, item.logoEndTime);
-						}else {
-							item.isShowWater = false;
-						}
-					})
-					let _list = res.data.records;
-					let pageTotal = res.data.pages;
-					if(this.pageNum >= pageTotal){
-						this.noMore = true;
-					}
-					if (_list.length) {
-						this.pageNum += 1
-					}
-					if (loadMore) {
-						this.goodsList = this.goodsList.concat(_list);
-						this.loading = false;
-					} else {
-						this.goodsList = _list;
-					}
-					
-					uni.stopPullDownRefresh();
-				})
-			},
-			
-			toGoodsDetail(id) {
-				uni.navigateTo({
-					url: '/packageGoods/pages/detail?id=' + id
-				})
-			}
-		}
-	}
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #F4F2F2;
-		padding-top: 88rpx;
-		box-sizing: border-box;
-	}
-	.top-container {
-		position: fixed;
-		top: 0;
-		left: 0;
-		width: 100%;
-		background: #FFFFFF;
-		display: flex;
-		padding: 0 20rpx;
-		align-items: center;
-		box-sizing: border-box;
-		.tab {
-			flex: 1;
-			display: flex;
-			padding: 0 80rpx 0 30rpx;
-			box-sizing: border-box;
-			justify-content: space-between;
-			.item {
-				height: 88rpx;
-				display: flex;
-				align-items: center;
-				justify-content: center;
-				font-size: 30rpx;
-				color: #666666;
-				&.current {
-					color: #FF3F42;
-				}
-				image {
-					width: 18rpx;
-					height: 30rpx;
-					display: block;
-					margin-left: 10rpx;
-				}
-			}
-		}
-		.icon {
-			padding-right: 10rpx;
-			image {
-				width: 36rpx;
-				height: 36rpx;
-				display: block;
-			}
-		}
-	}
-	
-</style>
+<template>
+	<view class="app-container">
+		<view class="top-container">
+			<view class="tab">
+				<view class="item" :class="screenType === 0 ? 'current':''" @tap="changeScreen(0)">综合</view>
+				<view class="item" :class="screenType === 1 ? 'current':''" @tap="changeScreen(1)">销量</view>
+				<view class="item" :class="screenType === 2 || screenType === 3 ? 'current':''"  @tap="changeScreen(2)">价格
+					<image src="@/static/icon/price_1.png" v-if="screenType === 2"></image>
+					<image src="@/static/icon/price_2.png" v-if="screenType === 3"></image>
+					<image src="@/static/icon/price_0.png" v-if="screenType != 2 && screenType != 3"></image>
+				</view>
+				<view class="item" :class="screenType === 4 ? 'current':''" @tap="changeScreen(4)">上架时间</view>
+			</view>
+			<view class="icon">
+				<image src="@/static/icon/show_1.png" v-if="showType == 1" @tap="showType = 2"></image>
+				<image src="@/static/icon/show_2.png" v-if="showType == 2" @tap="showType = 1"></image>
+			</view>
+		</view>
+		<view class="goods-waterfall-list" v-show="showType == 1">
+			<view class="left">
+				<block v-for="(item, index) in goodsList" :key='index'>
+					<view class="item" v-if="index%2==0" @tap="toGoodsDetail(item.goodsId)">
+						<view class="image">
+							<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
+							<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
+						</view>
+						<view class="content">
+							<view class="title ellipsis-2">{{item.goodsName}}</view>
+							<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
+								<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
+							</view>
+							<view class="price">
+								<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
+								<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
+							</view>
+							<view class="tags2" v-if="item.tags2 && item.tags2.length > 0">
+								<view class="it" v-for="(it, idx) in item.tags2" :key="idx">{{it}}</view>
+							</view>
+							<view class="text">销量：{{item.soldNum}}</view>
+						</view>
+					</view>
+				</block>
+			</view>
+			<view class="right">
+				<block v-for="(item, index) in goodsList" :key='index'>
+					<view class="item" v-if="index%2==1" @tap="toGoodsDetail(item.goodsId)">
+						<view class="image">
+							<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
+							<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
+						</view>
+						<view class="content">
+							<view class="title ellipsis-2">{{item.goodsName}}</view>
+							<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
+								<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
+							</view>
+							<view class="price">
+								<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
+								<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
+							</view>
+							<view class="tags2" v-if="item.tags2 && item.tags2.length > 0">
+								<view class="it" v-for="(it, idx) in item.tags2" :key="idx">{{it}}</view>
+							</view>
+							<view class="text">销量：{{item.soldNum}}</view>
+						</view>
+					</view>
+				</block>
+			</view>
+		</view>
+		
+		<view class="goods-row-list" v-show="showType == 2">
+			<block v-for="(item, index) in goodsList" :key='index'>
+				<view class="item" @tap="toGoodsDetail(item.goodsId)">
+					<view class="image">
+						<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
+						<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
+					</view>
+					<view class="right">
+						<view>
+							<view class="title ellipsis-2">{{item.goodsName}}</view>
+							<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
+								<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
+							</view>
+						</view>
+						<view>
+							<view class="bottom">
+								<view class="price">
+									<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
+									<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
+								</view>
+								<view class="text">销量：{{item.soldNum}}</view>
+							</view>
+						</view>
+					</view>
+				</view>
+			</block>
+		</view>
+		<no-data v-if="!goodsList.length" :showText="'暂无商品'"></no-data>
+		<loading-text v-if="goodsList.length"  :loading="loading" :noMore="noMore" ></loading-text>
+		
+		<!-- <drag-button :isDock="true" :customBar="true" ref="dragButton"></drag-button> -->
+	</view>
+</template>
+
+<script>
+	// import dragButton from '@/components/drag-button.vue';
+	
+	export default {
+		// components:{
+		// 	dragButton
+		// },
+		data() {
+			return {
+				screenType: '',
+				goodsList: [],
+				pageNum: 1,
+				pageSize: 8,
+				noMore: false,
+				loading: false,
+				showType: 1
+			}
+		},
+		
+		onShow() {
+			// this.$refs.dragButton.init();
+		},
+		
+		onLoad() {
+			this.getGoodsList();
+		},
+		
+		// 下拉刷新
+		onPullDownRefresh() {
+			this.pageNum = 1;
+			this.getGoodsList();
+		},
+		
+		// 上拉加载
+		onReachBottom() {
+			this.getGoodsList(1);
+		},
+		
+		methods: {
+			// 切换筛选类型
+			changeScreen(type) {
+				if(type != 2) {
+					if(this.screenType !== type) {
+						this.screenType = type;
+					}else {
+						this.screenType = '';
+					}
+				}else {
+					if(this.screenType != 2 && this.screenType != 3) {
+						this.screenType = 2;
+					}else if(this.screenType == 2) {
+						this.screenType = 3;
+					}else {
+						this.screenType = '';
+					}
+				}
+				this.pageNum = 1;
+				this.getGoodsList();
+			},
+			
+			// 获取商品列表
+			getGoodsList(loadMore) {
+				if(this.noMore && loadMore)return;
+				this.noMore = false
+				if(!loadMore){
+					this.pageNum = 1;
+				}else{
+					this.loading = true;
+				}
+				this.$axios({
+					url: '/goods/list/sort/page',
+					method: 'get',
+					params: {
+						pageNum: this.pageNum,
+						pageSize: this.pageSize,
+						categoryId: '',
+						sort: this.screenType
+					},
+					isLoading: !loadMore
+				}).then(res => {
+					res.data.records.forEach(item => {
+						if(item.logo && item.logoStartTime) {
+							item.isShowWater = this.$compareTime(item.logoStartTime, item.logoEndTime);
+						}else {
+							item.isShowWater = false;
+						}
+					})
+					let _list = res.data.records;
+					let pageTotal = res.data.pages;
+					if(this.pageNum >= pageTotal){
+						this.noMore = true;
+					}
+					if (_list.length) {
+						this.pageNum += 1
+					}
+					if (loadMore) {
+						this.goodsList = this.goodsList.concat(_list);
+						this.loading = false;
+					} else {
+						this.goodsList = _list;
+					}
+					
+					uni.stopPullDownRefresh();
+				})
+			},
+			
+			toGoodsDetail(id) {
+				uni.navigateTo({
+					url: '/packageGoods/pages/detail?id=' + id
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		padding-top: 88rpx;
+		box-sizing: border-box;
+	}
+	.top-container {
+		position: fixed;
+		top: 0;
+		left: 0;
+		width: 100%;
+		background: #FFFFFF;
+		display: flex;
+		padding: 0 20rpx;
+		align-items: center;
+		box-sizing: border-box;
+		.tab {
+			flex: 1;
+			display: flex;
+			padding: 0 80rpx 0 30rpx;
+			box-sizing: border-box;
+			justify-content: space-between;
+			.item {
+				height: 88rpx;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				font-size: 30rpx;
+				color: #666666;
+				&.current {
+					color: #FF3F42;
+				}
+				image {
+					width: 18rpx;
+					height: 30rpx;
+					display: block;
+					margin-left: 10rpx;
+				}
+			}
+		}
+		.icon {
+			padding-right: 10rpx;
+			image {
+				width: 36rpx;
+				height: 36rpx;
+				display: block;
+			}
+		}
+	}
+	
+</style>

pages/goods/classify.vue

@@ -1,197 +1,197 @@
-<template>
-	<view class="app-container">
-		<view class="search-container">
-			<view class="search">
-				<image src="/static/icon/search.png" class=""></image>
-				<input type="text" confirm-type="search" placeholder="输入分类名称进行搜索" v-model="keyword" @confirm="searchSubmit">
-			</view>
-		</view>
-		
-		<view class="main-container">
-			<view class="left">
-				<block v-for="(item, index) in leftList" :key='index'>
-					<view class="item ellipsis" :class="leftCurrent == item.categoryId ? 'current':''" @tap="changeLeft(item.categoryId)">{{item.name}}</view>
-				</block>
-			</view>
-			<view class="right">
-				<block v-for="(item, index) in rightList" :key='index'>
-					<view class="item" @tap="toList(item.categoryId, item.name)">
-						<image :src="item.imgUrl" mode="aspectFill"></image>
-						<text class="name ellipsis">{{item.name}}</text>
-					</view>
-				</block>
-				<no-data v-if="!rightList.length" :showText="'暂无数据'"  style="width: 100%;"></no-data>
-			</view>
-		</view>
-		
-		<!-- <drag-button :isDock="true" :customBar="true" ref="dragButton"></drag-button> -->
-	</view>
-</template>
-
-<script>
-	// import dragButton from '@/components/drag-button.vue';
-	
-	export default {
-		// components:{
-		// 	dragButton
-		// },
-		data() {
-			return {
-				keyword: '',
-				leftList: [],
-				leftCurrent: 0,
-				rightList: [],
-			}
-		},
-		
-		onShow() {
-			if(uni.getStorageSync('categoryId')) {
-				this.getLeftList();
-			}
-			
-			// this.$refs.dragButton.init();
-		},
-		
-		onLoad() {
-			if(!uni.getStorageSync('categoryId')) {
-				this.getLeftList();
-			}
-		},
-		
-		methods: {
-			// 获取一级菜单
-			getLeftList() {
-				this.$axios({
-					url: '/goods/category/list',
-					method: 'get',
-					params: {}
-				}).then(res => {
-					this.leftList = res.data;
-					if(uni.getStorageSync('categoryId')) {
-						this.leftCurrent = uni.getStorageSync('categoryId');
-						uni.setStorageSync('categoryId', 0);
-					}else {
-						this.leftCurrent = res.data.length > 0 ? res.data[0].categoryId : 0;
-					}
-					this.getRightList();
-				})
-			},
-			
-			// 获取二级菜单
-			getRightList() {
-				this.$axios({
-					url: '/goods/category/list',
-					method: 'get',
-					params: {
-						parentId: this.leftCurrent,
-						name: this.keyword
-					}
-				}).then(res => {
-					this.rightList = res.data;
-				})
-			},
-			
-			// 切换一级菜单
-			changeLeft(pid) {
-				this.leftCurrent = pid;
-				this.getRightList();
-			},
-			
-			// 搜索
-			searchSubmit() {
-				this.getRightList();
-			},
-			
-			toList(cid, cname) {
-				uni.navigateTo({
-					url: '/packageGoods/pages/list?cid=' + cid + '&cname=' + cname
-				})
-			}
-		}
-	}
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #F4F2F2;
-	}
-	.search-container {
-		background: #FFFFFF;
-		padding: 12rpx 20rpx;
-		border-bottom: 1px solid #F4F2F2;
-		.search {
-			height: 64rpx;
-			display: flex;
-			align-items: center;
-			background: #F0F0F0;
-			border-radius: 64rpx;
-			padding: 0 20rpx;
-			image {
-				width: 28rpx;
-				height: 28rpx;
-			}
-			input {
-				width: 100%;
-				padding-left: 15rpx;
-			}
-		}
-	}
-	.main-container {
-		display: flex;
-		height: calc(100vh - 88rpx);
-		.left {
-			width: 220rpx;
-			height: 100%;
-			overflow-y: scroll;
-			background: #FFFFFF;
-			box-sizing: border-box;
-			padding: 30rpx 20rpx;
-			flex-shrink: 0;
-			.item {
-				margin-bottom: 40rpx;
-				font-size: 28rpx;
-				color: #333333;
-				line-height: 48rpx;
-				border-radius: 48rpx;
-				text-align: center;
-				&.current {
-					color: #FFFFFF;
-					background: #FF3F42;
-				}
-			}
-		}
-		.right {
-			width: 500rpx;
-			margin: 20rpx 20rpx auto 10rpx;
-			background: #FFFFFF;
-			border-radius: 10rpx;
-			display: flex;
-			flex-wrap: wrap;
-			padding: 0 20rpx 20rpx 20rpx;
-			max-height: calc(100% - 20rpx);
-			overflow-y: scroll;
-			box-sizing: border-box;
-			.item {
-				display: flex;
-				flex-direction: column;
-				align-items: center;
-				margin-right: 20rpx;
-				margin-top: 20rpx;
-				width: 140rpx;
-				font-size: 24rpx;
-				image {
-					width: 140rpx;
-					height: 140rpx;
-					margin-bottom: 5rpx;
-				}
-				.name {
-					width: 150rpx;
-					text-align: center;
-				}
-				&:nth-child(3n) {
-					margin-right: 0;
-				}
-			}
-		}
-	}
-</style>
+<template>
+	<view class="app-container">
+		<view class="search-container">
+			<view class="search">
+				<image src="/static/icon/search.png" class=""></image>
+				<input type="text" confirm-type="search" placeholder="输入分类名称进行搜索" v-model="keyword" @confirm="searchSubmit">
+			</view>
+		</view>
+		
+		<view class="main-container">
+			<view class="left">
+				<block v-for="(item, index) in leftList" :key='index'>
+					<view class="item ellipsis" :class="leftCurrent == item.categoryId ? 'current':''" @tap="changeLeft(item.categoryId)">{{item.name}}</view>
+				</block>
+			</view>
+			<view class="right">
+				<block v-for="(item, index) in rightList" :key='index'>
+					<view class="item" @tap="toList(item.categoryId, item.name)">
+						<image :src="item.imgUrl" mode="aspectFill"></image>
+						<text class="name ellipsis">{{item.name}}</text>
+					</view>
+				</block>
+				<no-data v-if="!rightList.length" :showText="'暂无数据'"  style="width: 100%;"></no-data>
+			</view>
+		</view>
+		
+		<!-- <drag-button :isDock="true" :customBar="true" ref="dragButton"></drag-button> -->
+	</view>
+</template>
+
+<script>
+	// import dragButton from '@/components/drag-button.vue';
+	
+	export default {
+		// components:{
+		// 	dragButton
+		// },
+		data() {
+			return {
+				keyword: '',
+				leftList: [],
+				leftCurrent: 0,
+				rightList: [],
+			}
+		},
+		
+		onShow() {
+			if(uni.getStorageSync('categoryId')) {
+				this.getLeftList();
+			}
+			
+			// this.$refs.dragButton.init();
+		},
+		
+		onLoad() {
+			if(!uni.getStorageSync('categoryId')) {
+				this.getLeftList();
+			}
+		},
+		
+		methods: {
+			// 获取一级菜单
+			getLeftList() {
+				this.$axios({
+					url: '/goods/category/list',
+					method: 'get',
+					params: {}
+				}).then(res => {
+					this.leftList = res.data;
+					if(uni.getStorageSync('categoryId')) {
+						this.leftCurrent = uni.getStorageSync('categoryId');
+						uni.setStorageSync('categoryId', 0);
+					}else {
+						this.leftCurrent = res.data.length > 0 ? res.data[0].categoryId : 0;
+					}
+					this.getRightList();
+				})
+			},
+			
+			// 获取二级菜单
+			getRightList() {
+				this.$axios({
+					url: '/goods/category/list',
+					method: 'get',
+					params: {
+						parentId: this.leftCurrent,
+						name: this.keyword
+					}
+				}).then(res => {
+					this.rightList = res.data;
+				})
+			},
+			
+			// 切换一级菜单
+			changeLeft(pid) {
+				this.leftCurrent = pid;
+				this.getRightList();
+			},
+			
+			// 搜索
+			searchSubmit() {
+				this.getRightList();
+			},
+			
+			toList(cid, cname) {
+				uni.navigateTo({
+					url: '/packageGoods/pages/list?cid=' + cid + '&cname=' + cname
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+	}
+	.search-container {
+		background: #FFFFFF;
+		padding: 12rpx 20rpx;
+		border-bottom: 1px solid #F4F2F2;
+		.search {
+			height: 64rpx;
+			display: flex;
+			align-items: center;
+			background: #F0F0F0;
+			border-radius: 64rpx;
+			padding: 0 20rpx;
+			image {
+				width: 28rpx;
+				height: 28rpx;
+			}
+			input {
+				width: 100%;
+				padding-left: 15rpx;
+			}
+		}
+	}
+	.main-container {
+		display: flex;
+		height: calc(100vh - 88rpx);
+		.left {
+			width: 220rpx;
+			height: 100%;
+			overflow-y: scroll;
+			background: #FFFFFF;
+			box-sizing: border-box;
+			padding: 30rpx 20rpx;
+			flex-shrink: 0;
+			.item {
+				margin-bottom: 40rpx;
+				font-size: 28rpx;
+				color: #333333;
+				line-height: 48rpx;
+				border-radius: 48rpx;
+				text-align: center;
+				&.current {
+					color: #FFFFFF;
+					background: #FF3F42;
+				}
+			}
+		}
+		.right {
+			width: 500rpx;
+			margin: 20rpx 20rpx auto 10rpx;
+			background: #FFFFFF;
+			border-radius: 10rpx;
+			display: flex;
+			flex-wrap: wrap;
+			padding: 0 20rpx 20rpx 20rpx;
+			max-height: calc(100% - 20rpx);
+			overflow-y: scroll;
+			box-sizing: border-box;
+			.item {
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				margin-right: 20rpx;
+				margin-top: 20rpx;
+				width: 140rpx;
+				font-size: 24rpx;
+				image {
+					width: 140rpx;
+					height: 140rpx;
+					margin-bottom: 5rpx;
+				}
+				.name {
+					width: 150rpx;
+					text-align: center;
+				}
+				&:nth-child(3n) {
+					margin-right: 0;
+				}
+			}
+		}
+	}
+</style>

pages/index/chakanyyzz.vue

@@ -1,202 +1,202 @@
-<template>
-	<view class="app-container">
-		<view class="code-container" v-if="isShowCode">
-			<view class="title">请完成安全验证</view>
-			<pt-images-verification ref="verification" :top="codeObj.yHeight" :bgImg="codeObj.bigImage" :maskImg="codeObj.smallImage" :isSuccess="codeObj.isSuccess" :isFail="codeObj.isFail" @refresh="refresh" @finish="finish"></pt-images-verification>
-		</view>
-		<image v-else :src="imagesUrl" style="width:100%" mode="widthFix"></image>
-	</view>
-</template>
-
-<script>
-	import {
-		mapState
-	} from 'vuex';
-	export default {
-		data() {
-			return {
-				imagesUrl:'',
-				code: '',
-				isShowCode: true,
-				codeObj: {
-					bigImage: '',
-					smallImage: '',
-					key: '',
-					yHeight: '',
-					isSuccess: false,
-					isFail: false,
-				}
-			}
-		},
-		computed: {
-			...mapState(['userInfo', 'isLogin', 'userId', 'websitData']),
-		},
-		onLoad() {
-			this.init();
-		},
-		methods: {
-			// 获取图片验证码
-			init(){
-				this.$axios({
-					url: '/common/getVerifi',
-					method: 'get',
-					params: {},
-					isLoading: 1
-				}).then(res => {
-					this.codeObj = res.data;
-				})
-			},
-			
-			// 刷新验证码
-			refresh(){
-				this.isShowCode = true
-				this.init()
-			},
-			
-			// 验证结束
-			finish(value){
-				this.$axios({
-					url: '/user/user/detail',
-					method: 'get',
-					params: {
-						userId: this.userId,
-					},
-				}).then((res) => {
-					this.$axios({
-						url: '/user/websitUrl',
-						params: {
-							websitId: res?.data?.adminWebsit?.websitId,
-							key: this.codeObj.key,
-							vrifyCode: Math.round(value)
-						},
-						isLoading: 1
-					}).then(res => {
-						this.imagesUrl = res.data
-						this.isShowCode = false
-					}).catch(err => {
-						
-					})
-				});
-			}
-		}
-	}
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #F4F2F2;
-		box-sizing: border-box;
-	}
-	.banner {
-		image {
-			width: 100%;
-		}
-	}
-	.code-container {
-		position: fixed;
-		top: calc(50vh - 150px);
-		left: calc(50vw - 170px);
-		z-index: 999;
-		background: #FFFFFF;
-		padding: 20px;
-		border-radius: 10rpx;
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		.title {
-			font-size: 28rpx;
-			color: #333333;
-			width: 100%;
-			text-align: left;
-			margin-bottom: 10px;
-		}
-		.button {
-			margin-top: 20px;
-			color: #666666;
-			width: 200rpx;
-			line-height: 60rpx;
-			border: 1px solid #eaeaea;
-			border-radius: 10rpx;
-			text-align: center;
-		}
-	}
-	.main {
-		padding: 50rpx;
-		.title {
-			font-size: 32rpx;
-			color: #333333;
-			text-align: center;
-		}
-		.button {
-			margin-top: 120rpx;
-			width: 100%;
-			text-align: center;
-			line-height: 88rpx;
-			border-radius: 88rpx;
-			font-size: 32rpx;
-			color: #FFFFFF;
-			background: linear-gradient(-90deg,#ff3f42 0%, #fe781f 100%);
-			&.disabled {
-				background: #C1C1C1;
-			}
-		}
-		.tips {
-			font-size: 24rpx;
-			color: #FE781F;
-			line-height: 24rpx;
-			margin-top: 20rpx;
-			height: 24rpx;
-			margin-left: 10rpx;
-		}
-		.form {
-			margin-top: 60rpx;
-			.row {
-				&:last-child {
-					margin-top: 40rpx;
-					display: flex;
-					align-items: flex-end;
-					.btn {
-						width: 180rpx;
-						height: 50rpx;
-						border-radius: 50rpx;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						font-size: 24rpx;
-						color: #FFFFFF;
-						background: linear-gradient(-90deg,#ff3f42 0%, #fe781f 100%);
-						margin-left: 30rpx;
-						&.disabled {
-							background: #C1C1C1;
-						}
-					}
-				}
-				.row-c {
-					height: 60rpx;
-					display: flex;
-					align-items: center;
-					border-bottom: 1px solid #D1D1D1;
-					.left {
-						width: 140rpx;
-						height: 28rpx;
-						border-right: 1px solid #D1D1D1;
-						font-size: 30rpx;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						flex-shrink: 0;
-					}
-					.input {
-						width: 100%;
-						input {
-							font-size: 30rpx;
-							width: 100%;
-							padding: 0 25rpx;
-							box-sizing: border-box;
-						}
-					}
-				}
-			}
-		}
-	}
-</style>
+<template>
+	<view class="app-container">
+		<view class="code-container" v-if="isShowCode">
+			<view class="title">请完成安全验证</view>
+			<pt-images-verification ref="verification" :top="codeObj.yHeight" :bgImg="codeObj.bigImage" :maskImg="codeObj.smallImage" :isSuccess="codeObj.isSuccess" :isFail="codeObj.isFail" @refresh="refresh" @finish="finish"></pt-images-verification>
+		</view>
+		<image v-else :src="imagesUrl" style="width:100%" mode="widthFix"></image>
+	</view>
+</template>
+
+<script>
+	import {
+		mapState
+	} from 'vuex';
+	export default {
+		data() {
+			return {
+				imagesUrl:'',
+				code: '',
+				isShowCode: true,
+				codeObj: {
+					bigImage: '',
+					smallImage: '',
+					key: '',
+					yHeight: '',
+					isSuccess: false,
+					isFail: false,
+				}
+			}
+		},
+		computed: {
+			...mapState(['userInfo', 'isLogin', 'userId', 'websitData']),
+		},
+		onLoad() {
+			this.init();
+		},
+		methods: {
+			// 获取图片验证码
+			init(){
+				this.$axios({
+					url: '/common/getVerifi',
+					method: 'get',
+					params: {},
+					isLoading: 1
+				}).then(res => {
+					this.codeObj = res.data;
+				})
+			},
+			
+			// 刷新验证码
+			refresh(){
+				this.isShowCode = true
+				this.init()
+			},
+			
+			// 验证结束
+			finish(value){
+				this.$axios({
+					url: '/user/user/detail',
+					method: 'get',
+					params: {
+						userId: this.userId,
+					},
+				}).then((res) => {
+					this.$axios({
+						url: '/user/websitUrl',
+						params: {
+							websitId: res?.data?.adminWebsit?.websitId,
+							key: this.codeObj.key,
+							vrifyCode: Math.round(value)
+						},
+						isLoading: 1
+					}).then(res => {
+						this.imagesUrl = res.data
+						this.isShowCode = false
+					}).catch(err => {
+						
+					})
+				});
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		box-sizing: border-box;
+	}
+	.banner {
+		image {
+			width: 100%;
+		}
+	}
+	.code-container {
+		position: fixed;
+		top: calc(50vh - 150px);
+		left: calc(50vw - 170px);
+		z-index: 999;
+		background: #FFFFFF;
+		padding: 20px;
+		border-radius: 10rpx;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		.title {
+			font-size: 28rpx;
+			color: #333333;
+			width: 100%;
+			text-align: left;
+			margin-bottom: 10px;
+		}
+		.button {
+			margin-top: 20px;
+			color: #666666;
+			width: 200rpx;
+			line-height: 60rpx;
+			border: 1px solid #eaeaea;
+			border-radius: 10rpx;
+			text-align: center;
+		}
+	}
+	.main {
+		padding: 50rpx;
+		.title {
+			font-size: 32rpx;
+			color: #333333;
+			text-align: center;
+		}
+		.button {
+			margin-top: 120rpx;
+			width: 100%;
+			text-align: center;
+			line-height: 88rpx;
+			border-radius: 88rpx;
+			font-size: 32rpx;
+			color: #FFFFFF;
+			background: linear-gradient(-90deg,#ff3f42 0%, #fe781f 100%);
+			&.disabled {
+				background: #C1C1C1;
+			}
+		}
+		.tips {
+			font-size: 24rpx;
+			color: #FE781F;
+			line-height: 24rpx;
+			margin-top: 20rpx;
+			height: 24rpx;
+			margin-left: 10rpx;
+		}
+		.form {
+			margin-top: 60rpx;
+			.row {
+				&:last-child {
+					margin-top: 40rpx;
+					display: flex;
+					align-items: flex-end;
+					.btn {
+						width: 180rpx;
+						height: 50rpx;
+						border-radius: 50rpx;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+						font-size: 24rpx;
+						color: #FFFFFF;
+						background: linear-gradient(-90deg,#ff3f42 0%, #fe781f 100%);
+						margin-left: 30rpx;
+						&.disabled {
+							background: #C1C1C1;
+						}
+					}
+				}
+				.row-c {
+					height: 60rpx;
+					display: flex;
+					align-items: center;
+					border-bottom: 1px solid #D1D1D1;
+					.left {
+						width: 140rpx;
+						height: 28rpx;
+						border-right: 1px solid #D1D1D1;
+						font-size: 30rpx;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+						flex-shrink: 0;
+					}
+					.input {
+						width: 100%;
+						input {
+							font-size: 30rpx;
+							width: 100%;
+							padding: 0 25rpx;
+							box-sizing: border-box;
+						}
+					}
+				}
+			}
+		}
+	}
+</style>

pages/index/components/all.vue

@@ -1,269 +1,269 @@
-<template>
-	<view class="app-container">
-		<view class="top-container">
-			<view class="tab">
-				<view class="item" :class="screenType === 0 ? 'current':''" @tap="changeScreen(0)">综合</view>
-				<view class="item" :class="screenType === 1 ? 'current':''" @tap="changeScreen(1)">销量</view>
-				<view class="item" :class="screenType === 2 || screenType === 3 ? 'current':''"  @tap="changeScreen(2)">价格
-					<image src="@/static/icon/price_1.png" v-if="screenType === 2"></image>
-					<image src="@/static/icon/price_2.png" v-if="screenType === 3"></image>
-					<image src="@/static/icon/price_0.png" v-if="screenType != 2 && screenType != 3"></image>
-				</view>
-				<view class="item" :class="screenType === 4 ? 'current':''" @tap="changeScreen(4)">上架时间</view>
-			</view>
-			<view class="icon">
-				<image src="@/static/icon/show_1.png" v-if="showType == 1" @tap="showType = 2"></image>
-				<image src="@/static/icon/show_2.png" v-if="showType == 2" @tap="showType = 1"></image>
-			</view>
-		</view>
-		<view class="goods-waterfall-list" v-show="showType == 1">
-			<view class="left">
-				<block v-for="(item, index) in goodsList" :key='index'>
-					<view class="item" v-if="index%2==0" @tap="toGoodsDetail(item.goodsId)">
-						<view class="image">
-							<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
-							<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
-						</view>
-						<view class="content">
-							<view class="title ellipsis-2">{{item.goodsName}}</view>
-							<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
-								<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
-							</view>
-							<view class="price">
-								<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
-								<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
-							</view>
-							<view class="tags2" v-if="item.tags2 && item.tags2.length > 0">
-								<view class="it" v-for="(it, idx) in item.tags2" :key="idx">{{it}}</view>
-							</view>
-							<view class="text">销量：{{item.soldNum}}</view>
-						</view>
-					</view>
-				</block>
-			</view>
-			<view class="right">
-				<block v-for="(item, index) in goodsList" :key='index'>
-					<view class="item" v-if="index%2==1" @tap="toGoodsDetail(item.goodsId)">
-						<view class="image">
-							<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
-							<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
-						</view>
-						<view class="content">
-							<view class="title ellipsis-2">{{item.goodsName}}</view>
-							<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
-								<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
-							</view>
-							<view class="price">
-								<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
-								<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
-							</view>
-							<view class="tags2" v-if="item.tags2 && item.tags2.length > 0">
-								<view class="it" v-for="(it, idx) in item.tags2" :key="idx">{{it}}</view>
-							</view>
-							<view class="text">销量：{{item.soldNum}}</view>
-						</view>
-					</view>
-				</block>
-			</view>
-		</view>
-		
-		<view class="goods-row-list" v-show="showType == 2">
-			<block v-for="(item, index) in goodsList" :key='index'>
-				<view class="item" @tap="toGoodsDetail(item.goodsId)">
-					<view class="image">
-						<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
-						<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
-					</view>
-					<view class="right">
-						<view>
-							<view class="title ellipsis-2">{{item.goodsName}}</view>
-							<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
-								<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
-							</view>
-						</view>
-						<view>
-							<view class="bottom">
-								<view class="price">
-									<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
-									<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
-								</view>
-								<view class="text">销量：{{item.soldNum}}</view>
-							</view>
-						</view>
-					</view>
-				</view>
-			</block>
-		</view>
-		<no-data v-if="!goodsList.length" :showText="'暂无商品'"></no-data>
-		<loading-text v-if="goodsList.length"  :loading="loading" :noMore="noMore" ></loading-text>
-		
-		<!-- <drag-button :isDock="true" :customBar="true" ref="dragButton"></drag-button> -->
-	</view>
-</template>
-
-<script>
-	// import dragButton from '@/components/drag-button.vue';
-	
-	export default {
-		// components:{
-		// 	dragButton
-		// },
-		data() {
-			return {
-				screenType: '',
-				goodsList: [],
-				pageNum: 1,
-				pageSize: 8,
-				noMore: false,
-				loading: false,
-				showType: 1
-			}
-		},
-		
-		onShow() {
-			// this.$refs.dragButton.init();
-		},
-		
-		onLoad() {
-			this.getGoodsList();
-		},
-		
-		// 下拉刷新
-		onPullDownRefresh() {
-			this.pageNum = 1;
-			this.getGoodsList();
-		},
-		
-		// 上拉加载
-		onReachBottom() {
-			this.getGoodsList(1);
-		},
-		
-		methods: {
-			// 切换筛选类型
-			changeScreen(type) {
-				if(type != 2) {
-					if(this.screenType !== type) {
-						this.screenType = type;
-					}else {
-						this.screenType = '';
-					}
-				}else {
-					if(this.screenType != 2 && this.screenType != 3) {
-						this.screenType = 2;
-					}else if(this.screenType == 2) {
-						this.screenType = 3;
-					}else {
-						this.screenType = '';
-					}
-				}
-				this.pageNum = 1;
-				this.getGoodsList();
-			},
-			
-			// 获取商品列表
-			getGoodsList(loadMore) {
-				if(this.noMore && loadMore)return;
-				this.noMore = false
-				if(!loadMore){
-					this.pageNum = 1;
-				}else{
-					this.loading = true;
-				}
-				this.$axios({
-					url: '/goods/list/sort/page',
-					method: 'get',
-					params: {
-						pageNum: this.pageNum,
-						pageSize: this.pageSize,
-						categoryId: '',
-						sort: this.screenType
-					},
-					isLoading: !loadMore
-				}).then(res => {
-					res.data.records.forEach(item => {
-						if(item.logo && item.logoStartTime) {
-							item.isShowWater = this.$compareTime(item.logoStartTime, item.logoEndTime);
-						}else {
-							item.isShowWater = false;
-						}
-					})
-					let _list = res.data.records;
-					let pageTotal = res.data.pages;
-					if(this.pageNum >= pageTotal){
-						this.noMore = true;
-					}
-					if (_list.length) {
-						this.pageNum += 1
-					}
-					if (loadMore) {
-						this.goodsList = this.goodsList.concat(_list);
-						this.loading = false;
-					} else {
-						this.goodsList = _list;
-					}
-					
-					uni.stopPullDownRefresh();
-				})
-			},
-			
-			toGoodsDetail(id) {
-				uni.navigateTo({
-					url: '/packageGoods/pages/detail?id=' + id
-				})
-			}
-		}
-	}
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #F4F2F2;
-		padding-top: 88rpx;
-		box-sizing: border-box;
-	}
-	.top-container {
-		position: fixed;
-		top: 0;
-		left: 0;
-		width: 100%;
-		background: #FFFFFF;
-		display: flex;
-		padding: 0 20rpx;
-		align-items: center;
-		box-sizing: border-box;
-		.tab {
-			flex: 1;
-			display: flex;
-			padding: 0 80rpx 0 30rpx;
-			box-sizing: border-box;
-			justify-content: space-between;
-			.item {
-				height: 88rpx;
-				display: flex;
-				align-items: center;
-				justify-content: center;
-				font-size: 30rpx;
-				color: #666666;
-				&.current {
-					color: #FF3F42;
-				}
-				image {
-					width: 18rpx;
-					height: 30rpx;
-					display: block;
-					margin-left: 10rpx;
-				}
-			}
-		}
-		.icon {
-			padding-right: 10rpx;
-			image {
-				width: 36rpx;
-				height: 36rpx;
-				display: block;
-			}
-		}
-	}
-	
-</style>
+<template>
+	<view class="app-container">
+		<view class="top-container">
+			<view class="tab">
+				<view class="item" :class="screenType === 0 ? 'current':''" @tap="changeScreen(0)">综合</view>
+				<view class="item" :class="screenType === 1 ? 'current':''" @tap="changeScreen(1)">销量</view>
+				<view class="item" :class="screenType === 2 || screenType === 3 ? 'current':''"  @tap="changeScreen(2)">价格
+					<image src="@/static/icon/price_1.png" v-if="screenType === 2"></image>
+					<image src="@/static/icon/price_2.png" v-if="screenType === 3"></image>
+					<image src="@/static/icon/price_0.png" v-if="screenType != 2 && screenType != 3"></image>
+				</view>
+				<view class="item" :class="screenType === 4 ? 'current':''" @tap="changeScreen(4)">上架时间</view>
+			</view>
+			<view class="icon">
+				<image src="@/static/icon/show_1.png" v-if="showType == 1" @tap="showType = 2"></image>
+				<image src="@/static/icon/show_2.png" v-if="showType == 2" @tap="showType = 1"></image>
+			</view>
+		</view>
+		<view class="goods-waterfall-list" v-show="showType == 1">
+			<view class="left">
+				<block v-for="(item, index) in goodsList" :key='index'>
+					<view class="item" v-if="index%2==0" @tap="toGoodsDetail(item.goodsId)">
+						<view class="image">
+							<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
+							<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
+						</view>
+						<view class="content">
+							<view class="title ellipsis-2">{{item.goodsName}}</view>
+							<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
+								<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
+							</view>
+							<view class="price">
+								<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
+								<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
+							</view>
+							<view class="tags2" v-if="item.tags2 && item.tags2.length > 0">
+								<view class="it" v-for="(it, idx) in item.tags2" :key="idx">{{it}}</view>
+							</view>
+							<view class="text">销量：{{item.soldNum}}</view>
+						</view>
+					</view>
+				</block>
+			</view>
+			<view class="right">
+				<block v-for="(item, index) in goodsList" :key='index'>
+					<view class="item" v-if="index%2==1" @tap="toGoodsDetail(item.goodsId)">
+						<view class="image">
+							<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
+							<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
+						</view>
+						<view class="content">
+							<view class="title ellipsis-2">{{item.goodsName}}</view>
+							<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
+								<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
+							</view>
+							<view class="price">
+								<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
+								<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
+							</view>
+							<view class="tags2" v-if="item.tags2 && item.tags2.length > 0">
+								<view class="it" v-for="(it, idx) in item.tags2" :key="idx">{{it}}</view>
+							</view>
+							<view class="text">销量：{{item.soldNum}}</view>
+						</view>
+					</view>
+				</block>
+			</view>
+		</view>
+		
+		<view class="goods-row-list" v-show="showType == 2">
+			<block v-for="(item, index) in goodsList" :key='index'>
+				<view class="item" @tap="toGoodsDetail(item.goodsId)">
+					<view class="image">
+						<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
+						<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
+					</view>
+					<view class="right">
+						<view>
+							<view class="title ellipsis-2">{{item.goodsName}}</view>
+							<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
+								<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
+							</view>
+						</view>
+						<view>
+							<view class="bottom">
+								<view class="price">
+									<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
+									<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
+								</view>
+								<view class="text">销量：{{item.soldNum}}</view>
+							</view>
+						</view>
+					</view>
+				</view>
+			</block>
+		</view>
+		<no-data v-if="!goodsList.length" :showText="'暂无商品'"></no-data>
+		<loading-text v-if="goodsList.length"  :loading="loading" :noMore="noMore" ></loading-text>
+		
+		<!-- <drag-button :isDock="true" :customBar="true" ref="dragButton"></drag-button> -->
+	</view>
+</template>
+
+<script>
+	// import dragButton from '@/components/drag-button.vue';
+	
+	export default {
+		// components:{
+		// 	dragButton
+		// },
+		data() {
+			return {
+				screenType: '',
+				goodsList: [],
+				pageNum: 1,
+				pageSize: 8,
+				noMore: false,
+				loading: false,
+				showType: 1
+			}
+		},
+		
+		onShow() {
+			// this.$refs.dragButton.init();
+		},
+		
+		onLoad() {
+			this.getGoodsList();
+		},
+		
+		// 下拉刷新
+		onPullDownRefresh() {
+			this.pageNum = 1;
+			this.getGoodsList();
+		},
+		
+		// 上拉加载
+		onReachBottom() {
+			this.getGoodsList(1);
+		},
+		
+		methods: {
+			// 切换筛选类型
+			changeScreen(type) {
+				if(type != 2) {
+					if(this.screenType !== type) {
+						this.screenType = type;
+					}else {
+						this.screenType = '';
+					}
+				}else {
+					if(this.screenType != 2 && this.screenType != 3) {
+						this.screenType = 2;
+					}else if(this.screenType == 2) {
+						this.screenType = 3;
+					}else {
+						this.screenType = '';
+					}
+				}
+				this.pageNum = 1;
+				this.getGoodsList();
+			},
+			
+			// 获取商品列表
+			getGoodsList(loadMore) {
+				if(this.noMore && loadMore)return;
+				this.noMore = false
+				if(!loadMore){
+					this.pageNum = 1;
+				}else{
+					this.loading = true;
+				}
+				this.$axios({
+					url: '/goods/list/sort/page',
+					method: 'get',
+					params: {
+						pageNum: this.pageNum,
+						pageSize: this.pageSize,
+						categoryId: '',
+						sort: this.screenType
+					},
+					isLoading: !loadMore
+				}).then(res => {
+					res.data.records.forEach(item => {
+						if(item.logo && item.logoStartTime) {
+							item.isShowWater = this.$compareTime(item.logoStartTime, item.logoEndTime);
+						}else {
+							item.isShowWater = false;
+						}
+					})
+					let _list = res.data.records;
+					let pageTotal = res.data.pages;
+					if(this.pageNum >= pageTotal){
+						this.noMore = true;
+					}
+					if (_list.length) {
+						this.pageNum += 1
+					}
+					if (loadMore) {
+						this.goodsList = this.goodsList.concat(_list);
+						this.loading = false;
+					} else {
+						this.goodsList = _list;
+					}
+					
+					uni.stopPullDownRefresh();
+				})
+			},
+			
+			toGoodsDetail(id) {
+				uni.navigateTo({
+					url: '/packageGoods/pages/detail?id=' + id
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		padding-top: 88rpx;
+		box-sizing: border-box;
+	}
+	.top-container {
+		position: fixed;
+		top: 0;
+		left: 0;
+		width: 100%;
+		background: #FFFFFF;
+		display: flex;
+		padding: 0 20rpx;
+		align-items: center;
+		box-sizing: border-box;
+		.tab {
+			flex: 1;
+			display: flex;
+			padding: 0 80rpx 0 30rpx;
+			box-sizing: border-box;
+			justify-content: space-between;
+			.item {
+				height: 88rpx;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				font-size: 30rpx;
+				color: #666666;
+				&.current {
+					color: #FF3F42;
+				}
+				image {
+					width: 18rpx;
+					height: 30rpx;
+					display: block;
+					margin-left: 10rpx;
+				}
+			}
+		}
+		.icon {
+			padding-right: 10rpx;
+			image {
+				width: 36rpx;
+				height: 36rpx;
+				display: block;
+			}
+		}
+	}
+	
+</style>

pages/index/components/home-page-a.vue

@@ -1,1553 +1,1553 @@
-<template>
-	<view class="home-container">
-		
-		<block v-show="isLoaded">
-			<custom :bgColor="'bg-them'" :backColor="'#FFFFFF'" :isBack="false" v-show="scrollTop > 100">
-				<text slot="content" style="color: #FFFFFF; font-size: 36rpx;">{{configInfo.minAppName}}</text>
-			</custom>
-			
-			<view class="top-container">
-				<image src="@/static/home/top_bg.png" mode="widthFix" class="bg"></image>
-				
-				<view class="content">
-					<view class="title" :style="cuStyle">{{configInfo.minAppName}}</view>
-					
-					<view class="search">
-						<image src="/static/icon/search.png" class=""></image>
-						<input type="text" confirm-type="search" placeholder="搜索商品名称或型号" v-model="keyword" @confirm="searchSubmit">
-					</view>
-				</view>
-			</view>
-			
-			<view class="classify-container">
-				<view class="content">
-					<block v-for="(item, index) in classifyList" :key='index'>
-						<view class="item" @tap="toClassifyLst(item.categoryId)">
-							<image :src="item.imgUrl" mode="aspectFill"></image>
-							<text class="ellipsis">{{item.name}}</text>
-						</view>
-					</block>
-					<view class="item" @tap="toClassifyLst(0)">
-						<image src="@/static/home/class_more.png" mode="aspectFill"></image>
-						<text>更多分类</text>
-					</view>
-				</view>
-			</view>
-			
-			<view class="swiper-container" v-if="isShow_banner && bannerList.length > 0">
-				<swiper @change="changeBanner" :autoplay="true">
-					<block v-for="(item, index) in bannerList" :key='index'>
-						<swiper-item>
-							<image :src="item.imgSrc" mode="aspectFill" @tap="toMiniProgram(item.appId, item.linkUrl)" v-if="item.type === 2"></image>
-							<image :src="item.imgSrc" mode="aspectFill" @tap="toActivityList(item.goodsId)" v-if="item.type === 3"></image>
-							<image :src="item.imgSrc" mode="aspectFill" @tap="toGoodsDetail(item.goodsId)" v-else></image>
-						</swiper-item>
-					</block>
-				</swiper>
-				<view class="dots-conatiner">
-					<view class="con" :style="'width:'+(bannerList.length * 20)+'rpx;'" >
-						<view class="dot" :style=" 'transform:translateX('+ (bannerCurrent * 100) +'%)' "  ></view>
-					</view>
-				</view>
-			</view>
-			
-			<view class="notice-container" v-if="isShow_notice && noticeList.length > 0 && userInfo.type === 'SERVICE'">
-				<view class="content">
-					<view class="left">
-						<image src="@/static/home/notice.png" ></image>
-					</view>
-					<swiper class="swiper" :autoplay="true" :vertical="true" :circular="true" :disable-touch="true">
-						<block v-for="(item,index) in noticeList" :key='index' >
-							<swiper-item @touchmove.stop='stopTouchMove'>
-								<view class="ellipsis">{{item.workUserName}}成功分享商城，获得收益{{item.amount}}元</view>
-							</swiper-item>
-						</block>
-					</swiper>
-				</view>
-			</view>
-			
-			<view class="coupon-container" v-if="isShow_coupon && couponList.length > 0">
-				<image src="@/static/home/cp_bg1.png" mode="widthFix" class="bg" v-if="couponList.length == 1"></image>
-				<image src="@/static/home/cp_bg2.png" mode="widthFix" class="bg" v-if="couponList.length > 1"></image>
-				
-				<view class="list list1" v-if="couponList.length == 1">
-					<block v-for="(item, index) in couponList" :key='index'>
-						<view class="item" @tap="handleCoupon(item)">
-							<image class="cp" src="@/static/home/coupon_bg1.png"></image>
-							<view class="content">
-								<view class="left">
-									<view class="price">¥{{item.couponValue}}</view>
-									<view class="text" v-if="item.couponType == 'SATISFY'">满{{item.orderAmount}}可用</view>
-								</view>
-								<view class="right">
-									<view class="main">
-										<view class="row1 ellipsis-2">{{item.couponName}}</view>
-										<view class="row2">
-											<view class="date" v-if="item.obtainType == 0 || item.obtainType == 1">
-												<view>领取时间：</view>
-												<view>{{item.obtainStartTime | dateToYYmmdd2}}-{{item.obtainEndTime | dateToYYmmdd2}}</view>
-											</view>
-											<view class="date" v-if="item.obtainType == 2">
-												<view>使用时间：</view>
-												<view>{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}</view>
-											</view>
-											<view class="button gary" v-if="item.obtainType == 0">待开始</view>
-											<view class="button red" v-if="item.obtainType == 1">立即领取</view>
-											<view class="button white" v-if="item.obtainType == 2">去使用</view>
-										</view>
-									</view>
-								</view>
-							</view>
-						</view>
-					</block>
-				</view>
-				
-				<view class="list list2" v-if="couponList.length == 2">
-					<block v-for="(item, index) in couponList" :key='index'>
-						<view class="item" @tap="handleCoupon(item)">
-							<image class="cp" src="@/static/home/coupon_bg2.png"></image>
-							<view class="content">
-								<view class="top">
-									<view class="price">¥{{item.couponValue}}</view>
-									<view class="text">满{{item.orderAmount}}可用</view>
-								</view>
-								<view class="bottom">
-									<view class="name ellipsis">{{item.couponName}}</view>
-									<view class="date ellipsis" v-if="item.obtainType == 0 || item.obtainType == 1">领取时间：{{item.obtainStartTime | dateToYYmmdd2}}-{{item.obtainEndTime | dateToYYmmdd2}}</view>
-									<view class="date ellipsis" v-if="item.obtainType == 2">使用时间：{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}</view>
-									<view class="button gary" v-if="item.obtainType == 0">待开始</view>
-									<view class="button red" v-if="item.obtainType == 1">立即领取</view>
-									<view class="button white" v-if="item.obtainType == 2">去使用</view>
-								</view>
-							</view>
-						</view>
-					</block>
-				</view>
-				
-				<view class="list list3" v-if="couponList.length > 2">
-					<view class="left">
-						<block v-for="(item, index) in couponList" :key='index'>
-							<view class="item" @tap="handleCoupon(item)">
-								<image class="cp" src="@/static/home/coupon_bg3.png"></image>
-								<view class="content">
-									<view class="top">
-										<view class="price">¥{{item.couponValue}}</view>
-										<view class="text">满{{item.orderAmount}}可用</view>
-									</view>
-									<view class="bottom">
-										<view class="name ellipsis">{{item.couponName}}</view>
-										<view class="date ellipsis" v-if="item.obtainType == 0 || item.obtainType == 1">领取时间：{{item.obtainStartTime | dateToYYmmdd2}}-{{item.obtainEndTime | dateToYYmmdd2}}</view>
-										<view class="date ellipsis" v-if="item.obtainType == 2">使用时间：{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}</view>
-										<view class="button gary" v-if="item.obtainType == 0">待开始</view>
-										<view class="button red" v-if="item.obtainType == 1">立即领取</view>
-										<view class="button white" v-if="item.obtainType == 2">去使用</view>
-									</view>
-								</view>
-							</view>
-						</block>
-					</view>
-					<view class="right">
-						<view class="text" @tap="toReceiveCoupon">
-							<text>查</text>
-							<text>看</text>
-							<text>更</text>
-							<text>多</text>
-							<image src="@/static/home/cp_more.png"></image>
-						</view>
-					</view>
-				</view>
-			</view>
-			
-			<view class="myManager-container" v-if="isShow_manager && myManagerDetail && !userInfo.promotionGroupLeader && !userInfo.type === 'SERVICE'">
-				<view class="content">
-					<view class="left">
-						<image :src="myManagerDetail.avatar" mode="aspectFill" v-if="myManagerDetail.avatar.indexOf('http') >= 0"></image>
-						<image :src="imageUrl + myManagerDetail.avatar" mode="aspectFill" v-else></image>
-						<view class="main">
-							<view>客户经理：{{myManagerDetail.workName}}</view>
-							<view>{{myManagerDetail.workPhone}}</view>
-						</view>
-					</view>
-					<view class="right" @tap="callPhone(myManagerDetail.workPhone)">拨打电话</view>
-				</view>
-			</view>
-			
-			<view class="seckill-container" v-if="isShow_seckill && seckillTimeList.length > 0">
-				<image src="@/static/home/seckill_bg.png" mode="widthFix" class="bg"></image>
-				
-				<view class="content">
-					<view class="time-list">
-						<block v-for="(item, index) in seckillTimeList" :key='index'>
-							<view class="item" :class="seckillTimeCurrent == index ? 'current':''" @tap="changeSeckillTime(index)">
-								<view class="time">{{item.startHour}}:00</view>
-								<view class="tag" v-if="item.type == 'yjs'">已结束</view>
-								<view class="tag" v-if="item.type == 'jxz'">{{countdownTime}}</view>
-								<view class="tag" v-if="item.type == 'wks'">即将开始</view>
-							</view>
-						</block>
-					</view>
-					<view class="product-list">
-						<block v-for="(item, index) in seckillGoodsList" :key='index'>
-							<div class="item" @tap="toSeckillGoodsDetail(item.goodsId)">
-								<image :src="item.imgUrl" mode="aspectFill"></image>
-								<view class="right">
-									<view class="title ellipsis-2">{{item.goodsName}}</view>
-									<view class="des ellipsis-2">{{item.describeText ? item.describeText : ''}}</view>
-									<view class="stock-sales">
-										<view class="stock">
-											<text>剩余{{item.secStockNum}}件</text>
-											<view class="progress-box">
-												<!-- 库存 / 总数 * 100 = 剩余百分比 -->
-												<progress :percent="item.secStockNum / item.limitBuy * 100" activeColor="#FF3F42" active stroke-width="6" />
-											</view>
-										</view>
-										<view class="sales">销量：{{item.salesVolume}}</view>
-									</view>
-									<view class="bottom">
-										<view class="price">
-											<view class="price-1">¥{{item.price | numToFixed}}</view>
-											<view class="price-2">¥{{item.goodsPrice | numToFixed}}</view>
-										</view>
-										<view class="btn" v-if="seckillTimeList[seckillTimeCurrent].type == 'jxz'">马上抢</view>
-										<view class="btn2" v-else>马上抢</view>
-									</view>
-								</view>
-							</div>
-						</block>
-					</view>
-					<view class="loadmore" v-if="!seckillGoodsNoMore" @tap="loadMoreSeckillGoods">点击加载更多商品</view>
-				</view>
-			</view>
-			
-			<view class="recom-container" v-if="isShow_recom">
-				<view class="top">
-					<view class="title"><image src="@/static/home/recom.png"></image></view>
-					<scroll-view
-						:scroll-x="true"
-						:scroll-left="scrollLeft"
-						scroll-with-animation
-						:show-scrollbar="false"
-						class="tabs-view"
-						ref="tabs-view">
-						<view class="tab">
-							<block v-for="(item, index) in tabList" :key='index'>
-								<view class="item" :ref="`tabs-item-${index}`" :class="[`tabs-item-${index}`, item.categoryId == tabCurrent ? 'current':'']" @tap="changeTab(item.categoryId)">{{item.name}}</view>
-							</block>
-						</view>
-					</scroll-view>
-				</view>
-				<view class="list">
-					<block v-for="(item, index) in recomList" :key='index'>
-						<view class="item" @tap="toGoodsDetail(item.goodsId)">
-							<view class="image">
-								<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
-								<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
-							</view>
-							<view class="content">
-								<view class="title ellipsis-2">{{item.goodsName}}</view>
-								<view class="bottom">
-									<view class="price">
-										<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
-										<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
-									</view>
-									<view class="btn"><image src="@/static/icon/cart.png" mode="aspectFill"></image></view>
-								</view>
-							</view>
-						</view>
-					</block>
-				</view>
-				<no-data v-if="!recomList.length" :showText="'暂无商品'"></no-data>
-			</view>
-			
-		</block>
-	</view>
-</template>
-
-<script>
-	import {mapState} from 'vuex';
-	
-	export default {
-		props:{
-			homePage: {
-				type: Number,
-				default: 0
-			},
-			templateInfo: {
-				type: Object,
-				default: {}
-			}
-		},
-		data() {
-			return {
-				thisHomePage: 1, // 当前首页页面模版
-				
-				imageUrl: this.$imageUrl,
-				configInfo: uni.getStorageSync('configInfo'),
-				isShow_banner: false,
-				isShow_notice: false,
-				isShow_classify: false,
-				isShow_seckill: false,
-				isShow_coupon: false,
-				isShow_manager: false,
-				isShow_recom: false,
-				
-				scrollTop: 0, // 滚动高度（用于控制自定义导航）
-				keyword: '', // 搜索关键词
-				classifyList: [], // 分类列表
-				bannerList: [], // 轮播图列表
-				bannerCurrent: 0, // 轮播图当前值
-				noticeList: [],
-				couponList: [], // 可领取优惠券列表
-				myManagerDetail: null, // 我的客户经理信息
-				seckillTimeList: [], // 秒杀时间段列表
-				seckillTimeCurrent: 0, // 秒杀时间段选择
-				seckillGoodsList: [], // 秒杀商品列表
-				seckillGoodsPage: 1, // 秒杀商品分页
-				seckillGoodsNoMore: false, // 
-				countdownTime: '', // 倒计时
-				endDatetime: '', // 倒计时结束时间
-				nowDate: null, // 当前时间
-				dateInterval: null, // 时间定时器
-				tabList: [], // 好物推荐分类列表
-				tabCurrent: 1, // 好物推荐分类当前值
-				recomList: [], // 好物推荐列表
-				
-				isLoaded_banner: false,
-				isLoaded_coupon: false,
-				isLoaded_seckill: false,
-				isLoaded_tab: false,
-				isLoaded_myManager: false,
-				
-				scrollLeft: 50,
-				scrollViewWidth: 0,
-				tabsRect: {
-					left: 0
-				},
-			}
-		},
-		computed:{
-			cuStyle(){
-				return `height:${this.CustomBar-this.StatusBar}px; padding-top:${this.StatusBar}px;`
-			},
-			...mapState(['userInfo', 'isLogin', 'userId']),
-			isLoaded() {
-				uni.hideLoading();
-				return (!this.isShow_banner || (this.isShow_banner && this.isLoaded_banner))
-					&& (!this.isShow_coupon || (this.isShow_coupon && this.isLoaded_coupon))
-					&& (!this.isShow_seckill || (this.isShow_seckill && this.isLoaded_seckill))
-					&& (!this.isShow_classify || (this.isShow_classify && this.isLoaded_tab))
-					&& (!this.isShow_manager || (this.isShow_manager && this.isLoaded_myManager))
-			}
-		},
-		watch: {
-			nowDate() {
-				let hh = this.nowDate.getHours(),
-					mm = this.nowDate.getMinutes(),
-					ss = this.nowDate.getSeconds();
-				let hs = [10, 12, 15, 18, 20];
-				if(mm == 0 && ss == 0 && hs.indexOf(hh) >= 0) {
-					setTimeout(() => {
-						this.getSeckillTimeList();
-					}, 1000)
-				}
-			},
-			tabList() {
-				this.$nextTick(() => {
-					this.resize()
-				})
-			},
-			templateInfo: {
-				handler(newValue, oldValue) {
-					const templateInfo = this.templateInfo;
-					this.isShow_banner = templateInfo.carouseStatus;
-					this.isShow_classify = templateInfo.categoryStatus;
-					this.isShow_seckill = templateInfo.killStatus;
-					this.isShow_coupon = templateInfo.couponStatus;
-					this.isShow_manager = templateInfo.customerStatus;
-					this.isShow_notice = templateInfo.notiveStatus;
-					this.isShow_recom = templateInfo.okStatus;
-				},
-				immediate: true,
-				deep: true
-			}
-		},
-		mounted() {
-			uni.$on('onPageScroll', (data) => {
-				if(this.homePage !== this.thisHomePage) return false;
-				
-				this.scrollTop = data;
-			});
-			
-			uni.$on('onPullDownRefresh', (data) => {
-				if(this.homePage !== this.thisHomePage) return false;
-				
-				this.keyword = '';
-				this.getTabList();
-				this.getBannerList();
-				this.getNoticeList();
-				this.getCouponList();
-				this.getMyManager();
-				this.getSeckillTimeList();
-			});
-			
-			uni.$on('onShow', (data) => {
-				if(this.homePage !== this.thisHomePage) return false;
-				
-				console.log('onShow page ' + this.thisHomePage);
-				this.keyword = '';
-				this.getTabList();
-				this.getBannerList();
-				this.getNoticeList();
-				this.getCouponList();
-				this.getMyManager();
-				this.getSeckillTimeList();
-				
-				this.dateInterval = setInterval(() => {
-				   this.nowDate = new Date();
-				}, 1000)
-			});
-			
-			uni.$on('onHide', (data) => {
-				if(this.homePage !== this.thisHomePage) return false;
-				
-				clearInterval(this.dateInterval);
-			})
-		},
-		methods: {
-			// 搜索商品
-			searchSubmit() {
-				uni.navigateTo({
-					url: '/packageGoods/pages/search?keyword=' + this.keyword
-				})
-			},
-			
-			// 获取一级菜单
-			getTabList() {
-				this.$axios({
-					url: '/goods/category/list',
-					method: 'get',
-					params: {}
-				}).then(res => {
-					this.tabList = res.data;
-					this.classifyList = res.data.slice(0, 9);
-					this.tabCurrent = res.data.length > 0 ? res.data[0].categoryId : 0;
-					this.getRecomList();
-					
-					uni.stopPullDownRefresh();
-				}).finally(res => {
-					this.isLoaded_tab = true;
-				})
-			},
-			
-			// 去分类列表
-			toClassifyLst(categoryId) {
-				uni.setStorageSync('categoryId', categoryId);
-				uni.switchTab({
-					url:'/pages/goods/classify'
-				})
-			},
-			
-			// 获取轮播图列表
-			getBannerList() {
-				this.$axios({
-					url: '/common/list/page',
-					method: 'get',
-					params: {
-						pageNum: 1,
-						pageSize: 10,
-						state: true
-					}
-				}).then(res => {
-					this.bannerList = res.data.records;
-				}).finally(res => {
-					this.isLoaded_banner = true;
-					uni.stopPullDownRefresh();
-				})
-			},
-			
-			// 切换广告图
-			changeBanner(e) {
-				this.bannerCurrent = e.detail.current;
-			},
-			
-			// 获取公告列表
-			getNoticeList() {
-				this.$axios({
-					url: '/renovation/settle/list',
-					method: 'get',
-					params: {
-						
-					}
-				}).then(res => {
-					if(res.data) {
-						res.data.forEach(item => {
-							item.workUserName = item.workUserName.slice(0, 1) + '师傅';
-						})
-						this.noticeList = res.data;
-					}
-				})
-			},
-			
-			// 获取可领优惠券列表
-			getCouponList() {
-				this.$axios({
-					url: '/coupon/list/all',
-					method: 'get',
-					params: {
-						userId: this.userId
-					}
-				}).then(res => {
-					this.couponList = res.data;
-				}).finally(res => {
-					this.isLoaded_coupon = true;
-				})
-			},
-			
-			// 处理优惠券
-			handleCoupon(item) {
-				if(item.obtainType == 0) {
-					return this.$toast('该优惠券不可领取');
-				}else if(item.obtainType == 1) {
-					this.$axios({
-						url: '/coupon/obtain',
-						method: 'get',
-						params: {
-							userId: this.userId,
-							couponId: item.couponId
-						}
-					}).then(res => {
-						this.$successToast('领取成功');
-						this.getCouponList();
-					})
-				}else if(item.obtainType == 2) {
-					uni.switchTab({
-					    url: '/pages/goods/classify'
-					});
-				}
-			},
-			
-			// 去可领取优惠券
-			toReceiveCoupon() {
-				uni.navigateTo({
-					url:'/pages/index/coupon'
-				})
-			},
-			
-			// 获取我的客户经理
-			getMyManager() {
-				this.$axios({
-					url: '/user/parent',
-					method: 'get',
-					params: {
-						userId: this.userId
-					}
-				}).then(res => {
-					if(res.data) {
-						this.myManagerDetail = res.data;
-					}
-				}).finally(res => {
-					this.isLoaded_myManager = true;
-				})
-			},
-			
-			// 拨打电话
-			callPhone(val) {
-				uni.makePhoneCall({
-				    phoneNumber: val
-				});
-			},
-			
-			findElem(array, attr, val) {
-			    for (var i = 0; i < array.length; i++) {
-			        if (array[i][attr] == val) {
-			            return i; //返回当前索引值
-			        }
-			    }
-			    return -1;
-			},
-			
-			// 计算倒计时
-			countTime() {
-				let endDatetime = this.endDatetime.replace(/\-/g, '/');
-				// console.log(endDatetime)
-			    var nowtime = new Date(),  //获取当前时间
-			        endtime = new Date(endDatetime);  //定义结束时间
-			    var lefttime = endtime.getTime() - nowtime.getTime(),  //距离结束时间的毫秒数
-			        hh = Math.floor(lefttime/(1000*60*60)),  //计算小时数
-			        mm = Math.floor(lefttime/(1000*60)%60),  //计算分钟数
-			        ss = Math.floor(lefttime/1000%60);  //计算秒数
-				// console.log(new Date(endDatetime))
-				function checkTime(i){
-					if (i<10) {
-						i = "0"+i;
-					}
-					return i;
-				}
-				setTimeout(() => {
-					this.countTime();
-				}, 1000);
-				this.countdownTime = checkTime(hh) + ":" + checkTime(mm) + ":" + checkTime(ss);
-				// console.log(this.countdownTime)
-			},
-			
-			// 获取秒杀时间列表
-			getSeckillTimeList() {
-				this.$axios({
-					url: '/goods/sec/time',
-					method: 'get',
-					params: {}
-				}).then(res => {
-					if(res.data.length < 1) {return false;}
-					this.seckillTimeList = res.data;
-					this.seckillTimeCurrent = this.findElem(this.seckillTimeList, 'type', 'jxz');
-					if(this.seckillTimeCurrent == -1) {
-						this.seckillTimeCurrent = 0;
-						this.getSeckillGoodsList();
-					}else {
-						this.endDatetime = this.seckillTimeList[this.seckillTimeCurrent].endDatetime;
-						this.countTime();
-						this.getSeckillGoodsList();
-					}
-				}).finally(res => {
-					this.isLoaded_seckill = true;
-				})
-			},
-			
-			// 切换秒杀时间
-			changeSeckillTime(index) {
-				this.seckillTimeCurrent = index;
-				this.getSeckillGoodsList();
-			},
-			
-			// 获取秒杀商品列表
-			getSeckillGoodsList(loadMore) {
-				if(this.seckillGoodsNoMore && loadMore)return;
-				if(!loadMore) {
-					this.seckillGoodsNoMore = false;
-					this.seckillGoodsPage = 1;
-				}
-				let secKillId = this.seckillTimeList[this.seckillTimeCurrent].secKillId;
-				this.$axios({
-					url: '/goods/sec/goods/list',
-					method: 'get',
-					params: {
-						pageNum: this.seckillGoodsPage,
-						pageSize: 5,
-						secKillId: secKillId,
-					}
-				}).then(res => {
-					let _list = res.data.records;
-					let pageTotal = res.data.pages;
-					if(this.seckillGoodsPage >= pageTotal){
-						this.seckillGoodsNoMore = true;
-					}
-					if (_list.length) {
-						this.seckillGoodsPage += 1;
-					}
-					if (loadMore) {
-						this.seckillGoodsList = this.seckillGoodsList.concat(_list);
-					} else {
-						this.seckillGoodsList = _list;
-					}
-				})
-			},
-			
-			// 加载更多秒杀商品
-			loadMoreSeckillGoods() {
-				this.getSeckillGoodsList(true);
-			},
-			
-			// 进入秒杀商品详情
-			toSeckillGoodsDetail(id) {
-				if(!id) {
-					return false;
-				}
-				if(this.seckillTimeList[this.seckillTimeCurrent].type == 'wks') {
-					return this.$toast('活动未开始');
-				}
-				if(this.seckillTimeList[this.seckillTimeCurrent].type == 'yjs') {
-					return this.$toast('活动已结束');
-				}
-				uni.navigateTo({
-					url: '/packageGoods/pages/detail?id=' + id
-				})
-			},
-			
-			// 切换一级菜单
-			changeTab(current) {
-				this.tabCurrent = current;
-				this.getRecomList();
-				this.resize();
-			},
-			
-			// 获取好物推荐商品列表
-			getRecomList() {
-				this.$axios({
-					url: '/goods/list/level1',
-					method: 'get',
-					params: {
-						pageNum: 1,
-						pageSize: 6,
-						categoryId: this.tabCurrent,
-					},
-				}).then(res => {
-					res.data.records.forEach(item => {
-						if(item.logo && item.logoStartTime) {
-							item.isShowWater = this.$compareTime(item.logoStartTime, item.logoEndTime);
-						}else {
-							item.isShowWater = false;
-						}
-					})
-					this.recomList = res.data.records;
-				})
-			},
-			
-			// 进入商品详情
-			toGoodsDetail(id) {
-				if(!id) {
-					return false;
-				}
-				uni.navigateTo({
-					url: '/packageGoods/pages/detail?id=' + id
-				})
-			},
-			
-			// 跳转小程序
-			toMiniProgram(appId, path) {
-				wx.navigateToMiniProgram({
-					appId,
-					path,
-					extraData: {},
-					envVersion: 'release',
-					success(res) {}
-				});
-			},
-			
-			// 进入活动列表
-			toActivityList(type) {
-				uni.navigateTo({
-					url: '/packageGoods/pages/activity?type=' + type
-				})
-			},
-			
-			setScrollLeft() {
-				// 当前活动tab的布局信息，有tab菜单的width和left(为元素左边界到父元素左边界的距离)等信息
-				const index = this.findElem(this.tabList, 'categoryId', this.tabCurrent);
-				const tabRect = this.tabList[index]
-				// 累加得到当前item到左边的距离
-				const offsetLeft = this.tabList
-					.slice(0, index)
-					.reduce((total, curr) => {
-						return total + curr.rect.width
-					}, 0)
-				// 此处为屏幕宽度
-				const res = uni.getSystemInfoSync();
-				const windowWidth = res.windowWidth;
-				// 将活动的tabs-item移动到屏幕正中间，实际上是对scroll-view的移动
-				let scrollLeft = offsetLeft - (this.tabsRect.width - tabRect.rect.width) / 2 - (windowWidth - this.tabsRect.right) / 2 + this.tabsRect.left / 2
-				
-				// 这里做一个限制，限制scrollLeft的最大值为整个scroll-view宽度减去tabs组件的宽度
-				scrollLeft = Math.min(scrollLeft, this.scrollViewWidth - this.tabsRect.width)
-				this.scrollLeft = Math.max(0, scrollLeft)
-			},
-			// 获取所有标签的尺寸
-			resize() {
-				// 如果不存在list，则不处理
-				if(this.tabList.length === 0) {
-					return
-				}
-				Promise.all([this.getTabsRect(), this.getAllItemRect()]).then(([tabsRect, itemRect = []]) => {
-					this.tabsRect = tabsRect
-					this.scrollViewWidth = 0
-					itemRect.map((item, index) => {
-						// 计算scroll-view的宽度，这里
-						this.scrollViewWidth += item.width
-						// 另外计算每一个item的中心点X轴坐标
-						this.tabList[index].rect = item
-					})
-					// 获取了tabs的尺寸之后，设置滑块的位置
-					this.setScrollLeft()
-				})
-			},
-			// 获取导航菜单的尺寸
-			getTabsRect() {
-				return new Promise(resolve => {
-					this.queryRect('tabs-view').then(size => resolve(size))
-				})
-			},
-			// 获取所有标签的尺寸
-			getAllItemRect() {
-				return new Promise(resolve => {
-					const promiseAllArr = this.tabList.map((item, index) => this.queryRect(
-						`tabs-item-${index}`, true))
-					Promise.all(promiseAllArr).then(sizes => resolve(sizes))
-				})
-			},
-			// 获取各个标签的尺寸
-			queryRect(el, item) {
-				const query = uni.createSelectorQuery().in(this);
-				return new Promise(resolve => {
-					query.select(`.${el}`).boundingClientRect(data => {
-						resolve(data)
-					}).exec();
-				})
-			},
-		}
-	}
-</script>
-
-<style lang="scss" scoped>
-	.top-container {
-		position: relative;
-		.bg {
-			display: block;
-			width: 750rpx;
-			position: absolute;
-			top: 0;
-			z-index: 0;
-		}
-		.content {
-			width: 710rpx;
-			padding: 0 20rpx;
-			position: relative;
-			z-index: 1;
-		}
-		.title {
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			color: #FFFFFF;
-			font-size: 36rpx;
-		}
-		.search {
-			background: #FFFFFF;
-			height: 64rpx;
-			display: flex;
-			align-items: center;
-			border-radius: 64rpx;
-			padding: 0 20rpx;
-			margin-top: 20rpx;
-			image {
-				width: 28rpx;
-				height: 28rpx;
-			}
-			input {
-				width: 100%;
-				padding-left: 15rpx;
-			}
-		}
-	}
-	.classify-container {
-		margin-top: 40rpx;
-		position: relative;
-		z-index: 1;
-		padding: 0 20rpx;
-		.content {
-			border-radius: 20rpx;
-			padding-top: 30rpx;
-			display: flex;
-			flex-wrap: wrap;
-			background: #FFFFFF;
-			.item {
-				display: flex;
-				flex-direction: column;
-				align-items: center;
-				width: 142rpx;
-				margin-bottom: 30rpx;
-				image {
-					width: 78rpx;
-					height: 78rpx;
-					display: block;
-					border-radius: 50%;
-					overflow: hidden;
-				}
-				text {
-					font-size: 24rpx;
-					color: #666666;
-					margin-top: 10rpx;
-					width: 150rpx;
-					text-align: center;
-				}
-			}
-		}
-	}
-	.swiper-container {
-		position: relative;
-		margin-top: 20rpx;
-		swiper {
-			height: 350rpx;
-		}
-		image {
-			height: 350rpx;
-			width: 710rpx;
-			display: block;
-			margin: 0 auto 0;
-			border-radius: 15rpx;
-			overflow: hidden;
-		}
-		.dots-conatiner {
-			position: absolute;
-			width: 100%;
-			bottom: 40rpx;
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			.con {
-				border-radius: 4rpx;
-				overflow: hidden;
-				height: 4rpx;
-				background-color: rgba($color: #FFFFFF, $alpha: 0.3);
-			}
-			.dot {
-				width: 20rpx;
-				height: 4rpx;
-				background-color: #FFFFFF;
-				transition: all .3s;
-			}
-		}
-	}
-	.notice-container {
-		padding: 0 20rpx;
-		margin-top: 20rpx;
-		.content {
-			display: flex;
-			align-items: center;
-			height: 100rpx;
-			background: #FFFFFF;
-			border-radius: 20rpx;
-		}
-		.left{
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			width: 96rpx;
-			height: 48rpx;
-			margin-right: 20rpx;
-			border-right: 2rpx solid #E5E5E5;
-			image {
-				width: 60rpx;
-				height: 30rpx;
-				display: block;
-			}
-		}
-		.swiper{
-			height: 100rpx;
-			flex: 1;
-			padding-right: 20rpx;
-			::v-deep swiper-item {
-				display: block;
-				height: 100rpx;
-				width: 100%;
-				line-height: 100rpx;
-			}
-		}
-	}
-	.coupon-container {
-		position: relative;
-		margin-top: 20rpx;
-		padding: 0 20rpx;
-		.bg {
-			display: block;
-			width: 100%;
-		}
-		.list {
-			position: absolute;
-			top: 80rpx;
-			z-index: 1;
-		}
-		.list1 {
-			.item {
-				position: relative;
-				margin-bottom: 20rpx;
-				margin-left: 16rpx;
-				.cp {
-					width: 688rpx;
-					height: 178rpx;
-					display: block;
-				}
-				.content {
-					position: absolute;
-					left: 0;
-					top: 0;
-					width: 710rpx;
-					height: 160rpx;
-					display: flex;
-					align-items: center;
-					.left {
-						width: 210rpx;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						flex-direction: column;
-						.price {
-							font-size: 48rpx;
-							color: #FFFFFF;
-						}
-						.text {
-							color: #FFFFFF;
-							font-size: 28rpx;
-						}
-					}
-					.right {
-						display: flex;
-						align-items: center;
-						justify-content: space-between;
-						padding: 0 20rpx;
-						width: 470rpx;
-						height: 150rpx;
-						box-sizing: border-box;
-						.main {
-							width: 430rpx;
-							height: 150rpx;
-							padding: 16rpx 0 8rpx;
-							box-sizing: border-box;
-							display: flex;
-							flex-direction: column;
-							justify-content: space-between;
-							.row1 {
-								font-size: 28rpx;
-								line-height: 32rpx;
-								height: 64rpx;
-							}
-							.row2 {
-								font-size: 24rpx;
-								line-height: 28rpx;
-								color: #999999;
-								display: flex;
-								justify-content: space-between;
-								align-items: center;
-							}
-						}
-					}
-				}
-			}
-		}
-		.list2 {
-			display: flex;
-			.item {
-				position: relative;
-				margin-bottom: 20rpx;
-				&:first-child {
-					margin-left: 16rpx;
-				}
-				.cp {
-					width: 342rpx;
-					height: 308rpx;
-					display: block;
-				}
-				.content {
-					position: absolute;
-					left: 0;
-					top: 0;
-					width: 342rpx;
-					height: 328rpx;
-					display: flex;
-					flex-direction: column;
-					align-items: center;
-					.top {
-						width: 324rpx;
-						height: 130rpx;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						flex-direction: column;
-						.price {
-							font-size: 48rpx;
-							color: #FFFFFF;
-							line-height: 48rpx;
-							margin-top: 16rpx;
-						}
-						.text {
-							color: #FFFFFF;
-							font-size: 28rpx;
-							line-height: 28rpx;
-							margin-top: 10rpx;
-						}
-					}
-					.bottom {
-						width: 324rpx;
-						height: 160rpx;
-						padding: 16rpx;
-						box-sizing: border-box;
-						display: flex;
-						flex-direction: column;
-						justify-content: space-between;
-						align-items: center;
-						.name {
-							font-size: 28rpx;
-							text-align: left;
-							line-height: 32rpx;
-							width: 100%;
-						}
-						.date {
-							font-size: 24rpx;
-							color: #999999;
-							text-align: left;
-							width: 100%;
-							line-height: 28rpx;
-						}
-					}
-				}
-			}
-		}
-		.list3 {
-			display: flex;
-			align-items: center;
-			.left {
-				display: flex;
-				width: 630rpx;
-				overflow-x: scroll;
-			}
-			.right {
-				width: 80rpx;
-				display: flex;
-				justify-content: center;
-				.text {
-					width: 48rpx;
-					height: 200rpx;
-					border-radius: 48rpx;
-					background: #FFFFFF;
-					display: flex;
-					flex-direction: column;
-					align-items: center;
-					justify-content: center;
-					text {
-						font-size: 28rpx;
-						color: #FF3F42;
-						line-height: 32rpx;
-					}
-					image {
-						width: 32rpx;
-						height: 32rpx;
-						display: block;
-						flex-shrink: 0;
-						margin-top: 10rpx;
-					}
-				}
-			}
-			.item {
-				position: relative;
-				margin-bottom: 20rpx;
-				&:first-child {
-					margin-left: 16rpx;
-				}
-				.cp {
-					width: 278rpx;
-					height: 308rpx;
-					display: block;
-				}
-				.content {
-					position: absolute;
-					left: 0;
-					top: 0;
-					width: 278rpx;
-					height: 328rpx;
-					display: flex;
-					flex-direction: column;
-					align-items: center;
-					.top {
-						width: 260rpx;
-						height: 130rpx;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						flex-direction: column;
-						.price {
-							font-size: 48rpx;
-							color: #FFFFFF;
-							line-height: 48rpx;
-							margin-top: 16rpx;
-						}
-						.text {
-							color: #FFFFFF;
-							font-size: 28rpx;
-							line-height: 28rpx;
-							margin-top: 10rpx;
-						}
-					}
-					.bottom {
-						width: 260rpx;
-						height: 160rpx;
-						padding: 16rpx;
-						box-sizing: border-box;
-						display: flex;
-						flex-direction: column;
-						justify-content: space-between;
-						align-items: center;
-						.name {
-							font-size: 28rpx;
-							text-align: left;
-							line-height: 32rpx;
-							width: 100%;
-						}
-						.date {
-							font-size: 24rpx;
-							color: #999999;
-							text-align: left;
-							width: 100%;
-							line-height: 28rpx;
-						}
-					}
-				}
-			}
-		}
-		.button {
-			width: 120rpx;
-			height: 40rpx;
-			border-radius: 40rpx;
-			font-size: 24rpx;
-			flex-shrink: 0;
-			box-sizing: border-box;
-			display: flex;
-			justify-content: center;
-			align-items: center;
-			&.gary {
-				background: #AAAAAA;
-				color: #FFFFFF;
-				border: 1px solid #AAAAAA;
-			}
-			&.red {
-				background: #C434FF;
-				color: #FFFFFF;
-				border: 1px solid #C434FF;
-			}
-			&.white {
-				color: #FF3F42;
-				border: 1px solid #FF3F42;
-			}
-		}
-	}
-	.myManager-container {
-		padding: 0 20rpx;
-		.content {
-			display: flex;
-			justify-content: space-between;
-			align-items: center;
-			background: #FFFFFF;
-			border-radius: 20rpx;
-			padding: 20rpx;
-			.left {
-				display: flex;
-				align-items: center;
-				image {
-					width: 100rpx;
-					height: 100rpx;
-					border-radius: 50%;
-				}
-				.main {
-					font-size: 28rpx;
-					line-height: 48rpx;
-					margin-left: 20rpx;
-				}
-			}
-			.right {
-				width: 160rpx;
-				height: 60rpx;
-				line-height: 60rpx;
-				border-radius: 60rpx;
-				text-align: center;
-				font-size: 28rpx;
-				color: #E43B38;
-				border: 1px solid #E43B38;
-			}
-		}
-	}
-	.seckill-container {
-		position: relative;
-		margin-top: 20rpx;
-		min-height: 340rpx;
-		.bg {
-			display: block;
-			width: 750rpx;
-			position: absolute;
-			top: 0;
-			z-index: 0;
-		}
-		.content {
-			width: 710rpx;
-			padding: 0 20rpx;
-			position: relative;
-			z-index: 1;
-		}
-		.time-list {
-			display: flex;
-			overflow-x: scroll;
-			padding-top: 90rpx;
-			padding-bottom: 40rpx;
-			.item {
-				display: flex;
-				flex-direction: column;
-				align-items: center;
-				flex-shrink: 0;
-				width: 140rpx;
-				margin-right: 48rpx;
-				.time {
-					font-size: 32rpx;
-					color: #FFFFFF;
-				}
-				.tag {
-					width: 140rpx;
-					height: 44rpx;
-					border-radius: 44rpx;
-					border: 1px solid #FFFFFF;
-					font-size: 24rpx;
-					color: #FFFFFF;
-					box-sizing: border-box;
-					margin-top: 12rpx;
-					display: flex;
-					align-items: center;
-					justify-content: center;
-				}
-				&.current {
-					.tag {
-						background: #FFFFFF;
-						color: #FF3F42;
-					}
-				}
-			}
-		}
-		.product-list {
-			.item {
-				background: #FFFFFF;
-				border-radius: 10rpx;
-				display: flex;
-				padding: 20rpx;
-				margin-bottom: 20rpx;
-				image {
-					display: block;
-					width: 180rpx;
-					height: 180rpx;
-					flex-shrink: 0;
-				}
-				.right {
-					width: 490rpx;
-					box-sizing: border-box;
-					padding-left: 20rpx;
-					.title {
-						font-size: 30rpx;
-						color: #333333;
-						line-height: 36rpx;
-						font-weight: 600;
-					}
-					.des {
-						font-size: 24rpx;
-						line-height: 30rpx;
-						color: #999999;
-						margin-top: 6rpx;
-					}
-					.stock-sales {
-						display: flex;
-						justify-content: space-between;
-						align-items: center;
-						margin-top: 10rpx;
-						font-size: 24rpx;
-						color: #666666;
-						.stock {
-							display: flex;
-							align-items: center;
-							text {
-								font-size: 24rpx;
-								color: #666666;
-							}
-							.progress-box {
-								width: 140rpx;
-								border-radius: 6px;
-								overflow: hidden;
-								margin-left: 10rpx;
-							}
-						}
-					}
-					.bottom {
-						display: flex;
-						justify-content: space-between;
-						align-items: center;
-						margin-top: 10rpx;
-						.price {
-							display: flex;
-							flex-direction: column;
-						}
-						.price-1 {
-							font-size: 32rpx;
-							color: #FF3F42;
-							line-height: 36rpx;
-						}
-						.price-2 {
-							font-size: 26rpx;
-							color: #666666;
-							line-height: 30rpx;
-							text-decoration: line-through;
-						}
-						.btn {
-							width: 110rpx;
-							height: 44rpx;
-							background: #FF3F42;
-							border-radius: 5rpx;
-							font-size: 28rpx;
-							color: #FFFFFF;
-							text-align: center;
-							line-height: 44rpx;
-						}
-						.btn2 {
-							width: 110rpx;
-							height: 44rpx;
-							background: #AAAAAA;
-							border-radius: 5rpx;
-							font-size: 28rpx;
-							color: #FFFFFF;
-							text-align: center;
-							line-height: 44rpx;
-						}
-					}
-				}
-			}
-		}
-		.loadmore {
-			background: #FFFFFF;
-			border-radius: 10rpx;
-			display: flex;
-			justify-content: center;
-			align-items: center;
-			height: 88rpx;
-		}
-	}
-	.recom-container {
-		margin-top: 30rpx;
-		.top {
-			background: #FFFFFF;
-			padding: 30rpx 0 0;
-			.title {
-				display: flex;
-				align-items: center;
-				justify-content: center;
-				margin-bottom: 10rpx;
-				image {
-					width: 300rpx;
-					height: 40rpx;
-					display: block;
-				}
-			}
-			.tab {
-				display: flex;
-				margin-left: -10rpx;
-				.item {
-					display: flex;
-					flex-direction: column;
-					align-items: center;
-					flex-shrink: 0;
-					font-size: 28rpx;
-					color: #666666;
-					height: 80rpx;
-					line-height: 80rpx;
-					position: relative;
-					padding: 0 30rpx;
-					&.current {
-						color: #FF3F42;
-						font-weight: 600;
-						&::after {
-							content: '';
-							display: block;
-							width: 50rpx;
-							height: 6rpx;
-							background: #FF3F42;
-							position: absolute;
-							bottom: 0;
-							left: 50%;
-							margin-left: -25rpx;
-						}
-					}
-				}
-			}
-		}
-		.list {
-			display: flex;
-			flex-wrap: wrap;
-			padding: 20rpx;
-			.item {
-				width: 348rpx;
-				background: #FFFFFF;
-				margin-right: 14rpx;
-				margin-bottom: 20rpx;
-				border-radius: 20rpx;
-				overflow: hidden;
-				&:nth-child(2n) {
-					margin-right: 0;
-				}
-				.image {
-					width: 348rpx;
-					height: 348rpx;
-					flex-shrink: 0;
-					position: relative;
-					.img {
-						width: 348rpx;
-						height: 348rpx;
-						display: block;
-					}
-					.water {
-						width: 348rpx;
-						height: 348rpx;
-						display: block;
-						position: absolute;
-						left: 0;
-						top: 0;
-						z-index: 1;
-					}
-				}
-				.content {
-					padding: 15rpx 20rpx;
-					.title {
-						font-size: 30rpx;
-						color: #333333;
-						line-height: 36rpx;
-						font-weight: 600;
-						height: 72rpx;
-					}
-					.bottom {
-						display: flex;
-						justify-content: space-between;
-						align-items: center;
-						margin-top: 10rpx;
-						.price {
-							display: flex;
-							flex-direction: column;
-						}
-						.price-1 {
-							font-size: 32rpx;
-							color: #FF3F42;
-							line-height: 36rpx;
-						}
-						.price-2 {
-							font-size: 26rpx;
-							color: #666666;
-							line-height: 30rpx;
-							text-decoration: line-through;
-						}
-						.btn {
-							width: 60rpx;
-							height: 60rpx;
-							background: #FE781F;
-							border-radius: 50%;
-							display: flex;
-							align-items: center;
-							justify-content: center;
-							image {
-								width: 41rpx;
-								height: 36rpx;
-								display: block;
-							}
-						}
-					}
-				}
-			}
-		}
-	}
-</style>
-<style>
-	::-webkit-scrollbar {
-		display: none;
-		width: 0 !important;
-		height: 0 !important;
-		-webkit-appearance: none;
-		background: transparent;
-		color: transparent;
-	}
+<template>
+	<view class="home-container">
+		
+		<block v-show="isLoaded">
+			<custom :bgColor="'bg-them'" :backColor="'#FFFFFF'" :isBack="false" v-show="scrollTop > 100">
+				<text slot="content" style="color: #FFFFFF; font-size: 36rpx;">{{configInfo.minAppName}}</text>
+			</custom>
+			
+			<view class="top-container">
+				<image src="@/static/home/top_bg.png" mode="widthFix" class="bg"></image>
+				
+				<view class="content">
+					<view class="title" :style="cuStyle">{{configInfo.minAppName}}</view>
+					
+					<view class="search">
+						<image src="/static/icon/search.png" class=""></image>
+						<input type="text" confirm-type="search" placeholder="搜索商品名称或型号" v-model="keyword" @confirm="searchSubmit">
+					</view>
+				</view>
+			</view>
+			
+			<view class="classify-container">
+				<view class="content">
+					<block v-for="(item, index) in classifyList" :key='index'>
+						<view class="item" @tap="toClassifyLst(item.categoryId)">
+							<image :src="item.imgUrl" mode="aspectFill"></image>
+							<text class="ellipsis">{{item.name}}</text>
+						</view>
+					</block>
+					<view class="item" @tap="toClassifyLst(0)">
+						<image src="@/static/home/class_more.png" mode="aspectFill"></image>
+						<text>更多分类</text>
+					</view>
+				</view>
+			</view>
+			
+			<view class="swiper-container" v-if="isShow_banner && bannerList.length > 0">
+				<swiper @change="changeBanner" :autoplay="true">
+					<block v-for="(item, index) in bannerList" :key='index'>
+						<swiper-item>
+							<image :src="item.imgSrc" mode="aspectFill" @tap="toMiniProgram(item.appId, item.linkUrl)" v-if="item.type === 2"></image>
+							<image :src="item.imgSrc" mode="aspectFill" @tap="toActivityList(item.goodsId)" v-if="item.type === 3"></image>
+							<image :src="item.imgSrc" mode="aspectFill" @tap="toGoodsDetail(item.goodsId)" v-else></image>
+						</swiper-item>
+					</block>
+				</swiper>
+				<view class="dots-conatiner">
+					<view class="con" :style="'width:'+(bannerList.length * 20)+'rpx;'" >
+						<view class="dot" :style=" 'transform:translateX('+ (bannerCurrent * 100) +'%)' "  ></view>
+					</view>
+				</view>
+			</view>
+			
+			<view class="notice-container" v-if="isShow_notice && noticeList.length > 0 && userInfo.type === 'SERVICE'">
+				<view class="content">
+					<view class="left">
+						<image src="@/static/home/notice.png" ></image>
+					</view>
+					<swiper class="swiper" :autoplay="true" :vertical="true" :circular="true" :disable-touch="true">
+						<block v-for="(item,index) in noticeList" :key='index' >
+							<swiper-item @touchmove.stop='stopTouchMove'>
+								<view class="ellipsis">{{item.workUserName}}成功分享商城，获得收益{{item.amount}}元</view>
+							</swiper-item>
+						</block>
+					</swiper>
+				</view>
+			</view>
+			
+			<view class="coupon-container" v-if="isShow_coupon && couponList.length > 0">
+				<image src="@/static/home/cp_bg1.png" mode="widthFix" class="bg" v-if="couponList.length == 1"></image>
+				<image src="@/static/home/cp_bg2.png" mode="widthFix" class="bg" v-if="couponList.length > 1"></image>
+				
+				<view class="list list1" v-if="couponList.length == 1">
+					<block v-for="(item, index) in couponList" :key='index'>
+						<view class="item" @tap="handleCoupon(item)">
+							<image class="cp" src="@/static/home/coupon_bg1.png"></image>
+							<view class="content">
+								<view class="left">
+									<view class="price">¥{{item.couponValue}}</view>
+									<view class="text" v-if="item.couponType == 'SATISFY'">满{{item.orderAmount}}可用</view>
+								</view>
+								<view class="right">
+									<view class="main">
+										<view class="row1 ellipsis-2">{{item.couponName}}</view>
+										<view class="row2">
+											<view class="date" v-if="item.obtainType == 0 || item.obtainType == 1">
+												<view>领取时间：</view>
+												<view>{{item.obtainStartTime | dateToYYmmdd2}}-{{item.obtainEndTime | dateToYYmmdd2}}</view>
+											</view>
+											<view class="date" v-if="item.obtainType == 2">
+												<view>使用时间：</view>
+												<view>{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}</view>
+											</view>
+											<view class="button gary" v-if="item.obtainType == 0">待开始</view>
+											<view class="button red" v-if="item.obtainType == 1">立即领取</view>
+											<view class="button white" v-if="item.obtainType == 2">去使用</view>
+										</view>
+									</view>
+								</view>
+							</view>
+						</view>
+					</block>
+				</view>
+				
+				<view class="list list2" v-if="couponList.length == 2">
+					<block v-for="(item, index) in couponList" :key='index'>
+						<view class="item" @tap="handleCoupon(item)">
+							<image class="cp" src="@/static/home/coupon_bg2.png"></image>
+							<view class="content">
+								<view class="top">
+									<view class="price">¥{{item.couponValue}}</view>
+									<view class="text">满{{item.orderAmount}}可用</view>
+								</view>
+								<view class="bottom">
+									<view class="name ellipsis">{{item.couponName}}</view>
+									<view class="date ellipsis" v-if="item.obtainType == 0 || item.obtainType == 1">领取时间：{{item.obtainStartTime | dateToYYmmdd2}}-{{item.obtainEndTime | dateToYYmmdd2}}</view>
+									<view class="date ellipsis" v-if="item.obtainType == 2">使用时间：{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}</view>
+									<view class="button gary" v-if="item.obtainType == 0">待开始</view>
+									<view class="button red" v-if="item.obtainType == 1">立即领取</view>
+									<view class="button white" v-if="item.obtainType == 2">去使用</view>
+								</view>
+							</view>
+						</view>
+					</block>
+				</view>
+				
+				<view class="list list3" v-if="couponList.length > 2">
+					<view class="left">
+						<block v-for="(item, index) in couponList" :key='index'>
+							<view class="item" @tap="handleCoupon(item)">
+								<image class="cp" src="@/static/home/coupon_bg3.png"></image>
+								<view class="content">
+									<view class="top">
+										<view class="price">¥{{item.couponValue}}</view>
+										<view class="text">满{{item.orderAmount}}可用</view>
+									</view>
+									<view class="bottom">
+										<view class="name ellipsis">{{item.couponName}}</view>
+										<view class="date ellipsis" v-if="item.obtainType == 0 || item.obtainType == 1">领取时间：{{item.obtainStartTime | dateToYYmmdd2}}-{{item.obtainEndTime | dateToYYmmdd2}}</view>
+										<view class="date ellipsis" v-if="item.obtainType == 2">使用时间：{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}</view>
+										<view class="button gary" v-if="item.obtainType == 0">待开始</view>
+										<view class="button red" v-if="item.obtainType == 1">立即领取</view>
+										<view class="button white" v-if="item.obtainType == 2">去使用</view>
+									</view>
+								</view>
+							</view>
+						</block>
+					</view>
+					<view class="right">
+						<view class="text" @tap="toReceiveCoupon">
+							<text>查</text>
+							<text>看</text>
+							<text>更</text>
+							<text>多</text>
+							<image src="@/static/home/cp_more.png"></image>
+						</view>
+					</view>
+				</view>
+			</view>
+			
+			<view class="myManager-container" v-if="isShow_manager && myManagerDetail && !userInfo.promotionGroupLeader && !userInfo.type === 'SERVICE'">
+				<view class="content">
+					<view class="left">
+						<image :src="myManagerDetail.avatar" mode="aspectFill" v-if="myManagerDetail.avatar.indexOf('http') >= 0"></image>
+						<image :src="imageUrl + myManagerDetail.avatar" mode="aspectFill" v-else></image>
+						<view class="main">
+							<view>客户经理：{{myManagerDetail.workName}}</view>
+							<view>{{myManagerDetail.workPhone}}</view>
+						</view>
+					</view>
+					<view class="right" @tap="callPhone(myManagerDetail.workPhone)">拨打电话</view>
+				</view>
+			</view>
+			
+			<view class="seckill-container" v-if="isShow_seckill && seckillTimeList.length > 0">
+				<image src="@/static/home/seckill_bg.png" mode="widthFix" class="bg"></image>
+				
+				<view class="content">
+					<view class="time-list">
+						<block v-for="(item, index) in seckillTimeList" :key='index'>
+							<view class="item" :class="seckillTimeCurrent == index ? 'current':''" @tap="changeSeckillTime(index)">
+								<view class="time">{{item.startHour}}:00</view>
+								<view class="tag" v-if="item.type == 'yjs'">已结束</view>
+								<view class="tag" v-if="item.type == 'jxz'">{{countdownTime}}</view>
+								<view class="tag" v-if="item.type == 'wks'">即将开始</view>
+							</view>
+						</block>
+					</view>
+					<view class="product-list">
+						<block v-for="(item, index) in seckillGoodsList" :key='index'>
+							<div class="item" @tap="toSeckillGoodsDetail(item.goodsId)">
+								<image :src="item.imgUrl" mode="aspectFill"></image>
+								<view class="right">
+									<view class="title ellipsis-2">{{item.goodsName}}</view>
+									<view class="des ellipsis-2">{{item.describeText ? item.describeText : ''}}</view>
+									<view class="stock-sales">
+										<view class="stock">
+											<text>剩余{{item.secStockNum}}件</text>
+											<view class="progress-box">
+												<!-- 库存 / 总数 * 100 = 剩余百分比 -->
+												<progress :percent="item.secStockNum / item.limitBuy * 100" activeColor="#FF3F42" active stroke-width="6" />
+											</view>
+										</view>
+										<view class="sales">销量：{{item.salesVolume}}</view>
+									</view>
+									<view class="bottom">
+										<view class="price">
+											<view class="price-1">¥{{item.price | numToFixed}}</view>
+											<view class="price-2">¥{{item.goodsPrice | numToFixed}}</view>
+										</view>
+										<view class="btn" v-if="seckillTimeList[seckillTimeCurrent].type == 'jxz'">马上抢</view>
+										<view class="btn2" v-else>马上抢</view>
+									</view>
+								</view>
+							</div>
+						</block>
+					</view>
+					<view class="loadmore" v-if="!seckillGoodsNoMore" @tap="loadMoreSeckillGoods">点击加载更多商品</view>
+				</view>
+			</view>
+			
+			<view class="recom-container" v-if="isShow_recom">
+				<view class="top">
+					<view class="title"><image src="@/static/home/recom.png"></image></view>
+					<scroll-view
+						:scroll-x="true"
+						:scroll-left="scrollLeft"
+						scroll-with-animation
+						:show-scrollbar="false"
+						class="tabs-view"
+						ref="tabs-view">
+						<view class="tab">
+							<block v-for="(item, index) in tabList" :key='index'>
+								<view class="item" :ref="`tabs-item-${index}`" :class="[`tabs-item-${index}`, item.categoryId == tabCurrent ? 'current':'']" @tap="changeTab(item.categoryId)">{{item.name}}</view>
+							</block>
+						</view>
+					</scroll-view>
+				</view>
+				<view class="list">
+					<block v-for="(item, index) in recomList" :key='index'>
+						<view class="item" @tap="toGoodsDetail(item.goodsId)">
+							<view class="image">
+								<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
+								<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
+							</view>
+							<view class="content">
+								<view class="title ellipsis-2">{{item.goodsName}}</view>
+								<view class="bottom">
+									<view class="price">
+										<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
+										<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
+									</view>
+									<view class="btn"><image src="@/static/icon/cart.png" mode="aspectFill"></image></view>
+								</view>
+							</view>
+						</view>
+					</block>
+				</view>
+				<no-data v-if="!recomList.length" :showText="'暂无商品'"></no-data>
+			</view>
+			
+		</block>
+	</view>
+</template>
+
+<script>
+	import {mapState} from 'vuex';
+	
+	export default {
+		props:{
+			homePage: {
+				type: Number,
+				default: 0
+			},
+			templateInfo: {
+				type: Object,
+				default: {}
+			}
+		},
+		data() {
+			return {
+				thisHomePage: 1, // 当前首页页面模版
+				
+				imageUrl: this.$imageUrl,
+				configInfo: uni.getStorageSync('configInfo'),
+				isShow_banner: false,
+				isShow_notice: false,
+				isShow_classify: false,
+				isShow_seckill: false,
+				isShow_coupon: false,
+				isShow_manager: false,
+				isShow_recom: false,
+				
+				scrollTop: 0, // 滚动高度（用于控制自定义导航）
+				keyword: '', // 搜索关键词
+				classifyList: [], // 分类列表
+				bannerList: [], // 轮播图列表
+				bannerCurrent: 0, // 轮播图当前值
+				noticeList: [],
+				couponList: [], // 可领取优惠券列表
+				myManagerDetail: null, // 我的客户经理信息
+				seckillTimeList: [], // 秒杀时间段列表
+				seckillTimeCurrent: 0, // 秒杀时间段选择
+				seckillGoodsList: [], // 秒杀商品列表
+				seckillGoodsPage: 1, // 秒杀商品分页
+				seckillGoodsNoMore: false, // 
+				countdownTime: '', // 倒计时
+				endDatetime: '', // 倒计时结束时间
+				nowDate: null, // 当前时间
+				dateInterval: null, // 时间定时器
+				tabList: [], // 好物推荐分类列表
+				tabCurrent: 1, // 好物推荐分类当前值
+				recomList: [], // 好物推荐列表
+				
+				isLoaded_banner: false,
+				isLoaded_coupon: false,
+				isLoaded_seckill: false,
+				isLoaded_tab: false,
+				isLoaded_myManager: false,
+				
+				scrollLeft: 50,
+				scrollViewWidth: 0,
+				tabsRect: {
+					left: 0
+				},
+			}
+		},
+		computed:{
+			cuStyle(){
+				return `height:${this.CustomBar-this.StatusBar}px; padding-top:${this.StatusBar}px;`
+			},
+			...mapState(['userInfo', 'isLogin', 'userId']),
+			isLoaded() {
+				uni.hideLoading();
+				return (!this.isShow_banner || (this.isShow_banner && this.isLoaded_banner))
+					&& (!this.isShow_coupon || (this.isShow_coupon && this.isLoaded_coupon))
+					&& (!this.isShow_seckill || (this.isShow_seckill && this.isLoaded_seckill))
+					&& (!this.isShow_classify || (this.isShow_classify && this.isLoaded_tab))
+					&& (!this.isShow_manager || (this.isShow_manager && this.isLoaded_myManager))
+			}
+		},
+		watch: {
+			nowDate() {
+				let hh = this.nowDate.getHours(),
+					mm = this.nowDate.getMinutes(),
+					ss = this.nowDate.getSeconds();
+				let hs = [10, 12, 15, 18, 20];
+				if(mm == 0 && ss == 0 && hs.indexOf(hh) >= 0) {
+					setTimeout(() => {
+						this.getSeckillTimeList();
+					}, 1000)
+				}
+			},
+			tabList() {
+				this.$nextTick(() => {
+					this.resize()
+				})
+			},
+			templateInfo: {
+				handler(newValue, oldValue) {
+					const templateInfo = this.templateInfo;
+					this.isShow_banner = templateInfo.carouseStatus;
+					this.isShow_classify = templateInfo.categoryStatus;
+					this.isShow_seckill = templateInfo.killStatus;
+					this.isShow_coupon = templateInfo.couponStatus;
+					this.isShow_manager = templateInfo.customerStatus;
+					this.isShow_notice = templateInfo.notiveStatus;
+					this.isShow_recom = templateInfo.okStatus;
+				},
+				immediate: true,
+				deep: true
+			}
+		},
+		mounted() {
+			uni.$on('onPageScroll', (data) => {
+				if(this.homePage !== this.thisHomePage) return false;
+				
+				this.scrollTop = data;
+			});
+			
+			uni.$on('onPullDownRefresh', (data) => {
+				if(this.homePage !== this.thisHomePage) return false;
+				
+				this.keyword = '';
+				this.getTabList();
+				this.getBannerList();
+				this.getNoticeList();
+				this.getCouponList();
+				this.getMyManager();
+				this.getSeckillTimeList();
+			});
+			
+			uni.$on('onShow', (data) => {
+				if(this.homePage !== this.thisHomePage) return false;
+				
+				console.log('onShow page ' + this.thisHomePage);
+				this.keyword = '';
+				this.getTabList();
+				this.getBannerList();
+				this.getNoticeList();
+				this.getCouponList();
+				this.getMyManager();
+				this.getSeckillTimeList();
+				
+				this.dateInterval = setInterval(() => {
+				   this.nowDate = new Date();
+				}, 1000)
+			});
+			
+			uni.$on('onHide', (data) => {
+				if(this.homePage !== this.thisHomePage) return false;
+				
+				clearInterval(this.dateInterval);
+			})
+		},
+		methods: {
+			// 搜索商品
+			searchSubmit() {
+				uni.navigateTo({
+					url: '/packageGoods/pages/search?keyword=' + this.keyword
+				})
+			},
+			
+			// 获取一级菜单
+			getTabList() {
+				this.$axios({
+					url: '/goods/category/list',
+					method: 'get',
+					params: {}
+				}).then(res => {
+					this.tabList = res.data;
+					this.classifyList = res.data.slice(0, 9);
+					this.tabCurrent = res.data.length > 0 ? res.data[0].categoryId : 0;
+					this.getRecomList();
+					
+					uni.stopPullDownRefresh();
+				}).finally(res => {
+					this.isLoaded_tab = true;
+				})
+			},
+			
+			// 去分类列表
+			toClassifyLst(categoryId) {
+				uni.setStorageSync('categoryId', categoryId);
+				uni.switchTab({
+					url:'/pages/goods/classify'
+				})
+			},
+			
+			// 获取轮播图列表
+			getBannerList() {
+				this.$axios({
+					url: '/common/list/page',
+					method: 'get',
+					params: {
+						pageNum: 1,
+						pageSize: 10,
+						state: true
+					}
+				}).then(res => {
+					this.bannerList = res.data.records;
+				}).finally(res => {
+					this.isLoaded_banner = true;
+					uni.stopPullDownRefresh();
+				})
+			},
+			
+			// 切换广告图
+			changeBanner(e) {
+				this.bannerCurrent = e.detail.current;
+			},
+			
+			// 获取公告列表
+			getNoticeList() {
+				this.$axios({
+					url: '/renovation/settle/list',
+					method: 'get',
+					params: {
+						
+					}
+				}).then(res => {
+					if(res.data) {
+						res.data.forEach(item => {
+							item.workUserName = item.workUserName.slice(0, 1) + '师傅';
+						})
+						this.noticeList = res.data;
+					}
+				})
+			},
+			
+			// 获取可领优惠券列表
+			getCouponList() {
+				this.$axios({
+					url: '/coupon/list/all',
+					method: 'get',
+					params: {
+						userId: this.userId
+					}
+				}).then(res => {
+					this.couponList = res.data;
+				}).finally(res => {
+					this.isLoaded_coupon = true;
+				})
+			},
+			
+			// 处理优惠券
+			handleCoupon(item) {
+				if(item.obtainType == 0) {
+					return this.$toast('该优惠券不可领取');
+				}else if(item.obtainType == 1) {
+					this.$axios({
+						url: '/coupon/obtain',
+						method: 'get',
+						params: {
+							userId: this.userId,
+							couponId: item.couponId
+						}
+					}).then(res => {
+						this.$successToast('领取成功');
+						this.getCouponList();
+					})
+				}else if(item.obtainType == 2) {
+					uni.switchTab({
+					    url: '/pages/goods/classify'
+					});
+				}
+			},
+			
+			// 去可领取优惠券
+			toReceiveCoupon() {
+				uni.navigateTo({
+					url:'/pages/index/coupon'
+				})
+			},
+			
+			// 获取我的客户经理
+			getMyManager() {
+				this.$axios({
+					url: '/user/parent',
+					method: 'get',
+					params: {
+						userId: this.userId
+					}
+				}).then(res => {
+					if(res.data) {
+						this.myManagerDetail = res.data;
+					}
+				}).finally(res => {
+					this.isLoaded_myManager = true;
+				})
+			},
+			
+			// 拨打电话
+			callPhone(val) {
+				uni.makePhoneCall({
+				    phoneNumber: val
+				});
+			},
+			
+			findElem(array, attr, val) {
+			    for (var i = 0; i < array.length; i++) {
+			        if (array[i][attr] == val) {
+			            return i; //返回当前索引值
+			        }
+			    }
+			    return -1;
+			},
+			
+			// 计算倒计时
+			countTime() {
+				let endDatetime = this.endDatetime.replace(/\-/g, '/');
+				// console.log(endDatetime)
+			    var nowtime = new Date(),  //获取当前时间
+			        endtime = new Date(endDatetime);  //定义结束时间
+			    var lefttime = endtime.getTime() - nowtime.getTime(),  //距离结束时间的毫秒数
+			        hh = Math.floor(lefttime/(1000*60*60)),  //计算小时数
+			        mm = Math.floor(lefttime/(1000*60)%60),  //计算分钟数
+			        ss = Math.floor(lefttime/1000%60);  //计算秒数
+				// console.log(new Date(endDatetime))
+				function checkTime(i){
+					if (i<10) {
+						i = "0"+i;
+					}
+					return i;
+				}
+				setTimeout(() => {
+					this.countTime();
+				}, 1000);
+				this.countdownTime = checkTime(hh) + ":" + checkTime(mm) + ":" + checkTime(ss);
+				// console.log(this.countdownTime)
+			},
+			
+			// 获取秒杀时间列表
+			getSeckillTimeList() {
+				this.$axios({
+					url: '/goods/sec/time',
+					method: 'get',
+					params: {}
+				}).then(res => {
+					if(res.data.length < 1) {return false;}
+					this.seckillTimeList = res.data;
+					this.seckillTimeCurrent = this.findElem(this.seckillTimeList, 'type', 'jxz');
+					if(this.seckillTimeCurrent == -1) {
+						this.seckillTimeCurrent = 0;
+						this.getSeckillGoodsList();
+					}else {
+						this.endDatetime = this.seckillTimeList[this.seckillTimeCurrent].endDatetime;
+						this.countTime();
+						this.getSeckillGoodsList();
+					}
+				}).finally(res => {
+					this.isLoaded_seckill = true;
+				})
+			},
+			
+			// 切换秒杀时间
+			changeSeckillTime(index) {
+				this.seckillTimeCurrent = index;
+				this.getSeckillGoodsList();
+			},
+			
+			// 获取秒杀商品列表
+			getSeckillGoodsList(loadMore) {
+				if(this.seckillGoodsNoMore && loadMore)return;
+				if(!loadMore) {
+					this.seckillGoodsNoMore = false;
+					this.seckillGoodsPage = 1;
+				}
+				let secKillId = this.seckillTimeList[this.seckillTimeCurrent].secKillId;
+				this.$axios({
+					url: '/goods/sec/goods/list',
+					method: 'get',
+					params: {
+						pageNum: this.seckillGoodsPage,
+						pageSize: 5,
+						secKillId: secKillId,
+					}
+				}).then(res => {
+					let _list = res.data.records;
+					let pageTotal = res.data.pages;
+					if(this.seckillGoodsPage >= pageTotal){
+						this.seckillGoodsNoMore = true;
+					}
+					if (_list.length) {
+						this.seckillGoodsPage += 1;
+					}
+					if (loadMore) {
+						this.seckillGoodsList = this.seckillGoodsList.concat(_list);
+					} else {
+						this.seckillGoodsList = _list;
+					}
+				})
+			},
+			
+			// 加载更多秒杀商品
+			loadMoreSeckillGoods() {
+				this.getSeckillGoodsList(true);
+			},
+			
+			// 进入秒杀商品详情
+			toSeckillGoodsDetail(id) {
+				if(!id) {
+					return false;
+				}
+				if(this.seckillTimeList[this.seckillTimeCurrent].type == 'wks') {
+					return this.$toast('活动未开始');
+				}
+				if(this.seckillTimeList[this.seckillTimeCurrent].type == 'yjs') {
+					return this.$toast('活动已结束');
+				}
+				uni.navigateTo({
+					url: '/packageGoods/pages/detail?id=' + id
+				})
+			},
+			
+			// 切换一级菜单
+			changeTab(current) {
+				this.tabCurrent = current;
+				this.getRecomList();
+				this.resize();
+			},
+			
+			// 获取好物推荐商品列表
+			getRecomList() {
+				this.$axios({
+					url: '/goods/list/level1',
+					method: 'get',
+					params: {
+						pageNum: 1,
+						pageSize: 6,
+						categoryId: this.tabCurrent,
+					},
+				}).then(res => {
+					res.data.records.forEach(item => {
+						if(item.logo && item.logoStartTime) {
+							item.isShowWater = this.$compareTime(item.logoStartTime, item.logoEndTime);
+						}else {
+							item.isShowWater = false;
+						}
+					})
+					this.recomList = res.data.records;
+				})
+			},
+			
+			// 进入商品详情
+			toGoodsDetail(id) {
+				if(!id) {
+					return false;
+				}
+				uni.navigateTo({
+					url: '/packageGoods/pages/detail?id=' + id
+				})
+			},
+			
+			// 跳转小程序
+			toMiniProgram(appId, path) {
+				wx.navigateToMiniProgram({
+					appId,
+					path,
+					extraData: {},
+					envVersion: 'release',
+					success(res) {}
+				});
+			},
+			
+			// 进入活动列表
+			toActivityList(type) {
+				uni.navigateTo({
+					url: '/packageGoods/pages/activity?type=' + type
+				})
+			},
+			
+			setScrollLeft() {
+				// 当前活动tab的布局信息，有tab菜单的width和left(为元素左边界到父元素左边界的距离)等信息
+				const index = this.findElem(this.tabList, 'categoryId', this.tabCurrent);
+				const tabRect = this.tabList[index]
+				// 累加得到当前item到左边的距离
+				const offsetLeft = this.tabList
+					.slice(0, index)
+					.reduce((total, curr) => {
+						return total + curr.rect.width
+					}, 0)
+				// 此处为屏幕宽度
+				const res = uni.getSystemInfoSync();
+				const windowWidth = res.windowWidth;
+				// 将活动的tabs-item移动到屏幕正中间，实际上是对scroll-view的移动
+				let scrollLeft = offsetLeft - (this.tabsRect.width - tabRect.rect.width) / 2 - (windowWidth - this.tabsRect.right) / 2 + this.tabsRect.left / 2
+				
+				// 这里做一个限制，限制scrollLeft的最大值为整个scroll-view宽度减去tabs组件的宽度
+				scrollLeft = Math.min(scrollLeft, this.scrollViewWidth - this.tabsRect.width)
+				this.scrollLeft = Math.max(0, scrollLeft)
+			},
+			// 获取所有标签的尺寸
+			resize() {
+				// 如果不存在list，则不处理
+				if(this.tabList.length === 0) {
+					return
+				}
+				Promise.all([this.getTabsRect(), this.getAllItemRect()]).then(([tabsRect, itemRect = []]) => {
+					this.tabsRect = tabsRect
+					this.scrollViewWidth = 0
+					itemRect.map((item, index) => {
+						// 计算scroll-view的宽度，这里
+						this.scrollViewWidth += item.width
+						// 另外计算每一个item的中心点X轴坐标
+						this.tabList[index].rect = item
+					})
+					// 获取了tabs的尺寸之后，设置滑块的位置
+					this.setScrollLeft()
+				})
+			},
+			// 获取导航菜单的尺寸
+			getTabsRect() {
+				return new Promise(resolve => {
+					this.queryRect('tabs-view').then(size => resolve(size))
+				})
+			},
+			// 获取所有标签的尺寸
+			getAllItemRect() {
+				return new Promise(resolve => {
+					const promiseAllArr = this.tabList.map((item, index) => this.queryRect(
+						`tabs-item-${index}`, true))
+					Promise.all(promiseAllArr).then(sizes => resolve(sizes))
+				})
+			},
+			// 获取各个标签的尺寸
+			queryRect(el, item) {
+				const query = uni.createSelectorQuery().in(this);
+				return new Promise(resolve => {
+					query.select(`.${el}`).boundingClientRect(data => {
+						resolve(data)
+					}).exec();
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.top-container {
+		position: relative;
+		.bg {
+			display: block;
+			width: 750rpx;
+			position: absolute;
+			top: 0;
+			z-index: 0;
+		}
+		.content {
+			width: 710rpx;
+			padding: 0 20rpx;
+			position: relative;
+			z-index: 1;
+		}
+		.title {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			color: #FFFFFF;
+			font-size: 36rpx;
+		}
+		.search {
+			background: #FFFFFF;
+			height: 64rpx;
+			display: flex;
+			align-items: center;
+			border-radius: 64rpx;
+			padding: 0 20rpx;
+			margin-top: 20rpx;
+			image {
+				width: 28rpx;
+				height: 28rpx;
+			}
+			input {
+				width: 100%;
+				padding-left: 15rpx;
+			}
+		}
+	}
+	.classify-container {
+		margin-top: 40rpx;
+		position: relative;
+		z-index: 1;
+		padding: 0 20rpx;
+		.content {
+			border-radius: 20rpx;
+			padding-top: 30rpx;
+			display: flex;
+			flex-wrap: wrap;
+			background: #FFFFFF;
+			.item {
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				width: 142rpx;
+				margin-bottom: 30rpx;
+				image {
+					width: 78rpx;
+					height: 78rpx;
+					display: block;
+					border-radius: 50%;
+					overflow: hidden;
+				}
+				text {
+					font-size: 24rpx;
+					color: #666666;
+					margin-top: 10rpx;
+					width: 150rpx;
+					text-align: center;
+				}
+			}
+		}
+	}
+	.swiper-container {
+		position: relative;
+		margin-top: 20rpx;
+		swiper {
+			height: 350rpx;
+		}
+		image {
+			height: 350rpx;
+			width: 710rpx;
+			display: block;
+			margin: 0 auto 0;
+			border-radius: 15rpx;
+			overflow: hidden;
+		}
+		.dots-conatiner {
+			position: absolute;
+			width: 100%;
+			bottom: 40rpx;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			.con {
+				border-radius: 4rpx;
+				overflow: hidden;
+				height: 4rpx;
+				background-color: rgba($color: #FFFFFF, $alpha: 0.3);
+			}
+			.dot {
+				width: 20rpx;
+				height: 4rpx;
+				background-color: #FFFFFF;
+				transition: all .3s;
+			}
+		}
+	}
+	.notice-container {
+		padding: 0 20rpx;
+		margin-top: 20rpx;
+		.content {
+			display: flex;
+			align-items: center;
+			height: 100rpx;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+		}
+		.left{
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			width: 96rpx;
+			height: 48rpx;
+			margin-right: 20rpx;
+			border-right: 2rpx solid #E5E5E5;
+			image {
+				width: 60rpx;
+				height: 30rpx;
+				display: block;
+			}
+		}
+		.swiper{
+			height: 100rpx;
+			flex: 1;
+			padding-right: 20rpx;
+			::v-deep swiper-item {
+				display: block;
+				height: 100rpx;
+				width: 100%;
+				line-height: 100rpx;
+			}
+		}
+	}
+	.coupon-container {
+		position: relative;
+		margin-top: 20rpx;
+		padding: 0 20rpx;
+		.bg {
+			display: block;
+			width: 100%;
+		}
+		.list {
+			position: absolute;
+			top: 80rpx;
+			z-index: 1;
+		}
+		.list1 {
+			.item {
+				position: relative;
+				margin-bottom: 20rpx;
+				margin-left: 16rpx;
+				.cp {
+					width: 688rpx;
+					height: 178rpx;
+					display: block;
+				}
+				.content {
+					position: absolute;
+					left: 0;
+					top: 0;
+					width: 710rpx;
+					height: 160rpx;
+					display: flex;
+					align-items: center;
+					.left {
+						width: 210rpx;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+						flex-direction: column;
+						.price {
+							font-size: 48rpx;
+							color: #FFFFFF;
+						}
+						.text {
+							color: #FFFFFF;
+							font-size: 28rpx;
+						}
+					}
+					.right {
+						display: flex;
+						align-items: center;
+						justify-content: space-between;
+						padding: 0 20rpx;
+						width: 470rpx;
+						height: 150rpx;
+						box-sizing: border-box;
+						.main {
+							width: 430rpx;
+							height: 150rpx;
+							padding: 16rpx 0 8rpx;
+							box-sizing: border-box;
+							display: flex;
+							flex-direction: column;
+							justify-content: space-between;
+							.row1 {
+								font-size: 28rpx;
+								line-height: 32rpx;
+								height: 64rpx;
+							}
+							.row2 {
+								font-size: 24rpx;
+								line-height: 28rpx;
+								color: #999999;
+								display: flex;
+								justify-content: space-between;
+								align-items: center;
+							}
+						}
+					}
+				}
+			}
+		}
+		.list2 {
+			display: flex;
+			.item {
+				position: relative;
+				margin-bottom: 20rpx;
+				&:first-child {
+					margin-left: 16rpx;
+				}
+				.cp {
+					width: 342rpx;
+					height: 308rpx;
+					display: block;
+				}
+				.content {
+					position: absolute;
+					left: 0;
+					top: 0;
+					width: 342rpx;
+					height: 328rpx;
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					.top {
+						width: 324rpx;
+						height: 130rpx;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+						flex-direction: column;
+						.price {
+							font-size: 48rpx;
+							color: #FFFFFF;
+							line-height: 48rpx;
+							margin-top: 16rpx;
+						}
+						.text {
+							color: #FFFFFF;
+							font-size: 28rpx;
+							line-height: 28rpx;
+							margin-top: 10rpx;
+						}
+					}
+					.bottom {
+						width: 324rpx;
+						height: 160rpx;
+						padding: 16rpx;
+						box-sizing: border-box;
+						display: flex;
+						flex-direction: column;
+						justify-content: space-between;
+						align-items: center;
+						.name {
+							font-size: 28rpx;
+							text-align: left;
+							line-height: 32rpx;
+							width: 100%;
+						}
+						.date {
+							font-size: 24rpx;
+							color: #999999;
+							text-align: left;
+							width: 100%;
+							line-height: 28rpx;
+						}
+					}
+				}
+			}
+		}
+		.list3 {
+			display: flex;
+			align-items: center;
+			.left {
+				display: flex;
+				width: 630rpx;
+				overflow-x: scroll;
+			}
+			.right {
+				width: 80rpx;
+				display: flex;
+				justify-content: center;
+				.text {
+					width: 48rpx;
+					height: 200rpx;
+					border-radius: 48rpx;
+					background: #FFFFFF;
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					justify-content: center;
+					text {
+						font-size: 28rpx;
+						color: #FF3F42;
+						line-height: 32rpx;
+					}
+					image {
+						width: 32rpx;
+						height: 32rpx;
+						display: block;
+						flex-shrink: 0;
+						margin-top: 10rpx;
+					}
+				}
+			}
+			.item {
+				position: relative;
+				margin-bottom: 20rpx;
+				&:first-child {
+					margin-left: 16rpx;
+				}
+				.cp {
+					width: 278rpx;
+					height: 308rpx;
+					display: block;
+				}
+				.content {
+					position: absolute;
+					left: 0;
+					top: 0;
+					width: 278rpx;
+					height: 328rpx;
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					.top {
+						width: 260rpx;
+						height: 130rpx;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+						flex-direction: column;
+						.price {
+							font-size: 48rpx;
+							color: #FFFFFF;
+							line-height: 48rpx;
+							margin-top: 16rpx;
+						}
+						.text {
+							color: #FFFFFF;
+							font-size: 28rpx;
+							line-height: 28rpx;
+							margin-top: 10rpx;
+						}
+					}
+					.bottom {
+						width: 260rpx;
+						height: 160rpx;
+						padding: 16rpx;
+						box-sizing: border-box;
+						display: flex;
+						flex-direction: column;
+						justify-content: space-between;
+						align-items: center;
+						.name {
+							font-size: 28rpx;
+							text-align: left;
+							line-height: 32rpx;
+							width: 100%;
+						}
+						.date {
+							font-size: 24rpx;
+							color: #999999;
+							text-align: left;
+							width: 100%;
+							line-height: 28rpx;
+						}
+					}
+				}
+			}
+		}
+		.button {
+			width: 120rpx;
+			height: 40rpx;
+			border-radius: 40rpx;
+			font-size: 24rpx;
+			flex-shrink: 0;
+			box-sizing: border-box;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			&.gary {
+				background: #AAAAAA;
+				color: #FFFFFF;
+				border: 1px solid #AAAAAA;
+			}
+			&.red {
+				background: #C434FF;
+				color: #FFFFFF;
+				border: 1px solid #C434FF;
+			}
+			&.white {
+				color: #FF3F42;
+				border: 1px solid #FF3F42;
+			}
+		}
+	}
+	.myManager-container {
+		padding: 0 20rpx;
+		.content {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			padding: 20rpx;
+			.left {
+				display: flex;
+				align-items: center;
+				image {
+					width: 100rpx;
+					height: 100rpx;
+					border-radius: 50%;
+				}
+				.main {
+					font-size: 28rpx;
+					line-height: 48rpx;
+					margin-left: 20rpx;
+				}
+			}
+			.right {
+				width: 160rpx;
+				height: 60rpx;
+				line-height: 60rpx;
+				border-radius: 60rpx;
+				text-align: center;
+				font-size: 28rpx;
+				color: #E43B38;
+				border: 1px solid #E43B38;
+			}
+		}
+	}
+	.seckill-container {
+		position: relative;
+		margin-top: 20rpx;
+		min-height: 340rpx;
+		.bg {
+			display: block;
+			width: 750rpx;
+			position: absolute;
+			top: 0;
+			z-index: 0;
+		}
+		.content {
+			width: 710rpx;
+			padding: 0 20rpx;
+			position: relative;
+			z-index: 1;
+		}
+		.time-list {
+			display: flex;
+			overflow-x: scroll;
+			padding-top: 90rpx;
+			padding-bottom: 40rpx;
+			.item {
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				flex-shrink: 0;
+				width: 140rpx;
+				margin-right: 48rpx;
+				.time {
+					font-size: 32rpx;
+					color: #FFFFFF;
+				}
+				.tag {
+					width: 140rpx;
+					height: 44rpx;
+					border-radius: 44rpx;
+					border: 1px solid #FFFFFF;
+					font-size: 24rpx;
+					color: #FFFFFF;
+					box-sizing: border-box;
+					margin-top: 12rpx;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+				}
+				&.current {
+					.tag {
+						background: #FFFFFF;
+						color: #FF3F42;
+					}
+				}
+			}
+		}
+		.product-list {
+			.item {
+				background: #FFFFFF;
+				border-radius: 10rpx;
+				display: flex;
+				padding: 20rpx;
+				margin-bottom: 20rpx;
+				image {
+					display: block;
+					width: 180rpx;
+					height: 180rpx;
+					flex-shrink: 0;
+				}
+				.right {
+					width: 490rpx;
+					box-sizing: border-box;
+					padding-left: 20rpx;
+					.title {
+						font-size: 30rpx;
+						color: #333333;
+						line-height: 36rpx;
+						font-weight: 600;
+					}
+					.des {
+						font-size: 24rpx;
+						line-height: 30rpx;
+						color: #999999;
+						margin-top: 6rpx;
+					}
+					.stock-sales {
+						display: flex;
+						justify-content: space-between;
+						align-items: center;
+						margin-top: 10rpx;
+						font-size: 24rpx;
+						color: #666666;
+						.stock {
+							display: flex;
+							align-items: center;
+							text {
+								font-size: 24rpx;
+								color: #666666;
+							}
+							.progress-box {
+								width: 140rpx;
+								border-radius: 6px;
+								overflow: hidden;
+								margin-left: 10rpx;
+							}
+						}
+					}
+					.bottom {
+						display: flex;
+						justify-content: space-between;
+						align-items: center;
+						margin-top: 10rpx;
+						.price {
+							display: flex;
+							flex-direction: column;
+						}
+						.price-1 {
+							font-size: 32rpx;
+							color: #FF3F42;
+							line-height: 36rpx;
+						}
+						.price-2 {
+							font-size: 26rpx;
+							color: #666666;
+							line-height: 30rpx;
+							text-decoration: line-through;
+						}
+						.btn {
+							width: 110rpx;
+							height: 44rpx;
+							background: #FF3F42;
+							border-radius: 5rpx;
+							font-size: 28rpx;
+							color: #FFFFFF;
+							text-align: center;
+							line-height: 44rpx;
+						}
+						.btn2 {
+							width: 110rpx;
+							height: 44rpx;
+							background: #AAAAAA;
+							border-radius: 5rpx;
+							font-size: 28rpx;
+							color: #FFFFFF;
+							text-align: center;
+							line-height: 44rpx;
+						}
+					}
+				}
+			}
+		}
+		.loadmore {
+			background: #FFFFFF;
+			border-radius: 10rpx;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			height: 88rpx;
+		}
+	}
+	.recom-container {
+		margin-top: 30rpx;
+		.top {
+			background: #FFFFFF;
+			padding: 30rpx 0 0;
+			.title {
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				margin-bottom: 10rpx;
+				image {
+					width: 300rpx;
+					height: 40rpx;
+					display: block;
+				}
+			}
+			.tab {
+				display: flex;
+				margin-left: -10rpx;
+				.item {
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					flex-shrink: 0;
+					font-size: 28rpx;
+					color: #666666;
+					height: 80rpx;
+					line-height: 80rpx;
+					position: relative;
+					padding: 0 30rpx;
+					&.current {
+						color: #FF3F42;
+						font-weight: 600;
+						&::after {
+							content: '';
+							display: block;
+							width: 50rpx;
+							height: 6rpx;
+							background: #FF3F42;
+							position: absolute;
+							bottom: 0;
+							left: 50%;
+							margin-left: -25rpx;
+						}
+					}
+				}
+			}
+		}
+		.list {
+			display: flex;
+			flex-wrap: wrap;
+			padding: 20rpx;
+			.item {
+				width: 348rpx;
+				background: #FFFFFF;
+				margin-right: 14rpx;
+				margin-bottom: 20rpx;
+				border-radius: 20rpx;
+				overflow: hidden;
+				&:nth-child(2n) {
+					margin-right: 0;
+				}
+				.image {
+					width: 348rpx;
+					height: 348rpx;
+					flex-shrink: 0;
+					position: relative;
+					.img {
+						width: 348rpx;
+						height: 348rpx;
+						display: block;
+					}
+					.water {
+						width: 348rpx;
+						height: 348rpx;
+						display: block;
+						position: absolute;
+						left: 0;
+						top: 0;
+						z-index: 1;
+					}
+				}
+				.content {
+					padding: 15rpx 20rpx;
+					.title {
+						font-size: 30rpx;
+						color: #333333;
+						line-height: 36rpx;
+						font-weight: 600;
+						height: 72rpx;
+					}
+					.bottom {
+						display: flex;
+						justify-content: space-between;
+						align-items: center;
+						margin-top: 10rpx;
+						.price {
+							display: flex;
+							flex-direction: column;
+						}
+						.price-1 {
+							font-size: 32rpx;
+							color: #FF3F42;
+							line-height: 36rpx;
+						}
+						.price-2 {
+							font-size: 26rpx;
+							color: #666666;
+							line-height: 30rpx;
+							text-decoration: line-through;
+						}
+						.btn {
+							width: 60rpx;
+							height: 60rpx;
+							background: #FE781F;
+							border-radius: 50%;
+							display: flex;
+							align-items: center;
+							justify-content: center;
+							image {
+								width: 41rpx;
+								height: 36rpx;
+								display: block;
+							}
+						}
+					}
+				}
+			}
+		}
+	}
+</style>
+<style>
+	::-webkit-scrollbar {
+		display: none;
+		width: 0 !important;
+		height: 0 !important;
+		-webkit-appearance: none;
+		background: transparent;
+		color: transparent;
+	}
 </style>

pages/index/components/home-page-b.vue

@@ -1,1666 +1,1666 @@
-<template>
-	<view class="home-container">
-		
-		<block v-show="isLoaded">
-			<custom :bgColor="'bg-them'" :backColor="'#FFFFFF'" :isBack="false" v-show="scrollTop > 100">
-				<text slot="content" style="color: #FFFFFF; font-size: 36rpx;">{{configInfo.minAppName}}</text>
-			</custom>
-			
-			<view class="top-container">
-				<image src="@/static/home/top_bg_2.png" mode="widthFix" class="bg"></image>
-				
-				<view class="content">
-					<view class="title" :style="cuStyle">{{configInfo.minAppName}}</view>
-					
-					<view class="search">
-						<image src="/static/icon/search.png" class=""></image>
-						<input type="text" confirm-type="search" placeholder="搜索商品名称或型号" v-model="keyword" @confirm="searchSubmit">
-					</view>
-				</view>
-			</view>
-			
-			<view class="swiper-container" v-if="isShow_banner && bannerList.length > 0">
-				<swiper @change="changeBanner" :autoplay="true">
-					<block v-for="(item, index) in bannerList" :key='index'>
-						<swiper-item>
-							<image :src="item.imgSrc" mode="aspectFill" @tap="toMiniProgram(item.appId, item.linkUrl)" v-if="item.type === 2"></image>
-							<image :src="item.imgSrc" mode="aspectFill" @tap="toActivityList(item.goodsId)" v-if="item.type === 3"></image>
-							<image :src="item.imgSrc" mode="aspectFill" @tap="toGoodsDetail(item.goodsId)" v-else></image>
-						</swiper-item>
-					</block>
-				</swiper>
-				<view class="dots-conatiner">
-					<view class="con" :style="'width:'+(bannerList.length * 20)+'rpx;'" >
-						<view class="dot" :style=" 'transform:translateX('+ (bannerCurrent * 100) +'%)' "  ></view>
-					</view>
-				</view>
-			</view>
-			
-			<view class="bigActivity-container" v-if="isShow_activity1 && bigActivityImgUrl">
-				<image :src="bigActivityImgUrl" mode="widthFix" @tap="toActivityList(3)"></image>
-			</view>
-			
-			<view class="classify-container" v-if="isShow_classify"
-				:class="(!isShow_banner || (isShow_banner && bannerList.length < 1)) 
-					&& (!isShow_activity1 || (isShow_activity1 && !bigActivityImgUrl)) ? 'whiteBg':''">
-				<view class="content">
-					<block v-for="(item, index) in classifyList" :key='index'>
-						<view class="item" @tap="toClassifyLst(item.categoryId)">
-							<image :src="item.imgUrl" mode="aspectFill"></image>
-							<text class="ellipsis">{{item.name}}</text>
-						</view>
-					</block>
-					<view class="item" @tap="toClassifyLst(0)">
-						<image src="@/static/home/class_more2.png" mode="aspectFill"></image>
-						<text>更多分类</text>
-					</view>
-				</view>
-			</view>
-			
-			<view class="other-container" v-if="isShow_activity2 && leftActivityImgUrl && rightActivityImgUrl">
-				<image :src="leftActivityImgUrl" mode="aspectFill" @tap="toActivityList(4)"></image>
-				<image :src="rightActivityImgUrl" mode="aspectFill" @tap="toActivityList(5)"></image>
-			</view>
-			
-			<view class="smallActivity-container" v-if="isShow_special">
-				<view class="content">
-					<view class="title">专场专区</view>
-					<view class="list">
-						<view class="item">
-							<image :src="smallActivity1ImgUrl" mode="aspectFill" @tap="toActivityList(6)"></image>
-						</view>
-						<view class="item">
-							<image :src="smallActivity2ImgUrl" mode="aspectFill" @tap="toActivityList(7)"></image>
-						</view>
-						<view class="item">
-							<image :src="smallActivity3ImgUrl" mode="aspectFill" @tap="toActivityList(8)"></image>
-						</view>
-						<view class="item">
-							<image :src="smallActivity4ImgUrl" mode="aspectFill" @tap="toActivityList(9)"></image>
-						</view>
-					</view>
-				</view>
-			</view>
-			
-			<view class="coupon-container" v-if="isShow_coupon && couponList.length > 0">
-				<image src="@/static/home/cp_bg1.png" mode="widthFix" class="bg" v-if="couponList.length == 1"></image>
-				<image src="@/static/home/cp_bg2.png" mode="widthFix" class="bg" v-if="couponList.length > 1"></image>
-				
-				<view class="list list1" v-if="couponList.length == 1">
-					<block v-for="(item, index) in couponList" :key='index'>
-						<view class="item" @tap="handleCoupon(item)">
-							<image class="cp" src="@/static/home/coupon_bg1.png"></image>
-							<view class="content">
-								<view class="left">
-									<view class="price">¥{{item.couponValue}}</view>
-									<view class="text" v-if="item.couponType == 'SATISFY'">满{{item.orderAmount}}可用</view>
-								</view>
-								<view class="right">
-									<view class="main">
-										<view class="row1 ellipsis-2">{{item.couponName}}</view>
-										<view class="row2">
-											<view class="date" v-if="item.obtainType == 0 || item.obtainType == 1">
-												<view>领取时间：</view>
-												<view>{{item.obtainStartTime | dateToYYmmdd2}}-{{item.obtainEndTime | dateToYYmmdd2}}</view>
-											</view>
-											<view class="date" v-if="item.obtainType == 2">
-												<view>使用时间：</view>
-												<view>{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}</view>
-											</view>
-											<view class="button gary" v-if="item.obtainType == 0">待开始</view>
-											<view class="button red" v-if="item.obtainType == 1">立即领取</view>
-											<view class="button white" v-if="item.obtainType == 2">去使用</view>
-										</view>
-									</view>
-								</view>
-							</view>
-						</view>
-					</block>
-				</view>
-				
-				<view class="list list2" v-if="couponList.length == 2">
-					<block v-for="(item, index) in couponList" :key='index'>
-						<view class="item" @tap="handleCoupon(item)">
-							<image class="cp" src="@/static/home/coupon_bg2.png"></image>
-							<view class="content">
-								<view class="top">
-									<view class="price">¥{{item.couponValue}}</view>
-									<view class="text">满{{item.orderAmount}}可用</view>
-								</view>
-								<view class="bottom">
-									<view class="name ellipsis">{{item.couponName}}</view>
-									<view class="date ellipsis" v-if="item.obtainType == 0 || item.obtainType == 1">领取时间：{{item.obtainStartTime | dateToYYmmdd2}}-{{item.obtainEndTime | dateToYYmmdd2}}</view>
-									<view class="date ellipsis" v-if="item.obtainType == 2">使用时间：{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}</view>
-									<view class="button gary" v-if="item.obtainType == 0">待开始</view>
-									<view class="button red" v-if="item.obtainType == 1">立即领取</view>
-									<view class="button white" v-if="item.obtainType == 2">去使用</view>
-								</view>
-							</view>
-						</view>
-					</block>
-				</view>
-				
-				<view class="list list3" v-if="couponList.length > 2">
-					<view class="left">
-						<block v-for="(item, index) in couponList" :key='index'>
-							<view class="item" @tap="handleCoupon(item)">
-								<image class="cp" src="@/static/home/coupon_bg3.png"></image>
-								<view class="content">
-									<view class="top">
-										<view class="price">¥{{item.couponValue}}</view>
-										<view class="text">满{{item.orderAmount}}可用</view>
-									</view>
-									<view class="bottom">
-										<view class="name ellipsis">{{item.couponName}}</view>
-										<view class="date ellipsis" v-if="item.obtainType == 0 || item.obtainType == 1">领取时间：{{item.obtainStartTime | dateToYYmmdd2}}-{{item.obtainEndTime | dateToYYmmdd2}}</view>
-										<view class="date ellipsis" v-if="item.obtainType == 2">使用时间：{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}</view>
-										<view class="button gary" v-if="item.obtainType == 0">待开始</view>
-										<view class="button red" v-if="item.obtainType == 1">立即领取</view>
-										<view class="button white" v-if="item.obtainType == 2">去使用</view>
-									</view>
-								</view>
-							</view>
-						</block>
-					</view>
-					<view class="right">
-						<view class="text" @tap="toReceiveCoupon">
-							<text>查</text>
-							<text>看</text>
-							<text>更</text>
-							<text>多</text>
-							<image src="@/static/home/cp_more.png"></image>
-						</view>
-					</view>
-				</view>
-			</view>
-			
-			<view class="myManager-container" v-if="isShow_manager && myManagerDetail && !userInfo.promotionGroupLeader && !userInfo.type === 'SERVICE'">
-				<view class="content">
-					<view class="left">
-						<image :src="myManagerDetail.avatar" mode="aspectFill" v-if="myManagerDetail.avatar.indexOf('http') >= 0"></image>
-						<image :src="imageUrl + myManagerDetail.avatar" mode="aspectFill" v-else></image>
-						<view class="main">
-							<view>客户经理：{{myManagerDetail.workName}}</view>
-							<view>{{myManagerDetail.workPhone}}</view>
-						</view>
-					</view>
-					<view class="right" @tap="callPhone(myManagerDetail.workPhone)">拨打电话</view>
-				</view>
-			</view>
-			
-			<view class="notice-container" v-if="isShow_notice && noticeList.length > 0 && userInfo.type === 'SERVICE'">
-				<view class="content">
-					<view class="left">
-						<image src="@/static/home/notice.png" ></image>
-					</view>
-					<swiper class="swiper" :autoplay="true" :vertical="true" :circular="true" :disable-touch="true">
-						<block v-for="(item,index) in noticeList" :key='index' >
-							<swiper-item @touchmove.stop='stopTouchMove'>
-								<view class="ellipsis">{{item.workUserName}}成功分享商城，获得收益{{item.amount}}元</view>
-							</swiper-item>
-						</block>
-					</swiper>
-				</view>
-			</view>
-			
-			<view class="seckill2-container" v-if="isShow_seckill && seckillTimeList.length > 0">
-				<view class="content">
-					<view class="top">
-						<view class="left">
-							<view class="title">秒杀专区</view>
-							<view class="timeout">
-								<view class="text">{{countdownText}}</view>
-								<view class="time">{{countdownTime}}</view>
-							</view>
-						</view>
-						<view class="right" @tap="toSeckillGoodsList()">更多<image src="@/static/icon/right.png"></image></view>
-					</view>
-					<view class="list">
-						<block v-for="(item, index) in seckillGoodsList" :key='index'>
-							<view class="item" @tap="toSeckillGoodsDetail(item.goodsId)">
-								<image :src="item.imgUrl" mode="aspectFill"></image>
-								<view class="title ellipsis-2">{{item.goodsName}}</view>
-								<view class="price">¥{{item.price | numToFixed}}</view>
-							</view>
-						</block>
-					</view>
-				</view>
-			</view>
-			
-			<view class="recom-container" v-if="isShow_newclassify">
-				<view class="top">
-					<scroll-view
-						:scroll-x="true"
-						:scroll-left="scrollLeft"
-						scroll-with-animation
-						:show-scrollbar="false"
-						class="tabs-view"
-						ref="tabs-view">
-						<view class="tab">
-							<block v-for="(item, index) in tabList" :key='index'>
-								<view class="item" :ref="`tabs-item-${index}`" :class="[`tabs-item-${index}`, item.goodsNewsCategoryId == tabCurrent ? 'current':'']" @tap="changeTab(item.goodsNewsCategoryId)">
-									<view class="name">{{item.mainTitle}}</view>
-									<view class="text">{{item.subTitle}}</view>
-								</view>
-							</block>
-						</view>
-					</scroll-view>
-				</view>
-				<view class="goods-row-list" v-if="recomList.length > 0">
-					<block v-for="(item, index) in recomList" :key='index'>
-						<view class="item" @tap="toGoodsDetail(item.goodsId)">
-							<view class="image">
-								<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
-								<image :src="item.logo" mode="heightFix" class="water" v-if="item.isShowWater"></image>
-							</view>
-							
-							<view class="right">
-								<view>
-									<view class="title ellipsis-2">{{item.goodsName}}</view>
-									<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
-										<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
-									</view>
-								</view>
-								<view>
-									<view class="bottom">
-										<view class="price">
-											<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
-											<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
-										</view>
-										<view class="text">销量：{{item.soldNum}}</view>
-									</view>
-								</view>
-							</view>
-						</view>
-					</block>
-				</view>
-				<no-data v-if="!recomList.length" :showText="'暂无商品'"></no-data>
-				<loading-text v-if="recomList.length"  :loading="loading" :noMore="noMore" ></loading-text>
-			</view>
-			
-			<view class="dialog-container" v-if="isShow_dialog && dialogImgUrl && isShowDialog">
-				<uni-transition ref="dialog" mode-class="zoom-in" :duration="500" :show="isShow_dialog && dialogImgUrl && isShowDialog">
-					<image class="image" :src="dialogImgUrl" mode="widthFix" @tap="toActivityList(2)"></image>
-				</uni-transition>
-				<uni-transition ref="dialogBtn" mode-class="fade" :duration="500" :show="isShow_dialog && dialogImgUrl && isShowDialog">
-					<image class="close" src="@/static/icon/close4.png" @tap="closeDialog()"></image>
-				</uni-transition>
-			</view>
-			
-			<view class="dialog-container" v-if="couponDialogImgUrl && isShowCouponDialog">
-				<uni-transition ref="dialog2" mode-class="zoom-in" :duration="500" :show="couponDialogImgUrl && isShowCouponDialog">
-					<image class="image" :src="couponDialogImgUrl" mode="widthFix"></image>
-				</uni-transition>
-				<uni-transition ref="dialogBtn2" mode-class="fade" :duration="500" :show="couponDialogImgUrl && isShowCouponDialog">
-					<image class="close" src="@/static/icon/close4.png" @tap="closeDialog2()"></image>
-				</uni-transition>
-			</view>
-			
-			<modal-dialog showTitle="提示" showText="优惠券领取成功，请及时使用!" :isShowDialog="isShowCouponSuccessDialog" @cancel="isShowCouponSuccessDialog = false" :isShowConfirm="false"></modal-dialog>
-		</block>
-	</view>
-</template>
-
-<script>
-	import {mapState} from 'vuex';
-	
-	export default {
-		props:{
-			homePage: {
-				type: Number,
-				default: 0
-			},
-			templateInfo: {
-				type: Object,
-				default: {}
-			}
-		},
-		data() {
-			return {
-				thisHomePage: 2, // 当前首页页面模版
-				
-				imageUrl: this.$imageUrl,
-				configInfo: uni.getStorageSync('configInfo'),
-				isShow_dialog: false,
-				isShow_banner: false,
-				isShow_activity1: false,
-				isShow_classify: false,
-				isShow_activity2: false,
-				isShow_special: false,
-				isShow_seckill: false,
-				isShow_coupon: false,
-				isShow_manager: false,
-				isShow_notice: false,
-				isShow_newclassify: false,
-				
-				scrollTop: 0, // 滚动高度（用于控制自定义导航）
-				keyword: '', // 搜索关键词
-				classifyList: [], // 分类列表
-				bannerList: [], // 轮播图列表
-				bannerCurrent: 0, // 轮播图当前值
-				dialogImgUrl: '',
-				bigActivityImgUrl: '',
-				leftActivityImgUrl: '',
-				rightActivityImgUrl: '',
-				smallActivity1ImgUrl: '',
-				smallActivity2ImgUrl: '',
-				smallActivity3ImgUrl: '',
-				smallActivity4ImgUrl: '',
-				noticeList: [],
-				couponList: [], // 可领取优惠券列表
-				myManagerDetail: null, // 我的客户经理信息
-				seckillTimeList: [], // 秒杀时间段列表
-				seckillGoodsList: [], // 秒杀商品列表
-				seckillGoodsPage: 1, // 秒杀商品分页
-				seckillGoodsNoMore: false, // 
-				countdownText: '', // 倒计时文字
-				countdownTime: '', // 倒计时时间
-				endDatetime: '', // 倒计时结束时间
-				nowDate: null, // 当前时间
-				dateInterval: null, // 时间定时器
-				tabList: [], // 好物推荐分类列表
-				tabCurrent: 1, // 好物推荐分类当前值
-				pageNum: 1,
-				pageSize: 8,
-				recomList: [], // 好物推荐列表
-				noMore: false,
-				loading: false,
-				
-				isLoaded_banner: false,
-				isLoaded_coupon: false,
-				isLoaded_seckill: false,
-				isLoaded_classify: false,
-				isLoaded_manager: false,
-				isLoaded_classfly: false,
-				isLoaded_newclassify: false,
-				
-				scrollLeft: 50,
-				scrollViewWidth: 0,
-				tabsRect: {
-					left: 0
-				},
-				
-				isShowDialog: true,
-				
-				couponDialogImgUrl: '',
-				isShowCouponDialog: true,
-				isShowCouponSuccessDialog: false,
-			}
-		},
-		computed:{
-			cuStyle(){
-				return `height:${this.CustomBar-this.StatusBar}px; padding-top:${this.StatusBar}px;`
-			},
-			...mapState(['userInfo', 'isLogin', 'userId']),
-			isLoaded() {
-				uni.hideLoading();
-				return (!this.isShow_banner || (this.isShow_banner && this.isLoaded_banner))
-					&& (!this.isShow_coupon || (this.isShow_coupon && this.isLoaded_coupon))
-					&& (!this.isShow_seckill || (this.isShow_seckill && this.isLoaded_seckill))
-					&& (!this.isShow_classify || (this.isShow_classify && this.isLoaded_classify))
-					&& (!this.isShow_manager || (this.isShow_manager && this.isLoaded_manager))
-					&& (!this.isShow_newclassify || (this.isShow_newclassify && this.isLoaded_newclassify))
-			}
-		},
-		watch: {
-			nowDate() {
-				let hh = this.nowDate.getHours(),
-					mm = this.nowDate.getMinutes(),
-					ss = this.nowDate.getSeconds();
-				let hs = [10, 12, 15, 18, 20];
-				if(mm == 0 && ss == 0 && hs.indexOf(hh) >= 0) {
-					setTimeout(() => {
-						this.getSeckillTimeList();
-					}, 1000)
-				}
-			},
-			tabList() {
-				this.$nextTick(() => {
-					this.resize()
-				})
-			},
-			templateInfo: {
-				handler(newValue, oldValue) {
-					const templateInfo = this.templateInfo;
-					this.isShow_dialog = templateInfo.popupStatus;
-					this.isShow_banner = templateInfo.carouseStatus;
-					this.isShow_activity1 = templateInfo.active1Status;
-					this.isShow_classify = templateInfo.categoryStatus;
-					this.isShow_activity2 = templateInfo.active2Status;
-					this.isShow_special = templateInfo.onlyStatus;
-					this.isShow_seckill = templateInfo.killStatus;
-					this.isShow_coupon = templateInfo.couponStatus;
-					this.isShow_manager = templateInfo.customerStatus;
-					this.isShow_notice = templateInfo.notiveStatus;
-					this.isShow_newclassify = templateInfo.newsStatus;
-					
-					this.dialogImgUrl = templateInfo.popupImage;
-					this.bigActivityImgUrl = templateInfo.active1Image;
-					this.leftActivityImgUrl = templateInfo.active2LeftImage;
-					this.rightActivityImgUrl = templateInfo.active2RightImage;
-					this.smallActivity1ImgUrl = templateInfo.only1Image;
-					this.smallActivity2ImgUrl = templateInfo.only2Image;
-					this.smallActivity3ImgUrl = templateInfo.only3Image;
-					this.smallActivity4ImgUrl = templateInfo.only4Image;
-				},
-				immediate: true,
-				deep: true
-			}
-		},
-		mounted() {
-			uni.$on('onPageScroll', (data) => {
-				this.scrollTop = data;
-			});
-			
-			uni.$on('onPullDownRefresh', (data) => {
-				this.keyword = '';
-				this.getTabList();
-				this.getBannerList();
-				this.getCouponList();
-				this.getMyManager();
-				this.getNoticeList();
-				this.getSeckillTimeList();
-				this.getClassflyList();
-			});
-			
-			uni.$on('onReachBottom', (data) => {
-				this.getRecomList(1);
-			});
-			
-			uni.$on('onShow', (data) => {
-				console.log('onShow page ' + this.thisHomePage);
-				this.keyword = '';
-				this.getTabList();
-				this.getBannerList();
-				this.getCouponList();
-				this.getMyManager();
-				this.getNoticeList();
-				this.getSeckillTimeList();
-				if(this.tabList.length < 1) {
-					this.getClassflyList();
-				}
-				
-				this.dateInterval = setInterval(() => {
-				   this.nowDate = new Date();
-				}, 1000)
-			});
-			
-			uni.$on('onHide', (data) => {
-				if(this.homePage !== this.thisHomePage) return false;
-				
-				clearInterval(this.dateInterval);
-			})
-			
-		},
-		methods: {
-			// 搜索商品
-			searchSubmit() {
-				uni.navigateTo({
-					url: '/packageGoods/pages/search?keyword=' + this.keyword
-				})
-			},
-			
-			// 获取一级菜单
-			getTabList() {
-				this.$axios({
-					url: '/goods/category/list',
-					method: 'get',
-					params: {}
-				}).then(res => {
-					this.classifyList = res.data.slice(0, 9);
-					
-					uni.stopPullDownRefresh();
-				}).finally(res => {
-					this.isLoaded_classify = true;
-				})
-			},
-			
-			// 去分类列表
-			toClassifyLst(categoryId) {
-				uni.setStorageSync('categoryId', categoryId);
-				uni.switchTab({
-					url:'/pages/goods/classify'
-				})
-			},
-			
-			// 获取轮播图列表
-			getBannerList() {
-				this.$axios({
-					url: '/common/list/page',
-					method: 'get',
-					params: {
-						pageNum: 1,
-						pageSize: 10,
-						state: true
-					}
-				}).then(res => {
-					this.bannerList = res.data.records;
-				}).finally(res => {
-					this.isLoaded_banner = true;
-					uni.stopPullDownRefresh();
-				})
-			},
-			
-			// 切换广告图
-			changeBanner(e) {
-				this.bannerCurrent = e.detail.current;
-			},
-			
-			stopTouchMove() {
-				return true;
-			},
-			
-			// 获取可领优惠券列表
-			getCouponList() {
-				this.$axios({
-					url: '/coupon/list/all',
-					method: 'get',
-					params: {
-						userId: this.userId
-					}
-				}).then(res => {
-					this.couponList = res.data;
-					let couponList = res.data.filter(item => {
-						return item.obtainType === 1;
-					});
-					if(couponList && couponList.length > 0) {
-						this.couponDialogImgUrl = couponList[0].imgSrc;
-						this.isShow_coupon = true;
-					}
-				}).finally(res => {
-					this.isLoaded_coupon = true;
-				})
-			},
-			
-			// 处理优惠券
-			handleCoupon(item) {
-				if(item.obtainType == 0) {
-					return this.$toast('该优惠券不可领取');
-				}else if(item.obtainType == 1) {
-					this.$axios({
-						url: '/coupon/obtain',
-						method: 'get',
-						params: {
-							userId: this.userId,
-							couponId: item.couponId
-						}
-					}).then(res => {
-						this.$successToast('领取成功');
-						this.getCouponList();
-					})
-				}else if(item.obtainType == 2) {
-					uni.switchTab({
-					    url: '/pages/goods/classify'
-					});
-				}
-			},
-			
-			// 去可领取优惠券
-			toReceiveCoupon() {
-				uni.navigateTo({
-					url:'/pages/index/coupon'
-				})
-			},
-			
-			// 获取我的客户经理
-			getMyManager() {
-				this.$axios({
-					url: '/user/parent',
-					method: 'get',
-					params: {
-						userId: this.userId
-					}
-				}).then(res => {
-					if(res.data) {
-						this.myManagerDetail = res.data;
-					}
-				}).finally(res => {
-					this.isLoaded_manager = true;
-				})
-			},
-			
-			// 获取公告列表
-			getNoticeList() {
-				this.$axios({
-					url: '/renovation/settle/list',
-					method: 'get',
-					params: {
-						
-					}
-				}).then(res => {
-					if(res.data) {
-						res.data.forEach(item => {
-							item.workUserName = item.workUserName.slice(0, 1) + '师傅';
-						})
-						this.noticeList = res.data;
-					}
-				})
-			},
-			
-			// 拨打电话
-			callPhone(val) {
-				uni.makePhoneCall({
-				    phoneNumber: val
-				});
-			},
-			
-			findElem(array, attr, val) {
-			    for (var i = 0; i < array.length; i++) {
-			        if (array[i][attr] == val) {
-			            return i; //返回当前索引值
-			        }
-			    }
-			    return -1;
-			},
-			
-			// 计算倒计时
-			countTime() {
-				let endDatetime = this.endDatetime.replace(/\-/g, '/');
-				// console.log(endDatetime)
-			    var nowtime = new Date(),  //获取当前时间
-			        endtime = new Date(endDatetime);  //定义结束时间
-			    var lefttime = endtime.getTime() - nowtime.getTime(),  //距离结束时间的毫秒数
-					dd = Math.floor(lefttime/(1000*60*60)/24),  //计算天数
-			        hh = Math.floor(lefttime/(1000*60*60)),  //计算小时数
-			        mm = Math.floor(lefttime/(1000*60)%60),  //计算分钟数
-			        ss = Math.floor(lefttime/1000%60);  //计算秒数
-				// console.log(new Date(endDatetime))
-				function checkTime(i){
-					if (i<10) {
-						i = "0"+i;
-					}
-					return i;
-				}
-				setTimeout(() => {
-					this.countTime();
-				}, 1000);
-				this.countdownTime = (dd > 0 ? dd + '天 ' : '') + checkTime(hh) + ":" + checkTime(mm) + ":" + checkTime(ss);
-				// console.log(this.countdownTime)
-			},
-			
-			// 获取秒杀时间列表
-			getSeckillTimeList() {
-				this.$axios({
-					url: '/goods/sec/time',
-					method: 'get',
-					params: {}
-				}).then(res => {
-					if(res.data.length < 1) {return false;}
-					this.seckillTimeList = res.data;
-					this.endDatetime = this.seckillTimeList[0].endDatetime;
-					this.countdownText = this.seckillTimeList[0].type == 'jxz' ? '距离结束':'即将开始';
-					this.countTime();
-					this.getSeckillGoodsList();
-				}).finally(res => {
-					this.isLoaded_seckill = true;
-				})
-			},
-			
-			// 获取秒杀商品列表
-			getSeckillGoodsList(loadMore) {
-				if(this.seckillGoodsNoMore && loadMore)return;
-				if(!loadMore) {
-					this.seckillGoodsNoMore = false;
-					this.seckillGoodsPage = 1;
-				}
-				let secKillId = this.seckillTimeList[0].secKillId;
-				this.$axios({
-					url: '/goods/sec/goods/list',
-					method: 'get',
-					params: {
-						pageNum: this.seckillGoodsPage,
-						pageSize: 3,
-						secKillId: secKillId,
-					}
-				}).then(res => {
-					let _list = res.data.records;
-					let pageTotal = res.data.pages;
-					if(this.seckillGoodsPage >= pageTotal){
-						this.seckillGoodsNoMore = true;
-					}
-					if (_list.length) {
-						this.seckillGoodsPage += 1;
-					}
-					if (loadMore) {
-						this.seckillGoodsList = this.seckillGoodsList.concat(_list);
-					} else {
-						this.seckillGoodsList = _list;
-					}
-				})
-			},
-			
-			// 加载更多秒杀商品
-			loadMoreSeckillGoods() {
-				this.getSeckillGoodsList(true);
-			},
-			
-			// 进入秒杀商品详情
-			toSeckillGoodsDetail(id) {
-				if(!id) {
-					return false;
-				}
-				if(this.seckillTimeList[0].type == 'wks') {
-					return this.$toast('活动未开始');
-				}
-				uni.navigateTo({
-					url: '/packageGoods/pages/detail?id=' + id
-				})
-			},
-			
-			// 进入秒杀商品列表
-			toSeckillGoodsList() {
-				uni.navigateTo({
-					url: '/packageGoods/pages/seckill'
-				})
-			},
-			
-			// 获取推荐分类
-			getClassflyList() {
-				this.$axios({
-					url: '/renovation/category/list',
-					method: 'get',
-					params: {
-						pageNo: 1,
-						pageSize: 10
-					}
-				}).then(res => {
-					this.tabList = res.data.records;
-					this.tabCurrent = res.data.records.length > 0 ? res.data.records[0].goodsNewsCategoryId : 0;
-					this.getRecomList();
-					
-					uni.stopPullDownRefresh();
-				}).finally(res => {
-					this.isLoaded_newclassify = true;
-				})
-			},
-			
-			// 切换一级菜单
-			changeTab(current) {
-				this.tabCurrent = current;
-				this.getRecomList();
-				this.resize();
-			},
-			
-			// 获取好物推荐商品列表
-			getRecomList(loadMore) {
-				if(this.noMore && loadMore)return;
-				this.noMore = false
-				if(!loadMore){
-					this.pageNum = 1;
-				}else{
-					this.loading = true;
-				}
-				this.$axios({
-					url: '/renovation/goods/list',
-					method: 'get',
-					params: {
-						pageNo: this.pageNum,
-						pageSize: this.pageSize,
-						type: 1,
-						objId: this.tabCurrent,
-						sort: 1
-					},
-				}).then(res => {
-					res.data.records.forEach(item => {
-						if(item.logo && item.logoStartTime) {
-							item.isShowWater = this.$compareTime(item.logoStartTime, item.logoEndTime);
-						}else {
-							item.isShowWater = false;
-						}
-					})
-					
-					let _list = res.data.records;
-					let pageTotal = res.data.pages;
-					if(this.pageNum >= pageTotal){
-						this.noMore = true;
-					}
-					if (_list.length) {
-						this.pageNum += 1
-					}
-					if (loadMore) {
-						this.recomList = this.recomList.concat(_list);
-						this.loading = false;
-					} else {
-						this.recomList = _list;
-					}
-					
-					uni.stopPullDownRefresh();
-				})
-			},
-			
-			// 进入商品详情
-			toGoodsDetail(id) {
-				if(!id) {
-					return false;
-				}
-				uni.navigateTo({
-					url: '/packageGoods/pages/detail?id=' + id
-				})
-			},
-			
-			// 跳转小程序
-			toMiniProgram(appId, path) {
-				wx.navigateToMiniProgram({
-					appId,
-					path,
-					extraData: {},
-					envVersion: 'release',
-					success(res) {}
-				});
-			},
-			
-			setScrollLeft() {
-				// 当前活动tab的布局信息，有tab菜单的width和left(为元素左边界到父元素左边界的距离)等信息
-				const index = this.findElem(this.tabList, 'goodsNewsCategoryId', this.tabCurrent);
-				const tabRect = this.tabList[index]
-				// 累加得到当前item到左边的距离
-				const offsetLeft = this.tabList
-					.slice(0, index)
-					.reduce((total, curr) => {
-						return total + curr.rect.width
-					}, 0)
-				// 此处为屏幕宽度
-				const res = uni.getSystemInfoSync();
-				const windowWidth = res.windowWidth;
-				// 将活动的tabs-item移动到屏幕正中间，实际上是对scroll-view的移动
-				let scrollLeft = offsetLeft - (this.tabsRect.width - tabRect.rect.width) / 2 - (windowWidth - this.tabsRect.right) / 2 + this.tabsRect.left / 2
-				
-				// 这里做一个限制，限制scrollLeft的最大值为整个scroll-view宽度减去tabs组件的宽度
-				scrollLeft = Math.min(scrollLeft, this.scrollViewWidth - this.tabsRect.width)
-				this.scrollLeft = Math.max(0, scrollLeft)
-			},
-			// 获取所有标签的尺寸
-			resize() {
-				// 如果不存在list，则不处理
-				if(this.tabList.length === 0) {
-					return
-				}
-				Promise.all([this.getTabsRect(), this.getAllItemRect()]).then(([tabsRect, itemRect = []]) => {
-					this.tabsRect = tabsRect
-					this.scrollViewWidth = 0
-					itemRect.map((item, index) => {
-						// 计算scroll-view的宽度，这里
-						this.scrollViewWidth += item.width
-						// 另外计算每一个item的中心点X轴坐标
-						this.tabList[index].rect = item
-					})
-					// 获取了tabs的尺寸之后，设置滑块的位置
-					this.setScrollLeft()
-				})
-			},
-			// 获取导航菜单的尺寸
-			getTabsRect() {
-				return new Promise(resolve => {
-					this.queryRect('tabs-view').then(size => resolve(size))
-				})
-			},
-			// 获取所有标签的尺寸
-			getAllItemRect() {
-				return new Promise(resolve => {
-					const promiseAllArr = this.tabList.map((item, index) => this.queryRect(
-						`tabs-item-${index}`, true))
-					Promise.all(promiseAllArr).then(sizes => resolve(sizes))
-				})
-			},
-			// 获取各个标签的尺寸
-			queryRect(el, item) {
-				const query = uni.createSelectorQuery().in(this);
-				return new Promise(resolve => {
-					query.select(`.${el}`).boundingClientRect(data => {
-						resolve(data)
-					}).exec();
-				})
-			},
-			
-			// 关闭弹窗
-			closeDialog() {
-				this.$refs.dialog.step({
-					scale: 0
-				}, {
-					duration: 400
-				})
-				this.$refs.dialog.run(()=>{
-					this.isShowDialog = false;
-				})
-				this.$refs.dialogBtn.step({
-					scale: 0
-				}, {
-					duration: 400
-				})
-				this.$refs.dialogBtn.run(()=>{
-					this.isShowDialog = false;
-				})
-			},
-			
-			// 进入活动列表
-			toActivityList(type) {
-				if(type == 2) {
-					this.closeDialog();
-				}
-				uni.navigateTo({
-					url: '/packageGoods/pages/activity?type=' + type
-				})
-			},
-			
-			// 关闭弹窗
-			closeDialog2() {
-				this.$refs.dialog2.step({
-					scale: 0
-				}, {
-					duration: 400
-				})
-				this.$refs.dialog2.run(()=>{
-					this.isShowCouponDialog = false;
-				})
-				this.$refs.dialogBtn2.step({
-					scale: 0
-				}, {
-					duration: 400
-				})
-				this.$refs.dialogBtn2.run(()=>{
-					this.isShowCouponDialog = false;
-				})
-			},
-		}
-	}
-</script>
-
-<style lang="scss" scoped>
-	.top-container {
-		position: relative;
-		margin-bottom: 40rpx;
-		.bg {
-			display: block;
-			width: 750rpx;
-			position: absolute;
-			top: 0;
-			z-index: 0;
-		}
-		.content {
-			width: 710rpx;
-			padding: 0 20rpx;
-			position: relative;
-			z-index: 1;
-		}
-		.title {
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			color: #FFFFFF;
-			font-size: 36rpx;
-		}
-		.search {
-			background: #FFFFFF;
-			height: 64rpx;
-			display: flex;
-			align-items: center;
-			border-radius: 64rpx;
-			padding: 0 20rpx;
-			margin-top: 20rpx;
-			image {
-				width: 28rpx;
-				height: 28rpx;
-			}
-			input {
-				width: 100%;
-				padding-left: 15rpx;
-			}
-		}
-	}
-	.classify-container {
-		margin-top: 20rpx;
-		position: relative;
-		z-index: 1;
-		padding: 0 20rpx;
-		&.whiteBg {
-			.content {
-				background: #ffffff;
-				text {
-					color: #666666;
-				}
-			}
-		}
-		.content {
-			border-radius: 20rpx;
-			padding-top: 30rpx;
-			display: flex;
-			flex-wrap: wrap;
-			.item {
-				display: flex;
-				flex-direction: column;
-				align-items: center;
-				width: 142rpx;
-				margin-bottom: 30rpx;
-				image {
-					width: 78rpx;
-					height: 78rpx;
-					display: block;
-					border-radius: 30rpx;
-					overflow: hidden;
-				}
-				text {
-					font-size: 24rpx;
-					color: #333333;
-					margin-top: 10rpx;
-					width: 150rpx;
-					text-align: center;
-				}
-			}
-		}
-	}
-	.swiper-container {
-		position: relative;
-		margin-top: 20rpx;
-		swiper {
-			height: 350rpx;
-		}
-		image {
-			height: 350rpx;
-			width: 710rpx;
-			display: block;
-			margin: 0 auto 0;
-			border-radius: 15rpx;
-			overflow: hidden;
-		}
-		.dots-conatiner {
-			position: absolute;
-			width: 100%;
-			bottom: 40rpx;
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			.con {
-				border-radius: 4rpx;
-				overflow: hidden;
-				height: 4rpx;
-				background-color: rgba($color: #FFFFFF, $alpha: 0.3);
-			}
-			.dot {
-				width: 20rpx;
-				height: 4rpx;
-				background-color: #FFFFFF;
-				transition: all .3s;
-			}
-		}
-	}
-	.bigActivity-container {
-		position: relative;
-		z-index: 9;
-		margin-top: 40rpx;
-		padding: 0 20rpx;
-		image {
-			width: 710rpx;
-			display: block;
-		}
-	}
-	.other-container {
-		display: flex;
-		padding: 0 20rpx;
-		margin-top: 20rpx;
-		justify-content: space-between;
-		image {
-			display: block;
-			width: 350rpx;
-			height: 240rpx;
-			border-radius: 20rpx;
-		}
-	}
-	.smallActivity-container {
-		margin-top: 20rpx;
-		padding: 0 20rpx;
-		.content {
-			background: #FFFFFF;
-			border-radius: 20rpx;
-			.title {
-				font-size: 32rpx;
-				color: #333333;
-				line-height: 74rpx;
-				padding-left: 20rpx;
-				font-weight: 600;
-			}
-			.list {
-				display: flex;
-				flex-wrap: wrap;
-				padding: 0 20rpx;
-				.item {
-					width: 320rpx;
-					margin-right: 30rpx;
-					margin-bottom: 20rpx;
-					&:nth-child(2n) {
-						margin-right: 0;
-					}
-					image {
-						width: 320rpx;
-						height: 200rpx;
-						display: block;
-						border-radius: 20rpx;
-					}
-				}
-			}
-		}
-	}
-	.notice-container {
-		padding: 0 20rpx;
-		margin-top: 20rpx;
-		.content {
-			display: flex;
-			align-items: center;
-			height: 100rpx;
-			background: #FFFFFF;
-			border-radius: 20rpx;
-		}
-		.left{
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			width: 96rpx;
-			height: 48rpx;
-			margin-right: 20rpx;
-			border-right: 2rpx solid #E5E5E5;
-			image {
-				width: 60rpx;
-				height: 30rpx;
-				display: block;
-			}
-		}
-		.swiper{
-			height: 100rpx;
-			flex: 1;
-			padding-right: 20rpx;
-			::v-deep swiper-item {
-				display: block;
-				height: 100rpx;
-				width: 100%;
-				line-height: 100rpx;
-			}
-		}
-	}
-	.coupon-container {
-		position: relative;
-		margin-top: 20rpx;
-		padding: 0 20rpx;
-		.bg {
-			display: block;
-			width: 100%;
-		}
-		.list {
-			position: absolute;
-			top: 80rpx;
-			z-index: 1;
-		}
-		.list1 {
-			.item {
-				position: relative;
-				margin-bottom: 20rpx;
-				margin-left: 16rpx;
-				.cp {
-					width: 688rpx;
-					height: 178rpx;
-					display: block;
-				}
-				.content {
-					position: absolute;
-					left: 0;
-					top: 0;
-					width: 710rpx;
-					height: 160rpx;
-					display: flex;
-					align-items: center;
-					.left {
-						width: 210rpx;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						flex-direction: column;
-						.price {
-							font-size: 48rpx;
-							color: #FFFFFF;
-						}
-						.text {
-							color: #FFFFFF;
-							font-size: 28rpx;
-						}
-					}
-					.right {
-						display: flex;
-						align-items: center;
-						justify-content: space-between;
-						padding: 0 20rpx;
-						width: 470rpx;
-						height: 150rpx;
-						box-sizing: border-box;
-						.main {
-							width: 430rpx;
-							height: 150rpx;
-							padding: 16rpx 0 8rpx;
-							box-sizing: border-box;
-							display: flex;
-							flex-direction: column;
-							justify-content: space-between;
-							.row1 {
-								font-size: 28rpx;
-								line-height: 32rpx;
-								height: 64rpx;
-							}
-							.row2 {
-								font-size: 24rpx;
-								line-height: 28rpx;
-								color: #999999;
-								display: flex;
-								justify-content: space-between;
-								align-items: center;
-							}
-						}
-					}
-				}
-			}
-		}
-		.list2 {
-			display: flex;
-			.item {
-				position: relative;
-				margin-bottom: 20rpx;
-				&:first-child {
-					margin-left: 16rpx;
-				}
-				.cp {
-					width: 342rpx;
-					height: 308rpx;
-					display: block;
-				}
-				.content {
-					position: absolute;
-					left: 0;
-					top: 0;
-					width: 342rpx;
-					height: 328rpx;
-					display: flex;
-					flex-direction: column;
-					align-items: center;
-					.top {
-						width: 324rpx;
-						height: 130rpx;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						flex-direction: column;
-						.price {
-							font-size: 48rpx;
-							color: #FFFFFF;
-							line-height: 48rpx;
-							margin-top: 16rpx;
-						}
-						.text {
-							color: #FFFFFF;
-							font-size: 28rpx;
-							line-height: 28rpx;
-							margin-top: 10rpx;
-						}
-					}
-					.bottom {
-						width: 324rpx;
-						height: 160rpx;
-						padding: 16rpx;
-						box-sizing: border-box;
-						display: flex;
-						flex-direction: column;
-						justify-content: space-between;
-						align-items: center;
-						.name {
-							font-size: 28rpx;
-							text-align: left;
-							line-height: 32rpx;
-							width: 100%;
-						}
-						.date {
-							font-size: 24rpx;
-							color: #999999;
-							text-align: left;
-							width: 100%;
-							line-height: 28rpx;
-						}
-					}
-				}
-			}
-		}
-		.list3 {
-			display: flex;
-			align-items: center;
-			.left {
-				display: flex;
-				width: 630rpx;
-				overflow-x: scroll;
-			}
-			.right {
-				width: 80rpx;
-				display: flex;
-				justify-content: center;
-				.text {
-					width: 48rpx;
-					height: 200rpx;
-					border-radius: 48rpx;
-					background: #FFFFFF;
-					display: flex;
-					flex-direction: column;
-					align-items: center;
-					justify-content: center;
-					text {
-						font-size: 28rpx;
-						color: #FF3F42;
-						line-height: 32rpx;
-					}
-					image {
-						width: 32rpx;
-						height: 32rpx;
-						display: block;
-						flex-shrink: 0;
-						margin-top: 10rpx;
-					}
-				}
-			}
-			.item {
-				position: relative;
-				margin-bottom: 20rpx;
-				&:first-child {
-					margin-left: 16rpx;
-				}
-				.cp {
-					width: 278rpx;
-					height: 308rpx;
-					display: block;
-				}
-				.content {
-					position: absolute;
-					left: 0;
-					top: 0;
-					width: 278rpx;
-					height: 328rpx;
-					display: flex;
-					flex-direction: column;
-					align-items: center;
-					.top {
-						width: 260rpx;
-						height: 130rpx;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						flex-direction: column;
-						.price {
-							font-size: 48rpx;
-							color: #FFFFFF;
-							line-height: 48rpx;
-							margin-top: 16rpx;
-						}
-						.text {
-							color: #FFFFFF;
-							font-size: 28rpx;
-							line-height: 28rpx;
-							margin-top: 10rpx;
-						}
-					}
-					.bottom {
-						width: 260rpx;
-						height: 160rpx;
-						padding: 16rpx;
-						box-sizing: border-box;
-						display: flex;
-						flex-direction: column;
-						justify-content: space-between;
-						align-items: center;
-						.name {
-							font-size: 28rpx;
-							text-align: left;
-							line-height: 32rpx;
-							width: 100%;
-						}
-						.date {
-							font-size: 24rpx;
-							color: #999999;
-							text-align: left;
-							width: 100%;
-							line-height: 28rpx;
-						}
-					}
-				}
-			}
-		}
-		.button {
-			width: 120rpx;
-			height: 40rpx;
-			border-radius: 40rpx;
-			font-size: 24rpx;
-			flex-shrink: 0;
-			box-sizing: border-box;
-			display: flex;
-			justify-content: center;
-			align-items: center;
-			&.gary {
-				background: #AAAAAA;
-				color: #FFFFFF;
-				border: 1px solid #AAAAAA;
-			}
-			&.red {
-				background: #C434FF;
-				color: #FFFFFF;
-				border: 1px solid #C434FF;
-			}
-			&.white {
-				color: #FF3F42;
-				border: 1px solid #FF3F42;
-			}
-		}
-	}
-	.myManager-container {
-		padding: 0 20rpx;
-		.content {
-			display: flex;
-			justify-content: space-between;
-			align-items: center;
-			background: #FFFFFF;
-			border-radius: 20rpx;
-			padding: 20rpx;
-			.left {
-				display: flex;
-				align-items: center;
-				image {
-					width: 100rpx;
-					height: 100rpx;
-					border-radius: 50%;
-				}
-				.main {
-					font-size: 28rpx;
-					line-height: 48rpx;
-					margin-left: 20rpx;
-				}
-			}
-			.right {
-				width: 160rpx;
-				height: 60rpx;
-				line-height: 60rpx;
-				border-radius: 60rpx;
-				text-align: center;
-				font-size: 28rpx;
-				color: #E43B38;
-				border: 1px solid #E43B38;
-			}
-		}
-	}
-	.seckill2-container {
-		padding: 0 20rpx;
-		margin-top: 20rpx;
-		.content {
-			background: #FFFFFF;
-			border-radius: 20rpx;
-			padding: 0 20rpx;
-			.top {
-				display: flex;
-				justify-content: space-between;
-				align-items: center;
-				height: 86rpx;
-				.left {
-					display: flex;
-					align-items: center;
-					.title {
-						font-size: 32rpx;
-						color: #333333;
-						line-height: 74rpx;
-						font-weight: 600;
-					}
-					.timeout {
-						display: flex;
-						align-items: center;
-						margin-left: 20rpx;
-						border-radius: 40rpx;
-						height: 40rpx;
-						overflow: hidden;
-						.text {
-							font-size: 24rpx;
-							color: #FFFFFF;
-							width: 120rpx;
-							text-align: center;
-							background: #FF3F42;
-							border-radius: 40rpx;
-							position: relative;
-							z-index: 1;
-						}
-						.time {
-							padding: 0 20rpx 0 32rpx;
-							background: #FFD3B5;
-							font-size: 24rpx;
-							color: #FF3F42;
-							margin-left: -20rpx;
-							position: relative;
-							z-index: 0;
-						}
-					}
-				}
-				.right {
-					display: flex;
-					align-items: center;
-					font-size: 28rpx;
-					color: #999999;
-					image {
-						width: 12rpx;
-						height: 26rpx;
-						display: block;
-						margin-left: 8rpx;
-					}
-				}
-			}
-			.list {
-				display: flex;
-				.item {
-					width: 210rpx;
-					margin-right: 20rpx;
-					padding-bottom: 20rpx;
-					&:last-child {
-						margin-right: 0;
-					}
-					image {
-						width: 210rpx;
-						height: 210rpx;
-						display: block;
-					}
-					.title {
-						font-size: 28rpx;
-						color: #333333;
-						line-height: 36rpx;
-						font-weight: 600;
-						margin-top: 6rpx;
-					}
-					.price {
-						font-size: 32rpx;
-						color: #FF3F42;
-						line-height: 36rpx;
-						margin-top: 6rpx;
-					}
-				}
-			}
-		}
-	}
-	.recom-container {
-		margin-top: 20rpx;
-		.top {
-			.tab {
-				display: flex;
-				.item {
-					display: flex;
-					flex-direction: column;
-					align-items: center;
-					justify-content: center;
-					flex-shrink: 0;
-					width: 187.5rpx;
-					font-size: 28rpx;
-					color: #666666;
-					position: relative;
-					height: 130rpx;
-					.name {
-						font-size: 36rpx;
-						color: #333333;
-					}
-					.text {
-						font-size: 24rpx;
-						color: #666666;
-						margin-top: 8rpx;
-					}
-					&.current {
-						.name {
-							color: #FF3F42;
-							font-weight: 600;
-						}
-						.text {
-							color: #FF3F42;
-						}
-						&::after {
-							content: '';
-							display: block;
-							width: 48rpx;
-							height: 6rpx;
-							background: #FF3F42;
-							position: absolute;
-							bottom: 0;
-							left: 50%;
-							margin-left: -24rpx;
-						}
-					}
-				}
-			}
-		}
-	}
-	.dialog-container {
-		position: fixed;
-		z-index: 1000000;
-		top: 0;
-		left: 0;
-		width: 100%;
-		height: 100vh;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		flex-direction: column;
-		background: rgba($color: #000000, $alpha: .6);
-		.image {
-			width: 600rpx;
-			display: block;
-			border-radius: 20rpx;
-			margin-top: 40rpx;
-		}
-		.close {
-			width: 68rpx;
-			height: 68rpx;
-			display: block;
-			margin-top: 40rpx;
-		}
-	}
-	
-</style>
-<style>
-	::-webkit-scrollbar {
-		display: none;
-		width: 0 !important;
-		height: 0 !important;
-		-webkit-appearance: none;
-		background: transparent;
-		color: transparent;
-	}
+<template>
+	<view class="home-container">
+		
+		<block v-show="isLoaded">
+			<custom :bgColor="'bg-them'" :backColor="'#FFFFFF'" :isBack="false" v-show="scrollTop > 100">
+				<text slot="content" style="color: #FFFFFF; font-size: 36rpx;">{{configInfo.minAppName}}</text>
+			</custom>
+			
+			<view class="top-container">
+				<image src="@/static/home/top_bg_2.png" mode="widthFix" class="bg"></image>
+				
+				<view class="content">
+					<view class="title" :style="cuStyle">{{configInfo.minAppName}}</view>
+					
+					<view class="search">
+						<image src="/static/icon/search.png" class=""></image>
+						<input type="text" confirm-type="search" placeholder="搜索商品名称或型号" v-model="keyword" @confirm="searchSubmit">
+					</view>
+				</view>
+			</view>
+			
+			<view class="swiper-container" v-if="isShow_banner && bannerList.length > 0">
+				<swiper @change="changeBanner" :autoplay="true">
+					<block v-for="(item, index) in bannerList" :key='index'>
+						<swiper-item>
+							<image :src="item.imgSrc" mode="aspectFill" @tap="toMiniProgram(item.appId, item.linkUrl)" v-if="item.type === 2"></image>
+							<image :src="item.imgSrc" mode="aspectFill" @tap="toActivityList(item.goodsId)" v-if="item.type === 3"></image>
+							<image :src="item.imgSrc" mode="aspectFill" @tap="toGoodsDetail(item.goodsId)" v-else></image>
+						</swiper-item>
+					</block>
+				</swiper>
+				<view class="dots-conatiner">
+					<view class="con" :style="'width:'+(bannerList.length * 20)+'rpx;'" >
+						<view class="dot" :style=" 'transform:translateX('+ (bannerCurrent * 100) +'%)' "  ></view>
+					</view>
+				</view>
+			</view>
+			
+			<view class="bigActivity-container" v-if="isShow_activity1 && bigActivityImgUrl">
+				<image :src="bigActivityImgUrl" mode="widthFix" @tap="toActivityList(3)"></image>
+			</view>
+			
+			<view class="classify-container" v-if="isShow_classify"
+				:class="(!isShow_banner || (isShow_banner && bannerList.length < 1)) 
+					&& (!isShow_activity1 || (isShow_activity1 && !bigActivityImgUrl)) ? 'whiteBg':''">
+				<view class="content">
+					<block v-for="(item, index) in classifyList" :key='index'>
+						<view class="item" @tap="toClassifyLst(item.categoryId)">
+							<image :src="item.imgUrl" mode="aspectFill"></image>
+							<text class="ellipsis">{{item.name}}</text>
+						</view>
+					</block>
+					<view class="item" @tap="toClassifyLst(0)">
+						<image src="@/static/home/class_more2.png" mode="aspectFill"></image>
+						<text>更多分类</text>
+					</view>
+				</view>
+			</view>
+			
+			<view class="other-container" v-if="isShow_activity2 && leftActivityImgUrl && rightActivityImgUrl">
+				<image :src="leftActivityImgUrl" mode="aspectFill" @tap="toActivityList(4)"></image>
+				<image :src="rightActivityImgUrl" mode="aspectFill" @tap="toActivityList(5)"></image>
+			</view>
+			
+			<view class="smallActivity-container" v-if="isShow_special">
+				<view class="content">
+					<view class="title">专场专区</view>
+					<view class="list">
+						<view class="item">
+							<image :src="smallActivity1ImgUrl" mode="aspectFill" @tap="toActivityList(6)"></image>
+						</view>
+						<view class="item">
+							<image :src="smallActivity2ImgUrl" mode="aspectFill" @tap="toActivityList(7)"></image>
+						</view>
+						<view class="item">
+							<image :src="smallActivity3ImgUrl" mode="aspectFill" @tap="toActivityList(8)"></image>
+						</view>
+						<view class="item">
+							<image :src="smallActivity4ImgUrl" mode="aspectFill" @tap="toActivityList(9)"></image>
+						</view>
+					</view>
+				</view>
+			</view>
+			
+			<view class="coupon-container" v-if="isShow_coupon && couponList.length > 0">
+				<image src="@/static/home/cp_bg1.png" mode="widthFix" class="bg" v-if="couponList.length == 1"></image>
+				<image src="@/static/home/cp_bg2.png" mode="widthFix" class="bg" v-if="couponList.length > 1"></image>
+				
+				<view class="list list1" v-if="couponList.length == 1">
+					<block v-for="(item, index) in couponList" :key='index'>
+						<view class="item" @tap="handleCoupon(item)">
+							<image class="cp" src="@/static/home/coupon_bg1.png"></image>
+							<view class="content">
+								<view class="left">
+									<view class="price">¥{{item.couponValue}}</view>
+									<view class="text" v-if="item.couponType == 'SATISFY'">满{{item.orderAmount}}可用</view>
+								</view>
+								<view class="right">
+									<view class="main">
+										<view class="row1 ellipsis-2">{{item.couponName}}</view>
+										<view class="row2">
+											<view class="date" v-if="item.obtainType == 0 || item.obtainType == 1">
+												<view>领取时间：</view>
+												<view>{{item.obtainStartTime | dateToYYmmdd2}}-{{item.obtainEndTime | dateToYYmmdd2}}</view>
+											</view>
+											<view class="date" v-if="item.obtainType == 2">
+												<view>使用时间：</view>
+												<view>{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}</view>
+											</view>
+											<view class="button gary" v-if="item.obtainType == 0">待开始</view>
+											<view class="button red" v-if="item.obtainType == 1">立即领取</view>
+											<view class="button white" v-if="item.obtainType == 2">去使用</view>
+										</view>
+									</view>
+								</view>
+							</view>
+						</view>
+					</block>
+				</view>
+				
+				<view class="list list2" v-if="couponList.length == 2">
+					<block v-for="(item, index) in couponList" :key='index'>
+						<view class="item" @tap="handleCoupon(item)">
+							<image class="cp" src="@/static/home/coupon_bg2.png"></image>
+							<view class="content">
+								<view class="top">
+									<view class="price">¥{{item.couponValue}}</view>
+									<view class="text">满{{item.orderAmount}}可用</view>
+								</view>
+								<view class="bottom">
+									<view class="name ellipsis">{{item.couponName}}</view>
+									<view class="date ellipsis" v-if="item.obtainType == 0 || item.obtainType == 1">领取时间：{{item.obtainStartTime | dateToYYmmdd2}}-{{item.obtainEndTime | dateToYYmmdd2}}</view>
+									<view class="date ellipsis" v-if="item.obtainType == 2">使用时间：{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}</view>
+									<view class="button gary" v-if="item.obtainType == 0">待开始</view>
+									<view class="button red" v-if="item.obtainType == 1">立即领取</view>
+									<view class="button white" v-if="item.obtainType == 2">去使用</view>
+								</view>
+							</view>
+						</view>
+					</block>
+				</view>
+				
+				<view class="list list3" v-if="couponList.length > 2">
+					<view class="left">
+						<block v-for="(item, index) in couponList" :key='index'>
+							<view class="item" @tap="handleCoupon(item)">
+								<image class="cp" src="@/static/home/coupon_bg3.png"></image>
+								<view class="content">
+									<view class="top">
+										<view class="price">¥{{item.couponValue}}</view>
+										<view class="text">满{{item.orderAmount}}可用</view>
+									</view>
+									<view class="bottom">
+										<view class="name ellipsis">{{item.couponName}}</view>
+										<view class="date ellipsis" v-if="item.obtainType == 0 || item.obtainType == 1">领取时间：{{item.obtainStartTime | dateToYYmmdd2}}-{{item.obtainEndTime | dateToYYmmdd2}}</view>
+										<view class="date ellipsis" v-if="item.obtainType == 2">使用时间：{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}</view>
+										<view class="button gary" v-if="item.obtainType == 0">待开始</view>
+										<view class="button red" v-if="item.obtainType == 1">立即领取</view>
+										<view class="button white" v-if="item.obtainType == 2">去使用</view>
+									</view>
+								</view>
+							</view>
+						</block>
+					</view>
+					<view class="right">
+						<view class="text" @tap="toReceiveCoupon">
+							<text>查</text>
+							<text>看</text>
+							<text>更</text>
+							<text>多</text>
+							<image src="@/static/home/cp_more.png"></image>
+						</view>
+					</view>
+				</view>
+			</view>
+			
+			<view class="myManager-container" v-if="isShow_manager && myManagerDetail && !userInfo.promotionGroupLeader && !userInfo.type === 'SERVICE'">
+				<view class="content">
+					<view class="left">
+						<image :src="myManagerDetail.avatar" mode="aspectFill" v-if="myManagerDetail.avatar.indexOf('http') >= 0"></image>
+						<image :src="imageUrl + myManagerDetail.avatar" mode="aspectFill" v-else></image>
+						<view class="main">
+							<view>客户经理：{{myManagerDetail.workName}}</view>
+							<view>{{myManagerDetail.workPhone}}</view>
+						</view>
+					</view>
+					<view class="right" @tap="callPhone(myManagerDetail.workPhone)">拨打电话</view>
+				</view>
+			</view>
+			
+			<view class="notice-container" v-if="isShow_notice && noticeList.length > 0 && userInfo.type === 'SERVICE'">
+				<view class="content">
+					<view class="left">
+						<image src="@/static/home/notice.png" ></image>
+					</view>
+					<swiper class="swiper" :autoplay="true" :vertical="true" :circular="true" :disable-touch="true">
+						<block v-for="(item,index) in noticeList" :key='index' >
+							<swiper-item @touchmove.stop='stopTouchMove'>
+								<view class="ellipsis">{{item.workUserName}}成功分享商城，获得收益{{item.amount}}元</view>
+							</swiper-item>
+						</block>
+					</swiper>
+				</view>
+			</view>
+			
+			<view class="seckill2-container" v-if="isShow_seckill && seckillTimeList.length > 0">
+				<view class="content">
+					<view class="top">
+						<view class="left">
+							<view class="title">秒杀专区</view>
+							<view class="timeout">
+								<view class="text">{{countdownText}}</view>
+								<view class="time">{{countdownTime}}</view>
+							</view>
+						</view>
+						<view class="right" @tap="toSeckillGoodsList()">更多<image src="@/static/icon/right.png"></image></view>
+					</view>
+					<view class="list">
+						<block v-for="(item, index) in seckillGoodsList" :key='index'>
+							<view class="item" @tap="toSeckillGoodsDetail(item.goodsId)">
+								<image :src="item.imgUrl" mode="aspectFill"></image>
+								<view class="title ellipsis-2">{{item.goodsName}}</view>
+								<view class="price">¥{{item.price | numToFixed}}</view>
+							</view>
+						</block>
+					</view>
+				</view>
+			</view>
+			
+			<view class="recom-container" v-if="isShow_newclassify">
+				<view class="top">
+					<scroll-view
+						:scroll-x="true"
+						:scroll-left="scrollLeft"
+						scroll-with-animation
+						:show-scrollbar="false"
+						class="tabs-view"
+						ref="tabs-view">
+						<view class="tab">
+							<block v-for="(item, index) in tabList" :key='index'>
+								<view class="item" :ref="`tabs-item-${index}`" :class="[`tabs-item-${index}`, item.goodsNewsCategoryId == tabCurrent ? 'current':'']" @tap="changeTab(item.goodsNewsCategoryId)">
+									<view class="name">{{item.mainTitle}}</view>
+									<view class="text">{{item.subTitle}}</view>
+								</view>
+							</block>
+						</view>
+					</scroll-view>
+				</view>
+				<view class="goods-row-list" v-if="recomList.length > 0">
+					<block v-for="(item, index) in recomList" :key='index'>
+						<view class="item" @tap="toGoodsDetail(item.goodsId)">
+							<view class="image">
+								<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
+								<image :src="item.logo" mode="heightFix" class="water" v-if="item.isShowWater"></image>
+							</view>
+							
+							<view class="right">
+								<view>
+									<view class="title ellipsis-2">{{item.goodsName}}</view>
+									<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
+										<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
+									</view>
+								</view>
+								<view>
+									<view class="bottom">
+										<view class="price">
+											<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
+											<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
+										</view>
+										<view class="text">销量：{{item.soldNum}}</view>
+									</view>
+								</view>
+							</view>
+						</view>
+					</block>
+				</view>
+				<no-data v-if="!recomList.length" :showText="'暂无商品'"></no-data>
+				<loading-text v-if="recomList.length"  :loading="loading" :noMore="noMore" ></loading-text>
+			</view>
+			
+			<view class="dialog-container" v-if="isShow_dialog && dialogImgUrl && isShowDialog">
+				<uni-transition ref="dialog" mode-class="zoom-in" :duration="500" :show="isShow_dialog && dialogImgUrl && isShowDialog">
+					<image class="image" :src="dialogImgUrl" mode="widthFix" @tap="toActivityList(2)"></image>
+				</uni-transition>
+				<uni-transition ref="dialogBtn" mode-class="fade" :duration="500" :show="isShow_dialog && dialogImgUrl && isShowDialog">
+					<image class="close" src="@/static/icon/close4.png" @tap="closeDialog()"></image>
+				</uni-transition>
+			</view>
+			
+			<view class="dialog-container" v-if="couponDialogImgUrl && isShowCouponDialog">
+				<uni-transition ref="dialog2" mode-class="zoom-in" :duration="500" :show="couponDialogImgUrl && isShowCouponDialog">
+					<image class="image" :src="couponDialogImgUrl" mode="widthFix"></image>
+				</uni-transition>
+				<uni-transition ref="dialogBtn2" mode-class="fade" :duration="500" :show="couponDialogImgUrl && isShowCouponDialog">
+					<image class="close" src="@/static/icon/close4.png" @tap="closeDialog2()"></image>
+				</uni-transition>
+			</view>
+			
+			<modal-dialog showTitle="提示" showText="优惠券领取成功，请及时使用!" :isShowDialog="isShowCouponSuccessDialog" @cancel="isShowCouponSuccessDialog = false" :isShowConfirm="false"></modal-dialog>
+		</block>
+	</view>
+</template>
+
+<script>
+	import {mapState} from 'vuex';
+	
+	export default {
+		props:{
+			homePage: {
+				type: Number,
+				default: 0
+			},
+			templateInfo: {
+				type: Object,
+				default: {}
+			}
+		},
+		data() {
+			return {
+				thisHomePage: 2, // 当前首页页面模版
+				
+				imageUrl: this.$imageUrl,
+				configInfo: uni.getStorageSync('configInfo'),
+				isShow_dialog: false,
+				isShow_banner: false,
+				isShow_activity1: false,
+				isShow_classify: false,
+				isShow_activity2: false,
+				isShow_special: false,
+				isShow_seckill: false,
+				isShow_coupon: false,
+				isShow_manager: false,
+				isShow_notice: false,
+				isShow_newclassify: false,
+				
+				scrollTop: 0, // 滚动高度（用于控制自定义导航）
+				keyword: '', // 搜索关键词
+				classifyList: [], // 分类列表
+				bannerList: [], // 轮播图列表
+				bannerCurrent: 0, // 轮播图当前值
+				dialogImgUrl: '',
+				bigActivityImgUrl: '',
+				leftActivityImgUrl: '',
+				rightActivityImgUrl: '',
+				smallActivity1ImgUrl: '',
+				smallActivity2ImgUrl: '',
+				smallActivity3ImgUrl: '',
+				smallActivity4ImgUrl: '',
+				noticeList: [],
+				couponList: [], // 可领取优惠券列表
+				myManagerDetail: null, // 我的客户经理信息
+				seckillTimeList: [], // 秒杀时间段列表
+				seckillGoodsList: [], // 秒杀商品列表
+				seckillGoodsPage: 1, // 秒杀商品分页
+				seckillGoodsNoMore: false, // 
+				countdownText: '', // 倒计时文字
+				countdownTime: '', // 倒计时时间
+				endDatetime: '', // 倒计时结束时间
+				nowDate: null, // 当前时间
+				dateInterval: null, // 时间定时器
+				tabList: [], // 好物推荐分类列表
+				tabCurrent: 1, // 好物推荐分类当前值
+				pageNum: 1,
+				pageSize: 8,
+				recomList: [], // 好物推荐列表
+				noMore: false,
+				loading: false,
+				
+				isLoaded_banner: false,
+				isLoaded_coupon: false,
+				isLoaded_seckill: false,
+				isLoaded_classify: false,
+				isLoaded_manager: false,
+				isLoaded_classfly: false,
+				isLoaded_newclassify: false,
+				
+				scrollLeft: 50,
+				scrollViewWidth: 0,
+				tabsRect: {
+					left: 0
+				},
+				
+				isShowDialog: true,
+				
+				couponDialogImgUrl: '',
+				isShowCouponDialog: true,
+				isShowCouponSuccessDialog: false,
+			}
+		},
+		computed:{
+			cuStyle(){
+				return `height:${this.CustomBar-this.StatusBar}px; padding-top:${this.StatusBar}px;`
+			},
+			...mapState(['userInfo', 'isLogin', 'userId']),
+			isLoaded() {
+				uni.hideLoading();
+				return (!this.isShow_banner || (this.isShow_banner && this.isLoaded_banner))
+					&& (!this.isShow_coupon || (this.isShow_coupon && this.isLoaded_coupon))
+					&& (!this.isShow_seckill || (this.isShow_seckill && this.isLoaded_seckill))
+					&& (!this.isShow_classify || (this.isShow_classify && this.isLoaded_classify))
+					&& (!this.isShow_manager || (this.isShow_manager && this.isLoaded_manager))
+					&& (!this.isShow_newclassify || (this.isShow_newclassify && this.isLoaded_newclassify))
+			}
+		},
+		watch: {
+			nowDate() {
+				let hh = this.nowDate.getHours(),
+					mm = this.nowDate.getMinutes(),
+					ss = this.nowDate.getSeconds();
+				let hs = [10, 12, 15, 18, 20];
+				if(mm == 0 && ss == 0 && hs.indexOf(hh) >= 0) {
+					setTimeout(() => {
+						this.getSeckillTimeList();
+					}, 1000)
+				}
+			},
+			tabList() {
+				this.$nextTick(() => {
+					this.resize()
+				})
+			},
+			templateInfo: {
+				handler(newValue, oldValue) {
+					const templateInfo = this.templateInfo;
+					this.isShow_dialog = templateInfo.popupStatus;
+					this.isShow_banner = templateInfo.carouseStatus;
+					this.isShow_activity1 = templateInfo.active1Status;
+					this.isShow_classify = templateInfo.categoryStatus;
+					this.isShow_activity2 = templateInfo.active2Status;
+					this.isShow_special = templateInfo.onlyStatus;
+					this.isShow_seckill = templateInfo.killStatus;
+					this.isShow_coupon = templateInfo.couponStatus;
+					this.isShow_manager = templateInfo.customerStatus;
+					this.isShow_notice = templateInfo.notiveStatus;
+					this.isShow_newclassify = templateInfo.newsStatus;
+					
+					this.dialogImgUrl = templateInfo.popupImage;
+					this.bigActivityImgUrl = templateInfo.active1Image;
+					this.leftActivityImgUrl = templateInfo.active2LeftImage;
+					this.rightActivityImgUrl = templateInfo.active2RightImage;
+					this.smallActivity1ImgUrl = templateInfo.only1Image;
+					this.smallActivity2ImgUrl = templateInfo.only2Image;
+					this.smallActivity3ImgUrl = templateInfo.only3Image;
+					this.smallActivity4ImgUrl = templateInfo.only4Image;
+				},
+				immediate: true,
+				deep: true
+			}
+		},
+		mounted() {
+			uni.$on('onPageScroll', (data) => {
+				this.scrollTop = data;
+			});
+			
+			uni.$on('onPullDownRefresh', (data) => {
+				this.keyword = '';
+				this.getTabList();
+				this.getBannerList();
+				this.getCouponList();
+				this.getMyManager();
+				this.getNoticeList();
+				this.getSeckillTimeList();
+				this.getClassflyList();
+			});
+			
+			uni.$on('onReachBottom', (data) => {
+				this.getRecomList(1);
+			});
+			
+			uni.$on('onShow', (data) => {
+				console.log('onShow page ' + this.thisHomePage);
+				this.keyword = '';
+				this.getTabList();
+				this.getBannerList();
+				this.getCouponList();
+				this.getMyManager();
+				this.getNoticeList();
+				this.getSeckillTimeList();
+				if(this.tabList.length < 1) {
+					this.getClassflyList();
+				}
+				
+				this.dateInterval = setInterval(() => {
+				   this.nowDate = new Date();
+				}, 1000)
+			});
+			
+			uni.$on('onHide', (data) => {
+				if(this.homePage !== this.thisHomePage) return false;
+				
+				clearInterval(this.dateInterval);
+			})
+			
+		},
+		methods: {
+			// 搜索商品
+			searchSubmit() {
+				uni.navigateTo({
+					url: '/packageGoods/pages/search?keyword=' + this.keyword
+				})
+			},
+			
+			// 获取一级菜单
+			getTabList() {
+				this.$axios({
+					url: '/goods/category/list',
+					method: 'get',
+					params: {}
+				}).then(res => {
+					this.classifyList = res.data.slice(0, 9);
+					
+					uni.stopPullDownRefresh();
+				}).finally(res => {
+					this.isLoaded_classify = true;
+				})
+			},
+			
+			// 去分类列表
+			toClassifyLst(categoryId) {
+				uni.setStorageSync('categoryId', categoryId);
+				uni.switchTab({
+					url:'/pages/goods/classify'
+				})
+			},
+			
+			// 获取轮播图列表
+			getBannerList() {
+				this.$axios({
+					url: '/common/list/page',
+					method: 'get',
+					params: {
+						pageNum: 1,
+						pageSize: 10,
+						state: true
+					}
+				}).then(res => {
+					this.bannerList = res.data.records;
+				}).finally(res => {
+					this.isLoaded_banner = true;
+					uni.stopPullDownRefresh();
+				})
+			},
+			
+			// 切换广告图
+			changeBanner(e) {
+				this.bannerCurrent = e.detail.current;
+			},
+			
+			stopTouchMove() {
+				return true;
+			},
+			
+			// 获取可领优惠券列表
+			getCouponList() {
+				this.$axios({
+					url: '/coupon/list/all',
+					method: 'get',
+					params: {
+						userId: this.userId
+					}
+				}).then(res => {
+					this.couponList = res.data;
+					let couponList = res.data.filter(item => {
+						return item.obtainType === 1;
+					});
+					if(couponList && couponList.length > 0) {
+						this.couponDialogImgUrl = couponList[0].imgSrc;
+						this.isShow_coupon = true;
+					}
+				}).finally(res => {
+					this.isLoaded_coupon = true;
+				})
+			},
+			
+			// 处理优惠券
+			handleCoupon(item) {
+				if(item.obtainType == 0) {
+					return this.$toast('该优惠券不可领取');
+				}else if(item.obtainType == 1) {
+					this.$axios({
+						url: '/coupon/obtain',
+						method: 'get',
+						params: {
+							userId: this.userId,
+							couponId: item.couponId
+						}
+					}).then(res => {
+						this.$successToast('领取成功');
+						this.getCouponList();
+					})
+				}else if(item.obtainType == 2) {
+					uni.switchTab({
+					    url: '/pages/goods/classify'
+					});
+				}
+			},
+			
+			// 去可领取优惠券
+			toReceiveCoupon() {
+				uni.navigateTo({
+					url:'/pages/index/coupon'
+				})
+			},
+			
+			// 获取我的客户经理
+			getMyManager() {
+				this.$axios({
+					url: '/user/parent',
+					method: 'get',
+					params: {
+						userId: this.userId
+					}
+				}).then(res => {
+					if(res.data) {
+						this.myManagerDetail = res.data;
+					}
+				}).finally(res => {
+					this.isLoaded_manager = true;
+				})
+			},
+			
+			// 获取公告列表
+			getNoticeList() {
+				this.$axios({
+					url: '/renovation/settle/list',
+					method: 'get',
+					params: {
+						
+					}
+				}).then(res => {
+					if(res.data) {
+						res.data.forEach(item => {
+							item.workUserName = item.workUserName.slice(0, 1) + '师傅';
+						})
+						this.noticeList = res.data;
+					}
+				})
+			},
+			
+			// 拨打电话
+			callPhone(val) {
+				uni.makePhoneCall({
+				    phoneNumber: val
+				});
+			},
+			
+			findElem(array, attr, val) {
+			    for (var i = 0; i < array.length; i++) {
+			        if (array[i][attr] == val) {
+			            return i; //返回当前索引值
+			        }
+			    }
+			    return -1;
+			},
+			
+			// 计算倒计时
+			countTime() {
+				let endDatetime = this.endDatetime.replace(/\-/g, '/');
+				// console.log(endDatetime)
+			    var nowtime = new Date(),  //获取当前时间
+			        endtime = new Date(endDatetime);  //定义结束时间
+			    var lefttime = endtime.getTime() - nowtime.getTime(),  //距离结束时间的毫秒数
+					dd = Math.floor(lefttime/(1000*60*60)/24),  //计算天数
+			        hh = Math.floor(lefttime/(1000*60*60)),  //计算小时数
+			        mm = Math.floor(lefttime/(1000*60)%60),  //计算分钟数
+			        ss = Math.floor(lefttime/1000%60);  //计算秒数
+				// console.log(new Date(endDatetime))
+				function checkTime(i){
+					if (i<10) {
+						i = "0"+i;
+					}
+					return i;
+				}
+				setTimeout(() => {
+					this.countTime();
+				}, 1000);
+				this.countdownTime = (dd > 0 ? dd + '天 ' : '') + checkTime(hh) + ":" + checkTime(mm) + ":" + checkTime(ss);
+				// console.log(this.countdownTime)
+			},
+			
+			// 获取秒杀时间列表
+			getSeckillTimeList() {
+				this.$axios({
+					url: '/goods/sec/time',
+					method: 'get',
+					params: {}
+				}).then(res => {
+					if(res.data.length < 1) {return false;}
+					this.seckillTimeList = res.data;
+					this.endDatetime = this.seckillTimeList[0].endDatetime;
+					this.countdownText = this.seckillTimeList[0].type == 'jxz' ? '距离结束':'即将开始';
+					this.countTime();
+					this.getSeckillGoodsList();
+				}).finally(res => {
+					this.isLoaded_seckill = true;
+				})
+			},
+			
+			// 获取秒杀商品列表
+			getSeckillGoodsList(loadMore) {
+				if(this.seckillGoodsNoMore && loadMore)return;
+				if(!loadMore) {
+					this.seckillGoodsNoMore = false;
+					this.seckillGoodsPage = 1;
+				}
+				let secKillId = this.seckillTimeList[0].secKillId;
+				this.$axios({
+					url: '/goods/sec/goods/list',
+					method: 'get',
+					params: {
+						pageNum: this.seckillGoodsPage,
+						pageSize: 3,
+						secKillId: secKillId,
+					}
+				}).then(res => {
+					let _list = res.data.records;
+					let pageTotal = res.data.pages;
+					if(this.seckillGoodsPage >= pageTotal){
+						this.seckillGoodsNoMore = true;
+					}
+					if (_list.length) {
+						this.seckillGoodsPage += 1;
+					}
+					if (loadMore) {
+						this.seckillGoodsList = this.seckillGoodsList.concat(_list);
+					} else {
+						this.seckillGoodsList = _list;
+					}
+				})
+			},
+			
+			// 加载更多秒杀商品
+			loadMoreSeckillGoods() {
+				this.getSeckillGoodsList(true);
+			},
+			
+			// 进入秒杀商品详情
+			toSeckillGoodsDetail(id) {
+				if(!id) {
+					return false;
+				}
+				if(this.seckillTimeList[0].type == 'wks') {
+					return this.$toast('活动未开始');
+				}
+				uni.navigateTo({
+					url: '/packageGoods/pages/detail?id=' + id
+				})
+			},
+			
+			// 进入秒杀商品列表
+			toSeckillGoodsList() {
+				uni.navigateTo({
+					url: '/packageGoods/pages/seckill'
+				})
+			},
+			
+			// 获取推荐分类
+			getClassflyList() {
+				this.$axios({
+					url: '/renovation/category/list',
+					method: 'get',
+					params: {
+						pageNo: 1,
+						pageSize: 10
+					}
+				}).then(res => {
+					this.tabList = res.data.records;
+					this.tabCurrent = res.data.records.length > 0 ? res.data.records[0].goodsNewsCategoryId : 0;
+					this.getRecomList();
+					
+					uni.stopPullDownRefresh();
+				}).finally(res => {
+					this.isLoaded_newclassify = true;
+				})
+			},
+			
+			// 切换一级菜单
+			changeTab(current) {
+				this.tabCurrent = current;
+				this.getRecomList();
+				this.resize();
+			},
+			
+			// 获取好物推荐商品列表
+			getRecomList(loadMore) {
+				if(this.noMore && loadMore)return;
+				this.noMore = false
+				if(!loadMore){
+					this.pageNum = 1;
+				}else{
+					this.loading = true;
+				}
+				this.$axios({
+					url: '/renovation/goods/list',
+					method: 'get',
+					params: {
+						pageNo: this.pageNum,
+						pageSize: this.pageSize,
+						type: 1,
+						objId: this.tabCurrent,
+						sort: 1
+					},
+				}).then(res => {
+					res.data.records.forEach(item => {
+						if(item.logo && item.logoStartTime) {
+							item.isShowWater = this.$compareTime(item.logoStartTime, item.logoEndTime);
+						}else {
+							item.isShowWater = false;
+						}
+					})
+					
+					let _list = res.data.records;
+					let pageTotal = res.data.pages;
+					if(this.pageNum >= pageTotal){
+						this.noMore = true;
+					}
+					if (_list.length) {
+						this.pageNum += 1
+					}
+					if (loadMore) {
+						this.recomList = this.recomList.concat(_list);
+						this.loading = false;
+					} else {
+						this.recomList = _list;
+					}
+					
+					uni.stopPullDownRefresh();
+				})
+			},
+			
+			// 进入商品详情
+			toGoodsDetail(id) {
+				if(!id) {
+					return false;
+				}
+				uni.navigateTo({
+					url: '/packageGoods/pages/detail?id=' + id
+				})
+			},
+			
+			// 跳转小程序
+			toMiniProgram(appId, path) {
+				wx.navigateToMiniProgram({
+					appId,
+					path,
+					extraData: {},
+					envVersion: 'release',
+					success(res) {}
+				});
+			},
+			
+			setScrollLeft() {
+				// 当前活动tab的布局信息，有tab菜单的width和left(为元素左边界到父元素左边界的距离)等信息
+				const index = this.findElem(this.tabList, 'goodsNewsCategoryId', this.tabCurrent);
+				const tabRect = this.tabList[index]
+				// 累加得到当前item到左边的距离
+				const offsetLeft = this.tabList
+					.slice(0, index)
+					.reduce((total, curr) => {
+						return total + curr.rect.width
+					}, 0)
+				// 此处为屏幕宽度
+				const res = uni.getSystemInfoSync();
+				const windowWidth = res.windowWidth;
+				// 将活动的tabs-item移动到屏幕正中间，实际上是对scroll-view的移动
+				let scrollLeft = offsetLeft - (this.tabsRect.width - tabRect.rect.width) / 2 - (windowWidth - this.tabsRect.right) / 2 + this.tabsRect.left / 2
+				
+				// 这里做一个限制，限制scrollLeft的最大值为整个scroll-view宽度减去tabs组件的宽度
+				scrollLeft = Math.min(scrollLeft, this.scrollViewWidth - this.tabsRect.width)
+				this.scrollLeft = Math.max(0, scrollLeft)
+			},
+			// 获取所有标签的尺寸
+			resize() {
+				// 如果不存在list，则不处理
+				if(this.tabList.length === 0) {
+					return
+				}
+				Promise.all([this.getTabsRect(), this.getAllItemRect()]).then(([tabsRect, itemRect = []]) => {
+					this.tabsRect = tabsRect
+					this.scrollViewWidth = 0
+					itemRect.map((item, index) => {
+						// 计算scroll-view的宽度，这里
+						this.scrollViewWidth += item.width
+						// 另外计算每一个item的中心点X轴坐标
+						this.tabList[index].rect = item
+					})
+					// 获取了tabs的尺寸之后，设置滑块的位置
+					this.setScrollLeft()
+				})
+			},
+			// 获取导航菜单的尺寸
+			getTabsRect() {
+				return new Promise(resolve => {
+					this.queryRect('tabs-view').then(size => resolve(size))
+				})
+			},
+			// 获取所有标签的尺寸
+			getAllItemRect() {
+				return new Promise(resolve => {
+					const promiseAllArr = this.tabList.map((item, index) => this.queryRect(
+						`tabs-item-${index}`, true))
+					Promise.all(promiseAllArr).then(sizes => resolve(sizes))
+				})
+			},
+			// 获取各个标签的尺寸
+			queryRect(el, item) {
+				const query = uni.createSelectorQuery().in(this);
+				return new Promise(resolve => {
+					query.select(`.${el}`).boundingClientRect(data => {
+						resolve(data)
+					}).exec();
+				})
+			},
+			
+			// 关闭弹窗
+			closeDialog() {
+				this.$refs.dialog.step({
+					scale: 0
+				}, {
+					duration: 400
+				})
+				this.$refs.dialog.run(()=>{
+					this.isShowDialog = false;
+				})
+				this.$refs.dialogBtn.step({
+					scale: 0
+				}, {
+					duration: 400
+				})
+				this.$refs.dialogBtn.run(()=>{
+					this.isShowDialog = false;
+				})
+			},
+			
+			// 进入活动列表
+			toActivityList(type) {
+				if(type == 2) {
+					this.closeDialog();
+				}
+				uni.navigateTo({
+					url: '/packageGoods/pages/activity?type=' + type
+				})
+			},
+			
+			// 关闭弹窗
+			closeDialog2() {
+				this.$refs.dialog2.step({
+					scale: 0
+				}, {
+					duration: 400
+				})
+				this.$refs.dialog2.run(()=>{
+					this.isShowCouponDialog = false;
+				})
+				this.$refs.dialogBtn2.step({
+					scale: 0
+				}, {
+					duration: 400
+				})
+				this.$refs.dialogBtn2.run(()=>{
+					this.isShowCouponDialog = false;
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.top-container {
+		position: relative;
+		margin-bottom: 40rpx;
+		.bg {
+			display: block;
+			width: 750rpx;
+			position: absolute;
+			top: 0;
+			z-index: 0;
+		}
+		.content {
+			width: 710rpx;
+			padding: 0 20rpx;
+			position: relative;
+			z-index: 1;
+		}
+		.title {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			color: #FFFFFF;
+			font-size: 36rpx;
+		}
+		.search {
+			background: #FFFFFF;
+			height: 64rpx;
+			display: flex;
+			align-items: center;
+			border-radius: 64rpx;
+			padding: 0 20rpx;
+			margin-top: 20rpx;
+			image {
+				width: 28rpx;
+				height: 28rpx;
+			}
+			input {
+				width: 100%;
+				padding-left: 15rpx;
+			}
+		}
+	}
+	.classify-container {
+		margin-top: 20rpx;
+		position: relative;
+		z-index: 1;
+		padding: 0 20rpx;
+		&.whiteBg {
+			.content {
+				background: #ffffff;
+				text {
+					color: #666666;
+				}
+			}
+		}
+		.content {
+			border-radius: 20rpx;
+			padding-top: 30rpx;
+			display: flex;
+			flex-wrap: wrap;
+			.item {
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				width: 142rpx;
+				margin-bottom: 30rpx;
+				image {
+					width: 78rpx;
+					height: 78rpx;
+					display: block;
+					border-radius: 30rpx;
+					overflow: hidden;
+				}
+				text {
+					font-size: 24rpx;
+					color: #333333;
+					margin-top: 10rpx;
+					width: 150rpx;
+					text-align: center;
+				}
+			}
+		}
+	}
+	.swiper-container {
+		position: relative;
+		margin-top: 20rpx;
+		swiper {
+			height: 350rpx;
+		}
+		image {
+			height: 350rpx;
+			width: 710rpx;
+			display: block;
+			margin: 0 auto 0;
+			border-radius: 15rpx;
+			overflow: hidden;
+		}
+		.dots-conatiner {
+			position: absolute;
+			width: 100%;
+			bottom: 40rpx;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			.con {
+				border-radius: 4rpx;
+				overflow: hidden;
+				height: 4rpx;
+				background-color: rgba($color: #FFFFFF, $alpha: 0.3);
+			}
+			.dot {
+				width: 20rpx;
+				height: 4rpx;
+				background-color: #FFFFFF;
+				transition: all .3s;
+			}
+		}
+	}
+	.bigActivity-container {
+		position: relative;
+		z-index: 9;
+		margin-top: 40rpx;
+		padding: 0 20rpx;
+		image {
+			width: 710rpx;
+			display: block;
+		}
+	}
+	.other-container {
+		display: flex;
+		padding: 0 20rpx;
+		margin-top: 20rpx;
+		justify-content: space-between;
+		image {
+			display: block;
+			width: 350rpx;
+			height: 240rpx;
+			border-radius: 20rpx;
+		}
+	}
+	.smallActivity-container {
+		margin-top: 20rpx;
+		padding: 0 20rpx;
+		.content {
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			.title {
+				font-size: 32rpx;
+				color: #333333;
+				line-height: 74rpx;
+				padding-left: 20rpx;
+				font-weight: 600;
+			}
+			.list {
+				display: flex;
+				flex-wrap: wrap;
+				padding: 0 20rpx;
+				.item {
+					width: 320rpx;
+					margin-right: 30rpx;
+					margin-bottom: 20rpx;
+					&:nth-child(2n) {
+						margin-right: 0;
+					}
+					image {
+						width: 320rpx;
+						height: 200rpx;
+						display: block;
+						border-radius: 20rpx;
+					}
+				}
+			}
+		}
+	}
+	.notice-container {
+		padding: 0 20rpx;
+		margin-top: 20rpx;
+		.content {
+			display: flex;
+			align-items: center;
+			height: 100rpx;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+		}
+		.left{
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			width: 96rpx;
+			height: 48rpx;
+			margin-right: 20rpx;
+			border-right: 2rpx solid #E5E5E5;
+			image {
+				width: 60rpx;
+				height: 30rpx;
+				display: block;
+			}
+		}
+		.swiper{
+			height: 100rpx;
+			flex: 1;
+			padding-right: 20rpx;
+			::v-deep swiper-item {
+				display: block;
+				height: 100rpx;
+				width: 100%;
+				line-height: 100rpx;
+			}
+		}
+	}
+	.coupon-container {
+		position: relative;
+		margin-top: 20rpx;
+		padding: 0 20rpx;
+		.bg {
+			display: block;
+			width: 100%;
+		}
+		.list {
+			position: absolute;
+			top: 80rpx;
+			z-index: 1;
+		}
+		.list1 {
+			.item {
+				position: relative;
+				margin-bottom: 20rpx;
+				margin-left: 16rpx;
+				.cp {
+					width: 688rpx;
+					height: 178rpx;
+					display: block;
+				}
+				.content {
+					position: absolute;
+					left: 0;
+					top: 0;
+					width: 710rpx;
+					height: 160rpx;
+					display: flex;
+					align-items: center;
+					.left {
+						width: 210rpx;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+						flex-direction: column;
+						.price {
+							font-size: 48rpx;
+							color: #FFFFFF;
+						}
+						.text {
+							color: #FFFFFF;
+							font-size: 28rpx;
+						}
+					}
+					.right {
+						display: flex;
+						align-items: center;
+						justify-content: space-between;
+						padding: 0 20rpx;
+						width: 470rpx;
+						height: 150rpx;
+						box-sizing: border-box;
+						.main {
+							width: 430rpx;
+							height: 150rpx;
+							padding: 16rpx 0 8rpx;
+							box-sizing: border-box;
+							display: flex;
+							flex-direction: column;
+							justify-content: space-between;
+							.row1 {
+								font-size: 28rpx;
+								line-height: 32rpx;
+								height: 64rpx;
+							}
+							.row2 {
+								font-size: 24rpx;
+								line-height: 28rpx;
+								color: #999999;
+								display: flex;
+								justify-content: space-between;
+								align-items: center;
+							}
+						}
+					}
+				}
+			}
+		}
+		.list2 {
+			display: flex;
+			.item {
+				position: relative;
+				margin-bottom: 20rpx;
+				&:first-child {
+					margin-left: 16rpx;
+				}
+				.cp {
+					width: 342rpx;
+					height: 308rpx;
+					display: block;
+				}
+				.content {
+					position: absolute;
+					left: 0;
+					top: 0;
+					width: 342rpx;
+					height: 328rpx;
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					.top {
+						width: 324rpx;
+						height: 130rpx;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+						flex-direction: column;
+						.price {
+							font-size: 48rpx;
+							color: #FFFFFF;
+							line-height: 48rpx;
+							margin-top: 16rpx;
+						}
+						.text {
+							color: #FFFFFF;
+							font-size: 28rpx;
+							line-height: 28rpx;
+							margin-top: 10rpx;
+						}
+					}
+					.bottom {
+						width: 324rpx;
+						height: 160rpx;
+						padding: 16rpx;
+						box-sizing: border-box;
+						display: flex;
+						flex-direction: column;
+						justify-content: space-between;
+						align-items: center;
+						.name {
+							font-size: 28rpx;
+							text-align: left;
+							line-height: 32rpx;
+							width: 100%;
+						}
+						.date {
+							font-size: 24rpx;
+							color: #999999;
+							text-align: left;
+							width: 100%;
+							line-height: 28rpx;
+						}
+					}
+				}
+			}
+		}
+		.list3 {
+			display: flex;
+			align-items: center;
+			.left {
+				display: flex;
+				width: 630rpx;
+				overflow-x: scroll;
+			}
+			.right {
+				width: 80rpx;
+				display: flex;
+				justify-content: center;
+				.text {
+					width: 48rpx;
+					height: 200rpx;
+					border-radius: 48rpx;
+					background: #FFFFFF;
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					justify-content: center;
+					text {
+						font-size: 28rpx;
+						color: #FF3F42;
+						line-height: 32rpx;
+					}
+					image {
+						width: 32rpx;
+						height: 32rpx;
+						display: block;
+						flex-shrink: 0;
+						margin-top: 10rpx;
+					}
+				}
+			}
+			.item {
+				position: relative;
+				margin-bottom: 20rpx;
+				&:first-child {
+					margin-left: 16rpx;
+				}
+				.cp {
+					width: 278rpx;
+					height: 308rpx;
+					display: block;
+				}
+				.content {
+					position: absolute;
+					left: 0;
+					top: 0;
+					width: 278rpx;
+					height: 328rpx;
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					.top {
+						width: 260rpx;
+						height: 130rpx;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+						flex-direction: column;
+						.price {
+							font-size: 48rpx;
+							color: #FFFFFF;
+							line-height: 48rpx;
+							margin-top: 16rpx;
+						}
+						.text {
+							color: #FFFFFF;
+							font-size: 28rpx;
+							line-height: 28rpx;
+							margin-top: 10rpx;
+						}
+					}
+					.bottom {
+						width: 260rpx;
+						height: 160rpx;
+						padding: 16rpx;
+						box-sizing: border-box;
+						display: flex;
+						flex-direction: column;
+						justify-content: space-between;
+						align-items: center;
+						.name {
+							font-size: 28rpx;
+							text-align: left;
+							line-height: 32rpx;
+							width: 100%;
+						}
+						.date {
+							font-size: 24rpx;
+							color: #999999;
+							text-align: left;
+							width: 100%;
+							line-height: 28rpx;
+						}
+					}
+				}
+			}
+		}
+		.button {
+			width: 120rpx;
+			height: 40rpx;
+			border-radius: 40rpx;
+			font-size: 24rpx;
+			flex-shrink: 0;
+			box-sizing: border-box;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			&.gary {
+				background: #AAAAAA;
+				color: #FFFFFF;
+				border: 1px solid #AAAAAA;
+			}
+			&.red {
+				background: #C434FF;
+				color: #FFFFFF;
+				border: 1px solid #C434FF;
+			}
+			&.white {
+				color: #FF3F42;
+				border: 1px solid #FF3F42;
+			}
+		}
+	}
+	.myManager-container {
+		padding: 0 20rpx;
+		.content {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			padding: 20rpx;
+			.left {
+				display: flex;
+				align-items: center;
+				image {
+					width: 100rpx;
+					height: 100rpx;
+					border-radius: 50%;
+				}
+				.main {
+					font-size: 28rpx;
+					line-height: 48rpx;
+					margin-left: 20rpx;
+				}
+			}
+			.right {
+				width: 160rpx;
+				height: 60rpx;
+				line-height: 60rpx;
+				border-radius: 60rpx;
+				text-align: center;
+				font-size: 28rpx;
+				color: #E43B38;
+				border: 1px solid #E43B38;
+			}
+		}
+	}
+	.seckill2-container {
+		padding: 0 20rpx;
+		margin-top: 20rpx;
+		.content {
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			padding: 0 20rpx;
+			.top {
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				height: 86rpx;
+				.left {
+					display: flex;
+					align-items: center;
+					.title {
+						font-size: 32rpx;
+						color: #333333;
+						line-height: 74rpx;
+						font-weight: 600;
+					}
+					.timeout {
+						display: flex;
+						align-items: center;
+						margin-left: 20rpx;
+						border-radius: 40rpx;
+						height: 40rpx;
+						overflow: hidden;
+						.text {
+							font-size: 24rpx;
+							color: #FFFFFF;
+							width: 120rpx;
+							text-align: center;
+							background: #FF3F42;
+							border-radius: 40rpx;
+							position: relative;
+							z-index: 1;
+						}
+						.time {
+							padding: 0 20rpx 0 32rpx;
+							background: #FFD3B5;
+							font-size: 24rpx;
+							color: #FF3F42;
+							margin-left: -20rpx;
+							position: relative;
+							z-index: 0;
+						}
+					}
+				}
+				.right {
+					display: flex;
+					align-items: center;
+					font-size: 28rpx;
+					color: #999999;
+					image {
+						width: 12rpx;
+						height: 26rpx;
+						display: block;
+						margin-left: 8rpx;
+					}
+				}
+			}
+			.list {
+				display: flex;
+				.item {
+					width: 210rpx;
+					margin-right: 20rpx;
+					padding-bottom: 20rpx;
+					&:last-child {
+						margin-right: 0;
+					}
+					image {
+						width: 210rpx;
+						height: 210rpx;
+						display: block;
+					}
+					.title {
+						font-size: 28rpx;
+						color: #333333;
+						line-height: 36rpx;
+						font-weight: 600;
+						margin-top: 6rpx;
+					}
+					.price {
+						font-size: 32rpx;
+						color: #FF3F42;
+						line-height: 36rpx;
+						margin-top: 6rpx;
+					}
+				}
+			}
+		}
+	}
+	.recom-container {
+		margin-top: 20rpx;
+		.top {
+			.tab {
+				display: flex;
+				.item {
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					justify-content: center;
+					flex-shrink: 0;
+					width: 187.5rpx;
+					font-size: 28rpx;
+					color: #666666;
+					position: relative;
+					height: 130rpx;
+					.name {
+						font-size: 36rpx;
+						color: #333333;
+					}
+					.text {
+						font-size: 24rpx;
+						color: #666666;
+						margin-top: 8rpx;
+					}
+					&.current {
+						.name {
+							color: #FF3F42;
+							font-weight: 600;
+						}
+						.text {
+							color: #FF3F42;
+						}
+						&::after {
+							content: '';
+							display: block;
+							width: 48rpx;
+							height: 6rpx;
+							background: #FF3F42;
+							position: absolute;
+							bottom: 0;
+							left: 50%;
+							margin-left: -24rpx;
+						}
+					}
+				}
+			}
+		}
+	}
+	.dialog-container {
+		position: fixed;
+		z-index: 1000000;
+		top: 0;
+		left: 0;
+		width: 100%;
+		height: 100vh;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		flex-direction: column;
+		background: rgba($color: #000000, $alpha: .6);
+		.image {
+			width: 600rpx;
+			display: block;
+			border-radius: 20rpx;
+			margin-top: 40rpx;
+		}
+		.close {
+			width: 68rpx;
+			height: 68rpx;
+			display: block;
+			margin-top: 40rpx;
+		}
+	}
+	
+</style>
+<style>
+	::-webkit-scrollbar {
+		display: none;
+		width: 0 !important;
+		height: 0 !important;
+		-webkit-appearance: none;
+		background: transparent;
+		color: transparent;
+	}
 </style>

pages/index/components/home-page-c.vue

@@ -1,1781 +1,1781 @@
-<template>
-	<view class="home-container">
-		
-		<block v-show="isLoaded">
-			<custom :bgColor="'bg-them'" :backColor="'#FFFFFF'" :isBack="false" v-show="scrollTop > 100">
-				<text slot="content" style="color: #FFFFFF; font-size: 36rpx;">{{configInfo.minAppName}}</text>
-			</custom>
-			
-			<view class="top-container">
-				<image src="@/static/home/top_bg_2.png" mode="widthFix" class="bg"></image>
-				
-				<view class="content">
-					<view class="title" :style="cuStyle">{{configInfo.minAppName}}</view>
-					
-					<view class="search">
-						<image src="/static/icon/search.png" class=""></image>
-						<input type="text" confirm-type="search" placeholder="搜索商品名称或型号" v-model="keyword" @confirm="searchSubmit">
-					</view>
-				</view>
-			</view>
-			
-			<view class="swiper-container" v-if="isShow_banner && bannerList.length > 0">
-				<swiper @change="changeBanner" :autoplay="true">
-					<block v-for="(item, index) in bannerList" :key='index'>
-						<swiper-item>
-							<image :src="item.imgSrc" mode="aspectFill" @tap="toMiniProgram(item.appId, item.linkUrl)" v-if="item.type === 2"></image>
-							<image :src="item.imgSrc" mode="aspectFill" @tap="toActivityList(item.goodsId)" v-if="item.type === 3"></image>
-							<image :src="item.imgSrc" mode="aspectFill" @tap="toGoodsDetail(item.goodsId)" v-else></image>
-						</swiper-item>
-					</block>
-				</swiper>
-				<view class="dots-conatiner">
-					<view class="con" :style="'width:'+(bannerList.length * 20)+'rpx;'" >
-						<view class="dot" :style=" 'transform:translateX('+ (bannerCurrent * 100) +'%)' "  ></view>
-					</view>
-				</view>
-			</view>
-			
-			<view class="bigActivity-container" v-if="isShow_activity1 && bigActivityImgUrl">
-				<image :src="bigActivityImgUrl" mode="widthFix" @tap="toActivityList(3)"></image>
-			</view>
-			
-			<view class="classify-container" v-if="isShow_classify"
-				:class="(!isShow_banner || (isShow_banner && bannerList.length < 1)) 
-					&& (!isShow_activity1 || (isShow_activity1 && !bigActivityImgUrl)) ? 'whiteBg':''">
-				<view class="content">
-					<block v-for="(item, index) in classifyList" :key='index'>
-						<view class="item" @tap="toClassifyLst(item.categoryId)">
-							<image :src="item.imgUrl" mode="aspectFill"></image>
-							<text class="ellipsis">{{item.name}}</text>
-						</view>
-					</block>
-					<view class="item" @tap="toClassifyLst(0)">
-						<image src="@/static/home/class_more2.png" mode="aspectFill"></image>
-						<text>更多分类</text>
-					</view>
-				</view>
-			</view>
-			
-			<view class="smallActivity-container" v-if="isShow_activity2 && leftActivityImgUrl && rightActivityImgUrl">
-				<view class="content">
-					<view class="list">
-						<view class="item">
-							<image :src="leftActivityImgUrl" mode="aspectFill" @tap="toActivityList(4)"></image>
-						</view>
-						<view class="item">
-							<image :src="rightActivityImgUrl" mode="aspectFill" @tap="toActivityList(5)"></image>
-						</view>
-					</view>
-				</view>
-			</view>
-			
-			<view class="smallActivity-container" v-if="isShow_special">
-				<view class="content">
-					<view class="list">
-						<view class="item">
-							<image :src="smallActivity1ImgUrl" mode="aspectFill" @tap="toActivityList(6)"></image>
-						</view>
-						<view class="item">
-							<image :src="smallActivity2ImgUrl" mode="aspectFill" @tap="toActivityList(7)"></image>
-						</view>
-						<view class="item">
-							<image :src="smallActivity3ImgUrl" mode="aspectFill" @tap="toActivityList(8)"></image>
-						</view>
-						<view class="item">
-							<image :src="smallActivity4ImgUrl" mode="aspectFill" @tap="toActivityList(9)"></image>
-						</view>
-					</view>
-				</view>
-			</view>
-			
-			<view class="coupon-container" v-if="isShow_coupon && couponList.length > 0">
-				<image src="@/static/home/cp_bg1.png" mode="widthFix" class="bg" v-if="couponList.length == 1"></image>
-				<image src="@/static/home/cp_bg2.png" mode="widthFix" class="bg" v-if="couponList.length > 1"></image>
-				
-				<view class="list list1" v-if="couponList.length == 1">
-					<block v-for="(item, index) in couponList" :key='index'>
-						<view class="item" @tap="handleCoupon(item)">
-							<image class="cp" src="@/static/home/coupon_bg1.png"></image>
-							<view class="content">
-								<view class="left">
-									<view class="price">¥{{item.couponValue}}</view>
-									<view class="text" v-if="item.couponType == 'SATISFY'">满{{item.orderAmount}}可用</view>
-								</view>
-								<view class="right">
-									<view class="main">
-										<view class="row1 ellipsis-2">{{item.couponName}}</view>
-										<view class="row2">
-											<view class="date" v-if="item.obtainType == 0 || item.obtainType == 1">
-												<view>领取时间：</view>
-												<view>{{item.obtainStartTime | dateToYYmmdd2}}-{{item.obtainEndTime | dateToYYmmdd2}}</view>
-											</view>
-											<view class="date" v-if="item.obtainType == 2">
-												<view>使用时间：</view>
-												<view>{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}</view>
-											</view>
-											<view class="button gary" v-if="item.obtainType == 0">待开始</view>
-											<view class="button red" v-if="item.obtainType == 1">立即领取</view>
-											<view class="button white" v-if="item.obtainType == 2">去使用</view>
-										</view>
-									</view>
-								</view>
-							</view>
-						</view>
-					</block>
-				</view>
-				
-				<view class="list list2" v-if="couponList.length == 2">
-					<block v-for="(item, index) in couponList" :key='index'>
-						<view class="item" @tap="handleCoupon(item)">
-							<image class="cp" src="@/static/home/coupon_bg2.png"></image>
-							<view class="content">
-								<view class="top">
-									<view class="price">¥{{item.couponValue}}</view>
-									<view class="text">满{{item.orderAmount}}可用</view>
-								</view>
-								<view class="bottom">
-									<view class="name ellipsis">{{item.couponName}}</view>
-									<view class="date ellipsis" v-if="item.obtainType == 0 || item.obtainType == 1">领取时间：{{item.obtainStartTime | dateToYYmmdd2}}-{{item.obtainEndTime | dateToYYmmdd2}}</view>
-									<view class="date ellipsis" v-if="item.obtainType == 2">使用时间：{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}</view>
-									<view class="button gary" v-if="item.obtainType == 0">待开始</view>
-									<view class="button red" v-if="item.obtainType == 1">立即领取</view>
-									<view class="button white" v-if="item.obtainType == 2">去使用</view>
-								</view>
-							</view>
-						</view>
-					</block>
-				</view>
-				
-				<view class="list list3" v-if="couponList.length > 2">
-					<view class="left">
-						<block v-for="(item, index) in couponList" :key='index'>
-							<view class="item" @tap="handleCoupon(item)">
-								<image class="cp" src="@/static/home/coupon_bg3.png"></image>
-								<view class="content">
-									<view class="top">
-										<view class="price">¥{{item.couponValue}}</view>
-										<view class="text">满{{item.orderAmount}}可用</view>
-									</view>
-									<view class="bottom">
-										<view class="name ellipsis">{{item.couponName}}</view>
-										<view class="date ellipsis" v-if="item.obtainType == 0 || item.obtainType == 1">领取时间：{{item.obtainStartTime | dateToYYmmdd2}}-{{item.obtainEndTime | dateToYYmmdd2}}</view>
-										<view class="date ellipsis" v-if="item.obtainType == 2">使用时间：{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}</view>
-										<view class="button gary" v-if="item.obtainType == 0">待开始</view>
-										<view class="button red" v-if="item.obtainType == 1">立即领取</view>
-										<view class="button white" v-if="item.obtainType == 2">去使用</view>
-									</view>
-								</view>
-							</view>
-						</block>
-					</view>
-					<view class="right">
-						<view class="text" @tap="toReceiveCoupon">
-							<text>查</text>
-							<text>看</text>
-							<text>更</text>
-							<text>多</text>
-							<image src="@/static/home/cp_more.png"></image>
-						</view>
-					</view>
-				</view>
-			</view>
-			
-			<view class="myManager-container" v-if="isShow_manager && myManagerDetail && !userInfo.promotionGroupLeader && !userInfo.type === 'SERVICE'">
-				<view class="content">
-					<view class="left">
-						<image :src="myManagerDetail.avatar" mode="aspectFill" v-if="myManagerDetail.avatar.indexOf('http') >= 0"></image>
-						<image :src="imageUrl + myManagerDetail.avatar" mode="aspectFill" v-else></image>
-						<view class="main">
-							<view>客户经理：{{myManagerDetail.workName}}</view>
-							<view>{{myManagerDetail.workPhone}}</view>
-						</view>
-					</view>
-					<view class="right" @tap="callPhone(myManagerDetail.workPhone)">拨打电话</view>
-				</view>
-			</view>
-			
-			<view class="notice-container" v-if="isShow_notice && noticeList.length > 0 && userInfo.type === 'SERVICE'">
-				<view class="content">
-					<view class="left">
-						<image src="@/static/home/notice.png" ></image>
-					</view>
-					<swiper class="swiper" :autoplay="true" :vertical="true" :circular="true" :disable-touch="true">
-						<block v-for="(item,index) in noticeList" :key='index' >
-							<swiper-item @touchmove.stop='stopTouchMove'>
-								<view class="ellipsis">{{item.workUserName}}成功分享商城，获得收益{{item.amount}}元</view>
-							</swiper-item>
-						</block>
-					</swiper>
-				</view>
-			</view>
-			
-			<view class="seckill2-container" v-if="isShow_seckill && seckillTimeList.length > 0">
-				<view class="content">
-					<view class="top">
-						<view class="left">
-							<view class="title">秒杀专区</view>
-							<view class="timeout">
-								<view class="text">{{countdownText}}</view>
-								<view class="time">{{countdownTime}}</view>
-							</view>
-						</view>
-						<view class="right" @tap="toSeckillGoodsList()">更多<image src="@/static/icon/right.png"></image></view>
-					</view>
-					<view class="list">
-						<block v-for="(item, index) in seckillGoodsList" :key='index'>
-							<view class="item" @tap="toSeckillGoodsDetail(item.goodsId)">
-								<image :src="item.imgUrl" mode="aspectFill"></image>
-								<view class="title ellipsis-2">{{item.goodsName}}</view>
-								<view class="price">¥{{item.price | numToFixed}}</view>
-							</view>
-						</block>
-					</view>
-				</view>
-			</view>
-			
-			<view class="selected-container" v-if="isShow_selected">
-				<view class="content">
-					<view class="title">专题精选</view>
-					<view class="list">
-						<view class="item">
-							<image :src="selected1ImgUrl" mode="aspectFill" @tap="toActivityList(10)"></image>
-							<view class="text1 ellipsis">{{selected1Title1}}</view>
-							<view class="text2 ellipsis">{{selected1Title2}}</view>
-						</view>
-						<view class="item">
-							<image :src="selected2ImgUrl" mode="aspectFill" @tap="toActivityList(11)"></image>
-							<view class="text1 ellipsis">{{selected2Title1}}</view>
-							<view class="text2 ellipsis">{{selected2Title2}}</view>
-						</view>
-						<view class="item">
-							<image :src="selected3ImgUrl" mode="aspectFill" @tap="toActivityList(12)"></image>
-							<view class="text1 ellipsis">{{selected3Title1}}</view>
-							<view class="text2 ellipsis">{{selected3Title2}}</view>
-						</view>
-					</view>
-				</view>
-			</view>
-			
-			<view class="recom-container" v-if="isShow_newclassify">
-				<view class="top">
-					<scroll-view
-						:scroll-x="true"
-						:scroll-left="scrollLeft"
-						scroll-with-animation
-						:show-scrollbar="false"
-						class="tabs-view"
-						ref="tabs-view">
-						<view class="tab">
-							<block v-for="(item, index) in tabList" :key='index'>
-								<view class="item" :ref="`tabs-item-${index}`" :class="[`tabs-item-${index}`, item.goodsNewsCategoryId == tabCurrent ? 'current':'']" @tap="changeTab(item.goodsNewsCategoryId)">
-									<view class="name">{{item.mainTitle}}</view>
-									<view class="text">{{item.subTitle}}</view>
-								</view>
-							</block>
-						</view>
-					</scroll-view>
-				</view>
-				<view class="goods-row-list" v-if="recomList.length > 0">
-					<block v-for="(item, index) in recomList" :key='index'>
-						<view class="item" @tap="toGoodsDetail(item.goodsId)">
-							<view class="image">
-								<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
-								<image :src="item.logo" mode="heightFix" class="water" v-if="item.isShowWater"></image>
-							</view>
-							
-							<view class="right">
-								<view>
-									<view class="title ellipsis-2">{{item.goodsName}}</view>
-									<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
-										<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
-									</view>
-								</view>
-								<view>
-									<view class="bottom">
-										<view class="price">
-											<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
-											<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
-										</view>
-										<view class="text">销量：{{item.soldNum}}</view>
-									</view>
-								</view>
-							</view>
-						</view>
-					</block>
-				</view>
-				<no-data v-if="!recomList.length" :showText="'暂无商品'"></no-data>
-				<loading-text v-if="recomList.length"  :loading="loading" :noMore="noMore" ></loading-text>
-			</view>
-			
-			<view class="dialog-container" v-if="isShow_dialog && dialogImgUrl && isShowDialog">
-				<uni-transition ref="dialog" mode-class="zoom-in" :duration="500" :show="isShow_dialog && dialogImgUrl && isShowDialog">
-					<image class="image" :src="dialogImgUrl" mode="widthFix" @tap="toActivityList(2)"></image>
-				</uni-transition>
-				<uni-transition ref="dialogBtn" mode-class="fade" :duration="500" :show="isShow_dialog && dialogImgUrl && isShowDialog">
-					<image class="close" src="@/static/icon/close4.png" @tap="closeDialog()"></image>
-				</uni-transition>
-			</view>
-			
-			<view class="bottom-container" v-if="isShow_bottom && bottomImgUrl && isShowBottom">
-				<uni-transition ref="bottomBtn" mode-class="fade" :duration="500" :show="isShow_bottom && bottomImgUrl && isShowBottom">
-					<image class="close" src="@/static/icon/close5.png" @tap="closeBottom()"></image>
-				</uni-transition>
-				<uni-transition ref="bottom" mode-class="zoom-in" :duration="500" :show="isShow_bottom && bottomImgUrl && isShowBottom">
-					<image class="image" :src="bottomImgUrl" mode="aspectFill" @tap="toActivityList(13)"></image>
-				</uni-transition>
-			</view>
-		</block>
-	</view>
-</template>
-
-<script>
-	import {mapState} from 'vuex';
-	
-	export default {
-		props:{
-			homePage: {
-				type: Number,
-				default: 0
-			},
-			templateInfo: {
-				type: Object,
-				default: {}
-			}
-		},
-		data() {
-			return {
-				thisHomePage: 3, // 当前首页页面模版
-				
-				imageUrl: this.$imageUrl,
-				configInfo: uni.getStorageSync('configInfo'),
-				isShow_dialog: false,
-				isShow_banner: false,
-				isShow_activity1: false,
-				isShow_classify: false,
-				isShow_activity2: false,
-				isShow_special: false,
-				isShow_seckill: false,
-				isShow_coupon: false,
-				isShow_manager: false,
-				isShow_notice: false,
-				isShow_newclassify: false,
-				isShow_selected: false,
-				isShow_bottom: false,
-				
-				scrollTop: 0, // 滚动高度（用于控制自定义导航）
-				keyword: '', // 搜索关键词
-				classifyList: [], // 分类列表
-				bannerList: [], // 轮播图列表
-				bannerCurrent: 0, // 轮播图当前值
-				dialogImgUrl: '',
-				bigActivityImgUrl: '',
-				leftActivityImgUrl: '',
-				rightActivityImgUrl: '',
-				smallActivity1ImgUrl: '',
-				smallActivity2ImgUrl: '',
-				smallActivity3ImgUrl: '',
-				smallActivity4ImgUrl: '',
-				selected1ImgUrl: '',
-				selected2ImgUrl: '',
-				selected3ImgUrl: '',
-				selected1Title1: '',
-				selected2Title1: '',
-				selected3Title1: '',
-				selected1Title2: '',
-				selected2Title2: '',
-				selected3Title2: '',
-				bottomImgUrl: '',
-				noticeList: [],
-				couponList: [], // 可领取优惠券列表
-				myManagerDetail: null, // 我的客户经理信息
-				seckillTimeList: [], // 秒杀时间段列表
-				seckillGoodsList: [], // 秒杀商品列表
-				seckillGoodsPage: 1, // 秒杀商品分页
-				seckillGoodsNoMore: false, // 
-				countdownText: '', // 倒计时文字
-				countdownTime: '', // 倒计时时间
-				endDatetime: '', // 倒计时结束时间
-				nowDate: null, // 当前时间
-				dateInterval: null, // 时间定时器
-				tabList: [], // 好物推荐分类列表
-				tabCurrent: 1, // 好物推荐分类当前值
-				pageNum: 1,
-				pageSize: 8,
-				recomList: [], // 好物推荐列表
-				noMore: false,
-				loading: false,
-				
-				isLoaded_banner: false,
-				isLoaded_coupon: false,
-				isLoaded_seckill: false,
-				isLoaded_classify: false,
-				isLoaded_manager: false,
-				isLoaded_classfly: false,
-				isLoaded_newclassify: false,
-				
-				scrollLeft: 50,
-				scrollViewWidth: 0,
-				tabsRect: {
-					left: 0
-				},
-				
-				isShowDialog: true,
-				isShowBottom: true,
-			}
-		},
-		computed:{
-			cuStyle(){
-				return `height:${this.CustomBar-this.StatusBar}px; padding-top:${this.StatusBar}px;`
-			},
-			...mapState(['userInfo', 'isLogin', 'userId']),
-			isLoaded() {
-				uni.hideLoading();
-				return (!this.isShow_banner || (this.isShow_banner && this.isLoaded_banner))
-					&& (!this.isShow_coupon || (this.isShow_coupon && this.isLoaded_coupon))
-					&& (!this.isShow_seckill || (this.isShow_seckill && this.isLoaded_seckill))
-					&& (!this.isShow_classify || (this.isShow_classify && this.isLoaded_classify))
-					&& (!this.isShow_manager || (this.isShow_manager && this.isLoaded_manager))
-					&& (!this.isShow_newclassify || (this.isShow_newclassify && this.isLoaded_newclassify))
-			}
-		},
-		watch: {
-			nowDate() {
-				let hh = this.nowDate.getHours(),
-					mm = this.nowDate.getMinutes(),
-					ss = this.nowDate.getSeconds();
-				let hs = [10, 12, 15, 18, 20];
-				if(mm == 0 && ss == 0 && hs.indexOf(hh) >= 0) {
-					setTimeout(() => {
-						this.getSeckillTimeList();
-					}, 1000)
-				}
-			},
-			tabList() {
-				this.$nextTick(() => {
-					this.resize()
-				})
-			},
-			templateInfo: {
-				handler(newValue, oldValue) {
-					const templateInfo = this.templateInfo;
-					this.isShow_dialog = templateInfo.popupStatus;
-					this.isShow_banner = templateInfo.carouseStatus;
-					this.isShow_activity1 = templateInfo.active1Status;
-					this.isShow_classify = templateInfo.categoryStatus;
-					this.isShow_activity2 = templateInfo.active2Status;
-					this.isShow_special = templateInfo.onlyStatus;
-					this.isShow_seckill = templateInfo.killStatus;
-					this.isShow_coupon = templateInfo.couponStatus;
-					this.isShow_manager = templateInfo.customerStatus;
-					this.isShow_notice = templateInfo.notiveStatus;
-					this.isShow_newclassify = templateInfo.newsStatus;
-					this.isShow_selected = templateInfo.topicsStatus;
-					this.isShow_bottom = templateInfo.bottomBannerStatus;
-					
-					this.dialogImgUrl = templateInfo.popupImage;
-					this.bigActivityImgUrl = templateInfo.active1Image;
-					this.leftActivityImgUrl = templateInfo.active2LeftImage;
-					this.rightActivityImgUrl = templateInfo.active2RightImage;
-					this.smallActivity1ImgUrl = templateInfo.only1Image;
-					this.smallActivity2ImgUrl = templateInfo.only2Image;
-					this.smallActivity3ImgUrl = templateInfo.only3Image;
-					this.smallActivity4ImgUrl = templateInfo.only4Image;
-					this.selected1ImgUrl = templateInfo.topics1Image;
-					this.selected2ImgUrl = templateInfo.topics2Image;
-					this.selected3ImgUrl = templateInfo.topics3Image;
-					this.selected1Title1 = templateInfo.topics1Title;
-					this.selected1Title2 = templateInfo.topics1Title2;
-					this.selected2Title1 = templateInfo.topics2Title;
-					this.selected2Title2 = templateInfo.topics2Title2;
-					this.selected3Title1 = templateInfo.topics3Title;
-					this.selected3Title2 = templateInfo.topics3Title2;
-					this.bottomImgUrl = templateInfo.bottomBannerImage;
-				},
-				immediate: true,
-				deep: true
-			}
-		},
-		mounted() {
-			uni.$on('onPageScroll', (data) => {
-				this.scrollTop = data;
-			});
-			
-			uni.$on('onPullDownRefresh', (data) => {
-				this.keyword = '';
-				this.getTabList();
-				this.getBannerList();
-				this.getCouponList();
-				this.getMyManager();
-				this.getNoticeList();
-				this.getSeckillTimeList();
-				this.getClassflyList();
-			});
-			
-			uni.$on('onReachBottom', (data) => {
-				this.getRecomList(1);
-			});
-			
-			uni.$on('onShow', (data) => {
-				console.log('onShow page ' + this.thisHomePage);
-				this.keyword = '';
-				this.getTabList();
-				this.getBannerList();
-				this.getCouponList();
-				this.getMyManager();
-				this.getNoticeList();
-				this.getSeckillTimeList();
-				if(this.tabList.length < 1) {
-					this.getClassflyList();
-				}
-				
-				this.dateInterval = setInterval(() => {
-				   this.nowDate = new Date();
-				}, 1000)
-			});
-			
-			uni.$on('onHide', (data) => {
-				if(this.homePage !== this.thisHomePage) return false;
-				
-				clearInterval(this.dateInterval);
-			})
-			
-		},
-		methods: {
-			// 搜索商品
-			searchSubmit() {
-				uni.navigateTo({
-					url: '/packageGoods/pages/search?keyword=' + this.keyword
-				})
-			},
-			
-			// 获取一级菜单
-			getTabList() {
-				this.$axios({
-					url: '/goods/category/list',
-					method: 'get',
-					params: {}
-				}).then(res => {
-					this.classifyList = res.data.slice(0, 9);
-					
-					uni.stopPullDownRefresh();
-				}).finally(res => {
-					this.isLoaded_classify = true;
-				})
-			},
-			
-			// 去分类列表
-			toClassifyLst(categoryId) {
-				uni.setStorageSync('categoryId', categoryId);
-				uni.switchTab({
-					url: '/pages/goods/classify'
-				})
-			},
-			
-			// 获取轮播图列表
-			getBannerList() {
-				this.$axios({
-					url: '/common/list/page',
-					method: 'get',
-					params: {
-						pageNum: 1,
-						pageSize: 10,
-						state: true
-					}
-				}).then(res => {
-					this.bannerList = res.data.records;
-				}).finally(res => {
-					this.isLoaded_banner = true;
-					uni.stopPullDownRefresh();
-				})
-			},
-			
-			// 切换广告图
-			changeBanner(e) {
-				this.bannerCurrent = e.detail.current;
-			},
-			
-			stopTouchMove() {
-				return true;
-			},
-			
-			// 获取可领优惠券列表
-			getCouponList() {
-				this.$axios({
-					url: '/coupon/list/all',
-					method: 'get',
-					params: {
-						userId: this.userId
-					}
-				}).then(res => {
-					this.couponList = res.data;
-				}).finally(res => {
-					this.isLoaded_coupon = true;
-				})
-			},
-			
-			// 处理优惠券
-			handleCoupon(item) {
-				if(item.obtainType == 0) {
-					return this.$toast('该优惠券不可领取');
-				}else if(item.obtainType == 1) {
-					this.$axios({
-						url: '/coupon/obtain',
-						method: 'get',
-						params: {
-							userId: this.userId,
-							couponId: item.couponId
-						}
-					}).then(res => {
-						this.$successToast('领取成功');
-						this.getCouponList();
-					})
-				}else if(item.obtainType == 2) {
-					uni.switchTab({
-					    url: '/pages/goods/classify'
-					});
-				}
-			},
-			
-			// 去可领取优惠券
-			toReceiveCoupon() {
-				uni.navigateTo({
-					url:'/pages/index/coupon'
-				})
-			},
-			
-			// 获取我的客户经理
-			getMyManager() {
-				this.$axios({
-					url: '/user/parent',
-					method: 'get',
-					params: {
-						userId: this.userId
-					}
-				}).then(res => {
-					if(res.data) {
-						this.myManagerDetail = res.data;
-					}
-				}).finally(res => {
-					this.isLoaded_manager = true;
-				})
-			},
-			
-			// 获取公告列表
-			getNoticeList() {
-				this.$axios({
-					url: '/renovation/settle/list',
-					method: 'get',
-					params: {
-						
-					}
-				}).then(res => {
-					if(res.data) {
-						res.data.forEach(item => {
-							item.workUserName = item.workUserName.slice(0, 1) + '师傅';
-						})
-						this.noticeList = res.data;
-					}
-				})
-			},
-			
-			// 拨打电话
-			callPhone(val) {
-				uni.makePhoneCall({
-				    phoneNumber: val
-				});
-			},
-			
-			findElem(array, attr, val) {
-			    for (var i = 0; i < array.length; i++) {
-			        if (array[i][attr] == val) {
-			            return i; //返回当前索引值
-			        }
-			    }
-			    return -1;
-			},
-			
-			// 计算倒计时
-			countTime() {
-				let endDatetime = this.endDatetime.replace(/\-/g, '/');
-				// console.log(endDatetime)
-			    var nowtime = new Date(),  //获取当前时间
-			        endtime = new Date(endDatetime);  //定义结束时间
-			    var lefttime = endtime.getTime() - nowtime.getTime(),  //距离结束时间的毫秒数
-					dd = Math.floor(lefttime/(1000*60*60)/24),  //计算天数
-			        hh = Math.floor(lefttime/(1000*60*60)),  //计算小时数
-			        mm = Math.floor(lefttime/(1000*60)%60),  //计算分钟数
-			        ss = Math.floor(lefttime/1000%60);  //计算秒数
-				// console.log(new Date(endDatetime))
-				function checkTime(i){
-					if (i<10) {
-						i = "0"+i;
-					}
-					return i;
-				}
-				setTimeout(() => {
-					this.countTime();
-				}, 1000);
-				this.countdownTime = (dd > 0 ? dd + '天 ' : '') + checkTime(hh) + ":" + checkTime(mm) + ":" + checkTime(ss);
-				// console.log(this.countdownTime)
-			},
-			
-			// 获取秒杀时间列表
-			getSeckillTimeList() {
-				this.$axios({
-					url: '/goods/sec/time',
-					method: 'get',
-					params: {}
-				}).then(res => {
-					if(res.data.length < 1) {return false;}
-					this.seckillTimeList = res.data;
-					this.endDatetime = this.seckillTimeList[0].endDatetime;
-					this.countdownText = this.seckillTimeList[0].type == 'jxz' ? '距离结束':'即将开始';
-					this.countTime();
-					this.getSeckillGoodsList();
-				}).finally(res => {
-					this.isLoaded_seckill = true;
-				})
-			},
-			
-			// 获取秒杀商品列表
-			getSeckillGoodsList(loadMore) {
-				if(this.seckillGoodsNoMore && loadMore)return;
-				if(!loadMore) {
-					this.seckillGoodsNoMore = false;
-					this.seckillGoodsPage = 1;
-				}
-				let secKillId = this.seckillTimeList[0].secKillId;
-				this.$axios({
-					url: '/goods/sec/goods/list',
-					method: 'get',
-					params: {
-						pageNum: this.seckillGoodsPage,
-						pageSize: 3,
-						secKillId: secKillId,
-					}
-				}).then(res => {
-					let _list = res.data.records;
-					let pageTotal = res.data.pages;
-					if(this.seckillGoodsPage >= pageTotal){
-						this.seckillGoodsNoMore = true;
-					}
-					if (_list.length) {
-						this.seckillGoodsPage += 1;
-					}
-					if (loadMore) {
-						this.seckillGoodsList = this.seckillGoodsList.concat(_list);
-					} else {
-						this.seckillGoodsList = _list;
-					}
-				})
-			},
-			
-			// 加载更多秒杀商品
-			loadMoreSeckillGoods() {
-				this.getSeckillGoodsList(true);
-			},
-			
-			// 进入秒杀商品详情
-			toSeckillGoodsDetail(id) {
-				if(!id) {
-					return false;
-				}
-				if(this.seckillTimeList[0].type == 'wks') {
-					return this.$toast('活动未开始');
-				}
-				uni.navigateTo({
-					url: '/packageGoods/pages/detail?id=' + id
-				})
-			},
-			
-			// 进入秒杀商品列表
-			toSeckillGoodsList() {
-				uni.navigateTo({
-					url: '/packageGoods/pages/seckill'
-				})
-			},
-			
-			// 获取推荐分类
-			getClassflyList() {
-				this.$axios({
-					url: '/renovation/category/list',
-					method: 'get',
-					params: {
-						pageNo: 1,
-						pageSize: 10
-					}
-				}).then(res => {
-					this.tabList = res.data.records;
-					this.tabCurrent = res.data.records.length > 0 ? res.data.records[0].goodsNewsCategoryId : 0;
-					this.getRecomList();
-					
-					uni.stopPullDownRefresh();
-				}).finally(res => {
-					this.isLoaded_newclassify = true;
-				})
-			},
-			
-			// 切换一级菜单
-			changeTab(current) {
-				this.tabCurrent = current;
-				this.getRecomList();
-				this.resize();
-			},
-			
-			// 获取好物推荐商品列表
-			getRecomList(loadMore) {
-				if(this.noMore && loadMore)return;
-				this.noMore = false
-				if(!loadMore){
-					this.pageNum = 1;
-				}else{
-					this.loading = true;
-				}
-				this.$axios({
-					url: '/renovation/goods/list',
-					method: 'get',
-					params: {
-						pageNo: this.pageNum,
-						pageSize: this.pageSize,
-						type: 1,
-						objId: this.tabCurrent,
-						sort: 1
-					},
-				}).then(res => {
-					res.data.records.forEach(item => {
-						if(item.logo && item.logoStartTime) {
-							item.isShowWater = this.$compareTime(item.logoStartTime, item.logoEndTime);
-						}else {
-							item.isShowWater = false;
-						}
-					})
-					
-					let _list = res.data.records;
-					let pageTotal = res.data.pages;
-					if(this.pageNum >= pageTotal){
-						this.noMore = true;
-					}
-					if (_list.length) {
-						this.pageNum += 1
-					}
-					if (loadMore) {
-						this.recomList = this.recomList.concat(_list);
-						this.loading = false;
-					} else {
-						this.recomList = _list;
-					}
-					
-					uni.stopPullDownRefresh();
-				})
-			},
-			
-			// 进入商品详情
-			toGoodsDetail(id) {
-				if(!id) {
-					return false;
-				}
-				uni.navigateTo({
-					url: '/packageGoods/pages/detail?id=' + id
-				})
-			},
-			
-			// 跳转小程序
-			toMiniProgram(appId, path) {
-				wx.navigateToMiniProgram({
-					appId,
-					path,
-					extraData: {},
-					envVersion: 'release',
-					success(res) {}
-				});
-			},
-			
-			setScrollLeft() {
-				// 当前活动tab的布局信息，有tab菜单的width和left(为元素左边界到父元素左边界的距离)等信息
-				const index = this.findElem(this.tabList, 'goodsNewsCategoryId', this.tabCurrent);
-				const tabRect = this.tabList[index]
-				// 累加得到当前item到左边的距离
-				const offsetLeft = this.tabList
-					.slice(0, index)
-					.reduce((total, curr) => {
-						return total + curr.rect.width
-					}, 0)
-				// 此处为屏幕宽度
-				const res = uni.getSystemInfoSync();
-				const windowWidth = res.windowWidth;
-				// 将活动的tabs-item移动到屏幕正中间，实际上是对scroll-view的移动
-				let scrollLeft = offsetLeft - (this.tabsRect.width - tabRect.rect.width) / 2 - (windowWidth - this.tabsRect.right) / 2 + this.tabsRect.left / 2
-				
-				// 这里做一个限制，限制scrollLeft的最大值为整个scroll-view宽度减去tabs组件的宽度
-				scrollLeft = Math.min(scrollLeft, this.scrollViewWidth - this.tabsRect.width)
-				this.scrollLeft = Math.max(0, scrollLeft)
-			},
-			// 获取所有标签的尺寸
-			resize() {
-				// 如果不存在list，则不处理
-				if(this.tabList.length === 0) {
-					return
-				}
-				Promise.all([this.getTabsRect(), this.getAllItemRect()]).then(([tabsRect, itemRect = []]) => {
-					this.tabsRect = tabsRect
-					this.scrollViewWidth = 0
-					itemRect.map((item, index) => {
-						// 计算scroll-view的宽度，这里
-						this.scrollViewWidth += item.width
-						// 另外计算每一个item的中心点X轴坐标
-						this.tabList[index].rect = item
-					})
-					// 获取了tabs的尺寸之后，设置滑块的位置
-					this.setScrollLeft()
-				})
-			},
-			// 获取导航菜单的尺寸
-			getTabsRect() {
-				return new Promise(resolve => {
-					this.queryRect('tabs-view').then(size => resolve(size))
-				})
-			},
-			// 获取所有标签的尺寸
-			getAllItemRect() {
-				return new Promise(resolve => {
-					const promiseAllArr = this.tabList.map((item, index) => this.queryRect(
-						`tabs-item-${index}`, true))
-					Promise.all(promiseAllArr).then(sizes => resolve(sizes))
-				})
-			},
-			// 获取各个标签的尺寸
-			queryRect(el, item) {
-				const query = uni.createSelectorQuery().in(this);
-				return new Promise(resolve => {
-					query.select(`.${el}`).boundingClientRect(data => {
-						resolve(data)
-					}).exec();
-				})
-			},
-			
-			// 关闭弹窗
-			closeDialog() {
-				this.$refs.dialog.step({
-					scale: 0
-				}, {
-					duration: 400
-				})
-				this.$refs.dialog.run(()=>{
-					this.isShowDialog = false;
-				})
-				this.$refs.dialogBtn.step({
-					scale: 0
-				}, {
-					duration: 400
-				})
-				this.$refs.dialogBtn.run(()=>{
-					this.isShowDialog = false;
-				})
-			},
-			
-			
-			// 关闭弹窗
-			closeBottom() {
-				this.$refs.bottom.step({
-					scale: 0
-				}, {
-					duration: 400
-				})
-				this.$refs.bottom.run(()=>{
-					this.isShowBottom = false;
-				})
-				this.$refs.bottomBtn.step({
-					scale: 0
-				}, {
-					duration: 400
-				})
-				this.$refs.bottomBtn.run(()=>{
-					this.isShowBottom = false;
-				})
-			},
-			
-			// 进入活动列表
-			toActivityList(type) {
-				if(type == 2) {
-					this.closeDialog();
-				}
-				// if(type == 13) {
-				// 	this.closeBottom();
-				// }
-				uni.navigateTo({
-					url: '/packageGoods/pages/activity?type=' + type
-				})
-			}
-		}
-	}
-</script>
-
-<style lang="scss" scoped>
-	.top-container {
-		position: relative;
-		margin-bottom: 20rpx;
-		.bg {
-			display: block;
-			width: 750rpx;
-			position: absolute;
-			top: 0;
-			z-index: 0;
-		}
-		.content {
-			width: 710rpx;
-			padding: 0 20rpx;
-			position: relative;
-			z-index: 1;
-		}
-		.title {
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			color: #FFFFFF;
-			font-size: 36rpx;
-		}
-		.search {
-			background: #FFFFFF;
-			height: 64rpx;
-			display: flex;
-			align-items: center;
-			border-radius: 64rpx;
-			padding: 0 20rpx;
-			margin-top: 20rpx;
-			image {
-				width: 28rpx;
-				height: 28rpx;
-			}
-			input {
-				width: 100%;
-				padding-left: 15rpx;
-			}
-		}
-	}
-	.classify-container {
-		margin-top: 20rpx;
-		position: relative;
-		z-index: 1;
-		padding: 0 20rpx;
-		&.whiteBg {
-			.content {
-				background: #ffffff;
-				text {
-					color: #666666;
-				}
-			}
-		}
-		.content {
-			border-radius: 20rpx;
-			padding-top: 30rpx;
-			display: flex;
-			flex-wrap: wrap;
-			.item {
-				display: flex;
-				flex-direction: column;
-				align-items: center;
-				width: 142rpx;
-				margin-bottom: 30rpx;
-				image {
-					width: 78rpx;
-					height: 78rpx;
-					display: block;
-					border-radius: 30rpx;
-					overflow: hidden;
-				}
-				text {
-					font-size: 24rpx;
-					color: #333333;
-					margin-top: 10rpx;
-					width: 150rpx;
-					text-align: center;
-				}
-			}
-		}
-	}
-	.swiper-container {
-		position: relative;
-		margin-top: 20rpx;
-		swiper {
-			height: 270rpx;
-		}
-		image {
-			height: 270rpx;
-			width: 710rpx;
-			display: block;
-			margin: 0 auto 0;
-			border-radius: 15rpx;
-			overflow: hidden;
-		}
-		.dots-conatiner {
-			position: absolute;
-			width: 100%;
-			bottom: 40rpx;
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			.con {
-				border-radius: 4rpx;
-				overflow: hidden;
-				height: 4rpx;
-				background-color: rgba($color: #FFFFFF, $alpha: 0.3);
-			}
-			.dot {
-				width: 20rpx;
-				height: 4rpx;
-				background-color: #FFFFFF;
-				transition: all .3s;
-			}
-		}
-	}
-	.bigActivity-container {
-		position: relative;
-		z-index: 9;
-		margin-top: 20rpx;
-		padding: 0 20rpx;
-		image {
-			width: 710rpx;
-			display: block;
-		}
-	}
-	.other-container {
-		display: flex;
-		padding: 0 20rpx;
-		margin-top: 20rpx;
-		justify-content: space-between;
-		image {
-			display: block;
-			width: 350rpx;
-			height: 240rpx;
-			border-radius: 20rpx;
-		}
-	}
-	.smallActivity-container {
-		margin-top: 20rpx;
-		padding: 0 20rpx;
-		.content {
-			background: #FFFFFF;
-			border-radius: 20rpx;
-			.title {
-				font-size: 32rpx;
-				color: #333333;
-				line-height: 74rpx;
-				padding-left: 20rpx;
-				font-weight: 600;
-			}
-			.list {
-				display: flex;
-				flex-wrap: wrap;
-				padding: 20rpx 20rpx 0;
-				.item {
-					width: 320rpx;
-					margin-right: 30rpx;
-					margin-bottom: 20rpx;
-					&:nth-child(2n) {
-						margin-right: 0;
-					}
-					image {
-						width: 320rpx;
-						height: 200rpx;
-						display: block;
-						border-radius: 20rpx;
-					}
-				}
-			}
-		}
-	}
-	.notice-container {
-		padding: 0 20rpx;
-		margin-top: 20rpx;
-		.content {
-			display: flex;
-			align-items: center;
-			height: 100rpx;
-			background: #FFFFFF;
-			border-radius: 20rpx;
-		}
-		.left{
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			width: 96rpx;
-			height: 48rpx;
-			margin-right: 20rpx;
-			border-right: 2rpx solid #E5E5E5;
-			image {
-				width: 60rpx;
-				height: 30rpx;
-				display: block;
-			}
-		}
-		.swiper{
-			height: 100rpx;
-			flex: 1;
-			padding-right: 20rpx;
-			::v-deep swiper-item {
-				display: block;
-				height: 100rpx;
-				width: 100%;
-				line-height: 100rpx;
-			}
-		}
-	}
-	.coupon-container {
-		position: relative;
-		margin-top: 20rpx;
-		padding: 0 20rpx;
-		.bg {
-			display: block;
-			width: 100%;
-		}
-		.list {
-			position: absolute;
-			top: 80rpx;
-			z-index: 1;
-		}
-		.list1 {
-			.item {
-				position: relative;
-				margin-bottom: 20rpx;
-				margin-left: 16rpx;
-				.cp {
-					width: 688rpx;
-					height: 178rpx;
-					display: block;
-				}
-				.content {
-					position: absolute;
-					left: 0;
-					top: 0;
-					width: 710rpx;
-					height: 160rpx;
-					display: flex;
-					align-items: center;
-					.left {
-						width: 210rpx;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						flex-direction: column;
-						.price {
-							font-size: 48rpx;
-							color: #FFFFFF;
-						}
-						.text {
-							color: #FFFFFF;
-							font-size: 28rpx;
-						}
-					}
-					.right {
-						display: flex;
-						align-items: center;
-						justify-content: space-between;
-						padding: 0 20rpx;
-						width: 470rpx;
-						height: 150rpx;
-						box-sizing: border-box;
-						.main {
-							width: 430rpx;
-							height: 150rpx;
-							padding: 16rpx 0 8rpx;
-							box-sizing: border-box;
-							display: flex;
-							flex-direction: column;
-							justify-content: space-between;
-							.row1 {
-								font-size: 28rpx;
-								line-height: 32rpx;
-								height: 64rpx;
-							}
-							.row2 {
-								font-size: 24rpx;
-								line-height: 28rpx;
-								color: #999999;
-								display: flex;
-								justify-content: space-between;
-								align-items: center;
-							}
-						}
-					}
-				}
-			}
-		}
-		.list2 {
-			display: flex;
-			.item {
-				position: relative;
-				margin-bottom: 20rpx;
-				&:first-child {
-					margin-left: 16rpx;
-				}
-				.cp {
-					width: 342rpx;
-					height: 308rpx;
-					display: block;
-				}
-				.content {
-					position: absolute;
-					left: 0;
-					top: 0;
-					width: 342rpx;
-					height: 328rpx;
-					display: flex;
-					flex-direction: column;
-					align-items: center;
-					.top {
-						width: 324rpx;
-						height: 130rpx;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						flex-direction: column;
-						.price {
-							font-size: 48rpx;
-							color: #FFFFFF;
-							line-height: 48rpx;
-							margin-top: 16rpx;
-						}
-						.text {
-							color: #FFFFFF;
-							font-size: 28rpx;
-							line-height: 28rpx;
-							margin-top: 10rpx;
-						}
-					}
-					.bottom {
-						width: 324rpx;
-						height: 160rpx;
-						padding: 16rpx;
-						box-sizing: border-box;
-						display: flex;
-						flex-direction: column;
-						justify-content: space-between;
-						align-items: center;
-						.name {
-							font-size: 28rpx;
-							text-align: left;
-							line-height: 32rpx;
-							width: 100%;
-						}
-						.date {
-							font-size: 24rpx;
-							color: #999999;
-							text-align: left;
-							width: 100%;
-							line-height: 28rpx;
-						}
-					}
-				}
-			}
-		}
-		.list3 {
-			display: flex;
-			align-items: center;
-			.left {
-				display: flex;
-				width: 630rpx;
-				overflow-x: scroll;
-			}
-			.right {
-				width: 80rpx;
-				display: flex;
-				justify-content: center;
-				.text {
-					width: 48rpx;
-					height: 200rpx;
-					border-radius: 48rpx;
-					background: #FFFFFF;
-					display: flex;
-					flex-direction: column;
-					align-items: center;
-					justify-content: center;
-					text {
-						font-size: 28rpx;
-						color: #FF3F42;
-						line-height: 32rpx;
-					}
-					image {
-						width: 32rpx;
-						height: 32rpx;
-						display: block;
-						flex-shrink: 0;
-						margin-top: 10rpx;
-					}
-				}
-			}
-			.item {
-				position: relative;
-				margin-bottom: 20rpx;
-				&:first-child {
-					margin-left: 16rpx;
-				}
-				.cp {
-					width: 278rpx;
-					height: 308rpx;
-					display: block;
-				}
-				.content {
-					position: absolute;
-					left: 0;
-					top: 0;
-					width: 278rpx;
-					height: 328rpx;
-					display: flex;
-					flex-direction: column;
-					align-items: center;
-					.top {
-						width: 260rpx;
-						height: 130rpx;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						flex-direction: column;
-						.price {
-							font-size: 48rpx;
-							color: #FFFFFF;
-							line-height: 48rpx;
-							margin-top: 16rpx;
-						}
-						.text {
-							color: #FFFFFF;
-							font-size: 28rpx;
-							line-height: 28rpx;
-							margin-top: 10rpx;
-						}
-					}
-					.bottom {
-						width: 260rpx;
-						height: 160rpx;
-						padding: 16rpx;
-						box-sizing: border-box;
-						display: flex;
-						flex-direction: column;
-						justify-content: space-between;
-						align-items: center;
-						.name {
-							font-size: 28rpx;
-							text-align: left;
-							line-height: 32rpx;
-							width: 100%;
-						}
-						.date {
-							font-size: 24rpx;
-							color: #999999;
-							text-align: left;
-							width: 100%;
-							line-height: 28rpx;
-						}
-					}
-				}
-			}
-		}
-		.button {
-			width: 120rpx;
-			height: 40rpx;
-			border-radius: 40rpx;
-			font-size: 24rpx;
-			flex-shrink: 0;
-			box-sizing: border-box;
-			display: flex;
-			justify-content: center;
-			align-items: center;
-			&.gary {
-				background: #AAAAAA;
-				color: #FFFFFF;
-				border: 1px solid #AAAAAA;
-			}
-			&.red {
-				background: #C434FF;
-				color: #FFFFFF;
-				border: 1px solid #C434FF;
-			}
-			&.white {
-				color: #FF3F42;
-				border: 1px solid #FF3F42;
-			}
-		}
-	}
-	.myManager-container {
-		padding: 0 20rpx;
-		.content {
-			display: flex;
-			justify-content: space-between;
-			align-items: center;
-			background: #FFFFFF;
-			border-radius: 20rpx;
-			padding: 20rpx;
-			.left {
-				display: flex;
-				align-items: center;
-				image {
-					width: 100rpx;
-					height: 100rpx;
-					border-radius: 50%;
-				}
-				.main {
-					font-size: 28rpx;
-					line-height: 48rpx;
-					margin-left: 20rpx;
-				}
-			}
-			.right {
-				width: 160rpx;
-				height: 60rpx;
-				line-height: 60rpx;
-				border-radius: 60rpx;
-				text-align: center;
-				font-size: 28rpx;
-				color: #E43B38;
-				border: 1px solid #E43B38;
-			}
-		}
-	}
-	.seckill2-container {
-		padding: 0 20rpx;
-		margin-top: 20rpx;
-		.content {
-			background: #FFFFFF;
-			border-radius: 20rpx;
-			padding: 0 20rpx;
-			.top {
-				display: flex;
-				justify-content: space-between;
-				align-items: center;
-				height: 86rpx;
-				.left {
-					display: flex;
-					align-items: center;
-					.title {
-						font-size: 32rpx;
-						color: #333333;
-						line-height: 74rpx;
-						font-weight: 600;
-					}
-					.timeout {
-						display: flex;
-						align-items: center;
-						margin-left: 20rpx;
-						border-radius: 40rpx;
-						height: 40rpx;
-						overflow: hidden;
-						.text {
-							font-size: 24rpx;
-							color: #FFFFFF;
-							width: 120rpx;
-							text-align: center;
-							background: #FF3F42;
-							border-radius: 40rpx;
-							position: relative;
-							z-index: 1;
-						}
-						.time {
-							padding: 0 20rpx 0 32rpx;
-							background: #FFD3B5;
-							font-size: 24rpx;
-							color: #FF3F42;
-							margin-left: -20rpx;
-							position: relative;
-							z-index: 0;
-						}
-					}
-				}
-				.right {
-					display: flex;
-					align-items: center;
-					font-size: 28rpx;
-					color: #999999;
-					image {
-						width: 12rpx;
-						height: 26rpx;
-						display: block;
-						margin-left: 8rpx;
-					}
-				}
-			}
-			.list {
-				display: flex;
-				.item {
-					width: 210rpx;
-					margin-right: 20rpx;
-					padding-bottom: 20rpx;
-					&:last-child {
-						margin-right: 0;
-					}
-					image {
-						width: 210rpx;
-						height: 210rpx;
-						display: block;
-					}
-					.title {
-						font-size: 28rpx;
-						color: #333333;
-						line-height: 36rpx;
-						font-weight: 600;
-						margin-top: 6rpx;
-					}
-					.price {
-						font-size: 32rpx;
-						color: #FF3F42;
-						line-height: 36rpx;
-						margin-top: 6rpx;
-					}
-				}
-			}
-		}
-	}
-	.selected-container {
-		padding: 0 20rpx;
-		margin-top: 20rpx;
-		.content {
-			background: #FFFFFF;
-			border-radius: 20rpx;
-			padding: 0 20rpx;
-			.title {
-				font-size: 32rpx;
-				color: #333333;
-				line-height: 74rpx;
-				font-weight: 600;
-			}
-			.list {
-				display: flex;
-				.item {
-					width: 210rpx;
-					margin-right: 20rpx;
-					padding-bottom: 20rpx;
-					&:last-child {
-						margin-right: 0;
-					}
-					image {
-						width: 210rpx;
-						height: 210rpx;
-						display: block;
-					}
-					.text1 {
-						font-size: 30rpx;
-						color: #333333;
-						line-height: 36rpx;
-						font-weight: 600;
-						margin-top: 12rpx;
-						text-align: center;
-					}
-					.text2 {
-						font-size: 24rpx;
-						color: #666666;
-						line-height: 30rpx;
-						margin-top: 10rpx;
-						text-align: center;
-					}
-				}
-			}
-		}
-	}
-	.recom-container {
-		margin-top: 20rpx;
-		.top {
-			.tab {
-				display: flex;
-				.item {
-					display: flex;
-					flex-direction: column;
-					align-items: center;
-					justify-content: center;
-					flex-shrink: 0;
-					width: 187.5rpx;
-					font-size: 28rpx;
-					color: #666666;
-					position: relative;
-					height: 130rpx;
-					.name {
-						font-size: 36rpx;
-						color: #333333;
-					}
-					.text {
-						font-size: 24rpx;
-						color: #666666;
-						margin-top: 8rpx;
-					}
-					&.current {
-						.name {
-							color: #FF3F42;
-							font-weight: 600;
-						}
-						.text {
-							color: #FF3F42;
-						}
-						&::after {
-							content: '';
-							display: block;
-							width: 48rpx;
-							height: 6rpx;
-							background: #FF3F42;
-							position: absolute;
-							bottom: 0;
-							left: 50%;
-							margin-left: -24rpx;
-						}
-					}
-				}
-			}
-		}
-	}
-	.dialog-container {
-		position: fixed;
-		z-index: 1000000;
-		top: 0;
-		left: 0;
-		width: 100%;
-		height: 100vh;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		flex-direction: column;
-		background: rgba($color: #000000, $alpha: .6);
-		.image {
-			width: 600rpx;
-			display: block;
-			border-radius: 20rpx;
-			margin-top: 40rpx;
-		}
-		.close {
-			width: 68rpx;
-			height: 68rpx;
-			display: block;
-			margin-top: 40rpx;
-		}
-	}
-	.bottom-container {
-		position: fixed;
-		z-index: 999999;
-		bottom: 20rpx;
-		left: 20rpx;
-		width: 710rpx;
-		display: flex;
-		align-items: flex-end;
-		justify-content: center;
-		flex-direction: column;
-		.image {
-			width: 710rpx;
-			height: 70rpx;
-			display: block;
-			border-radius: 70rpx;
-			margin-top: 8rpx;
-		}
-		.close {
-			width: 30rpx;
-			height: 30rpx;
-			display: block;
-		}
-	}
-	
-</style>
-<style>
-	::-webkit-scrollbar {
-		display: none;
-		width: 0 !important;
-		height: 0 !important;
-		-webkit-appearance: none;
-		background: transparent;
-		color: transparent;
-	}
+<template>
+	<view class="home-container">
+		
+		<block v-show="isLoaded">
+			<custom :bgColor="'bg-them'" :backColor="'#FFFFFF'" :isBack="false" v-show="scrollTop > 100">
+				<text slot="content" style="color: #FFFFFF; font-size: 36rpx;">{{configInfo.minAppName}}</text>
+			</custom>
+			
+			<view class="top-container">
+				<image src="@/static/home/top_bg_2.png" mode="widthFix" class="bg"></image>
+				
+				<view class="content">
+					<view class="title" :style="cuStyle">{{configInfo.minAppName}}</view>
+					
+					<view class="search">
+						<image src="/static/icon/search.png" class=""></image>
+						<input type="text" confirm-type="search" placeholder="搜索商品名称或型号" v-model="keyword" @confirm="searchSubmit">
+					</view>
+				</view>
+			</view>
+			
+			<view class="swiper-container" v-if="isShow_banner && bannerList.length > 0">
+				<swiper @change="changeBanner" :autoplay="true">
+					<block v-for="(item, index) in bannerList" :key='index'>
+						<swiper-item>
+							<image :src="item.imgSrc" mode="aspectFill" @tap="toMiniProgram(item.appId, item.linkUrl)" v-if="item.type === 2"></image>
+							<image :src="item.imgSrc" mode="aspectFill" @tap="toActivityList(item.goodsId)" v-if="item.type === 3"></image>
+							<image :src="item.imgSrc" mode="aspectFill" @tap="toGoodsDetail(item.goodsId)" v-else></image>
+						</swiper-item>
+					</block>
+				</swiper>
+				<view class="dots-conatiner">
+					<view class="con" :style="'width:'+(bannerList.length * 20)+'rpx;'" >
+						<view class="dot" :style=" 'transform:translateX('+ (bannerCurrent * 100) +'%)' "  ></view>
+					</view>
+				</view>
+			</view>
+			
+			<view class="bigActivity-container" v-if="isShow_activity1 && bigActivityImgUrl">
+				<image :src="bigActivityImgUrl" mode="widthFix" @tap="toActivityList(3)"></image>
+			</view>
+			
+			<view class="classify-container" v-if="isShow_classify"
+				:class="(!isShow_banner || (isShow_banner && bannerList.length < 1)) 
+					&& (!isShow_activity1 || (isShow_activity1 && !bigActivityImgUrl)) ? 'whiteBg':''">
+				<view class="content">
+					<block v-for="(item, index) in classifyList" :key='index'>
+						<view class="item" @tap="toClassifyLst(item.categoryId)">
+							<image :src="item.imgUrl" mode="aspectFill"></image>
+							<text class="ellipsis">{{item.name}}</text>
+						</view>
+					</block>
+					<view class="item" @tap="toClassifyLst(0)">
+						<image src="@/static/home/class_more2.png" mode="aspectFill"></image>
+						<text>更多分类</text>
+					</view>
+				</view>
+			</view>
+			
+			<view class="smallActivity-container" v-if="isShow_activity2 && leftActivityImgUrl && rightActivityImgUrl">
+				<view class="content">
+					<view class="list">
+						<view class="item">
+							<image :src="leftActivityImgUrl" mode="aspectFill" @tap="toActivityList(4)"></image>
+						</view>
+						<view class="item">
+							<image :src="rightActivityImgUrl" mode="aspectFill" @tap="toActivityList(5)"></image>
+						</view>
+					</view>
+				</view>
+			</view>
+			
+			<view class="smallActivity-container" v-if="isShow_special">
+				<view class="content">
+					<view class="list">
+						<view class="item">
+							<image :src="smallActivity1ImgUrl" mode="aspectFill" @tap="toActivityList(6)"></image>
+						</view>
+						<view class="item">
+							<image :src="smallActivity2ImgUrl" mode="aspectFill" @tap="toActivityList(7)"></image>
+						</view>
+						<view class="item">
+							<image :src="smallActivity3ImgUrl" mode="aspectFill" @tap="toActivityList(8)"></image>
+						</view>
+						<view class="item">
+							<image :src="smallActivity4ImgUrl" mode="aspectFill" @tap="toActivityList(9)"></image>
+						</view>
+					</view>
+				</view>
+			</view>
+			
+			<view class="coupon-container" v-if="isShow_coupon && couponList.length > 0">
+				<image src="@/static/home/cp_bg1.png" mode="widthFix" class="bg" v-if="couponList.length == 1"></image>
+				<image src="@/static/home/cp_bg2.png" mode="widthFix" class="bg" v-if="couponList.length > 1"></image>
+				
+				<view class="list list1" v-if="couponList.length == 1">
+					<block v-for="(item, index) in couponList" :key='index'>
+						<view class="item" @tap="handleCoupon(item)">
+							<image class="cp" src="@/static/home/coupon_bg1.png"></image>
+							<view class="content">
+								<view class="left">
+									<view class="price">¥{{item.couponValue}}</view>
+									<view class="text" v-if="item.couponType == 'SATISFY'">满{{item.orderAmount}}可用</view>
+								</view>
+								<view class="right">
+									<view class="main">
+										<view class="row1 ellipsis-2">{{item.couponName}}</view>
+										<view class="row2">
+											<view class="date" v-if="item.obtainType == 0 || item.obtainType == 1">
+												<view>领取时间：</view>
+												<view>{{item.obtainStartTime | dateToYYmmdd2}}-{{item.obtainEndTime | dateToYYmmdd2}}</view>
+											</view>
+											<view class="date" v-if="item.obtainType == 2">
+												<view>使用时间：</view>
+												<view>{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}</view>
+											</view>
+											<view class="button gary" v-if="item.obtainType == 0">待开始</view>
+											<view class="button red" v-if="item.obtainType == 1">立即领取</view>
+											<view class="button white" v-if="item.obtainType == 2">去使用</view>
+										</view>
+									</view>
+								</view>
+							</view>
+						</view>
+					</block>
+				</view>
+				
+				<view class="list list2" v-if="couponList.length == 2">
+					<block v-for="(item, index) in couponList" :key='index'>
+						<view class="item" @tap="handleCoupon(item)">
+							<image class="cp" src="@/static/home/coupon_bg2.png"></image>
+							<view class="content">
+								<view class="top">
+									<view class="price">¥{{item.couponValue}}</view>
+									<view class="text">满{{item.orderAmount}}可用</view>
+								</view>
+								<view class="bottom">
+									<view class="name ellipsis">{{item.couponName}}</view>
+									<view class="date ellipsis" v-if="item.obtainType == 0 || item.obtainType == 1">领取时间：{{item.obtainStartTime | dateToYYmmdd2}}-{{item.obtainEndTime | dateToYYmmdd2}}</view>
+									<view class="date ellipsis" v-if="item.obtainType == 2">使用时间：{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}</view>
+									<view class="button gary" v-if="item.obtainType == 0">待开始</view>
+									<view class="button red" v-if="item.obtainType == 1">立即领取</view>
+									<view class="button white" v-if="item.obtainType == 2">去使用</view>
+								</view>
+							</view>
+						</view>
+					</block>
+				</view>
+				
+				<view class="list list3" v-if="couponList.length > 2">
+					<view class="left">
+						<block v-for="(item, index) in couponList" :key='index'>
+							<view class="item" @tap="handleCoupon(item)">
+								<image class="cp" src="@/static/home/coupon_bg3.png"></image>
+								<view class="content">
+									<view class="top">
+										<view class="price">¥{{item.couponValue}}</view>
+										<view class="text">满{{item.orderAmount}}可用</view>
+									</view>
+									<view class="bottom">
+										<view class="name ellipsis">{{item.couponName}}</view>
+										<view class="date ellipsis" v-if="item.obtainType == 0 || item.obtainType == 1">领取时间：{{item.obtainStartTime | dateToYYmmdd2}}-{{item.obtainEndTime | dateToYYmmdd2}}</view>
+										<view class="date ellipsis" v-if="item.obtainType == 2">使用时间：{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}</view>
+										<view class="button gary" v-if="item.obtainType == 0">待开始</view>
+										<view class="button red" v-if="item.obtainType == 1">立即领取</view>
+										<view class="button white" v-if="item.obtainType == 2">去使用</view>
+									</view>
+								</view>
+							</view>
+						</block>
+					</view>
+					<view class="right">
+						<view class="text" @tap="toReceiveCoupon">
+							<text>查</text>
+							<text>看</text>
+							<text>更</text>
+							<text>多</text>
+							<image src="@/static/home/cp_more.png"></image>
+						</view>
+					</view>
+				</view>
+			</view>
+			
+			<view class="myManager-container" v-if="isShow_manager && myManagerDetail && !userInfo.promotionGroupLeader && !userInfo.type === 'SERVICE'">
+				<view class="content">
+					<view class="left">
+						<image :src="myManagerDetail.avatar" mode="aspectFill" v-if="myManagerDetail.avatar.indexOf('http') >= 0"></image>
+						<image :src="imageUrl + myManagerDetail.avatar" mode="aspectFill" v-else></image>
+						<view class="main">
+							<view>客户经理：{{myManagerDetail.workName}}</view>
+							<view>{{myManagerDetail.workPhone}}</view>
+						</view>
+					</view>
+					<view class="right" @tap="callPhone(myManagerDetail.workPhone)">拨打电话</view>
+				</view>
+			</view>
+			
+			<view class="notice-container" v-if="isShow_notice && noticeList.length > 0 && userInfo.type === 'SERVICE'">
+				<view class="content">
+					<view class="left">
+						<image src="@/static/home/notice.png" ></image>
+					</view>
+					<swiper class="swiper" :autoplay="true" :vertical="true" :circular="true" :disable-touch="true">
+						<block v-for="(item,index) in noticeList" :key='index' >
+							<swiper-item @touchmove.stop='stopTouchMove'>
+								<view class="ellipsis">{{item.workUserName}}成功分享商城，获得收益{{item.amount}}元</view>
+							</swiper-item>
+						</block>
+					</swiper>
+				</view>
+			</view>
+			
+			<view class="seckill2-container" v-if="isShow_seckill && seckillTimeList.length > 0">
+				<view class="content">
+					<view class="top">
+						<view class="left">
+							<view class="title">秒杀专区</view>
+							<view class="timeout">
+								<view class="text">{{countdownText}}</view>
+								<view class="time">{{countdownTime}}</view>
+							</view>
+						</view>
+						<view class="right" @tap="toSeckillGoodsList()">更多<image src="@/static/icon/right.png"></image></view>
+					</view>
+					<view class="list">
+						<block v-for="(item, index) in seckillGoodsList" :key='index'>
+							<view class="item" @tap="toSeckillGoodsDetail(item.goodsId)">
+								<image :src="item.imgUrl" mode="aspectFill"></image>
+								<view class="title ellipsis-2">{{item.goodsName}}</view>
+								<view class="price">¥{{item.price | numToFixed}}</view>
+							</view>
+						</block>
+					</view>
+				</view>
+			</view>
+			
+			<view class="selected-container" v-if="isShow_selected">
+				<view class="content">
+					<view class="title">专题精选</view>
+					<view class="list">
+						<view class="item">
+							<image :src="selected1ImgUrl" mode="aspectFill" @tap="toActivityList(10)"></image>
+							<view class="text1 ellipsis">{{selected1Title1}}</view>
+							<view class="text2 ellipsis">{{selected1Title2}}</view>
+						</view>
+						<view class="item">
+							<image :src="selected2ImgUrl" mode="aspectFill" @tap="toActivityList(11)"></image>
+							<view class="text1 ellipsis">{{selected2Title1}}</view>
+							<view class="text2 ellipsis">{{selected2Title2}}</view>
+						</view>
+						<view class="item">
+							<image :src="selected3ImgUrl" mode="aspectFill" @tap="toActivityList(12)"></image>
+							<view class="text1 ellipsis">{{selected3Title1}}</view>
+							<view class="text2 ellipsis">{{selected3Title2}}</view>
+						</view>
+					</view>
+				</view>
+			</view>
+			
+			<view class="recom-container" v-if="isShow_newclassify">
+				<view class="top">
+					<scroll-view
+						:scroll-x="true"
+						:scroll-left="scrollLeft"
+						scroll-with-animation
+						:show-scrollbar="false"
+						class="tabs-view"
+						ref="tabs-view">
+						<view class="tab">
+							<block v-for="(item, index) in tabList" :key='index'>
+								<view class="item" :ref="`tabs-item-${index}`" :class="[`tabs-item-${index}`, item.goodsNewsCategoryId == tabCurrent ? 'current':'']" @tap="changeTab(item.goodsNewsCategoryId)">
+									<view class="name">{{item.mainTitle}}</view>
+									<view class="text">{{item.subTitle}}</view>
+								</view>
+							</block>
+						</view>
+					</scroll-view>
+				</view>
+				<view class="goods-row-list" v-if="recomList.length > 0">
+					<block v-for="(item, index) in recomList" :key='index'>
+						<view class="item" @tap="toGoodsDetail(item.goodsId)">
+							<view class="image">
+								<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
+								<image :src="item.logo" mode="heightFix" class="water" v-if="item.isShowWater"></image>
+							</view>
+							
+							<view class="right">
+								<view>
+									<view class="title ellipsis-2">{{item.goodsName}}</view>
+									<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
+										<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
+									</view>
+								</view>
+								<view>
+									<view class="bottom">
+										<view class="price">
+											<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
+											<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
+										</view>
+										<view class="text">销量：{{item.soldNum}}</view>
+									</view>
+								</view>
+							</view>
+						</view>
+					</block>
+				</view>
+				<no-data v-if="!recomList.length" :showText="'暂无商品'"></no-data>
+				<loading-text v-if="recomList.length"  :loading="loading" :noMore="noMore" ></loading-text>
+			</view>
+			
+			<view class="dialog-container" v-if="isShow_dialog && dialogImgUrl && isShowDialog">
+				<uni-transition ref="dialog" mode-class="zoom-in" :duration="500" :show="isShow_dialog && dialogImgUrl && isShowDialog">
+					<image class="image" :src="dialogImgUrl" mode="widthFix" @tap="toActivityList(2)"></image>
+				</uni-transition>
+				<uni-transition ref="dialogBtn" mode-class="fade" :duration="500" :show="isShow_dialog && dialogImgUrl && isShowDialog">
+					<image class="close" src="@/static/icon/close4.png" @tap="closeDialog()"></image>
+				</uni-transition>
+			</view>
+			
+			<view class="bottom-container" v-if="isShow_bottom && bottomImgUrl && isShowBottom">
+				<uni-transition ref="bottomBtn" mode-class="fade" :duration="500" :show="isShow_bottom && bottomImgUrl && isShowBottom">
+					<image class="close" src="@/static/icon/close5.png" @tap="closeBottom()"></image>
+				</uni-transition>
+				<uni-transition ref="bottom" mode-class="zoom-in" :duration="500" :show="isShow_bottom && bottomImgUrl && isShowBottom">
+					<image class="image" :src="bottomImgUrl" mode="aspectFill" @tap="toActivityList(13)"></image>
+				</uni-transition>
+			</view>
+		</block>
+	</view>
+</template>
+
+<script>
+	import {mapState} from 'vuex';
+	
+	export default {
+		props:{
+			homePage: {
+				type: Number,
+				default: 0
+			},
+			templateInfo: {
+				type: Object,
+				default: {}
+			}
+		},
+		data() {
+			return {
+				thisHomePage: 3, // 当前首页页面模版
+				
+				imageUrl: this.$imageUrl,
+				configInfo: uni.getStorageSync('configInfo'),
+				isShow_dialog: false,
+				isShow_banner: false,
+				isShow_activity1: false,
+				isShow_classify: false,
+				isShow_activity2: false,
+				isShow_special: false,
+				isShow_seckill: false,
+				isShow_coupon: false,
+				isShow_manager: false,
+				isShow_notice: false,
+				isShow_newclassify: false,
+				isShow_selected: false,
+				isShow_bottom: false,
+				
+				scrollTop: 0, // 滚动高度（用于控制自定义导航）
+				keyword: '', // 搜索关键词
+				classifyList: [], // 分类列表
+				bannerList: [], // 轮播图列表
+				bannerCurrent: 0, // 轮播图当前值
+				dialogImgUrl: '',
+				bigActivityImgUrl: '',
+				leftActivityImgUrl: '',
+				rightActivityImgUrl: '',
+				smallActivity1ImgUrl: '',
+				smallActivity2ImgUrl: '',
+				smallActivity3ImgUrl: '',
+				smallActivity4ImgUrl: '',
+				selected1ImgUrl: '',
+				selected2ImgUrl: '',
+				selected3ImgUrl: '',
+				selected1Title1: '',
+				selected2Title1: '',
+				selected3Title1: '',
+				selected1Title2: '',
+				selected2Title2: '',
+				selected3Title2: '',
+				bottomImgUrl: '',
+				noticeList: [],
+				couponList: [], // 可领取优惠券列表
+				myManagerDetail: null, // 我的客户经理信息
+				seckillTimeList: [], // 秒杀时间段列表
+				seckillGoodsList: [], // 秒杀商品列表
+				seckillGoodsPage: 1, // 秒杀商品分页
+				seckillGoodsNoMore: false, // 
+				countdownText: '', // 倒计时文字
+				countdownTime: '', // 倒计时时间
+				endDatetime: '', // 倒计时结束时间
+				nowDate: null, // 当前时间
+				dateInterval: null, // 时间定时器
+				tabList: [], // 好物推荐分类列表
+				tabCurrent: 1, // 好物推荐分类当前值
+				pageNum: 1,
+				pageSize: 8,
+				recomList: [], // 好物推荐列表
+				noMore: false,
+				loading: false,
+				
+				isLoaded_banner: false,
+				isLoaded_coupon: false,
+				isLoaded_seckill: false,
+				isLoaded_classify: false,
+				isLoaded_manager: false,
+				isLoaded_classfly: false,
+				isLoaded_newclassify: false,
+				
+				scrollLeft: 50,
+				scrollViewWidth: 0,
+				tabsRect: {
+					left: 0
+				},
+				
+				isShowDialog: true,
+				isShowBottom: true,
+			}
+		},
+		computed:{
+			cuStyle(){
+				return `height:${this.CustomBar-this.StatusBar}px; padding-top:${this.StatusBar}px;`
+			},
+			...mapState(['userInfo', 'isLogin', 'userId']),
+			isLoaded() {
+				uni.hideLoading();
+				return (!this.isShow_banner || (this.isShow_banner && this.isLoaded_banner))
+					&& (!this.isShow_coupon || (this.isShow_coupon && this.isLoaded_coupon))
+					&& (!this.isShow_seckill || (this.isShow_seckill && this.isLoaded_seckill))
+					&& (!this.isShow_classify || (this.isShow_classify && this.isLoaded_classify))
+					&& (!this.isShow_manager || (this.isShow_manager && this.isLoaded_manager))
+					&& (!this.isShow_newclassify || (this.isShow_newclassify && this.isLoaded_newclassify))
+			}
+		},
+		watch: {
+			nowDate() {
+				let hh = this.nowDate.getHours(),
+					mm = this.nowDate.getMinutes(),
+					ss = this.nowDate.getSeconds();
+				let hs = [10, 12, 15, 18, 20];
+				if(mm == 0 && ss == 0 && hs.indexOf(hh) >= 0) {
+					setTimeout(() => {
+						this.getSeckillTimeList();
+					}, 1000)
+				}
+			},
+			tabList() {
+				this.$nextTick(() => {
+					this.resize()
+				})
+			},
+			templateInfo: {
+				handler(newValue, oldValue) {
+					const templateInfo = this.templateInfo;
+					this.isShow_dialog = templateInfo.popupStatus;
+					this.isShow_banner = templateInfo.carouseStatus;
+					this.isShow_activity1 = templateInfo.active1Status;
+					this.isShow_classify = templateInfo.categoryStatus;
+					this.isShow_activity2 = templateInfo.active2Status;
+					this.isShow_special = templateInfo.onlyStatus;
+					this.isShow_seckill = templateInfo.killStatus;
+					this.isShow_coupon = templateInfo.couponStatus;
+					this.isShow_manager = templateInfo.customerStatus;
+					this.isShow_notice = templateInfo.notiveStatus;
+					this.isShow_newclassify = templateInfo.newsStatus;
+					this.isShow_selected = templateInfo.topicsStatus;
+					this.isShow_bottom = templateInfo.bottomBannerStatus;
+					
+					this.dialogImgUrl = templateInfo.popupImage;
+					this.bigActivityImgUrl = templateInfo.active1Image;
+					this.leftActivityImgUrl = templateInfo.active2LeftImage;
+					this.rightActivityImgUrl = templateInfo.active2RightImage;
+					this.smallActivity1ImgUrl = templateInfo.only1Image;
+					this.smallActivity2ImgUrl = templateInfo.only2Image;
+					this.smallActivity3ImgUrl = templateInfo.only3Image;
+					this.smallActivity4ImgUrl = templateInfo.only4Image;
+					this.selected1ImgUrl = templateInfo.topics1Image;
+					this.selected2ImgUrl = templateInfo.topics2Image;
+					this.selected3ImgUrl = templateInfo.topics3Image;
+					this.selected1Title1 = templateInfo.topics1Title;
+					this.selected1Title2 = templateInfo.topics1Title2;
+					this.selected2Title1 = templateInfo.topics2Title;
+					this.selected2Title2 = templateInfo.topics2Title2;
+					this.selected3Title1 = templateInfo.topics3Title;
+					this.selected3Title2 = templateInfo.topics3Title2;
+					this.bottomImgUrl = templateInfo.bottomBannerImage;
+				},
+				immediate: true,
+				deep: true
+			}
+		},
+		mounted() {
+			uni.$on('onPageScroll', (data) => {
+				this.scrollTop = data;
+			});
+			
+			uni.$on('onPullDownRefresh', (data) => {
+				this.keyword = '';
+				this.getTabList();
+				this.getBannerList();
+				this.getCouponList();
+				this.getMyManager();
+				this.getNoticeList();
+				this.getSeckillTimeList();
+				this.getClassflyList();
+			});
+			
+			uni.$on('onReachBottom', (data) => {
+				this.getRecomList(1);
+			});
+			
+			uni.$on('onShow', (data) => {
+				console.log('onShow page ' + this.thisHomePage);
+				this.keyword = '';
+				this.getTabList();
+				this.getBannerList();
+				this.getCouponList();
+				this.getMyManager();
+				this.getNoticeList();
+				this.getSeckillTimeList();
+				if(this.tabList.length < 1) {
+					this.getClassflyList();
+				}
+				
+				this.dateInterval = setInterval(() => {
+				   this.nowDate = new Date();
+				}, 1000)
+			});
+			
+			uni.$on('onHide', (data) => {
+				if(this.homePage !== this.thisHomePage) return false;
+				
+				clearInterval(this.dateInterval);
+			})
+			
+		},
+		methods: {
+			// 搜索商品
+			searchSubmit() {
+				uni.navigateTo({
+					url: '/packageGoods/pages/search?keyword=' + this.keyword
+				})
+			},
+			
+			// 获取一级菜单
+			getTabList() {
+				this.$axios({
+					url: '/goods/category/list',
+					method: 'get',
+					params: {}
+				}).then(res => {
+					this.classifyList = res.data.slice(0, 9);
+					
+					uni.stopPullDownRefresh();
+				}).finally(res => {
+					this.isLoaded_classify = true;
+				})
+			},
+			
+			// 去分类列表
+			toClassifyLst(categoryId) {
+				uni.setStorageSync('categoryId', categoryId);
+				uni.switchTab({
+					url: '/pages/goods/classify'
+				})
+			},
+			
+			// 获取轮播图列表
+			getBannerList() {
+				this.$axios({
+					url: '/common/list/page',
+					method: 'get',
+					params: {
+						pageNum: 1,
+						pageSize: 10,
+						state: true
+					}
+				}).then(res => {
+					this.bannerList = res.data.records;
+				}).finally(res => {
+					this.isLoaded_banner = true;
+					uni.stopPullDownRefresh();
+				})
+			},
+			
+			// 切换广告图
+			changeBanner(e) {
+				this.bannerCurrent = e.detail.current;
+			},
+			
+			stopTouchMove() {
+				return true;
+			},
+			
+			// 获取可领优惠券列表
+			getCouponList() {
+				this.$axios({
+					url: '/coupon/list/all',
+					method: 'get',
+					params: {
+						userId: this.userId
+					}
+				}).then(res => {
+					this.couponList = res.data;
+				}).finally(res => {
+					this.isLoaded_coupon = true;
+				})
+			},
+			
+			// 处理优惠券
+			handleCoupon(item) {
+				if(item.obtainType == 0) {
+					return this.$toast('该优惠券不可领取');
+				}else if(item.obtainType == 1) {
+					this.$axios({
+						url: '/coupon/obtain',
+						method: 'get',
+						params: {
+							userId: this.userId,
+							couponId: item.couponId
+						}
+					}).then(res => {
+						this.$successToast('领取成功');
+						this.getCouponList();
+					})
+				}else if(item.obtainType == 2) {
+					uni.switchTab({
+					    url: '/pages/goods/classify'
+					});
+				}
+			},
+			
+			// 去可领取优惠券
+			toReceiveCoupon() {
+				uni.navigateTo({
+					url:'/pages/index/coupon'
+				})
+			},
+			
+			// 获取我的客户经理
+			getMyManager() {
+				this.$axios({
+					url: '/user/parent',
+					method: 'get',
+					params: {
+						userId: this.userId
+					}
+				}).then(res => {
+					if(res.data) {
+						this.myManagerDetail = res.data;
+					}
+				}).finally(res => {
+					this.isLoaded_manager = true;
+				})
+			},
+			
+			// 获取公告列表
+			getNoticeList() {
+				this.$axios({
+					url: '/renovation/settle/list',
+					method: 'get',
+					params: {
+						
+					}
+				}).then(res => {
+					if(res.data) {
+						res.data.forEach(item => {
+							item.workUserName = item.workUserName.slice(0, 1) + '师傅';
+						})
+						this.noticeList = res.data;
+					}
+				})
+			},
+			
+			// 拨打电话
+			callPhone(val) {
+				uni.makePhoneCall({
+				    phoneNumber: val
+				});
+			},
+			
+			findElem(array, attr, val) {
+			    for (var i = 0; i < array.length; i++) {
+			        if (array[i][attr] == val) {
+			            return i; //返回当前索引值
+			        }
+			    }
+			    return -1;
+			},
+			
+			// 计算倒计时
+			countTime() {
+				let endDatetime = this.endDatetime.replace(/\-/g, '/');
+				// console.log(endDatetime)
+			    var nowtime = new Date(),  //获取当前时间
+			        endtime = new Date(endDatetime);  //定义结束时间
+			    var lefttime = endtime.getTime() - nowtime.getTime(),  //距离结束时间的毫秒数
+					dd = Math.floor(lefttime/(1000*60*60)/24),  //计算天数
+			        hh = Math.floor(lefttime/(1000*60*60)),  //计算小时数
+			        mm = Math.floor(lefttime/(1000*60)%60),  //计算分钟数
+			        ss = Math.floor(lefttime/1000%60);  //计算秒数
+				// console.log(new Date(endDatetime))
+				function checkTime(i){
+					if (i<10) {
+						i = "0"+i;
+					}
+					return i;
+				}
+				setTimeout(() => {
+					this.countTime();
+				}, 1000);
+				this.countdownTime = (dd > 0 ? dd + '天 ' : '') + checkTime(hh) + ":" + checkTime(mm) + ":" + checkTime(ss);
+				// console.log(this.countdownTime)
+			},
+			
+			// 获取秒杀时间列表
+			getSeckillTimeList() {
+				this.$axios({
+					url: '/goods/sec/time',
+					method: 'get',
+					params: {}
+				}).then(res => {
+					if(res.data.length < 1) {return false;}
+					this.seckillTimeList = res.data;
+					this.endDatetime = this.seckillTimeList[0].endDatetime;
+					this.countdownText = this.seckillTimeList[0].type == 'jxz' ? '距离结束':'即将开始';
+					this.countTime();
+					this.getSeckillGoodsList();
+				}).finally(res => {
+					this.isLoaded_seckill = true;
+				})
+			},
+			
+			// 获取秒杀商品列表
+			getSeckillGoodsList(loadMore) {
+				if(this.seckillGoodsNoMore && loadMore)return;
+				if(!loadMore) {
+					this.seckillGoodsNoMore = false;
+					this.seckillGoodsPage = 1;
+				}
+				let secKillId = this.seckillTimeList[0].secKillId;
+				this.$axios({
+					url: '/goods/sec/goods/list',
+					method: 'get',
+					params: {
+						pageNum: this.seckillGoodsPage,
+						pageSize: 3,
+						secKillId: secKillId,
+					}
+				}).then(res => {
+					let _list = res.data.records;
+					let pageTotal = res.data.pages;
+					if(this.seckillGoodsPage >= pageTotal){
+						this.seckillGoodsNoMore = true;
+					}
+					if (_list.length) {
+						this.seckillGoodsPage += 1;
+					}
+					if (loadMore) {
+						this.seckillGoodsList = this.seckillGoodsList.concat(_list);
+					} else {
+						this.seckillGoodsList = _list;
+					}
+				})
+			},
+			
+			// 加载更多秒杀商品
+			loadMoreSeckillGoods() {
+				this.getSeckillGoodsList(true);
+			},
+			
+			// 进入秒杀商品详情
+			toSeckillGoodsDetail(id) {
+				if(!id) {
+					return false;
+				}
+				if(this.seckillTimeList[0].type == 'wks') {
+					return this.$toast('活动未开始');
+				}
+				uni.navigateTo({
+					url: '/packageGoods/pages/detail?id=' + id
+				})
+			},
+			
+			// 进入秒杀商品列表
+			toSeckillGoodsList() {
+				uni.navigateTo({
+					url: '/packageGoods/pages/seckill'
+				})
+			},
+			
+			// 获取推荐分类
+			getClassflyList() {
+				this.$axios({
+					url: '/renovation/category/list',
+					method: 'get',
+					params: {
+						pageNo: 1,
+						pageSize: 10
+					}
+				}).then(res => {
+					this.tabList = res.data.records;
+					this.tabCurrent = res.data.records.length > 0 ? res.data.records[0].goodsNewsCategoryId : 0;
+					this.getRecomList();
+					
+					uni.stopPullDownRefresh();
+				}).finally(res => {
+					this.isLoaded_newclassify = true;
+				})
+			},
+			
+			// 切换一级菜单
+			changeTab(current) {
+				this.tabCurrent = current;
+				this.getRecomList();
+				this.resize();
+			},
+			
+			// 获取好物推荐商品列表
+			getRecomList(loadMore) {
+				if(this.noMore && loadMore)return;
+				this.noMore = false
+				if(!loadMore){
+					this.pageNum = 1;
+				}else{
+					this.loading = true;
+				}
+				this.$axios({
+					url: '/renovation/goods/list',
+					method: 'get',
+					params: {
+						pageNo: this.pageNum,
+						pageSize: this.pageSize,
+						type: 1,
+						objId: this.tabCurrent,
+						sort: 1
+					},
+				}).then(res => {
+					res.data.records.forEach(item => {
+						if(item.logo && item.logoStartTime) {
+							item.isShowWater = this.$compareTime(item.logoStartTime, item.logoEndTime);
+						}else {
+							item.isShowWater = false;
+						}
+					})
+					
+					let _list = res.data.records;
+					let pageTotal = res.data.pages;
+					if(this.pageNum >= pageTotal){
+						this.noMore = true;
+					}
+					if (_list.length) {
+						this.pageNum += 1
+					}
+					if (loadMore) {
+						this.recomList = this.recomList.concat(_list);
+						this.loading = false;
+					} else {
+						this.recomList = _list;
+					}
+					
+					uni.stopPullDownRefresh();
+				})
+			},
+			
+			// 进入商品详情
+			toGoodsDetail(id) {
+				if(!id) {
+					return false;
+				}
+				uni.navigateTo({
+					url: '/packageGoods/pages/detail?id=' + id
+				})
+			},
+			
+			// 跳转小程序
+			toMiniProgram(appId, path) {
+				wx.navigateToMiniProgram({
+					appId,
+					path,
+					extraData: {},
+					envVersion: 'release',
+					success(res) {}
+				});
+			},
+			
+			setScrollLeft() {
+				// 当前活动tab的布局信息，有tab菜单的width和left(为元素左边界到父元素左边界的距离)等信息
+				const index = this.findElem(this.tabList, 'goodsNewsCategoryId', this.tabCurrent);
+				const tabRect = this.tabList[index]
+				// 累加得到当前item到左边的距离
+				const offsetLeft = this.tabList
+					.slice(0, index)
+					.reduce((total, curr) => {
+						return total + curr.rect.width
+					}, 0)
+				// 此处为屏幕宽度
+				const res = uni.getSystemInfoSync();
+				const windowWidth = res.windowWidth;
+				// 将活动的tabs-item移动到屏幕正中间，实际上是对scroll-view的移动
+				let scrollLeft = offsetLeft - (this.tabsRect.width - tabRect.rect.width) / 2 - (windowWidth - this.tabsRect.right) / 2 + this.tabsRect.left / 2
+				
+				// 这里做一个限制，限制scrollLeft的最大值为整个scroll-view宽度减去tabs组件的宽度
+				scrollLeft = Math.min(scrollLeft, this.scrollViewWidth - this.tabsRect.width)
+				this.scrollLeft = Math.max(0, scrollLeft)
+			},
+			// 获取所有标签的尺寸
+			resize() {
+				// 如果不存在list，则不处理
+				if(this.tabList.length === 0) {
+					return
+				}
+				Promise.all([this.getTabsRect(), this.getAllItemRect()]).then(([tabsRect, itemRect = []]) => {
+					this.tabsRect = tabsRect
+					this.scrollViewWidth = 0
+					itemRect.map((item, index) => {
+						// 计算scroll-view的宽度，这里
+						this.scrollViewWidth += item.width
+						// 另外计算每一个item的中心点X轴坐标
+						this.tabList[index].rect = item
+					})
+					// 获取了tabs的尺寸之后，设置滑块的位置
+					this.setScrollLeft()
+				})
+			},
+			// 获取导航菜单的尺寸
+			getTabsRect() {
+				return new Promise(resolve => {
+					this.queryRect('tabs-view').then(size => resolve(size))
+				})
+			},
+			// 获取所有标签的尺寸
+			getAllItemRect() {
+				return new Promise(resolve => {
+					const promiseAllArr = this.tabList.map((item, index) => this.queryRect(
+						`tabs-item-${index}`, true))
+					Promise.all(promiseAllArr).then(sizes => resolve(sizes))
+				})
+			},
+			// 获取各个标签的尺寸
+			queryRect(el, item) {
+				const query = uni.createSelectorQuery().in(this);
+				return new Promise(resolve => {
+					query.select(`.${el}`).boundingClientRect(data => {
+						resolve(data)
+					}).exec();
+				})
+			},
+			
+			// 关闭弹窗
+			closeDialog() {
+				this.$refs.dialog.step({
+					scale: 0
+				}, {
+					duration: 400
+				})
+				this.$refs.dialog.run(()=>{
+					this.isShowDialog = false;
+				})
+				this.$refs.dialogBtn.step({
+					scale: 0
+				}, {
+					duration: 400
+				})
+				this.$refs.dialogBtn.run(()=>{
+					this.isShowDialog = false;
+				})
+			},
+			
+			
+			// 关闭弹窗
+			closeBottom() {
+				this.$refs.bottom.step({
+					scale: 0
+				}, {
+					duration: 400
+				})
+				this.$refs.bottom.run(()=>{
+					this.isShowBottom = false;
+				})
+				this.$refs.bottomBtn.step({
+					scale: 0
+				}, {
+					duration: 400
+				})
+				this.$refs.bottomBtn.run(()=>{
+					this.isShowBottom = false;
+				})
+			},
+			
+			// 进入活动列表
+			toActivityList(type) {
+				if(type == 2) {
+					this.closeDialog();
+				}
+				// if(type == 13) {
+				// 	this.closeBottom();
+				// }
+				uni.navigateTo({
+					url: '/packageGoods/pages/activity?type=' + type
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.top-container {
+		position: relative;
+		margin-bottom: 20rpx;
+		.bg {
+			display: block;
+			width: 750rpx;
+			position: absolute;
+			top: 0;
+			z-index: 0;
+		}
+		.content {
+			width: 710rpx;
+			padding: 0 20rpx;
+			position: relative;
+			z-index: 1;
+		}
+		.title {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			color: #FFFFFF;
+			font-size: 36rpx;
+		}
+		.search {
+			background: #FFFFFF;
+			height: 64rpx;
+			display: flex;
+			align-items: center;
+			border-radius: 64rpx;
+			padding: 0 20rpx;
+			margin-top: 20rpx;
+			image {
+				width: 28rpx;
+				height: 28rpx;
+			}
+			input {
+				width: 100%;
+				padding-left: 15rpx;
+			}
+		}
+	}
+	.classify-container {
+		margin-top: 20rpx;
+		position: relative;
+		z-index: 1;
+		padding: 0 20rpx;
+		&.whiteBg {
+			.content {
+				background: #ffffff;
+				text {
+					color: #666666;
+				}
+			}
+		}
+		.content {
+			border-radius: 20rpx;
+			padding-top: 30rpx;
+			display: flex;
+			flex-wrap: wrap;
+			.item {
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				width: 142rpx;
+				margin-bottom: 30rpx;
+				image {
+					width: 78rpx;
+					height: 78rpx;
+					display: block;
+					border-radius: 30rpx;
+					overflow: hidden;
+				}
+				text {
+					font-size: 24rpx;
+					color: #333333;
+					margin-top: 10rpx;
+					width: 150rpx;
+					text-align: center;
+				}
+			}
+		}
+	}
+	.swiper-container {
+		position: relative;
+		margin-top: 20rpx;
+		swiper {
+			height: 270rpx;
+		}
+		image {
+			height: 270rpx;
+			width: 710rpx;
+			display: block;
+			margin: 0 auto 0;
+			border-radius: 15rpx;
+			overflow: hidden;
+		}
+		.dots-conatiner {
+			position: absolute;
+			width: 100%;
+			bottom: 40rpx;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			.con {
+				border-radius: 4rpx;
+				overflow: hidden;
+				height: 4rpx;
+				background-color: rgba($color: #FFFFFF, $alpha: 0.3);
+			}
+			.dot {
+				width: 20rpx;
+				height: 4rpx;
+				background-color: #FFFFFF;
+				transition: all .3s;
+			}
+		}
+	}
+	.bigActivity-container {
+		position: relative;
+		z-index: 9;
+		margin-top: 20rpx;
+		padding: 0 20rpx;
+		image {
+			width: 710rpx;
+			display: block;
+		}
+	}
+	.other-container {
+		display: flex;
+		padding: 0 20rpx;
+		margin-top: 20rpx;
+		justify-content: space-between;
+		image {
+			display: block;
+			width: 350rpx;
+			height: 240rpx;
+			border-radius: 20rpx;
+		}
+	}
+	.smallActivity-container {
+		margin-top: 20rpx;
+		padding: 0 20rpx;
+		.content {
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			.title {
+				font-size: 32rpx;
+				color: #333333;
+				line-height: 74rpx;
+				padding-left: 20rpx;
+				font-weight: 600;
+			}
+			.list {
+				display: flex;
+				flex-wrap: wrap;
+				padding: 20rpx 20rpx 0;
+				.item {
+					width: 320rpx;
+					margin-right: 30rpx;
+					margin-bottom: 20rpx;
+					&:nth-child(2n) {
+						margin-right: 0;
+					}
+					image {
+						width: 320rpx;
+						height: 200rpx;
+						display: block;
+						border-radius: 20rpx;
+					}
+				}
+			}
+		}
+	}
+	.notice-container {
+		padding: 0 20rpx;
+		margin-top: 20rpx;
+		.content {
+			display: flex;
+			align-items: center;
+			height: 100rpx;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+		}
+		.left{
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			width: 96rpx;
+			height: 48rpx;
+			margin-right: 20rpx;
+			border-right: 2rpx solid #E5E5E5;
+			image {
+				width: 60rpx;
+				height: 30rpx;
+				display: block;
+			}
+		}
+		.swiper{
+			height: 100rpx;
+			flex: 1;
+			padding-right: 20rpx;
+			::v-deep swiper-item {
+				display: block;
+				height: 100rpx;
+				width: 100%;
+				line-height: 100rpx;
+			}
+		}
+	}
+	.coupon-container {
+		position: relative;
+		margin-top: 20rpx;
+		padding: 0 20rpx;
+		.bg {
+			display: block;
+			width: 100%;
+		}
+		.list {
+			position: absolute;
+			top: 80rpx;
+			z-index: 1;
+		}
+		.list1 {
+			.item {
+				position: relative;
+				margin-bottom: 20rpx;
+				margin-left: 16rpx;
+				.cp {
+					width: 688rpx;
+					height: 178rpx;
+					display: block;
+				}
+				.content {
+					position: absolute;
+					left: 0;
+					top: 0;
+					width: 710rpx;
+					height: 160rpx;
+					display: flex;
+					align-items: center;
+					.left {
+						width: 210rpx;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+						flex-direction: column;
+						.price {
+							font-size: 48rpx;
+							color: #FFFFFF;
+						}
+						.text {
+							color: #FFFFFF;
+							font-size: 28rpx;
+						}
+					}
+					.right {
+						display: flex;
+						align-items: center;
+						justify-content: space-between;
+						padding: 0 20rpx;
+						width: 470rpx;
+						height: 150rpx;
+						box-sizing: border-box;
+						.main {
+							width: 430rpx;
+							height: 150rpx;
+							padding: 16rpx 0 8rpx;
+							box-sizing: border-box;
+							display: flex;
+							flex-direction: column;
+							justify-content: space-between;
+							.row1 {
+								font-size: 28rpx;
+								line-height: 32rpx;
+								height: 64rpx;
+							}
+							.row2 {
+								font-size: 24rpx;
+								line-height: 28rpx;
+								color: #999999;
+								display: flex;
+								justify-content: space-between;
+								align-items: center;
+							}
+						}
+					}
+				}
+			}
+		}
+		.list2 {
+			display: flex;
+			.item {
+				position: relative;
+				margin-bottom: 20rpx;
+				&:first-child {
+					margin-left: 16rpx;
+				}
+				.cp {
+					width: 342rpx;
+					height: 308rpx;
+					display: block;
+				}
+				.content {
+					position: absolute;
+					left: 0;
+					top: 0;
+					width: 342rpx;
+					height: 328rpx;
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					.top {
+						width: 324rpx;
+						height: 130rpx;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+						flex-direction: column;
+						.price {
+							font-size: 48rpx;
+							color: #FFFFFF;
+							line-height: 48rpx;
+							margin-top: 16rpx;
+						}
+						.text {
+							color: #FFFFFF;
+							font-size: 28rpx;
+							line-height: 28rpx;
+							margin-top: 10rpx;
+						}
+					}
+					.bottom {
+						width: 324rpx;
+						height: 160rpx;
+						padding: 16rpx;
+						box-sizing: border-box;
+						display: flex;
+						flex-direction: column;
+						justify-content: space-between;
+						align-items: center;
+						.name {
+							font-size: 28rpx;
+							text-align: left;
+							line-height: 32rpx;
+							width: 100%;
+						}
+						.date {
+							font-size: 24rpx;
+							color: #999999;
+							text-align: left;
+							width: 100%;
+							line-height: 28rpx;
+						}
+					}
+				}
+			}
+		}
+		.list3 {
+			display: flex;
+			align-items: center;
+			.left {
+				display: flex;
+				width: 630rpx;
+				overflow-x: scroll;
+			}
+			.right {
+				width: 80rpx;
+				display: flex;
+				justify-content: center;
+				.text {
+					width: 48rpx;
+					height: 200rpx;
+					border-radius: 48rpx;
+					background: #FFFFFF;
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					justify-content: center;
+					text {
+						font-size: 28rpx;
+						color: #FF3F42;
+						line-height: 32rpx;
+					}
+					image {
+						width: 32rpx;
+						height: 32rpx;
+						display: block;
+						flex-shrink: 0;
+						margin-top: 10rpx;
+					}
+				}
+			}
+			.item {
+				position: relative;
+				margin-bottom: 20rpx;
+				&:first-child {
+					margin-left: 16rpx;
+				}
+				.cp {
+					width: 278rpx;
+					height: 308rpx;
+					display: block;
+				}
+				.content {
+					position: absolute;
+					left: 0;
+					top: 0;
+					width: 278rpx;
+					height: 328rpx;
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					.top {
+						width: 260rpx;
+						height: 130rpx;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+						flex-direction: column;
+						.price {
+							font-size: 48rpx;
+							color: #FFFFFF;
+							line-height: 48rpx;
+							margin-top: 16rpx;
+						}
+						.text {
+							color: #FFFFFF;
+							font-size: 28rpx;
+							line-height: 28rpx;
+							margin-top: 10rpx;
+						}
+					}
+					.bottom {
+						width: 260rpx;
+						height: 160rpx;
+						padding: 16rpx;
+						box-sizing: border-box;
+						display: flex;
+						flex-direction: column;
+						justify-content: space-between;
+						align-items: center;
+						.name {
+							font-size: 28rpx;
+							text-align: left;
+							line-height: 32rpx;
+							width: 100%;
+						}
+						.date {
+							font-size: 24rpx;
+							color: #999999;
+							text-align: left;
+							width: 100%;
+							line-height: 28rpx;
+						}
+					}
+				}
+			}
+		}
+		.button {
+			width: 120rpx;
+			height: 40rpx;
+			border-radius: 40rpx;
+			font-size: 24rpx;
+			flex-shrink: 0;
+			box-sizing: border-box;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			&.gary {
+				background: #AAAAAA;
+				color: #FFFFFF;
+				border: 1px solid #AAAAAA;
+			}
+			&.red {
+				background: #C434FF;
+				color: #FFFFFF;
+				border: 1px solid #C434FF;
+			}
+			&.white {
+				color: #FF3F42;
+				border: 1px solid #FF3F42;
+			}
+		}
+	}
+	.myManager-container {
+		padding: 0 20rpx;
+		.content {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			padding: 20rpx;
+			.left {
+				display: flex;
+				align-items: center;
+				image {
+					width: 100rpx;
+					height: 100rpx;
+					border-radius: 50%;
+				}
+				.main {
+					font-size: 28rpx;
+					line-height: 48rpx;
+					margin-left: 20rpx;
+				}
+			}
+			.right {
+				width: 160rpx;
+				height: 60rpx;
+				line-height: 60rpx;
+				border-radius: 60rpx;
+				text-align: center;
+				font-size: 28rpx;
+				color: #E43B38;
+				border: 1px solid #E43B38;
+			}
+		}
+	}
+	.seckill2-container {
+		padding: 0 20rpx;
+		margin-top: 20rpx;
+		.content {
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			padding: 0 20rpx;
+			.top {
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				height: 86rpx;
+				.left {
+					display: flex;
+					align-items: center;
+					.title {
+						font-size: 32rpx;
+						color: #333333;
+						line-height: 74rpx;
+						font-weight: 600;
+					}
+					.timeout {
+						display: flex;
+						align-items: center;
+						margin-left: 20rpx;
+						border-radius: 40rpx;
+						height: 40rpx;
+						overflow: hidden;
+						.text {
+							font-size: 24rpx;
+							color: #FFFFFF;
+							width: 120rpx;
+							text-align: center;
+							background: #FF3F42;
+							border-radius: 40rpx;
+							position: relative;
+							z-index: 1;
+						}
+						.time {
+							padding: 0 20rpx 0 32rpx;
+							background: #FFD3B5;
+							font-size: 24rpx;
+							color: #FF3F42;
+							margin-left: -20rpx;
+							position: relative;
+							z-index: 0;
+						}
+					}
+				}
+				.right {
+					display: flex;
+					align-items: center;
+					font-size: 28rpx;
+					color: #999999;
+					image {
+						width: 12rpx;
+						height: 26rpx;
+						display: block;
+						margin-left: 8rpx;
+					}
+				}
+			}
+			.list {
+				display: flex;
+				.item {
+					width: 210rpx;
+					margin-right: 20rpx;
+					padding-bottom: 20rpx;
+					&:last-child {
+						margin-right: 0;
+					}
+					image {
+						width: 210rpx;
+						height: 210rpx;
+						display: block;
+					}
+					.title {
+						font-size: 28rpx;
+						color: #333333;
+						line-height: 36rpx;
+						font-weight: 600;
+						margin-top: 6rpx;
+					}
+					.price {
+						font-size: 32rpx;
+						color: #FF3F42;
+						line-height: 36rpx;
+						margin-top: 6rpx;
+					}
+				}
+			}
+		}
+	}
+	.selected-container {
+		padding: 0 20rpx;
+		margin-top: 20rpx;
+		.content {
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			padding: 0 20rpx;
+			.title {
+				font-size: 32rpx;
+				color: #333333;
+				line-height: 74rpx;
+				font-weight: 600;
+			}
+			.list {
+				display: flex;
+				.item {
+					width: 210rpx;
+					margin-right: 20rpx;
+					padding-bottom: 20rpx;
+					&:last-child {
+						margin-right: 0;
+					}
+					image {
+						width: 210rpx;
+						height: 210rpx;
+						display: block;
+					}
+					.text1 {
+						font-size: 30rpx;
+						color: #333333;
+						line-height: 36rpx;
+						font-weight: 600;
+						margin-top: 12rpx;
+						text-align: center;
+					}
+					.text2 {
+						font-size: 24rpx;
+						color: #666666;
+						line-height: 30rpx;
+						margin-top: 10rpx;
+						text-align: center;
+					}
+				}
+			}
+		}
+	}
+	.recom-container {
+		margin-top: 20rpx;
+		.top {
+			.tab {
+				display: flex;
+				.item {
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					justify-content: center;
+					flex-shrink: 0;
+					width: 187.5rpx;
+					font-size: 28rpx;
+					color: #666666;
+					position: relative;
+					height: 130rpx;
+					.name {
+						font-size: 36rpx;
+						color: #333333;
+					}
+					.text {
+						font-size: 24rpx;
+						color: #666666;
+						margin-top: 8rpx;
+					}
+					&.current {
+						.name {
+							color: #FF3F42;
+							font-weight: 600;
+						}
+						.text {
+							color: #FF3F42;
+						}
+						&::after {
+							content: '';
+							display: block;
+							width: 48rpx;
+							height: 6rpx;
+							background: #FF3F42;
+							position: absolute;
+							bottom: 0;
+							left: 50%;
+							margin-left: -24rpx;
+						}
+					}
+				}
+			}
+		}
+	}
+	.dialog-container {
+		position: fixed;
+		z-index: 1000000;
+		top: 0;
+		left: 0;
+		width: 100%;
+		height: 100vh;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		flex-direction: column;
+		background: rgba($color: #000000, $alpha: .6);
+		.image {
+			width: 600rpx;
+			display: block;
+			border-radius: 20rpx;
+			margin-top: 40rpx;
+		}
+		.close {
+			width: 68rpx;
+			height: 68rpx;
+			display: block;
+			margin-top: 40rpx;
+		}
+	}
+	.bottom-container {
+		position: fixed;
+		z-index: 999999;
+		bottom: 20rpx;
+		left: 20rpx;
+		width: 710rpx;
+		display: flex;
+		align-items: flex-end;
+		justify-content: center;
+		flex-direction: column;
+		.image {
+			width: 710rpx;
+			height: 70rpx;
+			display: block;
+			border-radius: 70rpx;
+			margin-top: 8rpx;
+		}
+		.close {
+			width: 30rpx;
+			height: 30rpx;
+			display: block;
+		}
+	}
+	
+</style>
+<style>
+	::-webkit-scrollbar {
+		display: none;
+		width: 0 !important;
+		height: 0 !important;
+		-webkit-appearance: none;
+		background: transparent;
+		color: transparent;
+	}
 </style>

pages/index/coupon.vue

@@ -1,235 +1,235 @@
-<template>
-	<view class="app-container">
-		<view class="list-container">
-			<block v-for="(item, index) in couponList" :key='index'>
-				<view class="item">
-					<view class="bg">
-						<image src="@/static/mine/coupon/bg_1.png"></image>
-					</view>
-					<view class="content">
-						<view class="left">
-							<view class="price">{{item.couponValue}}<text>元</text></view>
-							<view class="text" v-if="item.couponType == 'SATISFY'">满{{item.orderAmount}}可用</view>
-						</view>
-						<view class="right">
-							<view class="main">
-								<view class="row1 ellipsis-2">{{item.couponName}}</view>
-								<view class="row2">
-									<!-- <view class="date">
-										<view>领取时间：</view>
-										<view>
-											{{item.obtainStartTime | dateToYYmmdd2}}-{{item.obtainEndTime | dateToYYmmdd2}}
-										</view>
-									</view> -->
-									<view class="date">
-										<view>使用时间：</view>
-										<view>
-											{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}
-										</view>
-									</view>
-									<view class="button red" @tap="handleCoupon(item)">立即领取</view>
-								</view>
-							</view>
-						</view>
-					</view>
-				</view>
-			</block>
-		</view>
-		<view  v-if="couponList.length" style="position: fixed;bottom: 0;left: 0;right: 0;box-sizing: border-box;padding: 30rpx;background: #ffffff;">
-			<button type="primary" @tap="handleCouponAll">
-				一键领取
-			</button>
-		</view>
-		<no-data v-if="!couponList.length" :showText="'暂无可领取优惠券'"></no-data>
-	</view>
-</template>
-
-<script>
-	import {
-		mapState
-	} from 'vuex';
-
-	export default {
-		data() {
-			return {
-				couponList: [],
-			}
-		},
-
-		computed: {
-			...mapState(['userInfo', 'isLogin', 'userId'])
-		},
-
-		onLoad() {
-			this.getCouponList();
-		},
-
-		methods: {
-			getCouponList() {
-				this.$axios({
-					url: '/couponNew/list/all',
-					method: 'get',
-					params: {
-						userId: this.userId
-					},
-					isLoading: 1
-				}).then(res => {
-					this.couponList = res.data;
-				})
-			},
-
-			// 处理优惠券
-			handleCoupon(item) {
-				this.$axios({
-					url: '/couponNew/obtain',
-					method: 'get',
-					params: {
-						userId: this.userId,
-						couponIds: item.couponId
-					}
-				}).then(res => {
-					this.$successToast('领取成功');
-					this.getCouponList();
-				})
-			},
-
-			handleCouponAll() {
-				this.$axios({
-					url: '/couponNew/obtain',
-					method: 'get',
-					params: {
-						userId: this.userId,
-						couponIds: this.couponList.map(item => item.couponId).join(",")
-					}
-				}).then(res => {
-					this.$successToast('领取成功');
-					this.getCouponList();
-				})
-			},
-		}
-	}
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #F4F2F2;
-		padding: 20rpx;
-		box-sizing: border-box;
-	}
-
-	.list-container {
-		box-sizing: border-box;
-		padding-bottom: 160rpx;
-		.item {
-			position: relative;
-			margin-bottom: 20rpx;
-
-			.bg {
-				image {
-					width: 710rpx;
-					height: 160rpx;
-					display: block;
-				}
-			}
-
-			.content {
-				position: absolute;
-				left: 0;
-				top: 0;
-				width: 710rpx;
-				height: 160rpx;
-				display: flex;
-				align-items: center;
-
-				.left {
-					width: 240rpx;
-					display: flex;
-					align-items: center;
-					justify-content: center;
-					flex-direction: column;
-
-					.price {
-						font-size: 60rpx;
-						color: #FFFFFF;
-
-						text {
-							font-size: 28rpx;
-							margin-top: 20rpx;
-						}
-					}
-
-					.text {
-						color: #FFFFFF;
-						font-size: 28rpx;
-					}
-				}
-
-				.right {
-					display: flex;
-					align-items: center;
-					justify-content: space-between;
-					padding: 0 20rpx;
-					width: 470rpx;
-					height: 160rpx;
-					box-sizing: border-box;
-
-					.main {
-						width: 430rpx;
-						height: 160rpx;
-						padding: 16rpx 0;
-						box-sizing: border-box;
-						display: flex;
-						flex-direction: column;
-						justify-content: space-between;
-
-						.row1 {
-							font-size: 28rpx;
-							line-height: 32rpx;
-						}
-
-						.row2 {
-							display: flex;
-							justify-content: space-between;
-							align-items: center;
-
-							.date {
-								font-size: 24rpx;
-								color: #999999;
-								line-height: 28rpx;
-							}
-
-							.button {
-								width: 120rpx;
-								height: 40rpx;
-								border-radius: 40rpx;
-								font-size: 24rpx;
-								flex-shrink: 0;
-								box-sizing: border-box;
-								display: flex;
-								justify-content: center;
-								align-items: center;
-
-								&.gary {
-									background: #AAAAAA;
-									color: #FFFFFF;
-									border: 1px solid #AAAAAA;
-								}
-
-								&.red {
-									background: #C434FF;
-									color: #FFFFFF;
-									border: 1px solid #C434FF;
-								}
-
-								&.white {
-									color: #FF3F42;
-									border: 1px solid #FF3F42;
-								}
-							}
-						}
-					}
-				}
-			}
-		}
-	}
+<template>
+	<view class="app-container">
+		<view class="list-container">
+			<block v-for="(item, index) in couponList" :key='index'>
+				<view class="item">
+					<view class="bg">
+						<image src="@/static/mine/coupon/bg_1.png"></image>
+					</view>
+					<view class="content">
+						<view class="left">
+							<view class="price">{{item.couponValue}}<text>元</text></view>
+							<view class="text" v-if="item.couponType == 'SATISFY'">满{{item.orderAmount}}可用</view>
+						</view>
+						<view class="right">
+							<view class="main">
+								<view class="row1 ellipsis-2">{{item.couponName}}</view>
+								<view class="row2">
+									<!-- <view class="date">
+										<view>领取时间：</view>
+										<view>
+											{{item.obtainStartTime | dateToYYmmdd2}}-{{item.obtainEndTime | dateToYYmmdd2}}
+										</view>
+									</view> -->
+									<view class="date">
+										<view>使用时间：</view>
+										<view>
+											{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}
+										</view>
+									</view>
+									<view class="button red" @tap="handleCoupon(item)">立即领取</view>
+								</view>
+							</view>
+						</view>
+					</view>
+				</view>
+			</block>
+		</view>
+		<view  v-if="couponList.length" style="position: fixed;bottom: 0;left: 0;right: 0;box-sizing: border-box;padding: 30rpx;background: #ffffff;">
+			<button type="primary" @tap="handleCouponAll">
+				一键领取
+			</button>
+		</view>
+		<no-data v-if="!couponList.length" :showText="'暂无可领取优惠券'"></no-data>
+	</view>
+</template>
+
+<script>
+	import {
+		mapState
+	} from 'vuex';
+
+	export default {
+		data() {
+			return {
+				couponList: [],
+			}
+		},
+
+		computed: {
+			...mapState(['userInfo', 'isLogin', 'userId'])
+		},
+
+		onLoad() {
+			this.getCouponList();
+		},
+
+		methods: {
+			getCouponList() {
+				this.$axios({
+					url: '/couponNew/list/all',
+					method: 'get',
+					params: {
+						userId: this.userId
+					},
+					isLoading: 1
+				}).then(res => {
+					this.couponList = res.data;
+				})
+			},
+
+			// 处理优惠券
+			handleCoupon(item) {
+				this.$axios({
+					url: '/couponNew/obtain',
+					method: 'get',
+					params: {
+						userId: this.userId,
+						couponIds: item.couponId
+					}
+				}).then(res => {
+					this.$successToast('领取成功');
+					this.getCouponList();
+				})
+			},
+
+			handleCouponAll() {
+				this.$axios({
+					url: '/couponNew/obtain',
+					method: 'get',
+					params: {
+						userId: this.userId,
+						couponIds: this.couponList.map(item => item.couponId).join(",")
+					}
+				}).then(res => {
+					this.$successToast('领取成功');
+					this.getCouponList();
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		padding: 20rpx;
+		box-sizing: border-box;
+	}
+
+	.list-container {
+		box-sizing: border-box;
+		padding-bottom: 160rpx;
+		.item {
+			position: relative;
+			margin-bottom: 20rpx;
+
+			.bg {
+				image {
+					width: 710rpx;
+					height: 160rpx;
+					display: block;
+				}
+			}
+
+			.content {
+				position: absolute;
+				left: 0;
+				top: 0;
+				width: 710rpx;
+				height: 160rpx;
+				display: flex;
+				align-items: center;
+
+				.left {
+					width: 240rpx;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					flex-direction: column;
+
+					.price {
+						font-size: 60rpx;
+						color: #FFFFFF;
+
+						text {
+							font-size: 28rpx;
+							margin-top: 20rpx;
+						}
+					}
+
+					.text {
+						color: #FFFFFF;
+						font-size: 28rpx;
+					}
+				}
+
+				.right {
+					display: flex;
+					align-items: center;
+					justify-content: space-between;
+					padding: 0 20rpx;
+					width: 470rpx;
+					height: 160rpx;
+					box-sizing: border-box;
+
+					.main {
+						width: 430rpx;
+						height: 160rpx;
+						padding: 16rpx 0;
+						box-sizing: border-box;
+						display: flex;
+						flex-direction: column;
+						justify-content: space-between;
+
+						.row1 {
+							font-size: 28rpx;
+							line-height: 32rpx;
+						}
+
+						.row2 {
+							display: flex;
+							justify-content: space-between;
+							align-items: center;
+
+							.date {
+								font-size: 24rpx;
+								color: #999999;
+								line-height: 28rpx;
+							}
+
+							.button {
+								width: 120rpx;
+								height: 40rpx;
+								border-radius: 40rpx;
+								font-size: 24rpx;
+								flex-shrink: 0;
+								box-sizing: border-box;
+								display: flex;
+								justify-content: center;
+								align-items: center;
+
+								&.gary {
+									background: #AAAAAA;
+									color: #FFFFFF;
+									border: 1px solid #AAAAAA;
+								}
+
+								&.red {
+									background: #C434FF;
+									color: #FFFFFF;
+									border: 1px solid #C434FF;
+								}
+
+								&.white {
+									color: #FF3F42;
+									border: 1px solid #FF3F42;
+								}
+							}
+						}
+					}
+				}
+			}
+		}
+	}
 </style>

pages/index/index.vue

@@ -1,2270 +1,2269 @@
-<template>
-	<view class="app-container">
-		<view class="home-container">
-			<block>
-				<view class="top-container">
-					<image src="@/static/home/top_bg.png" mode="widthFix" class="bg"></image>
-					<view class="content">
-						<view class="title" :style="cuStyle">广佛格力商城</view>
-						<view class="header-container">
-							<view class="left" @tap="getLocation">
-								<image src="@/static/home/dingweitus.png"></image>
-								<text style="color: #ffffff;">{{currentPosition||''}}</text>
-							</view>
-						</view>
-						<view class="search">
-							<image src="@/static/icon/search.png" class=""></image>
-							<input v-model="keyword" @confirm="searchSubmit" type="text" confirm-type="search"
-								placeholder="搜索商品名称或型号">
-						</view>
-						<view class="shangjiakapian">
-							<view class="shangjiatupiand">
-								<image style="width: 100%;height: 310rpx;" src="@/static/home/shangjiabeijing.png"
-									class=""></image>
-								<view class="nirongdd">
-									<view style="color:#ffffff;font-size: 36rpx;margin-bottom: 16rpx;">
-										{{websitData.name||''}}
-									</view>
-									<view
-										style="margin-bottom: 16rpx;display: flex;justify-content: flex-start;align-items: center;">
-										<view
-											style="color:#ffffff;font-size: 24rpx;box-sizing: border-box;padding: 8rpx 18rpx;border-radius: 20rpx;background: rgba(245, 245,245,0.2);margin-right: 20rpx;">
-											{{websitData.type||''}}
-										</view>
-										<view style="color:#ffffff;font-size: 24rpx;">
-											{{websitData.websitNumber||''}}
-										</view>
-									</view>
-									<view style="color:#ffffff;font-size: 24rpx;">地址：{{websitData.address||''}}</view>
-								</view>
-								<view
-									style="display: flex;justify-content: space-between;align-items: center;width: 100%;height: 100rpx;position: absolute;left: 0;bottom: 0;right: 0;background: rgba(245, 245,245,0.3);">
-									<view style="width: 50%;display: flex;justify-content: center;align-items: center;"
-										@click="dakaidaoh">
-										<image style="width: 40rpx;height: 40rpx;" src="@/static/home/juliduoyuan.png"
-											class=""></image>
-										<view style="font-size: 28rpx;color: #ffffff;margin-left: 20rpx;">
-											距您{{distancess||''}}KM
-										</view>
-									</view>
-									<view
-										style="width: 6rpx;height: 50rpx;border-radius: 3rpx;background:rgba(245, 245,245,0.6);">
-									</view>
-									<view style="width: 50%;display: flex;justify-content: center;align-items: center;"
-										@click="bodasjdh(websitData.mobile||'')">
-										<image style="width: 40rpx;height: 40rpx;" src="@/static/home/dianhuaaa.png"
-											class=""></image>
-										<view style="font-size: 28rpx;color: #ffffff;margin-left: 20rpx;">电话</view>
-									</view>
-								</view>
-								<image @click="chakanyyzz" style="width: 50rpx;height: 50rpx;position: absolute; top: 30%; right: 40rpx;"
-									src="@/static/home/yinyangzhiz.png"></image>
-							</view>
-							<view class="shangjiakapiandibubiaos">
-								<view class="shangjiakapiandibuItem">
-									<view>官方直营</view>
-								</view>
-								<view class="shangjiakapiandibuItem">
-									<view>急速发货</view>
-								</view>
-								<view class="shangjiakapiandibuItem">
-									<view>全场包邮</view>
-								</view>
-							</view>
-						</view>
-					</view>
-				</view>
-
-				<view class="swiper-container" v-if=" bannerList.length > 0">
-					<swiper @change="changeBanner" :autoplay="true">
-						<block v-for="(item, index) in bannerList" :key='index'>
-							<swiper-item>
-								<image :src="item.imgSrc" mode="aspectFill"
-									@tap="toMiniProgram(item.appId, item.linkUrl)" v-if="item.type === 2"></image>
-								<image :src="item.imgSrc" mode="aspectFill" @tap="toActivityList(item.goodsId)"
-									v-if="item.type === 3"></image>
-								<image :src="item.imgSrc" mode="aspectFill" @tap="toGoodsDetail(item.goodsId)" v-else>
-								</image>
-							</swiper-item>
-						</block>
-					</swiper>
-					<view class="dots-conatiner">
-						<view class="con" :style="'width:'+(bannerList.length * 20)+'rpx;'">
-							<view class="dot" :style=" 'transform:translateX('+ (bannerCurrent * 100) +'%)' "></view>
-						</view>
-					</view>
-				</view>
-			</block>
-			<!-- --------------------------------- -->
-			<view class="caidanrukou">
-				<view class="dangecaidanrukou" @click="goodsClassify">
-					<view>
-						<image class="tupiancaidan" src="@/static/home/fenlei.png"></image>
-					</view>
-					<view class="dangecaidanrukouTitle">商品分类</view>
-				</view>
-				<view class="dangecaidanrukou" @click="couponList">
-					<view>
-						<image class="tupiancaidan" src="@/static/home/youhuiquan.png"></image>
-					</view>
-					<view class="dangecaidanrukouTitle">优惠卡券</view>
-				</view>
-				<view class="dangecaidanrukou" @click="orderListPage">
-					<view>
-						<image class="tupiancaidan" src="@/static/home/dingdan.png"></image>
-					</view>
-					<view class="dangecaidanrukouTitle">我的订单</view>
-				</view>
-			</view>
-		</view>
-
-		<view class="sptjyangshi">
-			商品推荐
-		</view>
-		<view class="top-container2">
-			<view class="tab">
-				<view class="item" :class="screenType === 0 ? 'current':''" @tap="changeScreen(0)">综合</view>
-				<view class="item" :class="screenType === 1 ? 'current':''" @tap="changeScreen(1)">销量</view>
-				<view class="item" :class="screenType === 2 || screenType === 3 ? 'current':''" @tap="changeScreen(2)">
-					价格
-					<image src="@/static/icon/price_1.png" v-if="screenType === 2"></image>
-					<image src="@/static/icon/price_2.png" v-if="screenType === 3"></image>
-					<image src="@/static/icon/price_0.png" v-if="screenType != 2 && screenType != 3"></image>
-				</view>
-				<view class="item" :class="screenType === 4 ? 'current':''" @tap="changeScreen(4)">上架时间</view>
-			</view>
-			<!-- 切换商品卡片样式 -->
-			<!-- <view class="icon">
-				<image src="@/static/icon/show_1.png" v-if="showType == 1" @tap="showType = 2"></image>
-				<image src="@/static/icon/show_2.png" v-if="showType == 2" @tap="showType = 1"></image>
-			</view> -->
-		</view>
-
-		<view class="goods-waterfall-list" v-show="showType == 1">
-			<view class="left">
-				<block v-for="(item, index) in goodsList" :key='index'>
-					<view class="item" v-if="index%2==0" @tap="toGoodsDetail(item.goodsId)">
-						<view class="image">
-							<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
-							<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
-						</view>
-						<view class="content">
-							<view class="title ellipsis-2">{{item.goodsName}}</view>
-							<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
-								<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
-							</view>
-							<view class="price">
-								<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
-								<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
-							</view>
-							<view class="tags2" v-if="item.tags2 && item.tags2.length > 0">
-								<view class="it" v-for="(it, idx) in item.tags2" :key="idx">{{it}}</view>
-							</view>
-							<view class="text">销量：{{item.soldNum}}</view>
-						</view>
-					</view>
-				</block>
-			</view>
-			<view class="right">
-				<block v-for="(item, index) in goodsList" :key='index'>
-					<view class="item" v-if="index%2==1" @tap="toGoodsDetail(item.goodsId)">
-						<view class="image">
-							<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
-							<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
-						</view>
-						<view class="content">
-							<view class="title ellipsis-2">{{item.goodsName}}</view>
-							<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
-								<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
-							</view>
-							<view class="price">
-								<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
-								<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
-							</view>
-							<view class="tags2" v-if="item.tags2 && item.tags2.length > 0">
-								<view class="it" v-for="(it, idx) in item.tags2" :key="idx">{{it}}</view>
-							</view>
-							<view class="text">销量：{{item.soldNum}}</view>
-						</view>
-					</view>
-				</block>
-			</view>
-		</view>
-
-		<view class="goods-row-list" v-show="showType == 2">
-			<block v-for="(item, index) in goodsList" :key='index'>
-				<view class="item" @tap="toGoodsDetail(item.goodsId)">
-					<view class="image">
-						<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
-						<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
-					</view>
-					<view class="right">
-						<view>
-							<view class="title ellipsis-2">{{item.goodsName}}</view>
-							<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
-								<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
-							</view>
-						</view>
-						<view>
-							<view class="bottom">
-								<view class="price">
-									<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
-									<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
-								</view>
-								<view class="text">销量：{{item.soldNum}}</view>
-							</view>
-						</view>
-					</view>
-				</view>
-			</block>
-		</view>
-		<no-data v-if="!goodsList.length" :showText="'暂无商品'"></no-data>
-		<loading-text v-if="goodsList.length" :loading="loading" :noMore="noMore"></loading-text>
-
-		<!-- <drag-button :isDock="true" :customBar="true" ref="dragButton"></drag-button> -->
-
-
-		<!-- <HomePageA :homePage="homePage" :templateInfo="templateInfo"  /> -->
-		<!-- <HomePageB :homePage="homePage" :templateInfo="templateInfo"  /> -->
-		<!-- <HomePageC :homePage="homePage" :templateInfo="templateInfo"  /> -->
-
-		<view v-if="isSharePyq">
-			<image
-				src="https://zfire-train.oss-cn-guangzhou.aliyuncs.com/train/pic/1657090568346be106ca9-dd33-48d2-b06b-e4a02b06f2a2.png"
-				mode="widthFix" style="width: 100%" @tap="clickPyq"></image>
-		</view>
-
-		<!-- 购买弹窗 -->
-		<view class="global-mask" v-show="isBuyDialog"></view>
-		<view class="buyDialog" v-show="isBuyDialog">
-			<view class="close">
-				<image src="@/static/icon/close.png" @tap="isBuyDialog = false"></image>
-			</view>
-			<view class="goods" v-if="orderDetail.orderDetails && orderDetail.orderDetails.length == 1">
-				<image :src="orderDetail.orderDetails[0].imgUrl" mode="aspectFill"></image>
-				<view class="name ellipsis-2">{{orderDetail.orderDetails[0].goodsName}}</view>
-				<view class="des ellipsis">{{orderDetail.orderDetails[0].goodsSpecValue}}</view>
-			</view>
-			<view class="goodsList" v-if="orderDetail.orderDetails && orderDetail.orderDetails.length > 1">
-				<block v-for="(item, index) in orderDetail.orderDetails" :key='index'>
-					<view class="item">
-						<image :src="item.imgUrl" mode="aspectFill"></image>
-						<view class="right">
-							<view class="name ellipsis-2">{{item.goodsName}}</view>
-							<view class="des ellipsis">{{item.goodsSpecValue}}</view>
-						</view>
-					</view>
-				</block>
-			</view>
-			<view class="num">共<text>{{orderDetail.totalNum}}</text>件商品</view>
-			<view class="price">需支付金额：<text>¥{{orderDetail.payAmount}}</text></view>
-			<view class="button" @tap="payment">立即支付</view>
-		</view>
-
-		<!-- 优惠券提醒 -->
-		<view class="global-mask" v-show="isCouponDialog"></view>
-		<view class="couponDialog" v-show="isCouponDialog">
-			<image src="@/static/home/cp_dialog.png" mode="widthFix"></image>
-			<view class="bottom">
-				<view class="text">你有优惠券即将到期，请尽快使用！</view>
-				<view class="btn-group">
-					<view class="button left" @tap="isCouponDialog = false">关闭</view>
-					<view class="button right" @tap="toMyCoupon">去看看</view>
-				</view>
-			</view>
-		</view>
-		<!-- 领取优惠券弹窗 -->
-		<view class="global-mask" v-show="isReceiveDialog"></view>
-		<view class="couponDialog" v-show="isReceiveDialog">
-			<image src="@/static/home/cp_dialog.png" mode="widthFix"></image>
-			<view class="bottom">
-				<view class="text">你有一张优惠券可领取！</view>
-				<view class="btn-group onlyOne">
-					<view class="button right" @tap="receiveCoupon">立即领取</view>
-				</view>
-			</view>
-		</view>
-
-		<modal-dialog showTitle="提示" showText="领取成功" :isShowDialog="isReceiveCouponDialog && isReceiveSuccess"
-			@cancel="isReceiveCouponDialog = false" @confirm="toMyCoupon()" confirmText="去看看"></modal-dialog>
-
-		<modal-dialog showTitle="提示" :showText="'领取失败：'+failMessage"
-			:isShowDialog="isReceiveCouponDialog && !isReceiveSuccess" @cancel="isReceiveCouponDialog = false"
-			:isShowConfirm="false" cancelText="关闭"></modal-dialog>
-
-	</view>
-</template>
-
-<script>
-	import HomePageA from "@/pages/index/components/home-page-a";
-	import HomePageB from "@/pages/index/components/home-page-b";
-	import HomePageC from "@/pages/index/components/home-page-c";
-	import {
-		mapState
-	} from 'vuex';
-	import {
-		appId
-	} from '@/utils/config.js';
-	import modalDialog from '@/components/modalDialog.vue';
-	export default {
-		components: {
-			HomePageA,
-			HomePageB,
-			HomePageC,
-			modalDialog,
-		},
-		data() {
-			return {
-				configInfo: uni.getStorageSync('configInfo'),
-				templateInfo: uni.getStorageSync('templateInfo'),
-				isBuyDialog: false, // 是否显示购买弹窗（业务员代客下单时产生）
-				orderDetail: {}, // 订单详情（购买弹窗需要）
-				scene: { // 页面参数（扫码进入小程序时产生）
-					type: '',
-					goodsId: '',
-					orderId: '',
-					serviceId: '',
-					couponId: '',
-				},
-				isCouponDialog: false, // 是否显示过期优惠券弹窗
-				isReceiveCouponDialog: false,
-				isReceiveSuccess: true,
-				failMessage: '',
-				isReceiveDialog: false,
-				isSmsReceive: false,
-				homePage: 0,
-				isSharePyq: false,
-				keyword: "",
-
-				screenType: '',
-				goodsList: [],
-				pageNum: 1,
-				pageSize: 8,
-				noMore: false,
-				loading: false,
-				showType: 2,
-				bannerList: [], // 轮播图列表
-				bannerCurrent: 0, // 轮播图当前值
-				distancess: "",
-				currentPosition: ''
-			}
-		},
-		computed: {
-			...mapState(['userInfo', 'isLogin', 'userId', 'websitData']),
-			cuStyle() {
-				return `height:${this.CustomBar-this.StatusBar}px; padding-top:${this.StatusBar}px;`
-			},
-		},
-		watch: {
-			nowDate() {
-				let hh = this.nowDate.getHours(),
-					mm = this.nowDate.getMinutes(),
-					ss = this.nowDate.getSeconds();
-				let hs = [10, 12, 15, 18, 20];
-				if (mm == 0 && ss == 0 && hs.indexOf(hh) >= 0) {
-					setTimeout(() => {
-						this.getSeckillTimeList();
-					}, 1000)
-				}
-			},
-			websitData() {
-
-			}
-		},
-
-		// 页面滚动
-		onPageScroll(res) {
-			uni.$emit('onPageScroll', res.scrollTop);
-		},
-
-		// // 下拉刷新
-		// onPullDownRefresh() {
-		// 	if (this.isSharePyq) {
-		// 		return false;
-		// 	}
-		// 	uni.$emit('onPullDownRefresh');
-		// 	// this.getHomePage();
-		// },
-
-		// // 上拉加载
-		// onReachBottom() {
-		// 	uni.$emit('onReachBottom');
-		// },
-
-
-		// 下拉刷新
-		onPullDownRefresh() {
-			if (this.isSharePyq) {
-				return false;
-			}
-			uni.$emit('onPullDownRefresh');
-			this.pageNum = 1;
-			this.getGoodsList();
-			this.getBannerList();
-			this.chishuhuade();
-		},
-
-		// 上拉加载
-		onReachBottom() {
-			this.getGoodsList(1);
-			uni.$emit('onReachBottom');
-		},
-
-
-		// 页面隐藏
-		onHide() {
-			uni.$emit('onHide');
-		},
-
-		// 页面显示
-		async onShow() {
-			this.chishuhuade()
-			var obj = wx.getLaunchOptionsSync()
-			if (obj.scene == 1154) {
-				return this.isSharePyq = true;
-			}
-			await this.$onLaunched;
-		},
-
-		// 页面加载
-		async onLoad({
-			scene,
-			goodsId,
-			serviceId,
-			mobile,
-			smsServiceId,
-			otherType,
-			appOrderId
-		}) {
-			await this.$onLaunched;
-
-			// uni.showLoading({
-			//     title: '加载中'
-			// });
-
-			this.getConfig();
-
-			this.checkCoupon();
-
-			this.getBannerList();
-
-			// // 点击短信链接进入小程序
-			// if (smsServiceId) {
-			// 	this.bindUser(smsServiceId);
-			// 	if (this.userInfo.type !== "SERVICE") {
-			// 		this.isSmsReceive = true;
-			// 		this.isReceiveDialog = true;
-			// 	}
-			// }
-
-			// // 从师傅端app跳转进入小程序
-			// if (appOrderId) {
-			// 	this.appOrderPay(appOrderId);
-			// }
-
-			// if (otherType) {
-			// 	if (otherType === 'groupbuyList') {
-			// 		uni.navigateTo({
-			// 			url: '/pages/mine/groupbuy/list'
-			// 		})
-			// 	}
-			// }
-
-			if (serviceId) {
-				this.bindUser(serviceId);
-			}
-
-			// 点击商品链接进入小程序
-			if (goodsId) {
-				this.toGoodsDetail(goodsId);
-			}
-
-			// 扫码进入小程序
-			if (scene) {
-				// 拿scene的id去获取
-				this.$axios({
-					url: '/common/scene',
-					method: 'get',
-					params: {
-						scene: scene,
-					}
-				}).then(res => {
-					let newScene = res.data.split("&");
-					this.scene.type = newScene[0];
-					this.scene.serviceId = newScene[2];
-					// 如果是商品
-					if (newScene[0] == 'goods') {
-						this.scene.goodsId = newScene[1];
-						this.toGoodsDetail(this.scene.goodsId);
-					}
-
-					// 如果是商城分享码
-					else if (newScene[0] == 'bind') {
-
-					}
-
-					// // 如果是订单
-					// else if (newScene[0] == 'order') {
-					// 	this.scene.orderId = newScene[1];
-					// 	this.getOrderInfo();
-					// }
-					// 如果是优惠券
-					else if (newScene[0] == 'coupon') {
-						this.scene.couponId = newScene[1];
-						this.isReceiveDialog = true;
-						// this.receiveCoupon(this.scene.couponId);
-					}
-					// // 如果是团购分享码
-					// else if (newScene[0] == 'promotion_group') {
-					// 	uni.navigateTo({
-					// 		url: '/pages/mine/groupbuy/list'
-					// 	})
-					// }
-
-					if (this.scene.serviceId) {
-						this.bindUser(this.scene.serviceId);
-					}
-				})
-			}
-
-			this.getGoodsList();
-
-		},
-
-		// 分享
-		onShareAppMessage(options) {
-			if (options && options.from == 'button') {
-				// 来自页面内的转发按钮
-			} else {
-				// 点击微信右上角的分享按钮
-			}
-			return {
-				title: `${this.userInfo.nickName}向你推荐了「${this.configInfo.minAppName}」小程序`,
-				path: '/pages/index/index?serviceId=' + this.userId,
-				query: {},
-				success: function(res) {
-					if (res.errMsg == 'shareAppMessage:ok') {
-						this.$successToast('分享完成');
-					}
-				}
-			}
-		},
-
-		onShareTimeline() {
-			return {
-				title: `${this.userInfo.nickName}向你推荐了「${this.configInfo.minAppName}」小程序`,
-				query: 'serviceId=' + this.userId,
-				success: function(res) {
-					if (res.errMsg == 'shareAppMessage:ok') {
-						this.$successToast('分享完成');
-					}
-				}
-			}
-		},
-
-		methods: {
-			
-			chakanyyzz(){
-				uni.navigateTo({
-					url: '/pages/index/chakanyyzz'
-				})
-			},
-			
-			chishuhuade(){
-				uni.getLocation({
-					type: 'gcj02',
-					isHighAccuracy: true,
-					geocode: true,
-					success: res => {
-						this.$axios({
-							url: '/user/user/detail',
-							method: 'get',
-							params: {
-								userId: this.userId,
-								lat: res.latitude,
-								lng: res.longitude,
-							},
-						}).then((res) => {
-							this.distancess = res.data.distance
-						});
-						this.$axios({
-							url: '/user/address',
-							method: 'post',
-							params: {
-								lat: res.latitude,
-								lng: res.longitude,
-							},
-						}).then((res) => {
-							var {
-								provinceName,
-								cityName,
-								areaName,
-								name
-							} = res.data
-							this.currentPosition = `${provinceName}${cityName}${areaName}${name}`
-						});
-					},
-					fail: err => {
-				
-					}
-				})
-			},
-
-			goodsClassify() {
-				uni.switchTab({
-					url: '/pages/goods/classify'
-				});
-			},
-			couponList() {
-				uni.navigateTo({
-					url: '/pages/mine/coupon/list'
-				})
-			},
-			orderListPage() {
-				uni.navigateTo({
-					url: '/pages/mine/order/list'
-				})
-			},
-			// 打开导航
-			dakaidaoh() {
-				console.log(1111)
-				uni.openLocation({
-					latitude: this.websitData.lat,
-					longitude: this.websitData.lng,
-					success: function() {
-						console.log('success');
-					}
-				});
-			},
-			// 拨打商家电话
-			bodasjdh(phoneNumber) {
-				console.log(2222)
-				if (phoneNumber) {
-					uni.makePhoneCall({
-						phoneNumber: phoneNumber
-					});
-				} else {
-					uni.showModal({
-						title: '提示',
-						content: '商家没有手机号码！',
-						success: (res) => {
-							if (res.confirm) {} else if (res.cancel) {}
-						}
-					});
-				}
-			},
-			// 获取轮播图列表
-			getBannerList() {
-				this.$axios({
-					url: '/common/list/page',
-					method: 'get',
-					params: {
-						pageNum: 1,
-						pageSize: 10,
-						state: true
-					}
-				}).then(res => {
-					this.bannerList = res.data.records;
-				}).finally(res => {})
-			},
-			// 切换广告图
-			changeBanner(e) {
-				this.bannerCurrent = e.detail.current;
-			},
-			// 跳转小程序
-			toMiniProgram(appId, path) {
-				wx.navigateToMiniProgram({
-					appId,
-					path,
-					extraData: {},
-					envVersion: 'release',
-					success(res) {}
-				});
-			},
-			// 进入活动列表
-			toActivityList(type) {
-				if (type == 2) {
-					this.closeDialog();
-				}
-				uni.navigateTo({
-					url: '/packageGoods/pages/activity?type=' + type
-				})
-			},
-
-			getLocation() {
-				if (!this.userInfo?.serviceWorkerBean?.websitId) {
-					uni.navigateTo({
-						url: '/pages/address/list'
-					})
-				}
-			},
-
-			searchSubmit() {
-				if (this.keyword) {
-					this.pageNum = 1;
-					this.getGoodsList();
-				}
-			},
-			// 获取页面模版
-			async getHomePage() {
-				const result = await new Promise((resolve, reject) => {
-					this.$axios({
-						url: '/renovation/detail',
-						method: 'get',
-					}).then(res => {
-						if (res.data) {
-							uni.setStorageSync('templateInfo', res.data);
-							this.templateInfo = res.data;
-							this.homePage = res.data.templateType;
-							resolve(res.data.templateType);
-						}
-					}).catch(res => {
-						this.homePage = 1;
-						resolve(1);
-					})
-				})
-				return result;
-			},
-
-			// 获取配置信息
-			getConfig() {
-				this.$axios({
-					url: '/common/config/get',
-					method: 'get',
-				}).then(res => {
-					if (res.data) {
-						uni.setStorageSync('configInfo', res.data);
-					}
-				})
-			},
-
-			// 绑定用户关系
-			bindUser(serviceId) {
-				if (this.userInfo?.userId) {
-					if (!this.userInfo?.serviceWorkerBean) {
-						this.$axios({
-							url: '/user/bind',
-							params: {
-								serviceId: serviceId,
-								userId: this.userId,
-							}
-						}).then(res => {
-							console.log('绑定成功：' + res.message);
-						})
-					}
-				} else {
-					setTimeout(() => {
-						this.bindUser(serviceId)
-					}, 100)
-				}
-			},
-
-			// 点击分享朋友圈的图
-			clickPyq() {
-				this.$toast('请前往小程序使用完整服务');
-			},
-
-			// app订单支付
-			appOrderPay(appOrderId) {
-				let that = this;
-				this.$axios({
-					url: '/common/online/pay',
-					method: 'post',
-					params: {
-						key: appOrderId,
-						openId: uni.getStorageSync('userInfo').openId,
-					}
-				}).then(res => {
-					if (!res.data) return false;
-					let data = JSON.parse(res.data.codeUrl);
-					wx.requestPayment({
-						timeStamp: data.timeStamp,
-						nonceStr: data.nonceStr,
-						package: data.package,
-						signType: 'RSA',
-						paySign: data.paySign,
-						success: (res) => {
-							that.$successToast('支付成功');
-						},
-						fail: (err) => {
-							that.$toast('支付失败');
-						}
-					})
-				})
-			},
-
-			// 进入商品详情
-			toGoodsDetail(id) {
-				if (!id) {
-					return false;
-				}
-
-				this.$axios({
-						url: '/goods/detail',
-						method: 'get',
-						params: {
-							goodsId: id,
-							userId: this.userId,
-						},
-					})
-					.then((res) => {
-						uni.navigateTo({
-							url: '/packageGoods/pages/detail?id=' + id
-						})
-					})
-					.catch((res) => {
-						uni.switchTab({
-							url: '/pages/goods/all'
-						});
-					})
-					.finally((res) => {});
-			},
-
-			// 检查是否有优惠券过期
-			checkCoupon() {
-				this.$axios({
-					url: '/coupon/timeout',
-					method: 'get',
-					params: {},
-				}).then(res => {
-					if (res.data) {
-						this.isCouponDialog = true;
-					}
-				})
-			},
-
-			// 进入我的优惠券
-			toMyCoupon() {
-				this.isCouponDialog = false;
-				this.isReceiveCouponDialog = false;
-				uni.navigateTo({
-					url: '/pages/mine/coupon/list'
-				})
-			},
-
-			// 领取优惠券
-			receiveCoupon(id) {
-				if (!this.isLogin) {
-					return uni.navigateTo({
-						url: '/pages/login/index'
-					})
-				}
-				if (this.isSmsReceive) {
-					this.$axios({
-						url: '/coupon/obtain',
-						method: 'get',
-						params: {
-							userId: '',
-							couponId: ''
-						}
-					}).then(res => {
-						this.isReceiveDialog = false;
-						this.isReceiveSuccess = true;
-						this.isReceiveCouponDialog = true;
-					}).catch(res => {
-						this.failMessage = res.message;
-						this.isReceiveDialog = false;
-						this.isReceiveSuccess = false;
-						this.isReceiveCouponDialog = true;
-					})
-				} else {
-					this.$axios({
-						url: '/coupon/transfer/coupon',
-						method: 'get',
-						params: {
-							userCouponId: this.scene.couponId
-						}
-					}).then(res => {
-						this.isReceiveDialog = false;
-						this.isReceiveSuccess = true;
-						this.isReceiveCouponDialog = true;
-					}).catch(res => {
-						this.failMessage = res.message;
-						this.isReceiveDialog = false;
-						this.isReceiveSuccess = false;
-						this.isReceiveCouponDialog = true;
-					})
-				}
-			},
-
-			// 获取订单信息
-			getOrderInfo() {
-				this.$axios({
-					url: '/order/detail',
-					method: 'get',
-					params: {
-						orderId: this.scene.orderId
-					}
-				}).then(res => {
-					if (res.data && res.data.orderStatus === 'NOPAY') {
-						this.orderDetail = res.data;
-						this.isBuyDialog = true;
-					} else {
-						return this.$toast('二维码已失效，请重新生成');
-					}
-				})
-			},
-
-			// 支付
-			payment() {
-				let that = this;
-				if (!this.isLogin) {
-					uni.navigateTo({
-						url: '/pages/login/index'
-					})
-				} else {
-					this.$axios({
-						url: '/order/wait/pay',
-						params: {
-							userId: this.userId,
-							orderId: this.scene.orderId,
-						},
-						isLoading: 1,
-					}).then(res => {
-						uni.getProvider({
-							service: 'payment',
-							success: (e) => {
-								uni.requestPayment({
-									provider: e.provider[0],
-									orderInfo: res.data,
-									timeStamp: res.data.timeStamp,
-									nonceStr: res.data.nonceStr,
-									package: res.data.payPackage,
-									signType: 'MD5',
-									paySign: res.data.paySign,
-									success: (res) => {
-										that.$successToast('支付成功');
-										that.isBuyDialog = false;
-										that.requestMessage();
-									},
-									fail: (err) => {
-										that.$toast('支付失败');
-									}
-								})
-							}
-						})
-					})
-				}
-			},
-
-			// 消息推送
-			requestMessage() {
-				let that = this;
-				uni.showModal({
-					title: '温馨提示',
-					content: '为更好的促进您与买家的交流，需要在您的订单成交时向您发送消息',
-					confirmText: "同意",
-					cancelText: "拒绝",
-					success: function(res) {
-						if (res.confirm) {
-							let tmplIds = [that.configInfo.template];
-							uni.requestSubscribeMessage({
-								tmplIds: tmplIds,
-								success(res) {
-									let status = null;
-									tmplIds.map((item, index) => {
-										if (res[item] == 'accept') {
-											status = 'accept';
-										}
-									})
-									if (status == 'accept') {
-										that.$successToast('订阅成功');
-									} else {
-										that.$toast('订阅取消');
-									}
-								},
-								fail(res) {
-									console.log(res);
-									that.$toast('订阅失败');
-								}
-							})
-						} else if (res.cancel) {
-							uni.showModal({
-								title: '温馨提示',
-								content: '拒绝后您将无法获取实时的与卖家（买家）的交易消息',
-								confirmText: "知道了",
-								showCancel: false,
-								success: function(res) {
-
-								}
-							});
-						}
-					}
-				});
-			},
-
-			// ------------------------------------
-			// 切换筛选类型
-			changeScreen(type) {
-				if (type != 2) {
-					if (this.screenType !== type) {
-						this.screenType = type;
-					} else {
-						this.screenType = '';
-					}
-				} else {
-					if (this.screenType != 2 && this.screenType != 3) {
-						this.screenType = 2;
-					} else if (this.screenType == 2) {
-						this.screenType = 3;
-					} else {
-						this.screenType = '';
-					}
-				}
-				this.pageNum = 1;
-				this.getGoodsList();
-			},
-
-			// 获取商品列表
-			getGoodsList(loadMore) {
-				if (this.noMore && loadMore) return;
-				this.noMore = false
-				if (!loadMore) {
-					this.pageNum = 1;
-				} else {
-					this.loading = true;
-				}
-				this.$axios({
-					url: '/goods/list/sort/page',
-					method: 'get',
-					params: {
-						pageNum: this.pageNum,
-						pageSize: this.pageSize,
-						categoryId: '',
-						sort: this.screenType,
-						keyword: this.keyword
-					},
-					isLoading: !loadMore
-				}).then(res => {
-					res.data.records.forEach(item => {
-						if (item.logo && item.logoStartTime) {
-							item.isShowWater = this.$compareTime(item.logoStartTime, item.logoEndTime);
-						} else {
-							item.isShowWater = false;
-						}
-					})
-					let _list = res.data.records;
-					let pageTotal = res.data.pages;
-					if (this.pageNum >= pageTotal) {
-						this.noMore = true;
-					}
-					if (_list.length) {
-						this.pageNum += 1
-					}
-					if (loadMore) {
-						this.goodsList = this.goodsList.concat(_list);
-						this.loading = false;
-					} else {
-						this.goodsList = _list;
-					}
-
-					uni.stopPullDownRefresh();
-				})
-			},
-		}
-	}
-</script>
-
-<style lang="scss">
-	.shangjiakapian {
-		width: 100%;
-		height: auto;
-		border-radius: 30rpx;
-		overflow: hidden;
-		background: #ffffff;
-		margin-top: 30rpx;
-
-		.shangjiatupiand {
-			position: relative;
-
-			.nirongdd {
-				position: absolute;
-				top: 0;
-				left: 0;
-				right: 0;
-				bottom: 0;
-				box-sizing: border-box;
-				padding: 26rpx;
-			}
-		}
-
-		.shangjiakapiandibubiaos {
-			width: 100%;
-			display: flex;
-			justify-content: space-between;
-			align-items: center;
-
-			.shangjiakapiandibuItem {
-				width: 33.33%;
-				height: auto;
-				box-sizing: border-box;
-				padding: 16rpx;
-				display: flex;
-				justify-content: center;
-				align-items: center;
-				font-size: 20rpx;
-				color: red;
-			}
-		}
-
-	}
-
-	.header-container {
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-		padding: 0 10rpx 10rpx;
-
-		.left {
-			display: flex;
-			align-items: center;
-
-			image {
-				width: 48rpx;
-				height: 48rpx;
-			}
-		}
-	}
-
-	.top-container {
-		position: relative;
-
-		.bg {
-			display: block;
-			width: 750rpx;
-			position: absolute;
-			top: 0;
-			z-index: 0;
-		}
-
-		.content {
-			width: 710rpx;
-			padding: 0 20rpx;
-			position: relative;
-			z-index: 1;
-		}
-
-		.title {
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			color: #FFFFFF;
-			font-size: 36rpx;
-		}
-
-		.search {
-			background: #FFFFFF;
-			height: 64rpx;
-			display: flex;
-			align-items: center;
-			border-radius: 64rpx;
-			padding: 0 20rpx;
-			margin-top: 20rpx;
-
-			image {
-				width: 28rpx;
-				height: 28rpx;
-			}
-
-			input {
-				width: 100%;
-				padding-left: 15rpx;
-			}
-		}
-	}
-
-	.classify-container {
-		margin-top: 40rpx;
-		position: relative;
-		z-index: 1;
-		padding: 0 20rpx;
-
-		.content {
-			border-radius: 20rpx;
-			padding-top: 30rpx;
-			display: flex;
-			flex-wrap: wrap;
-			background: #FFFFFF;
-
-			.item {
-				display: flex;
-				flex-direction: column;
-				align-items: center;
-				width: 142rpx;
-				margin-bottom: 30rpx;
-
-				image {
-					width: 78rpx;
-					height: 78rpx;
-					display: block;
-					border-radius: 50%;
-					overflow: hidden;
-				}
-
-				text {
-					font-size: 24rpx;
-					color: #666666;
-					margin-top: 10rpx;
-					width: 150rpx;
-					text-align: center;
-				}
-			}
-		}
-	}
-
-
-
-	.notice-container {
-		padding: 0 20rpx;
-		margin-top: 20rpx;
-
-		.content {
-			display: flex;
-			align-items: center;
-			height: 100rpx;
-			background: #FFFFFF;
-			border-radius: 20rpx;
-		}
-
-		.left {
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			width: 96rpx;
-			height: 48rpx;
-			margin-right: 20rpx;
-			border-right: 2rpx solid #E5E5E5;
-
-			image {
-				width: 60rpx;
-				height: 30rpx;
-				display: block;
-			}
-		}
-
-		.swiper {
-			height: 100rpx;
-			flex: 1;
-			padding-right: 20rpx;
-
-			::v-deep swiper-item {
-				display: block;
-				height: 100rpx;
-				width: 100%;
-				line-height: 100rpx;
-			}
-		}
-	}
-
-	.coupon-container {
-		position: relative;
-		margin-top: 20rpx;
-		padding: 0 20rpx;
-
-		.bg {
-			display: block;
-			width: 100%;
-		}
-
-		.list {
-			position: absolute;
-			top: 80rpx;
-			z-index: 1;
-		}
-
-		.list1 {
-			.item {
-				position: relative;
-				margin-bottom: 20rpx;
-				margin-left: 16rpx;
-
-				.cp {
-					width: 688rpx;
-					height: 178rpx;
-					display: block;
-				}
-
-				.content {
-					position: absolute;
-					left: 0;
-					top: 0;
-					width: 710rpx;
-					height: 160rpx;
-					display: flex;
-					align-items: center;
-
-					.left {
-						width: 210rpx;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						flex-direction: column;
-
-						.price {
-							font-size: 48rpx;
-							color: #FFFFFF;
-						}
-
-						.text {
-							color: #FFFFFF;
-							font-size: 28rpx;
-						}
-					}
-
-					.right {
-						display: flex;
-						align-items: center;
-						justify-content: space-between;
-						padding: 0 20rpx;
-						width: 470rpx;
-						height: 150rpx;
-						box-sizing: border-box;
-
-						.main {
-							width: 430rpx;
-							height: 150rpx;
-							padding: 16rpx 0 8rpx;
-							box-sizing: border-box;
-							display: flex;
-							flex-direction: column;
-							justify-content: space-between;
-
-							.row1 {
-								font-size: 28rpx;
-								line-height: 32rpx;
-								height: 64rpx;
-							}
-
-							.row2 {
-								font-size: 24rpx;
-								line-height: 28rpx;
-								color: #999999;
-								display: flex;
-								justify-content: space-between;
-								align-items: center;
-							}
-						}
-					}
-				}
-			}
-		}
-
-		.list2 {
-			display: flex;
-
-			.item {
-				position: relative;
-				margin-bottom: 20rpx;
-
-				&:first-child {
-					margin-left: 16rpx;
-				}
-
-				.cp {
-					width: 342rpx;
-					height: 308rpx;
-					display: block;
-				}
-
-				.content {
-					position: absolute;
-					left: 0;
-					top: 0;
-					width: 342rpx;
-					height: 328rpx;
-					display: flex;
-					flex-direction: column;
-					align-items: center;
-
-					.top {
-						width: 324rpx;
-						height: 130rpx;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						flex-direction: column;
-
-						.price {
-							font-size: 48rpx;
-							color: #FFFFFF;
-							line-height: 48rpx;
-							margin-top: 16rpx;
-						}
-
-						.text {
-							color: #FFFFFF;
-							font-size: 28rpx;
-							line-height: 28rpx;
-							margin-top: 10rpx;
-						}
-					}
-
-					.bottom {
-						width: 324rpx;
-						height: 160rpx;
-						padding: 16rpx;
-						box-sizing: border-box;
-						display: flex;
-						flex-direction: column;
-						justify-content: space-between;
-						align-items: center;
-
-						.name {
-							font-size: 28rpx;
-							text-align: left;
-							line-height: 32rpx;
-							width: 100%;
-						}
-
-						.date {
-							font-size: 24rpx;
-							color: #999999;
-							text-align: left;
-							width: 100%;
-							line-height: 28rpx;
-						}
-					}
-				}
-			}
-		}
-
-		.list3 {
-			display: flex;
-			align-items: center;
-
-			.left {
-				display: flex;
-				width: 630rpx;
-				overflow-x: scroll;
-			}
-
-			.right {
-				width: 80rpx;
-				display: flex;
-				justify-content: center;
-
-				.text {
-					width: 48rpx;
-					height: 200rpx;
-					border-radius: 48rpx;
-					background: #FFFFFF;
-					display: flex;
-					flex-direction: column;
-					align-items: center;
-					justify-content: center;
-
-					text {
-						font-size: 28rpx;
-						color: #FF3F42;
-						line-height: 32rpx;
-					}
-
-					image {
-						width: 32rpx;
-						height: 32rpx;
-						display: block;
-						flex-shrink: 0;
-						margin-top: 10rpx;
-					}
-				}
-			}
-
-			.item {
-				position: relative;
-				margin-bottom: 20rpx;
-
-				&:first-child {
-					margin-left: 16rpx;
-				}
-
-				.cp {
-					width: 278rpx;
-					height: 308rpx;
-					display: block;
-				}
-
-				.content {
-					position: absolute;
-					left: 0;
-					top: 0;
-					width: 278rpx;
-					height: 328rpx;
-					display: flex;
-					flex-direction: column;
-					align-items: center;
-
-					.top {
-						width: 260rpx;
-						height: 130rpx;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						flex-direction: column;
-
-						.price {
-							font-size: 48rpx;
-							color: #FFFFFF;
-							line-height: 48rpx;
-							margin-top: 16rpx;
-						}
-
-						.text {
-							color: #FFFFFF;
-							font-size: 28rpx;
-							line-height: 28rpx;
-							margin-top: 10rpx;
-						}
-					}
-
-					.bottom {
-						width: 260rpx;
-						height: 160rpx;
-						padding: 16rpx;
-						box-sizing: border-box;
-						display: flex;
-						flex-direction: column;
-						justify-content: space-between;
-						align-items: center;
-
-						.name {
-							font-size: 28rpx;
-							text-align: left;
-							line-height: 32rpx;
-							width: 100%;
-						}
-
-						.date {
-							font-size: 24rpx;
-							color: #999999;
-							text-align: left;
-							width: 100%;
-							line-height: 28rpx;
-						}
-					}
-				}
-			}
-		}
-
-		.button {
-			width: 120rpx;
-			height: 40rpx;
-			border-radius: 40rpx;
-			font-size: 24rpx;
-			flex-shrink: 0;
-			box-sizing: border-box;
-			display: flex;
-			justify-content: center;
-			align-items: center;
-
-			&.gary {
-				background: #AAAAAA;
-				color: #FFFFFF;
-				border: 1px solid #AAAAAA;
-			}
-
-			&.red {
-				background: #C434FF;
-				color: #FFFFFF;
-				border: 1px solid #C434FF;
-			}
-
-			&.white {
-				color: #FF3F42;
-				border: 1px solid #FF3F42;
-			}
-		}
-	}
-
-	.myManager-container {
-		padding: 0 20rpx;
-
-		.content {
-			display: flex;
-			justify-content: space-between;
-			align-items: center;
-			background: #FFFFFF;
-			border-radius: 20rpx;
-			padding: 20rpx;
-
-			.left {
-				display: flex;
-				align-items: center;
-
-				image {
-					width: 100rpx;
-					height: 100rpx;
-					border-radius: 50%;
-				}
-
-				.main {
-					font-size: 28rpx;
-					line-height: 48rpx;
-					margin-left: 20rpx;
-				}
-			}
-
-			.right {
-				width: 160rpx;
-				height: 60rpx;
-				line-height: 60rpx;
-				border-radius: 60rpx;
-				text-align: center;
-				font-size: 28rpx;
-				color: #E43B38;
-				border: 1px solid #E43B38;
-			}
-		}
-	}
-
-	.seckill-container {
-		position: relative;
-		margin-top: 20rpx;
-		min-height: 340rpx;
-
-		.bg {
-			display: block;
-			width: 750rpx;
-			position: absolute;
-			top: 0;
-			z-index: 0;
-		}
-
-		.content {
-			width: 710rpx;
-			padding: 0 20rpx;
-			position: relative;
-			z-index: 1;
-		}
-
-		.time-list {
-			display: flex;
-			overflow-x: scroll;
-			padding-top: 90rpx;
-			padding-bottom: 40rpx;
-
-			.item {
-				display: flex;
-				flex-direction: column;
-				align-items: center;
-				flex-shrink: 0;
-				width: 140rpx;
-				margin-right: 48rpx;
-
-				.time {
-					font-size: 32rpx;
-					color: #FFFFFF;
-				}
-
-				.tag {
-					width: 140rpx;
-					height: 44rpx;
-					border-radius: 44rpx;
-					border: 1px solid #FFFFFF;
-					font-size: 24rpx;
-					color: #FFFFFF;
-					box-sizing: border-box;
-					margin-top: 12rpx;
-					display: flex;
-					align-items: center;
-					justify-content: center;
-				}
-
-				&.current {
-					.tag {
-						background: #FFFFFF;
-						color: #FF3F42;
-					}
-				}
-			}
-		}
-
-		.product-list {
-			.item {
-				background: #FFFFFF;
-				border-radius: 10rpx;
-				display: flex;
-				padding: 20rpx;
-				margin-bottom: 20rpx;
-
-				image {
-					display: block;
-					width: 180rpx;
-					height: 180rpx;
-					flex-shrink: 0;
-				}
-
-				.right {
-					width: 490rpx;
-					box-sizing: border-box;
-					padding-left: 20rpx;
-
-					.title {
-						font-size: 30rpx;
-						color: #333333;
-						line-height: 36rpx;
-						font-weight: 600;
-					}
-
-					.des {
-						font-size: 24rpx;
-						line-height: 30rpx;
-						color: #999999;
-						margin-top: 6rpx;
-					}
-
-					.stock-sales {
-						display: flex;
-						justify-content: space-between;
-						align-items: center;
-						margin-top: 10rpx;
-						font-size: 24rpx;
-						color: #666666;
-
-						.stock {
-							display: flex;
-							align-items: center;
-
-							text {
-								font-size: 24rpx;
-								color: #666666;
-							}
-
-							.progress-box {
-								width: 140rpx;
-								border-radius: 6px;
-								overflow: hidden;
-								margin-left: 10rpx;
-							}
-						}
-					}
-
-					.bottom {
-						display: flex;
-						justify-content: space-between;
-						align-items: center;
-						margin-top: 10rpx;
-
-						.price {
-							display: flex;
-							flex-direction: column;
-						}
-
-						.price-1 {
-							font-size: 32rpx;
-							color: #FF3F42;
-							line-height: 36rpx;
-						}
-
-						.price-2 {
-							font-size: 26rpx;
-							color: #666666;
-							line-height: 30rpx;
-							text-decoration: line-through;
-						}
-
-						.btn {
-							width: 110rpx;
-							height: 44rpx;
-							background: #FF3F42;
-							border-radius: 5rpx;
-							font-size: 28rpx;
-							color: #FFFFFF;
-							text-align: center;
-							line-height: 44rpx;
-						}
-
-						.btn2 {
-							width: 110rpx;
-							height: 44rpx;
-							background: #AAAAAA;
-							border-radius: 5rpx;
-							font-size: 28rpx;
-							color: #FFFFFF;
-							text-align: center;
-							line-height: 44rpx;
-						}
-					}
-				}
-			}
-		}
-
-		.loadmore {
-			background: #FFFFFF;
-			border-radius: 10rpx;
-			display: flex;
-			justify-content: center;
-			align-items: center;
-			height: 88rpx;
-		}
-	}
-
-	.recom-container {
-		margin-top: 30rpx;
-
-		.top {
-			background: #FFFFFF;
-			padding: 30rpx 0 0;
-
-			.title {
-				display: flex;
-				align-items: center;
-				justify-content: center;
-				margin-bottom: 10rpx;
-
-				image {
-					width: 300rpx;
-					height: 40rpx;
-					display: block;
-				}
-			}
-
-			.tab {
-				display: flex;
-				margin-left: -10rpx;
-
-				.item {
-					display: flex;
-					flex-direction: column;
-					align-items: center;
-					flex-shrink: 0;
-					font-size: 28rpx;
-					color: #666666;
-					height: 80rpx;
-					line-height: 80rpx;
-					position: relative;
-					padding: 0 30rpx;
-
-					&.current {
-						color: #FF3F42;
-						font-weight: 600;
-
-						&::after {
-							content: '';
-							display: block;
-							width: 50rpx;
-							height: 6rpx;
-							background: #FF3F42;
-							position: absolute;
-							bottom: 0;
-							left: 50%;
-							margin-left: -25rpx;
-						}
-					}
-				}
-			}
-		}
-
-		.list {
-			display: flex;
-			flex-wrap: wrap;
-			padding: 20rpx;
-
-			.item {
-				width: 348rpx;
-				background: #FFFFFF;
-				margin-right: 14rpx;
-				margin-bottom: 20rpx;
-				border-radius: 20rpx;
-				overflow: hidden;
-
-				&:nth-child(2n) {
-					margin-right: 0;
-				}
-
-				.image {
-					width: 348rpx;
-					height: 348rpx;
-					flex-shrink: 0;
-					position: relative;
-
-					.img {
-						width: 348rpx;
-						height: 348rpx;
-						display: block;
-					}
-
-					.water {
-						width: 348rpx;
-						height: 348rpx;
-						display: block;
-						position: absolute;
-						left: 0;
-						top: 0;
-						z-index: 1;
-					}
-				}
-
-				.content {
-					padding: 15rpx 20rpx;
-
-					.title {
-						font-size: 30rpx;
-						color: #333333;
-						line-height: 36rpx;
-						font-weight: 600;
-						height: 72rpx;
-					}
-
-					.bottom {
-						display: flex;
-						justify-content: space-between;
-						align-items: center;
-						margin-top: 10rpx;
-
-						.price {
-							display: flex;
-							flex-direction: column;
-						}
-
-						.price-1 {
-							font-size: 32rpx;
-							color: #FF3F42;
-							line-height: 36rpx;
-						}
-
-						.price-2 {
-							font-size: 26rpx;
-							color: #666666;
-							line-height: 30rpx;
-							text-decoration: line-through;
-						}
-
-						.btn {
-							width: 60rpx;
-							height: 60rpx;
-							background: #FE781F;
-							border-radius: 50%;
-							display: flex;
-							align-items: center;
-							justify-content: center;
-
-							image {
-								width: 41rpx;
-								height: 36rpx;
-								display: block;
-							}
-						}
-					}
-				}
-			}
-		}
-	}
-
-	.app-container {
-		background: #F4F2F2;
-		box-sizing: border-box;
-	}
-
-	.couponDialog {
-		position: fixed;
-		top: 30%;
-		left: 75rpx;
-		z-index: 999;
-		width: 600rpx;
-		background: #FFFFFF;
-		border-radius: 20rpx;
-
-		image {
-			width: 600rpx;
-		}
-
-		.bottom {
-			padding: 0 40rpx 50rpx;
-
-			.text {
-				font-size: 32rpx;
-				line-height: 48rpx;
-				text-align: center;
-			}
-
-			.btn-group {
-				display: flex;
-				justify-content: space-between;
-				margin-top: 50rpx;
-
-				.button {
-					width: 240rpx;
-					height: 72rpx;
-					border-radius: 72rpx;
-					border: 1px solid #FF3F42;
-					font-size: 32rpx;
-					line-height: 72rpx;
-					text-align: center;
-
-					&.left {
-						color: #FF3F42;
-					}
-
-					&.right {
-						color: #FFFFFF;
-						background: #FF3F42;
-					}
-				}
-
-				&.onlyOne {
-					justify-content: center;
-
-					.button {
-						width: 300rpx;
-					}
-				}
-			}
-		}
-	}
-
-	.buyDialog {
-		position: fixed;
-		top: 30%;
-		left: 100rpx;
-		z-index: 999;
-		width: 550rpx;
-		background: #FFFFFF;
-		border-radius: 10rpx;
-		box-sizing: border-box;
-		padding: 20rpx 20rpx 30rpx;
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-
-		.close {
-			width: 100%;
-			display: flex;
-			justify-content: flex-end;
-
-			image {
-				width: 32rpx;
-				height: 32rpx;
-				display: block;
-			}
-		}
-
-		.goods {
-			margin-top: 10rpx;
-
-			image {
-				width: 410rpx;
-				height: 300rpx;
-				display: block;
-			}
-
-			.name {
-				font-size: 28rpx;
-				line-height: 34rpx;
-				margin-top: 16rpx;
-			}
-
-			.des {
-				font-size: 26rpx;
-				color: #666666;
-				line-height: 30rpx;
-				margin-top: 10rpx;
-			}
-		}
-
-		.goodsList {
-			max-height: 400rpx;
-			overflow-y: scroll;
-			margin-top: 10rpx;
-
-			.item {
-				display: flex;
-				padding: 10rpx 20rpx;
-
-				image {
-					width: 120rpx;
-					height: 120rpx;
-					display: block;
-					flex-shrink: 0;
-				}
-
-				.right {
-					width: 334rpx;
-					margin-left: 16rpx;
-
-					.name {
-						font-size: 28rpx;
-						line-height: 34rpx;
-						margin-top: 8rpx;
-					}
-
-					.des {
-						font-size: 26rpx;
-						color: #666666;
-						line-height: 30rpx;
-						margin-top: 10rpx;
-					}
-				}
-			}
-		}
-
-		.num {
-			margin-top: 10rpx;
-			line-height: 40rpx;
-
-			text {
-				color: #FF3F42;
-				font-size: 32rpx;
-				font-weight: 600;
-				margin: 0 10rpx;
-			}
-		}
-
-		.price {
-			margin-top: 8rpx;
-			line-height: 40rpx;
-
-			text {
-				color: #FF3F42;
-				font-size: 32rpx;
-				font-weight: 600;
-			}
-		}
-
-		.button {
-			width: 300rpx;
-			height: 64rpx;
-			line-height: 64rpx;
-			text-align: center;
-			background: #FF3F42;
-			border-radius: 64rpx;
-			font-size: 28rpx;
-			color: #FFFFFF;
-			margin-top: 20rpx;
-		}
-	}
-
-	// ---------------------------------------------
-
-	.swiper-container {
-		position: relative;
-		margin-top: 20rpx;
-
-		swiper {
-			height: 350rpx;
-		}
-
-		image {
-			height: 350rpx;
-			width: 710rpx;
-			display: block;
-			margin: 0 auto 0;
-			border-radius: 15rpx;
-			overflow: hidden;
-		}
-
-		.dots-conatiner {
-			position: absolute;
-			width: 100%;
-			bottom: 40rpx;
-			display: flex;
-			align-items: center;
-			justify-content: center;
-
-			.con {
-				border-radius: 4rpx;
-				overflow: hidden;
-				height: 4rpx;
-				background-color: rgba($color: #FFFFFF, $alpha: 0.3);
-			}
-
-			.dot {
-				width: 20rpx;
-				height: 4rpx;
-				background-color: #FFFFFF;
-				transition: all .3s;
-			}
-		}
-	}
-
-	// ---------------------------------------------
-
-	.caidanrukou {
-		width: 95%;
-		height: auto;
-		border-radius: 30rpx;
-		overflow: hidden;
-		background: #ffffff;
-		margin: 30rpx auto;
-		padding: 30rpx;
-		box-sizing: border-box;
-		display: flex;
-		justify-content: space-between;
-		align-items: center;
-
-		.dangecaidanrukou {
-			width: 33.33%;
-			height: auto;
-			display: flex;
-			justify-content: center;
-			align-items: center;
-			flex-direction: column;
-
-			.tupiancaidan {
-				width: 80rpx;
-				height: 80rpx;
-			}
-
-			.dangecaidanrukouTitle {
-				font-size: 28rpx;
-				font-weight: 500;
-			}
-		}
-	}
-
-	// ---------------------------------------------
-
-	.sptjyangshi {
-		width: 100%;
-		font-size: 34rpx;
-		font-weight: bold;
-		box-sizing: border-box;
-		padding: 30rpx 20rpx;
-	}
-
-	.top-container2 {
-		background: #FFFFFF;
-		display: flex;
-		padding: 0 20rpx;
-		align-items: center;
-		box-sizing: border-box;
-
-		.tab {
-			flex: 1;
-			display: flex;
-			// padding: 0 80rpx 0 30rpx;
-			padding: 0 30rpx 0 30rpx;
-			box-sizing: border-box;
-			justify-content: space-between;
-
-			.item {
-				height: 88rpx;
-				display: flex;
-				align-items: center;
-				justify-content: center;
-				font-size: 30rpx;
-				color: #666666;
-
-				&.current {
-					color: #FF3F42;
-				}
-
-				image {
-					width: 18rpx;
-					height: 30rpx;
-					display: block;
-					margin-left: 10rpx;
-				}
-			}
-		}
-
-		.icon {
-			padding-right: 10rpx;
-
-			image {
-				width: 36rpx;
-				height: 36rpx;
-				display: block;
-			}
-		}
-	}
+<template>
+	<view class="app-container">
+		<view class="home-container">
+			<block>
+				<view class="top-container">
+					<image src="@/static/home/top_bg.png" mode="widthFix" class="bg"></image>
+					<view class="content">
+						<view class="title" :style="cuStyle">广佛格力商城</view>
+						<view class="header-container">
+							<view class="left" @tap="getLocation">
+								<image src="@/static/home/dingweitus.png"></image>
+								<text style="color: #ffffff;">{{currentPosition||''}}</text>
+							</view>
+						</view>
+						<view class="search">
+							<image src="@/static/icon/search.png" class=""></image>
+							<input v-model="keyword" @confirm="searchSubmit" type="text" confirm-type="search"
+								placeholder="搜索商品名称或型号">
+						</view>
+						<view class="shangjiakapian">
+							<view class="shangjiatupiand">
+								<image style="width: 100%;height: 310rpx;" src="@/static/home/shangjiabeijing.png"
+									class=""></image>
+								<view class="nirongdd">
+									<view style="color:#ffffff;font-size: 36rpx;margin-bottom: 16rpx;">
+										{{websitData.name||''}}
+									</view>
+									<view
+										style="margin-bottom: 16rpx;display: flex;justify-content: flex-start;align-items: center;">
+										<view
+											style="color:#ffffff;font-size: 24rpx;box-sizing: border-box;padding: 8rpx 18rpx;border-radius: 20rpx;background: rgba(245, 245,245,0.2);margin-right: 20rpx;">
+											{{websitData.type||''}}
+										</view>
+										<view style="color:#ffffff;font-size: 24rpx;">
+											{{websitData.websitNumber||''}}
+										</view>
+									</view>
+									<view style="color:#ffffff;font-size: 24rpx;">地址：{{websitData.address||''}}</view>
+								</view>
+								<view
+									style="display: flex;justify-content: space-between;align-items: center;width: 100%;height: 100rpx;position: absolute;left: 0;bottom: 0;right: 0;background: rgba(245, 245,245,0.3);">
+									<view style="width: 50%;display: flex;justify-content: center;align-items: center;"
+										@click="dakaidaoh">
+										<image style="width: 40rpx;height: 40rpx;" src="@/static/home/juliduoyuan.png"
+											class=""></image>
+										<view style="font-size: 28rpx;color: #ffffff;margin-left: 20rpx;">
+											距您{{distancess||''}}KM
+										</view>
+									</view>
+									<view
+										style="width: 6rpx;height: 50rpx;border-radius: 3rpx;background:rgba(245, 245,245,0.6);">
+									</view>
+									<view style="width: 50%;display: flex;justify-content: center;align-items: center;"
+										@click="bodasjdh(websitData.mobile||'')">
+										<image style="width: 40rpx;height: 40rpx;" src="@/static/home/dianhuaaa.png"
+											class=""></image>
+										<view style="font-size: 28rpx;color: #ffffff;margin-left: 20rpx;">电话</view>
+									</view>
+								</view>
+								<image @click="chakanyyzz" style="width: 50rpx;height: 50rpx;position: absolute; top: 30%; right: 40rpx;"
+									src="@/static/home/yinyangzhiz.png"></image>
+							</view>
+							<view class="shangjiakapiandibubiaos">
+								<view class="shangjiakapiandibuItem">
+									<view>官方直营</view>
+								</view>
+								<view class="shangjiakapiandibuItem">
+									<view>急速发货</view>
+								</view>
+								<view class="shangjiakapiandibuItem">
+									<view>全场包邮</view>
+								</view>
+							</view>
+						</view>
+					</view>
+				</view>
+
+				<view class="swiper-container" v-if=" bannerList.length > 0">
+					<swiper @change="changeBanner" :autoplay="true">
+						<block v-for="(item, index) in bannerList" :key='index'>
+							<swiper-item>
+								<image :src="item.imgSrc" mode="aspectFill"
+									@tap="toMiniProgram(item.appId, item.linkUrl)" v-if="item.type === 2"></image>
+								<image :src="item.imgSrc" mode="aspectFill" @tap="toActivityList(item.goodsId)"
+									v-if="item.type === 3"></image>
+								<image :src="item.imgSrc" mode="aspectFill" @tap="toGoodsDetail(item.goodsId)" v-else>
+								</image>
+							</swiper-item>
+						</block>
+					</swiper>
+					<view class="dots-conatiner">
+						<view class="con" :style="'width:'+(bannerList.length * 20)+'rpx;'">
+							<view class="dot" :style=" 'transform:translateX('+ (bannerCurrent * 100) +'%)' "></view>
+						</view>
+					</view>
+				</view>
+			</block>
+			<!-- --------------------------------- -->
+			<view class="caidanrukou">
+				<view class="dangecaidanrukou" @click="goodsClassify">
+					<view>
+						<image class="tupiancaidan" src="@/static/home/fenlei.png"></image>
+					</view>
+					<view class="dangecaidanrukouTitle">商品分类</view>
+				</view>
+				<view class="dangecaidanrukou" @click="couponList">
+					<view>
+						<image class="tupiancaidan" src="@/static/home/youhuiquan.png"></image>
+					</view>
+					<view class="dangecaidanrukouTitle">优惠卡券</view>
+				</view>
+				<view class="dangecaidanrukou" @click="orderListPage">
+					<view>
+						<image class="tupiancaidan" src="@/static/home/dingdan.png"></image>
+					</view>
+					<view class="dangecaidanrukouTitle">我的订单</view>
+				</view>
+			</view>
+		</view>
+
+		<view class="sptjyangshi">
+			商品推荐
+		</view>
+		<view class="top-container2">
+			<view class="tab">
+				<view class="item" :class="screenType === 0 ? 'current':''" @tap="changeScreen(0)">综合</view>
+				<view class="item" :class="screenType === 1 ? 'current':''" @tap="changeScreen(1)">销量</view>
+				<view class="item" :class="screenType === 2 || screenType === 3 ? 'current':''" @tap="changeScreen(2)">
+					价格
+					<image src="@/static/icon/price_1.png" v-if="screenType === 2"></image>
+					<image src="@/static/icon/price_2.png" v-if="screenType === 3"></image>
+					<image src="@/static/icon/price_0.png" v-if="screenType != 2 && screenType != 3"></image>
+				</view>
+				<view class="item" :class="screenType === 4 ? 'current':''" @tap="changeScreen(4)">上架时间</view>
+			</view>
+			<!-- 切换商品卡片样式 -->
+			<!-- <view class="icon">
+				<image src="@/static/icon/show_1.png" v-if="showType == 1" @tap="showType = 2"></image>
+				<image src="@/static/icon/show_2.png" v-if="showType == 2" @tap="showType = 1"></image>
+			</view> -->
+		</view>
+
+		<view class="goods-waterfall-list" v-show="showType == 1">
+			<view class="left">
+				<block v-for="(item, index) in goodsList" :key='index'>
+					<view class="item" v-if="index%2==0" @tap="toGoodsDetail(item.goodsId)">
+						<view class="image">
+							<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
+							<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
+						</view>
+						<view class="content">
+							<view class="title ellipsis-2">{{item.goodsName}}</view>
+							<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
+								<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
+							</view>
+							<view class="price">
+								<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
+								<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
+							</view>
+							<view class="tags2" v-if="item.tags2 && item.tags2.length > 0">
+								<view class="it" v-for="(it, idx) in item.tags2" :key="idx">{{it}}</view>
+							</view>
+							<view class="text">销量：{{item.soldNum}}</view>
+						</view>
+					</view>
+				</block>
+			</view>
+			<view class="right">
+				<block v-for="(item, index) in goodsList" :key='index'>
+					<view class="item" v-if="index%2==1" @tap="toGoodsDetail(item.goodsId)">
+						<view class="image">
+							<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
+							<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
+						</view>
+						<view class="content">
+							<view class="title ellipsis-2">{{item.goodsName}}</view>
+							<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
+								<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
+							</view>
+							<view class="price">
+								<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
+								<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
+							</view>
+							<view class="tags2" v-if="item.tags2 && item.tags2.length > 0">
+								<view class="it" v-for="(it, idx) in item.tags2" :key="idx">{{it}}</view>
+							</view>
+							<view class="text">销量：{{item.soldNum}}</view>
+						</view>
+					</view>
+				</block>
+			</view>
+		</view>
+
+		<view class="goods-row-list" v-show="showType == 2">
+			<block v-for="(item, index) in goodsList" :key='index'>
+				<view class="item" @tap="toGoodsDetail(item.goodsId)">
+					<view class="image">
+						<image :src="item.imgUrl" mode="aspectFill" class="img"></image>
+						<image :src="item.logo" mode="aspectFill" class="water" v-if="item.isShowWater"></image>
+					</view>
+					<view class="right">
+						<view>
+							<view class="title ellipsis-2">{{item.goodsName}}</view>
+							<view class="tags" v-if="item.tags1 && item.tags1.length > 0">
+								<view class="it" v-for="(it, idx) in item.tags1" :key="idx">{{it}}</view>
+							</view>
+						</view>
+						<view>
+							<view class="bottom">
+								<view class="price">
+									<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
+									<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
+								</view>
+								<view class="text">销量：{{item.soldNum}}</view>
+							</view>
+						</view>
+					</view>
+				</view>
+			</block>
+		</view>
+		<no-data v-if="!goodsList.length" :showText="'暂无商品'"></no-data>
+		<loading-text v-if="goodsList.length" :loading="loading" :noMore="noMore"></loading-text>
+
+		<!-- <drag-button :isDock="true" :customBar="true" ref="dragButton"></drag-button> -->
+
+
+		<!-- <HomePageA :homePage="homePage" :templateInfo="templateInfo"  /> -->
+		<!-- <HomePageB :homePage="homePage" :templateInfo="templateInfo"  /> -->
+		<!-- <HomePageC :homePage="homePage" :templateInfo="templateInfo"  /> -->
+
+		<view v-if="isSharePyq">
+			<image
+				src="https://zfire-train.oss-cn-guangzhou.aliyuncs.com/train/pic/1657090568346be106ca9-dd33-48d2-b06b-e4a02b06f2a2.png"
+				mode="widthFix" style="width: 100%" @tap="clickPyq"></image>
+		</view>
+
+		<!-- 购买弹窗 -->
+		<view class="global-mask" v-show="isBuyDialog"></view>
+		<view class="buyDialog" v-show="isBuyDialog">
+			<view class="close">
+				<image src="@/static/icon/close.png" @tap="isBuyDialog = false"></image>
+			</view>
+			<view class="goods" v-if="orderDetail.orderDetails && orderDetail.orderDetails.length == 1">
+				<image :src="orderDetail.orderDetails[0].imgUrl" mode="aspectFill"></image>
+				<view class="name ellipsis-2">{{orderDetail.orderDetails[0].goodsName}}</view>
+				<view class="des ellipsis">{{orderDetail.orderDetails[0].goodsSpecValue}}</view>
+			</view>
+			<view class="goodsList" v-if="orderDetail.orderDetails && orderDetail.orderDetails.length > 1">
+				<block v-for="(item, index) in orderDetail.orderDetails" :key='index'>
+					<view class="item">
+						<image :src="item.imgUrl" mode="aspectFill"></image>
+						<view class="right">
+							<view class="name ellipsis-2">{{item.goodsName}}</view>
+							<view class="des ellipsis">{{item.goodsSpecValue}}</view>
+						</view>
+					</view>
+				</block>
+			</view>
+			<view class="num">共<text>{{orderDetail.totalNum}}</text>件商品</view>
+			<view class="price">需支付金额：<text>¥{{orderDetail.payAmount}}</text></view>
+			<view class="button" @tap="payment">立即支付</view>
+		</view>
+
+		<!-- 优惠券提醒 -->
+		<view class="global-mask" v-show="isCouponDialog"></view>
+		<view class="couponDialog" v-show="isCouponDialog">
+			<image src="@/static/home/cp_dialog.png" mode="widthFix"></image>
+			<view class="bottom">
+				<view class="text">你有优惠券即将到期，请尽快使用！</view>
+				<view class="btn-group">
+					<view class="button left" @tap="isCouponDialog = false">关闭</view>
+					<view class="button right" @tap="toMyCoupon">去看看</view>
+				</view>
+			</view>
+		</view>
+		<!-- 领取优惠券弹窗 -->
+		<view class="global-mask" v-show="isReceiveDialog"></view>
+		<view class="couponDialog" v-show="isReceiveDialog">
+			<image src="@/static/home/cp_dialog.png" mode="widthFix"></image>
+			<view class="bottom">
+				<view class="text">你有一张优惠券可领取！</view>
+				<view class="btn-group onlyOne">
+					<view class="button right" @tap="receiveCoupon">立即领取</view>
+				</view>
+			</view>
+		</view>
+
+		<modal-dialog showTitle="提示" showText="领取成功" :isShowDialog="isReceiveCouponDialog && isReceiveSuccess"
+			@cancel="isReceiveCouponDialog = false" @confirm="toMyCoupon()" confirmText="去看看"></modal-dialog>
+
+		<modal-dialog showTitle="提示" :showText="'领取失败：'+failMessage"
+			:isShowDialog="isReceiveCouponDialog && !isReceiveSuccess" @cancel="isReceiveCouponDialog = false"
+			:isShowConfirm="false" cancelText="关闭"></modal-dialog>
+
+	</view>
+</template>
+
+<script>
+	import HomePageA from "@/pages/index/components/home-page-a";
+	import HomePageB from "@/pages/index/components/home-page-b";
+	import HomePageC from "@/pages/index/components/home-page-c";
+	import {
+		mapState
+	} from 'vuex';
+	import {
+		appId
+	} from '@/utils/config.js';
+	import modalDialog from '@/components/modalDialog.vue';
+	export default {
+		components: {
+			HomePageA,
+			HomePageB,
+			HomePageC,
+			modalDialog,
+		},
+		data() {
+			return {
+				configInfo: uni.getStorageSync('configInfo'),
+				templateInfo: uni.getStorageSync('templateInfo'),
+				isBuyDialog: false, // 是否显示购买弹窗（业务员代客下单时产生）
+				orderDetail: {}, // 订单详情（购买弹窗需要）
+				scene: { // 页面参数（扫码进入小程序时产生）
+					type: '',
+					goodsId: '',
+					orderId: '',
+					serviceId: '',
+					couponId: '',
+				},
+				isCouponDialog: false, // 是否显示过期优惠券弹窗
+				isReceiveCouponDialog: false,
+				isReceiveSuccess: true,
+				failMessage: '',
+				isReceiveDialog: false,
+				isSmsReceive: false,
+				homePage: 0,
+				isSharePyq: false,
+				keyword: "",
+
+				screenType: '',
+				goodsList: [],
+				pageNum: 1,
+				pageSize: 8,
+				noMore: false,
+				loading: false,
+				showType: 2,
+				bannerList: [], // 轮播图列表
+				bannerCurrent: 0, // 轮播图当前值
+				distancess: "",
+				currentPosition: ''
+			}
+		},
+		computed: {
+			...mapState(['userInfo', 'isLogin', 'userId', 'websitData']),
+			cuStyle() {
+				return `height:${this.CustomBar-this.StatusBar}px; padding-top:${this.StatusBar}px;`
+			},
+		},
+		watch: {
+			nowDate() {
+				let hh = this.nowDate.getHours(),
+					mm = this.nowDate.getMinutes(),
+					ss = this.nowDate.getSeconds();
+				let hs = [10, 12, 15, 18, 20];
+				if (mm == 0 && ss == 0 && hs.indexOf(hh) >= 0) {
+					setTimeout(() => {
+						this.getSeckillTimeList();
+					}, 1000)
+				}
+			},
+			websitData() {
+
+			}
+		},
+
+		// 页面滚动
+		onPageScroll(res) {
+			uni.$emit('onPageScroll', res.scrollTop);
+		},
+
+		// // 下拉刷新
+		// onPullDownRefresh() {
+		// 	if (this.isSharePyq) {
+		// 		return false;
+		// 	}
+		// 	uni.$emit('onPullDownRefresh');
+		// 	// this.getHomePage();
+		// },
+
+		// // 上拉加载
+		// onReachBottom() {
+		// 	uni.$emit('onReachBottom');
+		// },
+
+
+		// 下拉刷新
+		onPullDownRefresh() {
+			if (this.isSharePyq) {
+				return false;
+			}
+			uni.$emit('onPullDownRefresh');
+			this.pageNum = 1;
+			this.getGoodsList();
+			this.getBannerList();
+			this.chishuhuade();
+		},
+
+		// 上拉加载
+		onReachBottom() {
+			this.getGoodsList(1);
+			uni.$emit('onReachBottom');
+		},
+
+
+		// 页面隐藏
+		onHide() {
+			uni.$emit('onHide');
+		},
+
+		// 页面显示
+		async onShow() {
+			this.chishuhuade()
+			var obj = wx.getLaunchOptionsSync()
+			if (obj.scene == 1154) {
+				return this.isSharePyq = true;
+			}
+			await this.$onLaunched;
+		},
+
+		// 页面加载
+		async onLoad({
+			scene,
+			goodsId,
+			serviceId,
+			mobile,
+			smsServiceId,
+			otherType,
+			appOrderId
+		}) {
+			await this.$onLaunched;
+
+			// uni.showLoading({
+			//     title: '加载中'
+			// });
+
+			this.getConfig();
+
+			this.checkCoupon();
+
+			this.getBannerList();
+
+			// // 点击短信链接进入小程序
+			// if (smsServiceId) {
+			// 	this.bindUser(smsServiceId);
+			// 	if (this.userInfo.type !== "SERVICE") {
+			// 		this.isSmsReceive = true;
+			// 		this.isReceiveDialog = true;
+			// 	}
+			// }
+
+			// // 从师傅端app跳转进入小程序
+			// if (appOrderId) {
+			// 	this.appOrderPay(appOrderId);
+			// }
+
+			// if (otherType) {
+			// 	if (otherType === 'groupbuyList') {
+			// 		uni.navigateTo({
+			// 			url: '/pages/mine/groupbuy/list'
+			// 		})
+			// 	}
+			// }
+
+			if (serviceId) {
+				this.bindUser(serviceId);
+			}
+
+			// 点击商品链接进入小程序
+			if (goodsId) {
+				this.toGoodsDetail(goodsId);
+			}
+
+			// 扫码进入小程序
+			if (scene) {
+				// 拿scene的id去获取
+				this.$axios({
+					url: '/common/scene',
+					method: 'get',
+					params: {
+						scene: scene,
+					}
+				}).then(res => {
+					let newScene = res.data.split("&");
+					this.scene.type = newScene[0];
+					this.scene.serviceId = newScene[2];
+					// 如果是商品
+					if (newScene[0] == 'goods') {
+						this.scene.goodsId = newScene[1];
+						this.toGoodsDetail(this.scene.goodsId);
+					}
+
+					// 如果是商城分享码
+					else if (newScene[0] == 'bind') {
+
+					}
+
+					// 如果是订单
+					else if (newScene[0] == 'order') {
+						this.scene.orderId = newScene[1];
+						this.getOrderInfo();
+					}
+					
+					// 如果是优惠券
+					else if (newScene[0] == 'coupon') {
+						this.scene.couponId = newScene[1];
+						this.isReceiveDialog = true;
+						// this.receiveCoupon(this.scene.couponId);
+					}
+					// // 如果是团购分享码
+					// else if (newScene[0] == 'promotion_group') {
+					// 	uni.navigateTo({
+					// 		url: '/pages/mine/groupbuy/list'
+					// 	})
+					// }
+
+					if (this.scene.serviceId) {
+						this.bindUser(this.scene.serviceId);
+					}
+				})
+			}
+
+			this.getGoodsList();
+
+		},
+
+		// 分享
+		onShareAppMessage(options) {
+			if (options && options.from == 'button') {
+				// 来自页面内的转发按钮
+			} else {
+				// 点击微信右上角的分享按钮
+			}
+			return {
+				title: `${this.userInfo.nickName}向你推荐了「${this.configInfo.minAppName}」小程序`,
+				path: '/pages/index/index?serviceId=' + this.userId,
+				query: {},
+				success: function(res) {
+					if (res.errMsg == 'shareAppMessage:ok') {
+						this.$successToast('分享完成');
+					}
+				}
+			}
+		},
+
+		onShareTimeline() {
+			return {
+				title: `${this.userInfo.nickName}向你推荐了「${this.configInfo.minAppName}」小程序`,
+				query: 'serviceId=' + this.userId,
+				success: function(res) {
+					if (res.errMsg == 'shareAppMessage:ok') {
+						this.$successToast('分享完成');
+					}
+				}
+			}
+		},
+
+		methods: {
+			
+			chakanyyzz(){
+				uni.navigateTo({
+					url: '/pages/index/chakanyyzz'
+				})
+			},
+			
+			chishuhuade(){
+				uni.getLocation({
+					type: 'gcj02',
+					success: res => {
+						this.$axios({
+							url: '/user/user/detail',
+							method: 'get',
+							params: {
+								userId: this.userId,
+								lat: res.latitude,
+								lng: res.longitude,
+							},
+						}).then((res) => {
+							this.distancess = res.data.distance
+						});
+						this.$axios({
+							url: '/user/address',
+							method: 'post',
+							params: {
+								lat: res.latitude,
+								lng: res.longitude,
+							},
+						}).then((res) => {
+							var {
+								provinceName,
+								cityName,
+								areaName,
+								name
+							} = res.data
+							this.currentPosition = `${provinceName}${cityName}${areaName}${name}`
+						});
+					},
+					fail: err => {
+				
+					}
+				})
+			},
+
+			goodsClassify() {
+				uni.switchTab({
+					url: '/pages/goods/classify'
+				});
+			},
+			couponList() {
+				uni.navigateTo({
+					url: '/pages/mine/coupon/list'
+				})
+			},
+			orderListPage() {
+				uni.navigateTo({
+					url: '/pages/mine/order/list'
+				})
+			},
+			// 打开导航
+			dakaidaoh() {
+				console.log(this.websitData.lat,this.websitData.lng)
+				uni.openLocation({
+					latitude: Number(this.websitData.lat),
+					longitude: Number(this.websitData.lng),
+					success: function() {
+						console.log('success');
+					}
+				});
+			},
+			// 拨打商家电话
+			bodasjdh(phoneNumber) {
+				console.log(2222)
+				if (phoneNumber) {
+					uni.makePhoneCall({
+						phoneNumber: phoneNumber
+					});
+				} else {
+					uni.showModal({
+						title: '提示',
+						content: '商家没有手机号码！',
+						success: (res) => {
+							if (res.confirm) {} else if (res.cancel) {}
+						}
+					});
+				}
+			},
+			// 获取轮播图列表
+			getBannerList() {
+				this.$axios({
+					url: '/common/list/page',
+					method: 'get',
+					params: {
+						pageNum: 1,
+						pageSize: 10,
+						state: true
+					}
+				}).then(res => {
+					this.bannerList = res.data.records;
+				}).finally(res => {})
+			},
+			// 切换广告图
+			changeBanner(e) {
+				this.bannerCurrent = e.detail.current;
+			},
+			// 跳转小程序
+			toMiniProgram(appId, path) {
+				wx.navigateToMiniProgram({
+					appId,
+					path,
+					extraData: {},
+					envVersion: 'release',
+					success(res) {}
+				});
+			},
+			// 进入活动列表
+			toActivityList(type) {
+				if (type == 2) {
+					this.closeDialog();
+				}
+				uni.navigateTo({
+					url: '/packageGoods/pages/activity?type=' + type
+				})
+			},
+
+			getLocation() {
+				if (!this.userInfo?.serviceWorkerBean?.websitId) {
+					uni.navigateTo({
+						url: '/pages/address/list'
+					})
+				}
+			},
+
+			searchSubmit() {
+				if (this.keyword) {
+					this.pageNum = 1;
+					this.getGoodsList();
+				}
+			},
+			// 获取页面模版
+			async getHomePage() {
+				const result = await new Promise((resolve, reject) => {
+					this.$axios({
+						url: '/renovation/detail',
+						method: 'get',
+					}).then(res => {
+						if (res.data) {
+							uni.setStorageSync('templateInfo', res.data);
+							this.templateInfo = res.data;
+							this.homePage = res.data.templateType;
+							resolve(res.data.templateType);
+						}
+					}).catch(res => {
+						this.homePage = 1;
+						resolve(1);
+					})
+				})
+				return result;
+			},
+
+			// 获取配置信息
+			getConfig() {
+				this.$axios({
+					url: '/common/config/get',
+					method: 'get',
+				}).then(res => {
+					if (res.data) {
+						uni.setStorageSync('configInfo', res.data);
+					}
+				})
+			},
+
+			// 绑定用户关系
+			bindUser(serviceId) {
+				if (this.userInfo?.userId) {
+					if (!this.userInfo?.serviceWorkerBean) {
+						this.$axios({
+							url: '/user/bind',
+							params: {
+								serviceId: serviceId,
+								userId: this.userId,
+							}
+						}).then(res => {
+							console.log('绑定成功：' + res.message);
+						})
+					}
+				} else {
+					setTimeout(() => {
+						this.bindUser(serviceId)
+					}, 100)
+				}
+			},
+
+			// 点击分享朋友圈的图
+			clickPyq() {
+				this.$toast('请前往小程序使用完整服务');
+			},
+
+			// app订单支付
+			appOrderPay(appOrderId) {
+				let that = this;
+				this.$axios({
+					url: '/common/online/pay',
+					method: 'post',
+					params: {
+						key: appOrderId,
+						openId: uni.getStorageSync('userInfo').openId,
+					}
+				}).then(res => {
+					if (!res.data) return false;
+					let data = JSON.parse(res.data.codeUrl);
+					wx.requestPayment({
+						timeStamp: data.timeStamp,
+						nonceStr: data.nonceStr,
+						package: data.package,
+						signType: 'RSA',
+						paySign: data.paySign,
+						success: (res) => {
+							that.$successToast('支付成功');
+						},
+						fail: (err) => {
+							that.$toast('支付失败');
+						}
+					})
+				})
+			},
+
+			// 进入商品详情
+			toGoodsDetail(id) {
+				if (!id) {
+					return false;
+				}
+
+				this.$axios({
+						url: '/goods/detail',
+						method: 'get',
+						params: {
+							goodsId: id,
+							userId: this.userId,
+						},
+					})
+					.then((res) => {
+						uni.navigateTo({
+							url: '/packageGoods/pages/detail?id=' + id
+						})
+					})
+					.catch((res) => {
+						uni.switchTab({
+							url: '/pages/goods/all'
+						});
+					})
+					.finally((res) => {});
+			},
+
+			// 检查是否有优惠券过期
+			checkCoupon() {
+				this.$axios({
+					url: '/coupon/timeout',
+					method: 'get',
+					params: {},
+				}).then(res => {
+					if (res.data) {
+						this.isCouponDialog = true;
+					}
+				})
+			},
+
+			// 进入我的优惠券
+			toMyCoupon() {
+				this.isCouponDialog = false;
+				this.isReceiveCouponDialog = false;
+				uni.navigateTo({
+					url: '/pages/mine/coupon/list'
+				})
+			},
+
+			// 领取优惠券
+			receiveCoupon(id) {
+				if (!this.isLogin) {
+					return uni.navigateTo({
+						url: '/pages/login/index'
+					})
+				}
+				if (this.isSmsReceive) {
+					this.$axios({
+						url: '/coupon/obtain',
+						method: 'get',
+						params: {
+							userId: '',
+							couponId: ''
+						}
+					}).then(res => {
+						this.isReceiveDialog = false;
+						this.isReceiveSuccess = true;
+						this.isReceiveCouponDialog = true;
+					}).catch(res => {
+						this.failMessage = res.message;
+						this.isReceiveDialog = false;
+						this.isReceiveSuccess = false;
+						this.isReceiveCouponDialog = true;
+					})
+				} else {
+					this.$axios({
+						url: '/coupon/transfer/coupon',
+						method: 'get',
+						params: {
+							userCouponId: this.scene.couponId
+						}
+					}).then(res => {
+						this.isReceiveDialog = false;
+						this.isReceiveSuccess = true;
+						this.isReceiveCouponDialog = true;
+					}).catch(res => {
+						this.failMessage = res.message;
+						this.isReceiveDialog = false;
+						this.isReceiveSuccess = false;
+						this.isReceiveCouponDialog = true;
+					})
+				}
+			},
+
+			// 获取订单信息
+			getOrderInfo() {
+				this.$axios({
+					url: '/order/detail',
+					method: 'get',
+					params: {
+						orderId: this.scene.orderId
+					}
+				}).then(res => {
+					if (res.data && res.data.orderStatus === 'NOPAY') {
+						this.orderDetail = res.data;
+						this.isBuyDialog = true;
+					} else {
+						return this.$toast('二维码已失效，请重新生成');
+					}
+				})
+			},
+
+			// 支付
+			payment() {
+				let that = this;
+				if (!this.isLogin) {
+					uni.navigateTo({
+						url: '/pages/login/index'
+					})
+				} else {
+					this.$axios({
+						url: '/order/wait/pay',
+						params: {
+							userId: this.userId,
+							orderId: this.scene.orderId,
+						},
+						isLoading: 1,
+					}).then(res => {
+						uni.getProvider({
+							service: 'payment',
+							success: (e) => {
+								uni.requestPayment({
+									provider: e.provider[0],
+									orderInfo: res.data,
+									timeStamp: res.data.timeStamp,
+									nonceStr: res.data.nonceStr,
+									package: res.data.payPackage,
+									signType: 'MD5',
+									paySign: res.data.paySign,
+									success: (res) => {
+										that.$successToast('支付成功');
+										that.isBuyDialog = false;
+										that.requestMessage();
+									},
+									fail: (err) => {
+										that.$toast('支付失败');
+									}
+								})
+							}
+						})
+					})
+				}
+			},
+
+			// 消息推送
+			requestMessage() {
+				let that = this;
+				uni.showModal({
+					title: '温馨提示',
+					content: '为更好的促进您与买家的交流，需要在您的订单成交时向您发送消息',
+					confirmText: "同意",
+					cancelText: "拒绝",
+					success: function(res) {
+						if (res.confirm) {
+							let tmplIds = [that.configInfo.template];
+							uni.requestSubscribeMessage({
+								tmplIds: tmplIds,
+								success(res) {
+									let status = null;
+									tmplIds.map((item, index) => {
+										if (res[item] == 'accept') {
+											status = 'accept';
+										}
+									})
+									if (status == 'accept') {
+										that.$successToast('订阅成功');
+									} else {
+										that.$toast('订阅取消');
+									}
+								},
+								fail(res) {
+									console.log(res);
+									that.$toast('订阅失败');
+								}
+							})
+						} else if (res.cancel) {
+							uni.showModal({
+								title: '温馨提示',
+								content: '拒绝后您将无法获取实时的与卖家（买家）的交易消息',
+								confirmText: "知道了",
+								showCancel: false,
+								success: function(res) {
+
+								}
+							});
+						}
+					}
+				});
+			},
+
+			// ------------------------------------
+			// 切换筛选类型
+			changeScreen(type) {
+				if (type != 2) {
+					if (this.screenType !== type) {
+						this.screenType = type;
+					} else {
+						this.screenType = '';
+					}
+				} else {
+					if (this.screenType != 2 && this.screenType != 3) {
+						this.screenType = 2;
+					} else if (this.screenType == 2) {
+						this.screenType = 3;
+					} else {
+						this.screenType = '';
+					}
+				}
+				this.pageNum = 1;
+				this.getGoodsList();
+			},
+
+			// 获取商品列表
+			getGoodsList(loadMore) {
+				if (this.noMore && loadMore) return;
+				this.noMore = false
+				if (!loadMore) {
+					this.pageNum = 1;
+				} else {
+					this.loading = true;
+				}
+				this.$axios({
+					url: '/goods/list/sort/page',
+					method: 'get',
+					params: {
+						pageNum: this.pageNum,
+						pageSize: this.pageSize,
+						categoryId: '',
+						sort: this.screenType,
+						keyword: this.keyword
+					},
+					isLoading: !loadMore
+				}).then(res => {
+					res.data.records.forEach(item => {
+						if (item.logo && item.logoStartTime) {
+							item.isShowWater = this.$compareTime(item.logoStartTime, item.logoEndTime);
+						} else {
+							item.isShowWater = false;
+						}
+					})
+					let _list = res.data.records;
+					let pageTotal = res.data.pages;
+					if (this.pageNum >= pageTotal) {
+						this.noMore = true;
+					}
+					if (_list.length) {
+						this.pageNum += 1
+					}
+					if (loadMore) {
+						this.goodsList = this.goodsList.concat(_list);
+						this.loading = false;
+					} else {
+						this.goodsList = _list;
+					}
+
+					uni.stopPullDownRefresh();
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.shangjiakapian {
+		width: 100%;
+		height: auto;
+		border-radius: 30rpx;
+		overflow: hidden;
+		background: #ffffff;
+		margin-top: 30rpx;
+
+		.shangjiatupiand {
+			position: relative;
+
+			.nirongdd {
+				position: absolute;
+				top: 0;
+				left: 0;
+				right: 0;
+				bottom: 0;
+				box-sizing: border-box;
+				padding: 26rpx;
+			}
+		}
+
+		.shangjiakapiandibubiaos {
+			width: 100%;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+
+			.shangjiakapiandibuItem {
+				width: 33.33%;
+				height: auto;
+				box-sizing: border-box;
+				padding: 16rpx;
+				display: flex;
+				justify-content: center;
+				align-items: center;
+				font-size: 20rpx;
+				color: red;
+			}
+		}
+
+	}
+
+	.header-container {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		padding: 0 10rpx 10rpx;
+
+		.left {
+			display: flex;
+			align-items: center;
+
+			image {
+				width: 48rpx;
+				height: 48rpx;
+			}
+		}
+	}
+
+	.top-container {
+		position: relative;
+
+		.bg {
+			display: block;
+			width: 750rpx;
+			position: absolute;
+			top: 0;
+			z-index: 0;
+		}
+
+		.content {
+			width: 710rpx;
+			padding: 0 20rpx;
+			position: relative;
+			z-index: 1;
+		}
+
+		.title {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			color: #FFFFFF;
+			font-size: 36rpx;
+		}
+
+		.search {
+			background: #FFFFFF;
+			height: 64rpx;
+			display: flex;
+			align-items: center;
+			border-radius: 64rpx;
+			padding: 0 20rpx;
+			margin-top: 20rpx;
+
+			image {
+				width: 28rpx;
+				height: 28rpx;
+			}
+
+			input {
+				width: 100%;
+				padding-left: 15rpx;
+			}
+		}
+	}
+
+	.classify-container {
+		margin-top: 40rpx;
+		position: relative;
+		z-index: 1;
+		padding: 0 20rpx;
+
+		.content {
+			border-radius: 20rpx;
+			padding-top: 30rpx;
+			display: flex;
+			flex-wrap: wrap;
+			background: #FFFFFF;
+
+			.item {
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				width: 142rpx;
+				margin-bottom: 30rpx;
+
+				image {
+					width: 78rpx;
+					height: 78rpx;
+					display: block;
+					border-radius: 50%;
+					overflow: hidden;
+				}
+
+				text {
+					font-size: 24rpx;
+					color: #666666;
+					margin-top: 10rpx;
+					width: 150rpx;
+					text-align: center;
+				}
+			}
+		}
+	}
+
+
+
+	.notice-container {
+		padding: 0 20rpx;
+		margin-top: 20rpx;
+
+		.content {
+			display: flex;
+			align-items: center;
+			height: 100rpx;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+		}
+
+		.left {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			width: 96rpx;
+			height: 48rpx;
+			margin-right: 20rpx;
+			border-right: 2rpx solid #E5E5E5;
+
+			image {
+				width: 60rpx;
+				height: 30rpx;
+				display: block;
+			}
+		}
+
+		.swiper {
+			height: 100rpx;
+			flex: 1;
+			padding-right: 20rpx;
+
+			::v-deep swiper-item {
+				display: block;
+				height: 100rpx;
+				width: 100%;
+				line-height: 100rpx;
+			}
+		}
+	}
+
+	.coupon-container {
+		position: relative;
+		margin-top: 20rpx;
+		padding: 0 20rpx;
+
+		.bg {
+			display: block;
+			width: 100%;
+		}
+
+		.list {
+			position: absolute;
+			top: 80rpx;
+			z-index: 1;
+		}
+
+		.list1 {
+			.item {
+				position: relative;
+				margin-bottom: 20rpx;
+				margin-left: 16rpx;
+
+				.cp {
+					width: 688rpx;
+					height: 178rpx;
+					display: block;
+				}
+
+				.content {
+					position: absolute;
+					left: 0;
+					top: 0;
+					width: 710rpx;
+					height: 160rpx;
+					display: flex;
+					align-items: center;
+
+					.left {
+						width: 210rpx;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+						flex-direction: column;
+
+						.price {
+							font-size: 48rpx;
+							color: #FFFFFF;
+						}
+
+						.text {
+							color: #FFFFFF;
+							font-size: 28rpx;
+						}
+					}
+
+					.right {
+						display: flex;
+						align-items: center;
+						justify-content: space-between;
+						padding: 0 20rpx;
+						width: 470rpx;
+						height: 150rpx;
+						box-sizing: border-box;
+
+						.main {
+							width: 430rpx;
+							height: 150rpx;
+							padding: 16rpx 0 8rpx;
+							box-sizing: border-box;
+							display: flex;
+							flex-direction: column;
+							justify-content: space-between;
+
+							.row1 {
+								font-size: 28rpx;
+								line-height: 32rpx;
+								height: 64rpx;
+							}
+
+							.row2 {
+								font-size: 24rpx;
+								line-height: 28rpx;
+								color: #999999;
+								display: flex;
+								justify-content: space-between;
+								align-items: center;
+							}
+						}
+					}
+				}
+			}
+		}
+
+		.list2 {
+			display: flex;
+
+			.item {
+				position: relative;
+				margin-bottom: 20rpx;
+
+				&:first-child {
+					margin-left: 16rpx;
+				}
+
+				.cp {
+					width: 342rpx;
+					height: 308rpx;
+					display: block;
+				}
+
+				.content {
+					position: absolute;
+					left: 0;
+					top: 0;
+					width: 342rpx;
+					height: 328rpx;
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+
+					.top {
+						width: 324rpx;
+						height: 130rpx;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+						flex-direction: column;
+
+						.price {
+							font-size: 48rpx;
+							color: #FFFFFF;
+							line-height: 48rpx;
+							margin-top: 16rpx;
+						}
+
+						.text {
+							color: #FFFFFF;
+							font-size: 28rpx;
+							line-height: 28rpx;
+							margin-top: 10rpx;
+						}
+					}
+
+					.bottom {
+						width: 324rpx;
+						height: 160rpx;
+						padding: 16rpx;
+						box-sizing: border-box;
+						display: flex;
+						flex-direction: column;
+						justify-content: space-between;
+						align-items: center;
+
+						.name {
+							font-size: 28rpx;
+							text-align: left;
+							line-height: 32rpx;
+							width: 100%;
+						}
+
+						.date {
+							font-size: 24rpx;
+							color: #999999;
+							text-align: left;
+							width: 100%;
+							line-height: 28rpx;
+						}
+					}
+				}
+			}
+		}
+
+		.list3 {
+			display: flex;
+			align-items: center;
+
+			.left {
+				display: flex;
+				width: 630rpx;
+				overflow-x: scroll;
+			}
+
+			.right {
+				width: 80rpx;
+				display: flex;
+				justify-content: center;
+
+				.text {
+					width: 48rpx;
+					height: 200rpx;
+					border-radius: 48rpx;
+					background: #FFFFFF;
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					justify-content: center;
+
+					text {
+						font-size: 28rpx;
+						color: #FF3F42;
+						line-height: 32rpx;
+					}
+
+					image {
+						width: 32rpx;
+						height: 32rpx;
+						display: block;
+						flex-shrink: 0;
+						margin-top: 10rpx;
+					}
+				}
+			}
+
+			.item {
+				position: relative;
+				margin-bottom: 20rpx;
+
+				&:first-child {
+					margin-left: 16rpx;
+				}
+
+				.cp {
+					width: 278rpx;
+					height: 308rpx;
+					display: block;
+				}
+
+				.content {
+					position: absolute;
+					left: 0;
+					top: 0;
+					width: 278rpx;
+					height: 328rpx;
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+
+					.top {
+						width: 260rpx;
+						height: 130rpx;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+						flex-direction: column;
+
+						.price {
+							font-size: 48rpx;
+							color: #FFFFFF;
+							line-height: 48rpx;
+							margin-top: 16rpx;
+						}
+
+						.text {
+							color: #FFFFFF;
+							font-size: 28rpx;
+							line-height: 28rpx;
+							margin-top: 10rpx;
+						}
+					}
+
+					.bottom {
+						width: 260rpx;
+						height: 160rpx;
+						padding: 16rpx;
+						box-sizing: border-box;
+						display: flex;
+						flex-direction: column;
+						justify-content: space-between;
+						align-items: center;
+
+						.name {
+							font-size: 28rpx;
+							text-align: left;
+							line-height: 32rpx;
+							width: 100%;
+						}
+
+						.date {
+							font-size: 24rpx;
+							color: #999999;
+							text-align: left;
+							width: 100%;
+							line-height: 28rpx;
+						}
+					}
+				}
+			}
+		}
+
+		.button {
+			width: 120rpx;
+			height: 40rpx;
+			border-radius: 40rpx;
+			font-size: 24rpx;
+			flex-shrink: 0;
+			box-sizing: border-box;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+
+			&.gary {
+				background: #AAAAAA;
+				color: #FFFFFF;
+				border: 1px solid #AAAAAA;
+			}
+
+			&.red {
+				background: #C434FF;
+				color: #FFFFFF;
+				border: 1px solid #C434FF;
+			}
+
+			&.white {
+				color: #FF3F42;
+				border: 1px solid #FF3F42;
+			}
+		}
+	}
+
+	.myManager-container {
+		padding: 0 20rpx;
+
+		.content {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			padding: 20rpx;
+
+			.left {
+				display: flex;
+				align-items: center;
+
+				image {
+					width: 100rpx;
+					height: 100rpx;
+					border-radius: 50%;
+				}
+
+				.main {
+					font-size: 28rpx;
+					line-height: 48rpx;
+					margin-left: 20rpx;
+				}
+			}
+
+			.right {
+				width: 160rpx;
+				height: 60rpx;
+				line-height: 60rpx;
+				border-radius: 60rpx;
+				text-align: center;
+				font-size: 28rpx;
+				color: #E43B38;
+				border: 1px solid #E43B38;
+			}
+		}
+	}
+
+	.seckill-container {
+		position: relative;
+		margin-top: 20rpx;
+		min-height: 340rpx;
+
+		.bg {
+			display: block;
+			width: 750rpx;
+			position: absolute;
+			top: 0;
+			z-index: 0;
+		}
+
+		.content {
+			width: 710rpx;
+			padding: 0 20rpx;
+			position: relative;
+			z-index: 1;
+		}
+
+		.time-list {
+			display: flex;
+			overflow-x: scroll;
+			padding-top: 90rpx;
+			padding-bottom: 40rpx;
+
+			.item {
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				flex-shrink: 0;
+				width: 140rpx;
+				margin-right: 48rpx;
+
+				.time {
+					font-size: 32rpx;
+					color: #FFFFFF;
+				}
+
+				.tag {
+					width: 140rpx;
+					height: 44rpx;
+					border-radius: 44rpx;
+					border: 1px solid #FFFFFF;
+					font-size: 24rpx;
+					color: #FFFFFF;
+					box-sizing: border-box;
+					margin-top: 12rpx;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+				}
+
+				&.current {
+					.tag {
+						background: #FFFFFF;
+						color: #FF3F42;
+					}
+				}
+			}
+		}
+
+		.product-list {
+			.item {
+				background: #FFFFFF;
+				border-radius: 10rpx;
+				display: flex;
+				padding: 20rpx;
+				margin-bottom: 20rpx;
+
+				image {
+					display: block;
+					width: 180rpx;
+					height: 180rpx;
+					flex-shrink: 0;
+				}
+
+				.right {
+					width: 490rpx;
+					box-sizing: border-box;
+					padding-left: 20rpx;
+
+					.title {
+						font-size: 30rpx;
+						color: #333333;
+						line-height: 36rpx;
+						font-weight: 600;
+					}
+
+					.des {
+						font-size: 24rpx;
+						line-height: 30rpx;
+						color: #999999;
+						margin-top: 6rpx;
+					}
+
+					.stock-sales {
+						display: flex;
+						justify-content: space-between;
+						align-items: center;
+						margin-top: 10rpx;
+						font-size: 24rpx;
+						color: #666666;
+
+						.stock {
+							display: flex;
+							align-items: center;
+
+							text {
+								font-size: 24rpx;
+								color: #666666;
+							}
+
+							.progress-box {
+								width: 140rpx;
+								border-radius: 6px;
+								overflow: hidden;
+								margin-left: 10rpx;
+							}
+						}
+					}
+
+					.bottom {
+						display: flex;
+						justify-content: space-between;
+						align-items: center;
+						margin-top: 10rpx;
+
+						.price {
+							display: flex;
+							flex-direction: column;
+						}
+
+						.price-1 {
+							font-size: 32rpx;
+							color: #FF3F42;
+							line-height: 36rpx;
+						}
+
+						.price-2 {
+							font-size: 26rpx;
+							color: #666666;
+							line-height: 30rpx;
+							text-decoration: line-through;
+						}
+
+						.btn {
+							width: 110rpx;
+							height: 44rpx;
+							background: #FF3F42;
+							border-radius: 5rpx;
+							font-size: 28rpx;
+							color: #FFFFFF;
+							text-align: center;
+							line-height: 44rpx;
+						}
+
+						.btn2 {
+							width: 110rpx;
+							height: 44rpx;
+							background: #AAAAAA;
+							border-radius: 5rpx;
+							font-size: 28rpx;
+							color: #FFFFFF;
+							text-align: center;
+							line-height: 44rpx;
+						}
+					}
+				}
+			}
+		}
+
+		.loadmore {
+			background: #FFFFFF;
+			border-radius: 10rpx;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			height: 88rpx;
+		}
+	}
+
+	.recom-container {
+		margin-top: 30rpx;
+
+		.top {
+			background: #FFFFFF;
+			padding: 30rpx 0 0;
+
+			.title {
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				margin-bottom: 10rpx;
+
+				image {
+					width: 300rpx;
+					height: 40rpx;
+					display: block;
+				}
+			}
+
+			.tab {
+				display: flex;
+				margin-left: -10rpx;
+
+				.item {
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					flex-shrink: 0;
+					font-size: 28rpx;
+					color: #666666;
+					height: 80rpx;
+					line-height: 80rpx;
+					position: relative;
+					padding: 0 30rpx;
+
+					&.current {
+						color: #FF3F42;
+						font-weight: 600;
+
+						&::after {
+							content: '';
+							display: block;
+							width: 50rpx;
+							height: 6rpx;
+							background: #FF3F42;
+							position: absolute;
+							bottom: 0;
+							left: 50%;
+							margin-left: -25rpx;
+						}
+					}
+				}
+			}
+		}
+
+		.list {
+			display: flex;
+			flex-wrap: wrap;
+			padding: 20rpx;
+
+			.item {
+				width: 348rpx;
+				background: #FFFFFF;
+				margin-right: 14rpx;
+				margin-bottom: 20rpx;
+				border-radius: 20rpx;
+				overflow: hidden;
+
+				&:nth-child(2n) {
+					margin-right: 0;
+				}
+
+				.image {
+					width: 348rpx;
+					height: 348rpx;
+					flex-shrink: 0;
+					position: relative;
+
+					.img {
+						width: 348rpx;
+						height: 348rpx;
+						display: block;
+					}
+
+					.water {
+						width: 348rpx;
+						height: 348rpx;
+						display: block;
+						position: absolute;
+						left: 0;
+						top: 0;
+						z-index: 1;
+					}
+				}
+
+				.content {
+					padding: 15rpx 20rpx;
+
+					.title {
+						font-size: 30rpx;
+						color: #333333;
+						line-height: 36rpx;
+						font-weight: 600;
+						height: 72rpx;
+					}
+
+					.bottom {
+						display: flex;
+						justify-content: space-between;
+						align-items: center;
+						margin-top: 10rpx;
+
+						.price {
+							display: flex;
+							flex-direction: column;
+						}
+
+						.price-1 {
+							font-size: 32rpx;
+							color: #FF3F42;
+							line-height: 36rpx;
+						}
+
+						.price-2 {
+							font-size: 26rpx;
+							color: #666666;
+							line-height: 30rpx;
+							text-decoration: line-through;
+						}
+
+						.btn {
+							width: 60rpx;
+							height: 60rpx;
+							background: #FE781F;
+							border-radius: 50%;
+							display: flex;
+							align-items: center;
+							justify-content: center;
+
+							image {
+								width: 41rpx;
+								height: 36rpx;
+								display: block;
+							}
+						}
+					}
+				}
+			}
+		}
+	}
+
+	.app-container {
+		background: #F4F2F2;
+		box-sizing: border-box;
+	}
+
+	.couponDialog {
+		position: fixed;
+		top: 30%;
+		left: 75rpx;
+		z-index: 999;
+		width: 600rpx;
+		background: #FFFFFF;
+		border-radius: 20rpx;
+
+		image {
+			width: 600rpx;
+		}
+
+		.bottom {
+			padding: 0 40rpx 50rpx;
+
+			.text {
+				font-size: 32rpx;
+				line-height: 48rpx;
+				text-align: center;
+			}
+
+			.btn-group {
+				display: flex;
+				justify-content: space-between;
+				margin-top: 50rpx;
+
+				.button {
+					width: 240rpx;
+					height: 72rpx;
+					border-radius: 72rpx;
+					border: 1px solid #FF3F42;
+					font-size: 32rpx;
+					line-height: 72rpx;
+					text-align: center;
+
+					&.left {
+						color: #FF3F42;
+					}
+
+					&.right {
+						color: #FFFFFF;
+						background: #FF3F42;
+					}
+				}
+
+				&.onlyOne {
+					justify-content: center;
+
+					.button {
+						width: 300rpx;
+					}
+				}
+			}
+		}
+	}
+
+	.buyDialog {
+		position: fixed;
+		top: 30%;
+		left: 100rpx;
+		z-index: 999;
+		width: 550rpx;
+		background: #FFFFFF;
+		border-radius: 10rpx;
+		box-sizing: border-box;
+		padding: 20rpx 20rpx 30rpx;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+
+		.close {
+			width: 100%;
+			display: flex;
+			justify-content: flex-end;
+
+			image {
+				width: 32rpx;
+				height: 32rpx;
+				display: block;
+			}
+		}
+
+		.goods {
+			margin-top: 10rpx;
+
+			image {
+				width: 410rpx;
+				height: 300rpx;
+				display: block;
+			}
+
+			.name {
+				font-size: 28rpx;
+				line-height: 34rpx;
+				margin-top: 16rpx;
+			}
+
+			.des {
+				font-size: 26rpx;
+				color: #666666;
+				line-height: 30rpx;
+				margin-top: 10rpx;
+			}
+		}
+
+		.goodsList {
+			max-height: 400rpx;
+			overflow-y: scroll;
+			margin-top: 10rpx;
+
+			.item {
+				display: flex;
+				padding: 10rpx 20rpx;
+
+				image {
+					width: 120rpx;
+					height: 120rpx;
+					display: block;
+					flex-shrink: 0;
+				}
+
+				.right {
+					width: 334rpx;
+					margin-left: 16rpx;
+
+					.name {
+						font-size: 28rpx;
+						line-height: 34rpx;
+						margin-top: 8rpx;
+					}
+
+					.des {
+						font-size: 26rpx;
+						color: #666666;
+						line-height: 30rpx;
+						margin-top: 10rpx;
+					}
+				}
+			}
+		}
+
+		.num {
+			margin-top: 10rpx;
+			line-height: 40rpx;
+
+			text {
+				color: #FF3F42;
+				font-size: 32rpx;
+				font-weight: 600;
+				margin: 0 10rpx;
+			}
+		}
+
+		.price {
+			margin-top: 8rpx;
+			line-height: 40rpx;
+
+			text {
+				color: #FF3F42;
+				font-size: 32rpx;
+				font-weight: 600;
+			}
+		}
+
+		.button {
+			width: 300rpx;
+			height: 64rpx;
+			line-height: 64rpx;
+			text-align: center;
+			background: #FF3F42;
+			border-radius: 64rpx;
+			font-size: 28rpx;
+			color: #FFFFFF;
+			margin-top: 20rpx;
+		}
+	}
+
+	// ---------------------------------------------
+
+	.swiper-container {
+		position: relative;
+		margin-top: 20rpx;
+
+		swiper {
+			height: 350rpx;
+		}
+
+		image {
+			height: 350rpx;
+			width: 710rpx;
+			display: block;
+			margin: 0 auto 0;
+			border-radius: 15rpx;
+			overflow: hidden;
+		}
+
+		.dots-conatiner {
+			position: absolute;
+			width: 100%;
+			bottom: 40rpx;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+
+			.con {
+				border-radius: 4rpx;
+				overflow: hidden;
+				height: 4rpx;
+				background-color: rgba($color: #FFFFFF, $alpha: 0.3);
+			}
+
+			.dot {
+				width: 20rpx;
+				height: 4rpx;
+				background-color: #FFFFFF;
+				transition: all .3s;
+			}
+		}
+	}
+
+	// ---------------------------------------------
+
+	.caidanrukou {
+		width: 95%;
+		height: auto;
+		border-radius: 30rpx;
+		overflow: hidden;
+		background: #ffffff;
+		margin: 30rpx auto;
+		padding: 30rpx;
+		box-sizing: border-box;
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+
+		.dangecaidanrukou {
+			width: 33.33%;
+			height: auto;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			flex-direction: column;
+
+			.tupiancaidan {
+				width: 80rpx;
+				height: 80rpx;
+			}
+
+			.dangecaidanrukouTitle {
+				font-size: 28rpx;
+				font-weight: 500;
+			}
+		}
+	}
+
+	// ---------------------------------------------
+
+	.sptjyangshi {
+		width: 100%;
+		font-size: 34rpx;
+		font-weight: bold;
+		box-sizing: border-box;
+		padding: 30rpx 20rpx;
+	}
+
+	.top-container2 {
+		background: #FFFFFF;
+		display: flex;
+		padding: 0 20rpx;
+		align-items: center;
+		box-sizing: border-box;
+
+		.tab {
+			flex: 1;
+			display: flex;
+			// padding: 0 80rpx 0 30rpx;
+			padding: 0 30rpx 0 30rpx;
+			box-sizing: border-box;
+			justify-content: space-between;
+
+			.item {
+				height: 88rpx;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				font-size: 30rpx;
+				color: #666666;
+
+				&.current {
+					color: #FF3F42;
+				}
+
+				image {
+					width: 18rpx;
+					height: 30rpx;
+					display: block;
+					margin-left: 10rpx;
+				}
+			}
+		}
+
+		.icon {
+			padding-right: 10rpx;
+
+			image {
+				width: 36rpx;
+				height: 36rpx;
+				display: block;
+			}
+		}
+	}
 </style>

pages/index/webview.vue

@@ -1,37 +1,37 @@
-<template>
-	<view class="app-container">
-		<web-view :webview-styles="webviewStyles" :src="link"></web-view>
-	</view>
-</template>
-
-<script>
-	export default {
-		data() {
-			return {
-				webviewStyles: {
-					progress: {
-						color: '#FF3333'
-					}
-				},
-				link: '',
-			}
-		},
-		
-		onLoad({link}) {
-			this.link = link;
-		},
-		
-		methods: {
-			
-		}
-	}
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #F4F2F2;
-		padding: 0 30rpx;
-		padding-top: 20rpx;
-		box-sizing: border-box;
-	}
-</style>
+<template>
+	<view class="app-container">
+		<web-view :webview-styles="webviewStyles" :src="link"></web-view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				webviewStyles: {
+					progress: {
+						color: '#FF3333'
+					}
+				},
+				link: '',
+			}
+		},
+		
+		onLoad({link}) {
+			this.link = link;
+		},
+		
+		methods: {
+			
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		padding: 0 30rpx;
+		padding-top: 20rpx;
+		box-sizing: border-box;
+	}
+</style>

pages/login/agreement.vue

@@ -1,56 +1,56 @@
-<template>
-  <view class="app-container">
-    <view class="content">
-      <u-parse :content="content"></u-parse>
-    </view>
-  </view>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      type: 1,
-      content: '',
-    };
-  },
-  onLoad({ type }) {
-    this.type = type;
-    uni.setNavigationBarTitle({
-      title: type == 1 ? '用户协议' : '隐私声明',
-    });
-
-    this.getDetail();
-  },
-  methods: {
-    getDetail() {
-      this.$axios({
-        url: '/common/wechat/detail',
-        method: 'get',
-        params: {},
-        isLoading: 1,
-      }).then((res) => {
-        if (this.type == 1) {
-          this.content = res.data.adminCompanyWechatOther.userAgreementContent;
-        } else {
-          this.content =
-            res.data.adminCompanyWechatOther.privacyStatementContent;
-        }
-      });
-    },
-  },
-};
-</script>
-
-<style lang="scss">
-.app-container {
-  background: #ffffff;
-  padding: 0 30rpx;
-  box-sizing: border-box;
-}
-.content {
-  image {
-    width: 100%;
-  }
-}
-</style>
+<template>
+  <view class="app-container">
+    <view class="content">
+      <u-parse :content="content"></u-parse>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      type: 1,
+      content: '',
+    };
+  },
+  onLoad({ type }) {
+    this.type = type;
+    uni.setNavigationBarTitle({
+      title: type == 1 ? '用户协议' : '隐私声明',
+    });
+
+    this.getDetail();
+  },
+  methods: {
+    getDetail() {
+      this.$axios({
+        url: '/common/wechat/detail',
+        method: 'get',
+        params: {},
+        isLoading: 1,
+      }).then((res) => {
+        if (this.type == 1) {
+          this.content = res.data.adminCompanyWechatOther.userAgreementContent;
+        } else {
+          this.content =
+            res.data.adminCompanyWechatOther.privacyStatementContent;
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss">
+.app-container {
+  background: #ffffff;
+  padding: 0 30rpx;
+  box-sizing: border-box;
+}
+.content {
+  image {
+    width: 100%;
+  }
+}
+</style>

pages/login/index.vue

@@ -1,321 +1,321 @@
-<template>
-  <view class="app-container">
-    <view class="main-container">
-      <view class="header">
-        <image :src="configInfo.minLogo1"></image>
-        <view>{{ configInfo.minAppName }}</view>
-      </view>
-      <view class="bottom">
-        <view class="content">
-          <view>申请获取以下权限</view>
-          <text>获取你的公开信息(昵称，头像、地区等)</text>
-        </view>
-        <button class="button" type="primary" @tap="wxLogin">授权登录</button>
-        <!-- <view class="tips">登录即代表同意<text @tap="toAgreement(1)">《用户协议》</text>和<text @tap="toAgreement(2)">《隐私声明》</text></view> -->
-      </view>
-    </view>
-
-    <u-popup :round="10" :show="isShowPhoneDialog">
-      <view class="phone-dialog">
-        <view class="content">
-          <view>申请获取以下权限</view>
-          <text>获得你的公开信息(手机号码)</text>
-        </view>
-        <view class="btn">
-          <button @tap="isShowPhoneDialog = false">取消</button>
-          <button
-            type="primary"
-            open-type="getPhoneNumber"
-            @getphonenumber="getPhoneNumber"
-          >
-            确定授权
-          </button>
-        </view>
-      </view>
-    </u-popup>
-  </view>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      configInfo: uni.getStorageSync('configInfo'),
-      userId: null,
-      isNotOpenid: false, // 是否因为 支付前没有openid 进入的登录页
-
-      isShowPhoneDialog: false, // 是否显示获取手机号授权弹窗
-    };
-  },
-  onLoad({ isNotOpenid }) {
-    this.isNotOpenid = isNotOpenid ? true : false;
-
-    if (
-      uni.getStorageSync('is_qywx') !== true &&
-      uni.getStorageSync('is_qywx') !== false
-    ) {
-      console.log('重新获取系统信息');
-      uni.getSystemInfo({
-        success: function (e) {
-          console.log(e);
-          if (e.environment == 'wxwork') {
-            uni.setStorageSync('is_qywx', true);
-          } else {
-            uni.setStorageSync('is_qywx', false);
-          }
-        },
-      });
-    }
-  },
-  methods: {
-    wxLogin() {
-      console.log('是否从企业微信端进入：' + uni.getStorageSync('is_qywx'));
-      // 没有openid
-      if (this.isNotOpenid == true) {
-        console.log('没有openid');
-
-        wx.login({
-          provider: 'weixin',
-          success: (loginRes) => {
-            console.log(loginRes);
-            this.$axios({
-              url: '/user/auth',
-              params: {
-                code: loginRes.code,
-                work: uni.getStorageSync('is_qywx'),
-                serviceId: uni.getStorageSync('is_qywx')
-                  ? this.$store.state.userId
-                  : '',
-              },
-            }).then((res) => {
-              this.userId = res.data.userId;
-              this.mobile = res.data.mobile;
-              uni.setStorageSync('token', res.data.token);
-
-              // if(!this.mobile) {
-              // 	return this.isShowPhoneDialog = true;
-              // }
-
-              this.loginSuccess();
-            });
-          },
-        });
-      }
-
-      // 企业微信端
-      else if (uni.getStorageSync('is_qywx') == true) {
-        console.log('从企业微信端进入');
-        wx.qy.login({
-          success: (loginRes) => {
-            console.log(loginRes);
-            if (loginRes.code) {
-              this.$axios({
-                url: '/user/auth',
-                params: {
-                  code: loginRes.code,
-                  work: true,
-                },
-              }).then((res) => {
-                this.userId = res.data.userId;
-                this.mobile = res.data.mobile;
-                uni.setStorageSync('token', res.data.token);
-
-                // if(!this.mobile || uni.getStorageSync('isActiveLogout')) {
-                // 	return this.isShowPhoneDialog = true;
-                // }
-
-                this.loginSuccess();
-              });
-            } else {
-              console.log('登录失败！' + loginRes.errMsg);
-            }
-          },
-        });
-      }
-
-      // 微信端
-      else if (uni.getStorageSync('is_qywx') == false) {
-        console.log('从微信端进入');
-        wx.login({
-          provider: 'weixin',
-          success: (loginRes) => {
-            console.log(loginRes);
-            this.$axios({
-              url: '/user/auth',
-              params: {
-                code: loginRes.code,
-                work: false,
-              },
-            }).then((res) => {
-              this.userId = res.data.userId;
-              this.mobile = res.data.mobile;
-              uni.setStorageSync('token', res.data.token);
-
-              // if (!this.mobile || uni.getStorageSync('isActiveLogout')) {
-              //   return (this.isShowPhoneDialog = true);
-              // }
-
-              this.loginSuccess();
-            });
-          },
-        });
-      }
-      return false;
-    },
-
-    // 获取配置信息
-    async getConfigInfo() {
-      return new Promise((resolve, reject) => {
-        this.$axios({
-          url: '/common/config/get',
-          method: 'get',
-        }).then((res) => {
-          resolve(res.data);
-        });
-      });
-    },
-
-    // 保存用户信息
-    async saveUserInfo(userInfo) {
-      const configInfo = await this.getConfigInfo();
-
-      return new Promise((resolve, reject) => {
-        this.$axios({
-          url: '/user/userinfo/save',
-          params: {
-            userId: this.userId,
-            avatarUrl: configInfo.minLogo3,
-            nickName: `微信用户_${userInfo.mobile.slice(7, 11)}`,
-          },
-        }).then((res) => {
-          resolve(res.data);
-        });
-      });
-    },
-
-    // 获取手机号
-    getPhoneNumber(e) {
-      this.$axios({
-        url: '/user/mobile/grant',
-        params: {
-          userId: this.userId,
-          iv: e.detail.iv,
-          encryptedData: e.detail.encryptedData,
-        },
-      }).then((res) => {
-        uni.setStorageSync('token', res.data.token);
-        uni.setStorageSync('isActiveLogout', false);
-        this.isShowPhoneDialog = false;
-
-        this.loginSuccess();
-      });
-    },
-
-    // 登录成功
-    async loginSuccess() {
-      const userInfo = await this.$getUserInfo(this.userId);
-
-      if (!userInfo.avatar || !userInfo.nickName) {
-        await this.saveUserInfo(userInfo);
-      }
-
-      this.$store.commit('changeIsLogin', true);
-      uni.setStorageSync('isLogin', true);
-      this.$successToast('登录成功');
-      this.$isResolve();
-      this.$backPage(1, 1000);
-    },
-
-    toAgreement(type) {
-      uni.navigateTo({
-        url: '/pages/login/agreement?type=' + type,
-      });
-    },
-  },
-};
-</script>
-
-<style lang="scss">
-.app-container {
-  background: #ffffff;
-  box-sizing: border-box;
-}
-.main-container {
-  .header {
-    border-bottom: 1px solid #ccc;
-    text-align: center;
-    height: 400rpx;
-    margin-bottom: 50rpx;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    view {
-      font-size: 38rpx;
-      margin-top: 30rpx;
-    }
-    image {
-      width: 200rpx;
-      height: 200rpx;
-    }
-  }
-
-  .bottom {
-    padding: 0 50rpx;
-    .content {
-      font-size: 28rpx;
-      margin-bottom: 90rpx;
-      text {
-        display: block;
-        color: #9d9d9d;
-        margin-top: 30rpx;
-      }
-    }
-    .button {
-      border-radius: 80rpx;
-      margin: 70rpx 0 30rpx;
-      font-size: 35rpx;
-    }
-    .tips {
-      font-size: 26rpx;
-      color: #666666;
-      text {
-        color: #ff3f42;
-      }
-    }
-  }
-}
-
-.phone-dialog {
-  padding: 40rpx;
-  box-sizing: border-box;
-  .content {
-    margin-top: 30rpx;
-    margin-bottom: 30rpx;
-    line-height: 50rpx;
-    text {
-      color: #9d9d9d;
-    }
-  }
-  .btn {
-    display: flex;
-    justify-content: center;
-    margin-top: 60rpx;
-    button::after {
-      border: none;
-    }
-    button {
-      width: 180rpx;
-      height: 70rpx;
-      line-height: 70rpx;
-      margin: 0;
-      font-size: 28rpx;
-      margin: 0 30rpx;
-      &:first-child {
-        background: #f5f5f5;
-        color: #00ba5c;
-      }
-    }
-  }
-}
-</style>
+<template>
+  <view class="app-container">
+    <view class="main-container">
+      <view class="header">
+        <image :src="configInfo.minLogo1"></image>
+        <view>{{ configInfo.minAppName }}</view>
+      </view>
+      <view class="bottom">
+        <view class="content">
+          <view>申请获取以下权限</view>
+          <text>获取你的公开信息(昵称，头像、地区等)</text>
+        </view>
+        <button class="button" type="primary" @tap="wxLogin">授权登录</button>
+        <!-- <view class="tips">登录即代表同意<text @tap="toAgreement(1)">《用户协议》</text>和<text @tap="toAgreement(2)">《隐私声明》</text></view> -->
+      </view>
+    </view>
+
+    <u-popup :round="10" :show="isShowPhoneDialog">
+      <view class="phone-dialog">
+        <view class="content">
+          <view>申请获取以下权限</view>
+          <text>获得你的公开信息(手机号码)</text>
+        </view>
+        <view class="btn">
+          <button @tap="isShowPhoneDialog = false">取消</button>
+          <button
+            type="primary"
+            open-type="getPhoneNumber"
+            @getphonenumber="getPhoneNumber"
+          >
+            确定授权
+          </button>
+        </view>
+      </view>
+    </u-popup>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      configInfo: uni.getStorageSync('configInfo'),
+      userId: null,
+      isNotOpenid: false, // 是否因为 支付前没有openid 进入的登录页
+
+      isShowPhoneDialog: false, // 是否显示获取手机号授权弹窗
+    };
+  },
+  onLoad({ isNotOpenid }) {
+    this.isNotOpenid = isNotOpenid ? true : false;
+
+    if (
+      uni.getStorageSync('is_qywx') !== true &&
+      uni.getStorageSync('is_qywx') !== false
+    ) {
+      console.log('重新获取系统信息');
+      uni.getSystemInfo({
+        success: function (e) {
+          console.log(e);
+          if (e.environment == 'wxwork') {
+            uni.setStorageSync('is_qywx', true);
+          } else {
+            uni.setStorageSync('is_qywx', false);
+          }
+        },
+      });
+    }
+  },
+  methods: {
+    wxLogin() {
+      console.log('是否从企业微信端进入：' + uni.getStorageSync('is_qywx'));
+      // 没有openid
+      if (this.isNotOpenid == true) {
+        console.log('没有openid');
+
+        wx.login({
+          provider: 'weixin',
+          success: (loginRes) => {
+            console.log(loginRes);
+            this.$axios({
+              url: '/user/auth',
+              params: {
+                code: loginRes.code,
+                work: uni.getStorageSync('is_qywx'),
+                serviceId: uni.getStorageSync('is_qywx')
+                  ? this.$store.state.userId
+                  : '',
+              },
+            }).then((res) => {
+              this.userId = res.data.userId;
+              this.mobile = res.data.mobile;
+              uni.setStorageSync('token', res.data.token);
+
+              // if(!this.mobile) {
+              // 	return this.isShowPhoneDialog = true;
+              // }
+
+              this.loginSuccess();
+            });
+          },
+        });
+      }
+
+      // 企业微信端
+      else if (uni.getStorageSync('is_qywx') == true) {
+        console.log('从企业微信端进入');
+        wx.qy.login({
+          success: (loginRes) => {
+            console.log(loginRes);
+            if (loginRes.code) {
+              this.$axios({
+                url: '/user/auth',
+                params: {
+                  code: loginRes.code,
+                  work: true,
+                },
+              }).then((res) => {
+                this.userId = res.data.userId;
+                this.mobile = res.data.mobile;
+                uni.setStorageSync('token', res.data.token);
+
+                // if(!this.mobile || uni.getStorageSync('isActiveLogout')) {
+                // 	return this.isShowPhoneDialog = true;
+                // }
+
+                this.loginSuccess();
+              });
+            } else {
+              console.log('登录失败！' + loginRes.errMsg);
+            }
+          },
+        });
+      }
+
+      // 微信端
+      else if (uni.getStorageSync('is_qywx') == false) {
+        console.log('从微信端进入');
+        wx.login({
+          provider: 'weixin',
+          success: (loginRes) => {
+            console.log(loginRes);
+            this.$axios({
+              url: '/user/auth',
+              params: {
+                code: loginRes.code,
+                work: false,
+              },
+            }).then((res) => {
+              this.userId = res.data.userId;
+              this.mobile = res.data.mobile;
+              uni.setStorageSync('token', res.data.token);
+
+              // if (!this.mobile || uni.getStorageSync('isActiveLogout')) {
+              //   return (this.isShowPhoneDialog = true);
+              // }
+
+              this.loginSuccess();
+            });
+          },
+        });
+      }
+      return false;
+    },
+
+    // 获取配置信息
+    async getConfigInfo() {
+      return new Promise((resolve, reject) => {
+        this.$axios({
+          url: '/common/config/get',
+          method: 'get',
+        }).then((res) => {
+          resolve(res.data);
+        });
+      });
+    },
+
+    // 保存用户信息
+    async saveUserInfo(userInfo) {
+      const configInfo = await this.getConfigInfo();
+
+      return new Promise((resolve, reject) => {
+        this.$axios({
+          url: '/user/userinfo/save',
+          params: {
+            userId: this.userId,
+            avatarUrl: configInfo.minLogo3,
+            nickName: `微信用户_${userInfo.mobile.slice(7, 11)}`,
+          },
+        }).then((res) => {
+          resolve(res.data);
+        });
+      });
+    },
+
+    // 获取手机号
+    getPhoneNumber(e) {
+      this.$axios({
+        url: '/user/mobile/grant',
+        params: {
+          userId: this.userId,
+          iv: e.detail.iv,
+          encryptedData: e.detail.encryptedData,
+        },
+      }).then((res) => {
+        uni.setStorageSync('token', res.data.token);
+        uni.setStorageSync('isActiveLogout', false);
+        this.isShowPhoneDialog = false;
+
+        this.loginSuccess();
+      });
+    },
+
+    // 登录成功
+    async loginSuccess() {
+      const userInfo = await this.$getUserInfo(this.userId);
+
+      if (!userInfo.avatar || !userInfo.nickName) {
+        await this.saveUserInfo(userInfo);
+      }
+
+      this.$store.commit('changeIsLogin', true);
+      uni.setStorageSync('isLogin', true);
+      this.$successToast('登录成功');
+      this.$isResolve();
+      this.$backPage(1, 1000);
+    },
+
+    toAgreement(type) {
+      uni.navigateTo({
+        url: '/pages/login/agreement?type=' + type,
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss">
+.app-container {
+  background: #ffffff;
+  box-sizing: border-box;
+}
+.main-container {
+  .header {
+    border-bottom: 1px solid #ccc;
+    text-align: center;
+    height: 400rpx;
+    margin-bottom: 50rpx;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    view {
+      font-size: 38rpx;
+      margin-top: 30rpx;
+    }
+    image {
+      width: 200rpx;
+      height: 200rpx;
+    }
+  }
+
+  .bottom {
+    padding: 0 50rpx;
+    .content {
+      font-size: 28rpx;
+      margin-bottom: 90rpx;
+      text {
+        display: block;
+        color: #9d9d9d;
+        margin-top: 30rpx;
+      }
+    }
+    .button {
+      border-radius: 80rpx;
+      margin: 70rpx 0 30rpx;
+      font-size: 35rpx;
+    }
+    .tips {
+      font-size: 26rpx;
+      color: #666666;
+      text {
+        color: #ff3f42;
+      }
+    }
+  }
+}
+
+.phone-dialog {
+  padding: 40rpx;
+  box-sizing: border-box;
+  .content {
+    margin-top: 30rpx;
+    margin-bottom: 30rpx;
+    line-height: 50rpx;
+    text {
+      color: #9d9d9d;
+    }
+  }
+  .btn {
+    display: flex;
+    justify-content: center;
+    margin-top: 60rpx;
+    button::after {
+      border: none;
+    }
+    button {
+      width: 180rpx;
+      height: 70rpx;
+      line-height: 70rpx;
+      margin: 0;
+      font-size: 28rpx;
+      margin: 0 30rpx;
+      &:first-child {
+        background: #f5f5f5;
+        color: #00ba5c;
+      }
+    }
+  }
+}
+</style>

pages/mine/address/form.vue

@@ -1,446 +1,446 @@
-<template>
-	<view class="app-container">
-		<view class="row">
-			<view class="title">收货人</view>
-			<view class="right input"><input type="text" placeholder="请输入收货人" v-model="formData.name"></view>
-		</view>
-		<view class="row">
-			<view class="title">手机号码</view>
-			<view class="right input"><input type="number" placeholder="请输入手机号码" v-model="formData.phone"></view>
-		</view>
-		<view class="row">
-			<view class="title">所在地区</view>
-			<view class="right">
-				<picker @change="onRegionChange" v-model="regionValue" mode="region">
-					<view class="picker">
-						<view v-if="regionValue.length">{{regionValue[0] + '/' +regionValue[1] + '/' +regionValue[2]}}
-						</view>
-						<view v-else style="color: #666666;">请选择省/市/区</view>
-						<image src="@/static/icon/right.png"></image>
-					</view>
-				</picker>
-			</view>
-		</view>
-		<view class="row">
-			<view class="title">所在街道</view>
-			<view class="right">
-				<picker @change="onStreetChange" :value="streetValue" :range="streetList" range-key="name"
-					:disabled="!regionValue[2]">
-					<view class="picker">
-						<view v-if="streetValue !== ''">{{streetList[streetValue].name}}</view>
-						<view v-else style="color: #666666;">请选择街道</view>
-						<image src="@/static/icon/right.png"></image>
-					</view>
-				</picker>
-			</view>
-		</view>
-
-		<view class="row">
-			<view class="title">收货地址</view>
-			<view class="right textarea">
-				<textarea placeholder="请输入收货地址" auto-height v-model="formData.address"></textarea>
-				<view class="r" @tap="getLocation">
-					<image src="@/static/icon/address2.png"></image>定位
-				</view>
-			</view>
-		</view>
-		<view class="row">
-			<view class="title">门牌号</view>
-			<view class="right input"><input type="text" placeholder="请输入门牌号" maxlength="15" v-model="formData.houseNo">
-			</view>
-		</view>
-		<view class="row">
-			<view class="title">设为默认地址</view>
-			<view class="right default">
-				<switch @change="switchChange" color="#FF3F42" v-model="formData.defaultAddr"
-					:checked="formData.defaultAddr" style="transform:scale(0.7)" />
-			</view>
-		</view>
-		<view class="button red" @tap="submitForm">保存</view>
-		<view class="button white" v-if="editId" @tap="isDialog = true">删除</view>
-
-		<modal-dialog showText="确定要删除该地址吗？" :isShowDialog="isDialog" @cancel="isDialog = false"
-			@confirm="confirmDelete"></modal-dialog>
-	</view>
-</template>
-
-<script>
-	import {
-		mapState
-	} from 'vuex';
-	import {
-		getArea
-	} from '@/utils/utils.js';
-	import modalDialog from '@/components/modalDialog.vue';
-
-	export default {
-		components: {
-			modalDialog
-		},
-		data() {
-			return {
-				editId: null, // 编辑的id
-				isDialog: false, // 是否显示删除弹窗
-				regionValue: [], // 省市区值
-				streetList: [],
-				streetValue: '',
-				formData: { // 表单数据
-					name: '',
-					phone: '',
-					province: '',
-					city: '',
-					area: '',
-					street: '',
-					address: '',
-					houseNo: '',
-					defaultAddr: false,
-				},
-				canClickSave: true, // 能否点击提交
-			}
-		},
-		computed: {
-			...mapState(['userInfo', 'isLogin', 'userId'])
-		},
-		onLoad({
-			id,
-			addressData
-		}) {
-			this.editId = id;
-			if (id) {
-				uni.setNavigationBarTitle({
-					title: '编辑收货地址'
-				})
-				this.getAddressData();
-			}
-			if (addressData) {
-				addressData = JSON.parse(addressData);
-				this.formData = {
-					name: addressData.name,
-					phone: addressData.phone,
-					province: addressData.province,
-					city: addressData.city,
-					area: addressData.area,
-					address: addressData.address,
-					houseNo: addressData.houseNo,
-					defaultAddr: addressData.defaultAddr,
-				}
-				this.regionValue = [addressData.province, addressData.city, addressData.area];
-				this.getStreetList();
-			}
-		},
-		methods: {
-			// 获取地址信息
-			getAddressData() {
-				this.$axios({
-					url: '/user/address/detail',
-					method: 'get',
-					params: {
-						userAddressId: this.editId
-					}
-				}).then(res => {
-					this.formData = {
-						name: res.data.name,
-						phone: res.data.phone,
-						province: res.data.province,
-						city: res.data.city,
-						area: res.data.area,
-						address: res.data.address,
-						houseNo: res.data.houseNo,
-						defaultAddr: res.data.defaultAddr,
-					}
-					this.regionValue = [res.data.province, res.data.city, res.data.area];
-					this.getStreetList(res.data.street);
-				})
-			},
-
-
-			// 地图选点
-			getLocation() {
-
-				let that = this;
-				uni.chooseLocation({
-					success: function(res) {
-						let SSQ_value = getArea(res.address);
-						if (!SSQ_value.Province) {
-							SSQ_value.Province = SSQ_value.City;
-						}
-						that.formData.province = SSQ_value.Province;
-						that.formData.city = SSQ_value.City;
-						that.formData.area = SSQ_value.Country;
-						let regionValue = [];
-						regionValue.push(SSQ_value.Province);
-						regionValue.push(SSQ_value.City);
-						regionValue.push(SSQ_value.Country);
-						that.regionValue = regionValue;
-						that.formData.address = res.address.slice(res.address.indexOf(SSQ_value.Country) +
-							SSQ_value.Country.length) + res.name;
-						that.getStreetList();
-						that.streetValue = '';
-						that.formData.street = '';
-					},
-					fail: function(res) {
-						uni.getSetting({
-							success: function(res) {
-								if (!res.authSetting['scope.userLocation']) {
-									uni.showModal({
-										title: '是否授权当前位置',
-										content: '需要获取您的地理位置，请确认授权，否则地图功能将无法使用',
-										success(tip) {
-											if (tip.confirm) {
-												uni.openSetting({
-													success: function(data) {
-														if (data.authSetting[
-																"scope.userLocation"
-																] === true) {
-															that.$successToast(
-																'授权成功');
-															setTimeout(() => {
-																that
-															.getLocation();
-															}, 1000)
-														}
-													}
-												})
-											}
-										}
-									})
-								}
-							}
-						})
-					}
-				});
-			},
-
-			// 切换省市区
-			onRegionChange(e) {
-				console.log(e.detail);
-				this.regionValue = e.detail.value;
-				this.formData.province = this.regionValue[0];
-				this.formData.city = this.regionValue[1];
-				this.formData.area = this.regionValue[2];
-				this.getStreetList();
-				this.streetValue = '';
-			},
-
-			// 获取街道列表
-			getStreetList(street) {
-				this.$axios({
-					url: '/common/street',
-					method: 'get',
-					params: {
-						province: this.regionValue[0],
-						city: this.regionValue[1],
-						area: this.regionValue[2],
-					}
-				}).then(res => {
-					this.streetList = res.data;
-					if (street) {
-						let index = this.findElem(this.streetList, 'name', street);
-						this.streetValue = index;
-						this.formData.street = street;
-					}
-				})
-			},
-
-			// 切换街道
-			onStreetChange(e) {
-				console.log(e.detail.value);
-				this.streetValue = e.detail.value;
-				this.formData.street = this.streetList[this.streetValue].name;
-			},
-
-			findElem(array, attr, val) {
-				for (var i = 0; i < array.length; i++) {
-					if (array[i][attr] == val) {
-						return i; //返回当前索引值
-					}
-				}
-				return -1;
-			},
-
-			switchChange(e) {
-				console.log(e.detail.value);
-				this.formData.defaultAddr = e.detail.value;
-			},
-
-			// 验证数据
-			vailateData() {
-				if (!this.formData.name) {
-					this.$toast('请填写姓名');
-					return false;
-				}
-				if (!this.formData.phone) {
-					this.$toast('请填写手机号码');
-					return false;
-				}
-				if (!(/^1[3456789]\d{9}$/.test(this.formData.phone))) {
-					this.$toast('请填写正确的手机号码');
-					return false;
-				}
-				if (!this.formData.province) {
-					this.$toast('请选择所在地区');
-					return false;
-				}
-				if (!this.formData.street) {
-					this.$toast('请选择所在街道');
-					return false;
-				}
-				if (!this.formData.address) {
-					this.$toast('请填写收货地址');
-					return false;
-				}
-				return true;
-			},
-
-			// 提交表单
-			submitForm() {
-				if (!this.canClickSave) return false;
-				this.canClickSave = false;
-				setTimeout(() => {
-					this.canClickSave = true
-				}, 3000)
-				if (!this.vailateData()) return;
-
-				let params = this.formData;
-				params.userId = this.userId;
-				let url = '';
-				if (this.editId) {
-					params.userAddressId = this.editId;
-					url = '/user/address/update';
-				} else {
-					url = '/user/address/save';
-				}
-				this.$axios({
-					url: url,
-					type: 'application/json',
-					params,
-					isLoading: 1,
-				}).then(res => {
-					this.$successToast(this.editId ? '编辑成功' : '添加成功');
-					setTimeout(() => {
-						uni.navigateBack({
-							delta: 1
-						})
-					}, 1000)
-				})
-			},
-
-			// 删除
-			confirmDelete() {
-				this.$axios({
-					url: '/user/address/del',
-					params: {
-						userAddressId: this.editId
-					},
-					isLoading: 1,
-				}).then(res => {
-					this.isDialog = false;
-					this.$successToast('删除成功');
-					setTimeout(() => {
-						uni.navigateBack({
-							delta: 1
-						})
-					}, 1000)
-				})
-			}
-		}
-	}
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #F4F2F2;
-		padding: 0 30rpx;
-		padding-top: 20rpx;
-		box-sizing: border-box;
-
-		.row {
-			background: #FFFFFF;
-			margin-bottom: 20rpx;
-			min-height: 88rpx;
-			border-radius: 20rpx;
-			padding: 0 20rpx;
-			display: flex;
-			justify-content: space-between;
-			align-items: center;
-
-			.title {
-				font-size: 28rpx;
-				color: #333333;
-			}
-
-			.right {
-				width: 480rpx;
-
-				input {
-					font-size: 28rpx;
-				}
-
-				.picker {
-					display: flex;
-					align-items: center;
-					justify-content: space-between;
-
-					image {
-						width: 16rpx;
-						height: 28rpx;
-					}
-				}
-			}
-
-			.textarea {
-				display: flex;
-				justify-content: space-between;
-				align-items: center;
-
-				textarea {
-					padding: 10rpx 0;
-				}
-
-				.r {
-					display: flex;
-					align-items: center;
-					flex-shrink: 0;
-					font-size: 24rpx;
-					color: #666666;
-					margin-left: 15rpx;
-
-					image {
-						width: 28rpx;
-						height: 36rpx;
-						margin-right: 16rpx;
-					}
-				}
-			}
-
-			.default {
-				display: flex;
-				justify-content: flex-end;
-
-				switch {
-					margin-right: -20rpx;
-				}
-			}
-		}
-
-		.button {
-			width: 100%;
-			height: 72rpx;
-			border-radius: 72rpx;
-			text-align: center;
-			line-height: 72rpx;
-
-			&.red {
-				background: #FF3F42;
-				color: #FFFFFF;
-				margin-top: 120rpx;
-			}
-
-			&.white {
-				background: #FFFFFF;
-				color: #333333;
-				margin-top: 20rpx;
-			}
-		}
-	}
+<template>
+	<view class="app-container">
+		<view class="row">
+			<view class="title">收货人</view>
+			<view class="right input"><input type="text" placeholder="请输入收货人" v-model="formData.name"></view>
+		</view>
+		<view class="row">
+			<view class="title">手机号码</view>
+			<view class="right input"><input type="number" placeholder="请输入手机号码" v-model="formData.phone"></view>
+		</view>
+		<view class="row">
+			<view class="title">所在地区</view>
+			<view class="right">
+				<picker @change="onRegionChange" v-model="regionValue" mode="region">
+					<view class="picker">
+						<view v-if="regionValue.length">{{regionValue[0] + '/' +regionValue[1] + '/' +regionValue[2]}}
+						</view>
+						<view v-else style="color: #666666;">请选择省/市/区</view>
+						<image src="@/static/icon/right.png"></image>
+					</view>
+				</picker>
+			</view>
+		</view>
+		<view class="row">
+			<view class="title">所在街道</view>
+			<view class="right">
+				<picker @change="onStreetChange" :value="streetValue" :range="streetList" range-key="name"
+					:disabled="!regionValue[2]">
+					<view class="picker">
+						<view v-if="streetValue !== ''">{{streetList[streetValue].name}}</view>
+						<view v-else style="color: #666666;">请选择街道</view>
+						<image src="@/static/icon/right.png"></image>
+					</view>
+				</picker>
+			</view>
+		</view>
+
+		<view class="row">
+			<view class="title">收货地址</view>
+			<view class="right textarea">
+				<textarea placeholder="请输入收货地址" auto-height v-model="formData.address"></textarea>
+				<view class="r" @tap="getLocation">
+					<image src="@/static/icon/address2.png"></image>定位
+				</view>
+			</view>
+		</view>
+		<view class="row">
+			<view class="title">门牌号</view>
+			<view class="right input"><input type="text" placeholder="请输入门牌号" maxlength="15" v-model="formData.houseNo">
+			</view>
+		</view>
+		<view class="row">
+			<view class="title">设为默认地址</view>
+			<view class="right default">
+				<switch @change="switchChange" color="#FF3F42" v-model="formData.defaultAddr"
+					:checked="formData.defaultAddr" style="transform:scale(0.7)" />
+			</view>
+		</view>
+		<view class="button red" @tap="submitForm">保存</view>
+		<view class="button white" v-if="editId" @tap="isDialog = true">删除</view>
+
+		<modal-dialog showText="确定要删除该地址吗？" :isShowDialog="isDialog" @cancel="isDialog = false"
+			@confirm="confirmDelete"></modal-dialog>
+	</view>
+</template>
+
+<script>
+	import {
+		mapState
+	} from 'vuex';
+	import {
+		getArea
+	} from '@/utils/utils.js';
+	import modalDialog from '@/components/modalDialog.vue';
+
+	export default {
+		components: {
+			modalDialog
+		},
+		data() {
+			return {
+				editId: null, // 编辑的id
+				isDialog: false, // 是否显示删除弹窗
+				regionValue: [], // 省市区值
+				streetList: [],
+				streetValue: '',
+				formData: { // 表单数据
+					name: '',
+					phone: '',
+					province: '',
+					city: '',
+					area: '',
+					street: '',
+					address: '',
+					houseNo: '',
+					defaultAddr: false,
+				},
+				canClickSave: true, // 能否点击提交
+			}
+		},
+		computed: {
+			...mapState(['userInfo', 'isLogin', 'userId'])
+		},
+		onLoad({
+			id,
+			addressData
+		}) {
+			this.editId = id;
+			if (id) {
+				uni.setNavigationBarTitle({
+					title: '编辑收货地址'
+				})
+				this.getAddressData();
+			}
+			if (addressData) {
+				addressData = JSON.parse(addressData);
+				this.formData = {
+					name: addressData.name,
+					phone: addressData.phone,
+					province: addressData.province,
+					city: addressData.city,
+					area: addressData.area,
+					address: addressData.address,
+					houseNo: addressData.houseNo,
+					defaultAddr: addressData.defaultAddr,
+				}
+				this.regionValue = [addressData.province, addressData.city, addressData.area];
+				this.getStreetList();
+			}
+		},
+		methods: {
+			// 获取地址信息
+			getAddressData() {
+				this.$axios({
+					url: '/user/address/detail',
+					method: 'get',
+					params: {
+						userAddressId: this.editId
+					}
+				}).then(res => {
+					this.formData = {
+						name: res.data.name,
+						phone: res.data.phone,
+						province: res.data.province,
+						city: res.data.city,
+						area: res.data.area,
+						address: res.data.address,
+						houseNo: res.data.houseNo,
+						defaultAddr: res.data.defaultAddr,
+					}
+					this.regionValue = [res.data.province, res.data.city, res.data.area];
+					this.getStreetList(res.data.street);
+				})
+			},
+
+
+			// 地图选点
+			getLocation() {
+
+				let that = this;
+				uni.chooseLocation({
+					success: function(res) {
+						let SSQ_value = getArea(res.address);
+						if (!SSQ_value.Province) {
+							SSQ_value.Province = SSQ_value.City;
+						}
+						that.formData.province = SSQ_value.Province;
+						that.formData.city = SSQ_value.City;
+						that.formData.area = SSQ_value.Country;
+						let regionValue = [];
+						regionValue.push(SSQ_value.Province);
+						regionValue.push(SSQ_value.City);
+						regionValue.push(SSQ_value.Country);
+						that.regionValue = regionValue;
+						that.formData.address = res.address.slice(res.address.indexOf(SSQ_value.Country) +
+							SSQ_value.Country.length) + res.name;
+						that.getStreetList();
+						that.streetValue = '';
+						that.formData.street = '';
+					},
+					fail: function(res) {
+						uni.getSetting({
+							success: function(res) {
+								if (!res.authSetting['scope.userLocation']) {
+									uni.showModal({
+										title: '是否授权当前位置',
+										content: '需要获取您的地理位置，请确认授权，否则地图功能将无法使用',
+										success(tip) {
+											if (tip.confirm) {
+												uni.openSetting({
+													success: function(data) {
+														if (data.authSetting[
+																"scope.userLocation"
+																] === true) {
+															that.$successToast(
+																'授权成功');
+															setTimeout(() => {
+																that
+															.getLocation();
+															}, 1000)
+														}
+													}
+												})
+											}
+										}
+									})
+								}
+							}
+						})
+					}
+				});
+			},
+
+			// 切换省市区
+			onRegionChange(e) {
+				console.log(e.detail);
+				this.regionValue = e.detail.value;
+				this.formData.province = this.regionValue[0];
+				this.formData.city = this.regionValue[1];
+				this.formData.area = this.regionValue[2];
+				this.getStreetList();
+				this.streetValue = '';
+			},
+
+			// 获取街道列表
+			getStreetList(street) {
+				this.$axios({
+					url: '/common/street',
+					method: 'get',
+					params: {
+						province: this.regionValue[0],
+						city: this.regionValue[1],
+						area: this.regionValue[2],
+					}
+				}).then(res => {
+					this.streetList = res.data;
+					if (street) {
+						let index = this.findElem(this.streetList, 'name', street);
+						this.streetValue = index;
+						this.formData.street = street;
+					}
+				})
+			},
+
+			// 切换街道
+			onStreetChange(e) {
+				console.log(e.detail.value);
+				this.streetValue = e.detail.value;
+				this.formData.street = this.streetList[this.streetValue].name;
+			},
+
+			findElem(array, attr, val) {
+				for (var i = 0; i < array.length; i++) {
+					if (array[i][attr] == val) {
+						return i; //返回当前索引值
+					}
+				}
+				return -1;
+			},
+
+			switchChange(e) {
+				console.log(e.detail.value);
+				this.formData.defaultAddr = e.detail.value;
+			},
+
+			// 验证数据
+			vailateData() {
+				if (!this.formData.name) {
+					this.$toast('请填写姓名');
+					return false;
+				}
+				if (!this.formData.phone) {
+					this.$toast('请填写手机号码');
+					return false;
+				}
+				if (!(/^1[3456789]\d{9}$/.test(this.formData.phone))) {
+					this.$toast('请填写正确的手机号码');
+					return false;
+				}
+				if (!this.formData.province) {
+					this.$toast('请选择所在地区');
+					return false;
+				}
+				if (!this.formData.street) {
+					this.$toast('请选择所在街道');
+					return false;
+				}
+				if (!this.formData.address) {
+					this.$toast('请填写收货地址');
+					return false;
+				}
+				return true;
+			},
+
+			// 提交表单
+			submitForm() {
+				if (!this.canClickSave) return false;
+				this.canClickSave = false;
+				setTimeout(() => {
+					this.canClickSave = true
+				}, 3000)
+				if (!this.vailateData()) return;
+
+				let params = this.formData;
+				params.userId = this.userId;
+				let url = '';
+				if (this.editId) {
+					params.userAddressId = this.editId;
+					url = '/user/address/update';
+				} else {
+					url = '/user/address/save';
+				}
+				this.$axios({
+					url: url,
+					type: 'application/json',
+					params,
+					isLoading: 1,
+				}).then(res => {
+					this.$successToast(this.editId ? '编辑成功' : '添加成功');
+					setTimeout(() => {
+						uni.navigateBack({
+							delta: 1
+						})
+					}, 1000)
+				})
+			},
+
+			// 删除
+			confirmDelete() {
+				this.$axios({
+					url: '/user/address/del',
+					params: {
+						userAddressId: this.editId
+					},
+					isLoading: 1,
+				}).then(res => {
+					this.isDialog = false;
+					this.$successToast('删除成功');
+					setTimeout(() => {
+						uni.navigateBack({
+							delta: 1
+						})
+					}, 1000)
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		padding: 0 30rpx;
+		padding-top: 20rpx;
+		box-sizing: border-box;
+
+		.row {
+			background: #FFFFFF;
+			margin-bottom: 20rpx;
+			min-height: 88rpx;
+			border-radius: 20rpx;
+			padding: 0 20rpx;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+
+			.title {
+				font-size: 28rpx;
+				color: #333333;
+			}
+
+			.right {
+				width: 480rpx;
+
+				input {
+					font-size: 28rpx;
+				}
+
+				.picker {
+					display: flex;
+					align-items: center;
+					justify-content: space-between;
+
+					image {
+						width: 16rpx;
+						height: 28rpx;
+					}
+				}
+			}
+
+			.textarea {
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+
+				textarea {
+					padding: 10rpx 0;
+				}
+
+				.r {
+					display: flex;
+					align-items: center;
+					flex-shrink: 0;
+					font-size: 24rpx;
+					color: #666666;
+					margin-left: 15rpx;
+
+					image {
+						width: 28rpx;
+						height: 36rpx;
+						margin-right: 16rpx;
+					}
+				}
+			}
+
+			.default {
+				display: flex;
+				justify-content: flex-end;
+
+				switch {
+					margin-right: -20rpx;
+				}
+			}
+		}
+
+		.button {
+			width: 100%;
+			height: 72rpx;
+			border-radius: 72rpx;
+			text-align: center;
+			line-height: 72rpx;
+
+			&.red {
+				background: #FF3F42;
+				color: #FFFFFF;
+				margin-top: 120rpx;
+			}
+
+			&.white {
+				background: #FFFFFF;
+				color: #333333;
+				margin-top: 20rpx;
+			}
+		}
+	}
 </style>

pages/mine/address/list.vue

@@ -1,219 +1,219 @@
-<template>
-	<view class="app-container">
-		<view class="list-container">
-			<block v-for="(item, index) in addressList" :key="index">
-				<view class="item" @tap="chooseAddress(index)">
-					<view class="top">
-						<view class="left">
-							<view class="name">{{ item.name }}</view>
-							<view class="phone">{{ item.phone }}</view>
-							<view class="default" v-if="item.defaultAddr">默认</view>
-						</view>
-						<image class="right" src="@/static/icon/edit.png" @tap.stop="toEditAddress(item.userAddressId)">
-						</image>
-					</view>
-					<view class="bottom">{{ item.province }}{{ item.city }}{{ item.area }}{{ item.street
-            }}{{ item.address }}{{ item.houseNo }}</view>
-				</view>
-			</block>
-		</view>
-		<no-data v-if="!addressList.length" :showText="'暂无收货地址'"></no-data>
-
-		<view class="bottom-container">
-			<view class="button red" @tap="toAddAddress">新增收货地址</view>
-			<view class="button white" @tap="getWxAddress">获取收货地址</view>
-		</view>
-	</view>
-</template>
-
-<script>
-	import {
-		mapState
-	} from 'vuex';
-	import EventBus from '@/utils/eventbus.js';
-
-	export default {
-		data() {
-			return {
-				addressList: [], // 收货地址列表
-				isChoose: false, // 是否进来选择地址
-			};
-		},
-		computed: {
-			...mapState(['userInfo', 'isLogin', 'userId']),
-		},
-		onShow() {
-			this.getAddressList();
-		},
-		onLoad({
-			isChoose
-		}) {
-			this.isChoose = isChoose;
-		},
-		methods: {
-			// 获取收货地址列表
-			getAddressList() {
-				this.$axios({
-					url: '/user/address/list',
-					method: 'get',
-					params: {
-						pageNum: 1,
-						pageSize: 100,
-						userId: this.userId,
-					},
-				}).then((res) => {
-					this.addressList = res.data.records;
-				});
-			},
-
-			// 选择地址
-			chooseAddress(index) {
-				if (!this.isChoose) {
-					return false;
-				}
-				EventBus.$emit('chooseAddress', this.addressList[index]);
-				uni.navigateBack({
-					delta: 1,
-				});
-			},
-
-			// 获取微信收货地址
-			getWxAddress() {
-				let that = this;
-				uni.chooseAddress({
-					success(res) {
-						let params = {
-							userId: that.userId,
-							name: res.userName,
-							phone: res.telNumber,
-							province: res.provinceName,
-							city: res.cityName,
-							area: res.countyName,
-							address: res.detailInfo,
-							houseNo: '',
-						};
-						uni.navigateTo({
-							url: '/pages/mine/address/form?addressData=' + JSON.stringify(params),
-						});
-
-						// that.$axios({
-						// 	url: '/user/address/save',
-						// 	type: 'application/json',
-						// 	params,
-						// 	isLoading: 1,
-						// }).then(res => {
-						// 	that.getAddressList();
-						// 	that.$successToast('添加成功');
-						// })
-					},
-				});
-			},
-
-			// 去新增收货地址
-			toAddAddress() {
-				uni.navigateTo({
-					url: '/pages/mine/address/form',
-				});
-			},
-
-			// 去编辑收货地址
-			toEditAddress(id) {
-				uni.navigateTo({
-					url: '/pages/mine/address/form?id=' + id,
-				});
-			},
-		},
-	};
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #f4f2f2;
-		padding: 20rpx;
-		padding-bottom: 250rpx;
-		box-sizing: border-box;
-	}
-
-	.list-container {
-		.item {
-			background: #ffffff;
-			border-radius: 20rpx;
-			margin-bottom: 20rpx;
-			padding: 20rpx;
-
-			.top {
-				display: flex;
-				justify-content: space-between;
-				align-items: center;
-
-				.left {
-					display: flex;
-					align-items: flex-end;
-
-					.name {
-						font-size: 32rpx;
-						color: #333333;
-						line-height: 32rpx;
-					}
-
-					.phone {
-						font-size: 28rpx;
-						color: #666666;
-						margin-left: 20rpx;
-						line-height: 28rpx;
-					}
-
-					.default {
-						font-size: 22rpx;
-						color: #ffffff;
-						background: #fe781f;
-						padding: 6rpx 8rpx;
-						line-height: 20rpx;
-						margin-left: 20rpx;
-					}
-				}
-
-				.right {
-					width: 32rpx;
-					height: 32rpx;
-				}
-			}
-
-			.bottom {
-				font-size: 28rpx;
-				color: #333333;
-				line-height: 38rpx;
-				margin-top: 20rpx;
-			}
-		}
-	}
-
-	.bottom-container {
-		position: fixed;
-		bottom: 0;
-		left: 0;
-		width: 100%;
-		box-sizing: border-box;
-		padding: 20rpx 20rpx 60rpx;
-		background: #f4f2f2;
-
-		.button {
-			width: 100%;
-			height: 72rpx;
-			border-radius: 72rpx;
-			text-align: center;
-			line-height: 72rpx;
-
-			&.red {
-				background: #ff3f42;
-				color: #ffffff;
-				margin-bottom: 20rpx;
-			}
-
-			&.white {
-				background: #ffffff;
-				color: #333333;
-			}
-		}
-	}
+<template>
+	<view class="app-container">
+		<view class="list-container">
+			<block v-for="(item, index) in addressList" :key="index">
+				<view class="item" @tap="chooseAddress(index)">
+					<view class="top">
+						<view class="left">
+							<view class="name">{{ item.name }}</view>
+							<view class="phone">{{ item.phone }}</view>
+							<view class="default" v-if="item.defaultAddr">默认</view>
+						</view>
+						<image class="right" src="@/static/icon/edit.png" @tap.stop="toEditAddress(item.userAddressId)">
+						</image>
+					</view>
+					<view class="bottom">{{ item.province }}{{ item.city }}{{ item.area }}{{ item.street
+            }}{{ item.address }}{{ item.houseNo }}</view>
+				</view>
+			</block>
+		</view>
+		<no-data v-if="!addressList.length" :showText="'暂无收货地址'"></no-data>
+
+		<view class="bottom-container">
+			<view class="button red" @tap="toAddAddress">新增收货地址</view>
+			<view class="button white" @tap="getWxAddress">获取收货地址</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import {
+		mapState
+	} from 'vuex';
+	import EventBus from '@/utils/eventbus.js';
+
+	export default {
+		data() {
+			return {
+				addressList: [], // 收货地址列表
+				isChoose: false, // 是否进来选择地址
+			};
+		},
+		computed: {
+			...mapState(['userInfo', 'isLogin', 'userId']),
+		},
+		onShow() {
+			this.getAddressList();
+		},
+		onLoad({
+			isChoose
+		}) {
+			this.isChoose = isChoose;
+		},
+		methods: {
+			// 获取收货地址列表
+			getAddressList() {
+				this.$axios({
+					url: '/user/address/list',
+					method: 'get',
+					params: {
+						pageNum: 1,
+						pageSize: 100,
+						userId: this.userId,
+					},
+				}).then((res) => {
+					this.addressList = res.data.records;
+				});
+			},
+
+			// 选择地址
+			chooseAddress(index) {
+				if (!this.isChoose) {
+					return false;
+				}
+				EventBus.$emit('chooseAddress', this.addressList[index]);
+				uni.navigateBack({
+					delta: 1,
+				});
+			},
+
+			// 获取微信收货地址
+			getWxAddress() {
+				let that = this;
+				uni.chooseAddress({
+					success(res) {
+						let params = {
+							userId: that.userId,
+							name: res.userName,
+							phone: res.telNumber,
+							province: res.provinceName,
+							city: res.cityName,
+							area: res.countyName,
+							address: res.detailInfo,
+							houseNo: '',
+						};
+						uni.navigateTo({
+							url: '/pages/mine/address/form?addressData=' + JSON.stringify(params),
+						});
+
+						// that.$axios({
+						// 	url: '/user/address/save',
+						// 	type: 'application/json',
+						// 	params,
+						// 	isLoading: 1,
+						// }).then(res => {
+						// 	that.getAddressList();
+						// 	that.$successToast('添加成功');
+						// })
+					},
+				});
+			},
+
+			// 去新增收货地址
+			toAddAddress() {
+				uni.navigateTo({
+					url: '/pages/mine/address/form',
+				});
+			},
+
+			// 去编辑收货地址
+			toEditAddress(id) {
+				uni.navigateTo({
+					url: '/pages/mine/address/form?id=' + id,
+				});
+			},
+		},
+	};
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #f4f2f2;
+		padding: 20rpx;
+		padding-bottom: 250rpx;
+		box-sizing: border-box;
+	}
+
+	.list-container {
+		.item {
+			background: #ffffff;
+			border-radius: 20rpx;
+			margin-bottom: 20rpx;
+			padding: 20rpx;
+
+			.top {
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+
+				.left {
+					display: flex;
+					align-items: flex-end;
+
+					.name {
+						font-size: 32rpx;
+						color: #333333;
+						line-height: 32rpx;
+					}
+
+					.phone {
+						font-size: 28rpx;
+						color: #666666;
+						margin-left: 20rpx;
+						line-height: 28rpx;
+					}
+
+					.default {
+						font-size: 22rpx;
+						color: #ffffff;
+						background: #fe781f;
+						padding: 6rpx 8rpx;
+						line-height: 20rpx;
+						margin-left: 20rpx;
+					}
+				}
+
+				.right {
+					width: 32rpx;
+					height: 32rpx;
+				}
+			}
+
+			.bottom {
+				font-size: 28rpx;
+				color: #333333;
+				line-height: 38rpx;
+				margin-top: 20rpx;
+			}
+		}
+	}
+
+	.bottom-container {
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		width: 100%;
+		box-sizing: border-box;
+		padding: 20rpx 20rpx 60rpx;
+		background: #f4f2f2;
+
+		.button {
+			width: 100%;
+			height: 72rpx;
+			border-radius: 72rpx;
+			text-align: center;
+			line-height: 72rpx;
+
+			&.red {
+				background: #ff3f42;
+				color: #ffffff;
+				margin-bottom: 20rpx;
+			}
+
+			&.white {
+				background: #ffffff;
+				color: #333333;
+			}
+		}
+	}
 </style>

pages/mine/applySalesman.vue

@@ -1,293 +1,293 @@
-<template>
-	<view class="app-container">
-		<view class="banner">
-			<image src="@/static/mine/apply.png" mode="widthFix"></image>
-		</view>
-		<view class="main">
-			<view class="title">请输入您登录企业微信的手机号码</view>
-			
-			<view class="form">
-				<view class="row">
-					<view class="row-c">
-						<view class="left">+86</view>
-						<view class="input">
-							<input type="text" placeholder="请输入手机号码" v-model="phone">
-						</view>
-					</view>
-				</view>
-				<view class="row">
-					<view class="row-c">
-						<view class="left">验证码</view>
-						<view class="input">
-							<input type="text" placeholder="请输入短信验证码" v-model="code">
-						</view>
-					</view>
-					<view class="btn" :class="!phone || countDown != 60 ? 'disabled': ''" @tap="getCode">{{countDown == 60 ? getCodeText : countDown+'s'}}</view>
-				</view>
-			</view>
-			<view class="tips" >{{countDown != 60 ? '验证码已发送，请注意查收短信':''}}</view>
-			
-			<view class="button" :class="!phone || !code ? 'disabled': ''" @tap="submitForm">确定</view>
-			
-		</view>
-		
-		<view class="code-container" v-show="isShowCode">
-			<view class="title">请完成安全验证</view>
-			<pt-images-verification ref="verification" :top="codeObj.yHeight" :bgImg="codeObj.bigImage" :maskImg="codeObj.smallImage" :isSuccess="codeObj.isSuccess" :isFail="codeObj.isFail" @refresh="refresh" @finish="finish"></pt-images-verification>
-			<view class="button" @tap="isShowCode = false">关闭</view>
-		</view>
-		<div class="global-mask" v-show="isShowCode"></div>
-	</view>
-</template>
-
-<script>
-	export default {
-		data() {
-			return {
-				phone: '',
-				code: '',
-				getCodeText: '获取验证码',
-				countDown: 60,
-				timer: null,
-				
-				isShowCode: false,
-				codeObj: {
-					bigImage: '',
-					smallImage: '',
-					key: '',
-					yHeight: '',
-					isSuccess: false,
-					isFail: false,
-				}
-			}
-		},
-		onLoad() {
-			
-		},
-		methods: {
-			// 获取验证码
-			getCode() {
-				if(!this.phone) {
-					this.$toast('请先填写手机号码');
-					return false;
-				}
-				if(this.countDown != 60) {
-					this.$toast('请勿频繁获取验证码');
-					return false;
-				}
-				if(!(/^1[3456789]\d{9}$/.test(this.phone))) {
-					this.$toast('请填写正确的手机号码');
-					return false;
-				}
-				
-				// this.init();
-				this.isShowCode = true;
-				this.$refs.verification.refresh();
-				
-			},
-			
-			// 提交表单
-			submitForm() {
-				if(!this.phone) {
-					this.$toast('请先填写手机号码');
-					return false;
-				}
-				if(!(/^1[3456789]\d{9}$/.test(this.phone))) {
-					this.$toast('请填写正确的手机号码');
-					return false;
-				}
-				if(!this.code) {
-					this.$toast('请先填写验证码');
-					return false;
-				}
-				
-				this.$axios({
-					url: '/worker/bind',
-					params: {
-						phone: this.phone,
-						code: this.code
-					},
-					isLoading: 1
-				}).then(res => {
-					this.$successToast('申请成功');
-					setTimeout(() => {
-						uni.navigateBack({
-							delta: 1
-						})
-					}, 1500)
-				})
-				
-			},
-			
-			// 获取图片验证码
-			init(){
-				this.$axios({
-					url: '/common/getVerifi',
-					method: 'get',
-					params: {},
-					isLoading: 1
-				}).then(res => {
-					this.codeObj = res.data;
-				})
-			},
-			// 刷新验证码
-			refresh(){
-				this.init()
-			},
-			// 验证结束
-			finish(value){
-				console.log(value);
-				this.$axios({
-					url: '/worker/sms/send',
-					params: {
-						phone: this.phone,
-						key: this.codeObj.key,
-						vrifyCode: Math.round(value)
-					},
-					isLoading: 1
-				}).then(res => {
-					this.codeObj.isSuccess = true;
-					this.codeObj.isFail = false;
-					setTimeout(() => {
-						this.isShowCode = false;
-						this.$toast('短信发送成功');
-					}, 1500)
-					this.countDown--;
-					this.timer = setInterval(() => {
-						this.countDown--;
-						if (this.countDown == 0) {
-							this.countDown = 60;
-							this.getCodeText = '重新获取';
-							clearInterval(this.timer)
-						}
-					}, 1000)
-				}).catch(res => {
-					this.codeObj.isSuccess = false;
-					this.codeObj.isFail = true;
-					setTimeout(() => {
-						this.$refs.verification.refresh();
-					}, 1500)
-				})
-			}
-		}
-	}
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #F4F2F2;
-		box-sizing: border-box;
-	}
-	.banner {
-		image {
-			width: 100%;
-		}
-	}
-	.code-container {
-		position: fixed;
-		top: calc(50vh - 150px);
-		left: calc(50vw - 170px);
-		z-index: 999;
-		background: #FFFFFF;
-		padding: 20px;
-		border-radius: 10rpx;
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		.title {
-			font-size: 28rpx;
-			color: #333333;
-			width: 100%;
-			text-align: left;
-			margin-bottom: 10px;
-		}
-		.button {
-			margin-top: 20px;
-			color: #666666;
-			width: 200rpx;
-			line-height: 60rpx;
-			border: 1px solid #eaeaea;
-			border-radius: 10rpx;
-			text-align: center;
-		}
-	}
-	.main {
-		padding: 50rpx;
-		.title {
-			font-size: 32rpx;
-			color: #333333;
-			text-align: center;
-		}
-		.button {
-			margin-top: 120rpx;
-			width: 100%;
-			text-align: center;
-			line-height: 88rpx;
-			border-radius: 88rpx;
-			font-size: 32rpx;
-			color: #FFFFFF;
-			background: linear-gradient(-90deg,#ff3f42 0%, #fe781f 100%);
-			&.disabled {
-				background: #C1C1C1;
-			}
-		}
-		.tips {
-			font-size: 24rpx;
-			color: #FE781F;
-			line-height: 24rpx;
-			margin-top: 20rpx;
-			height: 24rpx;
-			margin-left: 10rpx;
-		}
-		.form {
-			margin-top: 60rpx;
-			.row {
-				&:last-child {
-					margin-top: 40rpx;
-					display: flex;
-					align-items: flex-end;
-					.btn {
-						width: 180rpx;
-						height: 50rpx;
-						border-radius: 50rpx;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						font-size: 24rpx;
-						color: #FFFFFF;
-						background: linear-gradient(-90deg,#ff3f42 0%, #fe781f 100%);
-						margin-left: 30rpx;
-						&.disabled {
-							background: #C1C1C1;
-						}
-					}
-				}
-				.row-c {
-					height: 60rpx;
-					display: flex;
-					align-items: center;
-					border-bottom: 1px solid #D1D1D1;
-					.left {
-						width: 140rpx;
-						height: 28rpx;
-						border-right: 1px solid #D1D1D1;
-						font-size: 30rpx;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						flex-shrink: 0;
-					}
-					.input {
-						width: 100%;
-						input {
-							font-size: 30rpx;
-							width: 100%;
-							padding: 0 25rpx;
-							box-sizing: border-box;
-						}
-					}
-				}
-			}
-		}
-	}
-</style>
+<template>
+	<view class="app-container">
+		<view class="banner">
+			<image src="@/static/mine/apply.png" mode="widthFix"></image>
+		</view>
+		<view class="main">
+			<view class="title">请输入您登录企业微信的手机号码</view>
+			
+			<view class="form">
+				<view class="row">
+					<view class="row-c">
+						<view class="left">+86</view>
+						<view class="input">
+							<input type="text" placeholder="请输入手机号码" v-model="phone">
+						</view>
+					</view>
+				</view>
+				<view class="row">
+					<view class="row-c">
+						<view class="left">验证码</view>
+						<view class="input">
+							<input type="text" placeholder="请输入短信验证码" v-model="code">
+						</view>
+					</view>
+					<view class="btn" :class="!phone || countDown != 60 ? 'disabled': ''" @tap="getCode">{{countDown == 60 ? getCodeText : countDown+'s'}}</view>
+				</view>
+			</view>
+			<view class="tips" >{{countDown != 60 ? '验证码已发送，请注意查收短信':''}}</view>
+			
+			<view class="button" :class="!phone || !code ? 'disabled': ''" @tap="submitForm">确定</view>
+			
+		</view>
+		
+		<view class="code-container" v-show="isShowCode">
+			<view class="title">请完成安全验证</view>
+			<pt-images-verification ref="verification" :top="codeObj.yHeight" :bgImg="codeObj.bigImage" :maskImg="codeObj.smallImage" :isSuccess="codeObj.isSuccess" :isFail="codeObj.isFail" @refresh="refresh" @finish="finish"></pt-images-verification>
+			<view class="button" @tap="isShowCode = false">关闭</view>
+		</view>
+		<div class="global-mask" v-show="isShowCode"></div>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				phone: '',
+				code: '',
+				getCodeText: '获取验证码',
+				countDown: 60,
+				timer: null,
+				
+				isShowCode: false,
+				codeObj: {
+					bigImage: '',
+					smallImage: '',
+					key: '',
+					yHeight: '',
+					isSuccess: false,
+					isFail: false,
+				}
+			}
+		},
+		onLoad() {
+			
+		},
+		methods: {
+			// 获取验证码
+			getCode() {
+				if(!this.phone) {
+					this.$toast('请先填写手机号码');
+					return false;
+				}
+				if(this.countDown != 60) {
+					this.$toast('请勿频繁获取验证码');
+					return false;
+				}
+				if(!(/^1[3456789]\d{9}$/.test(this.phone))) {
+					this.$toast('请填写正确的手机号码');
+					return false;
+				}
+				
+				// this.init();
+				this.isShowCode = true;
+				this.$refs.verification.refresh();
+				
+			},
+			
+			// 提交表单
+			submitForm() {
+				if(!this.phone) {
+					this.$toast('请先填写手机号码');
+					return false;
+				}
+				if(!(/^1[3456789]\d{9}$/.test(this.phone))) {
+					this.$toast('请填写正确的手机号码');
+					return false;
+				}
+				if(!this.code) {
+					this.$toast('请先填写验证码');
+					return false;
+				}
+				
+				this.$axios({
+					url: '/worker/bind',
+					params: {
+						phone: this.phone,
+						code: this.code
+					},
+					isLoading: 1
+				}).then(res => {
+					this.$successToast('申请成功');
+					setTimeout(() => {
+						uni.navigateBack({
+							delta: 1
+						})
+					}, 1500)
+				})
+				
+			},
+			
+			// 获取图片验证码
+			init(){
+				this.$axios({
+					url: '/common/getVerifi',
+					method: 'get',
+					params: {},
+					isLoading: 1
+				}).then(res => {
+					this.codeObj = res.data;
+				})
+			},
+			// 刷新验证码
+			refresh(){
+				this.init()
+			},
+			// 验证结束
+			finish(value){
+				console.log(value);
+				this.$axios({
+					url: '/worker/sms/send',
+					params: {
+						phone: this.phone,
+						key: this.codeObj.key,
+						vrifyCode: Math.round(value)
+					},
+					isLoading: 1
+				}).then(res => {
+					this.codeObj.isSuccess = true;
+					this.codeObj.isFail = false;
+					setTimeout(() => {
+						this.isShowCode = false;
+						this.$toast('短信发送成功');
+					}, 1500)
+					this.countDown--;
+					this.timer = setInterval(() => {
+						this.countDown--;
+						if (this.countDown == 0) {
+							this.countDown = 60;
+							this.getCodeText = '重新获取';
+							clearInterval(this.timer)
+						}
+					}, 1000)
+				}).catch(res => {
+					this.codeObj.isSuccess = false;
+					this.codeObj.isFail = true;
+					setTimeout(() => {
+						this.$refs.verification.refresh();
+					}, 1500)
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		box-sizing: border-box;
+	}
+	.banner {
+		image {
+			width: 100%;
+		}
+	}
+	.code-container {
+		position: fixed;
+		top: calc(50vh - 150px);
+		left: calc(50vw - 170px);
+		z-index: 999;
+		background: #FFFFFF;
+		padding: 20px;
+		border-radius: 10rpx;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		.title {
+			font-size: 28rpx;
+			color: #333333;
+			width: 100%;
+			text-align: left;
+			margin-bottom: 10px;
+		}
+		.button {
+			margin-top: 20px;
+			color: #666666;
+			width: 200rpx;
+			line-height: 60rpx;
+			border: 1px solid #eaeaea;
+			border-radius: 10rpx;
+			text-align: center;
+		}
+	}
+	.main {
+		padding: 50rpx;
+		.title {
+			font-size: 32rpx;
+			color: #333333;
+			text-align: center;
+		}
+		.button {
+			margin-top: 120rpx;
+			width: 100%;
+			text-align: center;
+			line-height: 88rpx;
+			border-radius: 88rpx;
+			font-size: 32rpx;
+			color: #FFFFFF;
+			background: linear-gradient(-90deg,#ff3f42 0%, #fe781f 100%);
+			&.disabled {
+				background: #C1C1C1;
+			}
+		}
+		.tips {
+			font-size: 24rpx;
+			color: #FE781F;
+			line-height: 24rpx;
+			margin-top: 20rpx;
+			height: 24rpx;
+			margin-left: 10rpx;
+		}
+		.form {
+			margin-top: 60rpx;
+			.row {
+				&:last-child {
+					margin-top: 40rpx;
+					display: flex;
+					align-items: flex-end;
+					.btn {
+						width: 180rpx;
+						height: 50rpx;
+						border-radius: 50rpx;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+						font-size: 24rpx;
+						color: #FFFFFF;
+						background: linear-gradient(-90deg,#ff3f42 0%, #fe781f 100%);
+						margin-left: 30rpx;
+						&.disabled {
+							background: #C1C1C1;
+						}
+					}
+				}
+				.row-c {
+					height: 60rpx;
+					display: flex;
+					align-items: center;
+					border-bottom: 1px solid #D1D1D1;
+					.left {
+						width: 140rpx;
+						height: 28rpx;
+						border-right: 1px solid #D1D1D1;
+						font-size: 30rpx;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+						flex-shrink: 0;
+					}
+					.input {
+						width: 100%;
+						input {
+							font-size: 30rpx;
+							width: 100%;
+							padding: 0 25rpx;
+							box-sizing: border-box;
+						}
+					}
+				}
+			}
+		}
+	}
+</style>

pages/mine/collection.vue

@@ -1,212 +1,212 @@
-<template>
-	<view class="app-container">
-		<view class="list-container">
-			<block v-for="(item, index) in dataList" :key='index'>
-				<view class="item" @tap="toGoodsDetail(item.goodsId)" @longpress="handleDelete(item.goodsFavoriteId)">
-					<image :src="item.imgUrl" mode="aspectFill"></image>
-					<view class="content">
-						<view class="title ellipsis-2">{{item.goodsName}}</view>
-						<view class="bottom">
-							<view class="price">
-								<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
-								<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
-							</view>
-							<view class="btn"><image src="@/static/icon/cart.png" mode="aspectFill"></image></view>
-						</view>
-					</view>
-				</view>
-			</block>
-		</view>
-		<no-data v-if="!dataList.length" :showText="'暂无收藏商品'"></no-data>
-		<loading-text v-if="dataList.length"  :loading="loading" :noMore="noMore" ></loading-text>
-		
-		<modal-dialog showText="确定要取消收藏吗？" :isShowDialog="isDialog" @cancel="isDialog = false" @confirm="confirmDelete"></modal-dialog>
-		
-		<!-- <drag-button :isDock="true" :customBar="true" ref="dragButton"></drag-button> -->
-	</view>
-</template>
-
-<script>
-	import {mapState} from 'vuex';
-	import modalDialog from '@/components/modalDialog.vue';
-	// import dragButton from '@/components/drag-button.vue';
-	
-	export default {
-		components:{
-			modalDialog,
-			// dragButton
-		},
-		data() {
-			return {
-				dataList: [],
-				pageNum: 1,
-				pageSize: 8,
-				noMore: false,
-				loading: false,
-				deleteId: null,
-				isDialog: false,
-			}
-		},
-		
-		computed:{
-			...mapState(['userInfo', 'isLogin', 'userId'])
-		},
-		
-		onShow() {
-			// this.$refs.dragButton.init();
-		},
-		
-		onLoad() {
-			this.getGoodsList();
-		},
-		
-		// 下拉刷新
-		onPullDownRefresh() {
-			this.pageNum = 1;
-			this.getGoodsList();
-		},
-		
-		// 上拉加载
-		onReachBottom() {
-			this.getGoodsList(1);
-		},
-		
-		methods: {
-			// 获取商品列表
-			getGoodsList(loadMore) {
-				if(this.noMore && loadMore)return;
-				this.noMore = false
-				if(!loadMore){
-					this.pageNum = 1;
-				}else{
-					this.loading = true;
-				}
-				this.$axios({
-					url: '/goods/favorite/query',
-					method: 'get',
-					params: {
-						pageNum: this.pageNum,
-						pageSize: this.pageSize,
-						userId: this.userId,
-					},
-					isLoading: !loadMore
-				}).then(res => {
-					let _list = res.data.list;
-					let pageTotal = res.data.pages;
-					if(this.pageNum >= pageTotal){
-						this.noMore = true;
-					}
-					if (_list && _list.length) {
-						this.pageNum += 1
-					}
-					if (loadMore) {
-						this.dataList = this.dataList.concat(_list);
-						this.loading = false;
-					} else {
-						this.dataList = _list;
-					}
-					
-					uni.stopPullDownRefresh();
-				})
-			},
-			
-			handleDelete(id) {
-				this.deleteId = id;
-				this.isDialog = true;
-			},
-			
-			// 取消收藏
-			confirmDelete() {
-				this.$axios({
-					url: '/goods/favorite/del',
-					params: {
-						goodFavoriteId: this.deleteId
-					},
-					isLoading: 1,
-				}).then(res => {
-					this.isDialog = false;
-					this.$successToast('取消收藏成功');
-					this.getGoodsList();
-				})
-			},
-			
-			toGoodsDetail(id) {
-				uni.navigateTo({
-					url: '/packageGoods/pages/detail?id=' + id
-				})
-			}
-		}
-	}
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #F4F2F2;
-		box-sizing: border-box;
-	}
-	.list-container {
-		display: flex;
-		flex-wrap: wrap;
-		padding: 20rpx;
-		.item {
-			width: 348rpx;
-			background: #FFFFFF;
-			margin-right: 14rpx;
-			margin-bottom: 20rpx;
-			border-radius: 20rpx;
-			overflow: hidden;
-			&:nth-child(2n) {
-				margin-right: 0;
-			}
-			image {
-				width: 348rpx;
-				height: 348rpx;
-			}
-			.content {
-				padding: 15rpx 20rpx;
-				.title {
-					font-size: 30rpx;
-					color: #333333;
-					line-height: 36rpx;
-					font-weight: 600;
-					height: 72rpx;
-				}
-				.bottom {
-					display: flex;
-					justify-content: space-between;
-					align-items: center;
-					margin-top: 10rpx;
-					.price {
-						display: flex;
-						flex-direction: column;
-					}
-					.price-1 {
-						font-size: 32rpx;
-						color: #FF3F42;
-						line-height: 36rpx;
-					}
-					.price-2 {
-						font-size: 26rpx;
-						color: #666666;
-						line-height: 30rpx;
-						text-decoration: line-through;
-					}
-					.btn {
-						width: 60rpx;
-						height: 60rpx;
-						background: #FE781F;
-						border-radius: 50%;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						image {
-							width: 41rpx;
-							height: 36rpx;
-							display: block;
-						}
-					}
-				}
-			}
-		}
-	}
-</style>
+<template>
+	<view class="app-container">
+		<view class="list-container">
+			<block v-for="(item, index) in dataList" :key='index'>
+				<view class="item" @tap="toGoodsDetail(item.goodsId)" @longpress="handleDelete(item.goodsFavoriteId)">
+					<image :src="item.imgUrl" mode="aspectFill"></image>
+					<view class="content">
+						<view class="title ellipsis-2">{{item.goodsName}}</view>
+						<view class="bottom">
+							<view class="price">
+								<view class="price-1">¥{{item.goodsPrice | numToFixed}}</view>
+								<view class="price-2">¥{{item.orgGoodsPrice | numToFixed}}</view>
+							</view>
+							<view class="btn"><image src="@/static/icon/cart.png" mode="aspectFill"></image></view>
+						</view>
+					</view>
+				</view>
+			</block>
+		</view>
+		<no-data v-if="!dataList.length" :showText="'暂无收藏商品'"></no-data>
+		<loading-text v-if="dataList.length"  :loading="loading" :noMore="noMore" ></loading-text>
+		
+		<modal-dialog showText="确定要取消收藏吗？" :isShowDialog="isDialog" @cancel="isDialog = false" @confirm="confirmDelete"></modal-dialog>
+		
+		<!-- <drag-button :isDock="true" :customBar="true" ref="dragButton"></drag-button> -->
+	</view>
+</template>
+
+<script>
+	import {mapState} from 'vuex';
+	import modalDialog from '@/components/modalDialog.vue';
+	// import dragButton from '@/components/drag-button.vue';
+	
+	export default {
+		components:{
+			modalDialog,
+			// dragButton
+		},
+		data() {
+			return {
+				dataList: [],
+				pageNum: 1,
+				pageSize: 8,
+				noMore: false,
+				loading: false,
+				deleteId: null,
+				isDialog: false,
+			}
+		},
+		
+		computed:{
+			...mapState(['userInfo', 'isLogin', 'userId'])
+		},
+		
+		onShow() {
+			// this.$refs.dragButton.init();
+		},
+		
+		onLoad() {
+			this.getGoodsList();
+		},
+		
+		// 下拉刷新
+		onPullDownRefresh() {
+			this.pageNum = 1;
+			this.getGoodsList();
+		},
+		
+		// 上拉加载
+		onReachBottom() {
+			this.getGoodsList(1);
+		},
+		
+		methods: {
+			// 获取商品列表
+			getGoodsList(loadMore) {
+				if(this.noMore && loadMore)return;
+				this.noMore = false
+				if(!loadMore){
+					this.pageNum = 1;
+				}else{
+					this.loading = true;
+				}
+				this.$axios({
+					url: '/goods/favorite/query',
+					method: 'get',
+					params: {
+						pageNum: this.pageNum,
+						pageSize: this.pageSize,
+						userId: this.userId,
+					},
+					isLoading: !loadMore
+				}).then(res => {
+					let _list = res.data.list;
+					let pageTotal = res.data.pages;
+					if(this.pageNum >= pageTotal){
+						this.noMore = true;
+					}
+					if (_list && _list.length) {
+						this.pageNum += 1
+					}
+					if (loadMore) {
+						this.dataList = this.dataList.concat(_list);
+						this.loading = false;
+					} else {
+						this.dataList = _list;
+					}
+					
+					uni.stopPullDownRefresh();
+				})
+			},
+			
+			handleDelete(id) {
+				this.deleteId = id;
+				this.isDialog = true;
+			},
+			
+			// 取消收藏
+			confirmDelete() {
+				this.$axios({
+					url: '/goods/favorite/del',
+					params: {
+						goodFavoriteId: this.deleteId
+					},
+					isLoading: 1,
+				}).then(res => {
+					this.isDialog = false;
+					this.$successToast('取消收藏成功');
+					this.getGoodsList();
+				})
+			},
+			
+			toGoodsDetail(id) {
+				uni.navigateTo({
+					url: '/packageGoods/pages/detail?id=' + id
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		box-sizing: border-box;
+	}
+	.list-container {
+		display: flex;
+		flex-wrap: wrap;
+		padding: 20rpx;
+		.item {
+			width: 348rpx;
+			background: #FFFFFF;
+			margin-right: 14rpx;
+			margin-bottom: 20rpx;
+			border-radius: 20rpx;
+			overflow: hidden;
+			&:nth-child(2n) {
+				margin-right: 0;
+			}
+			image {
+				width: 348rpx;
+				height: 348rpx;
+			}
+			.content {
+				padding: 15rpx 20rpx;
+				.title {
+					font-size: 30rpx;
+					color: #333333;
+					line-height: 36rpx;
+					font-weight: 600;
+					height: 72rpx;
+				}
+				.bottom {
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+					margin-top: 10rpx;
+					.price {
+						display: flex;
+						flex-direction: column;
+					}
+					.price-1 {
+						font-size: 32rpx;
+						color: #FF3F42;
+						line-height: 36rpx;
+					}
+					.price-2 {
+						font-size: 26rpx;
+						color: #666666;
+						line-height: 30rpx;
+						text-decoration: line-through;
+					}
+					.btn {
+						width: 60rpx;
+						height: 60rpx;
+						background: #FE781F;
+						border-radius: 50%;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+						image {
+							width: 41rpx;
+							height: 36rpx;
+							display: block;
+						}
+					}
+				}
+			}
+		}
+	}
+</style>

pages/mine/coupon/list.vue

@@ -1,476 +1,476 @@
-<template>
-	<view class="app-container">
-		<view class="tab-container">
-			<view class="item" :class="tabCurrent == 0 ? 'current':''" @tap="changeTab(0)">未使用({{count.wsy ? count.wsy : 0}})</view>
-			<view class="item" :class="tabCurrent == 1 ? 'current':''" @tap="changeTab(1)">已使用({{count.ysy ? count.ysy : 0}})</view>
-			<view class="item" :class="tabCurrent == 2 ? 'current':''" @tap="changeTab(2)">已过期({{count.ygq ? count.ygq : 0}})</view>
-		</view>
-		
-		<view class="list-container">
-			<block v-for="(item, index) in couponList" :key='index'>
-				<view class="item">
-					<view class="bg">
-						<image src="@/static/mine/coupon/bg_1.png" v-if="tabCurrent == 0"></image>
-						<image src="@/static/mine/coupon/bg_0.png" v-if="tabCurrent != 0"></image>
-					</view>
-					<view class="content">
-						<view class="left">
-							<view class="price">{{item.couponValue}}<text>元</text></view>
-							<view class="text" v-if="item.couponType == 'SATISFY'">满{{item.orderAmount}}可用</view>
-						</view>
-						<view class="right">
-							<view class="main">
-								<view class="row1 ellipsis-2" :class="tabCurrent == 0 ? '':'width'">{{item.couponName}}</view>
-								<view class="row2">
-									<view>使用时间：</view>
-									<view>{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}</view>
-								</view>
-							</view>
-							<view class="btn-group" v-if="tabCurrent == 0">
-								<view class="button white" @tap="toUseCoupon">去使用</view>
-								<!-- <view class="button red" @tap="shareCoupon(item.id)" v-if="userInfo.type == 'SERVICE'"><image src="@/static/icon/code.png"></image>分享</view> -->
-							</view>
-							<view class="tag" v-if="tabCurrent != 0">
-								<image src="@/static/mine/coupon/status_1.png" v-if="tabCurrent == 1"></image>
-								<image src="@/static/mine/coupon/status_2.png" v-if="tabCurrent == 2"></image>
-							</view>
-						</view>
-					</view>
-				</view>
-			</block>
-		</view>
-		<no-data v-if="!couponList.length" :showText="'空空如也'"></no-data>
-		<loading-text v-if="couponList.length"  :loading="loading" :noMore="noMore" ></loading-text>
-		
-		<!-- <view class="bottom-container">
-			<view class="button">兑换优惠码</view>
-		</view> -->
-		
-		<view class="global-mask" v-show="isShareDialog"></view>
-		<view class="share-dialog" v-show="isShareDialog">
-			<view class="content">
-				<image src="@/static/icon/close3.png" class="close" @tap="isShareDialog = false"></image>
-				<image src="@/static/mine/coupon/share.png" class="bg"></image>
-				<image :src="shareDetail.qrcode" class="code" @longpress="handleLongpress"></image>
-				<view class="logo">
-					<image :src="configInfo.minLogo2" mode="heightFix"></image>
-				</view>
-				<view class="tips" v-if="shareDetail.leftShareTimes > 0 && shareDetail.qrcode">长按二维码保存到手机</view>
-				<view class="noData" v-if="shareDetail.leftShareTimes <= 0">
-					<image src="@/static/mine/coupon/noData.png"></image>
-					<view>已超过可分享次数</view>
-					<view>该优惠券不可再分享</view>
-				</view>
-				<view class="text">可分享次数：{{shareDetail.leftShareTimes}}/{{shareDetail.shareTimes}}</view>
-			</view>
-		</view>
-	</view>
-</template>
-
-<script>
-	import {mapState} from 'vuex';
-	
-	export default {
-		data() {
-			return {
-				configInfo: uni.getStorageSync('configInfo'),
-				count: {}, // 优惠券数量统计
-				tabCurrent: 0, // 当前选择值
-				couponList: [], // 优惠券列表
-				pageNum: 1,
-				pageSize: 8,
-				noMore: false,
-				loading: false,
-				
-				isShareDialog: false,
-				shareDetail: {},
-			}
-		},
-		
-		computed:{
-			...mapState(['userInfo', 'isLogin', 'userId'])
-		},
-		
-		onLoad() {
-			this.getCount();
-			this.getCouponList();
-		},
-		
-		// 下拉刷新
-		onPullDownRefresh() {
-			this.pageNum = 1;
-			this.getCouponList();
-		},
-		
-		// 上拉加载
-		onReachBottom() {
-			this.getCouponList(1);
-		},
-		
-		methods: {
-			getCount() {
-				this.$axios({
-					url: '/coupon/count',
-					method: 'get',
-					params: {
-						userId: this.userId
-					},
-				}).then(res => {
-					this.count = res.data;
-				})
-			},
-			
-			getCouponList(loadMore) {
-				if(this.noMore && loadMore)return;
-				this.noMore = false
-				if(!loadMore){
-					this.pageNum = 1;
-				}else{
-					this.loading = true;
-				}
-				this.$axios({
-					url: '/coupon/list/page',
-					method: 'get',
-					params: {
-						pageNum: this.pageNum,
-						pageSize: this.pageSize,
-						type: this.tabCurrent,
-						userId: this.userId
-					},
-					isLoading: !loadMore
-				}).then(res => {
-					let _list = res.data.records;
-					let pageTotal = res.data.pages;
-					if(this.pageNum >= pageTotal){
-						this.noMore = true;
-					}
-					if (_list.length) {
-						this.pageNum += 1
-					}
-					if (loadMore) {
-						this.couponList = this.couponList.concat(_list);
-						this.loading = false;
-					} else {
-						this.couponList = _list;
-					}
-					
-					uni.stopPullDownRefresh();
-				})
-			},
-			
-			changeTab(tab) {
-				this.tabCurrent = tab;
-				this.getCouponList();
-			},
-			
-			// 去使用优惠券
-			toUseCoupon() {
-				uni.switchTab({
-				    url: '/pages/goods/classify'
-				});
-			},
-			
-			// 分享优惠券
-			shareCoupon(id) {
-				this.$axios({
-					url: '/coupon/transfer/qrcode',
-					method: 'get',
-					params: {
-						userId: this.userId,
-						userCouponId: id
-					},
-				}).then(res => {
-					this.shareDetail = res.data;
-					this.isShareDialog = true;
-				})
-			},
-			
-			handleLongpress() {
-				let that = this;
-				uni.showActionSheet({
-				    itemList: ['保存二维码'],
-				    success: function (res) {
-						if(res.tapIndex == 0) {
-							uni.downloadFile({
-							    url: that.shareDetail.qrcode,
-							    success: (res) => {
-							        if (res.statusCode === 200) {
-							            uni.saveImageToPhotosAlbum({
-											filePath: res.tempFilePath,
-											success: function () {
-												that.$successToast('保存成功');
-											}
-										});
-							        }
-							    }
-							});
-						}
-				    },
-				    fail: function (res) {
-				        console.log(res.errMsg);
-				    }
-				});
-			}
-		}
-	}
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #F4F2F2;
-		padding: 108rpx 20rpx 120rpx;
-		box-sizing: border-box;
-	}
-	
-	.tab-container {
-		position: fixed;
-		top: 0;
-		left: 0;
-		width: 100%;
-		display: flex;
-		background: #FFFFFF;
-		.item {
-			flex: 1;
-			height: 88rpx;
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			position: relative;
-			&.current {
-				color: #FF3F42;
-				&::after {
-					content: '';
-					display: block;
-					width: 80rpx;
-					height: 6rpx;
-					background: #FF3F42;
-					position: absolute;
-					bottom: 0;
-					left: 50%;
-					margin-left: -40rpx;
-				}
-			}
-		}
-	}
-	.list-container {
-		.item {
-			position: relative;
-			margin-bottom: 20rpx;
-			.bg {
-				image {
-					width: 710rpx;
-					height: 160rpx;
-					display: block;
-				}
-			}
-			.content {
-				position: absolute;
-				left: 0;
-				top: 0;
-				width: 710rpx;
-				height: 160rpx;
-				display: flex;
-				align-items: center;
-				.left {
-					width: 240rpx;
-					display: flex;
-					align-items: center;
-					justify-content: center;
-					flex-direction: column;
-					.price {
-						font-size: 60rpx;
-						color: #FFFFFF;
-						text {
-							font-size: 28rpx;
-							margin-top: 20rpx;
-						}
-					}
-					.text {
-						color: #FFFFFF;
-						font-size: 28rpx;
-					}
-				}
-				.right {
-					display: flex;
-					justify-content: space-between;
-					padding: 15rpx 20rpx;
-					width: 470rpx;
-					height: 160rpx;
-					box-sizing: border-box;
-					.main {
-						width: 300rpx;
-						height: 130rpx;
-						box-sizing: border-box;
-						display: flex;
-						flex-direction: column;
-						justify-content: space-between;
-						.row1 {
-							font-size: 28rpx;
-							line-height: 32rpx;
-							&.width{
-								width: 330rpx;
-							} 
-						}
-						.row2 {
-							font-size: 24rpx;
-							color: #999999;
-							line-height: 28rpx;
-						}
-					}
-					.btn-group {
-						display: flex;
-						flex-direction: column;
-						justify-content: center;
-						padding-right: 8rpx;
-						.button {
-							width: 100rpx;
-							height: 40rpx;
-							border-radius: 40rpx;
-							font-size: 24rpx;
-							flex-shrink: 0;
-							display: flex;
-							align-items: center;
-							justify-content: center;
-							image {
-								width: 22rpx;
-								height: 22rpx;
-								display: block;
-								margin-right: 6rpx;
-							}
-							&.white {
-								color: #FF3F42;
-								border: 1px solid #FF3F42;
-							}
-							&.red {
-								color: #FFFFFF;
-								border: 1px solid #FE781F;
-								background: #FE781F;
-							}
-							&:last-child {
-								margin-top: 20rpx;
-							}
-						}
-					}
-					.tag {
-						image {
-							width: 80rpx;
-							height: 80rpx;
-							display: block;
-						}
-					}
-				}
-			}
-		}
-	}
-	.bottom-container {
-		position: fixed;
-		bottom: 0;
-		left: 0;
-		width: 100%;
-		padding: 0 20rpx;
-		box-sizing: border-box;
-		background: #FFFFFF;
-		display: flex;
-		align-items: center;
-		height: 100rpx;
-		.button {
-			width: 100%;
-			height: 68rpx;
-			line-height: 68rpx;
-			border-radius: 68rpx;
-			text-align: center;
-			font-size: 28rpx;
-			color: #666666;
-			border: 1px solid #B0B0B0;
-		}
-	}
-	.share-dialog {
-		position: fixed;
-		top: calc(50vh - 500rpx);
-		left: 55rpx;
-		z-index: 999;
-		.content {
-			position: relative;
-			.bg {
-				width: 640rpx;
-				height: 1000rpx;
-				display: block;
-			}
-			.close {
-				position: absolute;
-				right: 20rpx;
-				top: 20rpx;
-				width: 30rpx;
-				height: 30rpx;
-				display: block;
-			}
-			.code {
-				position: absolute;
-				top: 300rpx;
-				left: 120rpx;
-				width: 400rpx;
-				height: 400rpx;
-				display: block;
-				z-index: 9;
-			}
-			.logo {
-				width: 100%;
-				position: absolute;
-				bottom: 60rpx;
-				left: 0;
-				display: flex;
-				justify-content: center;
-				image {
-					height: 60rpx;
-					display: block;
-				}
-			}
-			.tips {
-				position: absolute;
-				left: 0;
-				top: 700rpx;
-				line-height: 50rpx;
-				font-size: 24rpx;
-				color: #f5f5f5;
-				width: 640rpx;
-				text-align: center;
-			}
-			.text {
-				position: absolute;
-				left: 0;
-				bottom: 0;
-				line-height: 60rpx;
-				font-size: 24rpx;
-				color: #666666;
-				width: 640rpx;
-				text-align: center;
-			}
-			.noData {
-				position: absolute;
-				top: 300rpx;
-				left: 120rpx;
-				width: 400rpx;
-				height: 400rpx;
-				display: block;
-				z-index: 10;
-				background: #FFFFFF;
-				display: flex;
-				flex-direction: column;
-				align-items: center;
-				justify-content: center;
-				image {
-					width: 197rpx;
-					height: 146rpx;
-					display: block;
-					margin-bottom: 20rpx;
-				}
-				view {
-					font-size: 28rpx;
-					color: #333333;
-					line-height: 48rpx;
-				}
-			}
-		}
-		
-	}
-</style>
+<template>
+	<view class="app-container">
+		<view class="tab-container">
+			<view class="item" :class="tabCurrent == 0 ? 'current':''" @tap="changeTab(0)">未使用({{count.wsy ? count.wsy : 0}})</view>
+			<view class="item" :class="tabCurrent == 1 ? 'current':''" @tap="changeTab(1)">已使用({{count.ysy ? count.ysy : 0}})</view>
+			<view class="item" :class="tabCurrent == 2 ? 'current':''" @tap="changeTab(2)">已过期({{count.ygq ? count.ygq : 0}})</view>
+		</view>
+		
+		<view class="list-container">
+			<block v-for="(item, index) in couponList" :key='index'>
+				<view class="item">
+					<view class="bg">
+						<image src="@/static/mine/coupon/bg_1.png" v-if="tabCurrent == 0"></image>
+						<image src="@/static/mine/coupon/bg_0.png" v-if="tabCurrent != 0"></image>
+					</view>
+					<view class="content">
+						<view class="left">
+							<view class="price">{{item.couponValue}}<text>元</text></view>
+							<view class="text" v-if="item.couponType == 'SATISFY'">满{{item.orderAmount}}可用</view>
+						</view>
+						<view class="right">
+							<view class="main">
+								<view class="row1 ellipsis-2" :class="tabCurrent == 0 ? '':'width'">{{item.couponName}}</view>
+								<view class="row2">
+									<view>使用时间：</view>
+									<view>{{item.activeStartTime | dateToYYmmdd2}}-{{item.activeEndTime | dateToYYmmdd2}}</view>
+								</view>
+							</view>
+							<view class="btn-group" v-if="tabCurrent == 0">
+								<view class="button white" @tap="toUseCoupon">去使用</view>
+								<!-- <view class="button red" @tap="shareCoupon(item.id)" v-if="userInfo.type == 'SERVICE'"><image src="@/static/icon/code.png"></image>分享</view> -->
+							</view>
+							<view class="tag" v-if="tabCurrent != 0">
+								<image src="@/static/mine/coupon/status_1.png" v-if="tabCurrent == 1"></image>
+								<image src="@/static/mine/coupon/status_2.png" v-if="tabCurrent == 2"></image>
+							</view>
+						</view>
+					</view>
+				</view>
+			</block>
+		</view>
+		<no-data v-if="!couponList.length" :showText="'空空如也'"></no-data>
+		<loading-text v-if="couponList.length"  :loading="loading" :noMore="noMore" ></loading-text>
+		
+		<!-- <view class="bottom-container">
+			<view class="button">兑换优惠码</view>
+		</view> -->
+		
+		<view class="global-mask" v-show="isShareDialog"></view>
+		<view class="share-dialog" v-show="isShareDialog">
+			<view class="content">
+				<image src="@/static/icon/close3.png" class="close" @tap="isShareDialog = false"></image>
+				<image src="@/static/mine/coupon/share.png" class="bg"></image>
+				<image :src="shareDetail.qrcode" class="code" @longpress="handleLongpress"></image>
+				<view class="logo">
+					<image :src="configInfo.minLogo2" mode="heightFix"></image>
+				</view>
+				<view class="tips" v-if="shareDetail.leftShareTimes > 0 && shareDetail.qrcode">长按二维码保存到手机</view>
+				<view class="noData" v-if="shareDetail.leftShareTimes <= 0">
+					<image src="@/static/mine/coupon/noData.png"></image>
+					<view>已超过可分享次数</view>
+					<view>该优惠券不可再分享</view>
+				</view>
+				<view class="text">可分享次数：{{shareDetail.leftShareTimes}}/{{shareDetail.shareTimes}}</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import {mapState} from 'vuex';
+	
+	export default {
+		data() {
+			return {
+				configInfo: uni.getStorageSync('configInfo'),
+				count: {}, // 优惠券数量统计
+				tabCurrent: 0, // 当前选择值
+				couponList: [], // 优惠券列表
+				pageNum: 1,
+				pageSize: 8,
+				noMore: false,
+				loading: false,
+				
+				isShareDialog: false,
+				shareDetail: {},
+			}
+		},
+		
+		computed:{
+			...mapState(['userInfo', 'isLogin', 'userId'])
+		},
+		
+		onLoad() {
+			this.getCount();
+			this.getCouponList();
+		},
+		
+		// 下拉刷新
+		onPullDownRefresh() {
+			this.pageNum = 1;
+			this.getCouponList();
+		},
+		
+		// 上拉加载
+		onReachBottom() {
+			this.getCouponList(1);
+		},
+		
+		methods: {
+			getCount() {
+				this.$axios({
+					url: '/coupon/count',
+					method: 'get',
+					params: {
+						userId: this.userId
+					},
+				}).then(res => {
+					this.count = res.data;
+				})
+			},
+			
+			getCouponList(loadMore) {
+				if(this.noMore && loadMore)return;
+				this.noMore = false
+				if(!loadMore){
+					this.pageNum = 1;
+				}else{
+					this.loading = true;
+				}
+				this.$axios({
+					url: '/coupon/list/page',
+					method: 'get',
+					params: {
+						pageNum: this.pageNum,
+						pageSize: this.pageSize,
+						type: this.tabCurrent,
+						userId: this.userId
+					},
+					isLoading: !loadMore
+				}).then(res => {
+					let _list = res.data.records;
+					let pageTotal = res.data.pages;
+					if(this.pageNum >= pageTotal){
+						this.noMore = true;
+					}
+					if (_list.length) {
+						this.pageNum += 1
+					}
+					if (loadMore) {
+						this.couponList = this.couponList.concat(_list);
+						this.loading = false;
+					} else {
+						this.couponList = _list;
+					}
+					
+					uni.stopPullDownRefresh();
+				})
+			},
+			
+			changeTab(tab) {
+				this.tabCurrent = tab;
+				this.getCouponList();
+			},
+			
+			// 去使用优惠券
+			toUseCoupon() {
+				uni.switchTab({
+				    url: '/pages/goods/classify'
+				});
+			},
+			
+			// 分享优惠券
+			shareCoupon(id) {
+				this.$axios({
+					url: '/coupon/transfer/qrcode',
+					method: 'get',
+					params: {
+						userId: this.userId,
+						userCouponId: id
+					},
+				}).then(res => {
+					this.shareDetail = res.data;
+					this.isShareDialog = true;
+				})
+			},
+			
+			handleLongpress() {
+				let that = this;
+				uni.showActionSheet({
+				    itemList: ['保存二维码'],
+				    success: function (res) {
+						if(res.tapIndex == 0) {
+							uni.downloadFile({
+							    url: that.shareDetail.qrcode,
+							    success: (res) => {
+							        if (res.statusCode === 200) {
+							            uni.saveImageToPhotosAlbum({
+											filePath: res.tempFilePath,
+											success: function () {
+												that.$successToast('保存成功');
+											}
+										});
+							        }
+							    }
+							});
+						}
+				    },
+				    fail: function (res) {
+				        console.log(res.errMsg);
+				    }
+				});
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		padding: 108rpx 20rpx 120rpx;
+		box-sizing: border-box;
+	}
+	
+	.tab-container {
+		position: fixed;
+		top: 0;
+		left: 0;
+		width: 100%;
+		display: flex;
+		background: #FFFFFF;
+		.item {
+			flex: 1;
+			height: 88rpx;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			position: relative;
+			&.current {
+				color: #FF3F42;
+				&::after {
+					content: '';
+					display: block;
+					width: 80rpx;
+					height: 6rpx;
+					background: #FF3F42;
+					position: absolute;
+					bottom: 0;
+					left: 50%;
+					margin-left: -40rpx;
+				}
+			}
+		}
+	}
+	.list-container {
+		.item {
+			position: relative;
+			margin-bottom: 20rpx;
+			.bg {
+				image {
+					width: 710rpx;
+					height: 160rpx;
+					display: block;
+				}
+			}
+			.content {
+				position: absolute;
+				left: 0;
+				top: 0;
+				width: 710rpx;
+				height: 160rpx;
+				display: flex;
+				align-items: center;
+				.left {
+					width: 240rpx;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					flex-direction: column;
+					.price {
+						font-size: 60rpx;
+						color: #FFFFFF;
+						text {
+							font-size: 28rpx;
+							margin-top: 20rpx;
+						}
+					}
+					.text {
+						color: #FFFFFF;
+						font-size: 28rpx;
+					}
+				}
+				.right {
+					display: flex;
+					justify-content: space-between;
+					padding: 15rpx 20rpx;
+					width: 470rpx;
+					height: 160rpx;
+					box-sizing: border-box;
+					.main {
+						width: 300rpx;
+						height: 130rpx;
+						box-sizing: border-box;
+						display: flex;
+						flex-direction: column;
+						justify-content: space-between;
+						.row1 {
+							font-size: 28rpx;
+							line-height: 32rpx;
+							&.width{
+								width: 330rpx;
+							} 
+						}
+						.row2 {
+							font-size: 24rpx;
+							color: #999999;
+							line-height: 28rpx;
+						}
+					}
+					.btn-group {
+						display: flex;
+						flex-direction: column;
+						justify-content: center;
+						padding-right: 8rpx;
+						.button {
+							width: 100rpx;
+							height: 40rpx;
+							border-radius: 40rpx;
+							font-size: 24rpx;
+							flex-shrink: 0;
+							display: flex;
+							align-items: center;
+							justify-content: center;
+							image {
+								width: 22rpx;
+								height: 22rpx;
+								display: block;
+								margin-right: 6rpx;
+							}
+							&.white {
+								color: #FF3F42;
+								border: 1px solid #FF3F42;
+							}
+							&.red {
+								color: #FFFFFF;
+								border: 1px solid #FE781F;
+								background: #FE781F;
+							}
+							&:last-child {
+								margin-top: 20rpx;
+							}
+						}
+					}
+					.tag {
+						image {
+							width: 80rpx;
+							height: 80rpx;
+							display: block;
+						}
+					}
+				}
+			}
+		}
+	}
+	.bottom-container {
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		width: 100%;
+		padding: 0 20rpx;
+		box-sizing: border-box;
+		background: #FFFFFF;
+		display: flex;
+		align-items: center;
+		height: 100rpx;
+		.button {
+			width: 100%;
+			height: 68rpx;
+			line-height: 68rpx;
+			border-radius: 68rpx;
+			text-align: center;
+			font-size: 28rpx;
+			color: #666666;
+			border: 1px solid #B0B0B0;
+		}
+	}
+	.share-dialog {
+		position: fixed;
+		top: calc(50vh - 500rpx);
+		left: 55rpx;
+		z-index: 999;
+		.content {
+			position: relative;
+			.bg {
+				width: 640rpx;
+				height: 1000rpx;
+				display: block;
+			}
+			.close {
+				position: absolute;
+				right: 20rpx;
+				top: 20rpx;
+				width: 30rpx;
+				height: 30rpx;
+				display: block;
+			}
+			.code {
+				position: absolute;
+				top: 300rpx;
+				left: 120rpx;
+				width: 400rpx;
+				height: 400rpx;
+				display: block;
+				z-index: 9;
+			}
+			.logo {
+				width: 100%;
+				position: absolute;
+				bottom: 60rpx;
+				left: 0;
+				display: flex;
+				justify-content: center;
+				image {
+					height: 60rpx;
+					display: block;
+				}
+			}
+			.tips {
+				position: absolute;
+				left: 0;
+				top: 700rpx;
+				line-height: 50rpx;
+				font-size: 24rpx;
+				color: #f5f5f5;
+				width: 640rpx;
+				text-align: center;
+			}
+			.text {
+				position: absolute;
+				left: 0;
+				bottom: 0;
+				line-height: 60rpx;
+				font-size: 24rpx;
+				color: #666666;
+				width: 640rpx;
+				text-align: center;
+			}
+			.noData {
+				position: absolute;
+				top: 300rpx;
+				left: 120rpx;
+				width: 400rpx;
+				height: 400rpx;
+				display: block;
+				z-index: 10;
+				background: #FFFFFF;
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				justify-content: center;
+				image {
+					width: 197rpx;
+					height: 146rpx;
+					display: block;
+					margin-bottom: 20rpx;
+				}
+				view {
+					font-size: 28rpx;
+					color: #333333;
+					line-height: 48rpx;
+				}
+			}
+		}
+		
+	}
+</style>

pages/mine/customer/list copy.vue

@@ -1,112 +1,112 @@
-<template>
-	<view class="app-container">
-		<view class="list-container">
-			<block v-for="(item, index) in customerList" :key='index'>
-				<view class="item">
-					<view>客户姓名：{{item.nickName}}</view>
-					<view>客户电话：{{item.mobile}}</view>
-					<view>加入时间：{{item.serviceTime | dateToYYmmdd}}</view>
-				</view>
-			</block>
-		</view>
-		<no-data v-if="!customerList.length" :showText="'暂无客户'"></no-data>
-		<loading-text v-if="customerList.length"  :loading="loading" :noMore="noMore" ></loading-text>
-	</view>
-</template>
-
-<script>
-	import {mapState} from 'vuex';
-	
-	export default {
-		data() {
-			return {
-				customerList: [],
-				pageNum: 1,
-				pageSize: 10,
-				noMore: false,
-				loading: false,
-			}
-		},
-		
-		computed:{
-			...mapState(['userInfo', 'isLogin', 'userId'])
-		},
-		
-		onLoad() {
-			this.getCustomerList();
-		},
-		
-		// 下拉刷新
-		onPullDownRefresh() {
-			this.pageNum = 1;
-			this.getCustomerList();
-		},
-		
-		// 上拉加载
-		onReachBottom() {
-			this.getCustomerList(1);
-		},
-		
-		methods: {
-			// 获取商品列表
-			getCustomerList(loadMore) {
-				if(this.noMore && loadMore)return;
-				this.noMore = false
-				if(!loadMore){
-					this.pageNum = 1;
-				}else{
-					this.loading = true;
-				}
-				this.$axios({
-					url: '/user/customer',
-					method: 'get',
-					params: {
-						pageNum: this.pageNum,
-						pageSize: this.pageSize,
-						userId: this.userId,
-					},
-					isLoading: !loadMore
-				}).then(res => {
-					let _list = res.data.records;
-					let pageTotal = res.data.pages;
-					if(this.pageNum >= pageTotal){
-						this.noMore = true;
-					}
-					if (_list.length) {
-						this.pageNum += 1
-					}
-					if (loadMore) {
-						this.customerList = this.customerList.concat(_list);
-						this.loading = false;
-					} else {
-						this.customerList = _list;
-					}
-					
-					uni.stopPullDownRefresh();
-				})
-			},
-		}
-	}
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #F4F2F2;
-		box-sizing: border-box;
-	}
-	.list-container {
-		padding: 20rpx;
-		.item {
-			background: #FFFFFF;
-			margin-bottom: 20rpx;
-			border-radius: 20rpx;
-			padding: 20rpx;
-			font-size: 28rpx;
-			height: 180rpx;
-			display: flex;
-			flex-direction: column;
-			box-sizing: border-box;
-			justify-content: space-between;
-		}
-	}
-</style>
+<template>
+	<view class="app-container">
+		<view class="list-container">
+			<block v-for="(item, index) in customerList" :key='index'>
+				<view class="item">
+					<view>客户姓名：{{item.nickName}}</view>
+					<view>客户电话：{{item.mobile}}</view>
+					<view>加入时间：{{item.serviceTime | dateToYYmmdd}}</view>
+				</view>
+			</block>
+		</view>
+		<no-data v-if="!customerList.length" :showText="'暂无客户'"></no-data>
+		<loading-text v-if="customerList.length"  :loading="loading" :noMore="noMore" ></loading-text>
+	</view>
+</template>
+
+<script>
+	import {mapState} from 'vuex';
+	
+	export default {
+		data() {
+			return {
+				customerList: [],
+				pageNum: 1,
+				pageSize: 10,
+				noMore: false,
+				loading: false,
+			}
+		},
+		
+		computed:{
+			...mapState(['userInfo', 'isLogin', 'userId'])
+		},
+		
+		onLoad() {
+			this.getCustomerList();
+		},
+		
+		// 下拉刷新
+		onPullDownRefresh() {
+			this.pageNum = 1;
+			this.getCustomerList();
+		},
+		
+		// 上拉加载
+		onReachBottom() {
+			this.getCustomerList(1);
+		},
+		
+		methods: {
+			// 获取商品列表
+			getCustomerList(loadMore) {
+				if(this.noMore && loadMore)return;
+				this.noMore = false
+				if(!loadMore){
+					this.pageNum = 1;
+				}else{
+					this.loading = true;
+				}
+				this.$axios({
+					url: '/user/customer',
+					method: 'get',
+					params: {
+						pageNum: this.pageNum,
+						pageSize: this.pageSize,
+						userId: this.userId,
+					},
+					isLoading: !loadMore
+				}).then(res => {
+					let _list = res.data.records;
+					let pageTotal = res.data.pages;
+					if(this.pageNum >= pageTotal){
+						this.noMore = true;
+					}
+					if (_list.length) {
+						this.pageNum += 1
+					}
+					if (loadMore) {
+						this.customerList = this.customerList.concat(_list);
+						this.loading = false;
+					} else {
+						this.customerList = _list;
+					}
+					
+					uni.stopPullDownRefresh();
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		box-sizing: border-box;
+	}
+	.list-container {
+		padding: 20rpx;
+		.item {
+			background: #FFFFFF;
+			margin-bottom: 20rpx;
+			border-radius: 20rpx;
+			padding: 20rpx;
+			font-size: 28rpx;
+			height: 180rpx;
+			display: flex;
+			flex-direction: column;
+			box-sizing: border-box;
+			justify-content: space-between;
+		}
+	}
+</style>

pages/mine/customer/list.vue

@@ -1,160 +1,160 @@
-<template>
-	<view class="app-container">
-		<view class="list-container">
-			<block v-for="(item, index) in customerList" :key='index'>
-				<view class="item">
-					<view class="row">客户姓名：{{item.nickName}}</view>
-					<view class="row">客户电话：{{item.mobile}}</view>
-					<view class="row">加入时间：{{item.serviceTime ? (item.serviceTime | dateToYYmmdd) : ''}}</view>
-					<view class="row">最近访问时间：{{item.lastAccessTime || ''}}</view>
-					<view class="title">客户标签</view>
-					<view class="tags" @tap="toChooseTag(item.unionId)">
-						<view class="left" v-if="item.allTags && item.allTags.length > 0">
-							<block v-for="(it, idx) in item.allTags" :key='idx'>
-								<text>{{it.tagName}}</text>
-							</block>
-						</view>
-						<view class="no" v-else>添加标签</view>
-						<image src="@/static/icon/right.png"></image>
-					</view>
-				</view>
-			</block>
-		</view>
-		<no-data v-if="!customerList.length" :showText="'暂无客户'"></no-data>
-	</view>
-</template>
-
-<script>
-	import {
-		mapState
-	} from 'vuex';
-
-	export default {
-		data() {
-			return {
-				customerList: [],
-			}
-		},
-
-		computed: {
-			...mapState(['userInfo', 'isLogin', 'userId'])
-		},
-
-		onLoad() {
-			this.getCustomerList();
-
-			uni.$on('refreshCustomerData', () => {
-				this.getCustomerList();
-			})
-		},
-
-		// 下拉刷新
-		onPullDownRefresh() {
-			this.getCustomerList();
-		},
-
-		methods: {
-			// 获取客户列表
-			getCustomerList() {
-				this.$axios({
-					url: '/user/customer',
-					method: 'get',
-					params: {
-						userId: this.userId,
-						pageNum: 1,
-						pageSize: -1
-					},
-				}).then(res => {
-					if (res.data && res.data.length > 0) {
-						res.data.forEach(item => {
-							item.allTags = item.tags.concat(item.customtags);
-						})
-					}
-					this.customerList = res.data || [];
-
-					uni.stopPullDownRefresh();
-				})
-			},
-
-			// 去选择标签
-			toChooseTag(unionId) {
-				uni.navigateTo({
-					url: '/pages/mine/customer/tag?unionId=' + unionId
-				})
-			},
-		}
-	}
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #F4F2F2;
-		box-sizing: border-box;
-	}
-
-	.list-container {
-		padding: 20rpx;
-
-		.item {
-			background: #FFFFFF;
-			margin-bottom: 20rpx;
-			border-radius: 20rpx;
-			padding: 20rpx;
-			font-size: 28rpx;
-			display: flex;
-			flex-direction: column;
-			box-sizing: border-box;
-
-			.row {
-				margin-bottom: 10rpx;
-			}
-
-			.title {
-				margin-top: 10rpx;
-			}
-
-			.tags {
-				margin-top: 8rpx;
-				padding: 16rpx 20rpx 6rpx;
-				border-radius: 10rpx;
-				background: #F1F1F1;
-				display: flex;
-				align-items: center;
-				justify-content: space-between;
-
-				.left {
-					text {
-						display: inline-block;
-						font-size: 24rpx;
-						padding: 0 16rpx;
-						height: 48rpx;
-						line-height: 48rpx;
-						border-radius: 10rpx;
-						background: #FFD6BB;
-						color: #FE781F;
-						border: 1px solid rgba($color: #FE781F, $alpha: 0.4);
-						margin-right: 10rpx;
-						margin-bottom: 10rpx;
-
-						&:last-child {
-							margin-right: 0;
-						}
-					}
-				}
-
-				.no {
-					color: #666666;
-					margin-bottom: 10rpx;
-				}
-
-				image {
-					flex-shrink: 0;
-					width: 14rpx;
-					height: 28rpx;
-					margin-left: 10rpx;
-					margin-bottom: 10rpx;
-				}
-			}
-		}
-	}
+<template>
+	<view class="app-container">
+		<view class="list-container">
+			<block v-for="(item, index) in customerList" :key='index'>
+				<view class="item">
+					<view class="row">客户姓名：{{item.nickName}}</view>
+					<view class="row">客户电话：{{item.mobile}}</view>
+					<view class="row">加入时间：{{item.serviceTime ? (item.serviceTime | dateToYYmmdd) : ''}}</view>
+					<view class="row">最近访问时间：{{item.lastAccessTime || ''}}</view>
+					<view class="title">客户标签</view>
+					<view class="tags" @tap="toChooseTag(item.unionId)">
+						<view class="left" v-if="item.allTags && item.allTags.length > 0">
+							<block v-for="(it, idx) in item.allTags" :key='idx'>
+								<text>{{it.tagName}}</text>
+							</block>
+						</view>
+						<view class="no" v-else>添加标签</view>
+						<image src="@/static/icon/right.png"></image>
+					</view>
+				</view>
+			</block>
+		</view>
+		<no-data v-if="!customerList.length" :showText="'暂无客户'"></no-data>
+	</view>
+</template>
+
+<script>
+	import {
+		mapState
+	} from 'vuex';
+
+	export default {
+		data() {
+			return {
+				customerList: [],
+			}
+		},
+
+		computed: {
+			...mapState(['userInfo', 'isLogin', 'userId'])
+		},
+
+		onLoad() {
+			this.getCustomerList();
+
+			uni.$on('refreshCustomerData', () => {
+				this.getCustomerList();
+			})
+		},
+
+		// 下拉刷新
+		onPullDownRefresh() {
+			this.getCustomerList();
+		},
+
+		methods: {
+			// 获取客户列表
+			getCustomerList() {
+				this.$axios({
+					url: '/user/customer',
+					method: 'get',
+					params: {
+						userId: this.userId,
+						pageNum: 1,
+						pageSize: -1
+					},
+				}).then(res => {
+					if (res.data && res.data.length > 0) {
+						res.data.forEach(item => {
+							item.allTags = item.tags.concat(item.customtags);
+						})
+					}
+					this.customerList = res.data || [];
+
+					uni.stopPullDownRefresh();
+				})
+			},
+
+			// 去选择标签
+			toChooseTag(unionId) {
+				uni.navigateTo({
+					url: '/pages/mine/customer/tag?unionId=' + unionId
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		box-sizing: border-box;
+	}
+
+	.list-container {
+		padding: 20rpx;
+
+		.item {
+			background: #FFFFFF;
+			margin-bottom: 20rpx;
+			border-radius: 20rpx;
+			padding: 20rpx;
+			font-size: 28rpx;
+			display: flex;
+			flex-direction: column;
+			box-sizing: border-box;
+
+			.row {
+				margin-bottom: 10rpx;
+			}
+
+			.title {
+				margin-top: 10rpx;
+			}
+
+			.tags {
+				margin-top: 8rpx;
+				padding: 16rpx 20rpx 6rpx;
+				border-radius: 10rpx;
+				background: #F1F1F1;
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+
+				.left {
+					text {
+						display: inline-block;
+						font-size: 24rpx;
+						padding: 0 16rpx;
+						height: 48rpx;
+						line-height: 48rpx;
+						border-radius: 10rpx;
+						background: #FFD6BB;
+						color: #FE781F;
+						border: 1px solid rgba($color: #FE781F, $alpha: 0.4);
+						margin-right: 10rpx;
+						margin-bottom: 10rpx;
+
+						&:last-child {
+							margin-right: 0;
+						}
+					}
+				}
+
+				.no {
+					color: #666666;
+					margin-bottom: 10rpx;
+				}
+
+				image {
+					flex-shrink: 0;
+					width: 14rpx;
+					height: 28rpx;
+					margin-left: 10rpx;
+					margin-bottom: 10rpx;
+				}
+			}
+		}
+	}
 </style>

pages/mine/customer/tag.vue

@@ -1,255 +1,255 @@
-<template>
-	<view class="app-container">
-		<view class="list-container">
-			<block v-for="(item, index) in tagList" :key='index'>
-				<view class="item">
-					<view class="top">
-						<view class="title">{{item.tagGroupName}}</view>
-					</view>
-					<view class="tags">
-						<block v-for="(it, idx) in item.tags" :key='idx'>
-							<view class="tag" :class="it.tagged ? 'current':''" @tap="changeTag(index, idx)">{{it.tagName}}</view>
-						</block>
-					</view>
-				</view>
-			</block>
-			
-			<view class="item">
-				<view class="top">
-					<view class="title">自定义标签</view>
-				</view>
-				<view class="tags">
-					<block v-for="(item, index) in customTagList" :key='index'>
-						<view class="tag current">{{item}}<image src="@/static/icon/close2.png" class="close" @tap="deleteTag(index)"></image></view>
-					</block>
-					<view class="tag add" @tap="isShowDialog = true"><image src="@/static/icon/add.png"></image>新建标签</view>
-				</view>
-			</view>
-		</view>
-		
-		<view class="bottom-container">
-			<view class="button" @tap="submitForm">保存</view>
-		</view>
-		
-		<view class="global-mask" v-show="isShowDialog"></view>
-		<view class="global-dialog" v-show="isShowDialog" style="top: 40%;">
-			<view class="title">新建标签</view>
-			<view class="input">
-				<input type="text" placeholder="标签名称" v-model="newTagName">
-			</view>
-			<view class="btn">
-				<view class="left" @tap="isShowDialog = false">取消</view>
-				<view class="right" @tap="addTag()">确定</view>
-			</view>
-		</view>
-	</view>
-</template>
-
-<script>
-	export default {
-		data() {
-			return {
-				unionId: null,
-				tagList: [],
-				customTagList: [],
-				isShowDialog: false,
-				newTagName: '',
-				
-				oldTagIds: [],
-			}
-		},
-		
-		onLoad({unionId}) {
-			this.unionId = unionId;
-			
-			this.getTagList();
-		},
-		
-		methods: {
-			// 获取标签列表
-			getTagList() {
-				this.$axios({
-					url: '/tag/wx/tag/list',
-					method: 'get',
-					params: {
-						unionId: this.unionId
-					},
-				}).then(res => {
-					this.tagList = res.data.tagGroupBeanList;
-					this.customTagList = res.data.tagNameList;
-					
-					for (let i = 0; i < this.tagList.length; i++) {
-						for (let j = 0; j < this.tagList[i].tags.length; j++) {
-							if(this.tagList[i].tags[j].tagged) {
-								this.oldTagIds.push(this.tagList[i].tags[j].tagId);
-							}
-						}
-					}
-					console.log(this.oldTagIds);
-				})
-			},
-			
-			// 新建标签
-			addTag() {
-				if(!this.newTagName) {
-					return this.$toast('请填写标签名称');
-				}
-				this.customTagList.push(this.newTagName);
-				this.newTagName = '';
-				this.isShowDialog = false;
-			},
-			
-			// 删除标签
-			deleteTag(index) {
-				this.customTagList.splice(index, 1);
-			},
-			
-			// 切换标签
-			changeTag(index, idx) {
-				this.tagList[index].tags[idx].tagged = !this.tagList[index].tags[idx].tagged;
-			},
-			
-			// 保存
-			submitForm() {
-				let tagList = [];
-				let oldTagIds = this.oldTagIds;
-				let newTagIds = [];
-				let delTagIds = [];
-				// 查出选中的标签
-				for (let i = 0; i < this.tagList.length; i++) {
-					for (let j = 0; j < this.tagList[i].tags.length; j++) {
-						if(this.tagList[i].tags[j].tagged) {
-							tagList.push(this.tagList[i].tags[j]);
-							newTagIds.push(this.tagList[i].tags[j].tagId);
-						}
-					}
-				}
-				// 查出被删除的标签
-				for (let k = 0; k < oldTagIds.length; k++) {
-					if(newTagIds.indexOf(oldTagIds[k]) < 0) {
-						delTagIds.push(oldTagIds[k]);
-					}
-				}
-				
-				let params = {
-					unionId: this.unionId,
-					saveTags: this.customTagList,
-					delTags: delTagIds,
-					addTags: tagList
-				}
-				this.$axios({
-					url: '/tag/custom/edit',
-					type: 'application/json',
-					params,
-					isLoading: 1,
-				}).then(res => {
-					this.$successToast('操作成功');
-					setTimeout(() => {
-						uni.$emit('refreshCustomerData');
-						uni.navigateBack({
-							delta: 1
-						})
-					}, 1000)
-				})
-			},
-		}
-	}
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #F4F2F2;
-		padding: 20rpx 20rpx 120rpx;
-		box-sizing: border-box;
-	}
-	.list-container {
-		.item {
-			border-bottom: 1px solid #E5E5E5;
-			.top {
-				.title {
-					font-size: 28rpx;
-					color: #666666;
-					line-height: 70rpx;
-				}
-			}
-			.tags {
-				display: flex;
-				flex-wrap: wrap;
-				.tag {
-					display: flex;
-					align-items: center;
-					justify-content: center;
-					font-size: 24rpx;
-					padding: 0 16rpx;
-					height: 48rpx;
-					line-height: 48rpx;
-					border-radius: 10rpx;
-					margin-right: 20rpx;
-					margin-bottom: 20rpx;
-					background: #ffffff;
-					color: #666666;
-					border: 1px solid #eaeaea;
-					.close {
-						width: 20rpx;
-						height: 20rpx;
-						display: block;
-						margin-left: 20rpx;
-					}
-					&:last-child {
-						margin-right: 0;
-					}
-					&.current {
-						background: #FFD6BB;
-						color: #FE781F;
-						border: 1px solid rgba($color: #FE781F, $alpha: 0.4);
-					}
-					&.add {
-						image {
-							width: 20rpx;
-							height: 20rpx;
-							display: block;
-							margin-right: 10rpx;
-						}
-					}
-				}
-			}
-		}
-	}
-	.global-dialog {
-		.input {
-			display: flex;
-			justify-content: center;
-			margin-bottom: 50rpx;
-			input {
-				width: 500rpx;
-				height: 84rpx;
-				background: #F3F3F3;
-				border-radius: 10rpx;
-				padding: 0 20rpx;
-			}
-		}
-	}
-	.bottom-container {
-		position: fixed;
-		bottom: 0;
-		left: 0;
-		width: 100%;
-		height: 100rpx;
-		background: #FFFFFF;
-		padding: 0 20rpx;
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		box-sizing: border-box;
-		.button {
-			width: 100%;
-			height: 72rpx;
-			text-align: center;
-			line-height: 72rpx;
-			border-radius: 72rpx;
-			background: linear-gradient(-90deg,#ff3f42 0%, #fe781f 100%);
-			font-size: 28rpx;
-			color: #FFFFFF;
-		}
-	}
-</style>
+<template>
+	<view class="app-container">
+		<view class="list-container">
+			<block v-for="(item, index) in tagList" :key='index'>
+				<view class="item">
+					<view class="top">
+						<view class="title">{{item.tagGroupName}}</view>
+					</view>
+					<view class="tags">
+						<block v-for="(it, idx) in item.tags" :key='idx'>
+							<view class="tag" :class="it.tagged ? 'current':''" @tap="changeTag(index, idx)">{{it.tagName}}</view>
+						</block>
+					</view>
+				</view>
+			</block>
+			
+			<view class="item">
+				<view class="top">
+					<view class="title">自定义标签</view>
+				</view>
+				<view class="tags">
+					<block v-for="(item, index) in customTagList" :key='index'>
+						<view class="tag current">{{item}}<image src="@/static/icon/close2.png" class="close" @tap="deleteTag(index)"></image></view>
+					</block>
+					<view class="tag add" @tap="isShowDialog = true"><image src="@/static/icon/add.png"></image>新建标签</view>
+				</view>
+			</view>
+		</view>
+		
+		<view class="bottom-container">
+			<view class="button" @tap="submitForm">保存</view>
+		</view>
+		
+		<view class="global-mask" v-show="isShowDialog"></view>
+		<view class="global-dialog" v-show="isShowDialog" style="top: 40%;">
+			<view class="title">新建标签</view>
+			<view class="input">
+				<input type="text" placeholder="标签名称" v-model="newTagName">
+			</view>
+			<view class="btn">
+				<view class="left" @tap="isShowDialog = false">取消</view>
+				<view class="right" @tap="addTag()">确定</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				unionId: null,
+				tagList: [],
+				customTagList: [],
+				isShowDialog: false,
+				newTagName: '',
+				
+				oldTagIds: [],
+			}
+		},
+		
+		onLoad({unionId}) {
+			this.unionId = unionId;
+			
+			this.getTagList();
+		},
+		
+		methods: {
+			// 获取标签列表
+			getTagList() {
+				this.$axios({
+					url: '/tag/wx/tag/list',
+					method: 'get',
+					params: {
+						unionId: this.unionId
+					},
+				}).then(res => {
+					this.tagList = res.data.tagGroupBeanList;
+					this.customTagList = res.data.tagNameList;
+					
+					for (let i = 0; i < this.tagList.length; i++) {
+						for (let j = 0; j < this.tagList[i].tags.length; j++) {
+							if(this.tagList[i].tags[j].tagged) {
+								this.oldTagIds.push(this.tagList[i].tags[j].tagId);
+							}
+						}
+					}
+					console.log(this.oldTagIds);
+				})
+			},
+			
+			// 新建标签
+			addTag() {
+				if(!this.newTagName) {
+					return this.$toast('请填写标签名称');
+				}
+				this.customTagList.push(this.newTagName);
+				this.newTagName = '';
+				this.isShowDialog = false;
+			},
+			
+			// 删除标签
+			deleteTag(index) {
+				this.customTagList.splice(index, 1);
+			},
+			
+			// 切换标签
+			changeTag(index, idx) {
+				this.tagList[index].tags[idx].tagged = !this.tagList[index].tags[idx].tagged;
+			},
+			
+			// 保存
+			submitForm() {
+				let tagList = [];
+				let oldTagIds = this.oldTagIds;
+				let newTagIds = [];
+				let delTagIds = [];
+				// 查出选中的标签
+				for (let i = 0; i < this.tagList.length; i++) {
+					for (let j = 0; j < this.tagList[i].tags.length; j++) {
+						if(this.tagList[i].tags[j].tagged) {
+							tagList.push(this.tagList[i].tags[j]);
+							newTagIds.push(this.tagList[i].tags[j].tagId);
+						}
+					}
+				}
+				// 查出被删除的标签
+				for (let k = 0; k < oldTagIds.length; k++) {
+					if(newTagIds.indexOf(oldTagIds[k]) < 0) {
+						delTagIds.push(oldTagIds[k]);
+					}
+				}
+				
+				let params = {
+					unionId: this.unionId,
+					saveTags: this.customTagList,
+					delTags: delTagIds,
+					addTags: tagList
+				}
+				this.$axios({
+					url: '/tag/custom/edit',
+					type: 'application/json',
+					params,
+					isLoading: 1,
+				}).then(res => {
+					this.$successToast('操作成功');
+					setTimeout(() => {
+						uni.$emit('refreshCustomerData');
+						uni.navigateBack({
+							delta: 1
+						})
+					}, 1000)
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		padding: 20rpx 20rpx 120rpx;
+		box-sizing: border-box;
+	}
+	.list-container {
+		.item {
+			border-bottom: 1px solid #E5E5E5;
+			.top {
+				.title {
+					font-size: 28rpx;
+					color: #666666;
+					line-height: 70rpx;
+				}
+			}
+			.tags {
+				display: flex;
+				flex-wrap: wrap;
+				.tag {
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					font-size: 24rpx;
+					padding: 0 16rpx;
+					height: 48rpx;
+					line-height: 48rpx;
+					border-radius: 10rpx;
+					margin-right: 20rpx;
+					margin-bottom: 20rpx;
+					background: #ffffff;
+					color: #666666;
+					border: 1px solid #eaeaea;
+					.close {
+						width: 20rpx;
+						height: 20rpx;
+						display: block;
+						margin-left: 20rpx;
+					}
+					&:last-child {
+						margin-right: 0;
+					}
+					&.current {
+						background: #FFD6BB;
+						color: #FE781F;
+						border: 1px solid rgba($color: #FE781F, $alpha: 0.4);
+					}
+					&.add {
+						image {
+							width: 20rpx;
+							height: 20rpx;
+							display: block;
+							margin-right: 10rpx;
+						}
+					}
+				}
+			}
+		}
+	}
+	.global-dialog {
+		.input {
+			display: flex;
+			justify-content: center;
+			margin-bottom: 50rpx;
+			input {
+				width: 500rpx;
+				height: 84rpx;
+				background: #F3F3F3;
+				border-radius: 10rpx;
+				padding: 0 20rpx;
+			}
+		}
+	}
+	.bottom-container {
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		width: 100%;
+		height: 100rpx;
+		background: #FFFFFF;
+		padding: 0 20rpx;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		box-sizing: border-box;
+		.button {
+			width: 100%;
+			height: 72rpx;
+			text-align: center;
+			line-height: 72rpx;
+			border-radius: 72rpx;
+			background: linear-gradient(-90deg,#ff3f42 0%, #fe781f 100%);
+			font-size: 28rpx;
+			color: #FFFFFF;
+		}
+	}
+</style>

pages/mine/discode/list.vue

@@ -0,0 +1,401 @@
+<template>
+	<view class="app-container">
+		<view class="tab-container">
+			<view class="item" :class="tabCurrent === '' ? 'current':''" @tap="changeTab('')">全部({{count.all || 0}})</view>
+			<view class="item" :class="tabCurrent === 0 ? 'current':''" @tap="changeTab(0)">未使用({{count.wsy || 0}})</view>
+			<view class="item" :class="tabCurrent === 1 ? 'current':''" @tap="changeTab(1)">已使用({{count.ysy || 0}})</view>
+		</view>
+		
+		<view class="list-container">
+			<block v-for="(item, index) in dataList" :key='index'>
+				<view class="item">
+					<view class="left">
+						<view class="row">
+							<view class="label">优惠码：</view>
+							<view class="value">{{item.id}}</view>
+							<view class="copy" v-if="item.status == 0" @tap="copy(item.id)">复制</view>
+						</view>
+						<view class="row">
+							<view class="label">生成时间：</view>
+							<view class="value">{{item.bindTime}}</view>
+						</view>
+						<view class="row">
+							<view class="label">有效时间：</view>
+							<view class="value">{{item.startTime | dateToYYmmdd}} 至 {{item.endTime | dateToYYmmdd}}</view>
+						</view>
+						<view class="row" v-if="item.status == 1">
+							<view class="label">使用时间：</view>
+							<view class="value">{{item.useTime}}</view>
+						</view>
+					</view>
+					<view class="right">
+						<view class="status" :class="item.status ? 'on':''">{{item.status ? '已使用':'未使用'}}</view>
+						<view class="price">{{item.amount | numToFixed}}</view>
+					</view> 
+				</view>
+			</block>
+		</view>
+		<no-data v-if="!dataList.length" :showText="'空空如也'"></no-data>
+		<loading-text v-if="dataList.length"  :loading="loading" :noMore="noMore" ></loading-text>
+		
+		<view class="bottom-container">
+			<view class="button" @tap="isCreateDialog = true">生成优惠码</view>
+		</view>
+		
+		<view class="create-dialog" v-show="isCreateDialog">
+			<view class="dialog">
+				<view class="title">生成优惠码</view>
+				<view class="content">
+					<view class="row">
+						<text>优惠金额：</text><input type="digit" v-model="createForm.price" /><text>元</text>
+					</view>
+					<view class="row">
+						<text>有效时间：</text>
+						<radio-group @change="changeDay">
+							<label v-for="(item, index) in days" :key="item.value">
+								<radio style="transform:scale(0.7)" color="#FF3F42" :value="item.value" :checked="item.value == createForm.day" />
+								<view>{{item.name}}</view>
+							</label>
+						</radio-group>
+					</view>
+				</view>
+				<view class="btn">
+					<view class="left" @tap="cancelCreateForm">取消</view>
+					<view class="right" @tap="confirmCreateForm">生成优惠码</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import {mapState} from 'vuex';
+		
+	export default {
+		data() {
+			return {
+				configInfo: uni.getStorageSync('configInfo'),
+				count: {}, // 优惠券数量统计
+				tabCurrent: '', // 当前选择值
+				dataList: [], // 优惠券列表
+				pageNum: 1,
+				pageSize: 8,
+				noMore: false,
+				loading: false,
+				
+				isCreateDialog: false,
+				createForm: {
+					price: '',
+					day: 1,
+				},
+				days: [
+					{value: 1, name: '1天'},
+					{value: 3, name: '3天'},
+					{value: 5, name: '5天'},
+				]
+			}
+		},
+		
+		computed:{
+			...mapState(['userInfo', 'isLogin', 'userId'])
+		},
+		
+		onLoad() {
+			this.getCount();
+			this.getList();
+		},
+		
+		// 下拉刷新
+		onPullDownRefresh() {
+			this.pageNum = 1;
+			this.getList();
+		},
+		
+		// 上拉加载
+		onReachBottom() {
+			this.getList(1);
+		},
+		
+		methods: {
+			getCount() {
+				this.$axios({
+					url: '/exchange/code/count',
+					method: 'get',
+					params: {
+						userId: this.userId
+					},
+				}).then(res => {
+					this.count = res.data;
+				})
+			},
+			
+			getList(loadMore) {
+				if(this.noMore && loadMore)return;
+				this.noMore = false
+				if(!loadMore){
+					this.pageNum = 1;
+				}else{
+					this.loading = true;
+				}
+				this.$axios({
+					url: '/exchange/code/list',
+					method: 'get',
+					params: {
+						pageNo: this.pageNum,
+						pageSize: this.pageSize,
+						status: this.tabCurrent
+					},
+					isLoading: !loadMore
+				}).then(res => { 
+					let _list = res.data.records;
+					let pageTotal = res.data.pages;
+					if(this.pageNum >= pageTotal){
+						this.noMore = true;
+					}
+					if (_list.length) {
+						this.pageNum += 1
+					}
+					if (loadMore) {
+						this.dataList = this.dataList.concat(_list);
+						this.loading = false;
+					} else {
+						this.dataList = _list;
+					}
+					
+					uni.stopPullDownRefresh();
+				})
+			},
+			
+			changeTab(tab) {
+				this.tabCurrent = tab;
+				this.getList();
+			},
+			
+			// 复制
+			copy(val) {
+				uni.setClipboardData({
+				    data: val,
+				    success: () => {
+				        this.$successToast('复制成功');
+				    }
+				});
+			},
+			
+			changeDay(e) {
+				this.createForm.day = e.detail.value;
+			},
+			
+			// 取消表单
+			cancelCreateForm() {
+				this.createForm.price = '';
+				this.createForm.day = 1;
+				this.isCreateDialog = false;
+			},
+			
+			// 提交表单
+			confirmCreateForm() {
+				if(!this.createForm.price) {
+					return this.$toast('请填写优惠金额');
+				}
+				this.$axios({
+					url: '/exchange/code/bind',
+					method: 'post',
+					params: {
+						amount: this.createForm.price,
+						day: this.createForm.day,
+					},
+					isLoading: 1
+				}).then(res => {
+					this.$successToast('生成成功');
+					this.cancelCreateForm();
+					this.getCount();
+					this.getList();
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		padding: 108rpx 20rpx 120rpx;
+		box-sizing: border-box;
+	}
+	.tab-container {
+		position: fixed;
+		top: 0;
+		left: 0;
+		width: 100%;
+		display: flex;
+		background: #FFFFFF;
+		.item {
+			flex: 1;
+			height: 88rpx;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			position: relative;
+			&.current {
+				color: #FF3F42;
+				&::after {
+					content: '';
+					display: block;
+					width: 80rpx;
+					height: 6rpx;
+					background: #FF3F42;
+					position: absolute;
+					bottom: 0;
+					left: 50%;
+					margin-left: -40rpx;
+				}
+			}
+		}
+	}
+	.list-container {
+		.item {
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			padding: 12rpx 20rpx;
+			display: flex;
+			justify-content: space-between;
+			margin-bottom: 20rpx;
+			.left {
+				.row {
+					display: flex;
+					align-items: center;
+					padding: 10rpx 0;
+					.label {
+						font-size: 28rpx;
+						color: #666666;
+						width: 140rpx;
+					}
+					.value {
+						font-size: 28rpx;
+						color: #666666;
+					}
+					.copy {
+						width: 80rpx;
+						height: 40rpx;
+						text-align: center;
+						line-height: 40rpx;
+						border-radius: 8rpx;
+						background: #577BFF;
+						color: #FFFFFF;
+						font-size: 24rpx;
+						margin-left: 16rpx;
+					}
+				}
+			}
+			.right {
+				display: flex;
+				flex-direction: column;
+				justify-content: space-between;
+				align-items: flex-end;
+				padding: 10rpx 0;
+				.status {
+					font-size: 28rpx;
+					color: #666666;
+					&.on {
+						color: #3F9EFF;
+					}
+				}
+				.price {
+					font-size: 36rpx;
+					color: #FE781F;
+				}
+			}
+		}
+	}
+	.bottom-container {
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		width: 100%;
+		padding: 0 20rpx;
+		box-sizing: border-box;
+		display: flex;
+		height: 120rpx;
+		.button {
+			width: 100%;
+			height: 88rpx;
+			line-height: 88rpx;
+			border-radius: 88rpx;
+			text-align: center;
+			font-size: 28rpx;
+			color: #ffffff;
+			background: linear-gradient(-90deg,#ff3f42 0%, #fe781f 100%);
+		}
+	}
+	.create-dialog {
+		position: fixed;
+		top: 0;
+		left: 0;
+		z-index: 999;
+		width: 100%;
+		height: 100%;
+		background: rgba(0, 0, 0, 0.3);
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		.dialog {
+			width: 600rpx;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			overflow: hidden;
+			.title {
+				font-size: 36rpx;
+				font-weight: 500;
+				text-align: center;
+				line-height: 100rpx;
+				padding-bottom: 10rpx;
+			}
+			.content {
+				padding: 20rpx 40rpx;
+				.row {
+					height: 60rpx;
+					display: flex;
+					align-items: center;
+					margin-bottom: 20rpx;
+					font-size: 32rpx;
+					color: #333333;
+					input {
+						width: 260rpx;
+						height: 60rpx;
+						border: 1px solid #E5E5E5;
+						margin-right: 16rpx;
+						padding: 0 12rpx;
+					}
+					::v-deep radio-group {
+						display: flex;
+						align-items: center;
+						label {
+							display: flex;
+							align-items: center;
+							margin-right: 10rpx;
+							font-size: 28rpx;
+						}
+					}
+				}
+			}
+			.btn {
+				border-top: 1px solid #eaeaea;
+				display: flex;
+				&> view {
+					flex: 1;
+					text-align: center;
+					line-height: 100rpx;
+					font-size: 32rpx;
+					&.left {
+						color: #666666;
+					}
+					&.right {
+						color: #FFFFFF;
+						background: #FF3F42;
+					}
+				}
+			}
+		}
+		
+	}
+</style>

pages/mine/discount/detail.vue

@@ -0,0 +1,701 @@
+<template>
+	<view class="app-container">
+		<no-data v-if="isLoading" :showText="'加载中'"></no-data>
+		<no-data v-if="!isLoading && noData" :showText="'加载失败'"></no-data>
+		<block v-if="!isLoading && !noData">
+			<view class="status-container" v-if="detail.orderStatus == 'NOPAY'">待付款，30分钟内未付款将会关闭订单</view>
+			<view class="status-container" v-if="detail.orderStatus == 'DFH'">买家已付款，待卖家发货</view>
+			<view class="status-container" v-if="detail.orderStatus == 'YFH'">卖家已发货，已签收状态将在签收7日后自动确认</view>
+			<view class="status-container" v-if="detail.orderStatus == 'OVER'">已确定收货，7日后将关闭退款通道</view>
+			<view class="status-container" v-if="detail.orderStatus == 'CLOSE'">订单已关闭</view>
+			<view class="status-container" v-if="detail.orderStatus == 'REFUND'">订单售后中</view>
+			<view class="status-container" v-if="detail.orderStatus == 'TIMEOUT'">订单超时未支付</view>
+			
+			<view class="main-container">
+				<view class="address-container card">
+					<view class="icon"><image src="@/static/icon/address.png"></image></view>
+					<view class="right">
+						<view class="name">{{detail.receUserName}}<text>{{detail.recePhone}}</text></view>
+						<view class="address ellipsis-2">{{detail.province}}{{detail.city}}{{detail.area}}{{detail.street}}{{detail.receAddress}}{{detail.houseNo ? detail.houseNo : ''}}</view>
+					</view>
+				</view>
+				
+				<view class="goods-container card">
+					<view class="title">商品信息</view>
+					<block v-for="(item, index) in detail.orderDetails" :key='index'>
+						<view class="item" @tap="toGoodsDetail(item.goodsId)">
+							<image :src="item.imgUrl" mode="aspectFill"></image>
+							<view class="right">
+								<view class="top">
+									<view class="name ellipsis-2">{{item.goodsName}}</view>
+									<view class="des">{{item.goodsSpecValue}}</view>
+								</view>
+								<view class="bottom">
+									<view class="price">￥{{item.price | numToFixed}}</view>
+									<view class="num">x{{item.num}}</view>
+								</view>
+							</view>
+						</view>
+					</block>
+					
+				</view>
+				
+				<view class="peisong-container card">
+					<view class="top">
+						<view class="left">配送方式</view>
+						<view class="right" v-if="detail.freight == 0">快递包邮</view>
+						<view class="right" v-if="detail.freight != 0">快递自费</view>
+					</view>
+					<view class="bottom">
+						<view class="left">买家留言</view>
+						<view class="right">{{detail.buyerMsg}}</view>
+					</view>
+				</view>
+				
+				<view class="peisong-container card">
+					<view class="top">
+						<view class="left">商品金额</view>
+						<view class="right">￥{{detail.totalProductAmount | numToFixed}}</view>
+					</view>
+					<view class="top">
+						<view class="left">运费</view>
+						<view class="right">￥{{detail.freight | numToFixed}}</view>
+					</view>
+					<view class="top">
+						<view class="left">优惠券</view>
+						<view class="right">-￥{{detail.couponValue | numToFixed}}</view>
+					</view>
+					<view class="top" v-if="detail.promotionDiscountRate">
+						<view class="left">折扣优惠</view>
+						<view class="right">-¥{{detail.promotionDiscountAmount | numToFixed}}({{detail.promotionDiscountRate*10}}折)</view>
+					</view>
+				</view>
+				
+				<view class="apply-container">
+					<view class="user-info2">
+						<view class="left">
+							<view class="label">业务员：</view>
+							<view class="value">{{detail.workerName}}/{{detail.workerPhone}}</view>
+						</view>
+						<view class="right">{{detail.promotionApplyStatus | statusFilter2}}</view>
+					</view>
+					
+					<view class="data">
+						<view class="row">
+							<view class="label">订单号：</view>
+							<view class="value">{{detail.orderId}}</view>
+						</view>
+						<view class="row">
+							<view class="label">订单金额：</view>
+							<view class="value">¥{{((detail.promotionApplyAmount*100 + detail.promotionApplyPayAmount*100))/100 | numToFixed}}</view>
+						</view>
+						<view class="row">
+							<view class="label">减免金额：</view>
+							<view class="value">¥{{detail.promotionApplyAmount | numToFixed}}</view>
+						</view>
+						<view class="row">
+							<view class="label">应付金额：</view>
+							<view class="value">¥{{detail.promotionApplyPayAmount | numToFixed}}</view>
+						</view>
+					</view>
+					
+					<template v-if="detail.promotionApplyStatus > 0">
+						<view class="remark" v-if="detail.promotionApplyStatus === 4">
+							<view class="label">备注：</view>
+							<view class="value">在业务员可优惠折扣设置值内，自动审核通过。</view>
+						</view>
+						
+						<view class="remark" v-if="detail.promotionApplyRemark">
+							<view class="label">申请备注：</view>
+							<view class="value">{{detail.promotionApplyRemark}}</view>
+						</view>
+						
+						<view class="remark" v-if="detail.promotionApplyStatus === 3 && detail.promotionApplyRejectRemark">
+							<view class="label">驳回备注：</view>
+							<view class="value">{{detail.promotionApplyRejectRemark}}</view>
+						</view>
+					</template>
+				</view>
+				
+				<!-- 业务员端：未申请且待支付 -->
+				<view class="bottom-container" v-if="!isExamineUser && detail.promotionApplyStatus === 0 && detail.orderStatus === 'NOPAY'">
+					<div class="button red" @tap.stop="toApply()">申请减免金额</div>
+				</view>
+				
+				<!-- 业务员端：已驳回 -->
+				<view class="bottom-container" v-if="!isExamineUser && detail.promotionApplyStatus === 3">
+					<div class="button red" @tap.stop="toApply()">重新申请优惠</div>
+				</view>
+				
+				<!-- 审核端：待审核-->
+				<view class="bottom-container" v-if="isExamineUser && detail.promotionApplyStatus === 1">
+					<div class="button white" @tap.stop="toExamine(false)">不同意</div>
+					<div class="button red" @tap.stop="toExamine(true)">同意</div>
+				</view>
+				
+				<!-- 审核端：已通过未付款 -->
+				<view class="bottom-container" v-if="isExamineUser && detail.promotionApplyStatus === 2 && detail.orderStatus === 'NOPAY'">
+					<view class="button red" @tap="toExamine(false)">驳回</view>
+				</view>
+			</view>
+		</block>
+		
+		<view class="apply-dialog" v-show="isApplyDialog">
+			<view class="dialog">
+				<view class="title">减免金额申请</view>
+				<view class="content">
+					<view class="row">
+						<text>订单金额：¥{{detail.payAmount | numToFixed}}</text>
+					</view>
+					<view class="row">
+						<text>减免金额：</text><input type="digit" v-model="applyForm.amount" /><text></text>
+					</view>
+					<view class="row">
+						<text>应付金额：¥{{((detail.payAmount*100 - applyForm.amount*100)/100) | numToFixed}}</text>
+					</view>
+					<view class="row">
+						<text>备注：</text><input type="text" v-model="applyForm.remark" /><text></text>
+					</view>
+				</view>
+				<view class="btn">
+					<view class="left" @tap="cancelApplyForm">取消</view>
+					<view class="right" @tap="confirmApplyForm">提交</view>
+				</view>
+			</view>
+		</view>
+		
+		<view class="apply-dialog" v-show="isExamineDialog">
+			<view class="dialog">
+				<view class="title">减免金额审核</view>
+				<view class="content">
+					<view class="row">
+						<text>订单金额：¥{{detail.payAmount | numToFixed}}</text>
+					</view>
+					<view class="row">
+						<text>减免金额：¥{{detail.promotionApplyAmount | numToFixed}}</text>
+					</view>
+					<view class="row">
+						<text>应付金额：¥{{detail.promotionApplyPayAmount | numToFixed}}</text>
+					</view>
+					<view class="row">
+						<text>申请备注：{{detail.promotionApplyRemark}}</text>
+					</view>
+					<view class="row">
+						<text>审核备注：</text><input type="text" v-model="examineForm.remark" />
+					</view>
+				</view>
+				<view class="btn">
+					<view class="left" @tap="cancelExamineForm">取消</view>
+					<view class="right" @tap="confirmExamineForm">提交</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import {mapState} from 'vuex';
+	import modalDialog from '@/components/modalDialog.vue';
+	
+	export default {
+		components:{
+			modalDialog
+		},
+		filters: {
+			statusFilter2(val) {
+				const statusMap = {
+					0: '未申请',
+					1: '待审核',
+					2: '已通过',
+					3: '已驳回',
+					4: '自动审核通过',
+				 }
+				 return statusMap[val]
+			},
+		},
+		data() {
+			return {
+				configInfo: uni.getStorageSync('configInfo'),
+				isLoading: true,
+				noData: true,
+				orderId: null, // 订单id
+				orderRefundId: null, // 售后订单id
+				isReturnOrder: false, // 是否售后订单
+				detail: {}, // 订单详情
+				
+				isApplyDialog: false,
+				applyForm: {
+					amount: '',
+					remark: '',
+				},
+				
+				isExamineDialog: false,
+				examineForm: {
+					status: true,
+					remark: '',
+				},
+			}
+		},
+		
+		computed:{
+			...mapState(['userInfo', 'isLogin', 'userId']),
+			
+			isExamineUser() { // 是否审核人员
+				return this.userInfo.promotionApplyExamineby;
+			},
+		},
+		
+		onLoad({orderId, orderRefundId}) {
+			this.orderId = orderId;
+			if(orderRefundId != 'undefined') {
+				this.isReturnOrder = true;
+				this.orderRefundId = orderRefundId;
+			}
+			this.getOrderDetail();
+			
+			uni.$on('refreshOrderDetail',(data) => {
+				if(data) {
+					this.isReturnOrder = true;
+					this.orderRefundId = data;
+				}else {
+					this.isReturnOrder = false;
+					this.orderRefundId = null;
+				}
+				this.getOrderDetail();
+			})
+		},
+		
+		methods: {
+			getOrderDetail() {
+				let url = '', params = {};
+				if(this.isReturnOrder) {
+					url = '/order/refund/detail';
+					params = {
+						orderRefundId: this.orderRefundId
+					}
+				}else {
+					url = '/order/detail';
+					params = {
+						orderId: this.orderId
+					}
+				}
+				this.$axios({
+					url,
+					method: 'get',
+					params
+				}).then(res => {
+					this.noData = false;
+					this.isLoading = false;
+					this.detail = res.data;
+				}).catch(res => {
+					this.noData = true;
+					this.isLoading = false;
+				})
+			},
+			
+			// 去商品详情
+			toGoodsDetail(id) {
+				uni.navigateTo({
+					url: '/packageGoods/pages/detail?id=' + id
+				})
+			},
+			
+			toApply() {
+				this.isApplyDialog = true;
+			},
+			
+			// 取消表单
+			cancelApplyForm() {
+				this.applyForm.amount = '';
+				this.isApplyDialog = false;
+			},
+			
+			// 提交表单
+			confirmApplyForm() {
+				if(!this.applyForm.amount) {
+					return this.$toast('请填写优惠金额');
+				}
+				this.$axios({
+					url: '/promotion/apply/apply',
+					method: 'post',
+					type: 'application/json',
+					params: {
+						orderId: this.detail.orderId,
+						applyAmount: this.applyForm.amount,
+						applyRemark: this.applyForm.remark,
+					},
+					isLoading: 1
+				}).then(res => {
+					this.$successToast('提交成功');
+					this.cancelApplyForm();
+					this.getOrderDetail();
+				})
+			},
+			
+			toExamine(status) {
+				this.examineForm.status = status;
+				this.isExamineDialog = true;
+			},
+			
+			// 取消表单
+			cancelExamineForm() {
+				this.examineForm.remark = '';
+				this.isExamineDialog = false;
+			},
+			
+			// 提交表单
+			confirmExamineForm() {
+				this.$axios({
+					url: '/promotion/apply/examine',
+					method: 'post',
+					params: {
+						orderId: this.detail.orderId,
+						examineReuslt: this.examineForm.status,
+						promotionApplyRejectRemmark: this.examineForm.remark,
+					},
+					isLoading: 1
+				}).then(res => {
+					this.$successToast('提交成功');
+					this.cancelExamineForm();
+					this.getOrderDetail();
+				})
+			},
+			
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		box-sizing: border-box;
+	}
+	.status-container {
+		background: #FE781F;
+		line-height: 80rpx;
+		text-align: center;
+		font-size: 32rpx;
+		color: #FFFFFF;
+	}
+	.card {
+		background: #FFFFFF;
+		border-radius: 20rpx;
+		margin-bottom: 20rpx;
+	}
+	.main-container {
+		padding: 20rpx 20rpx 120rpx;
+	}
+	.address-container {
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		height: 150rpx;
+		padding: 0 20rpx;
+		.icon {
+			width: 52rpx;
+			height: 52rpx;
+			border-radius: 50%;
+			background: linear-gradient(-90deg,#ff4042 0%, #fe781f 100%);
+			display: flex;
+			flex-shrink: 0;
+			justify-content: center;
+			align-items: center;
+			margin-right: 20rpx;
+			image {
+				width: 28rpx;
+				height: 36rpx;
+			}
+		}
+		.right {
+			width: 600rpx;
+			.name {
+				font-size: 32rpx;
+				color: #333333;
+				text {
+					font-size: 28rpx;
+					color: #999999;
+					margin-left: 16rpx;
+				}
+			}
+			.address {
+				font-size: 28rpx;
+				color: #666666;
+				line-height: 34rpx;
+				margin-top: 10rpx;
+			}
+		}
+	}
+	.goods-container {
+		padding: 0 20rpx;
+		.title {
+			font-size: 32rpx;
+			color: #333333;
+			line-height: 32rpx;
+			padding-top: 20rpx;
+		}
+		.item {
+			padding: 20rpx 0;
+			border-bottom: 1px solid #eaeaea;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			&:last-child {
+				border: none;
+			}
+			image {
+				width: 180rpx;
+				height: 180rpx;
+				flex-shrink: 0;
+				margin-right: 20rpx;
+			}
+			.right {
+				width: 470rpx;
+				height: 180rpx;
+				display: flex;
+				flex-direction: column;
+				justify-content: space-between;
+				.top {
+					.name {
+						font-size: 28rpx;
+						color: #333333;
+						line-height: 36rpx;
+					}
+					.des {
+						font-size: 28rpx;
+						color: #999999;
+						margin-top: 10rpx;
+					}
+				}
+				.bottom {
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+					.price {
+						font-size: 28rpx;
+						color: #FF3F42;
+						line-height: 28rpx;
+					}
+					.num {
+						font-size: 28rpx;
+						color: #333333;
+						line-height: 28rpx;
+					}
+				}
+			}
+		}
+	}
+	.peisong-container {
+		padding: 0 20rpx;
+		font-size: 28rpx;
+		color: #333333;
+		.top {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			height: 88rpx;
+			border-bottom: 1px solid #eaeaea;
+		}
+		.bottom {
+			display: flex;
+			align-items: center;
+			min-height: 88rpx;
+			.left {
+				margin-right: 40rpx;
+				flex-shrink: 0;
+			}
+			.right {
+				padding: 10rpx 0;
+				line-height: 32rpx;
+			}
+		}
+	}
+	.apply-container {
+		background: #FFFFFF;
+		border-radius: 20rpx;
+		padding: 20rpx;
+		.user-info {
+			height: 70rpx;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			padding: 10rpx 0;
+			.left {
+				display: flex;
+				align-items: center;
+				.head {
+					display: block;
+					width: 60rpx;
+					height: 60rpx;
+					border-radius: 50%;
+				}
+				.user {
+					font-size: 24rpx;
+					color: #333333;
+					line-height: 30rpx;
+					margin-left: 10rpx;
+				}
+			}
+			.right {
+				font-size: 28rpx;
+				color: #FE781F;
+			}
+		}
+		.user-info2 {
+			height: 48rpx;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			.left {
+				display: flex;
+				align-items: center;
+				line-height: 48rpx;
+				.label {
+					width: 128rpx;
+					font-size: 26rpx;
+					color: #999999;
+				}
+				.value {
+					flex: 1;
+					font-size: 28rpx;
+					color: #666666;
+				}
+			}
+			.right {
+				font-size: 28rpx;
+				color: #FE781F;
+			}
+		}
+		.data {
+			.row {
+				display: flex;
+				align-items: center;
+				line-height: 48rpx;
+				.label {
+					width: 128rpx;
+					font-size: 26rpx;
+					color: #999999;
+				}
+				.value {
+					flex: 1;
+					font-size: 28rpx;
+					color: #666666;
+				}
+			}
+		}
+		.remark	{
+			font-size: 26rpx;
+			color: #999999;
+			display: flex;
+			padding: 6rpx 0;
+			.label {
+				flex-shrink: 0;
+				line-height: 36rpx;
+			}
+			.value {
+				flex: 1;
+				line-height: 36rpx;
+			}
+		}
+	}
+	.bottom-container {
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		width: 100%;
+		padding: 0 20rpx;
+		box-sizing: border-box;
+		height: 100rpx;
+		display: flex;
+		justify-content: flex-end;
+		align-items: center;
+		background: #FFFFFF;
+		border-top: 1px solid #F4F2F2;
+		.button {
+			width: 150rpx;
+			height: 56rpx;
+			border-radius: 56rpx;
+			text-align: center;
+			line-height: 56rpx;
+			font-size: 28rpx;
+			margin-left: 15rpx;
+			&:first-child {
+				margin-left: 0;
+			}
+			&.gray {
+				color: #999999;
+				border: 1px solid #999999;
+			}
+			&.white {
+				color: #FF3F42;
+				border: 1px solid #FF3F42;
+			}
+			&.red {
+				color: #FFFFFF;
+				border: 1px solid #FF3F42;
+				background: #FF3F42;
+			}
+		}
+	}
+	.apply-dialog {
+		position: fixed;
+		top: 0;
+		left: 0;
+		z-index: 9999;
+		width: 100%;
+		height: 100%;
+		background: rgba(0, 0, 0, 0.3);
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		.dialog {
+			width: 600rpx;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			overflow: hidden;
+			.title {
+				font-size: 36rpx;
+				font-weight: 500;
+				text-align: center;
+				line-height: 100rpx;
+				padding-bottom: 10rpx;
+			}
+			.content {
+				padding: 0 40rpx 30rpx;
+				.row {
+					height: 50rpx;
+					display: flex;
+					align-items: center;
+					margin-bottom: 10rpx;
+					font-size: 28rpx;
+					color: #333333;
+					input {
+						flex: 1;
+						height: 50rpx;
+						border: 1px solid #E5E5E5;
+						margin-right: 16rpx;
+						padding: 0 12rpx;
+						font-size: 28rpx;
+					}
+				}
+			}
+			.btn {
+				border-top: 1px solid #eaeaea;
+				display: flex;
+				&> view {
+					flex: 1;
+					text-align: center;
+					line-height: 100rpx;
+					font-size: 32rpx;
+					&.left {
+						color: #666666;
+					}
+					&.right {
+						color: #FFFFFF;
+						background: #FF3F42;
+					}
+				}
+			}
+		}
+		
+	}
+</style>

pages/mine/discount/list.vue

@@ -0,0 +1,636 @@
+<template>
+	<view class="app-container">
+		<view class="tab-container">
+			<view class="item" :class="tabCurrent === 100 ? 'current':''" @tap="changeTab(100)">全部</view>
+			<view class="item" :class="tabCurrent === 1 ? 'current':''" @tap="changeTab(1)">待审核</view>
+			<view class="item" :class="tabCurrent === 2 ? 'current':''" @tap="changeTab(2)">已通过</view>
+			<view class="item" :class="tabCurrent === 3 ? 'current':''" @tap="changeTab(3)">已驳回</view>
+		</view>
+		
+		<view class="list-container">
+			<block v-for="(item, index) in dataList" :key='index'>
+				<view class="item" @tap="toOrderDetail(item.orderId, item.orderRefundId)">
+					
+					<view class="user-info">
+						<view class="left">
+							<image :src="configInfo.minLogo3" mode="aspectFill" class="head"></image>
+							<view class="user">
+								<view>{{item.userName}}</view>
+								<view>{{item.phone}}</view>
+							</view>
+						</view>
+						<view class="right">{{item.orderStatus | statusFilter}}</view>
+					</view>
+					
+					<view class="goods_list">
+						<block v-for="(goodsItem, goodsIndex) in item.orderDetails" :key='goodsIndex'>
+							<view class="goods" :class="'goods'+goodsIndex">
+								<image :src="goodsItem.imgUrl" mode="aspectFill"></image>
+								<view class="main">
+									<view class="row1">
+										<view class="name ellipsis-2">{{goodsItem.goodsName}}</view>
+										<view class="price">￥{{goodsItem.price}}</view>
+									</view>
+									<view class="row2">
+										<view>{{goodsItem.goodsSpecValue}}</view>
+										<view>x{{goodsItem.num}}</view>
+									</view>
+								</view>
+							</view>
+						</block>
+					</view>
+					
+					<view class="user-info2" v-if="item.promotionApplyStatus > 0">
+						<view class="left">
+							<view class="label">业务员：</view>
+							<view class="value">{{item.workerName}}/{{item.workerPhone}}</view>
+						</view>
+						<view class="right">{{item.promotionApplyStatus | statusFilter2}}</view>
+					</view>
+					
+					<view class="data">
+						<view class="row">
+							<view class="label">订单号：</view>
+							<view class="value">{{item.orderId}}</view>
+						</view>
+						<view class="row">
+							<view class="label">订单金额：</view>
+							<view class="value">¥{{((item.promotionApplyAmount*100 + item.promotionApplyPayAmount*100))/100 | numToFixed}}</view>
+						</view>
+						<view class="row">
+							<view class="label">减免金额：</view>
+							<view class="value">¥{{item.promotionApplyAmount | numToFixed}}</view>
+						</view>
+						<view class="row">
+							<view class="label">应付金额：</view>
+							<view class="value">¥{{item.promotionApplyPayAmount | numToFixed}}</view>
+						</view>
+					</view>
+					
+					<template v-if="item.promotionApplyStatus > 0">
+						<view class="remark" v-if="item.promotionApplyStatus === 4">
+							<view class="label">备注：</view>
+							<view class="value">在业务员可优惠折扣设置值内，自动审核通过。</view>
+						</view>
+						
+						<view class="remark" v-if="item.promotionApplyRemark">
+							<view class="label">申请备注：</view>
+							<view class="value">{{item.promotionApplyRemark}}</view>
+						</view>
+						
+						<view class="remark" v-if="item.promotionApplyStatus === 3 && item.promotionApplyRejectRemark">
+							<view class="label">驳回备注：</view>
+							<view class="value">{{item.promotionApplyRejectRemark}}</view>
+						</view>
+					</template>
+					
+					<!-- 业务员端：未申请且待支付 -->
+					<view class="btn-group" v-if="!isExamineUser && item.promotionApplyStatus === 0 && item.orderStatus === 'NOPAY'">
+						<div class="button red" @tap.stop="toApply(item)">申请减免金额</div>
+					</view>
+					
+					<!-- 业务员端：已驳回 -->
+					<view class="btn-group" v-if="!isExamineUser && item.promotionApplyStatus === 3">
+						<div class="button red" @tap.stop="toApply(item)">重新申请优惠</div>
+					</view>
+					
+					<!-- 审核端：待审核 -->
+					<view class="btn-group" v-if="isExamineUser && item.promotionApplyStatus === 1">
+						<div class="button white" @tap.stop="toExamine(item, false)">不同意</div>
+						<div class="button red" @tap.stop="toExamine(item, true)">同意</div>
+					</view>
+					
+					<!-- 审核端：已通过未付款 -->
+					<view class="btn-group" v-if="isExamineUser && item.promotionApplyStatus === 2 && item.orderStatus === 'NOPAY'">
+						<div class="button red" @tap.stop="toExamine(item, false)">驳回</div>
+					</view>
+				</view>
+			</block>
+		</view>
+		<no-data v-if="!dataList.length" :showText="'空空如也'"></no-data>
+		<loading-text v-if="dataList.length"  :loading="loading" :noMore="noMore" ></loading-text>
+		
+		<view class="apply-dialog" v-show="isApplyDialog">
+			<view class="dialog">
+				<view class="title">减免金额申请</view>
+				<view class="content">
+					<view class="row">
+						<text>订单金额：¥{{applyItem.payAmount | numToFixed}}</text>
+					</view>
+					<view class="row">
+						<text>减免金额：</text><input type="digit" v-model="applyForm.amount" /><text></text>
+					</view>
+					<view class="row">
+						<text>应付金额：¥{{((applyItem.payAmount*100 - applyForm.amount*100)/100) | numToFixed}}</text>
+					</view>
+					<view class="row">
+						<text>备注：</text><input type="text" v-model="applyForm.remark" /><text></text>
+					</view>
+				</view>
+				<view class="btn">
+					<view class="left" @tap="cancelApplyForm">取消</view>
+					<view class="right" @tap="confirmApplyForm">提交</view>
+				</view>
+			</view>
+		</view>
+		
+		<view class="apply-dialog" v-show="isExamineDialog">
+			<view class="dialog">
+				<view class="title">减免金额审核</view>
+				<view class="content">
+					<view class="row">
+						<text>订单金额：¥{{examineItem.payAmount | numToFixed}}</text>
+					</view>
+					<view class="row">
+						<text>减免金额：¥{{examineItem.promotionApplyAmount | numToFixed}}</text>
+					</view>
+					<view class="row">
+						<text>应付金额：¥{{examineItem.promotionApplyPayAmount | numToFixed}}</text>
+					</view>
+					<view class="row">
+						<text>申请备注：{{examineItem.promotionApplyRemark}}</text>
+					</view>
+					<view class="row">
+						<text>审核备注：</text><input type="text" v-model="examineForm.remark" />
+					</view>
+				</view>
+				<view class="btn">
+					<view class="left" @tap="cancelExamineForm">取消</view>
+					<view class="right" @tap="confirmExamineForm">提交</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import {mapState} from 'vuex';
+		
+	export default {
+		filters: {
+			statusFilter(val) {
+				const statusMap = {
+					NOPAY: '待付款',
+					DFH: '待发货',
+					YFH: '待收货',
+					OVER: '已完成',
+					CLOSE: '已关闭',
+					REFUND: '售后中',
+					TIMEOUT: '超时未支付'
+				 }
+				 return statusMap[val]
+			},
+			statusFilter2(val) {
+				const statusMap = {
+					0: '未申请',
+					1: '待审核',
+					2: '已通过',
+					3: '已驳回',
+					4: '自动审核通过',
+				 }
+				 return statusMap[val]
+			},
+		},
+		data() {
+			return {
+				configInfo: uni.getStorageSync('configInfo'),
+				tabCurrent: 100, // 当前选择值
+				dataList: [], // 优惠券列表
+				pageNum: 1,
+				pageSize: 8,
+				noMore: false,
+				loading: false,
+				
+				isApplyDialog: false,
+				applyItem: {},
+				applyForm: {
+					amount: '',
+					remark: '',
+				},
+				
+				isExamineDialog: false,
+				examineItem: {},
+				examineForm: {
+					status: true,
+					remark: '',
+				},
+			}
+		},
+		
+		computed:{
+			...mapState(['userInfo', 'isLogin', 'userId']),
+			
+			isExamineUser() { // 是否审核人员
+				return this.userInfo.promotionApplyExamineby;
+			},
+		},
+		
+		onLoad() {
+			this.getList();
+			uni.setNavigationBarTitle({
+			　　title: '用户减免金额' + (this.isExamineUser ? '审核':'申请')
+			})
+		},
+		
+		// 下拉刷新
+		onPullDownRefresh() {
+			this.pageNum = 1;
+			this.getList();
+		},
+		
+		// 上拉加载
+		onReachBottom() {
+			this.getList(1);
+		},
+		
+		methods: {
+			getList(loadMore) {
+				if(this.noMore && loadMore)return;
+				this.noMore = false
+				if(!loadMore){
+					this.pageNum = 1;
+				}else{
+					this.loading = true;
+				}
+				this.$axios({
+					url: '/order/my/order',
+					method: 'get',
+					params: {
+						pageNo: this.pageNum,
+						pageSize: this.pageSize,
+						promotionApplyStatus: this.tabCurrent,
+						userId: this.userId
+					},
+					isLoading: !loadMore
+				}).then(res => { 
+					let _list = res.data.records;
+					let pageTotal = res.data.pages;
+					if(this.pageNum >= pageTotal){
+						this.noMore = true;
+					}
+					if (_list.length) {
+						this.pageNum += 1
+					}
+					if (loadMore) {
+						this.dataList = this.dataList.concat(_list);
+						this.loading = false;
+					} else {
+						this.dataList = _list;
+					}
+					
+					uni.stopPullDownRefresh();
+				})
+			},
+			
+			changeTab(tab) {
+				this.tabCurrent = tab;
+				this.getList();
+			},
+			
+			// 去订单详情
+			toOrderDetail(orderId, orderRefundId) {
+				uni.navigateTo({
+					url:'/pages/mine/discount/detail?orderId=' + orderId + '&orderRefundId=' + orderRefundId
+				})
+			},
+			
+			toApply(item) {
+				this.applyItem = item;
+				this.isApplyDialog = true;
+			},
+			
+			// 取消表单
+			cancelApplyForm() {
+				this.applyForm.amount = '';
+				this.isApplyDialog = false;
+			},
+			
+			// 提交表单
+			confirmApplyForm() {
+				if(!this.applyForm.amount) {
+					return this.$toast('请填写优惠金额');
+				}
+				this.$axios({
+					url: '/promotion/apply/apply',
+					method: 'post',
+					type: 'application/json',
+					params: {
+						orderId: this.applyItem.orderId,
+						applyAmount: this.applyForm.amount,
+						applyRemark: this.applyForm.remark,
+					},
+					isLoading: 1
+				}).then(res => {
+					this.$successToast('提交成功');
+					this.cancelApplyForm();
+					this.getList();
+				})
+			},
+			
+			toExamine(item, status) {
+				this.examineForm.status = status;
+				this.examineItem = item;
+				this.isExamineDialog = true;
+			},
+			
+			// 取消表单
+			cancelExamineForm() {
+				this.examineForm.remark = '';
+				this.isExamineDialog = false;
+			},
+			
+			// 提交表单
+			confirmExamineForm() {
+				this.$axios({
+					url: '/promotion/apply/examine',
+					method: 'post',
+					params: {
+						orderId: this.examineItem.orderId,
+						examineReuslt: this.examineForm.status,
+						promotionApplyRejectRemmark: this.examineForm.remark,
+					},
+					isLoading: 1
+				}).then(res => {
+					this.$successToast('提交成功');
+					this.cancelExamineForm();
+					this.getList();
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		padding: 108rpx 20rpx 0;
+		box-sizing: border-box;
+	}
+	.tab-container {
+		position: fixed;
+		top: 0;
+		left: 0;
+		width: 100%;
+		display: flex;
+		background: #FFFFFF;
+		.item {
+			flex: 1;
+			height: 88rpx;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			position: relative;
+			&.current {
+				color: #FF3F42;
+				&::after {
+					content: '';
+					display: block;
+					width: 80rpx;
+					height: 6rpx;
+					background: #FF3F42;
+					position: absolute;
+					bottom: 0;
+					left: 50%;
+					margin-left: -40rpx;
+				}
+			}
+		}
+	}
+	.list-container {
+		.item {
+			margin-bottom: 20rpx;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			padding: 0 20rpx 10rpx;
+			.user-info {
+				height: 70rpx;
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				padding: 10rpx 0;
+				.left {
+					display: flex;
+					align-items: center;
+					.head {
+						display: block;
+						width: 60rpx;
+						height: 60rpx;
+						border-radius: 50%;
+					}
+					.user {
+						font-size: 24rpx;
+						color: #333333;
+						line-height: 30rpx;
+						margin-left: 10rpx;
+					}
+				}
+				.right {
+					font-size: 28rpx;
+					color: #FE781F;
+				}
+			}
+			.user-info2 {
+				height: 48rpx;
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				.left {
+					display: flex;
+					align-items: center;
+					line-height: 48rpx;
+					.label {
+						width: 128rpx;
+						font-size: 26rpx;
+						color: #999999;
+					}
+					.value {
+						flex: 1;
+						font-size: 28rpx;
+						color: #666666;
+					}
+				}
+				.right {
+					font-size: 28rpx;
+					color: #FE781F;
+				}
+			}
+			.goods_list {
+				border-top: 1px solid #eaeaea;
+				border-bottom: 1px solid #eaeaea;
+				padding: 10rpx 0;
+				margin-bottom: 10rpx;
+			}
+			.goods {
+				display: flex;
+				justify-content: space-between;
+				padding: 10rpx 0;
+				image {
+					width: 140rpx;
+					height: 140rpx;
+					display: block;
+					flex-shrink: 0;
+					margin-right: 20rpx;
+				}
+				.main {
+					width: 510rpx;
+					.row1 {
+						display: flex;
+						justify-content: space-between;
+						.name {
+							font-size: 28rpx;
+							line-height: 36rpx;
+						}
+						.price {
+							font-size: 28rpx;
+							margin-left: 20rpx;
+							color: #666666;
+						}
+					}
+					.row2 {
+						display: flex;
+						justify-content: space-between;
+						font-size: 28rpx;
+						color: #999999;
+						margin-top: 10rpx;
+					}
+				}
+			}
+			.data {
+				.row {
+					display: flex;
+					align-items: center;
+					line-height: 48rpx;
+					.label {
+						width: 128rpx;
+						font-size: 26rpx;
+						color: #999999;
+					}
+					.value {
+						flex: 1;
+						font-size: 28rpx;
+						color: #666666;
+					}
+				}
+			}
+			.remark	{
+				font-size: 26rpx;
+				color: #999999;
+				display: flex;
+				padding: 6rpx 0;
+				.label {
+					flex-shrink: 0;
+					line-height: 36rpx;
+				}
+				.value {
+					flex: 1;
+					line-height: 36rpx;
+				}
+			}
+			.btn-group {
+				height: 68rpx;
+				display: flex;
+				justify-content: flex-end;
+				align-items: center;
+				&.btn-group2 {
+					justify-content: space-between;
+					.tips {
+						font-size: 28rpx;
+						color: #FF3F42;
+					}
+					.btns {
+						display: flex;
+					}
+				}
+				.button {
+					height: 48rpx;
+					border-radius: 48rpx;
+					text-align: center;
+					line-height: 48rpx;
+					font-size: 24rpx;
+					margin-left: 20rpx;
+					flex-shrink: 0;
+					padding: 0 20rpx;
+					min-width: 76rpx;
+					&:first-child {
+						margin-left: 0;
+					}
+					&.gray {
+						color: #999999;
+						border: 1px solid #999999;
+					}
+					&.white {
+						color: #FF3F42;
+						border: 1px solid #FF3F42;
+					}
+					&.red {
+						color: #FFFFFF;
+						border: 1px solid #FF3F42;
+						background: #FF3F42;
+					}
+				}
+			}
+		}
+	}
+	.apply-dialog {
+		position: fixed;
+		top: 0;
+		left: 0;
+		z-index: 9999;
+		width: 100%;
+		height: 100%;
+		background: rgba(0, 0, 0, 0.3);
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		.dialog {
+			width: 600rpx;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			overflow: hidden;
+			.title {
+				font-size: 36rpx;
+				font-weight: 500;
+				text-align: center;
+				line-height: 100rpx;
+				padding-bottom: 10rpx;
+			}
+			.content {
+				padding: 0 40rpx 30rpx;
+				.row {
+					height: 50rpx;
+					display: flex;
+					align-items: center;
+					margin-bottom: 10rpx;
+					font-size: 28rpx;
+					color: #333333;
+					input {
+						flex: 1;
+						height: 50rpx;
+						border: 1px solid #E5E5E5;
+						margin-right: 16rpx;
+						padding: 0 12rpx;
+						font-size: 28rpx;
+					}
+				}
+			}
+			.btn {
+				border-top: 1px solid #eaeaea;
+				display: flex;
+				&> view {
+					flex: 1;
+					text-align: center;
+					line-height: 100rpx;
+					font-size: 32rpx;
+					&.left {
+						color: #666666;
+					}
+					&.right {
+						color: #FFFFFF;
+						background: #FF3F42;
+					}
+				}
+			}
+		}
+		
+	}
+</style>

pages/mine/exchange/detail.vue

@@ -0,0 +1,153 @@
+<template>
+	<view class="app-container">
+		<div v-if="detail">
+			<view class="title">兑换码</view>
+			<view class="num">{{code}}</view>
+			<view class="row">
+				<view class="label">活动名称</view>
+				<view class="value">{{detail.name}}</view>
+			</view>
+			<view class="row">
+				<view class="label">奖品</view>
+				<view class="value">{{detail.couponName}}</view>
+			</view>
+			<view class="row">
+				<view class="label">活动有效期</view>
+				<view class="value">{{detail.startTime | dateToYYmmdd}} 至 {{detail.endTime | dateToYYmmdd}}</view>
+			</view>
+			<view class="row">
+				<view class="label">使用有效期</view>
+				<view class="value">{{detail.useStartTime | dateToYYmmdd}} 至 {{detail.useEndTime | dateToYYmmdd}}</view>
+			</view>
+			<view class="row" v-if="detail.couponType == 'SATISFY'">
+				<view class="label">使用条件</view>
+				<view class="value">购物订单满 {{detail.orderLimitAmount}}元</view>
+			</view>
+			<view class="row">
+				<view class="label">是否兑换</view>
+				<view class="value">{{detail.status ? '是':'否'}}</view>
+			</view>
+			<view class="row">
+				<view class="label">兑换时间</view>
+				<view class="value">{{detail.userExchangeTime || '-'}}</view>
+			</view>
+			<view class="row">
+				<view class="label">是否使用</view>
+				<view class="value">{{detail.use ? '是':'否'}}</view>
+			</view>
+			<view class="row">
+				<view class="label">使用时间</view>
+				<view class="value">{{detail.useTime || '-'}}</view>
+			</view>
+			<view class="row">
+				<view class="label">使用说明</view>
+				<view class="value">{{detail.useRemark || '-'}}</view>
+			</view>
+			<view class="row">
+				<view class="label">活动说明</view>
+				<view class="value">{{detail.remark || '-'}}</view>
+			</view>
+		</div>
+		
+		<view class="btn-container" v-if="type == 1">
+			<view class="btn" @tap="backPage">继续兑换</view>
+		</view>
+		
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				type: null,
+				code: null,
+				detail: null,
+			}
+		},
+		
+		onLoad({type, code}) {
+			this.type = type;
+			this.code = code;
+			this.getDetail();
+		},
+		
+		methods: {
+			getDetail() {
+				this.$axios({
+					url: '/promotion/luck/draw/detail',
+					method: 'post',
+					params: {
+						code: this.code
+					}
+				}).then(res => {
+					this.detail = res.data;
+				})
+			},
+			
+			backPage() {
+				uni.navigateBack({
+				    delta: 1
+				});
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		display: flex;
+		flex-direction: column;
+		padding: 30rpx 30rpx 140rpx;
+		box-sizing: border-box;
+		.title {
+			font-size: 32rpx;
+			color: #999999;
+		}
+		.num {
+			border: 1px solid #eaeaea;
+			height: 80rpx;
+			line-height: 80rpx;
+			padding: 0 30rpx;
+			text-align: center;
+			font-size: 36rpx;
+			margin-top: 12rpx;
+			font-weight: 600;
+		}
+		.row {
+			display: flex;
+			justify-content: space-between;
+			margin-top: 25rpx;
+			.label {
+				color: #999999;
+				flex-shrink: 0;
+				width: 160rpx;
+			}
+			.value {
+				color: #333333;
+			}
+		}
+	}
+	
+	.btn-container {
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		width: 100%;
+		background: #ffffff;
+		padding: 20rpx;
+		box-sizing: border-box;
+		z-index: 99;
+		box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .3), 0 2px 5px 0 rgba(0, 0, 0, .3);
+		.btn {
+			height: 80rpx;
+			width: 100%;
+			text-align: center;
+			line-height: 80rpx;
+			border-radius: 80rpx;
+			background: #FF3F42;
+			font-size: 30rpx;
+			color: #ffffff;
+		}
+	}
+</style>

pages/mine/exchange/index.vue

@@ -0,0 +1,91 @@
+<template>
+	<view class="app-container">
+		<view class="title">兑换码</view>
+		<input type="text" placeholder="请输入" class="input" placeholder-style="font-weight: 400; color: #999999" v-model="code" />
+		<view class="button" @click="submitExchange()">立即兑换</view>
+		<view class="text">注：您所兑换的兑换码，是您参与本平台的相关活动所获取的兑换码</view>
+		<view class="link">
+			<text @tap="toList()">历史兑换记录&gt;&gt;</text>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				code: '',
+			}
+		},
+		
+		methods: {
+			submitExchange() {
+				this.$axios({
+					url: '/promotion/luck/draw/exchange',
+					method: 'post',
+					params: {
+						code: this.code
+					}
+				}).then(res => {
+					this.$successToast('兑换成功');
+					setTimeout(() => {
+						uni.navigateTo({
+							url: '/pages/mine/exchange/detail?type=1&code=' + this.code
+						})
+						this.code = '';
+					}, 1000)
+				})
+			},
+			
+			toList() {
+				uni.navigateTo({
+					url: '/pages/mine/exchange/list'
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		display: flex;
+		flex-direction: column;
+		padding: 30rpx;
+		box-sizing: border-box;
+		.title {
+			font-size: 32rpx;
+			color: #999999;
+		}
+		.input {
+			border: 1px solid #eaeaea;
+			height: 80rpx;
+			padding: 0 30rpx;
+			text-align: center;
+			font-size: 36rpx;
+			margin-top: 12rpx;
+			font-weight: 600;
+		}
+		.button {
+			height: 69rpx;
+			text-align: center;
+			line-height: 69rpx;
+			background: #fb5152;
+			border-radius: 10rpx;
+			font-size: 28rpx;
+			color: #ffffff;
+			margin-top: 60rpx;
+		}
+		.text {
+			font-size: 24rpx;
+			color: #666666;
+			margin-top: 20rpx;
+		}
+		.link {
+			text-align: right;
+			margin-top: 10rpx;
+			text {
+				color: #fb5152;
+			}
+		}
+	}
+</style>

pages/mine/exchange/list.vue

@@ -0,0 +1,122 @@
+<template>
+	<view class="app-container">
+		<view class="list-container">
+			<block v-for="(item, index) in dataList" :key='index'>
+				<view class="item" @tap="toDetail(item.code)">
+					<view class="num">{{item.code}}</view>
+					<view class="date">兑换时间：{{item.userExchangeTime}}</view>
+				</view>
+			</block>
+		</view>
+		<no-data v-if="!dataList.length" :showText="'暂无数据'"></no-data>
+		<loading-text v-if="dataList.length"  :loading="loading" :noMore="noMore" ></loading-text>
+		
+	</view>
+</template>
+
+<script>
+	import {mapState} from 'vuex';
+	import EventBus from '@/utils/eventbus.js';
+	
+	export default {
+		data() {
+			return {
+				pageNum: 1,
+				pageSize: 8,
+				dataList: [],
+				noMore: false,
+				loading: false,
+			}
+		},
+		computed:{
+			...mapState(['userInfo', 'isLogin', 'userId'])
+		},
+		
+		onLoad() {
+			this.getList();
+		},
+		
+		// 下拉刷新
+		onPullDownRefresh() {
+			this.pageNum = 1;
+			this.getList();
+		},
+		
+		// 上拉加载
+		onReachBottom() {
+			this.getList(1);
+		},
+		
+		methods: {
+			// 获取列表
+			getList(loadMore) {
+				if(this.noMore && loadMore)return;
+				this.noMore = false
+				if(!loadMore){
+					this.pageNum = 1;
+				}else{
+					this.loading = true;
+				}
+				this.$axios({
+					url: '/promotion/luck/draw/list',
+					method: 'post',
+					params: {
+						pageNum: this.pageNum,
+						pageSize: this.pageSize
+					},
+					isLoading: !loadMore
+				}).then(res => { 
+					let _list = res.data.records;
+					let pageTotal = res.data.pages;
+					if(this.pageNum >= pageTotal){
+						this.noMore = true;
+					}
+					if (_list.length) {
+						this.pageNum += 1
+					}
+					if (loadMore) {
+						this.dataList = this.dataList.concat(_list);
+						this.loading = false;
+					} else {
+						this.dataList = _list;
+					}
+					
+					uni.stopPullDownRefresh();
+				})
+			},
+			
+			toDetail(code) {
+				uni.navigateTo({
+					url: '/pages/mine/exchange/detail?code=' + code
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		padding: 20rpx;
+		padding-bottom: 250rpx;
+		box-sizing: border-box;
+	}
+	.list-container {
+		.item {
+			border-radius: 20rpx;
+			background: #ffffff;
+			margin-bottom: 20rpx;
+			padding: 20rpx 30rpx;
+			.num {
+				font-size: 32rpx;
+				color: #333333;
+				font-weight: 500;
+			}
+			.date {
+				font-size: 24rpx;
+				color: #999999;
+				margin-top: 10rpx;
+			}
+		}
+	}
+</style>

pages/mine/groupbuy/list.vue

@@ -0,0 +1,884 @@
+<template>
+  <view class="app-container">
+    <view class="fixed-container">
+      <view class="top-container">
+        <scroll-view
+          :scroll-x="true"
+          :scroll-left="scrollLeft"
+          scroll-with-animation
+          :show-scrollbar="false"
+          class="tabs-view"
+          ref="tabs-view"
+        >
+          <view class="tab">
+            <block v-for="(item, index) in tabList" :key="index">
+              <view
+                class="item"
+                :ref="`tabs-item-${index}`"
+                :class="[
+                  `tabs-item-${index}`,
+                  item.categoryId == tabCurrent ? 'current' : '',
+                ]"
+                @tap="changeTab(item.categoryId)"
+                >{{ item.name }}</view
+              >
+            </block>
+          </view>
+        </scroll-view>
+      </view>
+      <view class="search-container">
+        <view class="search">
+          <image src="/static/icon/search.png" class=""></image>
+          <input
+            type="text"
+            confirm-type="search"
+            placeholder="搜索商品名称"
+            v-model="keyword"
+            @confirm="searchSubmit"
+          />
+        </view>
+      </view>
+    </view>
+
+    <view class="banner-container" v-if="bannerUrl">
+      <image :src="bannerUrl" mode="widthFix"></image>
+    </view>
+
+    <view class="list-container">
+      <block v-for="(item, index) in dataList" :key="index">
+        <div class="item" @tap="toGoodsDetail(item.goodsId)">
+          <image :src="item.goodsImgSrc" mode="aspectFill"></image>
+          <view class="right">
+            <view class="title ellipsis-2">{{ item.goodsName }}</view>
+            <view class="des ellipsis-2">{{
+              item.describeText ? item.describeText : ''
+            }}</view>
+            <view class="stock-sales">
+              <view class="stock">
+                <text>剩余{{ item.stock }}件</text>
+                <view class="progress-box">
+                  <!-- 库存 / 总数 * 100 = 剩余百分比 -->
+                  <progress
+                    :percent="(item.stock / (item.stock + 100)) * 100"
+                    activeColor="#FF3F42"
+                    active
+                    stroke-width="6"
+                  />
+                </view>
+              </view>
+              <view class="sales">销量：{{ item.saleNum || '0' }}</view>
+            </view>
+            <view class="bottom">
+              <view class="price">
+                <view class="price-1">¥{{ item.groupPrice | numToFixed }}</view>
+                <view class="price-2"
+                  >¥{{ item.orgGoodsPrice | numToFixed }}</view
+                >
+              </view>
+              <view class="btn">去拼团</view>
+            </view>
+          </view>
+        </div>
+      </block>
+    </view>
+    <no-data v-if="!dataList.length" :showText="'暂无数据'"></no-data>
+    <loading-text
+      v-if="dataList.length"
+      :loading="loading"
+      :noMore="noMore"
+    ></loading-text>
+
+    <view
+      class="share-container"
+      :style="{ top: top + 'px' }"
+      v-if="dataList.length"
+    >
+      <button @tap="clickShare">
+        <image src="@/static/icon/share.png"></image>
+        <text>分享</text>
+      </button>
+    </view>
+
+    <view
+      class="global-mask"
+      v-show="isShareDialog"
+      @tap="isShareDialog = false"
+    ></view>
+    <view class="sharelist-container" v-show="isShareDialog">
+      <button class="item" open-type="share" @tap="isShareDialog = false">
+        <image src="@/static/icon/wechat.png"></image>
+        <text>分享给微信好友</text>
+      </button>
+
+      <view class="item" @tap="markImage">
+        <image src="@/static/icon/image.png"></image>
+        <text>生成图片分享</text>
+      </view>
+    </view>
+
+    <view class="global-mask" v-show="isShowCanvas" @tap="closeCanvas"></view>
+    <view class="canvas-container" v-show="isShowCanvas">
+      <view class="content">
+        <canvas
+          style="width: 340px; height: 340px"
+          canvas-id="myCanvas"
+          id="myCanvas"
+        ></canvas>
+      </view>
+      <view class="button"><text @tap="saveImage">保存图片</text></view>
+    </view>
+
+    <!-- <drag-button :isDock="true" :customBar="true" ref="dragButton"></drag-button> -->
+  </view>
+</template>
+
+<script>
+import { mapState } from 'vuex';
+// import dragButton from '@/components/drag-button.vue';
+
+export default {
+  // components:{
+  // 	dragButton
+  // },
+  data() {
+    return {
+      configInfo: uni.getStorageSync('configInfo'),
+      dataList: [], // 优惠券列表
+      pageNum: 1,
+      pageSize: 8,
+      noMore: false,
+      loading: false,
+      isShareDialog: false, // 是否显示分享弹窗
+      isShowCanvas: false, // 是否显示海报弹窗
+      isFinishCanvas: false, // 是否已完成海报
+      codeUrl: '',
+      bgUrl: '',
+      headUrl: '',
+      top: 300,
+      tabList: [], // 分类列表
+      tabCurrent: '', // 分类当前值
+      keyword: '',
+
+      scrollLeft: 50,
+      scrollViewWidth: 0,
+      tabsRect: {
+        left: 0,
+      },
+
+      bannerUrl: '',
+    };
+  },
+
+  watch: {
+    tabList() {
+      this.$nextTick(() => {
+        this.resize();
+      });
+    },
+  },
+
+  computed: {
+    ...mapState(['userInfo', 'isLogin', 'userId']),
+  },
+
+  onShow() {
+    // this.$refs.dragButton.init();
+
+    this.top =
+      uni.getStorageSync('top') < 200
+        ? uni.getStorageSync('top')
+        : uni.getStorageSync('top') - 124;
+  },
+
+  onLoad() {
+    this.getTabList();
+    this.getBanner();
+  },
+
+  onShow() {
+    uni.$on('hanbleShare', () => {
+      this.clickShare();
+    });
+  },
+
+  onHide() {
+    uni.$off('hanbleShare');
+  },
+
+  // 下拉刷新
+  onPullDownRefresh() {
+    this.pageNum = 1;
+    this.getList();
+  },
+
+  // 上拉加载
+  onReachBottom() {
+    this.getList(1);
+  },
+
+  onShareAppMessage(options) {
+    if (options && options.from == 'button') {
+      // 来自页面内的转发按钮
+    } else {
+      // 点击微信右上角的分享按钮
+    }
+    return {
+      title: `${this.userInfo.nickName}向你推荐了${this.configInfo.minAppName}的团购活动`,
+      // imageUrl: this.detail.imgUrl,
+      path:
+        '/pages/index/index?serviceId=' +
+        this.userId +
+        '&otherType=groupbuyList',
+      query: {
+        // id: this.goodsId,
+      },
+      success: function (res) {
+        if (res.errMsg == 'shareAppMessage:ok') {
+          this.$successToast('分享完成');
+        }
+      },
+    };
+  },
+
+  methods: {
+    getList(loadMore) {
+      if (this.noMore && loadMore) return;
+      this.noMore = false;
+      if (!loadMore) {
+        this.pageNum = 1;
+      } else {
+        this.loading = true;
+      }
+      this.$axios({
+        url: '/goods/promotion/group/list',
+        method: 'get',
+        params: {
+          pageNo: this.pageNum,
+          pageSize: this.pageSize,
+          userId: this.userId,
+          goodsCategoryId: this.tabCurrent,
+          keyword: this.keyword,
+        },
+        isLoading: !loadMore,
+      }).then((res) => {
+        let _list = res.data.records;
+        let pageTotal = res.data.pages;
+        if (this.pageNum >= pageTotal) {
+          this.noMore = true;
+        }
+        if (_list.length) {
+          this.pageNum += 1;
+        }
+        if (loadMore) {
+          this.dataList = this.dataList.concat(_list);
+          this.loading = false;
+        } else {
+          this.dataList = _list;
+        }
+
+        uni.stopPullDownRefresh();
+      });
+    },
+
+    // 获取一级菜单
+    getTabList() {
+      this.$axios({
+        url: '/goods/category/list',
+        method: 'get',
+        params: {},
+      }).then((res) => {
+        res.data.unshift({ name: '全部', categoryId: '' });
+        this.tabList = res.data;
+        this.tabCurrent = res.data.length > 0 ? res.data[0].categoryId : 0;
+        this.getList();
+      });
+    },
+
+    // 切换一级菜单
+    changeTab(current) {
+      this.pageNum = 1;
+      this.tabCurrent = current;
+      this.resize();
+      this.getList();
+    },
+
+    searchSubmit() {
+      this.pageNum = 1;
+      this.getList();
+    },
+
+    setScrollLeft() {
+      // 当前活动tab的布局信息，有tab菜单的width和left(为元素左边界到父元素左边界的距离)等信息
+      const index = this.findElem(this.tabList, 'categoryId', this.tabCurrent);
+      const tabRect = this.tabList[index];
+      // 累加得到当前item到左边的距离
+      const offsetLeft = this.tabList.slice(0, index).reduce((total, curr) => {
+        return total + curr.rect.width;
+      }, 0);
+      // 此处为屏幕宽度
+      const res = uni.getSystemInfoSync();
+      const windowWidth = res.windowWidth;
+      // 将活动的tabs-item移动到屏幕正中间，实际上是对scroll-view的移动
+      let scrollLeft =
+        offsetLeft -
+        (this.tabsRect.width - tabRect.rect.width) / 2 -
+        (windowWidth - this.tabsRect.right) / 2 +
+        this.tabsRect.left / 2;
+
+      // 这里做一个限制，限制scrollLeft的最大值为整个scroll-view宽度减去tabs组件的宽度
+      scrollLeft = Math.min(
+        scrollLeft,
+        this.scrollViewWidth - this.tabsRect.width
+      );
+      this.scrollLeft = Math.max(0, scrollLeft);
+    },
+    // 获取所有标签的尺寸
+    resize() {
+      // 如果不存在list，则不处理
+      if (this.tabList.length === 0) {
+        return;
+      }
+      Promise.all([this.getTabsRect(), this.getAllItemRect()]).then(
+        ([tabsRect, itemRect = []]) => {
+          this.tabsRect = tabsRect;
+          this.scrollViewWidth = 0;
+          itemRect.map((item, index) => {
+            // 计算scroll-view的宽度，这里
+            this.scrollViewWidth += item.width;
+            // 另外计算每一个item的中心点X轴坐标
+            this.tabList[index].rect = item;
+          });
+          // 获取了tabs的尺寸之后，设置滑块的位置
+          this.setScrollLeft();
+        }
+      );
+    },
+    // 获取导航菜单的尺寸
+    getTabsRect() {
+      return new Promise((resolve) => {
+        this.queryRect('tabs-view').then((size) => resolve(size));
+      });
+    },
+    // 获取所有标签的尺寸
+    getAllItemRect() {
+      return new Promise((resolve) => {
+        const promiseAllArr = this.tabList.map((item, index) =>
+          this.queryRect(`tabs-item-${index}`, true)
+        );
+        Promise.all(promiseAllArr).then((sizes) => resolve(sizes));
+      });
+    },
+    // 获取各个标签的尺寸
+    queryRect(el, item) {
+      const query = uni.createSelectorQuery().in(this);
+      return new Promise((resolve) => {
+        query
+          .select(`.${el}`)
+          .boundingClientRect((data) => {
+            resolve(data);
+          })
+          .exec();
+      });
+    },
+
+    findElem(array, attr, val) {
+      for (var i = 0; i < array.length; i++) {
+        if (array[i][attr] == val) {
+          return i; //返回当前索引值
+        }
+      }
+      return -1;
+    },
+
+    // 进入商品详情
+    toGoodsDetail(id) {
+      if (!id) {
+        return false;
+      }
+      uni.navigateTo({
+        url: '/packageGoods/pages/detail?id=' + id,
+      });
+    },
+
+    // 获取海报图
+    getBanner() {
+      this.$axios({
+        url: '/goods/promotion/share/qrcode',
+        method: 'get',
+        params: {
+          userId: this.userId,
+        },
+      }).then((res) => {
+        this.bannerUrl = res.data.posterImgUrl;
+      });
+    },
+
+    // 点击分享
+    clickShare() {
+      if (!this.isLogin) {
+        return uni.navigateTo({
+          url: '/pages/login/index',
+        });
+      }
+      this.getCode();
+      this.isShareDialog = true;
+    },
+
+    // 获取二维码
+    getCode() {
+      let that = this;
+      this.$axios({
+        url: '/goods/promotion/share/qrcode',
+        method: 'get',
+        params: {
+          userId: this.userId,
+        },
+      }).then((res) => {
+        if (res.data) {
+          // this.codeUrl = res.data.qrcode;
+          // this.bgUrl = res.data.promotionImgUrl;
+          if (!this.isFinishCanvas) {
+            uni.downloadFile({
+              url: res.data.promotionImgUrl,
+              success: function (fileRes) {
+                that.bgUrl = fileRes.tempFilePath;
+              },
+            });
+            uni.downloadFile({
+              url: res.data.qrcode,
+              success: function (fileRes) {
+                that.codeUrl = fileRes.tempFilePath;
+              },
+            });
+            uni.downloadFile({
+              url:
+                that.userInfo.avatar.indexOf('http') >= 0
+                  ? that.userInfo.avatar
+                  : that.$imageUrl + that.userInfo.avatar,
+              success: function (fileRes) {
+                that.headUrl = fileRes.tempFilePath;
+              },
+            });
+          }
+        }
+      });
+    },
+
+    // 生成图片
+    markImage() {
+      if (!this.bgUrl || !this.codeUrl || !this.headUrl) {
+        this.getCode();
+        return this.$toast('生成失败，请重新操作');
+      }
+
+      let that = this;
+      this.isShareDialog = false;
+      this.isShowCanvas = true;
+
+      if (this.isFinishCanvas) {
+        return false;
+      }
+
+      uni.showLoading({
+        title: '海报生成中',
+      });
+
+      let codeUrl = this.codeUrl;
+      let bgUrl = this.bgUrl;
+      let headUrl = this.headUrl;
+
+      // this.userInfo.nickName = '阿里巴巴的的';
+      let name =
+        this.userInfo.nickName.length > 4
+          ? this.userInfo.nickName.slice(0, 4) + '...'
+          : this.userInfo.nickName;
+
+      var ctx = uni.createCanvasContext('myCanvas');
+
+      // 背景图片
+      ctx.drawImage(bgUrl, 0, 0, 340, 340);
+
+      // 二维码
+      this.circleImgOne(ctx, codeUrl, 260, 260, uni.upx2px(70));
+      // ctx.drawImage(codeUrl, 260, 260, 70, 70)
+
+      // 矩形
+      // ctx.setFillStyle('rgba(0,0,0,0.4)')
+      // ctx.fillRect(185, 10, 145, 30)
+
+      // 圆角矩形
+      this.fillRoundRect(ctx, 175, 10, 155, 30, 15, 'rgba(0,0,0,0.4)');
+
+      // 头像
+      // this.circleImgOne(ctx, headUrl, 200, 10, 15);
+      ctx.drawImage(headUrl, 187, 12, 26, 26);
+
+      // 文字
+      ctx.setFontSize(12);
+      ctx.setFillStyle('#FFFFFF');
+      ctx.fillText(name + '向你推荐', 217, 30);
+
+      ctx.draw();
+      uni.hideLoading();
+      this.isFinishCanvas = true;
+    },
+
+    // ctx=Canvas实例, img=图片地址, x=x轴坐标, y=y轴坐标, r=圆形半径
+    circleImgOne(ctx, img, x, y, r) {
+      // 如果在绘制图片之后还有需要绘制别的元素，需启动 save() 、restore() 方法，否则 clip() 方法会导致之后元素都不可见
+      // save()：保存当前 Canvas 画布状态
+      // restore()：恢复到保存时的状态
+      ctx.save();
+      let d = r * 2;
+      let cx = x + r;
+      let cy = y + r;
+      ctx.arc(cx, cy, r, 0, 2 * Math.PI);
+      ctx.strokeStyle = '#FFFFFF'; // 设置绘制圆形边框的颜色
+      ctx.stroke(); // 绘制出圆形，默认为黑色，可通过 ctx.strokeStyle = '#FFFFFF'， 设置想要的颜色
+      ctx.clip();
+      ctx.drawImage(img, x, y, d, d);
+      ctx.restore();
+    },
+
+    /**该方法用来绘制一个有填充色的圆角矩形
+     *@param cxt:canvas的上下文环境
+     *@param x:左上角x轴坐标
+     *@param y:左上角y轴坐标
+     *@param width:矩形的宽度
+     *@param height:矩形的高度
+     *@param radius:圆的半径
+     *@param fillColor:填充颜色
+     **/
+    fillRoundRect(cxt, x, y, width, height, radius, fillColor) {
+      //圆的直径必然要小于矩形的宽高
+      if (2 * radius > width || 2 * radius > height) {
+        return false;
+      }
+
+      cxt.save();
+      cxt.translate(x, y);
+      //绘制圆角矩形的各个边
+      this.drawRoundRectPath(cxt, width, height, radius);
+      cxt.fillStyle = fillColor;
+      cxt.fill();
+      cxt.restore();
+    },
+
+    drawRoundRectPath(cxt, width, height, radius) {
+      cxt.beginPath(0);
+      //从右下角顺时针绘制，弧度从0到1/2PI
+      cxt.arc(width - radius, height - radius, radius, 0, Math.PI / 2);
+      //矩形下边线
+      cxt.lineTo(radius, height);
+      //左下角圆弧，弧度从1/2PI到PI
+      cxt.arc(radius, height - radius, radius, Math.PI / 2, Math.PI);
+      //矩形左边线
+      cxt.lineTo(0, radius);
+      //左上角圆弧，弧度从PI到3/2PI
+      cxt.arc(radius, radius, radius, Math.PI, (Math.PI * 3) / 2);
+      //上边线
+      cxt.lineTo(width - radius, 0);
+      //右上角圆弧
+      cxt.arc(width - radius, radius, radius, (Math.PI * 3) / 2, Math.PI * 2);
+      //右边线
+      cxt.lineTo(width, height - radius);
+      cxt.closePath();
+    },
+
+    // 保存图片
+    saveImage() {
+      let that = this;
+      uni.canvasToTempFilePath({
+        x: 0,
+        y: 0,
+        width: 340,
+        height: 340,
+        canvasId: 'myCanvas',
+        success: function (res) {
+          uni.saveImageToPhotosAlbum({
+            filePath: res.tempFilePath,
+            success: function () {
+              that.$successToast('保存成功');
+            },
+          });
+        },
+      });
+    },
+
+    // 关闭canvas
+    closeCanvas() {
+      this.isShowCanvas = false;
+      uni.hideLoading();
+    },
+  },
+};
+</script>
+
+<style lang="scss">
+.app-container {
+  background: #f4f2f2;
+  box-sizing: border-box;
+  padding-top: 184rpx;
+}
+
+.fixed-container {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+}
+
+.share-container {
+  position: fixed;
+  right: 20rpx;
+  // bottom: 30vh;
+  button {
+    width: 108rpx;
+    height: 108rpx;
+    padding: 0;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    border-radius: 50%;
+    // box-shadow: 0 1px 4px rgba(0, 21, 41, .8);
+    background: #ffffff;
+    border: 4rpx solid #eaeaea;
+    image {
+      width: 28rpx;
+      height: 28rpx;
+      display: block;
+      flex-shrink: 0;
+      margin-bottom: 6rpx;
+    }
+    text {
+      font-size: 22rpx;
+      line-height: 24rpx;
+      color: #666666;
+      margin-top: 8rpx;
+    }
+  }
+}
+
+.top-container {
+  background: #ffffff;
+  .tab {
+    display: flex;
+    margin-left: -10rpx;
+    .item {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      flex-shrink: 0;
+      font-size: 28rpx;
+      color: #666666;
+      height: 80rpx;
+      line-height: 80rpx;
+      position: relative;
+      padding: 0 30rpx;
+      &.current {
+        color: #ff3f42;
+        font-weight: 600;
+        &::after {
+          content: '';
+          display: block;
+          width: 50rpx;
+          height: 6rpx;
+          background: #ff3f42;
+          position: absolute;
+          bottom: 0;
+          left: 50%;
+          margin-left: -25rpx;
+        }
+      }
+    }
+  }
+}
+
+.search-container {
+  background: #ffffff;
+  padding: 20rpx;
+  .search {
+    height: 64rpx;
+    display: flex;
+    align-items: center;
+    border-radius: 64rpx;
+    padding: 0 20rpx;
+    border: 1px solid #eaeaea;
+    image {
+      width: 28rpx;
+      height: 28rpx;
+    }
+    input {
+      width: 100%;
+      padding-left: 15rpx;
+    }
+  }
+}
+
+.banner-container {
+  padding: 20rpx 20rpx 0;
+  image {
+    display: block;
+    width: 100%;
+    border-radius: 10rpx;
+  }
+}
+
+.list-container {
+  padding: 20rpx;
+  .item {
+    background: #ffffff;
+    border-radius: 10rpx;
+    display: flex;
+    padding: 20rpx;
+    margin-bottom: 20rpx;
+    image {
+      display: block;
+      width: 180rpx;
+      height: 180rpx;
+      flex-shrink: 0;
+    }
+    .right {
+      width: 490rpx;
+      box-sizing: border-box;
+      padding-left: 20rpx;
+      .title {
+        font-size: 30rpx;
+        color: #333333;
+        line-height: 36rpx;
+        font-weight: 600;
+      }
+      .des {
+        font-size: 24rpx;
+        line-height: 30rpx;
+        color: #999999;
+        margin-top: 6rpx;
+      }
+      .stock-sales {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-top: 10rpx;
+        font-size: 24rpx;
+        color: #666666;
+        .stock {
+          display: flex;
+          align-items: center;
+          text {
+            font-size: 24rpx;
+            color: #666666;
+          }
+          .progress-box {
+            width: 140rpx;
+            border-radius: 6px;
+            overflow: hidden;
+            margin-left: 10rpx;
+          }
+        }
+      }
+      .bottom {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-top: 10rpx;
+        .price {
+          display: flex;
+          flex-direction: column;
+        }
+        .price-1 {
+          font-size: 32rpx;
+          color: #ff3f42;
+          line-height: 36rpx;
+        }
+        .price-2 {
+          font-size: 26rpx;
+          color: #666666;
+          line-height: 30rpx;
+          text-decoration: line-through;
+        }
+        .btn {
+          width: 110rpx;
+          height: 44rpx;
+          background: #ff3f42;
+          border-radius: 5rpx;
+          font-size: 28rpx;
+          color: #ffffff;
+          text-align: center;
+          line-height: 44rpx;
+        }
+        .btn2 {
+          width: 110rpx;
+          height: 44rpx;
+          background: #aaaaaa;
+          border-radius: 5rpx;
+          font-size: 28rpx;
+          color: #ffffff;
+          text-align: center;
+          line-height: 44rpx;
+        }
+      }
+    }
+  }
+}
+
+.sharelist-container {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  z-index: 999;
+  width: 100%;
+  box-sizing: border-box;
+  background: #ffffff;
+  padding: 30rpx 0;
+  display: flex;
+  button {
+    background: none;
+    border-radius: 0;
+    &::after {
+      border: none;
+    }
+  }
+  .item {
+    display: flex;
+    width: 50%;
+    flex-direction: column;
+    align-items: center;
+    image {
+      width: 100rpx;
+      height: 100rpx;
+      display: block;
+      margin-bottom: 20rpx;
+    }
+    text {
+      font-size: 28rpx;
+      line-height: 32rpx;
+      color: #333333;
+    }
+  }
+}
+.canvas-container {
+  position: fixed;
+  left: 50%;
+  top: 50%;
+  z-index: 999;
+  margin-left: -170px;
+  margin-top: -170px;
+  .button {
+    display: flex;
+    justify-content: center;
+    text {
+      display: block;
+      width: 280rpx;
+      height: 70rpx;
+      border-radius: 70rpx;
+      background: linear-gradient(-90deg, #ff3f42 0%, #fe781f 100%);
+      font-size: 28rpx;
+      color: #ffffff;
+      text-align: center;
+      line-height: 70rpx;
+      margin-top: 20rpx;
+    }
+  }
+}
+</style>

pages/mine/index.vue

@@ -1,811 +1,811 @@
-<template>
-	<view class="app-container">
-		<custom :bgColor="'bg-them'" :backColor="'#FFFFFF'" :isBack="false" v-show="isCustom">
-			<text slot="content" style="color: #FFFFFF; font-size: 36rpx;">我的</text>
-		</custom>
-		
-		<view class="top-container">
-			<image src="@/static/home/top_bg.png" mode="widthFix" class="bg"></image>
-			
-			<view class="content">
-				<view class="title" :style="cuStyle">我的</view>
-				
-				<view class="user" v-if="isLogin">
-					<view class="left" @tap="isShowInfoDialog = true">
-						<block v-if="detail.avatar">
-							<image :src="detail.avatar" mode="aspectFill" v-if="detail.avatar.indexOf('http') >= 0"></image>
-							<image :src="imageUrl + detail.avatar" mode="aspectFill" v-else></image>
-						</block>
-						
-						<view class="main" v-if="isServiceUser">
-							<view class="name">{{detail.serviceWorkerBean.workerRealName}}</view>
-							<view class="text" v-if="detail.serviceWorkerBean.websit">{{detail.serviceWorkerBean.websit}}</view>
-						</view>
-						<view class="main" v-else>
-							<view class="name">{{detail.nickName}}</view>
-						</view>
-					</view>
-					<view class="code" v-if="isServiceUser">
-						<image src="@/static/mine/code.png" @tap="navigatePage('/pages/mine/mallCode')"></image>
-						<text>商城二维码</text>
-					</view>
-				</view>
-				<view class="user" @tap="navigatePage('/pages/login/index')" v-else>
-					<view class="left">
-						<image :src="configInfo.minLogo3" mode="aspectFill"></image>
-						<view class="main">
-							<view class="name">请先登录</view>
-						</view>
-					</view>
-				</view>
-				
-				<view class="order">
-					<view class="top">
-						<view class="left">我的订单</view>
-						<view class="right" @tap="toMyOrder('')">查看全部订单<image src="../../static/icon/right.png"></image></view>
-					</view>
-					<view class="list">
-						<view class="item" @tap="toMyOrder('NOPAY')">
-							<view class="image"><image src="../../static/mine/order_icon1.png"></image><text v-if="count.noPay > 0">{{count.noPay}}</text></view>
-							<view>待付款</view>
-						</view>
-						<view class="item" @tap="toMyOrder('DFH')">
-							<view class="image"><image src="../../static/mine/order_icon2.png"></image><text v-if="count.dfh > 0">{{count.dfh}}</text></view>
-							<view>待发货</view>
-						</view>
-						<view class="item" @tap="toMyOrder('YFH')">
-							<view class="image"><image src="../../static/mine/order_icon3.png"></image><text v-if="count.yfh > 0">{{count.yfh}}</text></view>
-							<view>待收货</view>
-						</view>
-						<view class="item" @tap="toMyOrder('OVER')">
-							<view class="image"><image src="../../static/mine/order_icon4.png"></image><text v-if="count.ywc > 0">{{count.ywc}}</text></view>
-							<view>已完成</view>
-						</view>
-						<view class="item" @tap="toMyOrder('REFUND')">
-							<view class="image"><image src="../../static/mine/order_icon5.png"></image><text v-if="count.sh > 0">{{count.sh}}</text></view>
-							<view>售后服务</view>
-						</view>
-					</view>
-				</view>
-			</view>
-		</view>
-		
-		<view class="list-container">
-			
-			
-			<view class="group" v-if="userInfo && !userInfo.mobile">
-				<view class="item" @tap="isShowPhoneDialog = true">
-					<view class="left">
-						<image src="/static/mine/mine_icon1.png"></image>获取手机号码
-					</view>
-					<view class="right"><image src="/static/icon/right.png"></image></view>
-				</view>
-			</view>
-			
-			<!-- <view class="group" v-if="!isServiceUser">
-				<view class="item" @tap="navigatePage('/pages/mine/applySalesman')">
-					<view class="left">
-						<image src="/static/mine/mine_icon1.png"></image>申请成为业务员
-					</view>
-					<view class="right"><image src="/static/icon/right.png"></image></view>
-				</view>
-			</view> -->
-			<!-- <view class="group" v-if="isHeadUser">
-				<view class="item" @tap="navigatePage('/pages/mine/groupbuy/list')">
-					<view class="left">
-						<image src="/static/mine/mine_icon12.png"></image>我的团购
-					</view>
-					<view class="right"><image src="/static/icon/right.png"></image></view>
-				</view>
-			</view> -->
-			<view class="group" v-if="isServiceUser || isHeadUser">
-				<view class="item" @tap="navigatePage('/pages/mine/profit/list')" v-if="isServiceUser || isHeadUser">
-					<view class="left">
-						<image src="/static/mine/mine_icon7.png"></image>我的收益
-					</view>
-					<view class="right"><image src="/static/icon/right.png"></image></view>
-				</view>
-				<view class="item" @tap="navigatePage('/pages/mine/ranking/list')" v-if="isServiceUser">
-					<view class="left">
-						<image src="/static/mine/mine_icon10.png"></image>销售排行榜
-					</view>
-					<view class="right"><image src="/static/icon/right.png"></image></view>
-				</view>
-			</view>
-			<view class="group" v-if="isServiceUser">
-				<view class="item" @tap="navigatePage('/pages/mine/discode/list')" v-if="hasExchangeCode">
-					<view class="left">
-						<image src="/static/mine/mine_icon13.png"></image>我的优惠码
-					</view>
-					<view class="right"><image src="/static/icon/right.png"></image></view>
-				</view>
-				<view class="item" @tap="navigatePage('/pages/mine/discount/list')" v-if="isInnerrUser">
-					<view class="left">
-						<image src="/static/mine/mine_icon14.png"></image>用户减免金额{{isExamineUser ? '审核':'申请'}}
-					</view>
-					<view class="right"><image src="/static/icon/right.png"></image></view>
-				</view>
-			</view>
-			<view class="group" v-if="isServiceUser">
-				<view class="item" @tap="navigatePage('/pages/mine/mallCode')">
-					<view class="left">
-						<image src="/static/mine/mine_icon9.png"></image>商城二维码
-					</view>
-					<view class="right"><image src="/static/icon/right.png"></image></view>
-				</view>
-				<!-- <view class="item" @tap="navigatePage('/pages/mine/wxCode')">
-					<view class="left">
-						<image src="/static/mine/mine_icon9.png"></image>企微二维码
-					</view>
-					<view class="right"><image src="/static/icon/right.png"></image></view>
-				</view> -->
-			</view>
-			<view class="group">
-				<!-- <view class="item" @tap="navigatePage('/pages/mine/exchange/index')">
-					<view class="left">
-						<image src="/static/mine/mine_icon15.png"></image>兑换中心
-					</view>
-					<view class="right"><image src="/static/icon/right.png"></image></view>
-				</view> -->
-				<view class="item" @tap="navigatePage('/pages/mine/coupon/list')">
-					<view class="left">
-						<image src="/static/mine/mine_icon4.png"></image>我的优惠券
-					</view>
-					<view class="right"><image src="/static/icon/right.png"></image></view>
-				</view>
-				<!-- v-if="keyilingqude" -->
-				<view class="item" @tap="navigatePage('/pages/index/coupon')">
-					<view class="left">
-						<image src="/static/mine/mine_icon4.png"></image>可领取优惠券
-					</view>
-					<view class="right"><image src="/static/icon/right.png"></image></view>
-				</view>
-				
-				<view class="item" @tap="navigatePage('/pages/mine/address/list')">
-					<view class="left">
-						<image src="/static/mine/mine_icon5.png"></image>我的收货地址
-					</view>
-					<view class="right"><image src="/static/icon/right.png"></image></view>
-				</view>
-			</view>
-			<view class="group">
-				<view class="item" @tap="navigatePage('/pages/mine/collection')">
-					<view class="left">
-						<image src="/static/mine/mine_icon2.png"></image>我的收藏
-					</view>
-					<view class="right"><image src="/static/icon/right.png"></image></view>
-				</view>
-				<!-- <view class="item" v-if="!isServiceUser" @tap="toMyManager">
-					<view class="left">
-						<image src="/static/mine/mine_icon3.png"></image>我的客户经理
-					</view>
-					<view class="right"><image src="/static/icon/right.png"></image></view>
-				</view> -->
-				<view class="item" v-if="isServiceUser" @tap="navigatePage('/pages/mine/customer/list')">
-					<view class="left">
-						<image src="/static/mine/mine_icon8.png"></image>我的客户列表
-					</view>
-					<view class="right"><image src="/static/icon/right.png"></image></view>
-				</view>
-				<!-- <view class="item" @tap="navigatePage('/pages/mine/workOrder/list')">
-					<view class="left">
-						<image src="/static/mine/mine_icon11.png"></image>我的工单信息
-					</view>
-					<view class="right"><image src="/static/icon/right.png"></image></view>
-				</view> -->
-			</view>
-			<view class="group">
-				<button class="item" open-type="contact">
-					<view class="left">
-						<image src="/static/mine/mine_icon6.png"></image>联系客服
-					</view>
-					<view class="right"><image src="/static/icon/right.png"></image></view>
-				</button>
-			</view>
-		</view>
-		
-		<modal-dialog showTitle="我的客户经理" :showText="myManagerDetail.workName + ' ' + myManagerDetail.workPhone" :isShowDialog="isManagerDialog" @cancel="isManagerDialog = false" @confirm="callPhone(myManagerDetail.workPhone)" confirmText="拨打电话"></modal-dialog>
-		
-		<!-- <drag-button :isDock="true" :customBar="false" ref="dragButton"></drag-button> -->
-		
-		<u-popup :round="10" :show="isShowInfoDialog">
-			<view class="info-dialog">
-				<view class="content">
-					<view class="title">获取您的头像和昵称</view>
-					<view class="text">为了方便识别您的身份，请授权您的头像和昵称</view>
-				</view>
-				<view class="form">
-					<view class="item">
-						<view class="label">头像</view>
-						<view class="value">
-							<button open-type="chooseAvatar" @chooseavatar="chooseAvatar">
-								<image :src="imageUrl + infoForm.avatar" v-if="infoForm.avatar"></image>
-								<view class="empty" v-else>请选择</view>
-							</button>
-						</view>
-					</view>
-					<view class="item">
-						<view class="label">昵称</view>
-						<view class="value">
-							<input
-								type="nickname"
-							    placeholder="请输入昵称"
-							    border="none"
-							    v-model="infoForm.nickname"
-								@change="getNickname"
-							></input>
-						</view>
-					</view>
-				</view>
-				<view class="btn">
-					<button @tap="isShowInfoDialog = false">取消</button>
-					<button type="primary" @tap="saveUserInfo()">提交</button>
-				</view>
-			</view>
-		</u-popup>
-		
-		<u-popup :round="10" :show="isShowPhoneDialog">
-		  <view class="phone-dialog">
-		    <view class="content">
-		      <view>申请获取以下权限</view>
-		      <text>获得你的公开信息(手机号码)</text>
-		    </view>
-		    <view class="btn">
-		      <button @tap="isShowPhoneDialog = false">取消</button>
-		      <button
-		        type="primary"
-		        open-type="getPhoneNumber"
-		        @getphonenumber="getPhoneNumber"
-		      >
-		        确定授权
-		      </button>
-		    </view>
-		  </view>
-		</u-popup>
-		
-	</view>
-</template>
-
-<script>
-	import {mapState} from 'vuex';
-	import modalDialog from '@/components/modalDialog.vue';
-	// import dragButton from '@/components/drag-button.vue';
-	import { uploadImg } from '@/api/axios.js';
-	
-	export default {
-		components:{
-			modalDialog,
-			// dragButton
-		},
-		data() {
-			return {
-				isShowPhoneDialog: false,
-				imageUrl: this.$imageUrl,
-				configInfo: uni.getStorageSync('configInfo'),
-				detail: {}, // 信息详情
-				myManagerDetail: {}, // 我的客户经理信息
-				count: {}, // 订单数量统计
-				scrollTop: 0, // 滚动高度（用于控制自定义导航）
-				isCustom: false, // 是否显示自定义导航
-				isManagerDialog: false, // 是否显示联系客户经理弹窗
-				
-				isShowInfoDialog: false, // 是否显示获取用户信息弹窗
-				infoForm: {
-					avatar: '',
-					nickname: '',
-				},
-				keyilingqude:false,
-			}
-		},
-		computed:{
-			...mapState(['userInfo', 'isLogin', 'userId']),
-			cuStyle(){
-				return `height:${this.CustomBar-this.StatusBar}px; padding-top:${this.StatusBar}px;`
-			},
-			isServiceUser() { // 是否业务员
-				return this.detail.type === 'SERVICE';
-			},
-			isHeadUser() { // 是否团长
-				return false //this.detail.promotionGroupLeader;
-			},
-			isExamineUser() { // 是否审核人员
-				return this.detail.promotionApplyExamineby;
-			},
-			isInnerrUser() { // 是否内部人员
-				return this.detail.innerr;
-			},
-			hasExchangeCode() { // 是否有优惠码权限
-				return this.detail.isExchangeCode;
-			},
-		},
-		watch: {
-			scrollTop() {
-				if(this.scrollTop > 100) {
-					this.isCustom = true;
-				}else {
-					this.isCustom = false;
-				}
-			}
-		},
-		onLoad() {
-			if(!this.isLogin) {
-				uni.navigateTo({
-					url: '/pages/login/index'
-				})
-			}
-		},
-		onShow() {
-			this.$axios({
-				url: '/couponNew/list/all',
-				method: 'get',
-				params: {
-					userId: this.userId
-				},
-			}).then(res => {
-				this.keyilingqude = !!res.data.length
-			})
-			
-			if(this.userId && this.isLogin) {
-				this.getDetail();
-				this.getCount();
-			}
-			
-			// this.$refs.dragButton.init();
-		},
-		onPageScroll(res) {
-			this.scrollTop = res.scrollTop;
-		},
-		methods: {
-			
-			// 获取手机号
-			getPhoneNumber(e) {
-				if(e?.detail?.iv &&e?.detail?.encryptedData){
-					this.$axios({
-					  url: '/user/mobile/grant',
-					  params: {
-						userId: this.userId,
-						iv: e.detail.iv,
-						encryptedData: e.detail.encryptedData,
-					  },
-					}).then((res) => {
-					  uni.setStorageSync('token', res.data.token);
-					  uni.setStorageSync('isActiveLogout', false);
-            this.isShowPhoneDialog = false;
-            this.$getUserInfo();
-					});
-				}
-			},
-			
-			
-			// 获取个人信息
-			async getDetail() {
-				this.detail = await this.$getUserInfo();
-				
-				if(!this.detail.openId) {
-					return uni.navigateTo({
-						url: '/pages/login/index?isNotOpenid=' + true
-					})
-				}
-			},
-			
-			// 获取订单数量
-			getCount() {
-				this.$axios({
-					url: '/order/count',
-					method: 'get',
-					params: {
-						userId: this.userId
-					}
-				}).then(res => {
-					this.count = res.data;
-				})
-			},
-			
-			// 跳转页面
-			navigatePage(url) {
-				if(!this.isLogin) {
-					return uni.navigateTo({
-						url: '/pages/login/index'
-					})
-				}
-				if(!url) {
-					return this.$toast('跳转链接错误');
-				}
-				uni.navigateTo({
-					url
-				})
-			},
-			
-			// 我的客户经理
-			toMyManager() {
-				if(!this.isLogin) {
-					return uni.navigateTo({
-						url: '/pages/login/index'
-					})
-				}
-				this.$axios({
-					url: '/user/parent',
-					method: 'get',
-					params: {
-						userId: this.userId
-					}
-				}).then(res => {
-					if(!res.data) {
-						return this.$toast('您暂无客户经理');
-					}else {
-						this.myManagerDetail = res.data;
-						this.isManagerDialog = true;
-					}
-				})
-			},
-			
-			// 拨打电话
-			callPhone(number) {
-				uni.makePhoneCall({
-				    phoneNumber: number
-				});
-			},
-			
-			// 去我的订单列表
-			toMyOrder(tab) {
-				if(!this.isLogin) {
-					return uni.navigateTo({
-						url: '/pages/login/index'
-					})
-				}
-				uni.navigateTo({
-					url: '/pages/mine/order/list?tab=' + tab
-				})
-			},
-			
-			// 选择头像
-			chooseAvatar(e) {
-				uploadImg({
-					path: e.detail.avatarUrl,
-					name: e.detail.avatarUrl,
-				}).then(data => {
-					this.infoForm.avatar = data.url;
-				})
-			},
-			
-			// 用户昵称审核完毕
-			getNickname(e) {
-				this.infoForm.nickname = e.detail.value;
-			},
-			
-			// 保存用户信息
-			saveUserInfo() {
-				if(!this.infoForm.avatar) {
-					return this.$toast('请先上传头像');
-				}
-				if(!this.infoForm.nickname) {
-					return this.$toast('请先输入昵称');
-				}
-				
-				this.$axios({
-					url: '/user/userinfo/save',
-					params: {
-						userId: this.userId,
-						avatarUrl: this.infoForm.avatar,
-						nickName: this.infoForm.nickname,
-					},
-				}).then(res => {
-					this.isShowInfoDialog = false;
-					this.getDetail();
-				})
-			},
-		}
-	}
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #F4F2F2;
-		box-sizing: border-box;
-		padding-bottom: 80rpx;
-	}
-	.top-container {
-		position: relative;
-		.bg {
-			display: block;
-			width: 750rpx;
-			position: absolute;
-			top: 0;
-			z-index: 0;
-		}
-		.content {
-			width: 710rpx;
-			padding: 0 20rpx;
-			position: relative;
-			z-index: 1;
-		}
-		.title {
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			color: #FFFFFF;
-			font-size: 36rpx;
-		}
-		.user {
-			display: flex;
-			align-items: center;
-			justify-content: space-between;
-			margin-top: 40rpx;
-			.left {
-				display: flex;
-				align-items: center;
-				image {
-					width: 120rpx;
-					height: 120rpx;
-					border-radius: 50%;
-					border: 2px solid #FFFFFF;
-					margin-right: 20rpx;
-				}
-				.main {
-					width: 360rpx;
-					display: flex;
-					flex-direction: column;
-					.name {
-						font-size: 32rpx;
-						color: #FFFFFF;
-						line-height: 36rpx;
-					}
-					.text {
-						font-size: 24rpx;
-						color: #FFFFFF;
-						line-height: 30rpx;
-						margin-top: 12rpx;
-					}
-				}
-			}
-			.code {
-				display: flex;
-				flex-direction: column;
-				align-items: center;
-				justify-content: center;
-				flex-shrink: 0;
-				margin-right: 30rpx;
-				image {
-					width: 52rpx;
-					height: 52rpx;
-					display: block;
-				}
-				text {
-					font-size: 20rpx;
-					line-height: 20rpx;
-					color: #FFFFFF;
-					margin-top: 12rpx;
-				}
-			}
-		}
-		.order {
-			margin-top: 20rpx;
-			background: #FFFFFF;
-			border-radius: 20rpx;
-			.top {
-				height: 88rpx;
-				display: flex;
-				justify-content: space-between;
-				align-items: center;
-				padding: 0 20rpx;
-				.left {
-					font-size: 32rpx;
-					color: #333333;
-				}
-				.right {
-					display: flex;
-					align-items: center;
-					font-size: 24rpx;
-					color: #999999;
-					image {
-						width: 16rpx;
-						height: 28rpx;
-						margin-left: 12rpx;
-					}
-				}
-			}
-			.list {
-				display: flex;
-				border-top: 1px solid #eaeaea;
-				padding: 10rpx 0 24rpx;
-				.item {
-					width: 20%;
-					display: flex;
-					flex-direction: column;
-					align-items: center;
-					.image {
-						position: relative;
-					}
-					image {
-						width: 60rpx;
-						height: 60rpx;
-						display: block;
-					}
-					text {
-						position: absolute;
-						right: -12rpx;
-						top: -8rpx;
-						z-index: 11;
-						background: #FF3F42;
-						width: 32rpx;
-						height: 32rpx;
-						line-height: 32rpx;
-						text-align: center;
-						border-radius: 32rpx;
-						font-size: 20rpx;
-						color: #FFFFFF;
-					}
-					view {
-						font-size: 28rpx;
-						line-height: 28rpx;
-						color: #333333;
-						margin-top: 10rpx;
-					}
-				}
-			}
-		}
-	}
-	.list-container {
-		padding: 0 20rpx;
-		margin-top: 20rpx;
-		padding-bottom: 20rpx;
-		.group {
-			margin-bottom: 20rpx;
-			background: #FFFFFF;
-			border-radius: 20rpx;
-			overflow: hidden;
-			&:last-child {
-				margin-bottom: 0;
-			}
-			.item {
-				display: flex;
-				align-items: center;
-				justify-content: space-between;
-				height: 88rpx;
-				border-bottom: 1px solid #eaeaea;
-				padding: 0 20rpx;
-				background: #FFFFFF;
-				color: #333333;
-				&:last-child {
-					border: none;
-				}
-				&::after {
-					border: none;
-				}
-				.left {
-					display: flex;
-					align-items: center;
-					font-size: 30rpx;
-					image {
-						width: 40rpx;
-						height: 40rpx;
-						margin-right: 20rpx;
-					}
-				}
-				.right {
-					image {
-						width: 16rpx;
-						height: 28rpx;
-						display: block;
-					}
-				}
-			}
-		}
-	}
-	
-	.info-dialog {
-		padding: 40rpx 40rpx 80rpx;
-		box-sizing: border-box;
-		.content {
-			.title {
-				font-size: 32rpx;
-				font-weight: 500;
-			}
-			.text {
-				font-size: 24rpx;
-				color: #999999;
-				margin-top: 20rpx;
-			}
-		}
-		.form {
-			.item {
-				display: flex;
-				align-items: center;
-				justify-content: space-between;
-				margin-top: 30rpx;
-				.label {
-					color: #666666;
-				}
-				.value {
-					button {
-						padding: 0;
-						background: none;
-						border: none;
-						&::after {
-							border: none;
-						}
-					}
-					input {
-						width: 500rpx;
-						height: 68rpx;
-						text-align: right !important;
-					}
-					image {
-						width: 88rpx;
-						height: 88rpx;
-						border-radius: 88rpx;
-						display: block;
-					}
-					.empty {
-						width: 88rpx;
-						height: 88rpx;
-						border-radius: 88rpx;
-						background: #f5f5f5;
-						text-align: center;
-						line-height: 88rpx;
-						font-size: 24rpx;
-						color: #999999;
-					}
-				}
-			}
-		}
-		.btn {
-			display: flex;
-			justify-content: center;
-			margin-top: 60rpx;
-			button::after { 
-				border: none;
-			}
-			button {
-				width: 180rpx;
-				height: 70rpx;
-				line-height: 70rpx;
-				margin: 0;
-				font-size: 28rpx;
-				margin: 0 30rpx;
-				&:first-child {
-					background: #f5f5f5;
-					color: $theme-color;
-				}
-				&:last-child {
-					background: $theme-color;
-					color: #FFFFFF;
-				}
-			}
-		}
-	}
-
-	
-	.phone-dialog {
-	  padding: 40rpx;
-	  box-sizing: border-box;
-	  .content {
-	    margin-top: 30rpx;
-	    margin-bottom: 30rpx;
-	    line-height: 50rpx;
-	    text {
-	      color: #9d9d9d;
-	    }
-	  }
-	  .btn {
-	    display: flex;
-	    justify-content: center;
-	    margin-top: 60rpx;
-	    button::after {
-	      border: none;
-	    }
-	    button {
-	      width: 180rpx;
-	      height: 70rpx;
-	      line-height: 70rpx;
-	      margin: 0;
-	      font-size: 28rpx;
-	      margin: 0 30rpx;
-	      &:first-child {
-	        background: #f5f5f5;
-	        color: #00ba5c;
-	      }
-	    }
-	  }
-	}
-</style>
+<template>
+	<view class="app-container">
+		<custom :bgColor="'bg-them'" :backColor="'#FFFFFF'" :isBack="false" v-show="isCustom">
+			<text slot="content" style="color: #FFFFFF; font-size: 36rpx;">我的</text>
+		</custom>
+		
+		<view class="top-container">
+			<image src="@/static/home/top_bg.png" mode="widthFix" class="bg"></image>
+			
+			<view class="content">
+				<view class="title" :style="cuStyle">我的</view>
+				
+				<view class="user" v-if="isLogin">
+					<view class="left" @tap="isShowInfoDialog = true">
+						<block v-if="detail.avatar">
+							<image :src="detail.avatar" mode="aspectFill" v-if="detail.avatar.indexOf('http') >= 0"></image>
+							<image :src="imageUrl + detail.avatar" mode="aspectFill" v-else></image>
+						</block>
+						
+						<view class="main" v-if="isServiceUser">
+							<view class="name">{{detail.serviceWorkerBean.workerRealName}}</view>
+							<view class="text" v-if="detail.serviceWorkerBean.websit">{{detail.serviceWorkerBean.websit}}</view>
+						</view>
+						<view class="main" v-else>
+							<view class="name">{{detail.nickName}}</view>
+						</view>
+					</view>
+					<view class="code" v-if="isServiceUser">
+						<image src="@/static/mine/code.png" @tap="navigatePage('/pages/mine/mallCode')"></image>
+						<text>商城二维码</text>
+					</view>
+				</view>
+				<view class="user" @tap="navigatePage('/pages/login/index')" v-else>
+					<view class="left">
+						<image :src="configInfo.minLogo3" mode="aspectFill"></image>
+						<view class="main">
+							<view class="name">请先登录</view>
+						</view>
+					</view>
+				</view>
+				
+				<view class="order">
+					<view class="top">
+						<view class="left">我的订单</view>
+						<view class="right" @tap="toMyOrder('')">查看全部订单<image src="../../static/icon/right.png"></image></view>
+					</view>
+					<view class="list">
+						<view class="item" @tap="toMyOrder('NOPAY')">
+							<view class="image"><image src="../../static/mine/order_icon1.png"></image><text v-if="count.noPay > 0">{{count.noPay}}</text></view>
+							<view>待付款</view>
+						</view>
+						<view class="item" @tap="toMyOrder('DFH')">
+							<view class="image"><image src="../../static/mine/order_icon2.png"></image><text v-if="count.dfh > 0">{{count.dfh}}</text></view>
+							<view>待发货</view>
+						</view>
+						<view class="item" @tap="toMyOrder('YFH')">
+							<view class="image"><image src="../../static/mine/order_icon3.png"></image><text v-if="count.yfh > 0">{{count.yfh}}</text></view>
+							<view>待收货</view>
+						</view>
+						<view class="item" @tap="toMyOrder('OVER')">
+							<view class="image"><image src="../../static/mine/order_icon4.png"></image><text v-if="count.ywc > 0">{{count.ywc}}</text></view>
+							<view>已完成</view>
+						</view>
+						<view class="item" @tap="toMyOrder('REFUND')">
+							<view class="image"><image src="../../static/mine/order_icon5.png"></image><text v-if="count.sh > 0">{{count.sh}}</text></view>
+							<view>售后服务</view>
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+		
+		<view class="list-container">
+			
+			
+			<view class="group" v-if="userInfo && !userInfo.mobile">
+				<view class="item" @tap="isShowPhoneDialog = true">
+					<view class="left">
+						<image src="/static/mine/mine_icon1.png"></image>获取手机号码
+					</view>
+					<view class="right"><image src="/static/icon/right.png"></image></view>
+				</view>
+			</view>
+			
+			<!-- <view class="group" v-if="!isServiceUser">
+				<view class="item" @tap="navigatePage('/pages/mine/applySalesman')">
+					<view class="left">
+						<image src="/static/mine/mine_icon1.png"></image>申请成为业务员
+					</view>
+					<view class="right"><image src="/static/icon/right.png"></image></view>
+				</view>
+			</view> -->
+			<!-- <view class="group" v-if="isHeadUser">
+				<view class="item" @tap="navigatePage('/pages/mine/groupbuy/list')">
+					<view class="left">
+						<image src="/static/mine/mine_icon12.png"></image>我的团购
+					</view>
+					<view class="right"><image src="/static/icon/right.png"></image></view>
+				</view>
+			</view> -->
+			<view class="group" v-if="isServiceUser || isHeadUser">
+				<view class="item" @tap="navigatePage('/pages/mine/profit/list')" v-if="isServiceUser || isHeadUser">
+					<view class="left">
+						<image src="/static/mine/mine_icon7.png"></image>我的收益
+					</view>
+					<view class="right"><image src="/static/icon/right.png"></image></view>
+				</view>
+				<view class="item" @tap="navigatePage('/pages/mine/ranking/list')" v-if="isServiceUser">
+					<view class="left">
+						<image src="/static/mine/mine_icon10.png"></image>销售排行榜
+					</view>
+					<view class="right"><image src="/static/icon/right.png"></image></view>
+				</view>
+			</view>
+			<view class="group" v-if="isServiceUser">
+				<view class="item" @tap="navigatePage('/pages/mine/discode/list')" v-if="hasExchangeCode">
+					<view class="left">
+						<image src="/static/mine/mine_icon13.png"></image>我的优惠码
+					</view>
+					<view class="right"><image src="/static/icon/right.png"></image></view>
+				</view>
+				<view class="item" @tap="navigatePage('/pages/mine/discount/list')" v-if="isInnerrUser">
+					<view class="left">
+						<image src="/static/mine/mine_icon14.png"></image>用户减免金额{{isExamineUser ? '审核':'申请'}}
+					</view>
+					<view class="right"><image src="/static/icon/right.png"></image></view>
+				</view>
+			</view>
+			<view class="group" v-if="isServiceUser">
+				<view class="item" @tap="navigatePage('/pages/mine/mallCode')">
+					<view class="left">
+						<image src="/static/mine/mine_icon9.png"></image>商城二维码
+					</view>
+					<view class="right"><image src="/static/icon/right.png"></image></view>
+				</view>
+				<!-- <view class="item" @tap="navigatePage('/pages/mine/wxCode')">
+					<view class="left">
+						<image src="/static/mine/mine_icon9.png"></image>企微二维码
+					</view>
+					<view class="right"><image src="/static/icon/right.png"></image></view>
+				</view> -->
+			</view>
+			<view class="group">
+				<!-- <view class="item" @tap="navigatePage('/pages/mine/exchange/index')">
+					<view class="left">
+						<image src="/static/mine/mine_icon15.png"></image>兑换中心
+					</view>
+					<view class="right"><image src="/static/icon/right.png"></image></view>
+				</view> -->
+				<view class="item" @tap="navigatePage('/pages/mine/coupon/list')">
+					<view class="left">
+						<image src="/static/mine/mine_icon4.png"></image>我的优惠券
+					</view>
+					<view class="right"><image src="/static/icon/right.png"></image></view>
+				</view>
+				<!-- v-if="keyilingqude" -->
+				<view class="item" @tap="navigatePage('/pages/index/coupon')">
+					<view class="left">
+						<image src="/static/mine/mine_icon4.png"></image>可领取优惠券
+					</view>
+					<view class="right"><image src="/static/icon/right.png"></image></view>
+				</view>
+				
+				<view class="item" @tap="navigatePage('/pages/mine/address/list')">
+					<view class="left">
+						<image src="/static/mine/mine_icon5.png"></image>我的收货地址
+					</view>
+					<view class="right"><image src="/static/icon/right.png"></image></view>
+				</view>
+			</view>
+			<view class="group">
+				<view class="item" @tap="navigatePage('/pages/mine/collection')">
+					<view class="left">
+						<image src="/static/mine/mine_icon2.png"></image>我的收藏
+					</view>
+					<view class="right"><image src="/static/icon/right.png"></image></view>
+				</view>
+				<!-- <view class="item" v-if="!isServiceUser" @tap="toMyManager">
+					<view class="left">
+						<image src="/static/mine/mine_icon3.png"></image>我的客户经理
+					</view>
+					<view class="right"><image src="/static/icon/right.png"></image></view>
+				</view> -->
+				<view class="item" v-if="isServiceUser" @tap="navigatePage('/pages/mine/customer/list')">
+					<view class="left">
+						<image src="/static/mine/mine_icon8.png"></image>我的客户列表
+					</view>
+					<view class="right"><image src="/static/icon/right.png"></image></view>
+				</view>
+				<!-- <view class="item" @tap="navigatePage('/pages/mine/workOrder/list')">
+					<view class="left">
+						<image src="/static/mine/mine_icon11.png"></image>我的工单信息
+					</view>
+					<view class="right"><image src="/static/icon/right.png"></image></view>
+				</view> -->
+			</view>
+			<view class="group">
+				<button class="item" open-type="contact">
+					<view class="left">
+						<image src="/static/mine/mine_icon6.png"></image>联系客服
+					</view>
+					<view class="right"><image src="/static/icon/right.png"></image></view>
+				</button>
+			</view>
+		</view>
+		
+		<modal-dialog showTitle="我的客户经理" :showText="myManagerDetail.workName + ' ' + myManagerDetail.workPhone" :isShowDialog="isManagerDialog" @cancel="isManagerDialog = false" @confirm="callPhone(myManagerDetail.workPhone)" confirmText="拨打电话"></modal-dialog>
+		
+		<!-- <drag-button :isDock="true" :customBar="false" ref="dragButton"></drag-button> -->
+		
+		<u-popup :round="10" :show="isShowInfoDialog">
+			<view class="info-dialog">
+				<view class="content">
+					<view class="title">获取您的头像和昵称</view>
+					<view class="text">为了方便识别您的身份，请授权您的头像和昵称</view>
+				</view>
+				<view class="form">
+					<view class="item">
+						<view class="label">头像</view>
+						<view class="value">
+							<button open-type="chooseAvatar" @chooseavatar="chooseAvatar">
+								<image :src="imageUrl + infoForm.avatar" v-if="infoForm.avatar"></image>
+								<view class="empty" v-else>请选择</view>
+							</button>
+						</view>
+					</view>
+					<view class="item">
+						<view class="label">昵称</view>
+						<view class="value">
+							<input
+								type="nickname"
+							    placeholder="请输入昵称"
+							    border="none"
+							    v-model="infoForm.nickname"
+								@change="getNickname"
+							></input>
+						</view>
+					</view>
+				</view>
+				<view class="btn">
+					<button @tap="isShowInfoDialog = false">取消</button>
+					<button type="primary" @tap="saveUserInfo()">提交</button>
+				</view>
+			</view>
+		</u-popup>
+		
+		<u-popup :round="10" :show="isShowPhoneDialog">
+		  <view class="phone-dialog">
+		    <view class="content">
+		      <view>申请获取以下权限</view>
+		      <text>获得你的公开信息(手机号码)</text>
+		    </view>
+		    <view class="btn">
+		      <button @tap="isShowPhoneDialog = false">取消</button>
+		      <button
+		        type="primary"
+		        open-type="getPhoneNumber"
+		        @getphonenumber="getPhoneNumber"
+		      >
+		        确定授权
+		      </button>
+		    </view>
+		  </view>
+		</u-popup>
+		
+	</view>
+</template>
+
+<script>
+	import {mapState} from 'vuex';
+	import modalDialog from '@/components/modalDialog.vue';
+	// import dragButton from '@/components/drag-button.vue';
+	import { uploadImg } from '@/api/axios.js';
+	
+	export default {
+		components:{
+			modalDialog,
+			// dragButton
+		},
+		data() {
+			return {
+				isShowPhoneDialog: false,
+				imageUrl: this.$imageUrl,
+				configInfo: uni.getStorageSync('configInfo'),
+				detail: {}, // 信息详情
+				myManagerDetail: {}, // 我的客户经理信息
+				count: {}, // 订单数量统计
+				scrollTop: 0, // 滚动高度（用于控制自定义导航）
+				isCustom: false, // 是否显示自定义导航
+				isManagerDialog: false, // 是否显示联系客户经理弹窗
+				
+				isShowInfoDialog: false, // 是否显示获取用户信息弹窗
+				infoForm: {
+					avatar: '',
+					nickname: '',
+				},
+				keyilingqude:false,
+			}
+		},
+		computed:{
+			...mapState(['userInfo', 'isLogin', 'userId']),
+			cuStyle(){
+				return `height:${this.CustomBar-this.StatusBar}px; padding-top:${this.StatusBar}px;`
+			},
+			isServiceUser() { // 是否业务员
+				return this.detail.type === 'SERVICE';
+			},
+			isHeadUser() { // 是否团长
+				return false //this.detail.promotionGroupLeader;
+			},
+			isExamineUser() { // 是否审核人员
+				return this.detail.promotionApplyExamineby;
+			},
+			isInnerrUser() { // 是否内部人员
+				return this.detail.innerr;
+			},
+			hasExchangeCode() { // 是否有优惠码权限
+				return this.detail.isExchangeCode;
+			},
+		},
+		watch: {
+			scrollTop() {
+				if(this.scrollTop > 100) {
+					this.isCustom = true;
+				}else {
+					this.isCustom = false;
+				}
+			}
+		},
+		onLoad() {
+			if(!this.isLogin) {
+				uni.navigateTo({
+					url: '/pages/login/index'
+				})
+			}
+		},
+		onShow() {
+			this.$axios({
+				url: '/couponNew/list/all',
+				method: 'get',
+				params: {
+					userId: this.userId
+				},
+			}).then(res => {
+				this.keyilingqude = !!res.data.length
+			})
+			
+			if(this.userId && this.isLogin) {
+				this.getDetail();
+				this.getCount();
+			}
+			
+			// this.$refs.dragButton.init();
+		},
+		onPageScroll(res) {
+			this.scrollTop = res.scrollTop;
+		},
+		methods: {
+			
+			// 获取手机号
+			getPhoneNumber(e) {
+				if(e?.detail?.iv &&e?.detail?.encryptedData){
+					this.$axios({
+					  url: '/user/mobile/grant',
+					  params: {
+						userId: this.userId,
+						iv: e.detail.iv,
+						encryptedData: e.detail.encryptedData,
+					  },
+					}).then((res) => {
+					  uni.setStorageSync('token', res.data.token);
+					  uni.setStorageSync('isActiveLogout', false);
+            this.isShowPhoneDialog = false;
+            this.$getUserInfo();
+					});
+				}
+			},
+			
+			
+			// 获取个人信息
+			async getDetail() {
+				this.detail = await this.$getUserInfo();
+				
+				if(!this.detail.openId) {
+					return uni.navigateTo({
+						url: '/pages/login/index?isNotOpenid=' + true
+					})
+				}
+			},
+			
+			// 获取订单数量
+			getCount() {
+				this.$axios({
+					url: '/order/count',
+					method: 'get',
+					params: {
+						userId: this.userId
+					}
+				}).then(res => {
+					this.count = res.data;
+				})
+			},
+			
+			// 跳转页面
+			navigatePage(url) {
+				if(!this.isLogin) {
+					return uni.navigateTo({
+						url: '/pages/login/index'
+					})
+				}
+				if(!url) {
+					return this.$toast('跳转链接错误');
+				}
+				uni.navigateTo({
+					url
+				})
+			},
+			
+			// 我的客户经理
+			toMyManager() {
+				if(!this.isLogin) {
+					return uni.navigateTo({
+						url: '/pages/login/index'
+					})
+				}
+				this.$axios({
+					url: '/user/parent',
+					method: 'get',
+					params: {
+						userId: this.userId
+					}
+				}).then(res => {
+					if(!res.data) {
+						return this.$toast('您暂无客户经理');
+					}else {
+						this.myManagerDetail = res.data;
+						this.isManagerDialog = true;
+					}
+				})
+			},
+			
+			// 拨打电话
+			callPhone(number) {
+				uni.makePhoneCall({
+				    phoneNumber: number
+				});
+			},
+			
+			// 去我的订单列表
+			toMyOrder(tab) {
+				if(!this.isLogin) {
+					return uni.navigateTo({
+						url: '/pages/login/index'
+					})
+				}
+				uni.navigateTo({
+					url: '/pages/mine/order/list?tab=' + tab
+				})
+			},
+			
+			// 选择头像
+			chooseAvatar(e) {
+				uploadImg({
+					path: e.detail.avatarUrl,
+					name: e.detail.avatarUrl,
+				}).then(data => {
+					this.infoForm.avatar = data.url;
+				})
+			},
+			
+			// 用户昵称审核完毕
+			getNickname(e) {
+				this.infoForm.nickname = e.detail.value;
+			},
+			
+			// 保存用户信息
+			saveUserInfo() {
+				if(!this.infoForm.avatar) {
+					return this.$toast('请先上传头像');
+				}
+				if(!this.infoForm.nickname) {
+					return this.$toast('请先输入昵称');
+				}
+				
+				this.$axios({
+					url: '/user/userinfo/save',
+					params: {
+						userId: this.userId,
+						avatarUrl: this.infoForm.avatar,
+						nickName: this.infoForm.nickname,
+					},
+				}).then(res => {
+					this.isShowInfoDialog = false;
+					this.getDetail();
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		box-sizing: border-box;
+		padding-bottom: 80rpx;
+	}
+	.top-container {
+		position: relative;
+		.bg {
+			display: block;
+			width: 750rpx;
+			position: absolute;
+			top: 0;
+			z-index: 0;
+		}
+		.content {
+			width: 710rpx;
+			padding: 0 20rpx;
+			position: relative;
+			z-index: 1;
+		}
+		.title {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			color: #FFFFFF;
+			font-size: 36rpx;
+		}
+		.user {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			margin-top: 40rpx;
+			.left {
+				display: flex;
+				align-items: center;
+				image {
+					width: 120rpx;
+					height: 120rpx;
+					border-radius: 50%;
+					border: 2px solid #FFFFFF;
+					margin-right: 20rpx;
+				}
+				.main {
+					width: 360rpx;
+					display: flex;
+					flex-direction: column;
+					.name {
+						font-size: 32rpx;
+						color: #FFFFFF;
+						line-height: 36rpx;
+					}
+					.text {
+						font-size: 24rpx;
+						color: #FFFFFF;
+						line-height: 30rpx;
+						margin-top: 12rpx;
+					}
+				}
+			}
+			.code {
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				justify-content: center;
+				flex-shrink: 0;
+				margin-right: 30rpx;
+				image {
+					width: 52rpx;
+					height: 52rpx;
+					display: block;
+				}
+				text {
+					font-size: 20rpx;
+					line-height: 20rpx;
+					color: #FFFFFF;
+					margin-top: 12rpx;
+				}
+			}
+		}
+		.order {
+			margin-top: 20rpx;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			.top {
+				height: 88rpx;
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				padding: 0 20rpx;
+				.left {
+					font-size: 32rpx;
+					color: #333333;
+				}
+				.right {
+					display: flex;
+					align-items: center;
+					font-size: 24rpx;
+					color: #999999;
+					image {
+						width: 16rpx;
+						height: 28rpx;
+						margin-left: 12rpx;
+					}
+				}
+			}
+			.list {
+				display: flex;
+				border-top: 1px solid #eaeaea;
+				padding: 10rpx 0 24rpx;
+				.item {
+					width: 20%;
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					.image {
+						position: relative;
+					}
+					image {
+						width: 60rpx;
+						height: 60rpx;
+						display: block;
+					}
+					text {
+						position: absolute;
+						right: -12rpx;
+						top: -8rpx;
+						z-index: 11;
+						background: #FF3F42;
+						width: 32rpx;
+						height: 32rpx;
+						line-height: 32rpx;
+						text-align: center;
+						border-radius: 32rpx;
+						font-size: 20rpx;
+						color: #FFFFFF;
+					}
+					view {
+						font-size: 28rpx;
+						line-height: 28rpx;
+						color: #333333;
+						margin-top: 10rpx;
+					}
+				}
+			}
+		}
+	}
+	.list-container {
+		padding: 0 20rpx;
+		margin-top: 20rpx;
+		padding-bottom: 20rpx;
+		.group {
+			margin-bottom: 20rpx;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			overflow: hidden;
+			&:last-child {
+				margin-bottom: 0;
+			}
+			.item {
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				height: 88rpx;
+				border-bottom: 1px solid #eaeaea;
+				padding: 0 20rpx;
+				background: #FFFFFF;
+				color: #333333;
+				&:last-child {
+					border: none;
+				}
+				&::after {
+					border: none;
+				}
+				.left {
+					display: flex;
+					align-items: center;
+					font-size: 30rpx;
+					image {
+						width: 40rpx;
+						height: 40rpx;
+						margin-right: 20rpx;
+					}
+				}
+				.right {
+					image {
+						width: 16rpx;
+						height: 28rpx;
+						display: block;
+					}
+				}
+			}
+		}
+	}
+	
+	.info-dialog {
+		padding: 40rpx 40rpx 80rpx;
+		box-sizing: border-box;
+		.content {
+			.title {
+				font-size: 32rpx;
+				font-weight: 500;
+			}
+			.text {
+				font-size: 24rpx;
+				color: #999999;
+				margin-top: 20rpx;
+			}
+		}
+		.form {
+			.item {
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				margin-top: 30rpx;
+				.label {
+					color: #666666;
+				}
+				.value {
+					button {
+						padding: 0;
+						background: none;
+						border: none;
+						&::after {
+							border: none;
+						}
+					}
+					input {
+						width: 500rpx;
+						height: 68rpx;
+						text-align: right !important;
+					}
+					image {
+						width: 88rpx;
+						height: 88rpx;
+						border-radius: 88rpx;
+						display: block;
+					}
+					.empty {
+						width: 88rpx;
+						height: 88rpx;
+						border-radius: 88rpx;
+						background: #f5f5f5;
+						text-align: center;
+						line-height: 88rpx;
+						font-size: 24rpx;
+						color: #999999;
+					}
+				}
+			}
+		}
+		.btn {
+			display: flex;
+			justify-content: center;
+			margin-top: 60rpx;
+			button::after { 
+				border: none;
+			}
+			button {
+				width: 180rpx;
+				height: 70rpx;
+				line-height: 70rpx;
+				margin: 0;
+				font-size: 28rpx;
+				margin: 0 30rpx;
+				&:first-child {
+					background: #f5f5f5;
+					color: $theme-color;
+				}
+				&:last-child {
+					background: $theme-color;
+					color: #FFFFFF;
+				}
+			}
+		}
+	}
+
+	
+	.phone-dialog {
+	  padding: 40rpx;
+	  box-sizing: border-box;
+	  .content {
+	    margin-top: 30rpx;
+	    margin-bottom: 30rpx;
+	    line-height: 50rpx;
+	    text {
+	      color: #9d9d9d;
+	    }
+	  }
+	  .btn {
+	    display: flex;
+	    justify-content: center;
+	    margin-top: 60rpx;
+	    button::after {
+	      border: none;
+	    }
+	    button {
+	      width: 180rpx;
+	      height: 70rpx;
+	      line-height: 70rpx;
+	      margin: 0;
+	      font-size: 28rpx;
+	      margin: 0 30rpx;
+	      &:first-child {
+	        background: #f5f5f5;
+	        color: #00ba5c;
+	      }
+	    }
+	  }
+	}
+</style>

pages/mine/mallCode.vue

@@ -1,169 +1,169 @@
-<template>
-	<view class="app-container">
-		<view class="card-container">
-			<view class="top">
-				<view class="title">请扫描进入商城</view>
-				<view class="main">
-					<image src="/static/bg_logo.png" class="mall"></image>
-					<image :src="qrCode" class="code"></image>
-					<view class="btn" @tap="save()">保存二维码</view>
-				</view>
-				<view class="info">
-					<view class="name">{{configInfo.minAppName}}</view>
-					<view class="text">小程序二维码</view>
-				</view>
-			</view>
-			<view class="bottom">
-				<image :src="configInfo.minLogo2" mode="heightFix"></image>
-			</view>
-		</view>
-		<view class="tips">扫一扫二维码，进入商城小程序</view>
-	</view>
-</template>
-
-<script>
-	import {mapState} from 'vuex';
-	
-	export default {
-		data() {
-			return {
-				configInfo: uni.getStorageSync('configInfo'),
-				qrCode: '',
-			}
-		},
-		computed:{
-			...mapState(['userInfo', 'isLogin', 'userId']),
-		},
-		
-		onLoad() {
-			this.getDetail();
-		},
-		
-		methods: {
-			// 获取个人信息
-			getDetail() {
-				this.$axios({
-					url: '/user/qrcode/bind',
-					method: 'get',
-					params: {
-						userId: this.userId
-					}
-				}).then(res => {
-					this.qrCode = res.data;
-				})
-			},
-			
-			// 保存图片
-			save() {
-				uni.downloadFile({
-				    url: this.qrCode,
-				    success: (res) => {
-						uni.saveImageToPhotosAlbum({
-							filePath: res.tempFilePath,
-							success: () => {
-								this.$successToast('保存成功');
-							}
-						});
-					}
-				})
-			}
-		}
-	}
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #F4F2F2;
-		padding: 40rpx 40rpx 0;
-		box-sizing: border-box;
-	}
-	.tips {
-		font-size: 28rpx;
-		line-height: 28rpx;
-		color: #999999;
-		text-align: center;
-		margin: 60rpx 0 20rpx;
-	}
-	.card-container {
-		width: 670rpx;
-		border-radius: 20rpx;
-		background: #FFFFFF;
-		box-shadow: -20px 0px 40px 20px rgba(155,155,155,0.30); 
-		overflow: hidden;
-		.top {
-			background: #F65759;
-			display: flex;
-			flex-direction: column;
-			align-items: center;
-			height: 800rpx;
-			.title {
-				font-family: 'PingFang SC';
-				font-size: 50rpx;
-				color: #FFFFFF;
-				line-height: 160rpx;
-			}
-			.main {
-				position: relative;
-				display: flex;
-				margin-top: 20rpx;
-				.mall {
-					width: 600rpx;
-					height: 600rpx;
-					display: block;
-				}
-				.code {
-					width: 360rpx;
-					height: 360rpx;
-					display: block;
-					position: absolute;
-					top: 0;
-					left: 120rpx;
-					border-radius: 5rpx;
-				}
-				.btn {
-					width: 160rpx;
-					height: 48rpx;
-					display: block;
-					position: absolute;
-					top: 400rpx;
-					left: 220rpx;
-					border-radius: 5rpx;
-					border: 1px solid #ffffff;
-					line-height: 48rpx;
-					text-align: center;
-					font-size: 24rpx;
-					color: #FFFFFF;
-					opacity: .8;
-				}
-			}
-			.info {
-				width: 600rpx;
-				text-align: right;
-				margin-top: -100rpx;
-				.name {
-					font-size: 36rpx;
-					color: #FFFFFF;
-					height: 36rpx;
-					line-height: 36rpx;
-				}
-				.text {
-					font-size: 28rpx;
-					color: #FFFFFF;
-					height: 28rpx;
-					line-height: 28rpx;
-					margin-top: 20rpx;
-				}
-			}
-		}
-		.bottom {
-			height: 140rpx;
-			display: flex;
-			justify-content: center;
-			align-items: center;
-			image {
-				height: 60rpx;
-				display: block;
-			}
-		}
-	}
-</style>
+<template>
+	<view class="app-container">
+		<view class="card-container">
+			<view class="top">
+				<view class="title">请扫描进入商城</view>
+				<view class="main">
+					<image src="/static/bg_logo.png" class="mall"></image>
+					<image :src="qrCode" class="code"></image>
+					<view class="btn" @tap="save()">保存二维码</view>
+				</view>
+				<view class="info">
+					<view class="name">{{configInfo.minAppName}}</view>
+					<view class="text">小程序二维码</view>
+				</view>
+			</view>
+			<view class="bottom">
+				<image :src="configInfo.minLogo2" mode="heightFix"></image>
+			</view>
+		</view>
+		<view class="tips">扫一扫二维码，进入商城小程序</view>
+	</view>
+</template>
+
+<script>
+	import {mapState} from 'vuex';
+	
+	export default {
+		data() {
+			return {
+				configInfo: uni.getStorageSync('configInfo'),
+				qrCode: '',
+			}
+		},
+		computed:{
+			...mapState(['userInfo', 'isLogin', 'userId']),
+		},
+		
+		onLoad() {
+			this.getDetail();
+		},
+		
+		methods: {
+			// 获取个人信息
+			getDetail() {
+				this.$axios({
+					url: '/user/qrcode/bind',
+					method: 'get',
+					params: {
+						userId: this.userId
+					}
+				}).then(res => {
+					this.qrCode = res.data;
+				})
+			},
+			
+			// 保存图片
+			save() {
+				uni.downloadFile({
+				    url: this.qrCode,
+				    success: (res) => {
+						uni.saveImageToPhotosAlbum({
+							filePath: res.tempFilePath,
+							success: () => {
+								this.$successToast('保存成功');
+							}
+						});
+					}
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		padding: 40rpx 40rpx 0;
+		box-sizing: border-box;
+	}
+	.tips {
+		font-size: 28rpx;
+		line-height: 28rpx;
+		color: #999999;
+		text-align: center;
+		margin: 60rpx 0 20rpx;
+	}
+	.card-container {
+		width: 670rpx;
+		border-radius: 20rpx;
+		background: #FFFFFF;
+		box-shadow: -20px 0px 40px 20px rgba(155,155,155,0.30); 
+		overflow: hidden;
+		.top {
+			background: #F65759;
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+			height: 800rpx;
+			.title {
+				font-family: 'PingFang SC';
+				font-size: 50rpx;
+				color: #FFFFFF;
+				line-height: 160rpx;
+			}
+			.main {
+				position: relative;
+				display: flex;
+				margin-top: 20rpx;
+				.mall {
+					width: 600rpx;
+					height: 600rpx;
+					display: block;
+				}
+				.code {
+					width: 360rpx;
+					height: 360rpx;
+					display: block;
+					position: absolute;
+					top: 0;
+					left: 120rpx;
+					border-radius: 5rpx;
+				}
+				.btn {
+					width: 160rpx;
+					height: 48rpx;
+					display: block;
+					position: absolute;
+					top: 400rpx;
+					left: 220rpx;
+					border-radius: 5rpx;
+					border: 1px solid #ffffff;
+					line-height: 48rpx;
+					text-align: center;
+					font-size: 24rpx;
+					color: #FFFFFF;
+					opacity: .8;
+				}
+			}
+			.info {
+				width: 600rpx;
+				text-align: right;
+				margin-top: -100rpx;
+				.name {
+					font-size: 36rpx;
+					color: #FFFFFF;
+					height: 36rpx;
+					line-height: 36rpx;
+				}
+				.text {
+					font-size: 28rpx;
+					color: #FFFFFF;
+					height: 28rpx;
+					line-height: 28rpx;
+					margin-top: 20rpx;
+				}
+			}
+		}
+		.bottom {
+			height: 140rpx;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			image {
+				height: 60rpx;
+				display: block;
+			}
+		}
+	}
+</style>

pages/mine/order/detail.vue

@@ -0,0 +1,1460 @@
+<template>
+  <view class="app-container">
+    <no-data v-if="isLoading" :showText="'加载中'"></no-data>
+    <no-data v-if="!isLoading && noData" :showText="'加载失败'"></no-data>
+    <block v-if="!isLoading && !noData">
+      <view class="status-container" v-if="detail.orderStatus == 'NOPAY'"
+        >待付款，30分钟内未付款将会关闭订单</view
+      >
+      <view class="status-container" v-if="detail.orderStatus == 'DFH'"
+        >买家已付款，待卖家发货</view
+      >
+      <view class="status-container" v-if="detail.orderStatus == 'YFH'"
+        >卖家已发货，已签收状态将在签收7日后自动确认</view
+      >
+      <view class="status-container" v-if="detail.orderStatus == 'OVER'"
+        >已确定收货，7日后将关闭退款通道</view
+      >
+      <view class="status-container" v-if="detail.orderStatus == 'CLOSE'"
+        >订单已关闭</view
+      >
+      <view class="status-container" v-if="detail.orderStatus == 'REFUND'"
+        >订单售后中</view
+      >
+      <view class="status-container" v-if="detail.orderStatus == 'TIMEOUT'"
+        >订单超时未支付</view
+      >
+
+      <view class="main-container">
+        <view
+          class="logistics-container card"
+          v-if="detail.orderStatus == 'YFH' || detail.orderStatus == 'OVER'"
+          @tap="toLogistics"
+        >
+          <view class="icon"
+            ><image src="@/static/icon/logistics.png"></image
+          ></view>
+          <view class="main" v-if="hasLogistics">
+            <view>{{ logisticsData[0].context }}</view>
+            <view>{{ logisticsData[0].time }}</view>
+          </view>
+          <view class="main" v-else>
+            <view class="noData">暂无物流信息</view>
+          </view>
+          <view class="right"
+            ><image src="@/static/icon/right.png"></image
+          ></view>
+        </view>
+
+        <view class="address-container card">
+          <view class="icon"
+            ><image src="@/static/icon/address.png"></image
+          ></view>
+          <view class="right">
+            <view class="name"
+              >{{ detail.receUserName
+              }}<text>{{ detail.recePhone }}</text></view
+            >
+            <view class="address ellipsis-2"
+              >{{ detail.province }}{{ detail.city }}{{ detail.area
+              }}{{ detail.street }}{{ detail.receAddress
+              }}{{ detail.houseNo ? detail.houseNo : '' }}</view
+            >
+          </view>
+        </view>
+
+        <view class="goods-container card">
+          <view class="title">商品信息</view>
+          <block v-for="(item, index) in detail.orderDetails" :key="index">
+            <view class="item" @tap="toGoodsDetail(item.goodsId)">
+              <image
+                v-if="
+					item.goods &&
+					item.goods.logo &&
+					$compareTime(item.goods.logoStartTime, item.goods.logoEndTime) &&
+					item.goods.mergeImage
+                "
+                :src="item.goods.mergeImage"
+                mode="aspectFill"
+              ></image>
+              <image v-else :src="item.imgUrl" mode="aspectFill"></image>
+              <view class="right">
+                <view class="top">
+                  <view class="name ellipsis-2">{{ item.goodsName }}</view>
+                  <view class="des">{{ item.goodsSpecValue }}</view>
+                </view>
+                <view class="bottom">
+                  <view class="price">￥{{ item.price | numToFixed }}</view>
+                  <view class="num">x{{ item.num }}</view>
+                </view>
+              </view>
+            </view>
+          </block>
+        </view>
+
+        <view class="peisong-container card">
+          <view class="top">
+            <view class="left">配送方式</view>
+            <view class="right" v-if="detail.freight == 0">快递包邮</view>
+            <view class="right" v-if="detail.freight != 0">快递自费</view>
+          </view>
+          <view class="bottom">
+            <view class="left">买家留言</view>
+            <view class="right">{{ detail.buyerMsg }}</view>
+          </view>
+        </view>
+
+        <view class="total-container card">
+          <view class="top">
+            <view class="item">
+              <view>商品金额</view>
+              <view>￥{{ detail.totalProductAmount | numToFixed }}</view>
+            </view>
+            <view class="item">
+              <view>运费</view>
+              <view>￥{{ detail.freight | numToFixed }}</view>
+            </view>
+            <view class="item">
+              <view>优惠券</view>
+              <view>-￥{{ detail.couponValue | numToFixed }}</view>
+            </view>
+            <view class="item" v-if="detail.promotionDiscountRate">
+              <view>折扣优惠</view>
+              <view
+                >-¥{{ detail.promotionDiscountAmount | numToFixed }}({{
+                  detail.promotionDiscountRate * 10
+                }}折)</view
+              >
+            </view>
+          </view>
+          <view class="total"
+            >订单总额：<text>￥{{ detail.payAmount | numToFixed }}</text></view
+          >
+        </view>
+
+        <view class="order-container card">
+          <view class="title">订单信息</view>
+          <view class="item1">
+            <view class="left">
+              <view class="label">订单编号</view>
+              <view class="value">{{ detail.orderId }}</view>
+            </view>
+            <view class="copy" @tap="copy(detail.orderId)">复制</view>
+          </view>
+          <view class="item2">
+            <view class="label">创建时间</view>
+            <view class="value">{{ detail.createTime }}</view>
+          </view>
+          <view class="item2" v-if="detail.payTime">
+            <view class="label">支付时间</view>
+            <view class="value">{{ detail.payTime }}</view>
+          </view>
+          <view class="item2" v-if="detail.payTime">
+            <view class="label">支付方式</view>
+            <view class="value">{{ detail.payType }}</view>
+          </view>
+          <view class="item2" v-if="detail.deliverTime">
+            <view class="label">发货时间</view>
+            <view class="value">{{ detail.deliverTime }}</view>
+          </view>
+          <view class="item2" v-if="detail.overTime">
+            <view class="label">完成时间</view>
+            <view class="value">{{ detail.overTime }}</view>
+          </view>
+          <view class="item2" v-if="detail.exchangeCode">
+            <view class="label">优惠金额</view>
+            <view class="value">{{
+              detail.exchangeSubAmount | numToFixed
+            }}</view>
+          </view>
+          <view class="item2" v-if="detail.exchangeCode">
+            <view class="label">优惠码</view>
+            <view class="value">{{ detail.exchangeCode }}</view>
+          </view>
+        </view>
+
+        <!-- 底部按钮：待付款 -->
+        <view class="bottom-container" v-if="detail.orderStatus == 'NOPAY'">
+          <view class="button gray" @tap="isCancelDialog = true">取消订单</view>
+          <view class="button red" @tap="submitOrder(detail)">立即付款</view>
+        </view>
+        <!-- 底部按钮：待发货 -->
+        <view class="bottom-container" v-if="detail.orderStatus == 'DFH'">
+          <view class="button white" @tap="remindShipment">提醒发货</view>
+          <view
+            class="button white"
+            v-if="checkCanReturn(detail.orderShareStatus)"
+            @tap="toApplyReturn"
+            >申请售后</view
+          >
+        </view>
+        <!-- 底部按钮：待收货 -->
+        <view class="bottom-container" v-if="detail.orderStatus == 'YFH'">
+          <view class="button gray" @tap="toLogistics">查看物流</view>
+          <view class="button red" @tap="isConfirmDialog = true">确认收货</view>
+          <view
+            class="button white"
+            v-if="checkCanReturn(detail.orderShareStatus)"
+            @tap="toApplyReturn"
+            >申请售后</view
+          >
+        </view>
+        <!-- 底部按钮：已完成 -->
+        <view class="bottom-container" v-if="detail.orderStatus == 'OVER'">
+          <view class="button gray" @tap="toLogistics">查看物流</view>
+          <view
+            class="button gray"
+            v-if="detail.tax && detail.orderTaxId"
+            @tap="toInvoiceDetail"
+            >查看发票</view
+          >
+          <view class="button white" v-else @tap="isInvoiceDialog = true"
+            >申请发票</view
+          >
+          <view
+            class="button white"
+            v-if="checkCanReturn(detail.orderShareStatus)"
+            @tap="toApplyReturn"
+            >申请售后</view
+          >
+          <view
+            class="button red"
+            v-if="!detail.commentService"
+            @tap="toEvaluate"
+            >评价</view
+          >
+        </view>
+        <!-- 底部按钮：售后中 -->
+        <view class="bottom-container" v-if="isReturnOrder">
+          <view class="button gray" @tap="toReturnDetail">售后详情</view>
+        </view>
+
+        <!-- 取消订单 -->
+        <modal-dialog
+          showText="确定要取消订单吗？"
+          :isShowDialog="isCancelDialog"
+          @cancel="isCancelDialog = false"
+          @confirm="confirmCancelOrder"
+        ></modal-dialog>
+
+        <!-- 确认收货 -->
+        <modal-dialog
+          showText="确定要确认收货吗？"
+          :isShowDialog="isConfirmDialog"
+          @cancel="isConfirmDialog = false"
+          @confirm="confirmReceipt"
+        ></modal-dialog>
+
+        <!-- 申请发票 -->
+        <view class="global-mask" v-show="isInvoiceDialog"></view>
+        <view
+          class="invoice-dialog"
+          v-show="isInvoiceDialog"
+          @tap="isShowCompanyList = false"
+        >
+          <view class="type-c">
+            <view class="top">
+              <view class="title">发票类型</view>
+              <image
+                src="@/static/icon/close.png"
+                @tap="isInvoiceDialog = false"
+              ></image>
+            </view>
+            <view class="list">
+              <view
+                class="item"
+                :class="taxType === false ? 'current' : ''"
+                @tap="taxType = false"
+                >增值税普通发票</view
+              >
+              <view
+                class="item"
+                :class="taxType === true ? 'current' : ''"
+                @tap="
+                  taxType = true;
+                  invoiceHeader = 2;
+                "
+                >增值税专用发票</view
+              >
+            </view>
+          </view>
+          <view class="header-c">
+            <view class="title">
+              <view>发票抬头</view>
+              <view class="button" @tap="getWxInvoice()">获取微信发票</view>
+            </view>
+            <view class="list">
+              <view
+                class="item"
+                :class="invoiceHeader == 1 ? 'current' : ''"
+                @tap="invoiceHeader = 1"
+                v-if="taxType === false"
+                >个人</view
+              >
+              <view
+                class="item"
+                :class="invoiceHeader == 2 ? 'current' : ''"
+                @tap="invoiceHeader = 2"
+                >公司</view
+              >
+            </view>
+            <view class="form" v-show="invoiceHeader == 1">
+              <view class="row">
+                <view class="label">个人名称</view>
+                <view class="input"
+                  ><input
+                    type="text"
+                    placeholder="请填写“个人”或您的姓名"
+                    v-model="invoiceForm.personName"
+                /></view>
+              </view>
+            </view>
+            <view class="form" v-show="invoiceHeader == 2">
+              <view class="row">
+                <view class="label">单位名称</view>
+                <view class="input">
+                  <input
+                    type="text"
+                    placeholder="请填写单位名称"
+                    v-model="invoiceForm.companyName"
+                    @focus="companyFocus"
+                  />
+                  <div class="companyList" v-show="isShowCompanyList">
+                    <block v-for="(item, index) in companyList" :key="index">
+                      <div class="item" @tap="chooseCompany(item)">
+                        {{ item.name }}
+                      </div>
+                    </block>
+                  </div>
+                </view>
+              </view>
+              <view class="row">
+                <view class="label">纳税人识别号</view>
+                <view class="input"
+                  ><input
+                    type="text"
+                    placeholder="请填写纳税人识别号"
+                    v-model="invoiceForm.payerNum"
+                /></view>
+              </view>
+              <view class="more" v-if="taxType === false">
+                <view>更多选填项</view>
+                <view class="right" v-if="isOpen" @tap="isOpen = !isOpen"
+                  >收起<image src="../../../static/icon/arrow_2.png"></image
+                ></view>
+                <view class="right" v-else @tap="isOpen = !isOpen"
+                  >展开<image src="../../../static/icon/arrow_1.png"></image
+                ></view>
+              </view>
+              <block v-if="isOpen">
+                <view class="row">
+                  <view class="label">注册地址</view>
+                  <view class="input"
+                    ><input
+                      type="text"
+                      placeholder="请填写注册地址"
+                      v-model="invoiceForm.regAddress"
+                  /></view>
+                </view>
+                <view class="row">
+                  <view class="label">注册电话</view>
+                  <view class="input"
+                    ><input
+                      type="text"
+                      placeholder="请填写注册电话"
+                      v-model="invoiceForm.regPhone"
+                  /></view>
+                </view>
+                <view class="row">
+                  <view class="label">开户银行</view>
+                  <view class="input"
+                    ><input
+                      type="text"
+                      placeholder="请填写开户银行"
+                      v-model="invoiceForm.bank"
+                  /></view>
+                </view>
+                <view class="row">
+                  <view class="label">银行帐号</view>
+                  <view class="input"
+                    ><input
+                      type="text"
+                      placeholder="请填写银行帐号"
+                      v-model="invoiceForm.account"
+                  /></view>
+                </view>
+              </block>
+            </view>
+          </view>
+          <view class="header-c">
+            <view class="title">收票人信息</view>
+            <view class="form">
+              <view class="row" v-if="taxType === true">
+                <view class="label">收票人姓名</view>
+                <view class="input"
+                  ><input
+                    type="text"
+                    placeholder="请填写联系姓名"
+                    v-model="invoiceForm.name"
+                /></view>
+              </view>
+              <view class="row" v-if="taxType === true">
+                <view class="label">收票人手机</view>
+                <view class="input"
+                  ><input
+                    type="text"
+                    placeholder="请填写联系手机"
+                    v-model="invoiceForm.phone"
+                /></view>
+              </view>
+              <view class="row">
+                <view class="label">收票人邮箱</view>
+                <view class="input"
+                  ><input
+                    type="text"
+                    placeholder="请填写收票邮箱"
+                    v-model="invoiceForm.email"
+                /></view>
+              </view>
+              <view class="row" v-if="taxType === true">
+                <view class="label">收票人地址</view>
+                <view class="input"
+                  ><input
+                    type="text"
+                    placeholder="请填写收票地址"
+                    v-model="invoiceForm.address"
+                /></view>
+              </view>
+            </view>
+          </view>
+          <view class="content-c">
+            <view class="title"
+              >发票内容<text
+                >发票内容选项已根据税法调整，具体请以实际展示为准</text
+              ></view
+            >
+            <view class="list">
+              <view class="item">商品内容</view>
+            </view>
+            <view class="tips"
+              >发票内容将显示详情商品名称与价格信息，发票金额为实际支付金额</view
+            >
+            <view class="button" @tap="submitInvoice">确定</view>
+          </view>
+        </view>
+      </view>
+    </block>
+    <zhifutanchuan
+      v-if="detail_"
+      :orderInfo="orderInfo"
+      @PAY_TYPE_STR="PAY_TYPE_STR"
+    />
+  </view>
+</template>
+
+<script>
+import { mapState } from 'vuex';
+import modalDialog from '@/components/modalDialog.vue';
+import zhifutanchuan from '@/components/zhifutanchuan.vue';
+export default {
+  components: {
+    modalDialog,
+    zhifutanchuan,
+  },
+  data() {
+    return {
+      detail_: null,
+      orderInfo: null,
+      isLoading: true,
+      noData: true,
+      orderId: null, // 订单id
+      orderRefundId: null, // 售后订单id
+      isReturnOrder: false, // 是否售后订单
+      detail: {}, // 订单详情
+      isCancelDialog: false, // 是否显示取消订单弹窗
+      isConfirmDialog: false, // 是否显示确认收货弹窗
+      isInvoiceDialog: false, // 是否显示申请发票弹窗
+      taxType: false,
+      invoiceHeader: 1, // 发票类型：1个人，2公司
+      isOpen: false, // 是否展开
+      invoiceForm: {
+        // 发票表单数据
+        // 发票抬头
+        personName: '', // 个人 - 名称
+        companyName: '', // 公司 - 名称
+        payerNum: '', // 公司 - 识别号
+        regAddress: '', // 公司 - 注册地址
+        regPhone: '', // 公司 - 注册电话
+        bank: '', // 公司 - 开户银行
+        account: '', // 公司 - 银行账号
+        // 收票人信息
+        name: '', // 姓名
+        phone: '', // 手机
+        email: '', // 邮箱
+        address: '', // 地址
+      },
+      canClickSave: true, // 能否点击提交
+      logisticsData: [], // 物流信息
+      hasLogistics: true, // 是否有物流信息
+      canRemindShipment: true, // 能否点击提醒发货
+      companyList: [],
+      isShowCompanyList: false,
+      isChooseCompany: false,
+    };
+  },
+
+  computed: {
+    ...mapState(['userInfo', 'isLogin', 'userId']),
+  },
+
+  watch: {
+    'invoiceForm.companyName'() {
+      if (this.isChooseCompany) {
+        this.isChooseCompany = false;
+        return false;
+      }
+      this.getCompanyList();
+    },
+    taxType() {
+      if (this.taxType === true) {
+        this.isOpen = true;
+      } else {
+        this.isOpen = false;
+      }
+    },
+  },
+
+  onLoad({ orderId, orderRefundId }) {
+    console.log(orderId, '--------------');
+    this.orderId = orderId;
+    if (!!orderRefundId) {
+      this.isReturnOrder = true;
+      this.orderRefundId = orderRefundId;
+    }
+    this.getOrderDetail();
+
+    uni.$on('refreshOrderDetail', (data) => {
+      if (data) {
+        this.isReturnOrder = true;
+        this.orderRefundId = data;
+      } else {
+        this.isReturnOrder = false;
+        this.orderRefundId = null;
+      }
+      this.getOrderDetail();
+    });
+  },
+
+  methods: {
+    getOrderDetail() {
+      let url = '',
+        params = {};
+      if (this.isReturnOrder) {
+        url = '/order/refund/detail';
+        params = {
+          orderRefundId: this.orderRefundId,
+        };
+      } else {
+        url = '/order/detail';
+        params = {
+          orderId: this.orderId,
+        };
+      }
+      console.log(params, '------------------------');
+      this.$axios({
+        url,
+        method: 'get',
+        params,
+      })
+        .then((res) => {
+          this.noData = false;
+          this.isLoading = false;
+          this.detail = res.data;
+          this.getLogisticsData();
+        })
+        .catch((res) => {
+          this.noData = true;
+          this.isLoading = false;
+        });
+    },
+
+    // 检查是否可以申请售后（根据orderShareStatus）
+    checkCanReturn(status) {
+      if (!status || status === 'OVER' || status === 'CANCEL') {
+        return false;
+      } else {
+        return true;
+      }
+    },
+
+    // 获取物流信息
+    getLogisticsData() {
+      this.$axios({
+        url: '/common/express',
+        method: 'get',
+        params: {
+          companyCode: this.detail.companyCode
+            ? this.detail.companyCode
+            : 'shunfeng',
+          logisticsNo: this.detail.logisticsNo,
+        },
+      }).then((res) => {
+        if (res.code == 200 && res.data.length >= 1) {
+          this.logisticsData = res.data;
+        } else if (res.code == 1100 || res.data.length < 1) {
+          this.hasLogistics = false;
+        }
+      });
+    },
+
+    // 去商品详情
+    toGoodsDetail(id) {
+      uni.navigateTo({
+        url: '/packageGoods/pages/detail?id=' + id,
+      });
+    },
+
+    // 确认取消订单
+    confirmCancelOrder() {
+      this.$axios({
+        url: '/order/cancel',
+        method: 'get',
+        params: {
+          orderId: this.orderId,
+        },
+      }).then((res) => {
+        this.getOrderDetail();
+        this.isCancelDialog = false;
+        this.$successToast('取消订单成功');
+        uni.$emit('refreshOrderList');
+      });
+    },
+
+    // 确认收货
+    confirmReceipt() {
+      this.$axios({
+        url: '/order/ack',
+        params: {
+          orderId: this.orderId,
+        },
+      }).then((res) => {
+        this.getOrderDetail();
+        this.isConfirmDialog = false;
+        this.$successToast('确认收货成功');
+        uni.$emit('refreshOrderList');
+      });
+    },
+
+    PAY_TYPE_STR(ewPam) {
+      this.payOrder(ewPam);
+    },
+
+    submitOrder(item) {
+      let that = this;
+      this.orderInfo = item;
+      this.detail_ = true;
+    },
+
+    // 立即付款
+    payOrder(ewPam = {}) {
+      let that = this;
+      this.$axios({
+        url: '/order/wait/pay',
+        params: {
+          ...ewPam,
+          userId: this.userId,
+          orderId: this.orderInfo.orderId,
+        },
+        isLoading: 1,
+      }).then((res) => {
+        that.orderId = res.data.id;
+        if (ewPam.payType == '微信支付') {
+          uni.getProvider({
+            service: 'payment',
+            success: (e) => {
+              uni.requestPayment({
+                provider: e.provider[0],
+                orderInfo: res.data,
+                timeStamp: res.data.timeStamp,
+                nonceStr: res.data.nonceStr,
+                package: res.data.payPackage,
+                signType: 'MD5',
+                paySign: res.data.paySign,
+                success: (payRes) => {
+                  this.detail_ = false;
+                  this.orderInfo = null;
+                  that.getOrderDetail();
+                  that.$successToast('支付成功');
+                  uni.$emit('refreshOrderList');
+                },
+                fail: (err) => {
+                  this.detail_ = false;
+                  this.orderInfo = null;
+                  that.$toast('支付失败');
+                  that.getOrderDetail();
+                  uni.$emit('refreshOrderList');
+                },
+              });
+            },
+          });
+        } else if (
+          ewPam.payType == '云闪付' &&
+          res?.data?.umsMiniRep?.miniPayRequest?.cqpMpAppId
+        ) {
+          uni.navigateToMiniProgram({
+            appId: res.data?.umsMiniRep?.miniPayRequest?.cqpMpAppId,
+            path: res.data?.umsMiniRep?.miniPayRequest?.cqpMpPath,
+            success(res) {
+              uni.onAppShow(({ scene }) => {
+                if (scene == 1038) {
+                  that.$successToast('支付成功');
+                }
+				this.detail_ = false;
+                this.orderInfo = null;
+                that.getOrderDetail();
+				uni.reLaunch({
+				  url: '/pages/mine/order/detail?orderId=' + that.orderId,
+				});
+                uni.$emit('refreshOrderList');
+				uni.offAppShow();
+              });
+            },
+          });
+        }
+      });
+    },
+
+    // // 立即付款
+    // payOrder() {
+    //   let that = this;
+    //   this.$axios({
+    //     url: '/order/wait/pay',
+    //     params: {
+    //       userId: this.userId,
+    //       orderId: this.orderId,
+    //     },
+    //     isLoading: 1,
+    //   }).then((res) => {
+    //     uni.getProvider({
+    //       service: 'payment',
+    //       success: (e) => {
+    //         uni.requestPayment({
+    //           provider: e.provider[0],
+    //           orderInfo: res.data,
+    //           timeStamp: res.data.timeStamp,
+    //           nonceStr: res.data.nonceStr,
+    //           package: res.data.payPackage,
+    //           signType: 'MD5',
+    //           paySign: res.data.paySign,
+    //           success: (res) => {
+    //             that.getOrderDetail();
+    //             that.$successToast('支付成功');
+    //             uni.$emit('refreshOrderList');
+    //           },
+    //           fail: (err) => {
+    //             that.$toast('支付失败');
+    //           },
+    //         });
+    //       },
+    //     });
+    //   });
+    // },
+
+    // 复制
+    copy(val) {
+      let that = this;
+      uni.setClipboardData({
+        data: val,
+        success: function () {
+          that.$successToast('复制成功');
+        },
+      });
+    },
+
+    // 验证数据
+    vailateData() {
+      // 全状态必填
+      if (this.invoiceHeader == 1 && !this.invoiceForm.personName) {
+        this.$toast('请填写您的姓名');
+        return false;
+      }
+      if (this.invoiceHeader == 2 && !this.invoiceForm.companyName) {
+        this.$toast('请填写单位名称');
+        return false;
+      }
+      if (this.invoiceHeader == 2 && !this.invoiceForm.payerNum) {
+        this.$toast('请填写纳税人识别号');
+        return false;
+      }
+      // 普票
+      if (this.taxType === false) {
+        if (!this.invoiceForm.email) {
+          this.$toast('请填写收票人邮箱');
+          return false;
+        }
+      }
+      // 专票
+      else if (this.taxType === true) {
+        if (!this.invoiceForm.regAddress) {
+          this.$toast('请填写注册地址');
+          return false;
+        }
+        if (!this.invoiceForm.regPhone) {
+          this.$toast('请填写注册电话');
+          return false;
+        }
+        if (!this.invoiceForm.bank) {
+          this.$toast('请填写开户银行');
+          return false;
+        }
+        if (!this.invoiceForm.account) {
+          this.$toast('请填写银行账号');
+          return false;
+        }
+        if (!this.invoiceForm.name) {
+          this.$toast('请填写收票人姓名');
+          return false;
+        }
+        if (!this.invoiceForm.phone) {
+          this.$toast('请填写收票人手机');
+          return false;
+        }
+        if (!this.invoiceForm.email) {
+          this.$toast('请填写收票人邮箱');
+          return false;
+        }
+        if (!this.invoiceForm.address) {
+          this.$toast('请填写收票人地址');
+          return false;
+        }
+      }
+      return true;
+    },
+
+    // 提交发票
+    submitInvoice() {
+      if (!this.canClickSave) return false;
+      this.canClickSave = false;
+      setTimeout(() => {
+        this.canClickSave = true;
+      }, 3000);
+      if (!this.vailateData()) return;
+
+      let params = {};
+      if (this.invoiceHeader == 1) {
+        params = {
+          type: false,
+          name: this.invoiceForm.personName,
+        };
+      } else {
+        params = {
+          type: true,
+          name: this.invoiceForm.companyName,
+          taxNo: this.invoiceForm.payerNum,
+          registerAddress: this.invoiceForm.regAddress,
+          registerPhone: this.invoiceForm.regPhone,
+          bank: this.invoiceForm.bank,
+          account: this.invoiceForm.account,
+        };
+      }
+      params.taxType = this.taxType;
+      params.content = '商品明细';
+      params.receiverName = this.invoiceForm.name;
+      params.receiverPhone = this.invoiceForm.phone;
+      params.receiverEmail = this.invoiceForm.email;
+      params.receiverAddress = this.invoiceForm.address;
+      params.userId = this.userId;
+      params.orderId = this.orderId;
+      this.$axios({
+        url: '/user/order/tax/save',
+        type: 'application/json',
+        params,
+        isLoading: 1,
+      }).then((res) => {
+        this.getOrderDetail();
+        this.$successToast('提交成功');
+        this.isInvoiceDialog = false;
+      });
+    },
+
+    // 发票详情
+    toInvoiceDetail() {
+      uni.navigateTo({
+        url: '/pages/mine/order/invoice?id=' + this.detail.orderTaxId,
+      });
+    },
+
+    // 申请退款
+    toApplyReturn() {
+      uni.navigateTo({
+        url: '/pages/mine/order/return/apply?orderId=' + this.orderId,
+      });
+    },
+
+    // 去售后详情
+    toReturnDetail() {
+      uni.navigateTo({
+        url:
+          '/pages/mine/order/return/detail?orderRefundId=' + this.orderRefundId,
+      });
+    },
+
+    // 去查看物流
+    toLogistics() {
+      uni.navigateTo({
+        url:
+          '/pages/mine/order/logistics?companyCode=' +
+          this.detail.companyCode +
+          '&logisticsNo=' +
+          this.detail.logisticsNo,
+      });
+    },
+
+    // 提醒发货
+    remindShipment() {
+      if (!this.canRemindShipment) {
+        return this.$toast('请勿频繁操作');
+      }
+      this.canRemindShipment = false;
+      setTimeout(() => {
+        this.canRemindShipment = true;
+      }, 3000);
+
+      this.$axios({
+        url: '/order/notice',
+        params: {
+          orderId: this.orderId,
+          userId: this.userId,
+        },
+      }).then((res) => {
+        this.$successToast('提醒发货成功');
+      });
+    },
+
+    companyFocus() {
+      this.getCompanyList();
+    },
+
+    getCompanyList() {
+      this.$axios({
+        url: '/user/order/tax/title/list',
+        method: 'get',
+        params: {
+          companyName: this.invoiceForm.companyName,
+        },
+      }).then((res) => {
+        this.companyList = res.data || [];
+        if (this.companyList.length > 0) {
+          this.isShowCompanyList = true;
+        } else {
+          this.isShowCompanyList = false;
+        }
+      });
+    },
+
+    chooseCompany(item) {
+      this.invoiceForm.companyName = item.name;
+      this.invoiceForm.payerNum = item.taxId;
+      this.isChooseCompany = true;
+      this.isShowCompanyList = false;
+    },
+
+    // 去评价
+    toEvaluate() {
+      uni.navigateTo({
+        url: '/pages/mine/order/evaluate?orderId=' + this.orderId,
+      });
+    },
+
+    // 获取微信发票
+    getWxInvoice() {
+      let that = this;
+      uni.chooseInvoiceTitle({
+        success(res) {
+          if (that.taxType == true && res.type == 1) {
+            return this.$toast('专票只能选择公司类型');
+          }
+          // 个人
+          if (res.type == 1) {
+            that.invoiceHeader = 1;
+            that.invoiceForm.personName = res.title;
+          }
+          // 公司
+          if (res.type == 0) {
+            that.invoiceHeader = 2;
+            that.invoiceForm.companyName = res.title;
+            that.invoiceForm.payerNum = res.taxNumber;
+            that.invoiceForm.regAddress = res.companyAddress;
+            that.invoiceForm.regPhone = res.telephone;
+            that.invoiceForm.bank = res.bankName;
+            that.invoiceForm.account = res.bankAccount;
+          }
+        },
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss">
+.app-container {
+  background: #f4f2f2;
+  box-sizing: border-box;
+}
+.status-container {
+  background: #fe781f;
+  line-height: 80rpx;
+  text-align: center;
+  font-size: 32rpx;
+  color: #ffffff;
+}
+.card {
+  background: #ffffff;
+  border-radius: 20rpx;
+  margin-bottom: 20rpx;
+}
+.main-container {
+  padding: 20rpx 20rpx 120rpx;
+}
+.logistics-container {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 20rpx;
+  .icon {
+    width: 52rpx;
+    height: 52rpx;
+    border-radius: 50%;
+    background: linear-gradient(-90deg, #ff4042 0%, #fe781f 100%);
+    display: flex;
+    flex-shrink: 0;
+    justify-content: center;
+    align-items: center;
+    margin-right: 20rpx;
+    image {
+      width: 28rpx;
+      height: 28rpx;
+    }
+  }
+  .main {
+    width: 560rpx;
+    font-size: 24rpx;
+    line-height: 32rpx;
+  }
+  .noData {
+    font-size: 28rpx;
+    color: #666666;
+  }
+  .right {
+    margin-left: 20rpx;
+    flex-shrink: 0;
+    image {
+      width: 16rpx;
+      height: 28rpx;
+    }
+  }
+}
+.address-container {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  height: 150rpx;
+  padding: 0 20rpx;
+  .icon {
+    width: 52rpx;
+    height: 52rpx;
+    border-radius: 50%;
+    background: linear-gradient(-90deg, #ff4042 0%, #fe781f 100%);
+    display: flex;
+    flex-shrink: 0;
+    justify-content: center;
+    align-items: center;
+    margin-right: 20rpx;
+    image {
+      width: 28rpx;
+      height: 36rpx;
+    }
+  }
+  .right {
+    width: 600rpx;
+    .name {
+      font-size: 32rpx;
+      color: #333333;
+      text {
+        font-size: 28rpx;
+        color: #999999;
+        margin-left: 16rpx;
+      }
+    }
+    .address {
+      font-size: 28rpx;
+      color: #666666;
+      line-height: 34rpx;
+      margin-top: 10rpx;
+    }
+  }
+}
+.goods-container {
+  padding: 0 20rpx;
+  .title {
+    font-size: 32rpx;
+    color: #333333;
+    line-height: 32rpx;
+    padding-top: 20rpx;
+  }
+  .item {
+    padding: 20rpx 0;
+    border-bottom: 1px solid #eaeaea;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    &:last-child {
+      border: none;
+    }
+    image {
+      width: 180rpx;
+      height: 180rpx;
+      flex-shrink: 0;
+      margin-right: 20rpx;
+    }
+    .right {
+      width: 470rpx;
+      height: 180rpx;
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+      .top {
+        .name {
+          font-size: 28rpx;
+          color: #333333;
+          line-height: 36rpx;
+        }
+        .des {
+          font-size: 28rpx;
+          color: #999999;
+          margin-top: 10rpx;
+        }
+      }
+      .bottom {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        .price {
+          font-size: 28rpx;
+          color: #ff3f42;
+          line-height: 28rpx;
+        }
+        .num {
+          font-size: 28rpx;
+          color: #333333;
+          line-height: 28rpx;
+        }
+      }
+    }
+  }
+}
+.peisong-container {
+  padding: 0 20rpx;
+  font-size: 28rpx;
+  color: #333333;
+  .top {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    height: 88rpx;
+    border-bottom: 1px solid #eaeaea;
+  }
+  .bottom {
+    display: flex;
+    align-items: center;
+    min-height: 88rpx;
+    .left {
+      margin-right: 40rpx;
+      flex-shrink: 0;
+    }
+    .right {
+      padding: 10rpx 0;
+      line-height: 32rpx;
+    }
+  }
+}
+.total-container {
+  padding: 0 20rpx;
+  font-size: 28rpx;
+  color: #333333;
+  .top {
+    padding: 10rpx 0;
+  }
+  .item {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    height: 64rpx;
+  }
+  .total {
+    display: flex;
+    justify-content: flex-end;
+    height: 80rpx;
+    align-items: center;
+    border-top: 1px solid #eaeaea;
+    text {
+      color: #ff3f42;
+    }
+  }
+}
+.order-container {
+  padding: 20rpx;
+  .title {
+    font-size: 32rpx;
+    color: #333333;
+    line-height: 32rpx;
+    padding-bottom: 20rpx;
+  }
+  .item1 {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    height: 60rpx;
+    .left {
+      display: flex;
+      .label {
+        margin-right: 40rpx;
+        flex-shrink: 0;
+      }
+    }
+    .copy {
+      color: #fe781f;
+    }
+  }
+  .item2 {
+    display: flex;
+    align-items: center;
+    height: 60rpx;
+    .label {
+      margin-right: 40rpx;
+      flex-shrink: 0;
+    }
+  }
+}
+.bottom-container {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  padding: 0 20rpx;
+  box-sizing: border-box;
+  height: 100rpx;
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  background: #ffffff;
+  border-top: 1px solid #f4f2f2;
+  .button {
+    width: 150rpx;
+    height: 56rpx;
+    border-radius: 56rpx;
+    text-align: center;
+    line-height: 56rpx;
+    font-size: 28rpx;
+    margin-left: 15rpx;
+    &:first-child {
+      margin-left: 0;
+    }
+    &.gray {
+      color: #999999;
+      border: 1px solid #999999;
+    }
+    &.white {
+      color: #ff3f42;
+      border: 1px solid #ff3f42;
+    }
+    &.red {
+      color: #ffffff;
+      border: 1px solid #ff3f42;
+      background: #ff3f42;
+    }
+  }
+}
+.invoice-dialog {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  box-sizing: border-box;
+  z-index: 999;
+  background: #ffffff;
+  border-radius: 20rpx 20rpx 0 0;
+  padding: 0 20rpx;
+  max-height: 100vh;
+  overflow-y: scroll;
+  .type-c {
+    border-bottom: 1px solid #eaeaea;
+    padding-bottom: 20rpx;
+    .top {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      height: 84rpx;
+      .title {
+        font-size: 32rpx;
+        color: #333333;
+        font-weight: 600;
+      }
+      image {
+        width: 31rpx;
+        height: 31rpx;
+      }
+    }
+    .list {
+      display: flex;
+      .item {
+        padding: 0 16rpx;
+        border: 1px solid #c0c0c0;
+        font-size: 24rpx;
+        color: #666666;
+        border-radius: 6rpx;
+        line-height: 48rpx;
+        margin-right: 20rpx;
+        &.current {
+          border: 1px solid #fe781f;
+          background: rgba($color: #fe781f, $alpha: 0.3);
+          color: #fe781f;
+        }
+      }
+    }
+  }
+  .header-c {
+    border-bottom: 1px solid #eaeaea;
+    padding-bottom: 20rpx;
+    .title {
+      font-size: 32rpx;
+      color: #333333;
+      font-weight: 600;
+      line-height: 84rpx;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      .button {
+        font-size: 24rpx;
+        color: #fe781f;
+        border: 1px solid #fe781f;
+        border-radius: 6rpx;
+        line-height: 48rpx;
+        height: 48rpx;
+        padding: 0 16rpx;
+        font-weight: normal;
+      }
+    }
+    .list {
+      display: flex;
+      padding-bottom: 20rpx;
+      .item {
+        width: 120rpx;
+        height: 48rpx;
+        line-height: 48rpx;
+        border-radius: 6rpx;
+        text-align: center;
+        border: 1px solid #c0c0c0;
+        font-size: 24rpx;
+        color: #666666;
+        margin-right: 20rpx;
+        &.current {
+          border: 1px solid #ff3f42;
+          background: #ff3f42;
+          color: #ffffff;
+        }
+      }
+    }
+    .form {
+      .row {
+        display: flex;
+        height: 60rpx;
+        align-items: center;
+        .label {
+          width: 200rpx;
+        }
+        .input {
+          width: 510rpx;
+          position: relative;
+          input {
+            width: 100%;
+          }
+          .companyList {
+            position: absolute;
+            top: 60rpx;
+            left: -20rpx;
+            background: #ffffff;
+            width: 530rpx;
+            z-index: 11;
+            border: 1px solid #eaeaea;
+            max-height: 400rpx;
+            overflow-y: scroll;
+            box-shadow: 0 0 12rpx 0 rgba(0, 0, 0, 0.2);
+            .item {
+              color: #666666;
+              padding: 16rpx 20rpx;
+            }
+          }
+        }
+      }
+      .more {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        height: 60rpx;
+        .right {
+          display: flex;
+          align-items: center;
+          image {
+            width: 20rpx;
+            height: 20rpx;
+            display: block;
+            margin-left: 10rpx;
+          }
+        }
+      }
+    }
+  }
+  .content-c {
+    padding-bottom: 40rpx;
+    .title {
+      font-size: 32rpx;
+      color: #333333;
+      font-weight: 600;
+      line-height: 84rpx;
+      text {
+        font-size: 22rpx;
+        color: #999999;
+        margin-left: 10rpx;
+        font-weight: normal;
+      }
+    }
+    .list {
+      display: flex;
+      .item {
+        padding: 0 16rpx;
+        background: rgba($color: #fe781f, $alpha: 0.3);
+        font-size: 24rpx;
+        color: #fe781f;
+        border-radius: 6rpx;
+        line-height: 48rpx;
+      }
+    }
+    .tips {
+      font-size: 22rpx;
+      color: #999999;
+      margin-top: 20rpx;
+    }
+    .button {
+      height: 70rpx;
+      line-height: 70rpx;
+      border-radius: 70rpx;
+      background: linear-gradient(-90deg, #ff3f42 0%, #fe781f 100%);
+      text-align: center;
+      font-size: 28rpx;
+      color: #ffffff;
+      margin-top: 20rpx;
+    }
+  }
+}
+</style>

pages/mine/order/evaluate.vue

@@ -0,0 +1,392 @@
+<template>
+	<view class="app-container">
+		<view class="form-container">
+			<view class="top">
+				<view class="left">您对订单满意吗？</view>
+				<view class="right" @tap="isAnonymous = !isAnonymous">
+					<image src="@/static/icon/select_0.png" v-if="!isAnonymous"></image>
+					<image src="@/static/icon/select_1.png" v-if="isAnonymous"></image>
+					<text>匿名评价</text>
+				</view>
+			</view>
+			<view class="rate">
+				<view class="item">
+					<view class="left">商品质量：<uni-rate :size="18" :margin="4" v-model="rateVal1" /></view>
+					<view class="right">{{rateVal1 | rateFilter}}</view>
+				</view>
+				<view class="item">
+					<view class="left">服务质量：<uni-rate :size="18" :margin="4" v-model="rateVal2" /></view>
+					<view class="right">{{rateVal2 | rateFilter}}</view>
+				</view>
+				<view class="item">
+					<view class="left">配送质量：<uni-rate :size="18" :margin="4" v-model="rateVal3" /></view>
+					<view class="right">{{rateVal3 | rateFilter}}</view>
+				</view>
+			</view>
+			<view class="title" v-if="tagList.length > 0">选择评价标签：</view>
+			<view class="tags" v-if="tagList.length > 0">
+				<block v-for="(item, index) in tagList" :key="index">
+					<view class="item" :class="item.checked ? 'current':''" @tap="changeTag(item, item.checked, index)">{{item.tag}}</view>
+				</block>
+			</view>
+			<view class="title">评价内容：</view>
+			<view class="content">
+				<textarea maxlength="120" v-model="content"></textarea>
+				<view class="length">{{content.length > 120 ? 120 : content.length}}/120</view>
+			</view>
+			<view class="title">上传图片：<span>(最多9张)</span></view>
+			<view class="images">
+				<block v-for="(item, index) in images" :key='index'>
+					<view class="img">
+						<image :src="item.url" mode="aspectFill"></image>
+						<text @tap="delImage(index)">x</text>
+					</view>
+				</block>
+				<view class="add"  @tap="addImage" v-if="images.length < 9">
+					<image src="@/static/icon/camera.png"></image>
+					<text>点击上传</text>
+				</view>
+			</view>
+		</view>
+		
+		<view class="bottom-container">
+			<view class="button" @tap="submitForm">提交</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import { base_url } from '@/utils/config.js';
+	
+	export default {
+		filters: {
+			rateFilter(val) {
+				if(!val) {
+					return '';
+				}else if(val === 5) {
+					return '满意';
+				}else if(val >= 3) {
+					return '中评';
+				}else if(val >= 1) {
+					return '不满意';
+				}
+			}
+		},
+		
+		data() {
+			return {
+				orderId: null, // 订单id
+				isAnonymous: false,
+				tagList: [],
+				rateVal1: 1,
+				rateVal2: 1,
+				rateVal3: 1,
+				content: '',
+				images: [],
+			}
+		},
+		
+		onLoad({orderId}) {
+			this.orderId = orderId;
+			this.getTagList();
+			this.rateVal1 = 0;
+			this.rateVal2 = 0;
+			this.rateVal3 = 0;
+		},
+		
+		methods: {
+			getTagList() {
+				this.$axios({
+					url: '/order/comment/tag/list',
+					method: 'get',
+				}).then(res => {
+					if(res.data && res.data.length > 0) {
+						res.data.forEach(item => {
+							item.checked = false;
+						})
+						this.tagList = res.data;
+					}else {
+						this.tagList = [];
+					}
+					
+				})
+			},
+			
+			changeTag(item, checked, index) {
+				checked = !checked;
+				this.$set(this.tagList, index, {...item, checked });
+			},
+			
+			// 删除图片
+			delImage(index) {
+				this.images.splice(index, 1);
+			},
+			
+			// 添加图片
+			async addImage() {
+				const files = await new Promise((resolve,reject)=>{
+					uni.chooseImage({
+						count: 9 - this.images.length,
+						success:res=>{
+							resolve(res.tempFilePaths)
+						},fail:err=>{
+							reject()
+						}
+					})
+				});
+				uni.showLoading({
+					title:'上传中'
+				})
+				let arr = [];
+				files.forEach(item=>{
+					arr.push(this.uploadFile(item))
+				});
+				Promise.all(arr).then(res=>{
+					this.images = this.images.concat(res.map(item=>{
+						return JSON.parse(item).data;
+					}))
+					console.log(this.images);
+				}).catch(err=>{
+					uni.showModal({
+						title:'上传失败'
+					})
+				}).finally(()=>{
+					uni.hideLoading();
+				})
+			},
+			
+			// 上传图片
+			async uploadFile(file) {
+				const result = new Promise((resolve, reject) => {
+					uni.uploadFile({
+						url: base_url + '/common/upload',
+						header: {
+							"Content-Type": 'multipart/form-data',
+							"x-token": uni.getStorageSync('token')
+						},
+						name: 'file',
+						filePath: file,
+						success(res) {
+							resolve(res.data)
+						}
+					})
+				})
+				return result;
+			},
+			
+			// 提交
+			submitForm() {
+				if(!this.rateVal1 || !this.rateVal2 || !this.rateVal3) {
+					return this.$toast('请对该订单进行评分');
+				}
+				if(!this.content) {
+					return this.$toast('请填写评价内容');
+				}
+				let tags = [];
+				this.tagList.forEach(item => {
+					if(item.checked) {
+						tags.push(item.tag);
+					}
+				})
+				if(tags.length <= 0) {
+					return this.$toast('请选择评价标签');
+				}
+				let imgIds = [];
+				this.images.forEach(item => {
+					imgIds.push(item.id);
+				})
+				this.$axios({
+					url: '/order/comment/add',
+					type: 'application/json',
+					params: {
+						orderId: this.orderId,
+						commentGoods: this.rateVal1,
+						commentService: this.rateVal2,
+						commentExpress: this.rateVal3,
+						tags: tags,
+						content: this.content,
+						fileIds: imgIds,
+						isAnonymous: this.isAnonymous,
+					}
+				}).then(res => {
+					this.$successToast('提交成功');
+					// uni.$emit('refreshOrderList', res.data);
+					uni.$emit('refreshOrderDetail', res.data);
+					setTimeout(() => {
+						uni.navigateBack({
+							delta: 1
+						})
+					}, 1000)
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		padding: 20rpx 20rpx 150rpx;
+		box-sizing: border-box;
+	}
+	.form-container {
+		padding: 30rpx;
+		background: #FFFFFF;
+		border-radius: 20rpx;
+		.top {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			margin-bottom: 20rpx;
+			.left {
+				font-size: 32rpx;
+				font-weight: 500;
+			}
+			.right {
+				display: flex;
+				align-items: center;
+				color: #666666;
+				image {
+					width: 28rpx;
+					height: 28rpx;
+					margin-right: 16rpx;
+				}
+			}
+		}
+		.rate {
+			.item {
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				padding: 10rpx 0;
+				.left {
+					display: flex;
+				}
+			}
+		}
+		.title {
+			margin-top: 30rpx;
+			span {
+				color: #999999;
+			}
+		}
+		.tags {
+			display: flex;
+			flex-wrap: wrap;
+			.item {
+				height: 48rpx;
+				padding: 0 30rpx;
+				border-radius: 48rpx;
+				border: 1px solid #eaeaea;
+				font-size: 24rpx;
+				color: #333333;
+				line-height: 48rpx;
+				margin-right: 20rpx;
+				margin-top: 20rpx;
+				&.current {
+					background: #FE781F;
+					color: #FFFFFF;
+					border: 1px solid #FE781F;
+				}
+			}
+		}
+		.content {
+			border: 1px solid #eaeaea;
+			border-radius: 10rpx;
+			position: relative;
+			margin-top: 20rpx;
+			textarea {
+				width: 100%;
+				height: 200rpx;
+				padding: 20rpx;
+				box-sizing: border-box;
+			}
+			.length {
+				position: absolute;
+				right: 20rpx;
+				bottom: 20rpx;
+				font-size: 24rpx;
+				color: #999999;
+				line-height: 24rpx;
+			}
+		}
+		.images {
+			display: flex;
+			flex-wrap: wrap;
+			margin-top: 20rpx;
+			.add {
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				justify-content: center;
+				width: 146rpx;
+				height: 146rpx;
+				border: 2rpx dashed #dadada;
+				border-radius: 10rpx;
+				image {
+					width: 48rpx;
+					height: 34rpx;
+					display: block;
+					margin-bottom: 8rpx;
+				}
+				text {
+					font-size: 22rpx;
+					color: #999999;
+					line-height: 24rpx;
+				}
+			}
+			.img {
+				position: relative;
+				margin-right: 20rpx;
+				margin-bottom: 20rpx;
+				image {
+					width: 150rpx;
+					height: 150rpx;
+					border-radius: 10rpx;
+					overflow: hidden;
+					display: block;
+				}
+				text {
+					position: absolute;
+					right: -10rpx;
+					top: -10rpx;
+					width: 40rpx;
+					height: 40rpx;
+					border-radius: 50%;
+					background: #FF3F42;
+					font-size: 28rpx;
+					color: #FFFFFF;
+					text-align: center;
+					line-height: 36rpx;
+					display: block;
+				}
+			}
+		}
+	}
+	
+	.bottom-container {
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		width: 100%;
+		padding: 0 20rpx;
+		box-sizing: border-box;
+		height: 100rpx;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		background: #FFFFFF;
+		border-top: 1px solid #F4F2F2;
+		.button {
+			width: 100%;
+			height: 70rpx;
+			line-height: 70rpx;
+			text-align: center;
+			border-radius: 70rpx;
+			background: linear-gradient(-90deg,#ff3f42 0%, #fe781f 100%);
+			font-size: 32rpx;
+			color: #FFFFFF;
+			
+		}
+	}
+</style>

pages/mine/order/invoice.vue

@@ -0,0 +1,140 @@
+<template>
+	<view class="app-container">
+		<view class="card">
+			<view class="row">发票状态：<text>{{detail.status ? '已':'待'}}开票</text></view>
+		</view>
+		<view class="card">
+			<view class="row">订单编号：<text>{{detail.orderId}}</text></view>
+			<view class="row">下单时间：<text>{{detail.createTime}}</text></view>
+		</view>
+		<view class="card">
+			<view class="row">发票类型：<text>{{detail.taxType ? '增值税专用发票':'增值税普通发票'}}</text></view>
+			<view class="row">发票抬头：<text>{{detail.name}}</text></view>
+			<view class="row">发票内容：<text>{{detail.content}}</text></view>
+			<!-- <view class="row">发票税号：<text>{{detail.taxNo ? detail.taxNo : ''}}</text></view> -->
+		</view>
+		
+		<view class="bottom-container">
+			<view class="button white" @tap="look">查看发票</view>
+			<view class="button white" @tap="sendEmail">发送邮箱</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				invoiceId: null, // 发票id
+				detail: {}, // 发票详情
+			}
+		},
+		
+		onLoad({id}) {
+			this.invoiceId = id;
+			this.getInvoiceDetail();
+		},
+		
+		methods: {
+			getInvoiceDetail() {
+				this.$axios({
+					url: '/user/order/tax/detail',
+					method: 'get',
+					params: {
+						orderTaxId: this.invoiceId
+					}
+				}).then(res => {
+					this.detail = res.data;
+				})
+			},
+			
+			// 查看发票
+			look() {
+				let that = this;
+				if(!this.detail.taxLink) {
+					return this.$toast('发票链接无效');
+				}
+				uni.downloadFile({
+					url: this.detail.taxLink,
+					success: function (res) {
+						uni.openDocument({
+							filePath: res.tempFilePath,
+							fileType: 'pdf',
+							success(res) {
+								console.log('打开文档成功');
+							},
+							fail() {
+								that.$toast('查看发票失败');
+							}
+						});
+					}
+				});
+			},
+			
+			// 发送邮箱
+			sendEmail() {
+				this.$axios({
+					url: '/user/order/tax/send',
+					params: {
+						orderTaxId: this.invoiceId
+					}
+				}).then(res => {
+					this.$successToast('发送成功');
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		padding: 20rpx;
+		box-sizing: border-box;
+	}
+	.card {
+		background: #FFFFFF;
+		border-radius: 20rpx;
+		margin-bottom: 20rpx;
+		padding: 10rpx 20rpx;
+		.row {
+			line-height: 60rpx;
+		}
+	}
+	
+	.bottom-container {
+		width: 100%;
+		padding: 0 20rpx;
+		box-sizing: border-box;
+		height: 100rpx;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		border-top: 1px solid #F4F2F2;
+		.button {
+			width: 180rpx;
+			height: 56rpx;
+			border-radius: 56rpx;
+			text-align: center;
+			line-height: 56rpx;
+			font-size: 28rpx;
+			margin-left: 20rpx;
+			&:first-child {
+				margin-left: 0;
+			}
+			&.gray {
+				color: #999999;
+				border: 1px solid #999999;
+			}
+			&.white {
+				color: #FF3F42;
+				border: 1px solid #FF3F42;
+			}
+			&.red {
+				color: #FFFFFF;
+				border: 1px solid #FF3F42;
+				background: #FF3F42;
+			}
+		}
+	}
+</style>

pages/mine/order/list.vue

@@ -0,0 +1,919 @@
+<template>
+  <view class="app-container">
+    <view class="tab-container">
+      <view
+        class="item"
+        :class="tabCurrent == '' ? 'current' : ''"
+        @tap="changeTab('')"
+        ><text>全部</text></view
+      >
+      <view
+        class="item"
+        :class="tabCurrent == 'NOPAY' ? 'current' : ''"
+        @tap="changeTab('NOPAY')"
+        ><text>待付款</text></view
+      >
+      <view
+        class="item"
+        :class="tabCurrent == 'DFH' ? 'current' : ''"
+        @tap="changeTab('DFH')"
+        ><text>待发货</text></view
+      >
+      <view
+        class="item"
+        :class="tabCurrent == 'YFH' ? 'current' : ''"
+        @tap="changeTab('YFH')"
+        ><text>待收货</text></view
+      >
+      <view
+        class="item"
+        :class="tabCurrent == 'OVER' ? 'current' : ''"
+        @tap="changeTab('OVER')"
+        ><text>已完成</text></view
+      >
+      <view
+        class="item"
+        :class="tabCurrent == 'REFUND' ? 'current' : ''"
+        @tap="changeTab('REFUND')"
+        ><text>售后中</text></view
+      >
+    </view>
+
+    <view class="list-container">
+      <block v-for="(item, index) in orderList" :key="index">
+        <view
+          class="item"
+          @tap="toOrderDetail(item.orderId, item.orderRefundId)"
+        >
+          <!-- 普通订单 -->
+          <block v-if="tabCurrent != 'REFUND'">
+            <view class="top">
+              <view class="left">{{ item.orderId }}</view>
+              <view class="right">{{ item.orderStatus | statusFilter }}</view>
+            </view>
+
+            <block
+              v-for="(goodsItem, goodsIndex) in item.orderDetails"
+              :key="goodsIndex"
+            >
+              <view class="goods" :class="'goods' + goodsIndex">
+                <image
+                  v-if="
+					goodsItem.goods &&
+                    goodsItem.goods.logo &&
+                    $compareTime(
+                      goodsItem.goods.logoStartTime,
+                      goodsItem.goods.logoEndTime
+                    ) &&
+                    goodsItem.goods.mergeImage
+                  "
+                  :src="goodsItem.goods.mergeImage"
+                ></image>
+                <image v-else :src="goodsItem.imgUrl" mode="aspectFill"></image>
+                <view class="main">
+                  <view class="row1">
+                    <view class="name ellipsis-2">{{
+                      goodsItem.goodsName
+                    }}</view>
+                    <view class="price">￥{{ goodsItem.price }}</view>
+                  </view>
+                  <view class="row2">
+                    <view>{{ goodsItem.goodsSpecValue }}</view>
+                    <view>x{{ goodsItem.num }}</view>
+                  </view>
+                </view>
+              </view>
+            </block>
+
+            <view class="bottom">
+              <view class="left">{{ item.createTime }}</view>
+              <view class="total"
+                >共{{ item.totalNum }}件 订单总额：<text
+                  >￥{{ item.payAmount | numToFixed }}</text
+                ></view
+              >
+            </view>
+          </block>
+
+          <!-- 售后订单 -->
+          <block v-if="tabCurrent == 'REFUND'">
+            <view class="top">
+              <view class="left">{{ item.orderId }}</view>
+              <view class="right">{{ item.orderStatus | statusFilter2 }}</view>
+            </view>
+
+            <!-- 拒绝申请 -->
+            <block v-if="item.examineStatus === 'FAIL'">
+              <block
+                v-for="(goodsItem, goodsIndex) in item.orderDetails"
+                :key="goodsIndex"
+              >
+                <view class="goods" :class="'goods' + goodsIndex">
+                  <image
+                    v-if="
+                  	goodsItem.goods &&
+                      goodsItem.goods.logo &&
+                      $compareTime(
+                        goodsItem.goods.logoStartTime,
+                        goodsItem.goods.logoEndTime
+                      ) &&
+                      goodsItem.goods.mergeImage
+                    "
+                    :src="goodsItem.goods.mergeImage"
+                  ></image>
+                  <image
+                    v-else
+                    :src="goodsItem.imgUrl"
+                    mode="aspectFill"
+                  ></image>
+                  <view class="main">
+                    <view class="row1">
+                      <view class="name ellipsis-2">{{
+                        goodsItem.goodsName
+                      }}</view>
+                      <view class="price">￥{{ goodsItem.price }}</view>
+                    </view>
+                    <view class="row2">
+                      <view>{{ goodsItem.goodsSpecValue }}</view>
+                      <view>x{{ goodsItem.refundNum }}</view>
+                    </view>
+                  </view>
+                </view>
+              </block>
+              <view class="bottom">
+                <view class="left">{{ item.createTime }}</view>
+                <view class="total"
+                  >共{{ item.totalNum }}件
+                  {{ item.orderStatus == 'NOPAY' ? '应付' : '实付' }}总额：<text
+                    >￥{{ item.payAmount | numToFixed }}</text
+                  ></view
+                >
+              </view>
+            </block>
+            <!-- 其他 -->
+            <block v-else>
+              <block
+                v-for="(goodsItem, goodsIndex) in item.orderDetails"
+                :key="goodsIndex"
+              >
+                <view
+                  class="goods"
+                  :class="'goods' + goodsIndex"
+                  v-if="goodsItem.refund"
+                >
+                  <image
+                    v-if="
+						goodsItem.goods &&
+						goodsItem.goods.logo &&
+						$compareTime(
+							goodsItem.goods.logoStartTime,
+							goodsItem.goods.logoEndTime
+						) &&
+						goodsItem.goods.mergeImage
+                    "
+                    :src="goodsItem.goods.mergeImage"
+                  ></image>
+                  <image
+                    v-else
+                    :src="goodsItem.imgUrl"
+                    mode="aspectFill"
+                  ></image>
+                  <view class="main">
+                    <view class="row1">
+                      <view class="name ellipsis-2">{{
+                        goodsItem.goodsName
+                      }}</view>
+                      <view class="price">￥{{ goodsItem.price }}</view>
+                    </view>
+                    <view class="row2">
+                      <view>{{ goodsItem.goodsSpecValue }}</view>
+                      <view>x{{ goodsItem.refundNum }}</view>
+                    </view>
+                  </view>
+                </view>
+              </block>
+              <view class="bottom">
+                <view class="left">{{ item.createTime }}</view>
+                <view class="total"
+                  >共{{ getRefundNum(item.orderDetails) }}件
+                  {{ item.orderStatus == 'OVER' ? '实退' : '应退' }}总额：<text
+                    >￥{{ item.refundAmount | numToFixed }}</text
+                  ></view
+                >
+              </view>
+            </block>
+          </block>
+
+          <!-- 按钮：待付款 -->
+          <view class="btn-group btn-group2" v-if="item.orderStatus == 'NOPAY'">
+            <div class="tips">请在30分钟内付款</div>
+            <div class="btns">
+              <div class="button gray" @tap.stop="cancelOrder(item.orderId)">
+                取消订单
+              </div>
+              <div class="button red" @tap.stop="submitOrder(item)">
+                立即付款
+              </div>
+            </div>
+          </view>
+          <!-- 按钮：待发货 -->
+          <view class="btn-group" v-if="item.orderStatus == 'DFH'">
+            <div class="button white" @tap.stop="remindShipment(item.orderId)">
+              提醒发货
+            </div>
+            <div
+              class="button white"
+              v-if="checkCanReturn(item.orderShareStatus)"
+              @tap.stop="toApplyReturn(item.orderId)"
+            >
+              申请售后
+            </div>
+          </view>
+          <!-- 按钮：待收货 -->
+          <view class="btn-group" v-if="item.orderStatus == 'YFH'">
+            <div
+              class="button gray"
+              @tap.stop="toLogistics(item.companyCode, item.logisticsNo)"
+            >
+              查看物流
+            </div>
+            <div
+              class="button red"
+              @tap.stop="clickConfirmReceipt(item.orderId)"
+            >
+              确认收货
+            </div>
+            <div
+              class="button white"
+              v-if="checkCanReturn(item.orderShareStatus)"
+              @tap.stop="toApplyReturn(item.orderId)"
+            >
+              申请售后
+            </div>
+          </view>
+          <!-- 按钮：已完成 -->
+          <view
+            class="btn-group"
+            v-if="item.orderStatus == 'OVER' && tabCurrent != 'REFUND'"
+          >
+            <div
+              class="button gray"
+              @tap.stop="toLogistics(item.companyCode, item.logisticsNo)"
+            >
+              查看物流
+            </div>
+            <div
+              class="button white"
+              v-if="checkCanReturn(item.orderShareStatus)"
+              @tap.stop="toApplyReturn(item.orderId)"
+            >
+              申请售后
+            </div>
+          </view>
+          <!-- 按钮：已关闭 -->
+          <view class="btn-group" v-if="item.orderStatus == 'CLOSE'">
+            <div class="button gray">查看详情</div>
+          </view>
+          <!-- 按钮：超时未支付 -->
+          <view class="btn-group" v-if="item.orderStatus == 'TIMEOUT'">
+            <div class="button gray">查看详情</div>
+          </view>
+          <!-- 按钮：售后中 -->
+          <view class="btn-group" v-if="item.orderStatus == 'REFUND'">
+            <div class="button gray">查看详情</div>
+          </view>
+          <!-- 按钮：售后中 待商家处理 -->
+          <view class="btn-group" v-if="item.orderStatus == 'DSJCL'">
+            <div
+              class="button gray"
+              @tap.stop="toReturnDetail(item.orderRefundId)"
+            >
+              售后详情
+            </div>
+          </view>
+          <!-- 按钮：售后中 待买家处理 -->
+          <view class="btn-group" v-if="item.orderStatus == 'DMJCL'">
+            <div
+              class="button red"
+              @tap.stop="toReturnDetail(item.orderRefundId)"
+              v-if="item.examineStatus == 'OK'"
+            >
+              提交资料
+            </div>
+            <div
+              class="button white"
+              @tap.stop="toApplyReturn(item.orderId)"
+              v-if="item.examineStatus == 'FAIL'"
+            >
+              重新申请
+            </div>
+          </view>
+          <!-- 按钮：售后中 待商家收货 -->
+          <view class="btn-group" v-if="item.orderStatus == 'DSJSH'">
+            <div
+              class="button gray"
+              @tap.stop="toReturnDetail(item.orderRefundId)"
+            >
+              售后详情
+            </div>
+          </view>
+          <!-- 按钮：售后中 退款成功 -->
+          <view
+            class="btn-group"
+            v-if="item.orderStatus == 'OVER' && tabCurrent == 'REFUND'"
+          >
+            <div
+              class="button gray"
+              @tap.stop="toReturnDetail(item.orderRefundId)"
+            >
+              售后详情
+            </div>
+          </view>
+        </view>
+      </block>
+    </view>
+    <no-data v-if="!orderList.length" :showText="'暂无订单'"></no-data>
+    <loading-text
+      v-if="orderList.length"
+      :loading="loading"
+      :noMore="noMore"
+    ></loading-text>
+
+    <!-- 取消订单 -->
+    <modal-dialog
+      showText="确定要取消订单吗？"
+      :isShowDialog="isCancelDialog"
+      @cancel="isCancelDialog = false"
+      @confirm="confirmCancelOrder"
+    ></modal-dialog>
+
+    <!-- 确认收货 -->
+    <modal-dialog
+      showText="确定要确认收货吗？"
+      :isShowDialog="isConfirmDialog"
+      @cancel="isConfirmDialog = false"
+      @confirm="confirmReceipt"
+    ></modal-dialog>
+    <zhifutanchuan
+      v-if="detail_"
+      :orderInfo="orderInfo"
+      @PAY_TYPE_STR="PAY_TYPE_STR"
+    />
+  </view>
+</template>
+
+<script>
+import { mapState } from 'vuex';
+import modalDialog from '@/components/modalDialog.vue';
+import zhifutanchuan from '@/components/zhifutanchuan.vue';
+export default {
+  components: {
+    modalDialog,
+    zhifutanchuan,
+  },
+  filters: {
+    statusFilter(val) {
+      const statusMap = {
+        NOPAY: '待付款',
+        DFH: '待发货',
+        YFH: '待收货',
+        OVER: '已完成',
+        CLOSE: '已关闭',
+        REFUND: '售后中',
+        TIMEOUT: '超时未支付',
+      };
+      return statusMap[val];
+    },
+    statusFilter2(val) {
+      const statusMap = {
+        DSJCL: '待商家处理',
+        DSJSH: '待商家收货',
+        DMJCL: '待买家处理',
+        OVER: '退款成功',
+        CANCEL: '已取消',
+      };
+      return statusMap[val];
+    },
+  },
+  data() {
+    return {
+      detail_: null,
+      orderInfo: null,
+      configInfo: uni.getStorageSync('configInfo'),
+      tabCurrent: '', // 当前tab状态
+      orderList: [], // 订单列表
+      pageNum: 1,
+      pageSize: 8,
+      noMore: false,
+      loading: false,
+      isCancelDialog: false, // 是否显示取消订单弹窗
+      cancelOrderId: null, // 取消订单id
+      isConfirmDialog: false, // 是否显示确认收货弹窗
+      confirmReceiptId: null, // 确认收货id
+      autoDetailId: null, // 自动跳转到详情页id
+      canRemindShipment: true, // 能否点击提醒发货
+    };
+  },
+
+  computed: {
+    ...mapState(['userInfo', 'isLogin', 'userId']),
+  },
+
+  onLoad({ tab, orderId }) {
+    this.tabCurrent = tab || '';
+    console.log(this.tabCurrent);
+    if (orderId) {
+      this.autoDetailId = orderId;
+    }
+    this.getOrderList();
+
+    uni.$on('refreshOrderList', (data) => {
+      if (data) {
+        this.tabCurrent = 'REFUND';
+      }
+      this.getOrderList();
+    });
+  },
+
+  // 下拉刷新
+  onPullDownRefresh() {
+    this.pageNum = 1;
+    this.getOrderList();
+  },
+
+  // 上拉加载
+  onReachBottom() {
+    this.getOrderList(1);
+  },
+
+  methods: {
+    getOrderList(loadMore) {
+      if (this.noMore && loadMore) return;
+      this.noMore = false;
+      if (!loadMore) {
+        this.pageNum = 1;
+      } else {
+        this.loading = true;
+      }
+      let url = '';
+      let orderStatus = '';
+      if (this.tabCurrent == 'REFUND') {
+        url = '/order/refund/list';
+        orderStatus = '';
+      } else {
+        url = '/order/my/order';
+        orderStatus = this.tabCurrent;
+      }
+      this.$axios({
+        url: url,
+        method: 'get',
+        params: {
+          pageNo: this.pageNum,
+          pageSize: this.pageSize,
+          orderStatus: orderStatus,
+          userId: this.userId,
+        },
+        isLoading: !loadMore,
+      }).then((res) => {
+        let _list = res.data.records;
+        let pageTotal = res.data.pages;
+        if (this.pageNum >= pageTotal) {
+          this.noMore = true;
+        }
+        if (_list.length) {
+          this.pageNum += 1;
+        }
+        if (loadMore) {
+          this.orderList = this.orderList.concat(_list);
+          this.loading = false;
+        } else {
+          this.orderList = _list;
+        }
+
+        uni.stopPullDownRefresh();
+
+        if (this.autoDetailId) {
+          this.toOrderDetail(this.autoDetailId);
+        }
+      });
+    },
+
+    getRefundNum(orderDetails) {
+      let refundNum = 0;
+      orderDetails.forEach((item) => {
+        if (item.refund) {
+          refundNum = refundNum + item.refundNum;
+        }
+      });
+      return refundNum;
+    },
+
+    // 检查是否可以申请售后（根据orderShareStatus）
+    checkCanReturn(status) {
+      if (!status || status === 'OVER' || status === 'CANCEL') {
+        return false;
+      } else {
+        return true;
+      }
+    },
+
+    // 切换类型
+    changeTab(current) {
+      this.orderList = [];
+      this.tabCurrent = current;
+      this.pageNum = 1;
+      this.getOrderList();
+    },
+
+    // 申请退款
+    toApplyReturn(orderId) {
+      uni.navigateTo({
+        url: '/pages/mine/order/return/apply?orderId=' + orderId,
+      });
+    },
+
+    // 去订单详情
+    toOrderDetail(orderId, orderRefundId) {
+      this.autoDetailId = null;
+      if (orderRefundId) {
+        return uni.navigateTo({
+          url:
+            '/pages/mine/order/return/detail?orderRefundId=' +
+            (orderRefundId || ''),
+        });
+      }
+      uni.navigateTo({
+        url:
+          '/pages/mine/order/detail?orderId=' +
+          (orderId || '') +
+          '&orderRefundId=' +
+          (orderRefundId || ''),
+      });
+    },
+
+    // 取消订单
+    cancelOrder(orderId) {
+      this.cancelOrderId = orderId;
+      this.isCancelDialog = true;
+    },
+
+    // 确认取消订单
+    confirmCancelOrder() {
+      this.$axios({
+        url: '/order/cancel',
+        method: 'get',
+        params: {
+          orderId: this.cancelOrderId,
+        },
+      }).then((res) => {
+        this.isCancelDialog = false;
+        this.pageNum = 1;
+        this.getOrderList();
+        this.$successToast('取消订单成功');
+      });
+    },
+
+    // 确认收货
+    clickConfirmReceipt(orderId) {
+      this.confirmReceiptId = orderId;
+      this.isConfirmDialog = true;
+    },
+
+    // 确定 确认收货
+    confirmReceipt() {
+      this.$axios({
+        url: '/order/ack',
+        params: {
+          orderId: this.confirmReceiptId,
+        },
+      }).then((res) => {
+        this.isConfirmDialog = false;
+        this.pageNum = 1;
+        this.getOrderList();
+        this.$successToast('确认收货成功');
+      });
+    },
+
+    PAY_TYPE_STR(ewPam) {
+      this.payOrder(ewPam);
+    },
+
+    submitOrder(item) {
+      let that = this;
+      this.orderInfo = item;
+      this.detail_ = true;
+    },
+
+    // 立即付款
+    payOrder(ewPam = {}) {
+      let that = this;
+      this.$axios({
+        url: '/order/wait/pay',
+        params: {
+          ...ewPam,
+          userId: this.userId,
+          orderId: this.orderInfo.orderId,
+        },
+        isLoading: 1,
+      }).then((res) => {
+        that.orderId = res.data.id;
+        if (ewPam.payType == '微信支付') {
+          uni.getProvider({
+            service: 'payment',
+            success: (e) => {
+              uni.requestPayment({
+                provider: e.provider[0],
+                orderInfo: res.data,
+                timeStamp: res.data.timeStamp,
+                nonceStr: res.data.nonceStr,
+                package: res.data.payPackage,
+                signType: 'MD5',
+                paySign: res.data.paySign,
+                success: (payRes) => {
+                  this.detail_ = false;
+                  this.orderInfo = null;
+                  that.$successToast('支付成功');
+                  that.pageNum = 1;
+                  that.getOrderList();
+                  that.requestMessage();
+                },
+                fail: (err) => {
+                  this.detail_ = false;
+                  this.orderInfo = null;
+                  that.$toast('支付失败');
+                  that.pageNum = 1;
+                  that.getOrderList();
+                  that.requestMessage();
+                },
+              });
+            },
+          });
+        } else if (
+          ewPam.payType == '云闪付' &&
+          res?.data?.umsMiniRep?.miniPayRequest?.cqpMpAppId
+        ) {
+          uni.navigateToMiniProgram({
+            appId: res.data?.umsMiniRep?.miniPayRequest?.cqpMpAppId,
+            path: res.data?.umsMiniRep?.miniPayRequest?.cqpMpPath,
+            success(res) {
+              uni.onAppShow(({ scene }) => {
+                // if (scene == 1038) {
+                //   that.$successToast('支付成功');
+                // }
+				this.detail_ = false;
+                this.orderInfo = null;
+                that.pageNum = 1;
+                that.getOrderList();
+                that.requestMessage();
+				uni.reLaunch({
+				  url: '/pages/mine/order/detail?orderId=' + that.orderId,
+				});
+                uni.offAppShow();
+              });
+            },
+			fail() {
+				
+			}
+          });
+        }
+      });
+    },
+
+    // 消息推送
+    requestMessage() {
+      let that = this;
+      uni.showModal({
+        title: '温馨提示',
+        content: '为更好的促进您与买家的交流，需要在您的订单成交时向您发送消息',
+        confirmText: '同意',
+        cancelText: '拒绝',
+        success: function (res) {
+          if (res.confirm) {
+            let tmplIds = [that.configInfo.template];
+            uni.requestSubscribeMessage({
+              tmplIds: tmplIds,
+              success(res) {
+                let status = null;
+                tmplIds.map((item, index) => {
+                  if (res[item] == 'accept') {
+                    status = 'accept';
+                  }
+                });
+                if (status == 'accept') {
+                  that.$successToast('订阅成功');
+                } else {
+                  that.$toast('订阅取消');
+                }
+              },
+              fail(res) {
+                console.log(res);
+                that.$toast('订阅失败');
+              },
+            });
+          } else if (res.cancel) {
+            uni.showModal({
+              title: '温馨提示',
+              content: '拒绝后您将无法获取实时的与卖家（买家）的交易消息',
+              confirmText: '知道了',
+              showCancel: false,
+              success: function (res) {},
+            });
+          }
+        },
+      });
+    },
+
+    // 去售后详情
+    toReturnDetail(orderRefundId) {
+      uni.navigateTo({
+        url: '/pages/mine/order/return/detail?orderRefundId=' + orderRefundId,
+      });
+    },
+
+    // 去查看物流
+    toLogistics(companyCode, logisticsNo) {
+      uni.navigateTo({
+        url:
+          '/pages/mine/order/logistics?companyCode=' +
+          companyCode +
+          '&logisticsNo=' +
+          logisticsNo,
+      });
+    },
+
+    // 提醒发货
+    remindShipment(orderId) {
+      if (!this.canRemindShipment) {
+        return this.$toast('请勿频繁操作');
+      }
+      this.canRemindShipment = false;
+      setTimeout(() => {
+        this.canRemindShipment = true;
+      }, 3000);
+
+      this.$axios({
+        url: '/order/notice',
+        params: {
+          orderId: orderId,
+          userId: this.userId,
+        },
+      }).then((res) => {
+        this.$successToast('提醒发货成功');
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss">
+.app-container {
+  background: #f4f2f2;
+  box-sizing: border-box;
+}
+.tab-container {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  background: #ffffff;
+  display: flex;
+  .item {
+    width: 20%;
+    text-align: center;
+    text {
+      display: inline-block;
+      padding: 0 10rpx;
+      line-height: 80rpx;
+      padding-top: 8rpx;
+    }
+    &.current {
+      text {
+        color: #ff3f42;
+        border-bottom: 6rpx solid #ff3f42;
+      }
+    }
+  }
+}
+.list-container {
+  padding: 110rpx 20rpx 0;
+  .item {
+    margin-bottom: 20rpx;
+    background: #ffffff;
+    border-radius: 20rpx;
+    padding: 0 20rpx;
+    .top {
+      height: 70rpx;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      .left {
+        font-size: 28rpx;
+        color: #666666;
+      }
+      .right {
+        font-size: 28rpx;
+        color: #fe781f;
+      }
+    }
+    .goods {
+      display: flex;
+      justify-content: space-between;
+      margin-top: 20rpx;
+      &.goods0 {
+        margin-top: 0;
+      }
+      image {
+        width: 140rpx;
+        height: 140rpx;
+        display: block;
+        flex-shrink: 0;
+        margin-right: 20rpx;
+      }
+      .main {
+        width: 510rpx;
+        .row1 {
+          display: flex;
+          justify-content: space-between;
+          .name {
+            font-size: 28rpx;
+            line-height: 36rpx;
+          }
+          .price {
+            font-size: 28rpx;
+            margin-left: 20rpx;
+            color: #666666;
+          }
+        }
+        .row2 {
+          display: flex;
+          justify-content: space-between;
+          font-size: 28rpx;
+          color: #999999;
+          margin-top: 10rpx;
+        }
+      }
+    }
+    .bottom {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      height: 50rpx;
+      .left {
+        font-size: 24rpx;
+        color: #999999;
+      }
+      .total {
+        font-size: 24rpx;
+        color: #666666;
+        text {
+          color: #ff3f42;
+          font-size: 28rpx;
+        }
+      }
+    }
+    .btn-group {
+      border-top: 1px solid #eaeaea;
+      height: 100rpx;
+      display: flex;
+      justify-content: flex-end;
+      align-items: center;
+      &.btn-group2 {
+        justify-content: space-between;
+        .tips {
+          font-size: 28rpx;
+          color: #ff3f42;
+        }
+        .btns {
+          display: flex;
+        }
+      }
+      .button {
+        width: 140rpx;
+        height: 48rpx;
+        border-radius: 48rpx;
+        text-align: center;
+        line-height: 48rpx;
+        font-size: 24rpx;
+        margin-left: 20rpx;
+        flex-shrink: 0;
+        &:first-child {
+          margin-left: 0;
+        }
+        &.gray {
+          color: #999999;
+          border: 1px solid #999999;
+        }
+        &.white {
+          color: #ff3f42;
+          border: 1px solid #ff3f42;
+        }
+        &.red {
+          color: #ffffff;
+          border: 1px solid #ff3f42;
+          background: #ff3f42;
+        }
+      }
+    }
+  }
+}
+</style>

pages/mine/order/logistics.vue

@@ -0,0 +1,115 @@
+<template>
+	<view class="app-container">
+		<view class="all-container" v-if="!isNoData">
+			<view class="top-container">
+				<view class="left">{{logisticsData[0].comName}}<text>{{logisticsData[0].logisticsNo}}</text></view>
+				<view class="right">
+					<text @tap="copy(logisticsData[0].logisticsNo)">复制单号</text>
+				</view>
+			</view>
+			<view class="mian-container">
+				<common-logistics :logisticsData="logisticsData"></common-logistics>
+			</view>
+		</view>
+		
+		<no-data v-if="isNoData" :showText="noDataText"></no-data>
+	</view>
+</template>
+
+<script>
+	import { setAttribute, changeAttribute } from '@/components/logistics/init-logistics.js';
+	import CommonLogistics from '@/components/logistics/common-logistics.vue';
+	
+	export default {
+		components: {
+			CommonLogistics
+		},
+		
+		data() {
+			return {
+				companyCode: null,
+				logisticsNo: null,
+				logisticsData: [],
+				testStrList: [0,1,2,3,4,5,6],
+				isNoData: false,
+				noDataText: '',
+			}
+		},
+		
+		onLoad({companyCode, logisticsNo}) {
+			this.companyCode = companyCode == 'undefined' ? 'shunfeng' : companyCode;
+			this.logisticsNo = logisticsNo;
+			this.getDetail();
+		},
+		
+		methods: {
+			// 获取物流详情
+			getDetail() {
+				this.$axios({
+					url: '/common/express',
+					method: 'get',
+					params: {
+						companyCode: this.companyCode,
+						logisticsNo: this.logisticsNo,
+					}
+				}).then(res => {
+					if(res.code == 200 && res.data.length >= 1) {
+						let logisticsData = res.data;
+						this.logisticsData = changeAttribute(this.testStrList, setAttribute(logisticsData));
+					}else if(res.code == 1100) {
+						this.isNoData = true;
+						this.noDataText = res.message;
+					}else if(res.data.length < 1) {
+						this.isNoData = true;
+						this.noDataText = '暂无物流信息';
+					}
+				}).catch(res => {
+					this.isNoData = true;
+					this.noDataText = res.message;
+				})
+			},
+			
+			// 复制
+			copy(val) {
+				let that = this;
+				uni.setClipboardData({
+				    data: val,
+				    success: function () {
+				        that.$successToast('复制成功');
+				    }
+				});
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		box-sizing: border-box;
+		padding: 20rpx;
+	}
+	.all-container {
+		padding: 20rpx;
+		background: #FFFFFF;
+		border-radius: 20rpx;
+	}
+	.top-container {
+		display: flex;
+		justify-content: space-between;
+		align-items: flex-end;
+		margin-bottom: 30rpx;
+		.left {
+			text {
+				font-size: 24rpx;
+				margin-left: 16rpx;
+			}
+		}
+		.right {
+			text {
+				font-size: 24rpx;
+				color: #FE781F;
+			}
+		}
+	}
+</style>

pages/mine/order/return/apply.vue

@@ -0,0 +1,560 @@
+<template>
+	<view class="app-container">
+		<view class="status-container">请先联系客服再进行退货操作</view>
+		<view class="main-container">
+			<view class="goods-container card">
+				<view class="title">商品信息</view>
+				<block v-for="(item, index) in orderGoodsList" :key='index'>
+					<view class="item">
+						<view class="check" v-if="item.selected" @tap="selectList(index)"><image src="@/static/icon/select_1.png" mode=""></image></view>
+						<view class="check" v-else @tap="selectList(index)"><image src="@/static/icon/select_0.png" mode=""></view>
+						<view class="img"><image :src="item.imgUrl" mode="aspectFill"></image></view>
+						<view class="right">
+							<view class="top">
+								<view class="name ellipsis-2">{{item.goodsName}}</view>
+								<view class="des">{{item.goodsSpecValue}}</view>
+							</view>
+							<view class="bottom">
+								<view class="price">￥{{item.price | numToFixed}}</view>
+								<u-number-box
+									v-model="item.num" 
+									:min="1" 
+									:max="item.oldNum"
+									:buttonSize="26" 
+									iconStyle="font-size: 12px;">
+								</u-number-box>
+							</view>
+						</view>
+					</view>
+				</block>
+			</view>
+			
+			<view class="total-container card">
+				<view class="top">
+					<view class="item">
+						<view>商品金额</view>
+						<view>￥{{orderDetail.totalProductAmount | numToFixed}}</view>
+					</view>
+					<view class="item">
+						<view>运费</view>
+						<view>￥{{orderDetail.freight | numToFixed}}</view>
+					</view>
+					<view class="item">
+						<view>优惠</view>
+						<view>-￥{{orderDetail.couponValue | numToFixed}}</view>
+					</view>
+				</view>
+				<view class="bottom">
+					<view class="total">付款合计：<text>￥{{orderDetail.payAmount | numToFixed}}</text></view>
+					<!-- <view class="total">预计收入：<text>￥{{1 | numToFixed}}</text></view> -->
+				</view>
+			</view>
+			
+			<view class="form-container card">
+				<view class="title">退货信息填写</view>
+				<view class="item">
+					<view class="label">请选择类型：</view>
+					<view class="radio-group">
+						<view class="radio" @tap="returnType = 'REFUND_AMOUNT'">
+							<image src="@/static/icon/select_0.png" v-if="returnType == 'REFUND_GOODS'"></image>
+							<image src="@/static/icon/select_1.png" v-if="returnType == 'REFUND_AMOUNT'"></image>
+							仅退款
+						</view>
+						<view class="radio" @tap="returnType = 'REFUND_GOODS'" v-if="is_REFUND_GOODS && has_INSTALL_GOODS">
+							<image src="@/static/icon/select_1.png" v-if="returnType == 'REFUND_GOODS'"></image>
+							<image src="@/static/icon/select_0.png" v-if="returnType == 'REFUND_AMOUNT'"></image>
+							退货退款
+						</view>
+					</view>
+				</view>
+				<view class="item">
+					<view class="label">退换货原因：</view>
+					<view class="picker">
+						<picker @change="changeReason" :value="reasonIndex" :range="reasonArray">
+							<view>{{reasonArray[reasonIndex]}}</view>
+						</picker>
+					</view>
+				</view>
+				<view class="item">
+					<view class="label">退换货说明：</view>
+					<view class="textarea">
+						<textarea maxlength="80" placeholder="退换货说明(选填)" v-model="returnExplain" />
+					</view>
+				</view>
+				<view class="item">
+					<view class="label">*上传凭证：</view>
+					<view class="images">
+						<block v-for="(item, index) in images" :key='index'>
+							<view class="img">
+								<image :src="item.url" mode="aspectFill"></image>
+								<text @tap="delImage(index)">x</text>
+							</view>
+						</block>
+						<view class="add"  @tap="addImage" v-if="images.length < 3">
+							<image src="@/static/icon/camera.png"></image>
+							<text>上传凭证</text>
+							<text>(最多3张)</text>
+						</view>
+					</view>
+				</view>
+			</view>
+			
+			<view class="bottom-container">
+				<view class="button" @tap="submitApply">提交申请</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import { base_url } from '@/utils/config.js';
+	
+	export default {
+		data() {
+			return {
+				orderId: null, // 订单id
+				orderDetail: {}, // 订单详情
+				orderGoodsList: [],
+				reasonArray: ['7天无理由退货', '与商品信息描述不符', '质量问题', '卖家发错货', '包装/商品破损/污渍', '其它原因'], // 退货原因列表
+				reasonIndex: 0, // 退货原因选择值
+				images: [], // 凭证
+				returnType: 'REFUND_AMOUNT', // 退款类型：REFUND_AMOUNT=仅退款 REFUND_GOODS=退货退款
+				returnExplain: '', // 退换货说明
+				canClickSave: true, // 能否点击提交
+			}
+		},
+		
+		computed: {
+			is_REFUND_GOODS() {
+				if(this.orderDetail.orderStatus === 'DFH') {
+					this.returnType = 'REFUND_AMOUNT';
+					return false;
+				}
+				if(this.orderDetail.orderStatus === 'REFUND' && !this.orderDetail.logisticsNo) {
+					this.returnType = 'REFUND_AMOUNT';
+					return false;
+				}
+				
+				return true;
+			},
+			
+			has_INSTALL_GOODS() {
+				// 只要选中安装产品，就true
+				for (let i=0; i<this.orderGoodsList.length; i++) {
+					if(this.orderGoodsList[i].selected && this.orderGoodsList[i].workOrderType === 'INSTALL') {
+						return true;
+						break;
+					}
+				}
+				
+				return false;
+			}
+		},
+		
+		onLoad({orderId}) {
+			this.orderId = orderId;
+			this.getOrderDetail();
+		},
+		
+		methods: {
+			getOrderDetail() {
+				this.$axios({
+					url: '/order/detail',
+					method: 'get',
+					params: {
+						orderId: this.orderId
+					}
+				}).then(res => {
+					this.orderDetail = res.data;
+					this.orderGoodsList = res.data.orderDetails;
+					this.orderGoodsList.forEach((item, index) => {
+						item.selected = true;
+						item.oldNum = item.num;
+					})
+				})
+			},
+			
+			selectList(index) {
+				this.orderGoodsList[index].selected = !this.orderGoodsList[index].selected;
+				
+				var ocuritem = this.orderGoodsList.pop();
+				this.orderGoodsList.push(ocuritem);
+			},
+			
+			changeReason: function(e) {
+				console.log('picker发送选择改变，携带值为', e.target.value)
+				this.reasonIndex = e.target.value
+			},
+			
+			// 删除图片
+			delImage(index) {
+				this.images.splice(index, 1);
+			},
+			
+			// 添加图片
+			async addImage() {
+				const files = await new Promise((resolve,reject)=>{
+					uni.chooseImage({
+						count: 3 - this.images.length,
+						success:res=>{
+							resolve(res.tempFilePaths)
+						},fail:err=>{
+							reject()
+						}
+					})
+				});
+				uni.showLoading({
+					title:'上传中'
+				})
+				let arr = [];
+				files.forEach(item=>{
+					arr.push(this.uploadFile(item))
+				});
+				Promise.all(arr).then(res=>{
+					this.images = this.images.concat(res.map(item=>{
+						return JSON.parse(item).data;
+					}))
+					console.log(this.images);
+				}).catch(err=>{
+					uni.showModal({
+						title:'上传失败'
+					})
+				}).finally(()=>{
+					uni.hideLoading();
+				})
+			},
+			
+			// 上传图片
+			async uploadFile(file) {
+				const result = new Promise((resolve, reject) => {
+					uni.uploadFile({
+						url: base_url + '/common/upload',
+						header: {
+							"Content-Type": 'multipart/form-data',
+							"x-token": uni.getStorageSync('token')
+						},
+						name: 'file',
+						filePath: file,
+						success(res) {
+							resolve(res.data)
+						}
+					})
+				})
+				return result;
+			},
+			
+			// 验证数据
+			vailateData() {
+				let goodsList = [];
+				this.orderGoodsList.forEach(item => {
+					if(item.selected) {
+						goodsList.push(item);
+					}
+				})
+				if(goodsList.length < 1) {
+					this.$toast('请选择商品');
+					return false;
+				}
+				
+				if(this.images.length < 1) {
+					this.$toast('请上传凭证');
+					return false;
+				}
+				return true;
+			},
+			
+			// 提交申请
+			submitApply() {
+				if (!this.canClickSave) return false;
+				this.canClickSave = false;
+				setTimeout(() => { this.canClickSave = true }, 3000)
+				if(!this.vailateData())return;
+				
+				let goodsList = [];
+				this.orderGoodsList.forEach(item => {
+					let obj = {};
+					if(item.selected) {
+						obj = {
+							orderDetailId: item.orderDetailId,
+							num: item.num
+						}
+						goodsList.push(obj);
+					}
+				})
+				
+				let imgIds = [];
+				this.images.forEach(item => {
+					imgIds.push(item.id);
+				})
+				
+				this.$axios({
+					url: '/order/refund/apply',
+					type: 'application/json',
+					params: {
+						orderId: this.orderId,
+						refundReason: this.reasonArray[this.reasonIndex],
+						refundExplain: this.returnExplain,
+						refundType: this.returnType,
+						imgIds: imgIds,
+						refundGoods: goodsList,
+					}
+				}).then(res => {
+					this.$successToast('申请已提交');
+					uni.$emit('refreshOrderList', res.data);
+					uni.$emit('refreshOrderDetail', res.data);
+					setTimeout(() => {
+						// uni.navigateBack({
+						// 	delta: 1
+						// })
+						uni.redirectTo({
+							url:'/pages/mine/order/return/detail?orderRefundId=' + res.data
+						})
+					}, 1000)
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		box-sizing: border-box;
+	}
+	.status-container {
+		background: #FE781F;
+		line-height: 80rpx;
+		text-align: center;
+		font-size: 32rpx;
+		color: #FFFFFF;
+	}
+	.card {
+		background: #FFFFFF;
+		border-radius: 20rpx;
+		margin-bottom: 20rpx;
+	}
+	.main-container {
+		padding: 20rpx 20rpx 120rpx;
+	}
+	.goods-container {
+		padding: 0 20rpx;
+		.title {
+			font-size: 32rpx;
+			color: #333333;
+			line-height: 32rpx;
+			padding-top: 20rpx;
+		}
+		.item {
+			padding: 20rpx 0;
+			border-bottom: 1px solid #eaeaea;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			&:last-child {
+				border: none;
+			}
+			.check {
+				margin-right: 20rpx;
+				image {
+					width: 32rpx;
+					height: 32rpx;
+					display: block;
+				}
+			}
+			.img image {
+				width: 180rpx;
+				height: 180rpx;
+				flex-shrink: 0;
+				margin-right: 20rpx;
+				display: block;
+			}
+			.right {
+				width: 470rpx;
+				height: 180rpx;
+				display: flex;
+				flex-direction: column;
+				justify-content: space-between;
+				.top {
+					.name {
+						font-size: 28rpx;
+						color: #333333;
+						line-height: 36rpx;
+					}
+					.des {
+						font-size: 28rpx;
+						color: #999999;
+						margin-top: 10rpx;
+					}
+				}
+				.bottom {
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+					.price {
+						font-size: 28rpx;
+						color: #FF3F42;
+						line-height: 28rpx;
+					}
+				}
+			}
+		}
+	}
+	.total-container {
+		padding: 0 20rpx;
+		font-size: 28rpx;
+		color: #333333;
+		.top {
+			padding: 10rpx 0;
+			border-bottom: 1px solid #eaeaea;
+		}
+		.item {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			height: 64rpx;
+		}
+		.bottom {
+			padding: 10rpx 0;
+		}
+		.total {
+			display: flex;
+			justify-content: flex-end;
+			height: 50rpx;
+			align-items: center;
+			text {
+				color: #FF3F42;
+			}
+		}
+	}
+	.form-container {
+		padding: 0 20rpx 20rpx;
+		.title {
+			font-size: 32rpx;
+			color: #333333;
+			line-height: 32rpx;
+			padding-top: 20rpx;
+		}
+		.item {
+			display: flex;
+			margin-top: 30rpx;
+			.label {
+				line-height: 48rpx;
+				width: 180rpx;
+			}
+			.radio-group {
+				display: flex;
+				height: 48rpx;
+				align-items: center;
+				.radio {
+					display: flex;
+					align-items: center;
+					margin-right: 40rpx;
+					image {
+						width: 32rpx;
+						height: 32rpx;
+						display: block;
+						margin-right: 10rpx;
+					}
+				}
+			}
+			.picker {
+				picker {
+					width: 480rpx;
+					height: 48rpx;
+					line-height: 48rpx;
+					border: 1px solid #eaeaea;
+					border-radius: 10rpx;
+					padding: 0 20rpx;
+					box-sizing: border-box;
+				}
+			}
+			.textarea {
+				textarea {
+					width: 480rpx;
+					height: 200rpx;
+					border: 1px solid #eaeaea;
+					border-radius: 10rpx;
+					padding: 10rpx 20rpx;
+					box-sizing: border-box;
+				}
+			}
+			.images {
+				display: flex;
+				.add {
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					justify-content: center;
+					width: 146rpx;
+					height: 146rpx;
+					border: 2rpx dashed #dadada;
+					border-radius: 10rpx;
+					image {
+						width: 48rpx;
+						height: 34rpx;
+						display: block;
+						margin-bottom: 8rpx;
+					}
+					text {
+						font-size: 22rpx;
+						color: #999999;
+						line-height: 24rpx;
+					}
+				}
+				.img {
+					position: relative;
+					margin-right: 18rpx;
+					&:nth-child(3) {
+						margin-right: 0;
+					}
+					image {
+						width: 150rpx;
+						height: 150rpx;
+						border-radius: 10rpx;
+						overflow: hidden;
+						display: block;
+					}
+					text {
+						position: absolute;
+						right: -10rpx;
+						top: -10rpx;
+						width: 40rpx;
+						height: 40rpx;
+						border-radius: 50%;
+						background: #FF3F42;
+						font-size: 28rpx;
+						color: #FFFFFF;
+						text-align: center;
+						line-height: 36rpx;
+						display: block;
+					}
+				}
+			}
+		}
+	}
+	.bottom-container {
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		width: 100%;
+		padding: 0 20rpx;
+		box-sizing: border-box;
+		height: 100rpx;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		background: #FFFFFF;
+		border-top: 1px solid #F4F2F2;
+		.button {
+			width: 100%;
+			height: 70rpx;
+			line-height: 70rpx;
+			text-align: center;
+			border-radius: 70rpx;
+			background: linear-gradient(-90deg,#ff3f42 0%, #fe781f 100%);
+			font-size: 32rpx;
+			color: #FFFFFF;
+			
+		}
+	}
+</style>

pages/mine/order/return/detail.vue

@@ -0,0 +1,703 @@
+<template>
+	<view class="app-container">
+		<no-data v-if="isLoading" :showText="'加载中'"></no-data>
+		<no-data v-if="!isLoading && noData" :showText="'加载失败'"></no-data>
+		<block v-if="!isLoading && !noData">
+			<view class="status-container" v-if="orderDetail.orderStatus == 'DSJCL'">已提交申请，请等待商家处理</view>
+			<view class="status-container" v-if="orderDetail.orderStatus == 'DMJCL' && orderDetail.examineStatus == 'OK'">商家已通过申请，请填写资料</view>
+			<view class="status-container" v-if="orderDetail.orderStatus == 'DMJCL' && orderDetail.examineStatus == 'FAIL'">申请审核不通过</view>
+			<view class="status-container" v-if="orderDetail.orderStatus == 'DSJSH'">请等待商家收货</view>
+			<view class="status-container" v-if="orderDetail.orderStatus == 'OVER'">订单退款成功</view>
+			
+			<view class="main-container">
+				<view class="top-container card" v-if="orderDetail.orderStatus == 'DSJCL' || orderDetail.orderStatus == 'DMJCL'">
+					<view class="title">您已成功发起退/换货申请，请耐心商家处理</view>
+					<view class="des">商家同意后，请按照给出的退货地址退货，并记录物流单号；如商家拒绝，你可以修改申请后再次发起，商家会重新处理；如商家超时未处理，退货申请将达成，请按照系统给出的退货地址退货；</view>
+					<view class="btn-group">
+						<!-- <view class="button" @tap="isCancelDialog = true" v-if="orderDetail.examineStatus == 'WAIT'">撤销申请</view> -->
+						<view class="button" @tap="reapply()" v-if="orderDetail.orderStatus == 'DMJCL' && orderDetail.examineStatus == 'FAIL'">重新申请</view>
+					</view>
+				</view>
+				
+				<view class="result-container card" v-if="orderDetail.orderStatus == 'OVER'">
+					<view class="item">
+						<view class="left">退款总金额</view>
+						<view class="right">¥{{orderDetail.refundAmount | numToFixed}}</view>
+					</view>
+					<view class="item">
+						<view class="left">退款路径</view>
+						<view class="right">原路返回</view>
+					</view>
+				</view>
+				
+				<view class="form-container card" v-if="(orderDetail.orderStatus == 'DMJCL' && orderDetail.examineStatus == 'OK') || orderDetail.orderStatus == 'DSJSH'">
+					<view class="title">{{orderDetail.orderStatus == 'DSJSH' ? '':'请填写'}}退换信息</view>
+					<view class="item">
+						<view class="label">商家信息：</view>
+						<view class="info">
+							<view class="top">{{orderDetail.storageName ? orderDetail.storageName : ''}} <text>{{orderDetail.storagePhone ? orderDetail.storagePhone : ''}}</text></view>
+							<view class="bottom">{{orderDetail.storageAddress ? orderDetail.storageAddress : ''}}</view>
+						</view>
+					</view>
+					<view class="item">
+						<view class="label">快递公司：</view>
+						<view class="picker">
+							<picker @change="changeCompany" :value="companyIndex" :range="companyArray" range-key="name" :disabled="orderDetail.orderStatus == 'DSJSH'">
+								<view>{{companyArray[companyIndex].name}}</view>
+							</picker>
+						</view>
+					</view>
+					<view class="item">
+						<view class="label">快递单号：</view>
+						<view class="input">
+							<input type="text" placeholder="请填写快递单号" v-model="courierNumber" :disabled="orderDetail.orderStatus == 'DSJSH'">
+						</view>
+					</view>
+					<view class="item">
+						<view class="label">上传凭证：</view>
+						<view class="images">
+							<block v-for="(item, index) in images" :key='index'>
+								<view class="img">
+									<image :src="item.url" mode="aspectFill"></image>
+									<text @tap="delImage(index)" v-if="orderDetail.orderStatus != 'DSJSH'">x</text>
+								</view>
+							</block>
+							<view class="add"  @tap="addImage" v-if="images.length < 3 && orderDetail.orderStatus != 'DSJSH'">
+								<image src="@/static/icon/camera.png"></image>
+								<text>上传凭证</text>
+								<text>(最多3张)</text>
+							</view>
+						</view>
+					</view>
+				</view>
+				
+				<!-- 拒绝申请 -->
+				<view class="goods-container card" v-if="orderDetail.examineStatus === 'FAIL'">
+					<view class="title">商品信息</view>
+					<block v-for="(item, index) in orderDetail.orderDetails" :key='index'>
+						<view class="item">
+							<view class="img"><image :src="item.imgUrl" mode="aspectFill"></image></view>
+							<view class="right">
+								<view class="top">
+									<view class="name ellipsis-2">{{item.goodsName}}</view>
+									<view class="des">{{item.goodsSpecValue}}</view>
+								</view>
+								<view class="bottom">
+									<view class="price">￥{{item.price | numToFixed}}</view>
+									<view class="num">x{{item.num}}</view>
+								</view>
+							</view>
+						</view>
+					</block>
+				</view>
+				<!-- 其他 -->
+				<view class="goods-container card" v-else>
+					<view class="title">退款商品</view>
+					<block v-for="(item, index) in orderDetail.orderDetails" :key='index'>
+						<view class="item" v-if="item.refund">
+							<view class="img"><image :src="item.imgUrl" mode="aspectFill"></image></view>
+							<view class="right">
+								<view class="top">
+									<view class="name ellipsis-2">{{item.goodsName}}</view>
+									<view class="des">{{item.goodsSpecValue}}</view>
+								</view>
+								<view class="bottom">
+									<view class="price">￥{{item.price | numToFixed}}</view>
+									<view class="num">x{{item.refundNum}}</view>
+								</view>
+							</view>
+						</view>
+					</block>
+				</view>
+				
+				<view class="total-container card">
+					<view class="title">订单信息</view>
+					<view class="top">
+						<view class="item">
+							<view>商品金额</view>
+							<view>￥{{orderDetail.totalProductAmount | numToFixed}}</view>
+						</view>
+						<view class="item">
+							<view>运费</view>
+							<view>￥{{orderDetail.freight | numToFixed}}</view>
+						</view>
+						<view class="item">
+							<view>优惠</view>
+							<view>-￥{{orderDetail.couponValue | numToFixed}}</view>
+						</view>
+					</view>
+					<view class="bottom">
+						<view class="total">付款合计：<text>￥{{orderDetail.payAmount | numToFixed}}</text></view>
+						<!-- <view class="total">预计收入：<text>￥{{1 | numToFixed}}</text></view> -->
+					</view>
+				</view>
+				
+				<view class="order-container card">
+					<view class="title">退货信息</view>
+					<view class="item2">
+						<view class="label">退换货类型</view>
+						<view class="value">{{orderDetail.refundType | typeFilter}}</view>
+					</view>
+					<view class="item2">
+						<view class="label">退换货原因</view>
+						<view class="value">{{orderDetail.refundReason}}</view>
+					</view>
+					<view class="item2">
+						<view class="label">退换货金额</view>
+						<view class="value">¥{{orderDetail.refundAmount}}</view>
+					</view>
+					<view class="item2">
+						<view class="label">申请数量</view>
+						<view class="value">{{orderDetail.examineStatus === 'FAIL' ? orderDetail.totalNum : orderDetail.refundNum}}</view>
+					</view>
+					<view class="item2">
+						<view class="label">申请时间</view>
+						<view class="value">{{orderDetail.createTime}}</view>
+					</view>
+					<view class="item2">
+						<view class="label">退款编号</view>
+						<view class="value">{{orderDetail.orderRefundId}}</view>
+					</view>
+					<view class="item2">
+						<view class="label">卖家留言</view>
+						<view class="value">{{orderDetail.refundMessage || ''}}</view>
+					</view>
+				</view>
+				
+				<view class="bottom-container" v-if="orderDetail.orderStatus == 'DMJCL' && orderDetail.examineStatus == 'OK'">
+					<view class="button" @tap="submitForm">提交信息</view>
+				</view>
+			</view>
+		</block>
+		
+		<!-- 撤销申请 -->
+		<modal-dialog showText="确定要撤销申请吗？" :isShowDialog="isCancelDialog" @cancel="isCancelDialog = false" @confirm="confirmCancelApply"></modal-dialog>
+	</view>
+</template>
+
+<script>
+	import { base_url } from '@/utils/config.js';
+	import modalDialog from '@/components/modalDialog.vue';
+	
+	export default {
+		components:{
+			modalDialog
+		},
+		filters: {
+			typeFilter(val) {
+				const statusMap = {
+					REFUND_AMOUNT: '仅退款',
+					REFUND_GOODS: '退货退款',
+				 }
+				 return statusMap[val]
+			},
+		},
+		data() {
+			return {
+				isLoading: true,
+				noData: true,
+				orderRefundId: null, // 售后订单id
+				orderDetail: {}, // 订单详情
+				companyArray: [], // 物流公司列表
+				companyIndex: 0, // 物流公司选择值
+				images: [], // 凭证
+				courierNumber: '', // 快递单号
+				canClickSave: true, // 能否点击提交
+				isCancelDialog: false, // 是否显示撤销申请弹窗
+			}
+		},
+		
+		onLoad({orderRefundId}) {
+			this.orderRefundId = orderRefundId;
+			this.getCompany();
+			
+		},
+		
+		methods: {
+			getOrderDetail() {
+				this.$axios({
+					url: '/order/refund/detail',
+					method: 'get',
+					params: {
+						orderRefundId: this.orderRefundId
+					}
+				}).then(res => {
+					let refundNum = 0;
+					res.data.orderDetails.forEach(item => {
+						if(item.refund) {
+							refundNum = refundNum + item.refundNum;
+						}
+					})
+					res.data.refundNum = refundNum;
+					this.orderDetail = res.data;
+					this.noData = false;
+					this.isLoading = false;
+					if(res.data.orderStatus == 'DSJSH') {
+						this.courierNumber = res.data.logisticsNo;
+						this.companyIndex = this.findElem(this.companyArray, 'code', res.data.expressCompanyCode);
+						this.images = res.data.files;
+					}
+				}).catch(res => {
+					this.noData = true;
+					this.isLoading = false;
+				})
+			},
+			
+			findElem(array, attr, val) {
+			    for (var i = 0; i < array.length; i++) {
+			        if (array[i][attr] == val) {
+			            return i; //返回当前索引值
+			        }
+			    }
+			    return -1;
+			},
+			
+			getCompany() {
+				this.$axios({
+					url: '/common/express/company',
+					method: 'get',
+				}).then(res => {
+					this.companyArray = res.data;
+					
+					this.getOrderDetail();
+				})
+			},
+			
+			changeCompany: function(e) {
+				console.log('picker发送选择改变，携带值为', e.target.value)
+				this.companyIndex = e.target.value
+			},
+			
+			// 确认撤销申请
+			confirmCancelApply() {
+				this.$axios({
+					url: '/order/refund/cancel',
+					params: {
+						refundOrderId: this.orderRefundId
+					}
+				}).then(res => {
+					this.isCancelDialog = false;
+					uni.$emit('refreshOrderList');
+					uni.$emit('refreshOrderDetail');
+					this.$successToast('撤销申请成功');
+					setTimeout(() => {
+						uni.navigateBack({
+						    delta: 1
+						});
+					}, 1000)
+				})
+			},
+			
+			// 删除图片
+			delImage(index) {
+				this.images.splice(index, 1);
+			},
+			
+			// 添加图片
+			async addImage() {
+				const files = await new Promise((resolve,reject)=>{
+					uni.chooseImage({
+						count: 3 - this.images.length,
+						success:res=>{
+							resolve(res.tempFilePaths)
+						},fail:err=>{
+							reject()
+						}
+					})
+				});
+				uni.showLoading({
+					title:'上传中'
+				})
+				let arr = [];
+				files.forEach(item=>{
+					arr.push(this.uploadFile(item))
+				});
+				Promise.all(arr).then(res=>{
+					this.images = this.images.concat(res.map(item=>{
+						return JSON.parse(item).data;
+					}))
+					console.log(this.images);
+				}).catch(err=>{
+					uni.showModal({
+						title:'上传失败'
+					})
+				}).finally(()=>{
+					uni.hideLoading();
+				})
+			},
+			
+			// 上传图片
+			async uploadFile(file) {
+				const result = new Promise((resolve, reject) => {
+					uni.uploadFile({
+						url: base_url + '/common/upload',
+						header: {
+							"Content-Type": 'multipart/form-data',
+							"x-token": uni.getStorageSync('token')
+						},
+						name: 'file',
+						filePath: file,
+						success(res) {
+							resolve(res.data)
+						}
+					})
+				})
+				return result;
+			},
+			
+			// 验证数据
+			vailateData() {
+				if(this.images.length < 1) {
+					this.$toast('请上传凭证');
+					return false;
+				}
+				if(!this.courierNumber) {
+					this.$toast('请填写快递单号');
+					return false;
+				}
+				return true;
+			},
+			
+			// 提交申请
+			submitForm() {
+				if (!this.canClickSave) return false;
+				this.canClickSave = false;
+				setTimeout(() => { this.canClickSave = true }, 3000)
+				if(!this.vailateData())return;
+				
+				let imgIds = [];
+				this.images.forEach(item => {
+					imgIds.push(item.id);
+				})
+				this.$axios({
+					url: '/order/refund/supply',
+					params: {
+						orderRefundId: this.orderRefundId,
+						expressCompany: this.companyArray[this.companyIndex].code,
+						logisticsNo: this.courierNumber,
+						imgIds: imgIds
+					}
+				}).then(res => {
+					this.$successToast('提交成功');
+					this.getOrderDetail();
+					uni.$emit('refreshOrderDetail');
+				})
+			},
+			
+			// 重新申请
+			reapply() {
+				uni.redirectTo({
+					url:'/pages/mine/order/return/apply?orderId=' + this.orderDetail.orderId
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		box-sizing: border-box;
+	}
+	.status-container {
+		background: #FE781F;
+		line-height: 80rpx;
+		text-align: center;
+		font-size: 32rpx;
+		color: #FFFFFF;
+	}
+	.result-container {
+		padding: 0 20rpx;
+		font-size: 28rpx;
+		color: #333333;
+		.item {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			height: 88rpx;
+			border-bottom: 1px solid #eaeaea;
+		}
+	}
+	.top-container {
+		padding: 0 20rpx;
+		.title {
+			font-size: 28rpx;
+			line-height: 50rpx;
+			padding-top: 10rpx;
+		}
+		.des {
+			font-size: 24rpx;
+			color: #999999;
+			line-height: 32rpx;
+			padding: 10rpx 0;
+		}
+		.btn-group {
+			padding: 20rpx 0;
+			display: flex;
+			justify-content: flex-end;
+			border-top: 1px solid #eaeaea;
+			.button {
+				width: 140rpx;
+				height: 48rpx;
+				border-radius: 48rpx;
+				border: 1px solid #eaeaea;
+				font-size: 24rpx;
+				color: #666666;
+				text-align: center;
+				line-height: 48rpx;
+			}
+		}
+	}
+	.card {
+		background: #FFFFFF;
+		border-radius: 20rpx;
+		margin-bottom: 20rpx;
+	}
+	.main-container {
+		padding: 20rpx 20rpx 120rpx;
+	}
+	.goods-container {
+		padding: 0 20rpx;
+		.title {
+			font-size: 32rpx;
+			color: #333333;
+			line-height: 32rpx;
+			padding-top: 20rpx;
+		}
+		.item {
+			padding: 20rpx 0;
+			border-bottom: 1px solid #eaeaea;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			&:last-child {
+				border: none;
+			}
+			.img image {
+				width: 180rpx;
+				height: 180rpx;
+				flex-shrink: 0;
+				margin-right: 20rpx;
+				display: block;
+			}
+			.right {
+				width: 470rpx;
+				height: 180rpx;
+				display: flex;
+				flex-direction: column;
+				justify-content: space-between;
+				.top {
+					.name {
+						font-size: 28rpx;
+						color: #333333;
+						line-height: 36rpx;
+					}
+					.des {
+						font-size: 28rpx;
+						color: #999999;
+						margin-top: 10rpx;
+					}
+				}
+				.bottom {
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+					.price {
+						font-size: 28rpx;
+						color: #FF3F42;
+						line-height: 28rpx;
+					}
+					.num {
+						font-size: 28rpx;
+						color: #333333;
+						line-height: 28rpx;
+					}
+				}
+			}
+		}
+	}
+	.total-container {
+		padding: 0 20rpx;
+		font-size: 28rpx;
+		color: #333333;
+		.title {
+			font-size: 32rpx;
+			color: #333333;
+			line-height: 32rpx;
+			padding-top: 20rpx;
+			padding-bottom: 10rpx;
+		}
+		.top {
+			padding: 10rpx 0;
+			border-bottom: 1px solid #eaeaea;
+		}
+		.item {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			height: 64rpx;
+		}
+		.bottom {
+			padding: 10rpx 0;
+		}
+		.total {
+			display: flex;
+			justify-content: flex-end;
+			height: 50rpx;
+			align-items: center;
+			text {
+				color: #FF3F42;
+			}
+		}
+	}
+	.form-container {
+		padding: 0 20rpx 20rpx;
+		.title {
+			font-size: 32rpx;
+			color: #333333;
+			line-height: 32rpx;
+			padding-top: 20rpx;
+		}
+		.item {
+			display: flex;
+			margin-top: 30rpx;
+			.label {
+				line-height: 48rpx;
+				width: 160rpx;
+			}
+			.info {
+				.top {
+					font-size: 28rpx;
+					color: #333333;
+					text {
+						font-size: 24rpx;
+						color: #999999;
+						margin-left: 20rpx;
+					}
+				}
+				.bottom {
+					font-size: 24rpx;
+					color: #666666;
+					margin-top: 10rpx;
+				}
+			}
+			.picker {
+				picker {
+					width: 500rpx;
+					height: 48rpx;
+					line-height: 48rpx;
+					border: 1px solid #eaeaea;
+					border-radius: 10rpx;
+					padding: 0 20rpx;
+					box-sizing: border-box;
+				}
+			}
+			.input {
+				input {
+					width: 500rpx;
+					height: 48rpx;
+					line-height: 48rpx;
+					border: 1px solid #eaeaea;
+					border-radius: 10rpx;
+					padding: 0 20rpx;
+					box-sizing: border-box;
+				}
+			}
+			.images {
+				display: flex;
+				.add {
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					justify-content: center;
+					width: 146rpx;
+					height: 146rpx;
+					border: 2rpx dashed #dadada;
+					border-radius: 10rpx;
+					image {
+						width: 48rpx;
+						height: 34rpx;
+						display: block;
+						margin-bottom: 8rpx;
+					}
+					text {
+						font-size: 22rpx;
+						color: #999999;
+						line-height: 24rpx;
+					}
+				}
+				.img {
+					position: relative;
+					margin-right: 18rpx;
+					&:nth-child(3) {
+						margin-right: 0;
+					}
+					image {
+						width: 150rpx;
+						height: 150rpx;
+						border-radius: 10rpx;
+						overflow: hidden;
+						display: block;
+					}
+					text {
+						position: absolute;
+						right: -10rpx;
+						top: -10rpx;
+						width: 40rpx;
+						height: 40rpx;
+						border-radius: 50%;
+						background: #FF3F42;
+						font-size: 28rpx;
+						color: #FFFFFF;
+						text-align: center;
+						line-height: 36rpx;
+						display: block;
+					}
+				}
+			}
+		}
+	}
+	.order-container {
+		padding: 20rpx;
+		.title {
+			font-size: 32rpx;
+			color: #333333;
+			line-height: 32rpx;
+			padding-bottom: 20rpx;
+		}
+		.item2 {
+			display: flex;
+			padding: 10rpx 0;
+			.label {
+				margin-right: 40rpx;
+				flex-shrink: 0;
+				width: 140rpx;
+			}
+		}
+	}
+	.bottom-container {
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		width: 100%;
+		padding: 0 20rpx;
+		box-sizing: border-box;
+		height: 100rpx;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		background: #FFFFFF;
+		border-top: 1px solid #F4F2F2;
+		.button {
+			width: 100%;
+			height: 70rpx;
+			line-height: 70rpx;
+			text-align: center;
+			border-radius: 70rpx;
+			background: linear-gradient(-90deg,#ff3f42 0%, #fe781f 100%);
+			font-size: 32rpx;
+			color: #FFFFFF;
+			
+		}
+	}
+</style>

pages/mine/profit/detail.vue

@@ -0,0 +1,270 @@
+<template>
+	<view class="app-container">
+		<view class="goods-container card">
+			<view class="title">商品信息</view>
+			<block v-for="(item, index) in detail.orderDetails" :key='index'>
+				<view class="item" @tap="toGoodsDetail(item.goodsId)">
+					<image :src="item.imgUrl" mode="aspectFill"></image>
+					<view class="right">
+						<view class="top">
+							<view class="name ellipsis-2">{{item.goodsName}}</view>
+							<view class="des">{{item.goodsSpecValue}}</view>
+						</view>
+						<view class="bottom">
+							<view class="price">￥{{item.price | numToFixed}}</view>
+							<view class="num">x{{item.num}}</view>
+						</view>
+					</view>
+				</view>
+			</block>
+			<view class="total">合计：<text>¥{{detail.totalAmount | numToFixed}}</text></view>
+		</view>
+		
+		<view class="order-container card">
+			<view class="title">订单信息</view>
+			<view class="item1">
+				<view class="left">
+					<view class="label">订单编号</view>
+					<view class="value">{{detail.orderId}}</view>
+				</view>
+				<view class="copy" @tap="copy(detail.orderId)">复制</view>
+			</view>
+			<view class="item2">
+				<view class="label">订单状态</view>
+				<view class="value">{{detail.orderStatus | statusFilter}}</view>
+			</view>
+			<view class="item2">
+				<view class="label">创建时间</view>
+				<view class="value">{{detail.createTime}}</view>
+			</view>
+			<view class="item2">
+				<view class="label">支付方式</view>
+				<view class="value">{{detail.payType}}</view>
+			</view>
+			<view class="item2">
+				<view class="label">支付时间</view>
+				<view class="value">{{detail.payTime}}</view>
+			</view>
+			<view class="item2" v-if="detail.orderShareStatus !== 'CANCEL'">
+				<view class="label">分享收益</view>
+				<view class="value red">¥{{detail.totalShareAmount | numToFixed}}</view>
+			</view>
+			<view class="item2">
+				<view class="label">收货人</view>
+				<view class="value">{{detail.receUserName}}</view>
+			</view>
+			<view class="item2">
+				<view class="label">收货电话</view>
+				<view class="value">{{detail.recePhone}}</view>
+			</view>
+			<view class="item3">
+				<view class="label">收货地址</view>
+				<view class="value">{{detail.province}}{{detail.city}}{{detail.area}}{{detail.street}}{{detail.receAddress}}{{detail.houseNo || ''}}</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		filters: {
+			statusFilter(val) {
+				if(!val) { return '' }
+				const statusMap = {
+					NOPAY: '待付款',
+					DFH: '待发货',
+					YFH: '已发货',
+					OVER: '已完成',
+					CLOSE: '已关闭',
+					REFUND: '售后中',
+				}
+				return statusMap[val];
+			}
+		},
+		
+		data() {
+			return {
+				orderId: null, // 订单id
+				orderRefundId: null, // 售后订单id
+				isReturnOrder: false, // 是否售后订单
+				detail: {}, // 详情数据
+			}
+		},
+		
+		onLoad({orderId, orderRefundId}) {
+			this.orderId = orderId;
+			if(orderRefundId != 'undefined') {
+				this.isReturnOrder = true;
+				this.orderRefundId = orderRefundId;
+			}
+			this.getOrderDetail();
+		},
+		
+		methods: {
+			getOrderDetail() {
+				let url = '', params = {};
+				if(this.isReturnOrder) {
+					url = '/order/refund/detail';
+					params = {
+						orderRefundId: this.orderRefundId
+					}
+				}else {
+					url = '/order/detail';
+					params = {
+						orderId: this.orderId
+					}
+				}
+				this.$axios({
+					url,
+					method: 'get',
+					params
+				}).then(res => {
+					this.detail = res.data;
+				})
+			},
+			
+			// 去商品详情
+			toGoodsDetail(id) {
+				uni.navigateTo({
+					url: '/packageGoods/pages/detail?id=' + id
+				})
+			},
+			
+			// 复制
+			copy(val) {
+				let that = this;
+				uni.setClipboardData({
+				    data: val,
+				    success: function () {
+				        that.$successToast('复制成功');
+				    }
+				});
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		box-sizing: border-box;
+		padding: 20rpx 20rpx 120rpx;
+	}
+	.card {
+		background: #FFFFFF;
+		border-radius: 20rpx;
+		margin-bottom: 20rpx;
+	}
+	.goods-container {
+		padding: 0 20rpx;
+		.title {
+			font-size: 32rpx;
+			color: #333333;
+			line-height: 32rpx;
+			padding-top: 20rpx;
+		}
+		.total {
+			display: flex;
+			justify-content: flex-end;
+			align-items: center;
+			height: 78rpx;
+			color: #666666;
+			text {
+				color: #FF3F42;
+			}
+		}
+		.item {
+			padding: 20rpx 0;
+			border-bottom: 1px solid #eaeaea;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			image {
+				width: 180rpx;
+				height: 180rpx;
+				flex-shrink: 0;
+				margin-right: 20rpx;
+			}
+			.right {
+				width: 470rpx;
+				height: 180rpx;
+				display: flex;
+				flex-direction: column;
+				justify-content: space-between;
+				.top {
+					.name {
+						font-size: 28rpx;
+						color: #333333;
+						line-height: 36rpx;
+					}
+					.des {
+						font-size: 28rpx;
+						color: #999999;
+						margin-top: 10rpx;
+					}
+				}
+				.bottom {
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+					.price {
+						font-size: 28rpx;
+						color: #FF3F42;
+						line-height: 28rpx;
+					}
+					.num {
+						font-size: 28rpx;
+						color: #333333;
+						line-height: 28rpx;
+					}
+				}
+			}
+		}
+	}
+	.order-container {
+		padding: 20rpx;
+		.title {
+			font-size: 32rpx;
+			color: #333333;
+			line-height: 32rpx;
+			padding-bottom: 20rpx;
+		}
+		.item1 {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			height: 60rpx;
+			.left {
+				display: flex;
+				.label {
+					flex-shrink: 0;
+					width: 140rpx;
+				}
+			}
+			.copy {
+				color: #FE781F;
+			}
+		}
+		.item2 {
+			display: flex;
+			align-items: center;
+			height: 60rpx;
+			.label {
+				flex-shrink: 0;
+				width: 140rpx;
+			}
+			.red {
+				color: #FE781F;
+			}
+		}
+		.item3 {
+			display: flex;
+			min-height: 60rpx;
+			margin-top: 10rpx;
+			.label {
+				flex-shrink: 0;
+				width: 140rpx;
+			}
+		}
+	}
+</style>

pages/mine/profit/list.vue

@@ -0,0 +1,258 @@
+<template>
+	<view class="app-container">
+		<view class="top-container">
+			<view class="item" :class="tabCurrent === '' ? 'current':''" @tap="changeTab('')">
+				<view class="money">{{total.totalAmount | numToFixed}}</view>
+				<view class="text">累计总收益</view>
+			</view>
+			<view class="item" :class="tabCurrent === 'OVER' ? 'current':''" @tap="changeTab('OVER')">
+				<view class="money">{{total.paidAmount | numToFixed}}</view>
+				<view class="text">已结算收益</view>
+			</view>
+			<view class="item" :class="tabCurrent === 'ING' ? 'current':''" @tap="changeTab('ING')">
+				<view class="money">{{total.waitingAmount | numToFixed}}</view>
+				<view class="text">待结算收益</view>
+			</view>
+		</view>
+		<view class="out-title">
+			<view>收益明细</view>
+			<view class="right" @tap="toReturn">查看退款明细</view>
+		</view>
+		<view class="list-container">
+			<block v-for="(item, index) in profitList" :key='index'>
+				<view class="item" @tap="toDetail(item.orderId, item.orderRefundId)">
+					<view class="left">
+						<view class="row">订单编号：{{item.orderId}}</view>
+						<view class="row">订单金额：¥{{item.payment | numToFixed}}</view>
+						<view class="row">支付时间：{{item.createTime}}</view>
+					</view>
+					<view class="right">
+						<view class="state wait" v-if="item.status == 'ING'">待结算</view>
+						<view class="state over" v-if="item.status == 'OVER'">已结算</view>
+						<view class="state cancel" v-if="item.status == 'CANCEL'">已取消</view>
+						<view class="price" v-if="item.status !== 'CANCEL'">+{{item.amount | numToFixed}}</view>
+						<view class="price" v-else></view>
+					</view>
+				</view>
+			</block>
+		</view>
+		<no-data v-if="!profitList.length" :showText="'暂无收益记录'"></no-data>
+		<loading-text v-if="profitList.length"  :loading="loading" :noMore="noMore" ></loading-text>
+	</view>
+</template>
+
+<script>
+	import {mapState} from 'vuex';
+	
+	export default {
+		data() {
+			return {
+				tabCurrent: '',
+				total: {}, // 收益统计
+				profitList: [], // 收益列表
+				pageNum: 1,
+				pageSize: 10,
+				noMore: false,
+				loading: false,
+			}
+		},
+		
+		computed:{
+			...mapState(['userInfo', 'isLogin', 'userId'])
+		},
+		
+		onLoad() {
+			this.getTotal();
+			this.getProfitList();
+		},
+		
+		// 下拉刷新
+		onPullDownRefresh() {
+			this.pageNum = 1;
+			this.getTotal();
+			this.getProfitList();
+		},
+		
+		// 上拉加载
+		onReachBottom() {
+			this.getProfitList(1);
+		},
+		
+		methods: {
+			// 获取累积收益
+			getTotal() {
+				this.$axios({
+					url: '/user/profit',
+					method: 'get',
+					params: {
+						userId: this.userId
+					}
+				}).then(res => {
+					this.total = res.data;
+				})
+			},
+			
+			// 获取列表
+			getProfitList(loadMore) {
+				if(this.noMore && loadMore)return;
+				this.noMore = false
+				if(!loadMore){
+					this.pageNum = 1;
+				}else{
+					this.loading = true;
+				}
+				this.$axios({
+					url: '/user/profit/list',
+					method: 'get',
+					params: {
+						pageNum: this.pageNum,
+						pageSize: this.pageSize,
+						userId: this.userId,
+						status: this.tabCurrent,
+					},
+					isLoading: !loadMore
+				}).then(res => {
+					let _list = res.data.records;
+					let pageTotal = res.data.pages;
+					if(this.pageNum >= pageTotal){
+						this.noMore = true;
+					}
+					if (_list.length) {
+						this.pageNum += 1
+					}
+					if (loadMore) {
+						this.profitList = this.profitList.concat(_list);
+						this.loading = false;
+					} else {
+						this.profitList = _list;
+					}
+					
+					uni.stopPullDownRefresh();
+				})
+			},
+			
+			changeTab(tab) {
+				this.tabCurrent = tab;
+				this.getProfitList();
+			},
+			
+			toDetail(orderId, orderRefundId) {
+				uni.navigateTo({
+					url:'/pages/mine/profit/detail?orderId=' + orderId + '&orderRefundId=' + orderRefundId
+				})
+			},
+			
+			toReturn() {
+				uni.navigateTo({
+					url:'/pages/mine/profit/return'
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		padding: 20rpx;
+		box-sizing: border-box;
+	}
+	.top-container {
+		background: #FFFFFF;
+		border-bottom: 1px solid #F4F2F2;
+		height: 160rpx;
+		box-sizing: border-box;
+		display: flex;
+		align-items: center;
+		border-radius: 10rpx;
+		.item {
+			width: 33.33%;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			flex-direction: column;
+			box-sizing: border-box;
+			font-weight: normal;
+			opacity: 0.8;
+			&:nth-child(2) {
+				border-left: 1px solid #E5E5E5;
+				border-right: 1px solid #E5E5E5;
+			}
+			&.current {
+				font-weight: bold;
+				opacity: 1;
+				.text {
+					border-bottom: 2px solid #FE781F;
+				}
+			}
+			.money {
+				font-size: 40rpx;
+				color: #FE781F;
+				line-height: 40rpx;
+			}
+			.text {
+				font-size: 28rpx;
+				color: #666666;
+				line-height: 36rpx;
+				margin-top: 16rpx;
+			}
+		}
+	}
+	.out-title {
+		font-size: 28rpx;
+		color: #333333;
+		font-weight: bold;
+		padding: 20rpx 10rpx 10rpx;
+		display: flex;
+		justify-content: space-between;
+		.right {
+			font-weight: normal;
+		}
+	}
+	.list-container {
+		padding: 20rpx;
+		.item {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			height: 160rpx;
+			margin-bottom: 20rpx;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			padding: 0 20rpx;
+			.left {
+				height: 134rpx;
+				display: flex;
+				flex-direction: column;
+				justify-content: space-between;
+				.row {
+					font-size: 28rpx;
+					color: #666666;
+				}
+			}
+			.right {
+				height: 134rpx;
+				display: flex;
+				flex-direction: column;
+				justify-content: space-between;
+				align-items: flex-end;
+				.state {
+					font-size: 28rpx;
+					&.wait {
+						color: #FE781F;
+					}
+					&.over {
+						color: #3F9EFF;
+					}
+					&.cancel {
+						color: #999999;
+					}
+				}
+				.price {
+					font-size: 32rpx;
+					color: #333333;
+				}
+			}
+		}
+	}
+</style>

pages/mine/profit/return.vue

@@ -0,0 +1,203 @@
+<template>
+	<view class="app-container">
+		<view class="list-container">
+			<block v-for="(item, index) in profitList" :key='index'>
+				<view class="item" @tap="toDetail(item.orderId, item.orderRefundId)">
+					<view class="left">
+						<view class="row">订单编号：{{item.orderId}}</view>
+						<view class="row">订单金额：¥{{item.payment | numToFixed}}</view>
+						<view class="row">支付时间：{{item.createTime}}</view>
+					</view>
+					<view class="right">
+						<view class="state wait" v-if="item.status == 'ING'">待结算</view>
+						<view class="state over" v-if="item.status == 'OVER'">已结算</view>
+						<view class="state cancel" v-if="item.status == 'CANCEL'">已取消</view>
+						<view class="price" v-if="item.status !== 'CANCEL'">+{{item.amount | numToFixed}}</view>
+						<view class="price" v-else></view>
+					</view>
+				</view>
+			</block>
+		</view>
+		<no-data v-if="!profitList.length" :showText="'暂无记录'"></no-data>
+		<loading-text v-if="profitList.length"  :loading="loading" :noMore="noMore" ></loading-text>
+	</view>
+</template>
+
+<script>
+	import {mapState} from 'vuex';
+	
+	export default {
+		data() {
+			return {
+				profitList: [], // 收益列表
+				pageNum: 1,
+				pageSize: 10,
+				noMore: false,
+				loading: false,
+			}
+		},
+		
+		computed:{
+			...mapState(['userInfo', 'isLogin', 'userId'])
+		},
+		
+		onLoad() {
+			this.getProfitList();
+		},
+		
+		// 下拉刷新
+		onPullDownRefresh() {
+			this.pageNum = 1;
+			this.getProfitList();
+		},
+		
+		// 上拉加载
+		onReachBottom() {
+			this.getProfitList(1);
+		},
+		
+		methods: {
+			// 获取列表
+			getProfitList(loadMore) {
+				if(this.noMore && loadMore)return;
+				this.noMore = false
+				if(!loadMore){
+					this.pageNum = 1;
+				}else{
+					this.loading = true;
+				}
+				this.$axios({
+					url: '/user/profit/list',
+					method: 'get',
+					params: {
+						pageNum: this.pageNum,
+						pageSize: this.pageSize,
+						userId: this.userId,
+						status: 'CANCEL'
+					},
+					isLoading: !loadMore
+				}).then(res => {
+					let _list = res.data.records;
+					let pageTotal = res.data.pages;
+					if(this.pageNum >= pageTotal){
+						this.noMore = true;
+					}
+					if (_list.length) {
+						this.pageNum += 1
+					}
+					if (loadMore) {
+						this.profitList = this.profitList.concat(_list);
+						this.loading = false;
+					} else {
+						this.profitList = _list;
+					}
+					
+					uni.stopPullDownRefresh();
+				})
+			},
+			
+			toDetail(orderId, orderRefundId) {
+				uni.navigateTo({
+					url:'/pages/mine/profit/detail?orderId=' + orderId + '&orderRefundId=' + orderRefundId
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		padding: 20rpx;
+		box-sizing: border-box;
+	}
+	.top-container {
+		background: #FFFFFF;
+		border-bottom: 1px solid #F4F2F2;
+		height: 160rpx;
+		box-sizing: border-box;
+		display: flex;
+		align-items: center;
+		border-radius: 10rpx;
+		.item {
+			width: 33.33%;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			flex-direction: column;
+			box-sizing: border-box;
+			&:nth-child(2) {
+				border-left: 1px solid #E5E5E5;
+				border-right: 1px solid #E5E5E5;
+			}
+			.money {
+				font-size: 40rpx;
+				color: #FE781F;
+				line-height: 40rpx;
+			}
+			.text {
+				font-size: 28rpx;
+				color: #666666;
+				line-height: 28rpx;
+				margin-top: 16rpx;
+			}
+		}
+	}
+	.out-title {
+		font-size: 28rpx;
+		color: #333333;
+		font-weight: bold;
+		padding: 20rpx 10rpx 10rpx;
+		display: flex;
+		justify-content: space-between;
+		.right {
+			font-weight: normal;
+		}
+	}
+	.list-container {
+		padding: 20rpx;
+		.item {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			height: 160rpx;
+			margin-bottom: 20rpx;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			padding: 0 20rpx;
+			.left {
+				height: 134rpx;
+				display: flex;
+				flex-direction: column;
+				justify-content: space-between;
+				.row {
+					font-size: 28rpx;
+					color: #666666;
+				}
+			}
+			.right {
+				height: 134rpx;
+				display: flex;
+				flex-direction: column;
+				justify-content: space-between;
+				align-items: flex-end;
+				.state {
+					font-size: 28rpx;
+					&.wait {
+						color: #FE781F;
+					}
+					&.over {
+						color: #3F9EFF;
+					}
+					&.cancel {
+						color: #999999;
+					}
+				}
+				.price {
+					font-size: 32rpx;
+					color: #333333;
+				}
+			}
+		}
+	}
+</style>

pages/mine/ranking/list.vue

@@ -0,0 +1,475 @@
+<template>
+  <view class="app-container">
+    <custom
+      :bgColor="'bg-them'"
+      :backColor="'#FFFFFF'"
+      :isBack="true"
+      v-show="isCustom"
+    >
+      <text slot="content" style="color: #ffffff; font-size: 36rpx"
+        >收益排行榜</text
+      >
+    </custom>
+
+    <view class="menu-container" :style="cuStyle">
+      <image @tap="toBack" src="@/static/icon/back.png"></image>
+    </view>
+
+    <view class="top-container">
+      <image
+        src="@/static/mine/ranking/bg.png"
+        mode="widthFix"
+        class="bg"
+      ></image>
+
+      <view class="content">
+        <view class="list">
+          <block v-for="(item, index) in top_ranking" :key="index">
+            <view class="item" :class="'no_' + item.ranking">
+              <view class="top">
+                <block v-if="!item.nodata">
+                  <image
+                    :src="item.avatar"
+                    class="head"
+                    v-if="item.avatar.indexOf('http') >= 0"
+                  ></image>
+                  <image
+                    :src="imageUrl + item.avatar"
+                    class="head"
+                    v-else
+                  ></image>
+                </block>
+                <image :src="configInfo.minLogo3" class="head" v-else></image>
+                <image
+                  :src="'/static/mine/ranking/No_' + item.ranking + '.png'"
+                  class="rank"
+                ></image>
+              </view>
+              <block v-if="!item.nodata">
+                <view class="money">¥{{ item.total }}</view>
+                <view class="name">{{ item.workUserName }}</view>
+                <view class="text">{{ item.websitName }}</view>
+              </block>
+              <block v-if="item.nodata">
+                <view class="nodata">{{ item.nodata }}</view>
+              </block>
+            </view>
+          </block>
+        </view>
+      </view>
+    </view>
+
+    <view class="list-container">
+      <view class="mine">
+        <view class="left">
+          <view class="rank">
+            <view class="row1" :class="mine_ranking.ranking ? 'big' : ''">{{
+              mine_ranking.ranking || '未入榜'
+            }}</view>
+            <view class="row2">我的排名</view>
+          </view>
+          <block v-if="mine_ranking.avatar">
+            <image
+              :src="mine_ranking.avatar"
+              v-if="mine_ranking.avatar.indexOf('http') >= 0"
+            ></image>
+            <image :src="imageUrl + mine_ranking.avatar" v-else></image>
+          </block>
+          <view class="info">
+            <view class="name">{{ mine_ranking.workUserName }}</view>
+            <view class="text ellipsis-2">{{
+              mine_ranking.websitName || ''
+            }}</view>
+          </view>
+        </view>
+        <view class="right">
+          <view class="money">{{ mine_ranking.total | numToFixed }}</view>
+          <view class="report" @tap="toMyReport">查看我的月报></view>
+        </view>
+      </view>
+      <view class="list" v-if="bottom_ranking && bottom_ranking.length > 0">
+        <block v-for="(item, index) in bottom_ranking" :key="index">
+          <view class="item">
+            <view class="rank">{{ index + 4 }}</view>
+            <block v-if="item.avatar">
+              <image
+                :src="item.avatar"
+                v-if="item.avatar.indexOf('http') >= 0"
+              ></image>
+              <image :src="imageUrl + item.avatar" v-else></image>
+            </block>
+            <view class="main">
+              <view class="top">
+                <view class="name">{{ item.workUserName }}</view>
+                <view class="money">{{ item.total | numToFixed }}</view>
+              </view>
+              <view class="text ellipsis">{{ item.websitName }}</view>
+            </view>
+          </view>
+        </block>
+      </view>
+    </view>
+
+    <view class="bottom-container" v-if="statisticalDate.start"
+      >统计时间：{{ statisticalDate.start }} 至 {{ statisticalDate.end }}</view
+    >
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      imageUrl: this.$imageUrl,
+      configInfo: uni.getStorageSync('configInfo'),
+      scrollTop: 0, // 滚动高度（用于控制自定义导航）
+      isCustom: false, // 是否显示自定义导航
+      top_ranking: [],
+      bottom_ranking: [],
+      mine_ranking: {},
+      statisticalDate: {},
+    };
+  },
+  watch: {
+    scrollTop() {
+      if (this.scrollTop > 100) {
+        this.isCustom = true;
+      } else {
+        this.isCustom = false;
+      }
+    },
+  },
+  computed: {
+    cuStyle() {
+      return `height:${this.CustomBar - this.StatusBar}px;padding-top:${
+        this.StatusBar
+      }px;`;
+    },
+  },
+  onPageScroll(res) {
+    this.scrollTop = res.scrollTop;
+  },
+  onLoad() {
+    this.getData();
+  },
+  methods: {
+    // 获取数据
+    getData() {
+      this.$axios({
+        url: '/user/rank',
+        method: 'get',
+        params: {},
+        isLoading: 1,
+      }).then((res) => {
+        let rankList = res.data.rankList || [];
+        let top_ranking = rankList.slice(0, 3);
+        for (let i = 0; i < 3; i++) {
+          if (!top_ranking[i]) {
+            top_ranking.push({ nodata: '虚位以待', ranking: i + 1 });
+          }
+        }
+
+        let bottom_ranking = rankList;
+        bottom_ranking.splice(0, 3);
+
+        this.top_ranking = top_ranking;
+        this.bottom_ranking = bottom_ranking;
+        this.mine_ranking = res.data.myRank;
+        this.statisticalDate = {
+          start: res.data.startPeriod,
+          end: res.data.endPeriod,
+        };
+      });
+    },
+
+    // 去我的月报
+    toMyReport() {
+      uni.navigateTo({
+        url: '/pages/mine/ranking/report',
+      });
+    },
+
+    toBack() {
+      uni.navigateBack({
+        delta: 1,
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss">
+.app-container {
+  background: #ffffff;
+  box-sizing: border-box;
+}
+.menu-container {
+  position: fixed;
+  top: 0;
+  z-index: 999;
+  width: 100%;
+  display: flex;
+  align-items: center;
+  image {
+    width: 32rpx;
+    height: 32rpx;
+    display: block;
+    margin-left: 30rpx;
+  }
+}
+.top-container {
+  position: relative;
+  height: 900rpx;
+  .bg {
+    display: block;
+    width: 750rpx;
+    height: 900rpx;
+    position: absolute;
+    top: 0;
+    z-index: 0;
+  }
+  .content {
+    position: relative;
+    z-index: 1;
+    .list {
+      display: flex;
+      padding-top: 350rpx;
+      .item {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        width: 33.33%;
+        padding: 0 20rpx;
+        box-sizing: border-box;
+        .top {
+          position: relative;
+          .head {
+            border-radius: 50%;
+            display: block;
+          }
+          .rank {
+            position: absolute;
+            display: block;
+          }
+        }
+        .nodata {
+          font-size: 28rpx;
+          color: #ffffff;
+          line-height: 32rpx;
+          margin-top: 16rpx;
+        }
+        .money {
+          font-size: 32rpx;
+          color: #ffffff;
+          line-height: 32rpx;
+          margin-top: 16rpx;
+        }
+        .name {
+          font-size: 32rpx;
+          color: #ffffff;
+          line-height: 32rpx;
+          margin-top: 16rpx;
+        }
+        .text {
+          font-size: 24rpx;
+          color: #ffffff;
+          line-height: 28rpx;
+          text-align: center;
+          margin-top: 10rpx;
+          opacity: 0.6;
+        }
+      }
+      .item.no_1 {
+        order: 2;
+        .head {
+          width: 160rpx;
+          height: 160rpx;
+          border: 2px solid #ffb103;
+        }
+        .rank {
+          width: 80rpx;
+          height: 58rpx;
+          top: -50rpx;
+          left: 50%;
+          margin-left: -40rpx;
+        }
+      }
+      .item.no_2 {
+        order: 1;
+        margin-top: 100rpx;
+        .head {
+          width: 140rpx;
+          height: 140rpx;
+          border: 2px solid #cccccc;
+        }
+        .rank {
+          width: 72rpx;
+          height: 52rpx;
+          top: -44rpx;
+          left: 50%;
+          margin-left: -36rpx;
+        }
+      }
+      .item.no_3 {
+        order: 3;
+        margin-top: 140rpx;
+        .head {
+          width: 140rpx;
+          height: 140rpx;
+          border: 2px solid #f59234;
+        }
+        .rank {
+          width: 72rpx;
+          height: 52rpx;
+          top: -44rpx;
+          left: 50%;
+          margin-left: -36rpx;
+        }
+      }
+    }
+  }
+}
+.list-container {
+  padding: 0 20rpx;
+  margin-top: -40rpx;
+  position: relative;
+  z-index: 2;
+  .mine {
+    border-radius: 10rpx;
+    padding: 25rpx 20rpx;
+    display: flex;
+    justify-content: space-between;
+    box-shadow: 0 0 6px 0 rgba(84, 84, 84, 0.23);
+    background: #ffffff;
+    .left {
+      display: flex;
+      align-items: center;
+      .rank {
+        flex-shrink: 0;
+        text-align: center;
+        .row1 {
+          font-size: 24rpx;
+          color: #fe781f;
+          line-height: 24rpx;
+          font-weight: 500;
+          &.big {
+            font-size: 32rpx;
+          }
+        }
+        .row2 {
+          font-size: 22rpx;
+          color: #666666;
+          line-height: 24rpx;
+          margin-top: 10rpx;
+        }
+      }
+      image {
+        width: 100rpx;
+        height: 100rpx;
+        display: block;
+        border-radius: 50%;
+        flex-shrink: 0;
+        margin-left: 10rpx;
+      }
+      .info {
+        display: flex;
+        flex-direction: column;
+        justify-content: space-between;
+        margin-left: 20rpx;
+        height: 100rpx;
+        .name {
+          font-size: 28rpx;
+          color: #333333;
+          line-height: 32rpx;
+        }
+        .text {
+          font-size: 24rpx;
+          color: #666666;
+          line-height: 28rpx;
+        }
+      }
+    }
+    .right {
+      flex-shrink: 0;
+      text-align: right;
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+      margin-left: 40rpx;
+      .money {
+        font-size: 32rpx;
+        color: #fe781f;
+        line-height: 32rpx;
+        font-weight: 500;
+      }
+      .report {
+        font-size: 24rpx;
+        color: #3f9eff;
+        line-height: 28rpx;
+      }
+    }
+  }
+  .list {
+    margin-top: 20rpx;
+    .item {
+      border-bottom: 1px solid #eaeaea;
+      display: flex;
+      align-items: center;
+      padding: 12rpx 0;
+      .rank {
+        width: 90rpx;
+        text-align: center;
+        font-size: 36rpx;
+        font-weight: 500;
+        flex-shrink: 0;
+      }
+      image {
+        width: 100rpx;
+        height: 100rpx;
+        display: block;
+        border-radius: 50%;
+        flex-shrink: 0;
+        margin-left: 10rpx;
+      }
+      .main {
+        margin-left: 20rpx;
+        width: 100%;
+        height: 80rpx;
+        display: flex;
+        flex-direction: column;
+        justify-content: space-between;
+        .top {
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          .name {
+            font-size: 28rpx;
+            color: #333333;
+            line-height: 32rpx;
+          }
+          .money {
+            font-size: 32rpx;
+            color: #fe781f;
+            line-height: 32rpx;
+            font-weight: 500;
+          }
+        }
+        .text {
+          font-size: 24rpx;
+          color: #666666;
+          line-height: 28rpx;
+          width: 490rpx;
+        }
+      }
+    }
+  }
+}
+.bottom-container {
+  text-align: center;
+  font-size: 24rpx;
+  line-height: 28rpx;
+  color: #999999;
+  padding-top: 30rpx;
+  padding-bottom: 60rpx;
+}
+</style>

pages/mine/ranking/report.vue

@@ -0,0 +1,158 @@
+<template>
+	<view class="app-container">
+		<view class="card-container-c">
+			<view class="card-container">
+				<view class="top">
+					<image src="@/static/bg_logo.png" class="bg"></image>
+					<view class="title">
+						<image src="@/static/mine/ranking/title_l.png"></image>
+						<text>本月收益</text>
+						<image src="@/static/mine/ranking/title_r.png"></image>
+					</view>
+					<view class="money"><text>{{detail.income}}</text>元</view>
+					<view class="percent">超过本店99%的分销员</view>
+					<view class="upDown" v-if="detail.upOrDown">
+						<image src="@/static/mine/ranking/up.png"></image>
+						<view>相比上一个月有所上升，继续加油哦！</view>
+					</view>
+					<view class="upDown" v-if="!detail.upOrDown">
+						<image src="@/static/mine/ranking/down.png"></image>
+						<view>相比上一个月有所上下降，继续加油哦！</view>
+					</view>
+				</view>
+				<view class="bottom">
+					<image :src="configInfo.minLogo2" mode="heightFix"></image>
+				</view>
+			</view>
+		</view>
+		<view class="tips">统计时间：{{detail.startPeriod}} 至 {{detail.endPeriod}}</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				configInfo: uni.getStorageSync('configInfo'),
+				detail: {},
+			}
+		},
+		onLoad() {
+			this.getData();
+		},
+		methods: {
+			// 获取数据
+			getData() {
+				this.$axios({
+					url: '/user/rank',
+					method: 'get',
+					params: {}
+				}).then(res => {
+					this.detail = res.data;
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		box-sizing: border-box;
+	}
+	.tips {
+		font-size: 28rpx;
+		line-height: 28rpx;
+		color: #999999;
+		text-align: center;
+		margin: 60rpx 0 20rpx;
+	}
+	.card-container-c {
+		padding: 40rpx 40rpx 0;
+	}
+	.card-container {
+		width: 670rpx;
+		border-radius: 20rpx;
+		background: #FFFFFF;
+		box-shadow: -20px 0px 40px 20px rgba(155,155,155,0.30); 
+		overflow: hidden;
+		.top {
+			background: #F65759;
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+			height: 800rpx;
+			position: relative;
+			.bg {
+				position: absolute;
+				top: 140rpx;
+				left: 35rpx;
+				width: 600rpx;
+				height: 600rpx;
+				display: block;
+				z-index: 0;
+			}
+			.title {
+				display: flex;
+				align-items: center;
+				margin-top: 56rpx;
+				image {
+					width: 78rpx;
+					height: 22rpx;
+					display: block;
+				}
+				text {
+					font-size: 50rpx;
+					color: #FFFFFF;
+					margin: 0 20rpx;
+					line-height: 50rpx;
+				}
+			}
+			.money {
+				font-size: 40rpx;
+				color: #FFFFFF;
+				line-height: 80rpx;
+				margin-top: 120rpx;
+				text {
+					display: inline-block;
+					font-size: 80rpx;
+					line-height: 80rpx;
+					margin-right: 10rpx;
+				}
+			}
+			.percent {
+				font-size: 32rpx;
+				color: #FFFFFF;
+				margin-top: 10rpx;
+				line-height: 32rpx;
+			}
+			.upDown {
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				margin-top: 110rpx;
+				image {
+					width: 124rpx;
+					height: 80rpx;
+					display: block;
+				}
+				view {
+					font-size: 32rpx;
+					color: #FFFFFF;
+					margin-top: 26rpx;
+					line-height: 32rpx;
+				}
+			}
+		}
+		.bottom {
+			height: 140rpx;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			image {
+				height: 60rpx;
+				display: block;
+			}
+		}
+	}
+</style>

pages/mine/workOrder/detail.vue

@@ -0,0 +1,318 @@
+<template>
+	<view class="app-container">
+		<no-data v-if="noData" :showText="'暂无工单信息'"></no-data>
+		
+		<block v-else>
+			<view class="top-container">
+				<uni-steps :options="steps" :active="orderState" active-color="#FF3F42"></uni-steps>
+			</view>
+			
+			<view class="detail-container">
+				<view class="card">
+					<view class="title">订单信息</view>
+					<view class="item">
+						<view class="label">销售单号</view>
+						<view class="value">{{detail.orderId || ''}}</view>
+					</view>
+					<view class="item">
+						<view class="label">购买日期</view>
+						<view class="value">{{detail.payTime || ''}}</view>
+					</view>
+					<view class="item">
+						<view class="label">产品类型</view>
+						<view class="value">{{detail.mainName || ''}}</view>
+					</view>
+					<block v-for="(item, index) in detail.goods" :key='index'>
+						<view class="item">
+							<view class="label">产品机型</view>
+							<view class="value">{{item.pname}}</view>
+						</view>
+						<view class="item">
+							<view class="label">产品数量</view>
+							<view class="value">{{item.number}}</view>
+						</view>
+					</block>
+				</view>
+				<view class="card">
+					<view class="title">服务信息</view>
+					<view class="item">
+						<view class="label">工单编号</view>
+						<view class="value">{{detail.workerOrder || ''}}</view>
+					</view>
+					<view class="item">
+						<view class="label">派单日期</view>
+						<view class="value">{{detail.createTime || ''}}</view>
+					</view>
+					<view class="item">
+						<view class="label">服务内容</view>
+						<view class="value">{{detail.serverContent || ''}}</view>
+					</view>
+					<view class="item">
+						<view class="label">服务网点</view>
+						<view class="value">{{detail.installName || ''}}</view>
+					</view>
+					<view class="item">
+						<view class="label">预约时间</view>
+						<view class="value">{{detail.reserveTime || ''}}</view>
+					</view>
+					<view class="item">
+						<view class="label">主要服务人员</view>
+						<view class="value">{{detail.workerName || ''}} {{detail.workerPhone || ''}} <image src="/static/mine/call.png" v-if="detail.workerPhone" @tap="callPhone(detail.workerPhone)"></image></view>
+					</view>
+					<view class="item">
+						<view class="label">辅助服务人员</view>
+						<view class="value">{{detail.assistName || ''}}</view>
+					</view>
+				</view>
+				<view class="card">
+					<view class="title">其他信息</view>
+					<view class="item">
+						<view class="label">支架</view>
+						<view class="value">{{detail.bracket || 0}}</view>
+					</view>
+					<view class="item">
+						<view class="label">加长管</view>
+						<view class="value">{{detail.pipe || 0}}</view>
+					</view>
+					<view class="item">
+						<view class="label">空气开关</view>
+						<view class="value">{{detail.switchFlag || 0}}</view>
+					</view>
+					<view class="item">
+						<view class="label">一次成型墙孔</view>
+						<view class="value">{{detail.hole || 0}}</view>
+					</view>
+					<view class="item">
+						<view class="label">高空作业</view>
+						<view class="value">{{detail.highAltitude || 0}}</view>
+					</view>
+					<view class="item item2">
+						<view class="label">服务备注</view>
+						<view class="value">{{detail.remark || ''}}</view>
+					</view>
+				</view>
+				<view class="card" v-if="orderState > 0">
+					<view class="title">辅材信息</view>
+					
+					<block v-if="detail.fcxxs && detail.fcxxs.length > 0">
+						<view class="item">
+							<view class="label">支付单号</view>
+							<view class="value">{{detail.fcxxs[0].orderNo}}</view>
+						</view>
+						<view class="item">
+							<view class="label">支付时间</view>
+							<view class="value">{{detail.fcxxs[0].payTime}}</view>
+						</view>
+						<view class="goods">
+							
+							<view class="it" v-for="(item, index) in fc_list" :key='index'>
+								<view class="name">{{item.goods_name}}</view>
+								<view class="num">x{{item.number}}</view>
+								<view class="price">¥{{item.sub_amount}}</view>
+							</view>
+							
+							<view class="bottom">
+								<view class="left">合计：</view>
+								<view class="price">¥{{fc_total}}</view>
+							</view>
+						</view>
+					</block>
+					
+					<block v-else>
+						<no-data :showText="'暂无辅材信息'"></no-data>
+					</block>
+					
+				</view>
+			</view>
+		
+		</block>
+		
+		
+	</view>
+</template>
+
+<script>
+	import {mapState} from 'vuex';
+	
+	export default {
+		data() {
+			return {
+				id: null, // id
+				detail: {}, // 详情数据
+				steps: [{title: '已派单'}, {title: '服务中'}, {title: '已完工'}],
+				orderState: 0,
+				fc_list: [],
+				noData: false,
+			}
+		},
+		
+		computed:{
+			...mapState(['userInfo', 'isLogin', 'userId']),
+			
+			fc_total() {
+				if(this.fc_list && this.fc_list.length > 0) {
+					let total = 0;
+					this.fc_list.forEach(item => {
+						total = total + Number(item.sub_amount);
+					})
+					return total;
+				}else {
+					return 0
+				}
+			},
+		},
+		
+		onLoad({id}) {
+			this.id = id;
+			this.getOrderDetail();
+		},
+		
+		methods: {
+			stateFilter(item) {
+				let orderState = Number(item.orderState);
+				if(item.serverContent == '安装服务') {
+					if(orderState == 6) {
+						return 1;
+					}else if(orderState == 7 || orderState == 10) {
+						return 2;
+					}else {
+						return 0;
+					}
+				} else {
+					if(orderState < 7) {
+						return 0;
+					}else if(orderState == 7) {
+						return 1;
+					}else {
+						return 2;
+					}
+				}
+			},
+			
+			getOrderDetail() {
+				this.$axios({
+					url: '/order/work/list',
+					method: 'get',
+					params: {
+						pageNo: 1,
+						pageSize: 1,
+						userId: this.userId,
+						workerOrderNo: this.id,
+					},
+				}).then(res => {
+					if(res.data && res.data.records) {
+						this.noData = false;
+						this.detail = res.data.records[0];
+						this.orderState = this.stateFilter(this.detail);
+						
+						if(this.detail.fcxxs && this.detail.fcxxs.length > 0) {
+							let list = [];
+							for(let i=0; i<this.detail.fcxxs.length; i++) {
+								if(this.detail.fcxxs[i].details && this.detail.fcxxs[i].details.length > 0) {
+									this.detail.fcxxs[i].details.forEach(item => {
+										list.push(item);
+									})
+								}
+							}
+							this.fc_list = list;
+						}else {
+							this.fc_list = [];
+						}
+					}else {
+						this.noData = true;
+					}
+				})
+			},
+			
+			callPhone(val) {
+				uni.makePhoneCall({
+				    phoneNumber: val
+				});
+			},
+			
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		box-sizing: border-box;
+	}
+	.top-container {
+		background: #FFFFFF;
+		padding: 30rpx 0;
+	}
+	.detail-container {
+		padding: 20rpx;
+		.card {
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			margin-bottom: 20rpx;
+			padding: 30rpx 20rpx 20rpx;
+			.title {
+				font-size: 32rpx;
+				color: #333333;
+				line-height: 32rpx;
+				padding-bottom: 20rpx;
+				font-weight: 600;
+			}
+			.item {
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				padding: 10rpx 0;
+				&.item2 {
+					flex-direction: column;
+					align-items: flex-start;
+					.value {
+						padding-top: 10rpx;
+					}
+				}
+				.label {
+					color: #666666;
+					flex-shrink: 0;
+				}
+				.value {
+					color: #333333;
+					display: flex;
+					image {
+						width: 40rpx;
+						height: 40rpx;
+						margin-left: 10rpx;
+					}
+				}
+			}
+			.goods {
+				background: #F4F2F2;
+				border-radius: 10rpx;
+				padding: 10rpx 20rpx;
+				margin-top: 10rpx;
+				color: #666666;
+				.it {
+					display: flex;
+					padding: 10rpx 0;
+					.name {
+						flex: 1;
+					}
+					.num {
+						margin-left: 20rpx;
+					}
+					.price {
+						margin-left: 20rpx;
+					}
+				}
+				.bottom {
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+					padding: 10rpx 0;
+					.price {
+						color: #FF3F42;
+					}
+				}
+			}
+		}
+	}
+	
+</style>

pages/mine/workOrder/list.vue

@@ -0,0 +1,161 @@
+<template>
+	<view class="app-container">
+		<view class="list-container">
+			<block v-for="(item, index) in dataList" :key='index'>
+				<view class="item" @tap="toDetail(item.workerOrder)">
+					<view class="row">工单编号：{{item.workerOrder}}
+						<view class="state wait">{{item | stateFilter}}</view>
+					</view>
+					<view class="row">订单编号：{{item.orderId}}</view>
+					<view class="row">派单时间：{{item.createTime || ''}}</view>
+					<view class="row">预约时间：{{item.reserveTime || ''}}</view>
+					<view class="row">服务类型：{{item.serverContent || ''}}</view>
+					<view class="row">服务人员：{{item.workerName || ''}}{{item.assistName ? '、'+item.assistName:''}}</view>
+				</view>
+			</block>
+		</view>
+		<no-data v-if="!dataList.length" :showText="'暂无工单信息'"></no-data>
+		<loading-text v-if="dataList.length"  :loading="loading" :noMore="noMore" ></loading-text>
+	</view>
+</template>
+
+<script>
+	import {mapState} from 'vuex';
+	
+	export default {
+		filters: {
+			stateFilter(item) {
+				let orderState = Number(item.orderState);
+				if(item.serverContent == '安装服务') {
+					if(orderState == 6) {
+						return '服务中';
+					}else if(orderState == 7 || orderState == 10) {
+						return '已完工';
+					}else {
+						return '已派单';
+					}
+				}else {
+					if(orderState < 7) {
+						return '已派单';
+					}else if(orderState == 7) {
+						return '服务中';
+					}else {
+						return '已完工';
+					}
+				}
+				
+			}
+		},
+		
+		data() {
+			return {
+				dataList: [],
+				pageNum: 1,
+				pageSize: 10,
+				noMore: false,
+				loading: false,
+			}
+		},
+		
+		computed:{
+			...mapState(['userInfo', 'isLogin', 'userId'])
+		},
+		
+		onLoad() {
+			this.getProfitList();
+		},
+		
+		// 下拉刷新
+		onPullDownRefresh() {
+			this.pageNum = 1;
+			this.getProfitList();
+		},
+		
+		// 上拉加载
+		onReachBottom() {
+			this.getProfitList(1);
+		},
+		
+		methods: {
+			// 获取列表
+			getProfitList(loadMore) {
+				if(this.noMore && loadMore)return;
+				this.noMore = false
+				if(!loadMore){
+					this.pageNum = 1;
+				}else{
+					this.loading = true;
+				}
+				this.$axios({
+					url: '/order/work/list',
+					method: 'get',
+					params: {
+						pageNo: this.pageNum,
+						pageSize: this.pageSize,
+						userId: this.userId,
+					},
+					isLoading: !loadMore
+				}).then(res => {
+					let _list = res.data.records;
+					let pageTotal = res.data.pages;
+					if(this.pageNum >= pageTotal){
+						this.noMore = true;
+					}
+					if (_list.length) {
+						this.pageNum += 1
+					}
+					if (loadMore) {
+						this.dataList = this.dataList.concat(_list);
+						this.loading = false;
+					} else {
+						this.dataList = _list;
+					}
+					
+					uni.stopPullDownRefresh();
+				})
+			},
+			
+			toDetail(id) {
+				uni.navigateTo({
+					url:'/pages/mine/workOrder/detail?id=' + id
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		padding: 20rpx;
+		box-sizing: border-box;
+	}
+	.list-container {
+		.item {
+			margin-bottom: 20rpx;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			padding: 15rpx 20rpx;
+			.row {
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				font-size: 28rpx;
+				color: #666666;
+				height: 48rpx;
+				.state {
+					font-size: 28rpx;
+					&.wait {
+						color: #FF3F42;
+					}
+					&.over {
+						color: #3F9EFF;
+					}
+					&.cancel {
+						color: #999999;
+					}
+				}
+			}
+		}
+	}
+</style>

pages/mine/wxCode.vue

@@ -1,181 +1,181 @@
-<template>
-	<view class="app-container">
-		<view class="card-container">
-			<view class="top">
-				<view class="title">请加我的企业微信</view>
-				<view class="main">
-					<image src="/static/mine/wx.png" class="wx"></image>
-					<image :src="detail.workQrcode2 ? detail.workQrcode2 : detail.workQrcode" class="code"></image>
-					<!-- <image :src="detail.avatar" class="avatar"></image> -->
-					<view class="btn" @tap="save()">保存二维码</view>
-				</view>
-				<view class="info">
-					<view class="name">{{detail.workName}}</view>
-					<view class="text">{{configInfo.companyName}}</view>
-				</view>
-			</view>
-			<view class="bottom">
-				<image :src="configInfo.minLogo2" mode="heightFix"></image>
-			</view>
-		</view>
-		<view class="tips">扫一扫二维码，添加我的企业微信</view>
-	</view>
-</template>
-
-<script>
-	import {mapState} from 'vuex';
-	
-	export default {
-		data() {
-			return {
-				configInfo: uni.getStorageSync('configInfo'),
-				detail: {},
-			}
-		},
-		computed:{
-			...mapState(['userInfo', 'isLogin', 'userId']),
-		},
-		
-		onLoad() {
-			this.getDetail();
-		},
-		
-		methods: {
-			// 获取个人信息
-			getDetail() {
-				this.$axios({
-					url: '/user/user/detail',
-					method: 'get',
-					params: {
-						userId: this.userId
-					}
-				}).then(res => {
-					this.detail = res.data;
-				})
-			},
-			
-			// 保存图片
-			save() {
-				uni.downloadFile({
-				    url: this.detail.workQrcode2 ? this.detail.workQrcode2 : this.detail.workQrcode,
-				    success: (res) => {
-						uni.saveImageToPhotosAlbum({
-							filePath: res.tempFilePath,
-							success: () => {
-								this.$successToast('保存成功');
-							}
-						});
-					}
-				})
-			}
-		}
-	}
-</script>
-
-<style lang="scss">
-	.app-container {
-		background: #F4F2F2;
-		padding: 40rpx 40rpx 0;
-		box-sizing: border-box;
-	}
-	.tips {
-		font-size: 28rpx;
-		line-height: 28rpx;
-		color: #999999;
-		text-align: center;
-		margin: 60rpx 0 20rpx;
-	}
-	.card-container {
-		width: 670rpx;
-		border-radius: 20rpx;
-		background: #FFFFFF;
-		box-shadow: -20px 0px 40px 20px rgba(155,155,155,0.30); 
-		overflow: hidden;
-		.top {
-			background: #006FE2;
-			display: flex;
-			flex-direction: column;
-			align-items: center;
-			.title {
-				font-family: 'PingFang SC';
-				font-size: 50rpx;
-				color: #FFFFFF;
-				line-height: 160rpx;
-			}
-			.main {
-				position: relative;
-				display: flex;
-				padding-top: 44rpx;
-				margin-top: 20rpx;
-				.wx {
-					width: 508rpx;
-					height: 440rpx;
-					display: block;
-				}
-				.code {
-					width: 360rpx;
-					height: 360rpx;
-					display: block;
-					position: absolute;
-					top: 0;
-					left: 74rpx;
-					border-radius: 5rpx;
-				}
-				.btn {
-					width: 160rpx;
-					height: 48rpx;
-					display: block;
-					position: absolute;
-					top: 380rpx;
-					left: 170rpx;
-					border-radius: 5rpx;
-					border: 1px solid #ffffff;
-					line-height: 48rpx;
-					text-align: center;
-					font-size: 24rpx;
-					color: #FFFFFF;
-					opacity: .8;
-				}
-				.avatar {
-					width: 88rpx;
-					height: 88rpx;
-					display: block;
-					position: absolute;
-					top: 131rpx;
-					left: 205rpx;
-					border-radius: 5rpx;
-					padding: 5rpx;
-					background: #FFFFFF;
-				}
-			}
-			.info {
-				width: 360rpx;
-				text-align: right;
-				margin-bottom: 58rpx;
-				.name {
-					font-size: 36rpx;
-					color: #FFFFFF;
-					height: 36rpx;
-					line-height: 36rpx;
-				}
-				.text {
-					font-size: 28rpx;
-					color: #FFFFFF;
-					height: 28rpx;
-					line-height: 28rpx;
-					margin-top: 20rpx;
-				}
-			}
-		}
-		.bottom {
-			height: 140rpx;
-			display: flex;
-			justify-content: center;
-			align-items: center;
-			image {
-				height: 60rpx;
-				display: block;
-			}
-		}
-	}
-</style>
+<template>
+	<view class="app-container">
+		<view class="card-container">
+			<view class="top">
+				<view class="title">请加我的企业微信</view>
+				<view class="main">
+					<image src="/static/mine/wx.png" class="wx"></image>
+					<image :src="detail.workQrcode2 ? detail.workQrcode2 : detail.workQrcode" class="code"></image>
+					<!-- <image :src="detail.avatar" class="avatar"></image> -->
+					<view class="btn" @tap="save()">保存二维码</view>
+				</view>
+				<view class="info">
+					<view class="name">{{detail.workName}}</view>
+					<view class="text">{{configInfo.companyName}}</view>
+				</view>
+			</view>
+			<view class="bottom">
+				<image :src="configInfo.minLogo2" mode="heightFix"></image>
+			</view>
+		</view>
+		<view class="tips">扫一扫二维码，添加我的企业微信</view>
+	</view>
+</template>
+
+<script>
+	import {mapState} from 'vuex';
+	
+	export default {
+		data() {
+			return {
+				configInfo: uni.getStorageSync('configInfo'),
+				detail: {},
+			}
+		},
+		computed:{
+			...mapState(['userInfo', 'isLogin', 'userId']),
+		},
+		
+		onLoad() {
+			this.getDetail();
+		},
+		
+		methods: {
+			// 获取个人信息
+			getDetail() {
+				this.$axios({
+					url: '/user/user/detail',
+					method: 'get',
+					params: {
+						userId: this.userId
+					}
+				}).then(res => {
+					this.detail = res.data;
+				})
+			},
+			
+			// 保存图片
+			save() {
+				uni.downloadFile({
+				    url: this.detail.workQrcode2 ? this.detail.workQrcode2 : this.detail.workQrcode,
+				    success: (res) => {
+						uni.saveImageToPhotosAlbum({
+							filePath: res.tempFilePath,
+							success: () => {
+								this.$successToast('保存成功');
+							}
+						});
+					}
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app-container {
+		background: #F4F2F2;
+		padding: 40rpx 40rpx 0;
+		box-sizing: border-box;
+	}
+	.tips {
+		font-size: 28rpx;
+		line-height: 28rpx;
+		color: #999999;
+		text-align: center;
+		margin: 60rpx 0 20rpx;
+	}
+	.card-container {
+		width: 670rpx;
+		border-radius: 20rpx;
+		background: #FFFFFF;
+		box-shadow: -20px 0px 40px 20px rgba(155,155,155,0.30); 
+		overflow: hidden;
+		.top {
+			background: #006FE2;
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+			.title {
+				font-family: 'PingFang SC';
+				font-size: 50rpx;
+				color: #FFFFFF;
+				line-height: 160rpx;
+			}
+			.main {
+				position: relative;
+				display: flex;
+				padding-top: 44rpx;
+				margin-top: 20rpx;
+				.wx {
+					width: 508rpx;
+					height: 440rpx;
+					display: block;
+				}
+				.code {
+					width: 360rpx;
+					height: 360rpx;
+					display: block;
+					position: absolute;
+					top: 0;
+					left: 74rpx;
+					border-radius: 5rpx;
+				}
+				.btn {
+					width: 160rpx;
+					height: 48rpx;
+					display: block;
+					position: absolute;
+					top: 380rpx;
+					left: 170rpx;
+					border-radius: 5rpx;
+					border: 1px solid #ffffff;
+					line-height: 48rpx;
+					text-align: center;
+					font-size: 24rpx;
+					color: #FFFFFF;
+					opacity: .8;
+				}
+				.avatar {
+					width: 88rpx;
+					height: 88rpx;
+					display: block;
+					position: absolute;
+					top: 131rpx;
+					left: 205rpx;
+					border-radius: 5rpx;
+					padding: 5rpx;
+					background: #FFFFFF;
+				}
+			}
+			.info {
+				width: 360rpx;
+				text-align: right;
+				margin-bottom: 58rpx;
+				.name {
+					font-size: 36rpx;
+					color: #FFFFFF;
+					height: 36rpx;
+					line-height: 36rpx;
+				}
+				.text {
+					font-size: 28rpx;
+					color: #FFFFFF;
+					height: 28rpx;
+					line-height: 28rpx;
+					margin-top: 20rpx;
+				}
+			}
+		}
+		.bottom {
+			height: 140rpx;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			image {
+				height: 60rpx;
+				display: block;
+			}
+		}
+	}
+</style>

pages/mywebsit/index.vue

@@ -0,0 +1,347 @@
+<template>
+	<view style="width: 100%; height: 100vh; background: rgb(247, 248, 255)">
+		<zj-page-container>
+			<view class="toubuyangs">
+				<view class="search-container">
+					<u-search shape="round" :showAction="false" placeholder="输入网点名称搜索" v-model="keyword"
+						@search="getList">
+					</u-search>
+				</view>
+			</view>
+			<zj-page-fill style="height: 100vh;">
+				<view class="list-container" v-if="showDataList.length > 0"
+					style="box-sizing: border-box;padding-bottom: 100rpx;">
+					<view class="mode" v-for="(item, index) in showDataList" :key="index">
+						<view class="flex_asb" style="align-items: flex-start">
+							<view class="content flex1">
+								<view class="flex_asb">
+									<view class="title">({{ item.websitId }}){{ item.name }}</view>
+								</view>
+								<view class="flex">
+									<view class="hui" style="min-width: 80rpx;">地址</view>
+									<view class="text">{{ item.address || '无' }}</view>
+								</view>
+								<view class="flex_end">
+									<u-button style="width: 80rpx; height: 40rpx; margin: 0" shape="circle" text="选择"
+										@tap="goEnter(item)"></u-button>
+								</view>
+							</view>
+						</view>
+					</view>
+				</view>
+			</zj-page-fill>
+		</zj-page-container>
+	</view>
+</template>
+
+<script>
+	import zjPageLayout from '@/components/zj-container/zj-page-layout.vue'
+	import zjPageContainer from '@/components/zj-page-container/zj-page-container.vue'
+	import zjPageFill from '@/components/zj-page-container/zj-page-fill.vue'
+	import {
+		mapState
+	} from 'vuex';
+	export default {
+		components: {
+			zjPageLayout,
+			zjPageContainer,
+			zjPageFill,
+		},
+		data() {
+			return {
+				dataList: [],
+				keyword: '',
+			}
+		},
+		onShow() {
+			this.getList()
+		},
+		computed: {
+			...mapState(['userInfo', 'isLogin', 'userId', 'websitData']),
+			showDataList() {
+				if (this.keyword) {
+					return this.dataList.filter(item => ~item.name.indexOf(this.keyword) || ~item.websitId.indexOf(this
+						.keyword))
+				} else {
+					return this.dataList
+				}
+			}
+		},
+		methods: {
+			async getList() {
+				console.log(11111)
+				uni.getLocation({
+					type: 'gcj02',
+					success: res => {
+						console.log(222222,res)
+						this.$axios({
+							url: '/user/websitList',
+							method: 'post',
+							params: {
+								lat: res.latitude,
+								lng: res.longitude,
+							},
+						}).then((resData) => {
+							this.dataList = resData.data
+							console.log(resData)
+						});
+					},
+					fail: err => {
+
+					}
+				})
+			},
+
+
+			goEnter(item) {
+				this.$axios({
+					url: '/user/getWebsitId',
+					method: 'post',
+					params: {
+						websitId: item.websitId,
+					},
+				}).then((res) => {
+					this.$axios({
+						url: '/user/user/detail',
+						method: 'get',
+						params: {
+							userId: this.userId
+						}
+					}).then(resData => {
+						this.$store.commit('changeUserInfo', resData?.data);
+						uni.setStorageSync('userInfo', resData?.data);
+						if (resData?.data?.adminWebsit?.websitId) {
+							this.$store.commit('changeWebsitObj', resData?.data?.adminWebsit);
+							uni.setStorageSync('websitData', resData?.data?.adminWebsit);
+							uni.setStorageSync("websitIdSj", resData?.data?.adminWebsit?.websitId);
+						}
+						uni.reLaunch({
+							url: "/pages/index/index"
+						})
+					})
+				});
+			},
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.search-container {
+		background: #ffffff;
+		padding: 20rpx;
+
+		::v-deep .u-search {
+			height: 60rpx;
+
+			input {
+				background: #f7f8ff !important;
+			}
+
+			.u-search__content {
+				background: #f7f8ff !important;
+				height: 60rpx;
+			}
+		}
+	}
+
+	.quanjuanniu {
+		width: 100%;
+		height: auto;
+		padding: 30rpx;
+		box-sizing: border-box;
+	}
+
+	.neirongquyu {
+		width: 100%;
+		height: auto;
+		padding: 30rpx 30rpx 15rpx 30rpx;
+		box-sizing: border-box;
+
+		.zhegeshineirong {
+			width: 100%;
+			height: auto;
+			padding: 30rpx;
+			box-sizing: border-box;
+			background: #fff;
+			border-radius: 20rpx;
+			margin-bottom: 30rpx;
+
+			.neirongbiaot {
+				width: 100%;
+				height: auto;
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				box-sizing: border-box;
+				margin-bottom: 40rpx;
+
+				text {
+					font-size: 32rpx;
+					font-weight: 700;
+				}
+			}
+
+			.neironglieju {
+				width: 100%;
+				height: auto;
+				display: flex;
+				align-items: center;
+				justify-content: flex-start;
+				box-sizing: border-box;
+				margin-bottom: 30rpx;
+
+				text {
+					font-size: 28rpx;
+				}
+			}
+
+			.neironghengxin {
+				width: 100%;
+				border-bottom: 1rpx solid #aaa;
+				margin-bottom: 30rpx;
+			}
+
+			.neironganniuqu {
+				widows: 100%;
+				text-align: right;
+			}
+		}
+	}
+
+	.toubuyangs {
+		width: 100%;
+		height: auto;
+		box-sizing: border-box;
+		padding: 30rpx 30rpx 15rpx 30rpx;
+		background: #fff;
+
+		.toubuyangsTab {
+			width: 100%;
+			height: auto;
+			padding: 30rpx;
+			box-sizing: border-box;
+			background: #fff;
+			border-radius: 20rpx;
+			display: flex;
+			align-items: center;
+			justify-content: space-around;
+
+			.toubuyangsTabItem {
+				box-sizing: border-box;
+				font-size: 32rpx;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				flex-direction: column;
+
+				.hengxian {
+					margin-top: 20rpx;
+					width: 100rpx;
+				}
+
+				.xuanzhong {
+					border-bottom: 4rpx solid #000;
+				}
+			}
+		}
+	}
+
+	.flex {
+		display: flex;
+		align-items: center;
+	}
+
+	.flex_asb {
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+	}
+
+	.flex_end {
+		display: flex;
+		align-items: center;
+		justify-content: flex-end;
+		margin-top: 30rpx;
+	}
+
+	.flex1 {
+		flex: 1;
+	}
+
+	.list-container {
+		box-sizing: border-box;
+		padding: 0 30rpx;
+	}
+
+	.mode {
+		@include zj-card;
+		padding: 30rpx 20rpx;
+		margin-top: 30rpx;
+		border-radius: 20rpx;
+		box-sizing: border-box;
+		background-color: #ffffff;
+
+		.order {
+			margin-bottom: 20rpx;
+		}
+
+		.content {
+			width: 450rpx;
+
+			.title {
+				font-weight: bold;
+				font-size: 30rpx;
+			}
+
+			.text,
+			.hui {
+				font-size: 28rpx;
+				margin-top: 16rpx;
+			}
+
+			.hui {
+				color: #999999;
+				margin-right: 20rpx;
+			}
+		}
+
+		.status {
+			font-size: 28rpx;
+			color: #0379ff;
+		}
+
+		.zhihui {
+
+			.text,
+			.hui,
+			.title,
+			.status {
+				color: #999999 !important;
+			}
+		}
+
+		.img {
+			width: 100rpx;
+			height: 100rpx;
+			margin-right: 30rpx;
+		}
+	}
+
+	.search-container {
+		background: #ffffff;
+		padding: 20rpx;
+
+		::v-deep .u-search {
+			height: 60rpx;
+
+			input {
+				background: #f7f8ff !important;
+			}
+
+			.u-search__content {
+				background: #f7f8ff !important;
+				height: 60rpx;
+			}
+		}
+	}
+</style>