Browse Source

improve: 样式及方法优化

From-wh 2 năm trước cách đây
mục cha
commit
9be3c34872

+ 165 - 164
template/uni-app/components/goodList/index.vue

@@ -1,165 +1,166 @@
-<template>
-	<view class='goodList'>
-		<scroll-view scroll-y="true" scroll-with-animation='true' style="height: 100%;">
-
-			<block v-for="(item,index) in bastList" :key="index">
-				<view @click="goDetail(item)" class='item acea-row row-between-wrapper' hover-class="none">
-					<view class='pictrue'>
-						<image :src='item.image'></image>
-						<span class="pictrue_log pictrue_log_class"
-							v-if="item.activity && item.activity.type === '1'">{{$t(`秒杀`)}}</span>
-						<span class="pictrue_log pictrue_log_class"
-							v-if="item.activity && item.activity.type === '2'">{{$t(`砍价`)}}</span>
-						<span class="pictrue_log pictrue_log_class"
-							v-if="item.activity && item.activity.type === '3'">{{$t(`拼团`)}}</span>
-					</view>
-					<view class='underline'>
-						<view class='text'>
-							<view class='line1'>{{item.store_name}}</view>
-							<view class='money font-color'>{{$t(`¥`)}}<text class='num'>{{item.price}}</text></view>
-							<view class='vip-money acea-row row-middle'
-								v-if="item.is_vip && item.vip_price && item.vip_price > 0">{{$t(`¥`)}}{{item.vip_price || 0}}
-								<image src='../../static/images/vip.png'></image><text
-									class='num'>{{$t(`已售`)}} {{item.sales}}{{$t(item.unit_name)}}</text>
-							</view>
-							<view class='vip-money acea-row row-middle' v-else><text
-									class='num'>{{$t(`已售`)}} {{item.sales}}{{$t(item.unit_name)}}</text></view>
-						</view>
-					</view>
-					<!-- <view class='iconfont icon-gouwuche cart-color acea-row row-center-wrapper'></view> -->
-				</view>
-			</block>
-		</scroll-view>
-	</view>
-</template>
-
-<script>
-	import {
-		mapGetters
-	} from "vuex";
-	import {
-		goShopDetail,
-		goPage
-	} from '@/libs/order.js'
-	export default {
-		computed: mapGetters(['uid']),
-		props: {
-			status: {
-				type: Number,
-				default: 0,
-			},
-			bastList: {
-				type: Array,
-				default: function() {
-					return [];
-				}
-			}
-		},
-		data() {
-			return {
-
-			};
-		},
-		methods: {
-			goDetail(item) {
-				goPage().then(res => {
-					goShopDetail(item, this.uid).then(res => {
-						uni.navigateTo({
-							url: `/pages/goods_details/index?id=${item.id}`
-						})
-					})
-				})
-
-			}
-
-		}
-	}
-</script>
-
-<style scoped lang='scss'>
-	.goodList .item {
-		position: relative;
-		padding-left: 30rpx;
-	}
-
-	.goodList .item .pictrue {
-		width: 180rpx;
-		height: 180rpx;
-		position: relative;
-	}
-
-	.goodList .item .pictrue image {
-		width: 100%;
-		height: 100%;
-		border-radius: 20rpx;
-	}
-
-	.goodList .item .pictrue .numPic {
-		position: absolute;
-		left: 7rpx;
-		top: 7rpx;
-		width: 40rpx;
-		height: 40rpx;
-		border-radius: 50%;
-	}
-
-	.goodList .item .underline {
-		padding: 30rpx 30rpx 30rpx 0;
-		border-bottom: 1px solid #f5f5f5;
-	}
-
-	.goodList .item:nth-last-child(1) .underline {
-		border-bottom: 0;
-	}
-
-	.goodList .item .text {
-		font-size: 30rpx;
-		color: #222;
-		width: 489rpx;
-	}
-
-	.goodList .item .text .money {
-		font-size: 26rpx;
-		font-weight: bold;
-		margin-top: 50rpx;
-	}
-
-	.goodList .item .text .money .num {
-		font-size: 34rpx;
-	}
-
-	.goodList .item .text .vip-money {
-		font-size: 24rpx;
-		color: #282828;
-		font-weight: bold;
-		margin-top: 15rpx;
-	}
-
-	.goodList .item .text .vip-money image {
-		width: 66rpx;
-		height: 25rpx;
-		margin-right: 8rpx;
-		margin-left: 8rpx;
-	}
-
-	.goodList .item .text .vip-money .num {
-		font-size: 22rpx;
-		color: #aaa;
-		font-weight: normal;
-		margin-top: -2rpx;
-
-		~.num {
-			margin-left: 22rpx;
-		}
-	}
-
-	.goodList .item .iconfont {
-		position: absolute;
-		right: 30rpx;
-		width: 50rpx;
-		height: 50rpx;
-		border-radius: 50%;
-		font-size: 30rpx;
-		bottom: 38rpx;
-	}
+<template>
+	<view class='goodList'>
+		<scroll-view scroll-y="true" scroll-with-animation='true' style="height: 100%;">
+
+			<block v-for="(item,index) in bastList" :key="index">
+				<view @click="goDetail(item)" class='item acea-row row-between-wrapper' hover-class="none">
+					<view class='pictrue'>
+						<image :src='item.image'></image>
+						<span class="pictrue_log pictrue_log_class"
+							v-if="item.activity && item.activity.type === '1'">{{$t(`秒杀`)}}</span>
+						<span class="pictrue_log pictrue_log_class"
+							v-if="item.activity && item.activity.type === '2'">{{$t(`砍价`)}}</span>
+						<span class="pictrue_log pictrue_log_class"
+							v-if="item.activity && item.activity.type === '3'">{{$t(`拼团`)}}</span>
+					</view>
+					<view class='underline'>
+						<view class='text'>
+							<view class='line1'>{{item.store_name}}</view>
+							<view class='money font-color'>{{$t(`¥`)}}<text class='num'>{{item.price}}</text></view>
+							<view class='vip-money acea-row row-middle'
+								v-if="item.is_vip && item.vip_price && item.vip_price > 0">
+								{{$t(`¥`)}}{{item.vip_price || 0}}
+								<image src='../../static/images/vip.png'></image><text class='num'>{{$t(`已售`)}}
+									{{item.sales}}{{$t(item.unit_name)}}</text>
+							</view>
+							<view class='vip-money acea-row row-middle' v-else><text class='num'>{{$t(`已售`)}}
+									{{item.sales}}{{$t(item.unit_name)}}</text></view>
+						</view>
+					</view>
+					<!-- <view class='iconfont icon-gouwuche cart-color acea-row row-center-wrapper'></view> -->
+				</view>
+			</block>
+		</scroll-view>
+	</view>
+</template>
+
+<script>
+	import {
+		mapGetters
+	} from "vuex";
+	import {
+		goShopDetail,
+		goPage
+	} from '@/libs/order.js'
+	export default {
+		computed: mapGetters(['uid']),
+		props: {
+			status: {
+				type: Number,
+				default: 0,
+			},
+			bastList: {
+				type: Array,
+				default: function() {
+					return [];
+				}
+			}
+		},
+		data() {
+			return {
+
+			};
+		},
+		methods: {
+			goDetail(item) {
+				goPage().then(res => {
+					goShopDetail(item, this.uid).then(res => {
+						uni.navigateTo({
+							url: `/pages/goods_details/index?id=${item.id}`
+						})
+					})
+				})
+
+			}
+
+		}
+	}
+</script>
+
+<style scoped lang='scss'>
+	.goodList .item {
+		position: relative;
+		padding-left: 30rpx;
+	}
+
+	.goodList .item .pictrue {
+		width: 180rpx;
+		height: 180rpx;
+		position: relative;
+	}
+
+	.goodList .item .pictrue image {
+		width: 100%;
+		height: 100%;
+		border-radius: 20rpx;
+	}
+
+	.goodList .item .pictrue .numPic {
+		position: absolute;
+		left: 7rpx;
+		top: 7rpx;
+		width: 40rpx;
+		height: 40rpx;
+		border-radius: 50%;
+	}
+
+	.goodList .item .underline {
+		padding: 30rpx 30rpx 30rpx 0;
+		border-bottom: 1px solid #f5f5f5;
+	}
+
+	.goodList .item:nth-last-child(1) .underline {
+		border-bottom: 0;
+	}
+
+	.goodList .item .text {
+		font-size: 30rpx;
+		color: #222;
+		width: 489rpx;
+	}
+
+	.goodList .item .text .money {
+		font-size: 26rpx;
+		font-weight: bold;
+		margin-top: 50rpx;
+	}
+
+	.goodList .item .text .money .num {
+		font-size: 34rpx;
+	}
+
+	.goodList .item .text .vip-money {
+		font-size: 24rpx;
+		color: #282828;
+		font-weight: bold;
+		margin-top: 15rpx;
+	}
+
+	.goodList .item .text .vip-money image {
+		width: 64rpx;
+		height: 26rpx;
+		margin-right: 8rpx;
+		margin-left: 8rpx;
+	}
+
+	.goodList .item .text .vip-money .num {
+		font-size: 22rpx;
+		color: #aaa;
+		font-weight: normal;
+		margin-top: -2rpx;
+
+		~.num {
+			margin-left: 22rpx;
+		}
+	}
+
+	.goodList .item .iconfont {
+		position: absolute;
+		right: 30rpx;
+		width: 50rpx;
+		height: 50rpx;
+		border-radius: 50%;
+		font-size: 30rpx;
+		bottom: 38rpx;
+	}
 </style>

+ 405 - 402
template/uni-app/pages/goods/goods_comment_con/lottery_comment.vue

@@ -1,403 +1,406 @@
-<template>
-	<view :style="colorStyle">
-		<view class="header" v-show="lotteryShow">
-			<view class="pay-status">
-				<text class="iconfont icon-gou"></text>
-				<view class="pay-status-r">
-					<text class="pay-status-text">
-						{{$t(`评价完成`)}}
-					</text>
-					<text class="date">
-						{{new Date().toLocaleString()}}
-					</text>
-				</view>
-			</view>
-			<view class="jump">
-				<view class="jump-index" @click="goIndex">
-					{{$t(`返回首页`)}}
-				</view>
-			</view>
-		</view>
-		<view class="grids-top" v-show="lotteryShow">
-			<image src="../static/pay-lottery-l.png" mode=""></image>
-			<view class="grids-title">
-				<view>{{$t(`恭喜您`)}},{{$t(`获得`)}} {{lottery_num}} {{$t(`机会`)}}</view>
-			</view>
-			<image src="../static/pay-lottery-r.png" mode=""></image>
-		</view>
-		<view class="grids" v-show="lotteryShow">
-			<image class="grids-bag" src="../static/pay-lottery-bag.png" mode=""></image>
-			<view class="grids-box">
-				<gridsLottery class="" :prizeData="prize" @get_winingIndex='getWiningIndex'
-					@luck_draw_finish='luck_draw_finish'>
-				</gridsLottery>
-			</view>
-		</view>
-		<lotteryAleart :aleartStatus="aleartStatus" @close="closeLottery" :alData="alData" :aleartType="aleartType">
-		</lotteryAleart>
-		<view class="mask" v-if="aleartStatus || addressModel" @click="lotteryAleartClose"></view>
-		<userAddress :aleartStatus="addressModel" @getAddress="getAddress" @close="()=>{addressModel = false}">
-		</userAddress>
-	</view>
-</template>
-
-<script>
-	import gridsLottery from '../components/lottery/index.vue'
-	import lotteryAleart from './components/lotteryAleart.vue'
-	import userAddress from './components/userAddress.vue'
-	import {
-		openOrderSubscribe
-	} from '@/utils/SubscribeMessage.js';
-	import {
-		toLogin
-	} from '@/libs/login.js';
-	import {
-		getLotteryData,
-		startLottery,
-		receiveLottery
-	} from '@/api/lottery.js'
-	import {
-		mapGetters
-	} from "vuex";
-	// #ifdef MP
-	import authorize from '@/components/Authorize';
-	// #endif
-	import colors from '@/mixins/color.js';
-	export default {
-		mixins: [colors],
-		components: {
-			// #ifdef MP
-			authorize,
-			// #endif
-			gridsLottery,
-			lotteryAleart,
-			userAddress
-		},
-		computed: mapGetters(['isLogin']),
-		data() {
-			return {
-				lotteryShow: false,
-				addressModel: false,
-				lottery_num: 0,
-				aleartType: 0,
-				aleartStatus: false,
-				lottery_draw_param: {
-					startIndex: 3, //开始抽奖位置,从0开始
-					totalCount: 3, //一共要转的圈数
-					winingIndex: 1, //中奖的位置,从0开始
-					speed: 100 //抽奖动画的速度 [数字越大越慢,默认100]
-				},
-				alData: {},
-				type: '',
-				date: '',
-				prize: [],
-				orderId: '',
-				order_pay_info: {
-					paid: 1,
-					_status: {}
-				},
-				isAuto: false, //没有授权的不会自动授权
-				isShowAuth: false, //是否隐藏授权
-				couponsHidden: true,
-				couponList: []
-			};
-		},
-		computed: mapGetters(['isLogin']),
-		watch: {
-			isLogin: {
-				handler: function(newV, oldV) {
-					if (newV) {
-						// this.getOrderPayInfo();
-					}
-				},
-				deep: true
-			}
-		},
-		onLoad(options) {
-			this.orderId = options.order_id;
-			this.type = options.type;
-			// this.date = this.set_time(options.date);
-			if (this.isLogin) {
-				// this.getOrderPayInfo();
-				this.getLotteryData(this.type)
-			} else {
-				toLogin();
-			}
-			// #ifdef H5
-			document.addEventListener('visibilitychange', (e) => {
-				let state = document.visibilityState
-				if (state == 'hidden') {}
-				if (state == 'visible') {
-					// this.getOrderPayInfo();
-				}
-			});
-			// #endif
-		},
-		methods: {
-			set_time(str) {
-				var n = parseInt(str);
-				var D = new Date(n);
-				var year = D.getFullYear(); //四位数年份
-
-				var month = D.getMonth() + 1; //月份(0-11),0为一月份
-				month = month < 10 ? ('0' + month) : month;
-
-				var day = D.getDate(); //月的某一天(1-31)
-				day = day < 10 ? ('0' + day) : day;
-
-				var hours = D.getHours(); //小时(0-23)
-				hours = hours < 10 ? ('0' + hours) : hours;
-
-				var minutes = D.getMinutes(); //分钟(0-59)
-				minutes = minutes < 10 ? ('0' + minutes) : minutes;
-
-				// var seconds = D.getSeconds();//秒(0-59)
-				// seconds = seconds<10?('0'+seconds):seconds;
-				// var week = D.getDay();//周几(0-6),0为周日
-				// var weekArr = ['周日','周一','周二','周三','周四','周五','周六'];
-
-				var now_time = year + '-' + month + '-' + day + ' ' + hours + ':' + minutes;
-				return now_time;
-			},
-			openTap() {
-				this.$set(this, 'couponsHidden', !this.couponsHidden);
-			},
-			getWiningIndex(callback) {
-				startLottery({
-					id: this.id
-				}).then(res => {
-					this.prize.forEach((item, index) => {
-						if (res.data.id === item.id) {
-							this.alData = res.data
-							this.lottery_draw_param.winingIndex = index;
-							callback(this.lottery_draw_param);
-						}
-					})
-					this.aleartType = 0
-				}).catch(err => {
-					this.$util.Tips({
-						title: err
-					});
-				})
-			},
-			/**
-			 * 去首页关闭当前所有页面
-			 */
-			goIndex: function(e) {
-				uni.switchTab({
-					url: '/pages/index/index'
-				});
-			},
-			getLotteryData(type) {
-				getLotteryData(type).then(res => {
-					this.lotteryShow = true
-					this.factor_num = res.data.lottery.factor_num
-					this.id = res.data.lottery.id
-					this.prize = res.data.lottery.prize
-					this.lottery_num = res.data.lottery_num
-					this.prize.push({
-						a: 1
-					})
-				}).catch(err => {
-					uni.redirectTo({
-						url: '/pages/goods/order_details/index?order_id=' + this.orderId
-					})
-				})
-			},
-			closeLottery(status) {
-				this.aleartStatus = false
-				this.getLotteryData(this.type)
-				if (this.alData.type === 6) {
-					this.addressModel = true
-				}
-			},
-			getAddress(data) {
-				let addData = data
-				addData.id = this.alData.lottery_record_id
-				addData.address = data.address.province + data.address.city + data.address.district + data.detail
-				receiveLottery(addData).then(res => {
-					this.$util.Tips({
-						title: this.$t(`领取成功`)
-					});
-					this.addressModel = false
-				}).catch(err => {
-					this.$util.Tips({
-						title: err
-					});
-				})
-			},
-			getWiningIndex(callback) {
-				this.aleartType = 0
-				startLottery({
-					id: this.id
-				}).then(res => {
-					this.prize.forEach((item, index) => {
-						if (res.data.id === item.id) {
-							this.alData = res.data
-							this.lottery_draw_param.winingIndex = index;
-							callback(this.lottery_draw_param);
-						}
-					})
-				}).catch(err => {
-					this.$util.Tips({
-						title: err
-					});
-				})
-				// //props修改在小程序和APP端不成功,所以在这里使用回调函数传参,
-			},
-			// 抽奖完成
-			luck_draw_finish(param) {
-				this.aleartType = 2
-				this.aleartStatus = true
-			},
-
-		}
-	}
-</script>
-
-<style lang="scss" scoped>
-	.header {
-		color: #fff;
-		background-color: var(--view-theme);
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		flex-direction: column;
-		padding: 80rpx 0;
-
-		.pay-status {
-			display: flex;
-			align-items: center;
-
-			.iconfont {
-				font-size: 74rpx;
-				background: rgba(#000, 0.08);
-				border-radius: 50%;
-				margin-right: 30rpx;
-				padding: 9rpx;
-			}
-
-			.pay-status-r {
-				display: flex;
-				flex-direction: column;
-
-				.pay-status-text {
-					font-size: 38rpx;
-					font-weight: bold;
-					padding-bottom: 10rpx;
-				}
-			}
-		}
-
-		.grids /deep/ .grid_wrap .lottery_wrap .lottery_grid li:nth-of-type(9) {
-			background: rgba(#fff, 0.2) !important;
-		}
-
-		.jump {
-			display: flex;
-			padding-top: 40rpx;
-
-			.jump-det {
-				background: #FFFFFF;
-				opacity: 1;
-				border-radius: 22px;
-				color: #E93323;
-				padding: 10rpx 38rpx;
-				margin-right: 30rpx;
-			}
-
-			.jump-index {
-				border: 1px solid #FEFFFF;
-				opacity: 1;
-				padding: 10rpx 38rpx;
-				border-radius: 22px;
-			}
-		}
-	}
-
-	.grids-top {
-		display: flex;
-		justify-content: center;
-		padding: 30rpx 0 0 0;
-
-		image {
-			width: 40rpx;
-			height: 40rpx;
-		}
-
-		.grids-title {
-			display: flex;
-			flex-wrap: wrap;
-			justify-content: flex-start;
-			font-size: 20px;
-			color: #E93323;
-			z-index: 999;
-			padding: 0 14rpx;
-			font-weight: bold;
-
-			.grids-frequency {}
-		}
-	}
-
-	/deep/ .lottery_grid {
-		background-color: #E93323;
-		border-radius: 12rpx;
-	}
-
-	.date {
-		font-size: 26rpx;
-		color: #fff;
-	}
-
-	.grids {
-		width: 100%;
-		// height: 800rpx;
-		display: flex;
-		flex-direction: column;
-		justify-content: center;
-		align-items: center;
-		margin-top: 20rpx;
-		position: relative;
-		padding: 30rpx;
-
-		.grids-bag {
-			position: absolute;
-			top: 0;
-			left: 0;
-			width: 750rpx;
-			height: 750rpx;
-			padding: 20rpx;
-			display: flex;
-			justify-content: center;
-			align-items: center;
-		}
-
-		.grids-box {
-			width: 700rpx;
-			height: 700rpx;
-			// z-index: 10000;
-			padding: 20rpx;
-			background-color: #E74435;
-		}
-
-		.winning-tips-list {
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			width: 50%;
-			font-size: 20rpx;
-			line-height: 40rpx;
-			height: 40rpx;
-			font-weight: 400;
-			color: #FFF8F8;
-			margin: 30rpx 0;
-			z-index: 999;
-			background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 51%, rgba(255, 255, 255, 0) 100%);
-
-			.iconfont {
-				font-size: 20rpx;
-				margin-right: 10rpx;
-			}
-		}
-	}
+<template>
+	<view :style="colorStyle">
+		<view class="header" v-show="lotteryShow">
+			<view class="pay-status">
+				<text class="iconfont icon-gou"></text>
+				<view class="pay-status-r">
+					<text class="pay-status-text">
+						{{$t(`评价完成`)}}
+					</text>
+					<text class="date">
+						{{$util.getNowTime()}}
+					</text>
+				</view>
+			</view>
+			<view class="jump">
+				<view class="jump-index" @click="goIndex">
+					{{$t(`返回首页`)}}
+				</view>
+			</view>
+		</view>
+		<view class="grids-top" v-show="lotteryShow">
+			<image src="../static/pay-lottery-l.png" mode=""></image>
+			<view class="grids-title">
+				<view>{{$t(`恭喜您`)}},{{$t(`获得`)}} {{lottery_num}} {{$t(`机会`)}}</view>
+			</view>
+			<image src="../static/pay-lottery-r.png" mode=""></image>
+		</view>
+		<view class="grids" v-show="lotteryShow">
+			<image class="grids-bag" src="../static/pay-lottery-bag.png" mode=""></image>
+			<view class="grids-box">
+				<gridsLottery class="" :prizeData="prize" @get_winingIndex='getWiningIndex'
+					@luck_draw_finish='luck_draw_finish'>
+				</gridsLottery>
+			</view>
+		</view>
+		<lotteryAleart :aleartStatus="aleartStatus" @close="closeLottery" :alData="alData" :aleartType="aleartType">
+		</lotteryAleart>
+		<view class="mask" v-if="aleartStatus || addressModel" @click="lotteryAleartClose"></view>
+		<userAddress :aleartStatus="addressModel" @getAddress="getAddress" @close="()=>{addressModel = false}">
+		</userAddress>
+	</view>
+</template>
+
+<script>
+	import gridsLottery from '../components/lottery/index.vue'
+	import lotteryAleart from './components/lotteryAleart.vue'
+	import userAddress from './components/userAddress.vue'
+	import {
+		openOrderSubscribe
+	} from '@/utils/SubscribeMessage.js';
+	import {
+		getNowTime
+	} from '@/utils/util.js'
+	import {
+		toLogin
+	} from '@/libs/login.js';
+	import {
+		getLotteryData,
+		startLottery,
+		receiveLottery
+	} from '@/api/lottery.js'
+	import {
+		mapGetters
+	} from "vuex";
+	// #ifdef MP
+	import authorize from '@/components/Authorize';
+	// #endif
+	import colors from '@/mixins/color.js';
+	export default {
+		mixins: [colors],
+		components: {
+			// #ifdef MP
+			authorize,
+			// #endif
+			gridsLottery,
+			lotteryAleart,
+			userAddress
+		},
+		computed: mapGetters(['isLogin']),
+		data() {
+			return {
+				lotteryShow: false,
+				addressModel: false,
+				lottery_num: 0,
+				aleartType: 0,
+				aleartStatus: false,
+				lottery_draw_param: {
+					startIndex: 3, //开始抽奖位置,从0开始
+					totalCount: 3, //一共要转的圈数
+					winingIndex: 1, //中奖的位置,从0开始
+					speed: 100 //抽奖动画的速度 [数字越大越慢,默认100]
+				},
+				alData: {},
+				type: '',
+				date: '',
+				prize: [],
+				orderId: '',
+				order_pay_info: {
+					paid: 1,
+					_status: {}
+				},
+				isAuto: false, //没有授权的不会自动授权
+				isShowAuth: false, //是否隐藏授权
+				couponsHidden: true,
+				couponList: []
+			};
+		},
+		computed: mapGetters(['isLogin']),
+		watch: {
+			isLogin: {
+				handler: function(newV, oldV) {
+					if (newV) {
+						// this.getOrderPayInfo();
+					}
+				},
+				deep: true
+			}
+		},
+		onLoad(options) {
+			this.orderId = options.order_id;
+			this.type = options.type;
+			// this.date = this.set_time(options.date);
+			if (this.isLogin) {
+				// this.getOrderPayInfo();
+				this.getLotteryData(this.type)
+			} else {
+				toLogin();
+			}
+			// #ifdef H5
+			document.addEventListener('visibilitychange', (e) => {
+				let state = document.visibilityState
+				if (state == 'hidden') {}
+				if (state == 'visible') {
+					// this.getOrderPayInfo();
+				}
+			});
+			// #endif
+		},
+		methods: {
+			set_time(str) {
+				var n = parseInt(str);
+				var D = new Date(n);
+				var year = D.getFullYear(); //四位数年份
+
+				var month = D.getMonth() + 1; //月份(0-11),0为一月份
+				month = month < 10 ? ('0' + month) : month;
+
+				var day = D.getDate(); //月的某一天(1-31)
+				day = day < 10 ? ('0' + day) : day;
+
+				var hours = D.getHours(); //小时(0-23)
+				hours = hours < 10 ? ('0' + hours) : hours;
+
+				var minutes = D.getMinutes(); //分钟(0-59)
+				minutes = minutes < 10 ? ('0' + minutes) : minutes;
+
+				// var seconds = D.getSeconds();//秒(0-59)
+				// seconds = seconds<10?('0'+seconds):seconds;
+				// var week = D.getDay();//周几(0-6),0为周日
+				// var weekArr = ['周日','周一','周二','周三','周四','周五','周六'];
+
+				var now_time = year + '-' + month + '-' + day + ' ' + hours + ':' + minutes;
+				return now_time;
+			},
+			openTap() {
+				this.$set(this, 'couponsHidden', !this.couponsHidden);
+			},
+			getWiningIndex(callback) {
+				startLottery({
+					id: this.id
+				}).then(res => {
+					this.prize.forEach((item, index) => {
+						if (res.data.id === item.id) {
+							this.alData = res.data
+							this.lottery_draw_param.winingIndex = index;
+							callback(this.lottery_draw_param);
+						}
+					})
+					this.aleartType = 0
+				}).catch(err => {
+					this.$util.Tips({
+						title: err
+					});
+				})
+			},
+			/**
+			 * 去首页关闭当前所有页面
+			 */
+			goIndex: function(e) {
+				uni.switchTab({
+					url: '/pages/index/index'
+				});
+			},
+			getLotteryData(type) {
+				getLotteryData(type).then(res => {
+					this.lotteryShow = true
+					this.factor_num = res.data.lottery.factor_num
+					this.id = res.data.lottery.id
+					this.prize = res.data.lottery.prize
+					this.lottery_num = res.data.lottery_num
+					this.prize.push({
+						a: 1
+					})
+				}).catch(err => {
+					uni.redirectTo({
+						url: '/pages/goods/order_details/index?order_id=' + this.orderId
+					})
+				})
+			},
+			closeLottery(status) {
+				this.aleartStatus = false
+				this.getLotteryData(this.type)
+				if (this.alData.type === 6) {
+					this.addressModel = true
+				}
+			},
+			getAddress(data) {
+				let addData = data
+				addData.id = this.alData.lottery_record_id
+				addData.address = data.address.province + data.address.city + data.address.district + data.detail
+				receiveLottery(addData).then(res => {
+					this.$util.Tips({
+						title: this.$t(`领取成功`)
+					});
+					this.addressModel = false
+				}).catch(err => {
+					this.$util.Tips({
+						title: err
+					});
+				})
+			},
+			getWiningIndex(callback) {
+				this.aleartType = 0
+				startLottery({
+					id: this.id
+				}).then(res => {
+					this.prize.forEach((item, index) => {
+						if (res.data.id === item.id) {
+							this.alData = res.data
+							this.lottery_draw_param.winingIndex = index;
+							callback(this.lottery_draw_param);
+						}
+					})
+				}).catch(err => {
+					this.$util.Tips({
+						title: err
+					});
+				})
+				// //props修改在小程序和APP端不成功,所以在这里使用回调函数传参,
+			},
+			// 抽奖完成
+			luck_draw_finish(param) {
+				this.aleartType = 2
+				this.aleartStatus = true
+			},
+
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.header {
+		color: #fff;
+		background-color: var(--view-theme);
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		flex-direction: column;
+		padding: 80rpx 0;
+
+		.pay-status {
+			display: flex;
+			align-items: center;
+
+			.iconfont {
+				font-size: 74rpx;
+				background: rgba(#000, 0.08);
+				border-radius: 50%;
+				margin-right: 30rpx;
+				padding: 9rpx;
+			}
+
+			.pay-status-r {
+				display: flex;
+				flex-direction: column;
+
+				.pay-status-text {
+					font-size: 38rpx;
+					font-weight: bold;
+					padding-bottom: 10rpx;
+				}
+			}
+		}
+
+		.grids /deep/ .grid_wrap .lottery_wrap .lottery_grid li:nth-of-type(9) {
+			background: rgba(#fff, 0.2) !important;
+		}
+
+		.jump {
+			display: flex;
+			padding-top: 40rpx;
+
+			.jump-det {
+				background: #FFFFFF;
+				opacity: 1;
+				border-radius: 22px;
+				color: #E93323;
+				padding: 10rpx 38rpx;
+				margin-right: 30rpx;
+			}
+
+			.jump-index {
+				border: 1px solid #FEFFFF;
+				opacity: 1;
+				padding: 10rpx 38rpx;
+				border-radius: 22px;
+			}
+		}
+	}
+
+	.grids-top {
+		display: flex;
+		justify-content: center;
+		padding: 30rpx 0 0 0;
+
+		image {
+			width: 40rpx;
+			height: 40rpx;
+		}
+
+		.grids-title {
+			display: flex;
+			flex-wrap: wrap;
+			justify-content: flex-start;
+			font-size: 20px;
+			color: #E93323;
+			z-index: 999;
+			padding: 0 14rpx;
+			font-weight: bold;
+
+			.grids-frequency {}
+		}
+	}
+
+	/deep/ .lottery_grid {
+		background-color: #E93323;
+		border-radius: 12rpx;
+	}
+
+	.date {
+		font-size: 26rpx;
+		color: #fff;
+	}
+
+	.grids {
+		width: 100%;
+		// height: 800rpx;
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+		align-items: center;
+		margin-top: 20rpx;
+		position: relative;
+		padding: 30rpx;
+
+		.grids-bag {
+			position: absolute;
+			top: 0;
+			left: 0;
+			width: 750rpx;
+			height: 750rpx;
+			padding: 20rpx;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+		}
+
+		.grids-box {
+			width: 700rpx;
+			height: 700rpx;
+			// z-index: 10000;
+			padding: 20rpx;
+			background-color: #E74435;
+		}
+
+		.winning-tips-list {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			width: 50%;
+			font-size: 20rpx;
+			line-height: 40rpx;
+			height: 40rpx;
+			font-weight: 400;
+			color: #FFF8F8;
+			margin: 30rpx 0;
+			z-index: 999;
+			background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 51%, rgba(255, 255, 255, 0) 100%);
+
+			.iconfont {
+				font-size: 20rpx;
+				margin-right: 10rpx;
+			}
+		}
+	}
 </style>

+ 288 - 284
template/uni-app/pages/index/visualization/components/goodList.vue

@@ -1,285 +1,289 @@
-<template>
-	<view>
-		<view class='goodList' v-if="isShow && bastList.length && !isIframe">
-			<block v-for="(item,index) in bastList" :key="index">
-				<view @click="goDetail(item)" class='item acea-row row-between-wrapper' hover-class="none">
-					<view class='pictrue'>
-						<image :src='item.image'></image>
-						<span class="pictrue_log pictrue_log_class"
-							v-if="item.activity && item.activity.type === '1'">{{$t(`秒杀`)}}</span>
-						<span class="pictrue_log pictrue_log_class"
-							v-if="item.activity && item.activity.type === '2'">{{$t(`砍价`)}}</span>
-						<span class="pictrue_log pictrue_log_class"
-							v-if="item.activity && item.activity.type === '3'">{{$t(`拼团`)}}</span>
-					</view>
-					<view class='underline'>
-						<view class='text'>
-							<view class='line1'>{{item.store_name}}</view>
-							<view class='money font-color'>{{$t(`¥`)}}<text class='num'>{{item.price}}</text></view>
-							<view class="vip-money acea-row row-middle"
-								v-if="item.base && item.vip_price && item.vip_price > 0">{{$t(`¥`)}}{{item.vip_price || 0}}
-								<image src='/static/images/jvip.png' class="jvip"></image><text
-									class='num'>{{$t(`已售`)}}{{item.sales}}{{item.unit_name}}</text>
-							</view>
-							<view class='vip-money acea-row row-middle'
-								v-if="item.is_vip && item.vip_price && item.vip_price > 0">{{$t(`¥`)}}{{item.vip_price || 0}}
-								<image src='/static/images/vip.png'></image><text
-									class='num'>{{$t(`已售`)}}{{item.sales}}{{item.unit_name}}</text>
-							</view>
-							<view class='vip-money acea-row row-middle' v-else><text
-									class='num'>{{$t(`已售`)}}{{item.sales}}{{item.unit_name}}</text></view>
-						</view>
-					</view>
-				</view>
-			</block>
-		</view>
-		<view class='goodList' v-if="bastList.length && isIframe">
-			<block v-for="(item,index) in bastList" :key="index">
-				<view @click="goDetail(item)" class='item acea-row row-between-wrapper' hover-class="none">
-					<view class='pictrue'>
-						<image :src='item.image'></image>
-						<span class="pictrue_log pictrue_log_class"
-							v-if="item.activity && item.activity.type === '1'">{{$t(`秒杀`)}}</span>
-						<span class="pictrue_log pictrue_log_class"
-							v-if="item.activity && item.activity.type === '2'">{{$t(`砍价`)}}</span>
-						<span class="pictrue_log pictrue_log_class"
-							v-if="item.activity && item.activity.type === '3'">{{$t(`拼团`)}}</span>
-					</view>
-					<view class='underline'>
-						<view class='text'>
-							<view class='line1'>{{item.store_name}}</view>
-							<view class='money font-color'>{{$t(`¥`)}}<text class='num'>{{item.price}}</text></view>
-							<view class="vip-money acea-row row-middle"
-								v-if="item.base && item.vip_price && item.vip_price > 0">{{$t(`¥`)}}{{item.vip_price || 0}}
-								<image src='/static/images/jvip.png' class="jvip"></image><text
-									class='num'>{{$t(`已售`)}}{{item.sales}}{{item.unit_name}}</text>
-							</view>
-							<view class='vip-money acea-row row-middle'
-								v-if="item.is_vip && item.vip_price && item.vip_price > 0">{{$t(`¥`)}}{{item.vip_price || 0}}
-								<image src='/static/images/vip.png'></image><text
-									class='num'>{{$t(`已售`)}}{{item.sales}}{{item.unit_name}}</text>
-							</view>
-							<view class='vip-money acea-row row-middle' v-else><text
-									class='num'>{{$t(`已售`)}}{{item.sales}}{{item.unit_name}}</text></view>
-						</view>
-					</view>
-				</view>
-			</block>
-		</view>
-		<view class="empty-img" v-if="!bastList.length && isIframe">{{$t(`商品列表,暂无数据`)}}</view>
-	</view>
-</template>
-
-<script>
-	let app = getApp()
-	import {
-		mapGetters
-	} from "vuex";
-	import {
-		goShopDetail,
-		goPage
-	} from '@/libs/order.js';
-	import {
-		getHomeProducts
-	} from '@/api/store.js';
-	export default {
-		name: 'goodList',
-		computed: mapGetters(['uid']),
-		props: {
-			dataConfig: {
-				type: Object,
-				default: () => {}
-			}
-		},
-		watch: {
-			dataConfig: {
-				immediate: true,
-				handler(nVal, oVal) {
-					if (nVal) {
-						this.isShow = nVal.isShow.val;
-						this.selectType = nVal.tabConfig.tabVal;
-						this.$set(this, 'selectId', nVal.selectConfig.activeValue || '');
-						this.$set(this, 'type', nVal.selectSortConfig.activeValue);
-						this.salesOrder = nVal.goodsSort.type == 1 ? 'desc' : '';
-						this.newsOrder = nVal.goodsSort.type == 2 ? 'news' : '';
-						this.ids = nVal.ids ? nVal.ids.join(',') : '';
-						this.numConfig = nVal.numConfig.val;
-						this.productslist();
-					}
-				}
-			}
-		},
-		data() {
-			return {
-				bastList: [],
-				name: this.$options.name,
-				isIframe: false,
-				isShow: true,
-				selectType: 0,
-				selectId: '',
-				salesOrder: '',
-				newsOrder: '',
-				ids: '',
-				page: 1,
-				limit: this.$config.LIMIT,
-				type: '',
-				numConfig: 0
-			};
-		},
-		created() {
-			this.isIframe = app.globalData.isIframe;
-		},
-		mounted() {},
-		methods: {
-			// 产品列表
-			productslist: function() {
-				let that = this;
-				let data = {};
-				if (that.selectType) {
-					data = {
-						page: that.page,
-						limit: that.limit,
-						type: that.type,
-						ids: that.ids,
-						selectType: that.selectType
-					}
-				} else {
-					data = {
-						page: that.page,
-						limit: that.numConfig <= that.limit ? that.numConfig : that.limit,
-						type: that.type,
-						newsOrder: that.newsOrder,
-						salesOrder: that.salesOrder,
-						selectId: that.selectId,
-						selectType: that.selectType
-					}
-				}
-				getHomeProducts(data).then(res => {
-					that.bastList = res.data.list;
-				}).catch(err => {
-					that.$util.Tips({
-						title: err
-					});
-				});
-			},
-			goDetail(item) {
-				goPage().then(res => {
-					goShopDetail(item, this.uid).then(res => {
-						uni.navigateTo({
-							url: `/pages/goods_details/index?id=${item.id}`
-						})
-					})
-				})
-
-			}
-		}
-	}
-</script>
-
-<style scoped lang='scss'>
-	.empty-img {
-		width: 690rpx;
-		height: 300rpx;
-		border-radius: 14rpx;
-		margin: 26rpx auto 0 auto;
-		background-color: #ccc;
-		text-align: center;
-		line-height: 300rpx;
-
-		.iconfont {
-			font-size: 50rpx;
-		}
-	}
-
-	.goodList .item {
-		position: relative;
-		padding-left: 30rpx;
-		box-shadow: 2px 1px 6px 1px rgba(0, 0, 0, 0.03);
-	}
-
-	.goodList .item .pictrue {
-		width: 180rpx;
-		height: 180rpx;
-		position: relative;
-	}
-
-	.goodList .item .pictrue image {
-		width: 100%;
-		height: 100%;
-		border-radius: 20rpx;
-	}
-
-	.goodList .item .pictrue .numPic {
-		position: absolute;
-		left: 7rpx;
-		top: 7rpx;
-		width: 40rpx;
-		height: 40rpx;
-		border-radius: 50%;
-	}
-
-	.goodList .item .underline {
-		padding: 30rpx 30rpx 30rpx 0;
-		border-bottom: 1px solid #f5f5f5;
-	}
-
-	.goodList .item:nth-last-child(1) .underline {
-		border-bottom: 0;
-	}
-
-	.goodList .item .text {
-		font-size: 30rpx;
-		color: #222;
-		width: 489rpx;
-	}
-
-	.goodList .item .text .money {
-		font-size: 26rpx;
-		font-weight: bold;
-		margin-top: 50rpx;
-	}
-
-	.goodList .item .text .money .num {
-		font-size: 34rpx;
-	}
-
-	.goodList .item .text .vip-money {
-		font-size: 24rpx;
-		color: #282828;
-		font-weight: bold;
-		margin-top: 15rpx;
-	}
-
-	.goodList .item .text .vip-money .jvip {
-		width: 46rpx;
-		height: 22rpx;
-	}
-
-	.goodList .item .text .vip-money image {
-		width: 66rpx;
-		height: 25rpx;
-		margin-right: 8rpx;
-		margin-left: 8rpx;
-	}
-
-	.goodList .item .text .vip-money .num {
-		font-size: 22rpx;
-		color: #aaa;
-		font-weight: normal;
-		margin-top: -2rpx;
-
-		~.num {
-			margin-left: 22rpx;
-		}
-	}
-
-	.goodList .item .iconfont {
-		position: absolute;
-		right: 30rpx;
-		width: 50rpx;
-		height: 50rpx;
-		border-radius: 50%;
-		font-size: 30rpx;
-		bottom: 38rpx;
-	}
+<template>
+	<view>
+		<view class='goodList' v-if="isShow && bastList.length && !isIframe">
+			<block v-for="(item,index) in bastList" :key="index">
+				<view @click="goDetail(item)" class='item acea-row row-between-wrapper' hover-class="none">
+					<view class='pictrue'>
+						<image :src='item.image'></image>
+						<span class="pictrue_log pictrue_log_class"
+							v-if="item.activity && item.activity.type === '1'">{{$t(`秒杀`)}}</span>
+						<span class="pictrue_log pictrue_log_class"
+							v-if="item.activity && item.activity.type === '2'">{{$t(`砍价`)}}</span>
+						<span class="pictrue_log pictrue_log_class"
+							v-if="item.activity && item.activity.type === '3'">{{$t(`拼团`)}}</span>
+					</view>
+					<view class='underline'>
+						<view class='text'>
+							<view class='line1'>{{item.store_name}}</view>
+							<view class='money font-color'>{{$t(`¥`)}}<text class='num'>{{item.price}}</text></view>
+							<view class="vip-money acea-row row-middle"
+								v-if="item.base && item.vip_price && item.vip_price > 0">
+								{{$t(`¥`)}}{{item.vip_price || 0}}
+								<image src='/static/images/jvip.png' class="jvip"></image><text
+									class='num'>{{$t(`已售`)}}{{item.sales}}{{item.unit_name}}</text>
+							</view>
+							<view class='vip-money acea-row row-middle'
+								v-if="item.is_vip && item.vip_price && item.vip_price > 0">
+								{{$t(`¥`)}}{{item.vip_price || 0}}
+								<image src='/static/images/vip.png'></image><text
+									class='num'>{{$t(`已售`)}}{{item.sales}}{{item.unit_name}}</text>
+							</view>
+							<view class='vip-money acea-row row-middle' v-else><text
+									class='num'>{{$t(`已售`)}}{{item.sales}}{{item.unit_name}}</text></view>
+						</view>
+					</view>
+				</view>
+			</block>
+		</view>
+		<view class='goodList' v-if="bastList.length && isIframe">
+			<block v-for="(item,index) in bastList" :key="index">
+				<view @click="goDetail(item)" class='item acea-row row-between-wrapper' hover-class="none">
+					<view class='pictrue'>
+						<image :src='item.image'></image>
+						<span class="pictrue_log pictrue_log_class"
+							v-if="item.activity && item.activity.type === '1'">{{$t(`秒杀`)}}</span>
+						<span class="pictrue_log pictrue_log_class"
+							v-if="item.activity && item.activity.type === '2'">{{$t(`砍价`)}}</span>
+						<span class="pictrue_log pictrue_log_class"
+							v-if="item.activity && item.activity.type === '3'">{{$t(`拼团`)}}</span>
+					</view>
+					<view class='underline'>
+						<view class='text'>
+							<view class='line1'>{{item.store_name}}</view>
+							<view class='money font-color'>{{$t(`¥`)}}<text class='num'>{{item.price}}</text></view>
+							<view class="vip-money acea-row row-middle"
+								v-if="item.base && item.vip_price && item.vip_price > 0">
+								{{$t(`¥`)}}{{item.vip_price || 0}}
+								<image src='/static/images/jvip.png' class="jvip"></image><text
+									class='num'>{{$t(`已售`)}}{{item.sales}}{{item.unit_name}}</text>
+							</view>
+							<view class='vip-money acea-row row-middle'
+								v-if="item.is_vip && item.vip_price && item.vip_price > 0">
+								{{$t(`¥`)}}{{item.vip_price || 0}}
+								<image src='/static/images/vip.png'></image><text
+									class='num'>{{$t(`已售`)}}{{item.sales}}{{item.unit_name}}</text>
+							</view>
+							<view class='vip-money acea-row row-middle' v-else><text
+									class='num'>{{$t(`已售`)}}{{item.sales}}{{item.unit_name}}</text></view>
+						</view>
+					</view>
+				</view>
+			</block>
+		</view>
+		<view class="empty-img" v-if="!bastList.length && isIframe">{{$t(`商品列表,暂无数据`)}}</view>
+	</view>
+</template>
+
+<script>
+	let app = getApp()
+	import {
+		mapGetters
+	} from "vuex";
+	import {
+		goShopDetail,
+		goPage
+	} from '@/libs/order.js';
+	import {
+		getHomeProducts
+	} from '@/api/store.js';
+	export default {
+		name: 'goodList',
+		computed: mapGetters(['uid']),
+		props: {
+			dataConfig: {
+				type: Object,
+				default: () => {}
+			}
+		},
+		watch: {
+			dataConfig: {
+				immediate: true,
+				handler(nVal, oVal) {
+					if (nVal) {
+						this.isShow = nVal.isShow.val;
+						this.selectType = nVal.tabConfig.tabVal;
+						this.$set(this, 'selectId', nVal.selectConfig.activeValue || '');
+						this.$set(this, 'type', nVal.selectSortConfig.activeValue);
+						this.salesOrder = nVal.goodsSort.type == 1 ? 'desc' : '';
+						this.newsOrder = nVal.goodsSort.type == 2 ? 'news' : '';
+						this.ids = nVal.ids ? nVal.ids.join(',') : '';
+						this.numConfig = nVal.numConfig.val;
+						this.productslist();
+					}
+				}
+			}
+		},
+		data() {
+			return {
+				bastList: [],
+				name: this.$options.name,
+				isIframe: false,
+				isShow: true,
+				selectType: 0,
+				selectId: '',
+				salesOrder: '',
+				newsOrder: '',
+				ids: '',
+				page: 1,
+				limit: this.$config.LIMIT,
+				type: '',
+				numConfig: 0
+			};
+		},
+		created() {
+			this.isIframe = app.globalData.isIframe;
+		},
+		mounted() {},
+		methods: {
+			// 产品列表
+			productslist: function() {
+				let that = this;
+				let data = {};
+				if (that.selectType) {
+					data = {
+						page: that.page,
+						limit: that.limit,
+						type: that.type,
+						ids: that.ids,
+						selectType: that.selectType
+					}
+				} else {
+					data = {
+						page: that.page,
+						limit: that.numConfig <= that.limit ? that.numConfig : that.limit,
+						type: that.type,
+						newsOrder: that.newsOrder,
+						salesOrder: that.salesOrder,
+						selectId: that.selectId,
+						selectType: that.selectType
+					}
+				}
+				getHomeProducts(data).then(res => {
+					that.bastList = res.data.list;
+				}).catch(err => {
+					that.$util.Tips({
+						title: err
+					});
+				});
+			},
+			goDetail(item) {
+				goPage().then(res => {
+					goShopDetail(item, this.uid).then(res => {
+						uni.navigateTo({
+							url: `/pages/goods_details/index?id=${item.id}`
+						})
+					})
+				})
+
+			}
+		}
+	}
+</script>
+
+<style scoped lang='scss'>
+	.empty-img {
+		width: 690rpx;
+		height: 300rpx;
+		border-radius: 14rpx;
+		margin: 26rpx auto 0 auto;
+		background-color: #ccc;
+		text-align: center;
+		line-height: 300rpx;
+
+		.iconfont {
+			font-size: 50rpx;
+		}
+	}
+
+	.goodList .item {
+		position: relative;
+		padding-left: 30rpx;
+		box-shadow: 2px 1px 6px 1px rgba(0, 0, 0, 0.03);
+	}
+
+	.goodList .item .pictrue {
+		width: 180rpx;
+		height: 180rpx;
+		position: relative;
+	}
+
+	.goodList .item .pictrue image {
+		width: 100%;
+		height: 100%;
+		border-radius: 20rpx;
+	}
+
+	.goodList .item .pictrue .numPic {
+		position: absolute;
+		left: 7rpx;
+		top: 7rpx;
+		width: 40rpx;
+		height: 40rpx;
+		border-radius: 50%;
+	}
+
+	.goodList .item .underline {
+		padding: 30rpx 30rpx 30rpx 0;
+		border-bottom: 1px solid #f5f5f5;
+	}
+
+	.goodList .item:nth-last-child(1) .underline {
+		border-bottom: 0;
+	}
+
+	.goodList .item .text {
+		font-size: 30rpx;
+		color: #222;
+		width: 489rpx;
+	}
+
+	.goodList .item .text .money {
+		font-size: 26rpx;
+		font-weight: bold;
+		margin-top: 50rpx;
+	}
+
+	.goodList .item .text .money .num {
+		font-size: 34rpx;
+	}
+
+	.goodList .item .text .vip-money {
+		font-size: 24rpx;
+		color: #282828;
+		font-weight: bold;
+		margin-top: 15rpx;
+	}
+
+	.goodList .item .text .vip-money .jvip {
+		width: 46rpx;
+		height: 22rpx;
+	}
+
+	.goodList .item .text .vip-money image {
+		width: 64rpx;
+		height: 26rpx;
+		margin-right: 8rpx;
+		margin-left: 8rpx;
+	}
+
+	.goodList .item .text .vip-money .num {
+		font-size: 22rpx;
+		color: #aaa;
+		font-weight: normal;
+		margin-top: -2rpx;
+
+		~.num {
+			margin-left: 22rpx;
+		}
+	}
+
+	.goodList .item .iconfont {
+		position: absolute;
+		right: 30rpx;
+		width: 50rpx;
+		height: 50rpx;
+		border-radius: 50%;
+		font-size: 30rpx;
+		bottom: 38rpx;
+	}
 </style>

+ 5 - 5
template/uni-app/pages/index/visualization/components/recommend.vue

@@ -359,15 +359,15 @@
 	.productList .item .text .vip .vip-money {
 		font-size: 24rpx;
 		color: #282828;
-		font-weight: bold;
-		display: flex;
+		font-weight: bold;
+		display: flex;
 		align-items: center;
 	}
 
 	.productList .item .text .vip .vip-money image {
-		width: 46rpx;
-		height: 21rpx;
-		margin-left: 4rpx;
+		width: 64rpx;
+		height: 26rpx;
+		margin-left: 4rpx;
 		margin-top: 4rpx;
 	}
 

+ 445 - 439
template/uni-app/pages/points_mall/integral_goods_list.vue

@@ -1,440 +1,446 @@
-<template>
-	<view :style="colorStyle">
-		<view class='productList'>
-			<view class='search bg-color acea-row row-between-wrapper'>
-				<view class='input acea-row row-between-wrapper'><text class='iconfont icon-sousuo'></text>
-					<input :placeholder='$t(`搜索商品名称`)' placeholder-class='placeholder' confirm-type='search' name="search"
-						:value='where.store_name' @confirm="searchSubmit"></input>
-				</view>
-				<view class='iconfont' :class='is_switch==true?"icon-pailie":"icon-tupianpailie"' @click='Changswitch'>
-				</view>
-			</view>
-			<view class='nav acea-row row-middle'>
-				<view class='item line1' :class='title ? "font-num":""' @click='set_where(1)'>{{$t(`默认`)}}</view>
-				<view class='item' @click='set_where(2)'>
-					{{$t(`积分`)}}
-					<image v-if="price==1" src='../../static/images/up.png'></image>
-					<image v-else-if="price==2" src='../../static/images/down.png'></image>
-					<image v-else src='../../static/images/horn.png'></image>
-				</view>
-				<view class='item' @click='set_where(3)'>
-					{{$t(`销量`)}}
-					<image v-if="stock==1" src='../../static/images/up.png'></image>
-					<image v-else-if="stock==2" src='../../static/images/down.png'></image>
-					<image v-else src='../../static/images/horn.png'></image>
-				</view>
-			</view>
-			<view class='list acea-row row-between-wrapper' :class='is_switch==true?"":"on"'>
-				<view class='item' :class='is_switch==true?"":"on"' hover-class='none'
-					v-for="(item,index) in productList" :key="index" @click="godDetail(item)">
-					<view class='pictrue' :class='is_switch==true?"":"on"'>
-						<image :src='item.image' :class='is_switch==true?"":"on"'></image>
-					</view>
-					<view class='text' :class='is_switch==true?"":"on"'>
-						<view class='name line1'>{{item.title}}</view>
-						<view class='money font-color' :class='is_switch==true?"":"on"'><text
-								class='num'>{{item.price}}{{$t(`积分`)}}</text></view>
-						<view class='vip acea-row row-between-wrapper' :class='is_switch==true?"":"on"'>
-							<view class='vip-money' v-if="item.vip_price && item.vip_price > 0">{{item.vip_price}} {{$t(`积分`)}}
-								<image src='../../static/images/vip.png'></image>
-							</view>
-							<view class="sales">
-								<view class="">
-									{{item.sales}}{{$t(`人兑换`)}}
-								</view>
-								<view class="exchange">{{$t(`兑换`)}}</view>
-							</view>
-						</view>
-					</view>
-				</view>
-				<view class='loadingicon acea-row row-center-wrapper' v-if='productList.length > 0'>
-					<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
-				</view>
-			</view>
-		</view>
-		<view class='noCommodity' v-if="productList.length==0 && where.page > 1">
-			<view class='emptyBox'>
-				<image :src="imgHost + '/statics/images/no-thing.png'"></image>
-			</view>
-			<recommend :hostProduct="hostProduct"></recommend>
-		</view>
-		<!-- #ifndef MP -->
-		<home></home>
-		<!-- #endif -->
-	</view>
-</template>
-
-<script>
-	import home from '@/components/home';
-	import {
-		getProductHot
-	} from '@/api/store.js';
-	import {
-		getStoreIntegralList
-	} from '@/api/activity.js';
-	import recommend from '@/components/recommend';
-	import {
-		mapGetters
-	} from "vuex";
-	import {
-		goShopDetail
-	} from '@/libs/order.js'
-	import colors from "@/mixins/color";
-	import {HTTP_REQUEST_URL} from '@/config/app';
-	export default {
-		computed: mapGetters(['uid']),
-		components: {
-			recommend,
-			home
-		},
-		mixins: [colors],
-		data() {
-			return {
-				imgHost:HTTP_REQUEST_URL,
-				productList: [],
-				is_switch: true,
-				where: {
-					store_name: '',
-					priceOrder: '',
-					salesOrder: '',
-					page: 1,
-					limit: 20,
-				},
-				price: 0,
-				stock: 0,
-				nows: false,
-				loadend: false,
-				loading: false,
-				loadTitle: this.$t(`加载更多`),
-				title: '',
-				hostProduct: [],
-				hotPage: 1,
-				hotLimit: 10,
-				hotScroll: false
-			};
-		},
-		// 滚动监听
-		onPageScroll(e) {
-			// 传入scrollTop值并触发所有easy-loadimage组件下的滚动监听事件
-			uni.$emit('scroll');
-		},
-		onLoad: function(options) {
-			this.where.cid = options.cid || 0;
-			this.$set(this.where, 'sid', options.sid || 0);
-			this.title = options.title || '';
-			this.$set(this.where, 'store_name', options.searchValue || '');
-			this.get_product_list();
-			this.get_host_product();
-		},
-		
-		methods: {
-			// 去详情页
-			godDetail(item) {
-				goShopDetail(item, this.uid).then(res => {
-					uni.navigateTo({
-						url: `/pages/points_mall/integral_goods_details?id=${item.id}`
-					})
-				})
-			},
-			Changswitch: function() {
-				let that = this;
-				that.is_switch = !that.is_switch
-			},
-			searchSubmit: function(e) {
-				let that = this;
-				that.$set(that.where, 'store_name', e.detail.value);
-				that.loadend = false;
-				that.$set(that.where, 'page', 1)
-				this.get_product_list(true);
-			},
-			/**
-			 * 获取我的推荐
-			 */
-			get_host_product: function() {
-				let that = this;
-				if (that.hotScroll) return
-				getProductHot(
-					that.hotPage,
-					that.hotLimit,
-				).then(res => {
-					that.hotPage++
-					that.hotScroll = res.data.length < that.hotLimit
-					that.hostProduct = that.hostProduct.concat(res.data)
-					// that.$set(that, 'hostProduct', res.data)
-				});
-			},
-			//点击事件处理
-			set_where: function(e) {
-				switch (e) {
-					case 1:
-						this.where = {
-							store_name: '',
-							priceOrder: '',
-							salesOrder: '',
-							page: 1,
-							limit: 20,
-						}
-						this.price = 0
-						this.stock = 0
-						break;
-					case 2:
-						if (this.price == 0) this.price = 1;
-						else if (this.price == 1) this.price = 2;
-						else if (this.price == 2) this.price = 0;
-						this.stock = 0;
-						break;
-					case 3:
-						if (this.stock == 0) this.stock = 1;
-						else if (this.stock == 1) this.stock = 2;
-						else if (this.stock == 2) this.stock = 0;
-						this.price = 0
-						break;
-					case 4:
-						this.nows = !this.nows;
-						break;
-				}
-				this.loadend = false;
-				this.$set(this.where, 'page', 1);
-				this.get_product_list(true);
-			},
-			//设置where条件
-			setWhere: function() {
-				if (this.price == 0) this.where.priceOrder = '';
-				else if (this.price == 1) this.where.priceOrder = 'asc';
-				else if (this.price == 2) this.where.priceOrder = 'desc';
-				if (this.stock == 0) this.where.salesOrder = '';
-				else if (this.stock == 1) this.where.salesOrder = 'asc';
-				else if (this.stock == 2) this.where.salesOrder = 'desc';
-				this.where.news = this.nows ? 1 : 0;
-			},
-			//查找产品
-			get_product_list: function(isPage) {
-				let that = this;
-				that.setWhere();
-				if (that.loadend) return;
-				if (that.loading) return;
-				if (isPage === true) that.$set(that, 'productList', []);
-				that.loading = true;
-				that.loadTitle = '';
-				getStoreIntegralList(that.where).then(res => {
-					let list = res.data;
-					let productList = that.$util.SplitArray(list, that.productList);
-					let loadend = list.length < that.where.limit;
-					that.loadend = loadend;
-					that.loading = false;
-					that.loadTitle = loadend ? that.$t(`我也是有底线的`) : that.$t(`加载更多`);
-					that.$set(that, 'productList', productList);
-					that.$set(that.where, 'page', that.where.page + 1);
-				}).catch(err => {
-					that.loading = false;
-					that.loadTitle = that.$t(`加载更多`);
-				});
-			},
-		},
-		onPullDownRefresh() {
-
-		},
-		onReachBottom() {
-			if (this.productList.length > 0) {
-				this.get_product_list();
-			} else {
-				this.get_host_product();
-			}
-
-		}
-	}
-</script>
-
-<style scoped lang="scss">
-	.productList .search {
-		width: 100%;
-		height: 86rpx;
-		padding-left: 23rpx;
-		box-sizing: border-box;
-		position: fixed;
-		left: 0;
-		top: 0;
-		z-index: 9;
-	}
-
-	.productList .search .input {
-		width: 640rpx;
-		height: 60rpx;
-		background-color: #fff;
-		border-radius: 50rpx;
-		padding: 0 20rpx;
-		box-sizing: border-box;
-	}
-
-	.productList .search .input input {
-		width: 548rpx;
-		height: 100%;
-		font-size: 26rpx;
-	}
-
-	.productList .search .input .placeholder {
-		color: #999;
-	}
-
-	.productList .search .input .iconfont {
-		font-size: 35rpx;
-		color: #555;
-	}
-
-	.productList .search .icon-pailie,
-	.productList .search .icon-tupianpailie {
-		color: #fff;
-		width: 62rpx;
-		font-size: 40rpx;
-		height: 86rpx;
-		line-height: 86rpx;
-	}
-
-	.productList .nav {
-		height: 86rpx;
-		color: #454545;
-		position: fixed;
-		left: 0;
-		width: 100%;
-		font-size: 28rpx;
-		background-color: #fff;
-		margin-top: 86rpx;
-		top: 0;
-		z-index: 9;
-	}
-
-	.productList .nav .item {
-		width: 33%;
-		text-align: center;
-	}
-
-	.productList .nav .item.font-color {}
-
-	.productList .nav .item image {
-		width: 15rpx;
-		height: 19rpx;
-		margin-left: 10rpx;
-	}
-
-	.productList .list {
-		padding: 0 20rpx;
-		margin-top: 172rpx;
-	}
-
-	.productList .list.on {
-		background-color: #fff;
-		border-top: 1px solid #f6f6f6;
-	}
-
-	.productList .list .item {
-		width: 345rpx;
-		margin-top: 20rpx;
-		background-color: #fff;
-		border-radius: 20rpx;
-	}
-
-	.productList .list .item.on {
-		width: 100%;
-		display: flex;
-		border-bottom: 1rpx solid #f6f6f6;
-		padding: 30rpx 0;
-		margin: 0;
-	}
-
-	.productList .list .item .pictrue {
-		position: relative;
-		width: 100%;
-		height: 345rpx;
-	}
-
-	.productList .list .item .pictrue.on {
-		width: 180rpx;
-		height: 180rpx;
-	}
-
-	.productList .list .item .pictrue image {
-		width: 100%;
-		height: 100%;
-		border-radius: 20rpx 20rpx 0 0;
-	}
-
-	.productList .list .item .pictrue image.on {
-		border-radius: 6rpx;
-	}
-
-	.productList .list .item .text {
-		padding: 20rpx 17rpx 26rpx 17rpx;
-		font-size: 30rpx;
-		color: #222;
-	}
-
-	.productList .list .item .text.on {
-		width: 508rpx;
-		padding: 0 0 0 22rpx;
-	}
-
-	.productList .list .item .text .money {
-		font-size: 22rpx;
-		margin-top: 8rpx;
-	}
-
-	.productList .list .item .text .money.on {
-		margin-top: 50rpx;
-	}
-
-	.productList .list .item .text .money .num {
-		font-size: 34rpx;
-	}
-
-	.productList .list .item .text .vip {
-		font-size: 22rpx;
-		margin-top: 7rpx;
-
-		.sales {
-			color: #aaa;
-			width: 100%;
-			display: flex;
-			justify-content: space-between;
-
-			.exchange {
-				border: 1px solid var(--view-theme);
-				border-radius: 20rpx;
-				padding: 0 12rpx;
-				color: var(--view-theme);
-			}
-		}
-	}
-
-	.productList .list .item .text .vip.on {
-		margin-top: 12rpx;
-	}
-
-	.productList .list .item .text .vip .vip-money {
-		font-size: 24rpx;
-		color: #282828;
-		font-weight: bold;
-	}
-
-	.productList .list .item .text .vip .vip-money image {
-		width: 46rpx;
-		height: 21rpx;
-		margin-left: 4rpx;
-	}
-
-	.noCommodity {
-		background-color: #fff;
-		padding-bottom: 30rpx;
-		.emptyBox{
-			text-align: center;
-			padding-top: 20rpx;
-			.tips{
-				color: #aaa;
-				font-size: 26rpx;
-			}
-			image {
-				width: 414rpx;
-				height: 304rpx;
-			}
-		}
-	}
+<template>
+	<view :style="colorStyle">
+		<view class='productList'>
+			<view class='search bg-color acea-row row-between-wrapper'>
+				<view class='input acea-row row-between-wrapper'><text class='iconfont icon-sousuo'></text>
+					<input :placeholder='$t(`搜索商品名称`)' placeholder-class='placeholder' confirm-type='search'
+						name="search" :value='where.store_name' @confirm="searchSubmit"></input>
+				</view>
+				<view class='iconfont' :class='is_switch==true?"icon-pailie":"icon-tupianpailie"' @click='Changswitch'>
+				</view>
+			</view>
+			<view class='nav acea-row row-middle'>
+				<view class='item line1' :class='title ? "font-num":""' @click='set_where(1)'>{{$t(`默认`)}}</view>
+				<view class='item' @click='set_where(2)'>
+					{{$t(`积分`)}}
+					<image v-if="price==1" src='../../static/images/up.png'></image>
+					<image v-else-if="price==2" src='../../static/images/down.png'></image>
+					<image v-else src='../../static/images/horn.png'></image>
+				</view>
+				<view class='item' @click='set_where(3)'>
+					{{$t(`销量`)}}
+					<image v-if="stock==1" src='../../static/images/up.png'></image>
+					<image v-else-if="stock==2" src='../../static/images/down.png'></image>
+					<image v-else src='../../static/images/horn.png'></image>
+				</view>
+			</view>
+			<view class='list acea-row row-between-wrapper' :class='is_switch==true?"":"on"'>
+				<view class='item' :class='is_switch==true?"":"on"' hover-class='none'
+					v-for="(item,index) in productList" :key="index" @click="godDetail(item)">
+					<view class='pictrue' :class='is_switch==true?"":"on"'>
+						<image :src='item.image' :class='is_switch==true?"":"on"'></image>
+					</view>
+					<view class='text' :class='is_switch==true?"":"on"'>
+						<view class='name line1'>{{item.title}}</view>
+						<view class='money font-color' :class='is_switch==true?"":"on"'><text
+								class='num'>{{item.price}}{{$t(`积分`)}}</text></view>
+						<view class='vip acea-row row-between-wrapper' :class='is_switch==true?"":"on"'>
+							<view class='vip-money' v-if="item.vip_price && item.vip_price > 0">{{item.vip_price}}
+								{{$t(`积分`)}}
+								<image src='../../static/images/vip.png'></image>
+							</view>
+							<view class="sales">
+								<view class="">
+									{{item.sales}}{{$t(`人兑换`)}}
+								</view>
+								<view class="exchange">{{$t(`兑换`)}}</view>
+							</view>
+						</view>
+					</view>
+				</view>
+				<view class='loadingicon acea-row row-center-wrapper' v-if='productList.length > 0'>
+					<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
+				</view>
+			</view>
+		</view>
+		<view class='noCommodity' v-if="productList.length==0 && where.page > 1">
+			<view class='emptyBox'>
+				<image :src="imgHost + '/statics/images/no-thing.png'"></image>
+			</view>
+			<recommend :hostProduct="hostProduct"></recommend>
+		</view>
+		<!-- #ifndef MP -->
+		<home></home>
+		<!-- #endif -->
+	</view>
+</template>
+
+<script>
+	import home from '@/components/home';
+	import {
+		getProductHot
+	} from '@/api/store.js';
+	import {
+		getStoreIntegralList
+	} from '@/api/activity.js';
+	import recommend from '@/components/recommend';
+	import {
+		mapGetters
+	} from "vuex";
+	import {
+		goShopDetail
+	} from '@/libs/order.js'
+	import colors from "@/mixins/color";
+	import {
+		HTTP_REQUEST_URL
+	} from '@/config/app';
+	export default {
+		computed: mapGetters(['uid']),
+		components: {
+			recommend,
+			home
+		},
+		mixins: [colors],
+		data() {
+			return {
+				imgHost: HTTP_REQUEST_URL,
+				productList: [],
+				is_switch: true,
+				where: {
+					store_name: '',
+					priceOrder: '',
+					salesOrder: '',
+					page: 1,
+					limit: 20,
+				},
+				price: 0,
+				stock: 0,
+				nows: false,
+				loadend: false,
+				loading: false,
+				loadTitle: this.$t(`加载更多`),
+				title: '',
+				hostProduct: [],
+				hotPage: 1,
+				hotLimit: 10,
+				hotScroll: false
+			};
+		},
+		// 滚动监听
+		onPageScroll(e) {
+			// 传入scrollTop值并触发所有easy-loadimage组件下的滚动监听事件
+			uni.$emit('scroll');
+		},
+		onLoad: function(options) {
+			this.where.cid = options.cid || 0;
+			this.$set(this.where, 'sid', options.sid || 0);
+			this.title = options.title || '';
+			this.$set(this.where, 'store_name', options.searchValue || '');
+			this.get_product_list();
+			this.get_host_product();
+		},
+
+		methods: {
+			// 去详情页
+			godDetail(item) {
+				goShopDetail(item, this.uid).then(res => {
+					uni.navigateTo({
+						url: `/pages/points_mall/integral_goods_details?id=${item.id}`
+					})
+				})
+			},
+			Changswitch: function() {
+				let that = this;
+				that.is_switch = !that.is_switch
+			},
+			searchSubmit: function(e) {
+				let that = this;
+				that.$set(that.where, 'store_name', e.detail.value);
+				that.loadend = false;
+				that.$set(that.where, 'page', 1)
+				this.get_product_list(true);
+			},
+			/**
+			 * 获取我的推荐
+			 */
+			get_host_product: function() {
+				let that = this;
+				if (that.hotScroll) return
+				getProductHot(
+					that.hotPage,
+					that.hotLimit,
+				).then(res => {
+					that.hotPage++
+					that.hotScroll = res.data.length < that.hotLimit
+					that.hostProduct = that.hostProduct.concat(res.data)
+					// that.$set(that, 'hostProduct', res.data)
+				});
+			},
+			//点击事件处理
+			set_where: function(e) {
+				switch (e) {
+					case 1:
+						this.where = {
+							store_name: '',
+							priceOrder: '',
+							salesOrder: '',
+							page: 1,
+							limit: 20,
+						}
+						this.price = 0
+						this.stock = 0
+						break;
+					case 2:
+						if (this.price == 0) this.price = 1;
+						else if (this.price == 1) this.price = 2;
+						else if (this.price == 2) this.price = 0;
+						this.stock = 0;
+						break;
+					case 3:
+						if (this.stock == 0) this.stock = 1;
+						else if (this.stock == 1) this.stock = 2;
+						else if (this.stock == 2) this.stock = 0;
+						this.price = 0
+						break;
+					case 4:
+						this.nows = !this.nows;
+						break;
+				}
+				this.loadend = false;
+				this.$set(this.where, 'page', 1);
+				this.get_product_list(true);
+			},
+			//设置where条件
+			setWhere: function() {
+				if (this.price == 0) this.where.priceOrder = '';
+				else if (this.price == 1) this.where.priceOrder = 'asc';
+				else if (this.price == 2) this.where.priceOrder = 'desc';
+				if (this.stock == 0) this.where.salesOrder = '';
+				else if (this.stock == 1) this.where.salesOrder = 'asc';
+				else if (this.stock == 2) this.where.salesOrder = 'desc';
+				this.where.news = this.nows ? 1 : 0;
+			},
+			//查找产品
+			get_product_list: function(isPage) {
+				let that = this;
+				that.setWhere();
+				if (that.loadend) return;
+				if (that.loading) return;
+				if (isPage === true) that.$set(that, 'productList', []);
+				that.loading = true;
+				that.loadTitle = '';
+				getStoreIntegralList(that.where).then(res => {
+					let list = res.data;
+					let productList = that.$util.SplitArray(list, that.productList);
+					let loadend = list.length < that.where.limit;
+					that.loadend = loadend;
+					that.loading = false;
+					that.loadTitle = loadend ? that.$t(`我也是有底线的`) : that.$t(`加载更多`);
+					that.$set(that, 'productList', productList);
+					that.$set(that.where, 'page', that.where.page + 1);
+				}).catch(err => {
+					that.loading = false;
+					that.loadTitle = that.$t(`加载更多`);
+				});
+			},
+		},
+		onPullDownRefresh() {
+
+		},
+		onReachBottom() {
+			if (this.productList.length > 0) {
+				this.get_product_list();
+			} else {
+				this.get_host_product();
+			}
+
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	.productList .search {
+		width: 100%;
+		height: 86rpx;
+		padding-left: 23rpx;
+		box-sizing: border-box;
+		position: fixed;
+		left: 0;
+		top: 0;
+		z-index: 9;
+	}
+
+	.productList .search .input {
+		width: 640rpx;
+		height: 60rpx;
+		background-color: #fff;
+		border-radius: 50rpx;
+		padding: 0 20rpx;
+		box-sizing: border-box;
+	}
+
+	.productList .search .input input {
+		width: 548rpx;
+		height: 100%;
+		font-size: 26rpx;
+	}
+
+	.productList .search .input .placeholder {
+		color: #999;
+	}
+
+	.productList .search .input .iconfont {
+		font-size: 35rpx;
+		color: #555;
+	}
+
+	.productList .search .icon-pailie,
+	.productList .search .icon-tupianpailie {
+		color: #fff;
+		width: 62rpx;
+		font-size: 40rpx;
+		height: 86rpx;
+		line-height: 86rpx;
+	}
+
+	.productList .nav {
+		height: 86rpx;
+		color: #454545;
+		position: fixed;
+		left: 0;
+		width: 100%;
+		font-size: 28rpx;
+		background-color: #fff;
+		margin-top: 86rpx;
+		top: 0;
+		z-index: 9;
+	}
+
+	.productList .nav .item {
+		width: 33%;
+		text-align: center;
+	}
+
+	.productList .nav .item.font-color {}
+
+	.productList .nav .item image {
+		width: 15rpx;
+		height: 19rpx;
+		margin-left: 10rpx;
+	}
+
+	.productList .list {
+		padding: 0 20rpx;
+		margin-top: 172rpx;
+	}
+
+	.productList .list.on {
+		background-color: #fff;
+		border-top: 1px solid #f6f6f6;
+	}
+
+	.productList .list .item {
+		width: 345rpx;
+		margin-top: 20rpx;
+		background-color: #fff;
+		border-radius: 20rpx;
+	}
+
+	.productList .list .item.on {
+		width: 100%;
+		display: flex;
+		border-bottom: 1rpx solid #f6f6f6;
+		padding: 30rpx 0;
+		margin: 0;
+	}
+
+	.productList .list .item .pictrue {
+		position: relative;
+		width: 100%;
+		height: 345rpx;
+	}
+
+	.productList .list .item .pictrue.on {
+		width: 180rpx;
+		height: 180rpx;
+	}
+
+	.productList .list .item .pictrue image {
+		width: 100%;
+		height: 100%;
+		border-radius: 20rpx 20rpx 0 0;
+	}
+
+	.productList .list .item .pictrue image.on {
+		border-radius: 6rpx;
+	}
+
+	.productList .list .item .text {
+		padding: 20rpx 17rpx 26rpx 17rpx;
+		font-size: 30rpx;
+		color: #222;
+	}
+
+	.productList .list .item .text.on {
+		width: 508rpx;
+		padding: 0 0 0 22rpx;
+	}
+
+	.productList .list .item .text .money {
+		font-size: 22rpx;
+		margin-top: 8rpx;
+	}
+
+	.productList .list .item .text .money.on {
+		margin-top: 50rpx;
+	}
+
+	.productList .list .item .text .money .num {
+		font-size: 34rpx;
+	}
+
+	.productList .list .item .text .vip {
+		font-size: 22rpx;
+		margin-top: 7rpx;
+
+		.sales {
+			color: #aaa;
+			width: 100%;
+			display: flex;
+			justify-content: space-between;
+
+			.exchange {
+				border: 1px solid var(--view-theme);
+				border-radius: 20rpx;
+				padding: 0 12rpx;
+				color: var(--view-theme);
+			}
+		}
+	}
+
+	.productList .list .item .text .vip.on {
+		margin-top: 12rpx;
+	}
+
+	.productList .list .item .text .vip .vip-money {
+		font-size: 24rpx;
+		color: #282828;
+		font-weight: bold;
+	}
+
+	.productList .list .item .text .vip .vip-money image {
+		width: 64rpx;
+		height: 26rpx;
+		margin-left: 4rpx;
+	}
+
+	.noCommodity {
+		background-color: #fff;
+		padding-bottom: 30rpx;
+
+		.emptyBox {
+			text-align: center;
+			padding-top: 20rpx;
+
+			.tips {
+				color: #aaa;
+				font-size: 26rpx;
+			}
+
+			image {
+				width: 414rpx;
+				height: 304rpx;
+			}
+		}
+	}
 </style>

+ 17 - 1
template/uni-app/utils/util.js

@@ -746,6 +746,22 @@ export default {
 		}
 
 		return 0
+	},
+	/*
+	* 获取当前时间
+	*/
+	getNowTime() {
+		let today = new Date();
+		let year = today.getFullYear(); // 获取当前年份
+		let month = today.getMonth() + 1; // 获取当前月份(注意:月份从 0 开始计数,所以需要加 1)
+		let day = today.getDate(); // 获取当前日(几号)
+		let hour = today.getHours(); // 获取当前小时
+		let minute = today.getMinutes(); // 获取当前分钟
+		let second = today.getSeconds(); // 获取当前秒钟
+
+		// 格式化输出当前时间
+		let nowTime = year + '/' + month + '/' + day + ' ' + hour + ':' + minute + ':' + second;
+		return nowTime
 	},
 	/**
 	 * 处理服务器扫码带进来的参数
@@ -981,4 +997,4 @@ export default {
 		},
 	}
 
-}
+}