全新UI视觉体验，移动端API优化降低重复调用，提高并发6倍，修复N多Bug

app/pages/activity/bargain/index.vue

@@ -1,20 +1,21 @@
 <template>
 	<view>
 		<block v-if="bargain.length>0">
-			<div class="bargain-record" ref="container">
-				<div class="item" v-for="(item, index) in bargain" :key="index">
+			<div class="bargain-record pad30" ref="container">
+				<div class="item borRadius14" v-for="(item, index) in bargain" :key="index">
 					<div class="picTxt acea-row row-between-wrapper">
 						<div class="pictrue">
 							<image :src="item.image" />
 						</div>
 						<div class="text acea-row row-column-around">
 							<div class="line1" style="width: 100%;">{{ item.title }}</div>
-							<count-down :justify-left="'justify-content:left'" :is-day="true" :tip-text="'倒计时 '" :day-text="' 天 '" :hour-text="' 时 '" :minute-text="' 分 '"
-							 :second-text="' 秒'" :datatime="item.datatime" v-if="item.status === 1"></count-down>
+							<count-down :justify-left="'justify-content:left'" :bgColor="bgColor" :is-day="true" :tip-text="'倒计时 '" :day-text="'天'"
+							 :hour-text="' 时 '" :minute-text="' 分 '"
+							 :second-text="' 秒 '" :datatime="item.stopTime/1000" v-if="item.status === 1"></count-down>
 							<div class="successTxt font-color-red" v-else-if="item.status === 3">砍价成功</div>
 							<div class="endTxt" v-else>活动已结束</div>
-							<div class="money font-color-red">
-								已砍至<span class="symbol">￥</span><span class="num">{{ item.residue_price }}</span>
+							<div class="money">
+								已砍至<span class="symbol font-color-red">￥</span><span class="num font-color-red">{{ item.surplusPrice }}</span>
 							</div>
 						</div>
 					</div>
@@ -23,13 +24,16 @@
 						<div class="success" v-else-if="item.status === 3">砍价成功</div>
 						<div class="end" v-else>活动已结束</div>
 						<div class="acea-row row-middle row-right">
-							<div class="bnt cancel" v-if="item.status === 1" @click="getBargainUserCancel(item.bargain_id)">
-								取消活动
+							<div class="bnt bg-color-red" v-if="item.status === 3 && !item.isOrder" @click="goConfirm(item)">
+								去付款
 							</div>
-							<div class="bnt bg-color-red" v-if="item.status === 1" @click="goDetail(item.bargain_id)">
+							<div class="bnt bg-color-red" v-if="item.status === 3 && !item.isDel && item.isOrder && !item.isPay" @click="goPay(item.surplusPrice,item.orderNo)">
+								立即付款
+							</div>
+							<div class="bnt bg-color-red" v-if="item.status === 1" @click="goDetail(item.id)">
 								继续砍价
 							</div>
-							<!-- <div class="bnt bg-color-red" v-else @click="goList">重开一个</div> -->
+							<div class="bnt bg-color-red" v-if="item.status === 2" @click="goList">重开一个</div>
 						</div>
 					</div>
 				</div>
@@ -40,6 +44,7 @@
 			<emptyPage title="暂无砍价记录～"></emptyPage>
 		</block>
 		<home></home>
+		<payment :payMode='payMode' :pay_close="pay_close" @onChangeFun='onChangeFun' :order_id="pay_order_id" :totalPrice='totalPrice'></payment>
 	</view>
 </template>
 <script>
@@ -49,44 +54,127 @@
 		getBargainUserList,
 		getBargainUserCancel
 	} from "@/api/activity";
-	import {
-		getUserInfo
-	} from '@/api/user.js';
 	import Loading from "@/components/Loading";
 	import home from '@/components/home';
+	import payment from '@/components/payment';
+	import {
+		mapGetters
+	} from "vuex";
 	export default {
 		name: "BargainRecord",
 		components: {
 			CountDown,
 			Loading,
 			emptyPage,
-			home
+			home,
+			payment
 		},
 		props: {},
+		computed: mapGetters(['isLogin', 'userInfo', 'uid']),
 		data: function() {
 			return {
+				bgColor:{
+					'bgColor': '',
+					'Color': '#E93323',
+					'width': '40rpx',
+					'timeTxtwidth': '28rpx',
+					'isDay': false
+				},
 				bargain: [],
 				status: false, //砍价列表是否获取完成 false 未完成 true 完成
 				loadingList: false, //当前接口是否请求完成 false 完成 true 未完成
 				page: 1, //页码
 				limit: 20, //数量
-				userInfo: {}
+				payMode: [{
+						name: "微信支付",
+						icon: "icon-weixinzhifu",
+						value: 'weixin',
+						title: '微信快捷支付'
+					},
+					{
+						name: "余额支付",
+						icon: "icon-yuezhifu",
+						value: 'yue',
+						title: '可用余额:',
+						number: 0
+					}
+				],
+				pay_close: false,
+				pay_order_id: '',
+				totalPrice: '0'
 			};
 		},
 		onLoad: function() {
 			this.getBargainUserList();
-			this.getUserInfo();
 			// this.$scroll(this.$refs.container, () => {
 			//   !this.loadingList && this.getBargainUserList();
 			// });
 		},
+		onShow() {
+			if (this.isLogin) {
+				this.payMode[1].number = this.userInfo.nowMoney;
+				this.$set(this, 'payMode', this.payMode);
+			} else {
+				toLogin();
+			}
+		},
 		methods: {
+			/**
+			 * 打开支付组件
+			 * 
+			 */
+			goPay(pay_price, order_id) {
+				this.$set(this, 'pay_close', true);
+				this.$set(this, 'pay_order_id', order_id);
+				this.$set(this, 'totalPrice', pay_price);
+			},
+			/**
+			 * 事件回调
+			 * 
+			 */
+			onChangeFun: function(e) {
+				let opt = e;
+				let action = opt.action || null;
+				let value = opt.value != undefined ? opt.value : null;
+				(action && this[action]) && this[action](value);
+			},
+			/**
+			 * 关闭支付组件
+			 * 
+			 */
+			payClose: function() {
+				this.pay_close = false;
+			},
+			/**
+			 * 支付成功回调
+			 * 
+			 */
+			pay_complete: function() {
+				this.status = false;
+				this.page = 1;
+				this.$set(this, 'bargain', []);
+				this.$set(this, 'pay_close', false);
+				this.getBargainUserList();
+			},
+			/**
+			 * 支付失败回调
+			 * 
+			 */
+			pay_fail: function() {
+				this.pay_close = false;
+			},
+			goConfirm: function(item) { //立即支付
+				if (this.isLogin === false) {
+					toLogin();
+				} else {
+					uni.navigateTo({
+						url: `/pages/activity/goods_bargain_details/index?id=${item.id}&startBargainUid=${this.uid}&storeBargainId=${item.bargainUserId}`
+					})
+				}
+			},
 			goDetail: function(id) {
-				// this.$router.push({
-				// 	path: "/activity/dargain_detail/" + id +'&bargain='+ userInfo.uid
-				// });
 				uni.navigateTo({
-					url: `/pages/activity/goods_bargain_details/index?id=${id}&bargain=${this.userInfo.uid}`
+					url: `/pages/activity/goods_bargain_details/index?id=${id}&startBargainUid=${this.uid}`
 				})
 			},
 			// 砍价列表
@@ -104,8 +192,8 @@
 						limit: that.limit
 					})
 					.then(res => {
-						that.status = res.data.length < that.limit;
-						that.bargain.push.apply(that.bargain, res.data);
+						that.status = res.data.list.length < that.limit;
+						that.bargain.push.apply(that.bargain, res.data.list);
 						that.page++;
 						that.loadingList = false;
 					})
@@ -133,16 +221,7 @@
 							title: res
 						})
 					});
-			},
-			/**
-			 * 获取个人用户信息
-			 */
-			getUserInfo: function() {
-				let that = this;
-				getUserInfo().then(res => {
-					that.userInfo = res.data;
-				});
-			},
+			}
 		},
 		onReachBottom() {
 			this.getBargainUserList();
@@ -150,11 +229,15 @@
 	};
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 	/*砍价记录*/
-	.bargain-record .item .picTxt .text .time .styleAll {
-		color: #fc4141;
-		font-size:24rpx;
+	.bargain-record .item .picTxt .text .time {
+		height: 36rpx;
+		line-height: 36rpx;
+		.styleAll {
+			color: #fc4141;
+			font-size:24rpx;
+		}
 	}
 	.bargain-record .item .picTxt .text .time .red {
 		color: #999;
@@ -162,13 +245,13 @@
 	}
 	.bargain-record .item {
 		background-color: #fff;
-		margin-bottom: 12upx;
+		margin-top: 15rpx;
+		padding: 30rpx 24rpx 0 24rpx;
 	}
 
 	.bargain-record .item .picTxt {
-		height: 210upx;
 		border-bottom: 1px solid #f0f0f0;
-		padding: 0 30upx;
+		padding-bottom: 30rpx;
 	}
 
 	.bargain-record .item .picTxt .pictrue {
@@ -183,10 +266,10 @@
 	}
 
 	.bargain-record .item .picTxt .text {
-		width: 515upx;
+		width: 470rpx;
 		font-size: 30upx;
-		color: #282828;
-		height: 150upx;
+		color: #333333;
+		height: 160rpx;
 	}
 
 	.bargain-record .item .picTxt .text .time {
@@ -205,6 +288,7 @@
 	}
 	.bargain-record .item .picTxt .text .money {
 		font-size: 24upx;
+		color: #999999;
 	}
 
 	.bargain-record .item .picTxt .text .money .num {
@@ -218,7 +302,6 @@
 
 	.bargain-record .item .bottom {
 		height: 100upx;
-		padding: 0 30upx;
 		font-size: 27upx;
 	}
 
@@ -231,7 +314,7 @@
 	}
 
 	.bargain-record .item .bottom .success {
-		color: #e93323;
+		color: $theme-color;
 	}
 
 	.bargain-record .item .bottom .bnt {

app/pages/activity/goods_seckill/index.vue

@@ -1,28 +1,29 @@
 <template>
 	<div>
 		<view class='flash-sale'>
+			<!-- #ifdef H5 -->
+			<view class='iconfont icon-xiangzuo' @tap='goBack' :style="'top:'+ (navH/2) +'rpx'" v-if="returnShow"></view>
+			<!-- #endif -->
 			<view class="saleBox"></view>
-			<!-- banner -->
-			<!-- <navigator :url='item.url' class='slide-navigator acea-row row-between-wrapper' hover-class='none'>
-				<image :src="item.pic" class="slide-image" lazy-load></image>
-			</navigator> -->
-			<view class="header" v-if="timeList.length">
+			<view class="header" v-if="dataList.length">
 				<swiper indicator-dots="true" autoplay="true" :circular="circular" interval="3000" duration="1500"
-				 indicator-color="rgba(255,255,255,0.6)" indicator-active-color="#fff">
-					<block v-for="(item,index) in timeList[active].slide" :key="index">
-						<swiper-item>
-							<image :src="item.sattDir" class="slide-image" lazy-load></image>
+					indicator-color="rgba(255,255,255,0.6)" indicator-active-color="#fff">
+					<block v-for="(items,index) in dataList[active].slide" :key="index">
+						<swiper-item class="borRadius14">
+							<image :src="items.sattDir" class="slide-image borRadius14" lazy-load></image>
 						</swiper-item>
 					</block>
 				</swiper>
+
 			</view>
 			<view class="seckillList acea-row row-between-wrapper">
 				<view class="priceTag">
 					<image src="/static/images/priceTag.png"></image>
 				</view>
 				<view class='timeLsit'>
-					<scroll-view class="scroll-view_x" scroll-x scroll-with-animation :scroll-left="scrollLeft" style="width:auto;overflow:hidden;height:106rpx;">
-						<block v-for="(item,index) in timeList" :key='index'>
+					<scroll-view class="scroll-view_x" scroll-x scroll-with-animation :scroll-left="scrollLeft"
+						style="width:auto;overflow:hidden;">
+						<block v-for="(item,index) in dataList" :key='index'>
 							<view @tap='settimeList(item,index)' class='item' :class="active == index?'on':''">
 								<view class='time'>{{item.time.split(',')[0]}}</view>
 								<view class="state">{{item.statusName}}</view>
@@ -31,7 +32,7 @@
 					</scroll-view>
 				</view>
 			</view>
-			<view class='list' v-if='seckillList.length>0'>
+			<view class='list pad30' v-if='seckillList.length>0'>
 				<block v-for="(item,index) in seckillList" :key='index'>
 					<view class='item acea-row row-between-wrapper' @tap='goDetails(item)'>
 						<view class='pictrue'>
@@ -39,11 +40,12 @@
 						</view>
 						<view class='text acea-row row-column-around'>
 							<view class='name line1'>{{item.title}}</view>
-							<view class='money'>￥
+							<view class='money'><text class="font-color">￥</text>
 								<text class='num font-color'>{{item.price}}</text>
 								<text class="y_money">￥{{item.otPrice}}</text>
 							</view>
-							<view class="limit">限量 <text class="limitPrice">{{item.quotaShow}} {{item.unitName}}</text></view>
+							<view class="limit">限量 <text class="limitPrice">{{item.quota}} {{item.unitName}}</text>
+							</view>
 							<view class="progress">
 								<view class='bg-reds' :style="'width:'+item.percent+'%;'"></view>
 								<view class='piece'>已抢{{item.percent}}%</view>
@@ -70,7 +72,8 @@
 		getSeckillHeaderApi,
 		getSeckillList
 	} from '../../../api/activity.js';
-	import home from '@/components/home/index.vue'
+	import home from '@/components/home/index.vue';
+	let app = getApp();
 	export default {
 		components: {
 			home
@@ -80,11 +83,10 @@
 				circular: true,
 				autoplay: true,
 				interval: 500,
-				// duration: 500,
 				topImage: '',
 				seckillList: [],
 				timeList: [],
-				active: 5,
+				active: 0,
 				scrollLeft: 0,
 				interval: 0,
 				status: 1,
@@ -96,31 +98,36 @@
 				loading: false,
 				loadend: false,
 				pageloading: false,
-				seckillHeader: []
+				dataList: [],
+				returnShow: true,
+				navH: ''
 			}
 		},
 		onLoad() {
+			var pages = getCurrentPages();
+			this.returnShow = pages.length===1?false:true;
+			// #ifdef H5
+			this.navH = app.globalData.navHeight-18;
+			// #endif
 			this.getSeckillConfig();
 		},
 		methods: {
+			goBack: function() {
+				uni.navigateBack();
+			},
 			getSeckillConfig: function() {
 				let that = this;
 				getSeckillHeaderApi().then(res => {
-					res.data.seckillTime.map(item => {
+					res.data.map(item => {
 						item.slide = JSON.parse(item.slide)
 					})
-					that.timeList = res.data.seckillTime;
-					that.active = res.data.seckillTimeIndex;
-					if (that.timeList.length) {
-						that.scrollLeft = (that.active - 1.37) * 100
-						setTimeout(function() {
-							that.loading = true
-						}, 2000);
-						that.seckillList = [],
-							that.page = 1
-						that.status = that.timeList[that.active].status
-						that.getSeckillList();
-					}
+					that.dataList = res.data;
+					that.getSeckillList();
+					that.seckillList = [];
+					that.page = 1;
+					that.status = that.dataList[that.active].status;
+					that.getSeckillList();
+
 				});
 			},
 			getSeckillList: function() {
@@ -132,7 +139,7 @@
 				if (that.loadend) return;
 				if (that.pageloading) return;
 				this.pageloading = true
-				getSeckillList(that.timeList[that.active].id, data).then(res => {
+				getSeckillList(that.dataList[that.active].id, data).then(res => {
 					var seckillList = res.data.list;
 					var loadend = seckillList.length < that.limit;
 					that.page++;
@@ -155,16 +162,16 @@
 					that.countDownHour = "00";
 				that.countDownMinute = "00";
 				that.countDownSecond = "00";
-				that.status = that.timeList[that.active].status;
+				that.status = that.dataList[that.active].status;
 				that.loadend = false;
 				that.page = 1;
 				that.seckillList = [];
 				// wxh.time(e.currentTarget.dataset.stop, that);
 				that.getSeckillList();
 			},
-			goDetails(item){
+			goDetails(item) {
 				uni.navigateTo({
-					url: '/pages/activity/goods_seckill_details/index?id=' + item.id + '&time=' + this.timeList[this.active].timeSwap + '&status=' + this.status + '&productId=' + item.productId
+					url: '/pages/activity/goods_seckill_details/index?id=' + item.id
 				})
 			}
 		},
@@ -181,22 +188,42 @@
 	page {
 		background-color: #F5F5F5 !important;
 	}
+</style>
+<style scoped lang="scss">
 
+   .icon-xiangzuo {
+		font-size: 40rpx;
+		color: #fff;
+		position: fixed;
+		left: 30rpx;
+		z-index: 99;
+		transform: translateY(-20%);
+	}
 	.flash-sale .header {
 		width: 710rpx;
-		height: 300rpx;
-		margin: -215rpx auto 0 auto;
-		border-radius: 20rpx;
+		height: 330rpx;
+		margin: -276rpx auto 0 auto;
+		border-radius: 14rpx;
+		overflow: hidden;
+		swiper{
+			height: 330rpx !important;
+			border-radius: 14rpx;
+			overflow: hidden;
+		}
 	}
 
 	.flash-sale .header image {
 		width: 100%;
 		height: 100%;
-		border-radius: 20rpx;
+		border-radius: 14rpx;
+		overflow: hidden;
+		img{
+			border-radius: 14rpx;
+		}
 	}
 
 	.flash-sale .seckillList {
-		padding: 0 20rpx;
+		padding: 25rpx;
 	}
 
 	.flash-sale .seckillList .priceTag {
@@ -210,9 +237,8 @@
 	}
 
 	.flash-sale .timeLsit {
-		width: 610rpx;
+		width: 596rpx;
 		white-space: nowrap;
-		margin: 10rpx 0;
 	}
 
 	.flash-sale .timeLsit .item {
@@ -220,10 +246,9 @@
 		font-size: 20rpx;
 		color: #666;
 		text-align: center;
-		padding: 11rpx 0;
 		box-sizing: border-box;
-		height: 96rpx;
-		margin-right: 35rpx;
+		margin-right: 30rpx;
+		width: 130rpx;
 	}
 
 	.flash-sale .timeLsit .item .time {
@@ -233,13 +258,15 @@
 	}
 
 	.flash-sale .timeLsit .item.on .time {
-		color: #E93323;
+		color: $theme-color;
 	}
 
 	.flash-sale .timeLsit .item.on .state {
-		width: 90rpx;
 		height: 30rpx;
+		line-height: 30rpx;
 		border-radius: 15rpx;
+		width: 128rpx;
+		/* padding: 0 12rpx; */
 		background: linear-gradient(90deg, rgba(252, 25, 75, 1) 0%, rgba(252, 60, 32, 1) 100%);
 		color: #fff;
 	}
@@ -269,11 +296,11 @@
 	.flash-sale .list .item {
 		height: 230rpx;
 		position: relative;
-		width: 710rpx;
+		/* width: 710rpx; */
 		margin: 0 auto 20rpx auto;
 		background-color: #fff;
-		border-radius: 20rpx;
-		padding: 0 25rpx;
+		border-radius: 14rpx;
+		padding: 25rpx 24rpx;
 	}
 
 	.flash-sale .list .item .pictrue {
@@ -290,7 +317,7 @@
 	}
 
 	.flash-sale .list .item .text {
-		width: 460rpx;
+		width: 440rpx;
 		font-size: 30rpx;
 		color: #333;
 		height: 166rpx;
@@ -302,7 +329,7 @@
 
 	.flash-sale .list .item .text .money {
 		font-size: 30rpx;
-		color: #E93323;
+		color: $theme-color;
 	}
 
 	.flash-sale .list .item .text .money .num {
@@ -330,7 +357,7 @@
 
 	.flash-sale .list .item .text .progress {
 		overflow: hidden;
-		background-color: #FFEFEF;
+		background-color: #EEEEEE;
 		width: 260rpx;
 		border-radius: 18rpx;
 		height: 18rpx;
@@ -369,7 +396,10 @@
 
 	.flash-sale .saleBox {
 		width: 100%;
-		height: 230rpx;
+		height: 298rpx;
+		/* #ifdef MP */
+		height: 300rpx;
+		/* #endif */
 		background: rgba(233, 51, 35, 1);
 		border-radius: 0 0 50rpx 50rpx;
 	}

app/pages/activity/poster-poster/index.vue

@@ -2,9 +2,6 @@
 	<view>
 		<view class='poster-poster'>
 			<view class='tip'><text class='iconfont icon-shuoming'></text>提示：点击图片即可保存至手机相册 </view>
-			<!-- <view class='pictrue'>
-				<image :src='image' mode="widthFix"></image>
-			</view> -->
 			<view class='pictrue' v-if="canvasStatus">
 				<image :src='imagePath'></image>
 			</view>