commit- m 优惠券版本

components/cm-module/coupon/tui-tabs.vue

@@ -0,0 +1,280 @@
+<template>
+	<view class="tui-tabs-view"
+		:class="[isFixed ? 'tui-tabs-fixed' : 'tui-tabs-relative', unlined ? 'tui-unlined' : '']" :style="{
+			width: tabsWidth + 'px',
+			height: height + 'rpx',
+			padding: `0 ${padding}rpx`,
+			background: backgroundColor,
+			top: isFixed ? top + 'px' : 'auto',
+			zIndex: isFixed ? zIndex : 'auto'
+		}" v-if="tabsWidth>0">
+		<view v-for="(item, index) in tabs" :key="index" class="tui-tabs-item" :style="{ width: itemWidth }"
+			@tap.stop="swichTabs(index)">
+			<view class="tui-tabs-title"
+				:class="{ 'tui-tabs-active': currentTab == index, 'tui-tabs-disabled': item.disabled }" :style="{
+					color: currentTab == index ? selectedColor : color,
+					fontSize: size + 'rpx',
+					fontWeight: bold && currentTab == index ? 'bold' : 'normal'
+				}">
+				{{ item.name }}
+				{{ item.num ? item.num : 0 }}
+			</view>
+		</view>
+		<view class="tui-tabs-slider" :style="{
+				transform: 'translateX(' + scrollLeft + 'px)',
+				width: sliderWidth + 'rpx',
+				height: sliderHeight + 'rpx',
+				borderRadius: sliderRadius,
+				bottom: bottom,
+				background: sliderBgColor,
+				marginBottom: bottom == '50%' ? '-' + sliderHeight / 2 + 'rpx' : 0
+			}"></view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'tuiTabs',
+		props: {
+			//标签页
+			tabs: {
+				type: Array,
+				default () {
+					return [];
+				}
+			},
+			//tabs宽度，不传值则默认使用windowWidth，单位px
+			width: {
+				type: Number,
+				default: 0
+			},
+			//rpx
+			height: {
+				type: Number,
+				default: 80
+			},
+			//rpx 只对左右padding起作用，上下为0
+			padding: {
+				type: Number,
+				default: 30
+			},
+			//背景色
+			backgroundColor: {
+				type: String,
+				default: '#FFFFFF'
+			},
+			//是否固定
+			isFixed: {
+				type: Boolean,
+				default: false
+			},
+			//px
+			top: {
+				type: Number,
+				// #ifndef H5
+				default: 0,
+				// #endif
+				// #ifdef H5
+				default: 44
+				// #endif
+			},
+			//是否去掉底部线条
+			unlined: {
+				type: Boolean,
+				default: false
+			},
+			//当前选项卡
+			currentTab: {
+				type: Number,
+				default: 0
+			},
+			//滑块宽度
+			sliderWidth: {
+				type: Number,
+				default: 68
+			},
+			//滑块高度
+			sliderHeight: {
+				type: Number,
+				default: 6
+			},
+			//滑块背景颜色
+			sliderBgColor: {
+				type: String,
+				default: '#5677fc'
+			},
+			sliderRadius: {
+				type: String,
+				default: '50rpx'
+			},
+			//滑块bottom
+			bottom: {
+				type: String,
+				default: '0'
+			},
+			//标签页宽度
+			itemWidth: {
+				type: String,
+				default: '25%'
+			},
+			//字体颜色
+			color: {
+				type: String,
+				default: '#666'
+			},
+			//选中后字体颜色
+			selectedColor: {
+				type: String,
+				default: '#5677fc'
+			},
+			//字体大小
+			size: {
+				type: Number,
+				default: 28
+			},
+			//选中后 是否加粗 ，未选中则无效
+			bold: {
+				type: Boolean,
+				default: false
+			},
+			//角标字体颜色
+			badgeColor: {
+				type: String,
+				default: '#fff'
+			},
+			//角标背景颜色
+			badgeBgColor: {
+				type: String,
+				default: '#F74D54'
+			},
+			zIndex: {
+				type: [Number, String],
+				default: 996
+			}
+		},
+		watch: {
+			currentTab() {
+				this.checkCor();
+			},
+			tabs() {
+				this.checkCor();
+			},
+			width(val) {
+				this.tabsWidth = val;
+				this.checkCor();
+			}
+		},
+		created() {
+			// 高度自适应
+			setTimeout(() => {
+				uni.getSystemInfo({
+					success: res => {
+						this.winWidth = res.windowWidth;
+						this.tabsWidth = this.width == 0 ? this.winWidth : this.width;
+						this.checkCor();
+					}
+				});
+			}, 0);
+		},
+		data() {
+			return {
+				winWidth: 0,
+				tabsWidth: 0,
+				scrollLeft: 0
+			};
+		},
+		methods: {
+			checkCor: function() {
+				let tabsNum = this.tabs.length;
+				let padding = (this.winWidth / 750) * this.padding;
+				let width = this.tabsWidth - padding * 2;
+				let left = (width / tabsNum - (this.winWidth / 750) * this.sliderWidth) / 2 + padding;
+				let scrollLeft = left;
+				if (this.currentTab > 0) {
+					scrollLeft = scrollLeft + (width / tabsNum) * this.currentTab;
+				}
+				this.scrollLeft = scrollLeft;
+			},
+			// 点击标题切换当前页时改变样式
+			swichTabs: function(index) {
+				let item = this.tabs[index];
+				if (item && item.disabled) return;
+				if (this.currentTab == index) {
+					return false;
+				} else {
+					this.$emit('change', {
+						index: Number(index)
+					});
+				}
+			}
+		}
+	};
+</script>
+
+<style scoped>
+	.tui-tabs-view {
+		width: 100%;
+		box-sizing: border-box;
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+	}
+
+	.tui-tabs-relative {
+		position: relative;
+	}
+
+	.tui-tabs-fixed {
+		position: fixed;
+		left: 0;
+	}
+
+	.tui-tabs-fixed::before,
+	.tui-tabs-relative::before {
+		content: '';
+		position: absolute;
+		border-bottom: 1rpx solid #eaeef1;
+		-webkit-transform: scaleY(0.5) translateZ(0);
+		transform: scaleY(0.5) translateZ(0);
+		transform-origin: 0 100%;
+		bottom: 0;
+		right: 0;
+		left: 0;
+	}
+
+	.tui-unlined::before {
+		border-bottom: 0 !important;
+	}
+
+	.tui-tabs-item {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		overflow: visible;
+	}
+
+	.tui-tabs-disabled {
+		opacity: 0.6;
+	}
+
+	.tui-tabs-title {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		position: relative;
+		z-index: 3;
+		overflow: visible;
+	}
+
+	.tui-tabs-active {
+		transition: all 0.15s ease-in-out;
+	}
+
+	.tui-tabs-slider {
+		position: absolute;
+		left: 0;
+		transition: all 0.15s ease-in-out;
+		z-index: 1;
+		transform-style: preserve-3d;
+	}
+</style>

components/cm-module/homeIndex/coupon.vue

@@ -0,0 +1,49 @@
+<template name="navbars">
+	<view>
+		<view class="coupon-content clearfix" @click="navigator('/pages/user/coupon/coupon')">
+			<image src="https://static.caimei365.com/app/img/icon/icon-coupon-banner@2x.png" mode=""></image>
+		</view>
+	</view>
+</template>
+
+<script>
+	import { mapState,mapMutations } from 'vuex'
+	export default{
+		name:"navbars",
+		data() {
+			return{
+				
+			}
+		},
+		created(){
+			
+		},
+		computed: {
+			...mapState(['hasLogin','userInfo','isWxAuthorize'])
+		},
+		methods:{
+			navigator(url){
+				if(this.hasLogin){
+					this.$api.navigateTo(url)
+				}else{
+					this.$api.navigateTo('/pages/login/login?type=0')
+				}
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.coupon-content{
+		width: 100%;
+		height: 254rpx;
+		box-sizing: border-box;
+		padding: 32rpx 24rpx 12rpx 24rpx;
+		background-color: #f7f7f7;
+		image{
+			width: 100%;
+			height: 210rpx;
+			display: block;
+		}
+	}
+</style>

components/cm-module/homeIndex/pageSpecial.vue

@@ -187,7 +187,6 @@
 		padding: 24rpx;
 		float: left;
 		background-color: #F7F7F7;
-		margin-top: 16rpx;
 		box-sizing: border-box;
 		background-color: #F7F7F7;
 		overflow: hidden;

components/cm-module/listTemplate/buyagainList.vue

@@ -25,12 +25,14 @@
 						</view>
 						<view class="list-details-price" v-if="item.actStatus==1">
 							<view class="floor-item-act">
+								<view class="coupon-tags">优惠券</view>
 								<view class="floor-tags" v-if="PromotionsFormat(item.promotions)">
 									{{item.promotions.name}}<text>:￥{{ item.price | NumFormat }}</text>
 								</view>
 								<view class="floor-tags" v-else>{{item.promotions.name}}</view>	
 							</view>
 							<view class="floor-item-act" v-if="item.actStatus ==0  &&  item.ladderPriceFlag==1">
+								<view class="coupon-tags">优惠券</view>
 								<view class="floor-tags">阶梯价格</view>	
 							</view>
 						</view>	
@@ -309,9 +311,26 @@
 			text-align: center;
 			box-sizing: border-box;
 			float: left;
+			padding: 11rpx 0;
+			.coupon-tags{
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
+				background-color: #fff1eb;
+				line-height: 28rpx;
+				color: #f94b4b;
+				text-align: center;
+				display: inline-block;
+				padding:0 10rpx;
+				font-size: $font-size-20;
+				border: 1px solid #f94b4b;
+				float: left;
+				margin-right: 12rpx;
+			}
 			.floor-tags{
-				height: 28rpx;
-				border-radius: 6rpx;
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
 				background-color: #FFFFFF;
 				line-height: 28rpx;
 				color: $color-system;
@@ -319,8 +338,8 @@
 				display: inline-block;
 				padding:0 16rpx;
 				font-size: $font-size-20;
-				margin-left: 15rpx;
 				border: 1px solid #E15616;
+				float: left;
 			}
 		}
 		.price-icon {

components/cm-module/listTemplate/classifyProductList.vue

@@ -12,17 +12,20 @@
 					<view class="list-details-price">
 						<template v-if="userIdentity == 3">
 							<view class="floor-item-act" v-if="item.actStatus==1">
+								<view class="coupon-tags">优惠券</view>
 								<view class="floor-tags" v-if="PromotionsFormat(item.promotions)">
 									{{item.promotions.name}}<text v-if="item.price1TextFlag != '1' && item.supplierId === shopId">:￥{{ item.price | NumFormat }}</text>
 								</view>
 								<view class="floor-tags" v-else>{{item.promotions.name}}</view>	
 							</view>
 							<view class="floor-item-act" v-if="item.actStatus ==0  &&  item.ladderPriceFlag==1">
+								<view class="coupon-tags">优惠券</view>
 								<view class="floor-tags">阶梯价格</view>	
 							</view>
 						</template>
 						<template v-else>
 							<view class="floor-item-act" v-if="item.actStatus==1">
+								<view class="coupon-tags">优惠券</view>
 								<view class="floor-tags" v-if="PromotionsFormat(item.promotions)">
 									{{item.promotions.name}}<text v-if="hasLogin && item.price1TextFlag != '1'">:￥{{ item.price | NumFormat }}</text>
 								</view>
@@ -329,9 +332,26 @@
 			text-align: center;
 			box-sizing: border-box;
 			float: right;
-			.floor-tags{			
-				height: 28rpx;
-				border-radius: 6rpx;
+			padding: 11rpx 0;
+			.coupon-tags{
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
+				background-color: #fff1eb;
+				line-height: 28rpx;
+				color: #f94b4b;
+				text-align: center;
+				display: inline-block;
+				padding:0 10rpx;
+				font-size: $font-size-20;
+				border: 1px solid #f94b4b;
+				float: left;
+				margin-right: 12rpx;
+			}
+			.floor-tags{
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
 				background-color: #FFFFFF;
 				line-height: 28rpx;
 				color: $color-system;
@@ -339,8 +359,8 @@
 				display: inline-block;
 				padding:0 16rpx;
 				font-size: $font-size-20;
-				margin-left: 15rpx;
 				border: 1px solid #E15616;
+				float: left;
 			}
 		}
 		.price-icon {

components/cm-module/listTemplate/commodityList.vue

@@ -12,23 +12,27 @@
 					<view class="list-details-price">
 						<template v-if="userIdentity == 3">
 							<view class="floor-item-act" v-if="item.actStatus==1">
+								<view class="coupon-tags">优惠券</view>
 								<view class="floor-tags" v-if="PromotionsFormat(item.promotions)">
 									{{item.promotions.name}}<text v-if="item.p_price_flag != '1' && item.supplierId === shopId">:￥{{ item.price | NumFormat }}</text>
 								</view>
 								<view class="floor-tags" v-else>{{item.promotions.name}}</view>	
 							</view>
 							<view class="floor-item-act" v-if="item.actStatus ==0  &&  item.ladderPriceFlag==1">
+								<view class="coupon-tags">优惠券</view>
 								<view class="floor-tags">阶梯价格</view>	
 							</view>
 						</template>
 						<template v-else>
 							<view class="floor-item-act" v-if="item.actStatus==1">
+								<view class="coupon-tags">优惠券</view>
 								<view class="floor-tags" v-if="PromotionsFormat(item.promotions)">
 									{{item.promotions.name}}<text v-if="hasLogin && item.p_price_flag != '1'">:￥{{ item.price | NumFormat }}</text>
 								</view>
 								<view class="floor-tags" v-else>{{item.promotions.name}}</view>	
 							</view>
 							<view class="floor-item-act" v-if="item.actStatus ==0  &&  item.ladderPriceFlag==1">
+								<view class="coupon-tags">优惠券</view>
 								<view class="floor-tags">阶梯价格</view>	
 							</view>
 						</template>
@@ -351,9 +355,26 @@
 			text-align: center;
 			box-sizing: border-box;
 			float: right;
+			padding: 11rpx 0;
+			.coupon-tags{
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
+				background-color: #fff1eb;
+				line-height: 28rpx;
+				color: #f94b4b;
+				text-align: center;
+				display: inline-block;
+				padding:0 10rpx;
+				font-size: $font-size-20;
+				border: 1px solid #f94b4b;
+				float: left;
+				margin-right: 12rpx;
+			}
 			.floor-tags{
-				height: 28rpx;
-				border-radius: 6rpx;
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
 				background-color: #FFFFFF;
 				line-height: 28rpx;
 				color: $color-system;
@@ -361,8 +382,8 @@
 				display: inline-block;
 				padding:0 16rpx;
 				font-size: $font-size-20;
-				margin-left: 15rpx;
 				border: 1px solid #E15616;
+				float: left;
 			}
 		}
 		.price-icon {

components/cm-module/listTemplate/immediatelyList.vue

@@ -57,12 +57,14 @@
 							</view>
 							<view class="list-details-price">
 								<view class="floor-item-act" v-if="item.actStatus==1">
+									<view class="coupon-tags">优惠券</view>
 									<view class="floor-tags" v-if="PromotionsFormat(item.promotions)">
 										{{item.promotions.name}}<text>:￥{{ item.price | NumFormat }}</text>
 									</view>
 									<view class="floor-tags" v-else>{{item.promotions.name}}</view>	
 								</view>
 								<view class="floor-item-act" v-if="item.actStatus ==0  &&  item.ladderPriceFlag==1">
+									<view class="coupon-tags">优惠券</view>
 									<view class="floor-tags">阶梯价格</view>	
 								</view>
 							</view>	
@@ -95,12 +97,14 @@
 											</view>
 											<view class="zuhe_price-larger zuhe_list_text" >
 												<view class="floor-item-act" v-if="pros.actStatus==1">
+													<view class="coupon-tags">优惠券</view>
 													<view class="floor-tags" v-if="PromotionsFormat(pros.promotions)">
 														{{pros.promotions.name}}<text>:￥{{ pros.price | NumFormat }}</text>
 													</view>
 													<view class="floor-tags" v-else>{{pros.promotions.name}}</view>	
 												</view>
 												<view class="floor-item-act" v-if="pros.actStatus ==0  &&  pros.ladderPriceFlag==1">
+													<view class="coupon-tags">优惠券</view>
 													<view class="floor-tags">阶梯价格</view>	
 												</view>
 												<view class="count">
@@ -797,9 +801,26 @@
 			text-align: center;
 			box-sizing: border-box;
 			float: left;
+			padding: 11rpx 0;
+			.coupon-tags{
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
+				background-color: #fff1eb;
+				line-height: 28rpx;
+				color: #f94b4b;
+				text-align: center;
+				display: inline-block;
+				padding:0 10rpx;
+				font-size: $font-size-20;
+				border: 1px solid #f94b4b;
+				float: left;
+				margin-right: 12rpx;
+			}
 			.floor-tags{
-				height:28rpx;
-				border-radius: 6rpx;
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
 				background-color: #FFFFFF;
 				line-height: 28rpx;
 				color: $color-system;
@@ -807,8 +828,8 @@
 				display: inline-block;
 				padding:0 16rpx;
 				font-size: $font-size-20;
-				margin-left: 15rpx;
 				border: 1px solid #E15616;
+				float: left;
 			}
 		}
 		.price-icon {

components/cm-module/listTemplate/productList.vue

@@ -28,12 +28,14 @@
 						</view>
 						<view class="list-details-price" v-if="item.actStatus==1">
 							<view class="floor-item-act">
+								<view class="coupon-tags">优惠券</view>
 								<view class="floor-tags" v-if="PromotionsFormat(item.promotions)">
 									{{item.promotions.name}}<text v-if="item.priceFlag != 1">:￥{{ item.price | NumFormat }}</text>
 								</view>
 								<view class="floor-tags" v-else>{{item.promotions.name}}</view>	
 							</view>
 							<view class="floor-item-act" v-if="item.actStatus ==0  &&  item.ladderPriceFlag==1">
+								<view class="coupon-tags">优惠券</view>
 								<view class="floor-tags">阶梯价格</view>	
 							</view>
 						</view>	
@@ -308,9 +310,26 @@
 			text-align: center;
 			box-sizing: border-box;
 			float: left;
+			padding: 11rpx 0;
+			.coupon-tags{
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
+				background-color: #fff1eb;
+				line-height: 28rpx;
+				color: #f94b4b;
+				text-align: center;
+				display: inline-block;
+				padding:0 10rpx;
+				font-size: $font-size-20;
+				border: 1px solid #f94b4b;
+				float: left;
+				margin-right: 12rpx;
+			}
 			.floor-tags{
-				height: 28rpx;
-				border-radius: 6rpx;
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
 				background-color: #FFFFFF;
 				line-height: 28rpx;
 				color: $color-system;
@@ -318,8 +337,8 @@
 				display: inline-block;
 				padding:0 16rpx;
 				font-size: $font-size-20;
-				margin-left: 15rpx;
 				border: 1px solid #E15616;
+				float: left;
 			}
 		}
 		.price-icon {

components/cm-module/pageFloorTemplate/templateA.vue

@@ -24,6 +24,7 @@
 				</view>
 				<view class="floor-item-price" v-if="item.listType == 1">
 					<view class="floor-item-act">
+						<view class="coupon-tags">优惠券</view>
 						<template v-if="userIdentity === 3">
 							<template v-if="item.product.actStatus===1">
 								<view class="floor-tags" v-if="PromotionsFormat(item.product.promotions)">
@@ -258,19 +259,35 @@
 				height: 32rpx;
 				text-align: center;
 				box-sizing: border-box;
-			}
-			.floor-tags{
-				height: 28rpx;
-				border-radius: 6rpx;
-				background-color: #FFFFFF;
-				line-height: 28rpx;
-				color: $color-system;
-				text-align: center;
-				display: inline-block;
-				padding:0 16rpx;
-				font-size: $font-size-20;
-				border: 1px solid #E15616;
-				float: left;
+				.coupon-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #fff1eb;
+					line-height: 28rpx;
+					color: #f94b4b;
+					text-align: center;
+					display: inline-block;
+					padding:0 10rpx;
+					font-size: $font-size-20;
+					border: 1px solid #f94b4b;
+					float: left;
+					margin-right: 12rpx;
+				}
+				.floor-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #FFFFFF;
+					line-height: 28rpx;
+					color: $color-system;
+					text-align: center;
+					display: inline-block;
+					padding:0 16rpx;
+					font-size: $font-size-20;
+					border: 1px solid #E15616;
+					float: left;
+				}
 			}
 			.title-none{
 				font-size: $font-size-26;

components/cm-module/pageFloorTemplate/templateB.vue

@@ -36,6 +36,7 @@
 				</view>
 				<view class="floor-item-price" v-if="item.listType == 1">
 					<view class="floor-item-act">
+						<view class="coupon-tags">优惠券</view>
 						<template v-if="userIdentity === 3">
 							<template v-if="item.product.actStatus===1">
 								<view class="floor-tags" v-if="PromotionsFormat(item.product.promotions)">
@@ -270,19 +271,35 @@
 				height: 32rpx;
 				text-align: center;
 				box-sizing: border-box;
-			}
-			.floor-tags{
-				height: 28rpx;
-				border-radius: 6rpx;
-				background-color: #FFFFFF;
-				line-height: 28rpx;
-				color: $color-system;
-				text-align: center;
-				display: inline-block;
-				padding:0 16rpx;
-				font-size: $font-size-20;
-				border: 1px solid #E15616;
-				float: left;
+				.coupon-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #fff1eb;
+					line-height: 28rpx;
+					color: #f94b4b;
+					text-align: center;
+					display: inline-block;
+					padding:0 10rpx;
+					font-size: $font-size-20;
+					border: 1px solid #f94b4b;
+					float: left;
+					margin-right: 12rpx;
+				}
+				.floor-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #FFFFFF;
+					line-height: 28rpx;
+					color: $color-system;
+					text-align: center;
+					display: inline-block;
+					padding:0 16rpx;
+					font-size: $font-size-20;
+					border: 1px solid #E15616;
+					float: left;
+				}
 			}
 			.title-none{
 				font-size: $font-size-26;

components/cm-module/pageFloorTemplate/templateC.vue

@@ -36,6 +36,7 @@
 				</view>
 				<view class="floor-item-price" v-if="item.listType == 1">
 					<view class="floor-item-act">
+						<view class="coupon-tags">优惠券</view>
 						<template v-if="userIdentity === 3">
 							<template v-if="item.product.actStatus===1">
 								<view class="floor-tags" v-if="PromotionsFormat(item.product.promotions)">
@@ -303,19 +304,35 @@
 				height: 32rpx;
 				text-align: center;
 				box-sizing: border-box;
-			}
-			.floor-tags{
-				height: 28rpx;
-				border-radius: 6rpx;
-				background-color: #FFFFFF;
-				line-height: 28rpx;
-				color: $color-system;
-				text-align: center;
-				display: inline-block;
-				padding:0 16rpx;
-				font-size: $font-size-20;
-				border: 1px solid #E15616;
-				float: left;
+				.coupon-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #fff1eb;
+					line-height: 28rpx;
+					color: #f94b4b;
+					text-align: center;
+					display: inline-block;
+					padding:0 10rpx;
+					font-size: $font-size-20;
+					border: 1px solid #f94b4b;
+					float: left;
+					margin-right: 12rpx;
+				}
+				.floor-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #FFFFFF;
+					line-height: 28rpx;
+					color: $color-system;
+					text-align: center;
+					display: inline-block;
+					padding:0 16rpx;
+					font-size: $font-size-20;
+					border: 1px solid #E15616;
+					float: left;
+				}
 			}
 			.title-none{
 				font-size: $font-size-26;

components/cm-module/pageFloorTemplate/templateD.vue

@@ -48,6 +48,7 @@
 				</view>
 				<view class="floor-item-price" v-if="item.listType == 1">
 					<view class="floor-item-act">
+						<view class="coupon-tags">优惠券</view>
 						<template v-if="userIdentity === 3">
 							<template v-if="item.product.actStatus===1">
 								<view class="floor-tags" v-if="PromotionsFormat(item.product.promotions)">
@@ -293,19 +294,35 @@
 				height: 32rpx;
 				text-align: center;
 				box-sizing: border-box;
-			}
-			.floor-tags{
-				height: 28rpx;
-				border-radius: 6rpx;
-				background-color: #FFFFFF;
-				line-height: 28rpx;
-				color: $color-system;
-				text-align: center;
-				display: inline-block;
-				padding:0 16rpx;
-				font-size: $font-size-20;
-				border: 1px solid #E15616;
-				float: left;
+				.coupon-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #fff1eb;
+					line-height: 28rpx;
+					color: #f94b4b;
+					text-align: center;
+					display: inline-block;
+					padding:0 10rpx;
+					font-size: $font-size-20;
+					border: 1px solid #f94b4b;
+					float: left;
+					margin-right: 12rpx;
+				}
+				.floor-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #FFFFFF;
+					line-height: 28rpx;
+					color: $color-system;
+					text-align: center;
+					display: inline-block;
+					padding:0 16rpx;
+					font-size: $font-size-20;
+					border: 1px solid #E15616;
+					float: left;
+				}
 			}
 			.title-none{
 				font-size: $font-size-26;

components/cm-module/pageFloorTemplate/templateE.vue

@@ -24,6 +24,7 @@
 				</view>
 				<view class="floor-item-price" v-if="item.listType == 1">
 					<view class="floor-item-act">
+						<view class="coupon-tags">优惠券</view>
 						<template v-if="userIdentity === 3">
 							<template v-if="item.product.actStatus===1">
 								<view class="floor-tags" v-if="PromotionsFormat(item.product.promotions)">
@@ -271,19 +272,35 @@
 				height: 32rpx;
 				text-align: center;
 				box-sizing: border-box;
-			}
-			.floor-tags{
-				height: 28rpx;
-				border-radius: 6rpx;
-				background-color: #FFFFFF;
-				line-height: 28rpx;
-				color: $color-system;
-				text-align: center;
-				display: inline-block;
-				padding:0 16rpx;
-				font-size: $font-size-20;
-				border: 1px solid #E15616;
-				float: left;
+				.coupon-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #fff1eb;
+					line-height: 28rpx;
+					color: #f94b4b;
+					text-align: center;
+					display: inline-block;
+					padding:0 10rpx;
+					font-size: $font-size-20;
+					border: 1px solid #f94b4b;
+					float: left;
+					margin-right: 12rpx;
+				}
+				.floor-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #FFFFFF;
+					line-height: 28rpx;
+					color: $color-system;
+					text-align: center;
+					display: inline-block;
+					padding:0 16rpx;
+					font-size: $font-size-20;
+					border: 1px solid #E15616;
+					float: left;
+				}
 			}
 			.title-none{
 				font-size: $font-size-26;

components/cm-module/pageFloorTemplate/templateF.vue

@@ -12,6 +12,7 @@
 				</view>
 				<view class="floor-item-price" v-if="item.listType == 1">
 					<view class="floor-item-act">
+						<view class="coupon-tags">优惠券</view>
 						<template v-if="userIdentity === 3">
 							<template v-if="item.product.actStatus===1">
 								<view class="floor-tags" v-if="PromotionsFormat(item.product.promotions)">
@@ -243,19 +244,35 @@
 				height: 32rpx;
 				text-align: center;
 				box-sizing: border-box;
-			}
-			.floor-tags{
-				height: 28rpx;
-				border-radius: 6rpx;
-				background-color: #FFFFFF;
-				line-height: 28rpx;
-				color: $color-system;
-				text-align: center;
-				display: inline-block;
-				padding:0 16rpx;
-				font-size: $font-size-20;
-				border: 1px solid #E15616;
-				float: left;
+				.coupon-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #fff1eb;
+					line-height: 28rpx;
+					color: #f94b4b;
+					text-align: center;
+					display: inline-block;
+					padding:0 10rpx;
+					font-size: $font-size-20;
+					border: 1px solid #f94b4b;
+					float: left;
+					margin-right: 12rpx;
+				}
+				.floor-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #FFFFFF;
+					line-height: 28rpx;
+					color: $color-system;
+					text-align: center;
+					display: inline-block;
+					padding:0 16rpx;
+					font-size: $font-size-20;
+					border: 1px solid #E15616;
+					float: left;
+				}
 			}
 			.title-none{
 				font-size: $font-size-26;

components/cm-module/pageFloorTemplate/templateG.vue

@@ -12,6 +12,7 @@
 				</view>
 				<view class="floor-item-price" v-if="item.listType == 1">
 					<view class="floor-item-act">
+						<view class="coupon-tags">优惠券</view>
 						<template v-if="userIdentity === 3">
 							<template v-if="item.product.actStatus===1">
 								<view class="floor-tags" v-if="PromotionsFormat(item.product.promotions)">
@@ -242,19 +243,35 @@
 				height: 32rpx;
 				text-align: center;
 				box-sizing: border-box;
-			}
-			.floor-tags{
-				height: 28rpx;
-				border-radius: 6rpx;
-				background-color: #FFFFFF;
-				line-height: 28rpx;
-				color: $color-system;
-				text-align: center;
-				display: inline-block;
-				padding:0 16rpx;
-				font-size: $font-size-20;
-				border: 1px solid #E15616;
-				float: left;
+				.coupon-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #fff1eb;
+					line-height: 28rpx;
+					color: #f94b4b;
+					text-align: center;
+					display: inline-block;
+					padding:0 10rpx;
+					font-size: $font-size-20;
+					border: 1px solid #f94b4b;
+					float: left;
+					margin-right: 12rpx;
+				}
+				.floor-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #FFFFFF;
+					line-height: 28rpx;
+					color: $color-system;
+					text-align: center;
+					display: inline-block;
+					padding:0 16rpx;
+					font-size: $font-size-20;
+					border: 1px solid #E15616;
+					float: left;
+				}
 			}
 			.title-none{
 				font-size: $font-size-26;

components/cm-module/pageFloorTemplate/templateI.vue

@@ -79,6 +79,7 @@
 				</view>
 				<view class="floor-item-price" v-if="item.listType == 1">
 					<view class="floor-item-act">
+						<view class="coupon-tags">优惠券</view>
 						<template v-if="userIdentity === 3">
 							<template v-if="item.product.actStatus === 1">
 								<view
@@ -392,25 +393,41 @@ export default {
 			padding: 0 20rpx;
 			box-sizing: border-box;
 		}
-		.floor-item-act {
+		.floor-item-act{
 			display: block;
 			width: 100%;
 			height: 32rpx;
 			text-align: center;
 			box-sizing: border-box;
-		}
-		.floor-tags {
-			height: 28rpx;
-			border-radius: 6rpx;
-			background-color: #ffffff;
-			line-height: 28rpx;
-			color: $color-system;
-			text-align: center;
-			display: inline-block;
-			padding: 0 16rpx;
-			font-size: $font-size-20;
-			border: 1px solid #e15616;
-			float: left;
+			.coupon-tags{
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
+				background-color: #fff1eb;
+				line-height: 28rpx;
+				color: #f94b4b;
+				text-align: center;
+				display: inline-block;
+				padding:0 10rpx;
+				font-size: $font-size-20;
+				border: 1px solid #f94b4b;
+				float: left;
+				margin-right: 12rpx;
+			}
+			.floor-tags{
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
+				background-color: #FFFFFF;
+				line-height: 28rpx;
+				color: $color-system;
+				text-align: center;
+				display: inline-block;
+				padding:0 16rpx;
+				font-size: $font-size-20;
+				border: 1px solid #E15616;
+				float: left;
+			}
 		}
 		.title-none {
 			font-size: $font-size-26;

components/cm-module/pageFloorTemplate/templateJ.vue

@@ -80,6 +80,7 @@
 				</view>
 				<view class="floor-item-price" v-if="item.listType == 1">
 					<view class="floor-item-act">
+						<view class="coupon-tags">优惠券</view>
 						<template v-if="userIdentity === 3">
 							<template v-if="item.product.actStatus === 1">
 								<view
@@ -408,25 +409,41 @@ export default {
 			padding: 0 20rpx;
 			box-sizing: border-box;
 		}
-		.floor-item-act {
+		.floor-item-act{
 			display: block;
 			width: 100%;
 			height: 32rpx;
 			text-align: center;
 			box-sizing: border-box;
-		}
-		.floor-tags {
-			height: 28rpx;
-			border-radius: 6rpx;
-			background-color: #ffffff;
-			line-height: 28rpx;
-			color: $color-system;
-			text-align: center;
-			display: inline-block;
-			padding: 0 16rpx;
-			font-size: $font-size-20;
-			border: 1px solid #e15616;
-			float: left;
+			.coupon-tags{
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
+				background-color: #fff1eb;
+				line-height: 28rpx;
+				color: #f94b4b;
+				text-align: center;
+				display: inline-block;
+				padding:0 10rpx;
+				font-size: $font-size-20;
+				border: 1px solid #f94b4b;
+				float: left;
+				margin-right: 12rpx;
+			}
+			.floor-tags{
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
+				background-color: #FFFFFF;
+				line-height: 28rpx;
+				color: $color-system;
+				text-align: center;
+				display: inline-block;
+				padding:0 16rpx;
+				font-size: $font-size-20;
+				border: 1px solid #E15616;
+				float: left;
+			}
 		}
 		.title-none {
 			font-size: $font-size-26;

components/cm-module/pageFloorTemplate/templateK.vue

@@ -119,6 +119,7 @@
 				</view>
 				<view class="floor-item-price" v-if="item.listType == 1">
 					<view class="floor-item-act">
+						<view class="coupon-tags">优惠券</view>
 						<template v-if="userIdentity === 3">
 							<template v-if="item.product.actStatus === 1">
 								<view
@@ -461,25 +462,41 @@ export default {
 			padding: 0 20rpx;
 			box-sizing: border-box;
 		}
-		.floor-item-act {
+		.floor-item-act{
 			display: block;
 			width: 100%;
 			height: 32rpx;
 			text-align: center;
 			box-sizing: border-box;
-		}
-		.floor-tags {
-			height: 28rpx;
-			border-radius: 6rpx;
-			background-color: #ffffff;
-			line-height: 28rpx;
-			color: $color-system;
-			text-align: center;
-			display: inline-block;
-			padding: 0 16rpx;
-			font-size: $font-size-20;
-			border: 1px solid #e15616;
-			float: left;
+			.coupon-tags{
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
+				background-color: #fff1eb;
+				line-height: 28rpx;
+				color: #f94b4b;
+				text-align: center;
+				display: inline-block;
+				padding:0 10rpx;
+				font-size: $font-size-20;
+				border: 1px solid #f94b4b;
+				float: left;
+				margin-right: 12rpx;
+			}
+			.floor-tags{
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
+				background-color: #FFFFFF;
+				line-height: 28rpx;
+				color: $color-system;
+				text-align: center;
+				display: inline-block;
+				padding:0 16rpx;
+				font-size: $font-size-20;
+				border: 1px solid #E15616;
+				float: left;
+			}
 		}
 		.title-none {
 			font-size: $font-size-26;

components/cm-module/pageTemplate/templateA.vue

@@ -24,6 +24,7 @@
 				</view>
 				<view class="floor-item-price" v-if="item.listType == 1">
 					<view class="floor-item-act">
+						<view class="coupon-tags">优惠券</view>
 						<template v-if="userIdentity === 3">
 							<template v-if="item.product.actStatus===1">
 								<view class="floor-tags" v-if="PromotionsFormat(item.product.promotions)">
@@ -258,19 +259,35 @@
 				height: 32rpx;
 				text-align: center;
 				box-sizing: border-box;
-			}
-			.floor-tags{
-				height: 28rpx;
-				border-radius: 6rpx;
-				background-color: #FFFFFF;
-				line-height: 28rpx;
-				color: $color-system;
-				text-align: center;
-				display: inline-block;
-				padding:0 16rpx;
-				font-size: $font-size-20;
-				border: 1px solid #E15616;
-				float: left;
+				.coupon-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #fff1eb;
+					line-height: 28rpx;
+					color: #f94b4b;
+					text-align: center;
+					display: inline-block;
+					padding:0 10rpx;
+					font-size: $font-size-20;
+					border: 1px solid #f94b4b;
+					float: left;
+					margin-right: 12rpx;
+				}
+				.floor-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #FFFFFF;
+					line-height: 28rpx;
+					color: $color-system;
+					text-align: center;
+					display: inline-block;
+					padding:0 16rpx;
+					font-size: $font-size-20;
+					border: 1px solid #E15616;
+					float: left;
+				}
 			}
 			.title-none{
 				font-size: $font-size-26;

components/cm-module/pageTemplate/templateB.vue

@@ -36,6 +36,7 @@
 				</view>
 				<view class="floor-item-price" v-if="item.listType == 1">
 					<view class="floor-item-act">
+						<view class="coupon-tags">优惠券</view>
 						<template v-if="userIdentity === 3">
 							<template v-if="item.product.actStatus===1">
 								<view class="floor-tags" v-if="PromotionsFormat(item.product.promotions)">
@@ -270,19 +271,35 @@
 				height: 32rpx;
 				text-align: center;
 				box-sizing: border-box;
-			}
-			.floor-tags{
-				height: 28rpx;
-				border-radius: 6rpx;
-				background-color: #FFFFFF;
-				line-height: 28rpx;
-				color: $color-system;
-				text-align: center;
-				display: inline-block;
-				padding:0 16rpx;
-				font-size: $font-size-20;
-				border: 1px solid #E15616;
-				float: left;
+				.coupon-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #fff1eb;
+					line-height: 28rpx;
+					color: #f94b4b;
+					text-align: center;
+					display: inline-block;
+					padding:0 10rpx;
+					font-size: $font-size-20;
+					border: 1px solid #f94b4b;
+					float: left;
+					margin-right: 12rpx;
+				}
+				.floor-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #FFFFFF;
+					line-height: 28rpx;
+					color: $color-system;
+					text-align: center;
+					display: inline-block;
+					padding:0 16rpx;
+					font-size: $font-size-20;
+					border: 1px solid #E15616;
+					float: left;
+				}
 			}
 			.title-none{
 				font-size: $font-size-26;

components/cm-module/pageTemplate/templateC.vue

@@ -36,6 +36,7 @@
 				</view>
 				<view class="floor-item-price" v-if="item.listType == 1">
 					<view class="floor-item-act">
+						<view class="coupon-tags">优惠券</view>
 						<template v-if="userIdentity === 3">
 							<template v-if="item.product.actStatus===1">
 								<view class="floor-tags" v-if="PromotionsFormat(item.product.promotions)">
@@ -303,19 +304,35 @@
 				height: 32rpx;
 				text-align: center;
 				box-sizing: border-box;
-			}
-			.floor-tags{
-				height: 28rpx;
-				border-radius: 6rpx;
-				background-color: #FFFFFF;
-				line-height: 28rpx;
-				color: $color-system;
-				text-align: center;
-				display: inline-block;
-				padding:0 16rpx;
-				font-size: $font-size-20;
-				border: 1px solid #E15616;
-				float: left;
+				.coupon-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #fff1eb;
+					line-height: 28rpx;
+					color: #f94b4b;
+					text-align: center;
+					display: inline-block;
+					padding:0 10rpx;
+					font-size: $font-size-20;
+					border: 1px solid #f94b4b;
+					float: left;
+					margin-right: 12rpx;
+				}
+				.floor-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #FFFFFF;
+					line-height: 28rpx;
+					color: $color-system;
+					text-align: center;
+					display: inline-block;
+					padding:0 16rpx;
+					font-size: $font-size-20;
+					border: 1px solid #E15616;
+					float: left;
+				}
 			}
 			.title-none{
 				font-size: $font-size-26;

components/cm-module/pageTemplate/templateD.vue

@@ -48,6 +48,7 @@
 				</view>
 				<view class="floor-item-price" v-if="item.listType == 1">
 					<view class="floor-item-act">
+						<view class="coupon-tags">优惠券</view>
 						<template v-if="userIdentity === 3">
 							<template v-if="item.product.actStatus===1">
 								<view class="floor-tags" v-if="PromotionsFormat(item.product.promotions)">
@@ -293,19 +294,35 @@
 				height: 32rpx;
 				text-align: center;
 				box-sizing: border-box;
-			}
-			.floor-tags{
-				height: 28rpx;
-				border-radius: 6rpx;
-				background-color: #FFFFFF;
-				line-height: 28rpx;
-				color: $color-system;
-				text-align: center;
-				display: inline-block;
-				padding:0 16rpx;
-				font-size: $font-size-20;
-				border: 1px solid #E15616;
-				float: left;
+				.coupon-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #fff1eb;
+					line-height: 28rpx;
+					color: #f94b4b;
+					text-align: center;
+					display: inline-block;
+					padding:0 10rpx;
+					font-size: $font-size-20;
+					border: 1px solid #f94b4b;
+					float: left;
+					margin-right: 12rpx;
+				}
+				.floor-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #FFFFFF;
+					line-height: 28rpx;
+					color: $color-system;
+					text-align: center;
+					display: inline-block;
+					padding:0 16rpx;
+					font-size: $font-size-20;
+					border: 1px solid #E15616;
+					float: left;
+				}
 			}
 			.title-none{
 				font-size: $font-size-26;

components/cm-module/pageTemplate/templateE.vue

@@ -24,6 +24,7 @@
 				</view>
 				<view class="floor-item-price" v-if="item.listType == 1">
 					<view class="floor-item-act">
+						<view class="coupon-tags">优惠券</view>
 						<template v-if="userIdentity === 3">
 							<template v-if="item.product.actStatus===1">
 								<view class="floor-tags" v-if="PromotionsFormat(item.product.promotions)">
@@ -271,19 +272,35 @@
 				height: 32rpx;
 				text-align: center;
 				box-sizing: border-box;
-			}
-			.floor-tags{
-				height: 28rpx;
-				border-radius: 6rpx;
-				background-color: #FFFFFF;
-				line-height: 28rpx;
-				color: $color-system;
-				text-align: center;
-				display: inline-block;
-				padding:0 16rpx;
-				font-size: $font-size-20;
-				border: 1px solid #E15616;
-				float: left;
+				.coupon-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #fff1eb;
+					line-height: 28rpx;
+					color: #f94b4b;
+					text-align: center;
+					display: inline-block;
+					padding:0 10rpx;
+					font-size: $font-size-20;
+					border: 1px solid #f94b4b;
+					float: left;
+					margin-right: 12rpx;
+				}
+				.floor-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #FFFFFF;
+					line-height: 28rpx;
+					color: $color-system;
+					text-align: center;
+					display: inline-block;
+					padding:0 16rpx;
+					font-size: $font-size-20;
+					border: 1px solid #E15616;
+					float: left;
+				}
 			}
 			.title-none{
 				font-size: $font-size-26;

components/cm-module/pageTemplate/templateF.vue

@@ -12,6 +12,7 @@
 				</view>
 				<view class="floor-item-price" v-if="item.listType == 1">
 					<view class="floor-item-act">
+						<view class="coupon-tags">优惠券</view>
 						<template v-if="userIdentity === 3">
 							<template v-if="item.product.actStatus===1">
 								<view class="floor-tags" v-if="PromotionsFormat(item.product.promotions)">
@@ -289,19 +290,35 @@
 				height: 32rpx;
 				text-align: center;
 				box-sizing: border-box;
-			}
-			.floor-tags{
-				height: 28rpx;
-				border-radius: 6rpx;
-				background-color: #FFFFFF;
-				line-height: 28rpx;
-				color: $color-system;
-				text-align: center;
-				display: inline-block;
-				padding:0 16rpx;
-				font-size: $font-size-20;
-				border: 1px solid #E15616;
-				float: left;
+				.coupon-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #fff1eb;
+					line-height: 28rpx;
+					color: #f94b4b;
+					text-align: center;
+					display: inline-block;
+					padding:0 10rpx;
+					font-size: $font-size-20;
+					border: 1px solid #f94b4b;
+					float: left;
+					margin-right: 12rpx;
+				}
+				.floor-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #FFFFFF;
+					line-height: 28rpx;
+					color: $color-system;
+					text-align: center;
+					display: inline-block;
+					padding:0 16rpx;
+					font-size: $font-size-20;
+					border: 1px solid #E15616;
+					float: left;
+				}
 			}
 			.title-none{
 				font-size: $font-size-26;

components/cm-module/pageTemplate/templateG.vue

@@ -12,6 +12,7 @@
 				</view>
 				<view class="floor-item-price" v-if="item.listType == 1">
 					<view class="floor-item-act">
+						<view class="coupon-tags">优惠券</view>
 						<template v-if="userIdentity === 3">
 							<template v-if="item.product.actStatus===1">
 								<view class="floor-tags" v-if="PromotionsFormat(item.product.promotions)">
@@ -244,19 +245,35 @@
 				height: 32rpx;
 				text-align: center;
 				box-sizing: border-box;
-			}
-			.floor-tags{
-				height: 28rpx;
-				border-radius: 6rpx;
-				background-color: #FFFFFF;
-				line-height: 28rpx;
-				color: $color-system;
-				text-align: center;
-				display: inline-block;
-				padding:0 16rpx;
-				font-size: $font-size-20;
-				border: 1px solid #E15616;
-				float: left;
+				.coupon-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #fff1eb;
+					line-height: 28rpx;
+					color: #f94b4b;
+					text-align: center;
+					display: inline-block;
+					padding:0 10rpx;
+					font-size: $font-size-20;
+					border: 1px solid #f94b4b;
+					float: left;
+					margin-right: 12rpx;
+				}
+				.floor-tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #FFFFFF;
+					line-height: 28rpx;
+					color: $color-system;
+					text-align: center;
+					display: inline-block;
+					padding:0 16rpx;
+					font-size: $font-size-20;
+					border: 1px solid #E15616;
+					float: left;
+				}
 			}
 			.title-none{
 				font-size: $font-size-26;

components/cm-module/pageTemplate/templateH.vue

@@ -15,6 +15,7 @@
 							</view>
 							<view class="floor-item-price" v-if="item.listType == 1">
 								<view class="floor-item-act">
+									<view class="coupon-tags">优惠券</view>
 									<template v-if="userIdentity === 3">
 										<template v-if="item.product.actStatus===1">
 											<view class="floor-tags" v-if="PromotionsFormat(item.product.promotions)">
@@ -281,19 +282,35 @@
 						height: 32rpx;
 						text-align: center;
 						box-sizing: border-box;
-					}
-					.floor-tags{
-						height: 28rpx;
-						border-radius: 6rpx;
-						background-color: #FFFFFF;
-						line-height: 28rpx;
-						color: $color-system;
-						text-align: center;
-						display: inline-block;
-						padding:0 16rpx;
-						font-size: $font-size-20;
-						border: 1px solid #E15616;
-						float: left;
+						.coupon-tags{
+							height: 32rpx;
+							box-sizing: border-box;
+							border-radius: 8rpx;
+							background-color: #fff1eb;
+							line-height: 28rpx;
+							color: #f94b4b;
+							text-align: center;
+							display: inline-block;
+							padding:0 10rpx;
+							font-size: $font-size-20;
+							border: 1px solid #f94b4b;
+							float: left;
+							margin-right: 12rpx;
+						}
+						.floor-tags{
+							height: 32rpx;
+							box-sizing: border-box;
+							border-radius: 8rpx;
+							background-color: #FFFFFF;
+							line-height: 28rpx;
+							color: $color-system;
+							text-align: center;
+							display: inline-block;
+							padding:0 16rpx;
+							font-size: $font-size-20;
+							border: 1px solid #E15616;
+							float: left;
+						}
 					}
 					.title-none{
 						font-size: $font-size-26;

components/cm-module/pageTemplate/templateI.vue

@@ -80,6 +80,7 @@
 				</view>
 				<view class="floor-item-price" v-if="item.listType == 1">
 					<view class="floor-item-act">
+						<view class="coupon-tags">优惠券</view>
 						<template v-if="userIdentity === 3">
 							<template v-if="item.product.actStatus === 1">
 								<view
@@ -393,25 +394,41 @@ export default {
 			padding: 0 20rpx;
 			box-sizing: border-box;
 		}
-		.floor-item-act {
+		.floor-item-act{
 			display: block;
 			width: 100%;
 			height: 32rpx;
 			text-align: center;
 			box-sizing: border-box;
-		}
-		.floor-tags {
-			height: 28rpx;
-			border-radius: 6rpx;
-			background-color: #ffffff;
-			line-height: 28rpx;
-			color: $color-system;
-			text-align: center;
-			display: inline-block;
-			padding: 0 16rpx;
-			font-size: $font-size-20;
-			border: 1px solid #e15616;
-			float: left;
+			.coupon-tags{
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
+				background-color: #fff1eb;
+				line-height: 28rpx;
+				color: #f94b4b;
+				text-align: center;
+				display: inline-block;
+				padding:0 10rpx;
+				font-size: $font-size-20;
+				border: 1px solid #f94b4b;
+				float: left;
+				margin-right: 12rpx;
+			}
+			.floor-tags{
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
+				background-color: #FFFFFF;
+				line-height: 28rpx;
+				color: $color-system;
+				text-align: center;
+				display: inline-block;
+				padding:0 16rpx;
+				font-size: $font-size-20;
+				border: 1px solid #E15616;
+				float: left;
+			}
 		}
 		.title-none {
 			font-size: $font-size-26;

components/cm-module/pageTemplate/templateJ.vue

@@ -81,6 +81,7 @@
 				</view>
 				<view class="floor-item-price" v-if="item.listType == 1">
 					<view class="floor-item-act">
+						<view class="coupon-tags">优惠券</view>
 						<template v-if="userIdentity === 3">
 							<template v-if="item.product.actStatus === 1">
 								<view
@@ -409,25 +410,41 @@ export default {
 			padding: 0 20rpx;
 			box-sizing: border-box;
 		}
-		.floor-item-act {
+		.floor-item-act{
 			display: block;
 			width: 100%;
 			height: 32rpx;
 			text-align: center;
 			box-sizing: border-box;
-		}
-		.floor-tags {
-			height: 28rpx;
-			border-radius: 6rpx;
-			background-color: #ffffff;
-			line-height: 28rpx;
-			color: $color-system;
-			text-align: center;
-			display: inline-block;
-			padding: 0 16rpx;
-			font-size: $font-size-20;
-			border: 1px solid #e15616;
-			float: left;
+			.coupon-tags{
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
+				background-color: #fff1eb;
+				line-height: 28rpx;
+				color: #f94b4b;
+				text-align: center;
+				display: inline-block;
+				padding:0 10rpx;
+				font-size: $font-size-20;
+				border: 1px solid #f94b4b;
+				float: left;
+				margin-right: 12rpx;
+			}
+			.floor-tags{
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
+				background-color: #FFFFFF;
+				line-height: 28rpx;
+				color: $color-system;
+				text-align: center;
+				display: inline-block;
+				padding:0 16rpx;
+				font-size: $font-size-20;
+				border: 1px solid #E15616;
+				float: left;
+			}
 		}
 		.title-none {
 			font-size: $font-size-26;

components/cm-module/pageTemplate/templateK.vue

@@ -120,6 +120,7 @@
 				</view>
 				<view class="floor-item-price" v-if="item.listType == 1">
 					<view class="floor-item-act">
+						<view class="coupon-tags">优惠券</view>
 						<template v-if="userIdentity === 3">
 							<template v-if="item.product.actStatus === 1">
 								<view
@@ -462,25 +463,41 @@ export default {
 			padding: 0 20rpx;
 			box-sizing: border-box;
 		}
-		.floor-item-act {
+		.floor-item-act{
 			display: block;
 			width: 100%;
 			height: 32rpx;
 			text-align: center;
 			box-sizing: border-box;
-		}
-		.floor-tags {
-			height: 28rpx;
-			border-radius: 6rpx;
-			background-color: #ffffff;
-			line-height: 28rpx;
-			color: $color-system;
-			text-align: center;
-			display: inline-block;
-			padding: 0 16rpx;
-			font-size: $font-size-20;
-			border: 1px solid #e15616;
-			float: left;
+			.coupon-tags{
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
+				background-color: #fff1eb;
+				line-height: 28rpx;
+				color: #f94b4b;
+				text-align: center;
+				display: inline-block;
+				padding:0 10rpx;
+				font-size: $font-size-20;
+				border: 1px solid #f94b4b;
+				float: left;
+				margin-right: 12rpx;
+			}
+			.floor-tags{
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
+				background-color: #FFFFFF;
+				line-height: 28rpx;
+				color: $color-system;
+				text-align: center;
+				display: inline-block;
+				padding:0 16rpx;
+				font-size: $font-size-20;
+				border: 1px solid #E15616;
+				float: left;
+			}
 		}
 		.title-none {
 			font-size: $font-size-26;

components/thorui/tui-tabs/tui-tabs.vue

@@ -1,24 +1,56 @@
 <template>
-	<view class="tui-tabs-view" :class="[isFixed?'tui-tabs-fixed':'tui-tabs-relative',unlined?'tui-unlined':'']" :style="{height:height+'rpx',padding:`0 ${padding}rpx`,background:backgroundColor,top:isFixed?top+'px':'auto'}">
-		<view v-for="(item,index) in tabs" :key="index" class="tui-tabs-item" :style="{width:itemWidth}" @tap.stop="swichTabs(index)">
-			<view class="tui-tabs-title" :class="{'tui-tabs-active':currentTab==index,'tui-tabs-disabled':item.disabled}" :style="{color:currentTab==index?selectedColor:color,fontSize:size+'rpx',lineHeight:size+'rpx',fontWeight:bold && currentTab==index?'bold':'normal'}">{{item.name}}</view>
+	<view class="tui-tabs-view"
+		:class="[isFixed ? 'tui-tabs-fixed' : 'tui-tabs-relative', unlined ? 'tui-unlined' : '']" :style="{
+			width: tabsWidth + 'px',
+			height: height + 'rpx',
+			padding: `0 ${padding}rpx`,
+			background: backgroundColor,
+			top: isFixed ? top + 'px' : 'auto',
+			zIndex: isFixed ? zIndex : 'auto'
+		}" v-if="tabsWidth>0">
+		<view v-for="(item, index) in tabs" :key="index" class="tui-tabs-item" :style="{ width: itemWidth }"
+			@tap.stop="swichTabs(index)">
+			<view class="tui-tabs-title"
+				:class="{ 'tui-tabs-active': currentTab == index, 'tui-tabs-disabled': item.disabled }" :style="{
+					color: currentTab == index ? selectedColor : color,
+					fontSize: size + 'rpx',
+					fontWeight: bold && currentTab == index ? 'bold' : 'normal'
+				}">
+				{{ item.name }}
+				<view :class="[item.isDot ? 'tui-badge__dot' : 'tui-tabs__badge']"
+					:style="{ color: badgeColor, backgroundColor: badgeBgColor }" v-if="item.num || item.isDot">
+					{{ item.isDot ? '' : item.num }}
+				</view>
+			</view>
 		</view>
-		<view class="tui-tabs-slider" :style="{transform:'translateX('+scrollLeft+'px)',width:sliderWidth+'rpx',height:
-	sliderHeight+'rpx',borderRadius:sliderRadius,bottom:bottom,background:sliderBgColor,marginBottom:bottom=='50%'?('-'+sliderHeight/2+'rpx'):0}"></view>
+		<view class="tui-tabs-slider" :style="{
+				transform: 'translateX(' + scrollLeft + 'px)',
+				width: sliderWidth + 'rpx',
+				height: sliderHeight + 'rpx',
+				borderRadius: sliderRadius,
+				bottom: bottom,
+				background: sliderBgColor,
+				marginBottom: bottom == '50%' ? '-' + sliderHeight / 2 + 'rpx' : 0
+			}"></view>
 	</view>
 </template>
 
 <script>
 	export default {
-		name: "tuiTabs",
+		name: 'tuiTabs',
 		props: {
 			//标签页
 			tabs: {
 				type: Array,
 				default () {
-					return []
+					return [];
 				}
 			},
+			//tabs宽度，不传值则默认使用windowWidth，单位px
+			width: {
+				type: Number,
+				default: 0
+			},
 			//rpx
 			height: {
 				type: Number,
@@ -32,7 +64,7 @@
 			//背景色
 			backgroundColor: {
 				type: String,
-				default: "#FFFFFF"
+				default: '#FFFFFF'
 			},
 			//是否固定
 			isFixed: {
@@ -41,13 +73,11 @@
 			},
 			//px
 			top: {
-				type: Number
-					// #ifndef H5
-					,
-				default: 0
-					// #endif
-					// #ifdef H5
-					,
+				type: Number,
+				// #ifndef H5
+				default: 0,
+				// #endif
+				// #ifdef H5
 				default: 44
 				// #endif
 			},
@@ -74,31 +104,31 @@
 			//滑块背景颜色
 			sliderBgColor: {
 				type: String,
-				default: "#5677fc"
+				default: '#5677fc'
 			},
 			sliderRadius: {
 				type: String,
-				default: "50rpx"
+				default: '50rpx'
 			},
 			//滑块bottom
 			bottom: {
 				type: String,
-				default: "0"
+				default: '0'
 			},
 			//标签页宽度
 			itemWidth: {
 				type: String,
-				default: "25%"
+				default: '25%'
 			},
 			//字体颜色
 			color: {
 				type: String,
-				default: "#666"
+				default: '#666'
 			},
 			//选中后字体颜色
 			selectedColor: {
 				type: String,
-				default: "#5677fc"
+				default: '#5677fc'
 			},
 			//字体大小
 			size: {
@@ -109,6 +139,20 @@
 			bold: {
 				type: Boolean,
 				default: false
+			},
+			//角标字体颜色
+			badgeColor: {
+				type: String,
+				default: '#fff'
+			},
+			//角标背景颜色
+			badgeBgColor: {
+				type: String,
+				default: '#F74D54'
+			},
+			zIndex: {
+				type: [Number, String],
+				default: 996
 			}
 		},
 		watch: {
@@ -117,51 +161,57 @@
 			},
 			tabs() {
 				this.checkCor();
+			},
+			width(val) {
+				this.tabsWidth = val;
+				this.checkCor();
 			}
 		},
 		created() {
+			// 高度自适应
 			setTimeout(() => {
-				// 高度自适应
 				uni.getSystemInfo({
-					success: (res) => {
+					success: res => {
 						this.winWidth = res.windowWidth;
-						this.checkCor()
+						this.tabsWidth = this.width == 0 ? this.winWidth : this.width;
+						this.checkCor();
 					}
 				});
-			}, 50);
+			}, 0);
 		},
 		data() {
 			return {
 				winWidth: 0,
+				tabsWidth: 0,
 				scrollLeft: 0
 			};
 		},
 		methods: {
 			checkCor: function() {
-				let tabsNum = this.tabs.length
-				let padding = this.winWidth / 750 * this.padding
-				let width = this.winWidth - padding * 2
-				let left = (width / tabsNum - (this.winWidth / 750 * this.sliderWidth)) / 2 + padding
-				let scrollLeft = left
+				let tabsNum = this.tabs.length;
+				let padding = (this.winWidth / 750) * this.padding;
+				let width = this.tabsWidth - padding * 2;
+				let left = (width / tabsNum - (this.winWidth / 750) * this.sliderWidth) / 2 + padding;
+				let scrollLeft = left;
 				if (this.currentTab > 0) {
-					scrollLeft = scrollLeft + (width / tabsNum) * this.currentTab
+					scrollLeft = scrollLeft + (width / tabsNum) * this.currentTab;
 				}
-				this.scrollLeft = scrollLeft
+				this.scrollLeft = scrollLeft;
 			},
 			// 点击标题切换当前页时改变样式
 			swichTabs: function(index) {
-				let item = this.tabs[index]
+				let item = this.tabs[index];
 				if (item && item.disabled) return;
 				if (this.currentTab == index) {
 					return false;
 				} else {
-					this.$emit("change", {
+					this.$emit('change', {
 						index: Number(index)
-					})
+					});
 				}
 			}
 		}
-	}
+	};
 </script>
 
 <style scoped>
@@ -171,7 +221,6 @@
 		display: flex;
 		align-items: center;
 		justify-content: space-between;
-		z-index: 9999;
 	}
 
 	.tui-tabs-relative {
@@ -197,17 +246,18 @@
 	}
 
 	.tui-unlined::before {
-		border-bottom: 0 !important
+		border-bottom: 0 !important;
 	}
 
 	.tui-tabs-item {
 		display: flex;
 		align-items: center;
 		justify-content: center;
+		overflow: visible;
 	}
 
 	.tui-tabs-disabled {
-		opacity: .6;
+		opacity: 0.6;
 	}
 
 	.tui-tabs-title {
@@ -215,7 +265,8 @@
 		align-items: center;
 		justify-content: center;
 		position: relative;
-		z-index: 2;
+		z-index: 3;
+		overflow: visible;
 	}
 
 	.tui-tabs-active {
@@ -226,7 +277,35 @@
 		position: absolute;
 		left: 0;
 		transition: all 0.15s ease-in-out;
-		z-index: 0;
-		transform: translateZ(0);
+		z-index: 1;
+		transform-style: preserve-3d;
+	}
+
+	.tui-tabs__badge {
+		position: absolute;
+		font-size: 24rpx;
+		height: 32rpx;
+		min-width: 20rpx;
+		padding: 0 6rpx;
+		border-radius: 40rpx;
+		right: 0;
+		top: 0;
+		transform: translate(88%, -50%);
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		flex-shrink: 0;
+		z-index: 4;
+		font-weight: normal !important; 
+	}
+
+	.tui-badge__dot {
+		position: absolute;
+		height: 16rpx;
+		width: 16rpx;
+		border-radius: 50%;
+		right: -10rpx;
+		top: -10rpx;
+		z-index: 4;
 	}
 </style>

pages.json

@@ -363,7 +363,28 @@
 				{
 					"path": "coupon/coupon",
 					"style": {
-						"navigationBarTitleText": "优惠券"
+						"navigationBarTitleText": "优惠券",
+						"enablePullDownRefresh" : true
+					}
+				},
+				{
+					"path": "coupon/coupon-collection",
+					"style": {
+						"navigationBarTitleText": "领券中心",
+						"enablePullDownRefresh" : true
+					}
+				},
+				{
+					"path": "coupon/coupon-exchange", 
+					"style": {
+						"navigationBarTitleText": "兑换优惠券"
+					}
+				},
+				{
+					"path": "coupon/coupon-product",
+					"style": {
+						"navigationBarTitleText": "活动商品",
+						"enablePullDownRefresh" : true
 					}
 				}
 			]	

pages/goods/goods-classify.vue

@@ -53,23 +53,27 @@
 							<view class="list-details-price">
 								<template v-if="userIdentity == 3">
 									<view class="floor-item-act" v-if="item.actStatus==1">
+										<view class="coupon-tags">优惠券</view>
 										<view class="floor-tags" v-if="PromotionsFormat(item.promotions)">
 											{{item.promotions.name}}<text v-if="item.priceFlag != 1 && item.supplierId === shopId">:￥{{ item.price | NumFormat }}</text>
 										</view>
 										<view class="floor-tags" v-else>{{item.promotions.name}}</view>	
 									</view>
 									<view class="floor-item-act" v-if="item.actStatus ==0  &&  item.ladderPriceFlag==1">
+										<view class="coupon-tags">优惠券</view>
 										<view class="floor-tags">阶梯价格</view>	
 									</view>
 								</template>
 								<template v-else>
 									<view class="floor-item-act" v-if="item.actStatus==1">
+										<view class="coupon-tags">优惠券</view>
 										<view class="floor-tags" v-if="PromotionsFormat(item.promotions)">
 											{{item.promotions.name}}<text v-if="hasLogin && item.priceFlag != 1">:￥{{ item.price | NumFormat }}</text>
 										</view>
 										<view class="floor-tags" v-else>{{item.promotions.name}}</view>	
 									</view>
 									<view class="floor-item-act" v-if="item.actStatus ==0  &&  item.ladderPriceFlag==1">
+										<view class="coupon-tags">优惠券</view>
 										<view class="floor-tags">阶梯价格</view>	
 									</view>
 								</template>
@@ -629,9 +633,26 @@
 			text-align: center;
 			box-sizing: border-box;
 			float: right;
-			.floor-tags{			
-				height: 28rpx;
-				border-radius: 6rpx;
+			padding: 11rpx 0;
+			.coupon-tags{
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
+				background-color: #fff1eb;
+				line-height: 28rpx;
+				color: #f94b4b;
+				text-align: center;
+				display: inline-block;
+				padding:0 10rpx;
+				font-size: $font-size-20;
+				border: 1px solid #f94b4b;
+				float: left;
+				margin-right: 12rpx;
+			}
+			.floor-tags{
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
 				background-color: #FFFFFF;
 				line-height: 28rpx;
 				color: $color-system;
@@ -639,8 +660,8 @@
 				display: inline-block;
 				padding:0 16rpx;
 				font-size: $font-size-20;
-				margin-left: 15rpx;
 				border: 1px solid #E15616;
+				float: left;
 			}
 		}
 		.price-icon {

pages/goods/product.vue

@@ -52,7 +52,13 @@
 									</swiper-item>
 								</swiper>
 								<view class="swiper__dots-box">
-									<tui-tag padding="12rpx 24rpx" type="translucent" shape="circleLeft" size="32rpx" :scaleMultiple="0.82" originRight>{{ current + 1 }}/{{ productImage.length }}</tui-tag>
+									<tui-tag padding="12rpx 24rpx" 
+											 type="translucent" 
+											 shape="circleLeft" 
+											 size="32rpx" 
+											 :scaleMultiple="0.82" originRight>
+										{{ current + 1 }}/{{ productImage.length }}
+									</tui-tag>
 								</view>
 							</uni-swiper-dot>
 						</view>
@@ -68,7 +74,9 @@
 								</view>
 								<view class="p-title tui-skeleton-fillet">
 									<view class="mclap-tag" v-if="product.beautyActFlag == '1'">美博会</view>
-									<view class="p-title-name" :class="product.beautyActFlag == '1' ? 'indent' : ''"> {{product.name == undefined ? '' : product.name}} </view>
+									<view class="p-title-name" :class="product.beautyActFlag == '1' ? 'indent' : ''"> 
+										{{product.name == undefined ? '' : product.name}} 
+									</view>
 									<button open-type="share" class="p-title-share tui-share-position" @tap="onShare">
 										<view class=""><text class="iconfont icon-fenxiang1"></text></view>
 										<view class="">分享</view>
@@ -93,16 +101,29 @@
 						<image class="none-image" :src="productNoneImage" mode=""></image>
 						<view class="none-text">此商品已{{goodsData.disabledText}}，请浏览以下推荐商品~</view>
 					</view>
+					<!-- 参数 -->
 					<view class="product-parameter" @click="showPopup(0)" v-if="!goodsData.isNoneDisabled">
 						<text class="title">参数：</text>
 						<text class="name">品牌  起订量  分类...</text>
 						<text class="iconfont icon-xiayibu"></text>
 					</view>
+					<!-- 优惠券 -->
+					<view class="product-parameter coupon" @click="showPopup(2)">
+						<text class="title">优惠券：</text>
+						<view class="coupon">
+							<text class="tags"> 满5000减100 </text>
+							<text class="tags"> 满5000减100 </text>
+							<text class="tags"> 满5000减100 </text>
+						</view>
+						<text class="iconfont icon-xiayibu"></text>
+					</view>
+					<!-- 仪器培训方案 -->
 					<view class="product-parameter" @click="showPopup(1)" v-if='product.commodityType == 2 && product.trainingMethod'>
 						<text class="title">培训方案：</text>
 						<text class="name">{{ product.trainingMethod == 1 ? '线上培训' : '线下培训' }}</text>
 						<text class="iconfont icon-xiayibu"></text>
 					</view>
+					<!-- 供应商 -->
 					<view class="product-supplier" v-if="isNoneSupplier" @click="goSupplier">
 						<view class="logo"><img :src="shop.logo ? shop.logo :'https://static.caimei365.com/app/img/icon/icon-shoplogo.png'" alt=""></view>
 						<view class="main">
@@ -194,6 +215,60 @@
 						</view>
 					</view>	
 				</tui-bottom-popup>	
+				<!-- 优惠券 -->
+				<tui-bottom-popup :radius="true" :show="popupShow2" @close="hidePopup(2)">
+					<view class="tui-popup-box clearfix">
+						<view class="title">优惠券</view>
+						<view class="tui-popup-close" @click="hidePopup(2)">
+							<text class="iconfont icon-iconfontguanbi"></text>
+						</view>
+						<view class="tui-popup-tabs">
+							<coupon-tabs  :tabs="navbar"
+										  :currentTab="currentTab>2?0:currentTab" 
+										  @change="couponChange" 
+										  :itemWidth="(100/navbar.length)+'%'"
+										  selectedColor="#e15616" 
+										  sliderBgColor="#e15616">
+							</coupon-tabs>
+						</view>
+						<div class="tui-popup-main coupon">
+							<scroll-view class="tui-popup-scroll"  scroll-y="true">
+								<view v-for="(coupon,index) in dataList" :key="index" :id="coupon.id" class="coupon-list">
+									<view class="list-cell-le">
+										<view class="coupon-maxMoney">
+											<text class="small">￥</text>
+											{{ coupon.maxMoney }}
+										</view>
+										<view class="coupon-minMoney">
+											满{{ coupon.minMoney }}可用
+										</view>
+									</view>
+									<view class="list-cell-ri">
+										<view class="list-cell-top">
+											<view class="list-cell-type">
+												<view class="list-cell-tags">
+													<text class="tags">{{ coupon.couponType | TypeFormat }}</text>
+												</view>
+												<view class="list-cell-texts" :class="currentTab == 1 || currentTab == 2 ? 'none' : ''">
+													<text v-if="coupon.useType == 1">{{ coupon.useType | TypeFormatText }}</text>
+													<text v-if="coupon.useType == 2">{{ coupon.useType | TypeFormatText }}</text>
+													<text v-if="coupon.useType == 3">{{ coupon.useType | TypeFormatText }}{{ coupon.couponText }}的商品</text>
+												</view>
+											</view>
+											<view class="list-cell-btn">
+												<view class="icon-used">
+													<view class="icon-used-btn receive" v-if="currentTab == 0" @click="receiveCoupon(coupon)">领取</view>
+													<view class="icon-used-btn make" v-if="currentTab == 1">已领取</view>
+												</view>
+											</view>
+										</view>
+										<view class="list-cell-time">{{ coupon.couponTime }}</view>
+									</view>
+								</view>
+							</scroll-view>
+						</div>
+					</view>	
+				</tui-bottom-popup>	
 				<!-- 培训方案 -->
 				<tui-bottom-popup :radius="true" :show="popupShow1" @close="hidePopup(1)">
 					<view class="tui-popup-box clearfix">
@@ -303,6 +378,7 @@
 	import recommend from "@/components/cm-module/productDetails/recommend" //相关推荐
 	import cmParameter from "@/components/cm-module/productDetails/cm-parameter" //相关参数
 	import cmService from "@/components/cm-module/productDetails/cm-service" //服务项目
+	import couponTabs from '@/components/cm-module/coupon/tui-tabs.vue'
 	import authorize from '@/common/config/authorize.js'
 	import wxLogin from "@/common/config/wxLogin.js"
 	import { debounce } from '@/common/config/common.js'
@@ -316,7 +392,8 @@
 			cmPrice,
 			cmAttributes,
 			cmParameter,
-			cmService
+			cmService,
+			couponTabs
 		},
 		data(){
 			return{			
@@ -377,18 +454,105 @@
 				CustomBar:this.CustomBar,					// 顶部导航栏高度
 				popupShow0:false,							// 参数弹窗
 				popupShow1:false,							// 培训方案
+				popupShow2:false,							// 优惠券
 				tabSelectFlag:false,
 				sectionPropsArr: [],
 				scrollTopArray:[],
 				sectionTopRangeArr: [],
 				winHeight:'',
 				isShowButton:true,
-				isNoneSupplier:false
+				isNoneSupplier:false,
+				currentTab: 0,
+				navbar: [
+					{ name: "未领取",num:3 }, 
+					{ name: "已领取",num:4 } 
+				],
+				dataList:[
+					{
+						maxMoney:5000,
+						minMoney:1000,
+						couponType:1,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:1,
+						couponBtnType:0
+					},
+					{
+						maxMoney:2000,
+						minMoney:200,
+						couponType:2,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:2,
+						couponBtnType:0
+					},
+					{
+						maxMoney:4000,
+						minMoney:800,
+						couponType:3,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:3,
+						couponBtnType:0
+					},
+					{
+						maxMoney:6000,
+						minMoney:1000,
+						couponType:4,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:1,
+						couponBtnType:0
+					},
+					{
+						maxMoney:6000,
+						minMoney:1000,
+						couponType:5,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:2,
+						couponBtnType:0
+					}
+				],
 			}
 		},
 		computed: {
 			...mapState(['hasLogin','isWxAuthorize','identity'])
 		},
+		filters: {
+			TypeFormat:function(value) {
+				switch (value) {
+					case 1:
+						return  '活动券';
+						break;
+					case 2:
+						return  '品类券';
+						break;
+					case 3:
+						return  '店铺券';
+						break;
+					case 4:
+						return  '专享券';
+						break;
+					case 5:
+						return  '新用户券';
+						break;
+				}
+			},
+			TypeFormatText:function(value) {
+				switch (value) {
+					case 1:
+						return  '全商城商品通用';
+						break;
+					case 2:
+						return  '仅限购买仪器类商品';
+						break;
+					case 3:
+						return  '仅可购买店铺';
+						break;
+				}
+			}
+		},
 		onLoad(option) {
 			this.productId = option.id;//获取商品ID
 			this.isShareType = option.type
@@ -616,6 +780,9 @@
 					})
 				}
 			},
+			receiveCoupon(coupon){//用户领取优惠券
+				coupon.couponBtnType = 1;
+			},
 			showSpec(type) {//显示选择数量确认弹窗
 				this.isBtnType = type
 				this.specClass = 'show';
@@ -712,6 +879,9 @@
 					case 1:
 						this.popupShow1 = true
 						break;
+					case 2:
+						this.popupShow2 = true
+						break;
 				}
 			},
 			hidePopup(index){
@@ -722,6 +892,25 @@
 					case 1:
 						this.popupShow1 = false
 						break;
+					case 2:
+						this.popupShow2 = false
+						break;
+				}
+			},
+			couponChange(e) {
+				this.currentTab = e.index
+				console.log('currentTab',this.currentTab)
+				switch(this.currentTab){
+					case 0:
+						this.listClass = 'list-used'
+						break;
+					case 1:
+						this.listClass = 'list-none'
+						break;
+					case 2:
+						this.listClass = 'list-none'
+						break;
+					
 				}
 			},
 			getSectionProps() {//获取每个tab对应区域的scrollTop值
@@ -1210,8 +1399,36 @@
 		padding: 0 24rpx;
 		background-color: #FFFFFF;
 		position: relative;
-		display: flex;
 		border-bottom: 20rpx solid #F7F7F7;
+		&.coupon{
+			.title{
+				color: #f94b4b;
+			}
+			.icon-xiayibu{
+				color: #f94b4b;
+			}
+			.coupon{
+				float: right;
+				box-sizing: border-box;
+				padding: 29rpx 0;
+				padding-right: 35rpx;
+				.tags{
+					height: 32rpx;
+					box-sizing: border-box;
+					border-radius: 8rpx;
+					background-color: #fff1eb;
+					line-height: 28rpx;
+					color: #f94b4b;
+					text-align: center;
+					display: inline-block;
+					padding:0 10rpx;
+					font-size: $font-size-20;
+					border: 1px solid #f94b4b;
+					float: right;
+					margin:0 6rpx;
+				}
+			}
+		}
 		.title{
 			line-height: 90rpx;
 			display: inline-block;
@@ -1220,13 +1437,11 @@
 			color: #666666;
 		}
 		.name{
-			float: right;
 			line-height: 90rpx;
 			display: inline-block;
 			float: left;
 			font-size: $font-size-28;
 			color: $text-color;
-			float: right;
 			padding-right: 48rpx;
 			overflow: hidden;
 			text-overflow:ellipsis;
@@ -1538,7 +1753,7 @@
 		height: 174rpx;
 		box-sizing: border-box;
 		background: #FFFFFF;
-		z-index: 1000;
+		z-index: 990;
 		position: fixed;
 		opacity: 1;
 		left: 0;
@@ -1877,7 +2092,20 @@
 		position: relative;
 		box-sizing: border-box;
 		min-height: 220rpx;
-		padding:0rpx 24rpx 0 24rpx;
+		padding:24rpx 24rpx 0 24rpx;
+		.tui-popup-close{
+			width: 90rpx;
+			height: 90rpx;
+			position: absolute;
+			right: 0;
+			top: 24rpx;
+			line-height: 90rpx;
+			text-align: center;
+			color: #b2b2b2;
+			.icon-iconfontguanbi{
+				font-size: $font-size-40;
+			}
+		}
 		.title{
 			font-size: $font-size-34;
 			color: $text-color;
@@ -1886,13 +2114,134 @@
 			float: left;
 			width: 100%;
 			height: 88rpx;
+			font-weight: bold;
 		}
 		.tui-popup-main{
 			width: 100%;
 			float: left;
+			&.coupon{
+				padding-bottom: 24rpx;
+			}
 			.tui-popup-scroll{
 				width: 100%;
 				height: 500rpx;
+				.coupon-list{
+					width: 100%;
+					height: 200rpx;
+					margin-top: 24rpx;
+					box-sizing: border-box;
+					background: url(https://static.caimei365.com/app/img/icon/icon-coupon-uesb@2x.png);
+					background-size: cover;
+					.list-cell-le{
+						width: 224rpx;
+						height: 100%;
+						box-sizing: border-box;
+						padding: 37rpx 0;
+						float: left;
+						.coupon-maxMoney{
+							width: 100%;
+							height: 78rpx;
+							line-height: 78rpx;
+							font-size: 56rpx;
+							color: #FFFFFF;
+							text-align: center;
+							.small{
+								font-size: $font-size-24;
+							}
+						}
+						.coupon-minMoney{
+							width: 100%;
+							height: 33rpx;
+							line-height: 33rpx;
+							font-size: $font-size-24;
+							color: #FFFFFF;
+							text-align: center;
+						}
+					}
+					.list-cell-ri{
+						width: 478rpx;
+						height: 100%;
+						box-sizing: border-box;
+						padding: 20rpx 24rpx 0 24rpx;
+						float: right;
+						.list-cell-top{
+							width: 100%;
+							height: 121rpx;
+							float: left;
+							border-bottom: 1px solid #e1e1e1;
+							.list-cell-type{
+								width: 286rpx;
+								height: 100%;
+								float: left;
+								.list-cell-tags{
+									width: 100%;
+									height: 32rpx;
+									margin-bottom: 7rpx;
+									.tags{
+										display: inline-block;
+										padding: 0 10rpx;
+										height: 32rpx;
+										line-height: 32rpx;
+										background-color: #ffdcce;
+										color: #f94b4b;
+										font-size: $font-size-20;
+										border-radius: 8rpx;
+										text-align: center;
+										float: left;
+									}
+								}
+								.list-cell-texts{
+									width: 100%;
+									height: auto;
+									line-height:35rpx;
+									text-overflow:ellipsis;
+									display: -webkit-box;
+									word-break: break-all;
+									-webkit-box-orient: vertical;
+									-webkit-line-clamp: 2;
+									overflow: hidden;
+									font-size: 26rpx;
+									color: #333333;
+								}
+							}
+							.list-cell-btn{
+								width: 128rpx;
+								height: 100%;
+								float: right;
+								.icon-used{
+									width: 100%;
+									height: 100%;
+									box-sizing: border-box;
+									padding-top: 57rpx;
+									.icon-used-btn{
+										width: 128rpx;
+										height: 48rpx;
+										border-radius: 28rpx;
+										line-height: 48rpx;
+										font-size: $font-size-26;
+										text-align: center;
+										&.receive{
+											background-image: linear-gradient(270deg, #f94b4b 0%, #feb673 100%);;
+											color: #FFFFFF;
+										}
+										&.make{
+											border: solid 1px #f94b4b;
+											color: #f94b4b;
+										}
+									}
+								}
+							}
+						}
+						.list-cell-time{
+							width: 100%;
+							height: 58rpx;
+							line-height: 58rpx;
+							text-align: left;
+							font-size: $font-size-20;
+							color: #999999;
+						}
+					}
+				}
 				&.train{
 					height: 240rpx;
 				}

pages/tabBar/cart/cart.vue

@@ -19,6 +19,7 @@
 									<view class="floor-tags" @click.stop="clickPopupShow(item,2)">{{item.promotions.name}}</view>	
 								</view>
 								<view class="text">{{item.name}}</view> 
+								<view class="text-coupon" @click="showPopup(0)">领券</view>
 							</view>
 							<view class="productlist">
 								<view 	class="goods-pros" v-for="(pros,idx) in item.cartList" :key="idx" >
@@ -111,14 +112,15 @@
 						</view>
 	
 						<view class="sum">
-							<view class="sum-none"  v-if="reducedPrice>0">
-								<text class="money-sign">￥</text>
-								<text class="money">{{ totalOriginalPrice | NumFormat }}</text>
-								<text class="money-reduced">减<text>￥{{ reducedPrice | NumFormat}}</text></text>
-							</view>
 							<view class="sum-price" :class="reducedPrice == 0 ? 'none' : ''">
 								总价:<text class="money-sign">￥</text><text class="money">{{allPrice | NumFormat}}</text>
 							</view>
+							<view class="sum-none"  v-if="reducedPrice>0">
+								<!-- <text class="money-sign">￥</text> -->
+								<!-- <text class="money">{{ totalOriginalPrice | NumFormat }}</text> -->
+								<text class="money-reduced">共减<text>￥{{ reducedPrice | NumFormat}}</text></text>
+								<text class="money-popup" @click="showPopup(1)">优惠明细<text class="iconfont icon-xiangshangjiantou"></text></text>
+							</view>
 						</view>
 					</view>
 					<view v-if="!isshowDelbtn" class="footer-ri" >
@@ -142,6 +144,93 @@
 		<activi-popup :product="handlerPros" :popupShow="popupShow"></activi-popup>
 		<!-- 透明模态层 -->
 		<modal-layer v-if='modallayer'></modal-layer>
+		<!-- 优惠券 -->
+		<tui-bottom-popup :radius="true" :show="popupShow0" @close="hidePopup(0)">
+			<view class="tui-popup-box clearfix">
+				<view class="title">优惠券</view>
+				<view class="tui-popup-close" @click="hidePopup(0)">
+					<text class="iconfont icon-iconfontguanbi"></text>
+				</view>
+				<view class="tui-popup-tabs">
+					<coupon-tabs  :tabs="navbar"
+								  :currentTab="currentTab>2?0:currentTab" 
+								  @change="couponChange" 
+								  :itemWidth="(100/navbar.length)+'%'"
+								  selectedColor="#e15616" 
+								  sliderBgColor="#e15616">
+					</coupon-tabs>
+				</view>
+				<div class="tui-popup-main coupon">
+					<scroll-view class="tui-popup-scroll"  scroll-y="true">
+						<view v-for="(coupon,index) in dataList" :key="index" :id="coupon.id" class="coupon-list">
+							<view class="list-cell-le">
+								<view class="coupon-maxMoney">
+									<text class="small">￥</text>
+									{{ coupon.maxMoney }}
+								</view>
+								<view class="coupon-minMoney">
+									满{{ coupon.minMoney }}可用
+								</view>
+							</view>
+							<view class="list-cell-ri">
+								<view class="list-cell-top">
+									<view class="list-cell-type">
+										<view class="list-cell-tags">
+											<text class="tags">{{ coupon.couponType | TypeFormat }}</text>
+										</view>
+										<view class="list-cell-texts" :class="currentTab == 1 || currentTab == 2 ? 'none' : ''">
+											<text v-if="coupon.useType == 1">{{ coupon.useType | TypeFormatText }}</text>
+											<text v-if="coupon.useType == 2">{{ coupon.useType | TypeFormatText }}</text>
+											<text v-if="coupon.useType == 3">{{ coupon.useType | TypeFormatText }}{{ coupon.couponText }}的商品</text>
+										</view>
+									</view>
+									<view class="list-cell-btn">
+										<view class="icon-used">
+											<view class="icon-used-btn receive" v-if="currentTab == 0" @click="receiveCoupon(coupon)">领取</view>
+											<view class="icon-used-btn make" v-if="currentTab == 1">已领取</view>
+										</view>
+									</view>
+								</view>
+								<view class="list-cell-time">{{ coupon.couponTime }}</view>
+							</view>
+						</view>
+					</scroll-view>
+				</div>
+			</view>	
+		</tui-bottom-popup>	
+		<!-- 优惠明细 -->
+		<tui-bottom-popup :radius="true" :show="popupShow1" @close="hidePopup(1)">
+			<view class="tui-popup-box clearfix">
+				<view class="title">优惠明细</view>
+				<view class="tui-popup-close" @click="hidePopup(1)">
+					<text class="iconfont icon-iconfontguanbi"></text>
+				</view>
+				<div class="tui-popup-main coupon">
+					<view class="tui-popup-coupon">
+						<view class="tui-popup-h1">
+							<view class="tui-popup-text left">商品总额</view>
+							<view class="tui-popup-text right bold">￥450.00</view>
+						</view>
+						<view class="tui-popup-h1">
+							<view class="tui-popup-text left">促销满减</view>
+							<view class="tui-popup-text right bold red">￥450.00</view>
+						</view>
+						<view class="tui-popup-h1">
+							<view class="tui-popup-text left">优惠券</view>
+							<view class="tui-popup-text right bold red">￥450.00</view>
+						</view>
+						<view class="tui-popup-h1">
+							<view class="tui-popup-text left">共减</view>
+							<view class="tui-popup-text right bold red">￥450.00</view>
+						</view>
+						<view class="tui-popup-h1">
+							<view class="tui-popup-text left">总计</view>
+							<view class="tui-popup-text right bold">￥450.00</view>
+						</view>
+					</view>
+				</div>
+			</view>	
+		</tui-bottom-popup>	
 	</view>
 </template>
 <script>
@@ -150,6 +239,7 @@
 	import tuiLoadmore from "@/components/tui-components/loadmore/loadmore"
 	import tuiNomore from "@/components/tui-components/nomore/nomore"
 	import activiPopup from "@/components/cm-module/productDetails/cm-activipopu"
+	import couponTabs from '@/components/cm-module/coupon/tui-tabs.vue'
 	import modalLayer from "@/components/modal-layer"
 	import { mapState,mapMutations } from 'vuex';
 	
@@ -159,6 +249,7 @@
 			tuiLoadmore,
 			tuiNomore,
 			activiPopup,
+			couponTabs,
 			modalLayer
 		},
 		data(){
@@ -168,7 +259,6 @@
 				userID:'',
 				alertType:'',
 				isStock:'',
-				popupShow:false,
 				handlerPros:{},//监听单挑促销商品
 				failureList:[],	//失效商品列表
 				goodsList:[],	//购物车的商品
@@ -195,7 +285,62 @@
 				pullFlag: true,
 				pageSize: 10,
 				pageNum: 1,
-				submitIds:[]
+				submitIds:[],
+				popupShow:false,
+				popupShow0:false,
+				popupShow1:false,
+				currentTab: 0,
+				navbar: [
+					{ name: "未领取",num:3 }, 
+					{ name: "已领取",num:4 } 
+				],
+				dataList:[
+					{
+						maxMoney:5000,
+						minMoney:1000,
+						couponType:1,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:1,
+						couponBtnType:0
+					},
+					{
+						maxMoney:2000,
+						minMoney:200,
+						couponType:2,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:2,
+						couponBtnType:0
+					},
+					{
+						maxMoney:4000,
+						minMoney:800,
+						couponType:3,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:3,
+						couponBtnType:0
+					},
+					{
+						maxMoney:6000,
+						minMoney:1000,
+						couponType:4,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:1,
+						couponBtnType:0
+					},
+					{
+						maxMoney:6000,
+						minMoney:1000,
+						couponType:5,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:2,
+						couponBtnType:0
+					}
+				],
 			}
 		},
 		onLoad(){
@@ -210,7 +355,39 @@
 			},
 		    totalprice(val,count){//单件商品的价格 × 数量
 		        return (val * count).toFixed(2)
-		    }
+		    },
+			TypeFormat:function(value) {
+				switch (value) {
+					case 1:
+						return  '活动券';
+						break;
+					case 2:
+						return  '品类券';
+						break;
+					case 3:
+						return  '店铺券';
+						break;
+					case 4:
+						return  '专享券';
+						break;
+					case 5:
+						return  '新用户券';
+						break;
+				}
+			},
+			TypeFormatText:function(value) {
+				switch (value) {
+					case 1:
+						return  '全商城商品通用';
+						break;
+					case 2:
+						return  '仅限购买仪器类商品';
+						break;
+					case 3:
+						return  '仅可购买店铺';
+						break;
+				}
+			}
 		},	
 		methods:{
 			initData(){
@@ -393,6 +570,9 @@
 			},
 			checkAll(){//全选方法内调用方法
 			    this.isCheckAll = !this.isCheckAll;
+				if(!this.isCheckAll){
+					this.popupShow1 = false
+				}
 				this.updateBothCheckBtn();     
 			},
 			totalShopPeice(){//每次所属会所下的商品增减重新计算合计价格&减去含有下架的商品
@@ -804,7 +984,43 @@
 					}
 				}
 				return false
-			}
+			},
+			showPopup(index){// 显示popup弹窗
+				switch(index){
+					case 0:
+						this.popupShow0 = true
+						break;
+					case 1:
+						this.popupShow1 = true
+						break;
+				}
+			},
+			hidePopup(index){// 隐藏popup弹窗
+				switch(index){
+					case 0:
+						this.popupShow0 = false
+						break;
+					case 1:
+						this.popupShow1 = false
+						break;
+				}
+			},
+			couponChange(e) {
+				this.currentTab = e.index
+				console.log('currentTab',this.currentTab)
+				switch(this.currentTab){
+					case 0:
+						this.listClass = 'list-used'
+						break;
+					case 1:
+						this.listClass = 'list-none'
+						break;
+					case 2:
+						this.listClass = 'list-none'
+						break;
+					
+				}
+			},
 		},
 		watch:{//深度监听所有数据，每次改变重新计算总价和总数
 		    goodsList:{
@@ -944,31 +1160,43 @@
 			margin-bottom: 24rpx;
 		}
 		.shoptitle{
-			display: flex;
-			align-items: center;
 			height: 80rpx;
 			line-height: 80rpx;
 			.checkbox-box{
-				padding: 10rpx;
+				float: left;
+				height: 80rpx;
+				line-height: 80rpx;
+				display: inline-block;
+				box-sizing: border-box;
+				margin-left: 10rpx;
 			}
 			.text{
-				width: 450rpx;
+				width: 400rpx;
+				float: left;
 				display: block;
 				overflow: hidden;
 				text-overflow:ellipsis;
 				white-space: nowrap;
+				line-height: 80rpx;
 				margin-left: 20rpx;
 				font-size: $font-size-28;
 				color: $text-color;
 				text-align: left;
 				font-weight: bold;
 			}
+			.text-coupon{
+				float: right;
+				line-height: 80rpx;
+				font-size: $font-size-30;
+				color: #e15616;
+			}
 			.floor-item-act{
-				height: 56rpx;
+				width: 120rpx;
+				height: 80rpx;
 				text-align: center;
 				box-sizing: border-box;
 				float: left;
-				padding:10rpx 0;
+				padding: 24rpx 0;
 				margin-left: 20rpx;
 				.floor-tags{
 					height: 28rpx;
@@ -1398,17 +1626,205 @@
 			}
 		}
 	}
+	.tui-popup-box {
+		position: relative;
+		box-sizing: border-box;
+		min-height: 220rpx;
+		padding:24rpx 24rpx 0 24rpx;
+		.tui-popup-close{
+			width: 90rpx;
+			height: 90rpx;
+			position: absolute;
+			right: 0;
+			top: 24rpx;
+			line-height: 90rpx;
+			text-align: center;
+			color: #b2b2b2;
+			.icon-iconfontguanbi{
+				font-size: $font-size-40;
+			}
+		}
+		.title{
+			font-size: $font-size-34;
+			color: $text-color;
+			line-height: 88rpx;
+			text-align: center;
+			float: left;
+			width: 100%;
+			height: 88rpx;
+			font-weight: bold;
+		}
+		.tui-popup-main{
+			width: 100%;
+			float: left;
+			&.coupon{
+				padding-bottom: 24rpx;
+			}
+			.tui-popup-scroll{
+				width: 100%;
+				height: 500rpx;
+				.coupon-list{
+					width: 100%;
+					height: 200rpx;
+					margin-top: 24rpx;
+					box-sizing: border-box;
+					background: url(https://static.caimei365.com/app/img/icon/icon-coupon-uesb@2x.png);
+					background-size: cover;
+					.list-cell-le{
+						width: 224rpx;
+						height: 100%;
+						box-sizing: border-box;
+						padding: 37rpx 0;
+						float: left;
+						.coupon-maxMoney{
+							width: 100%;
+							height: 78rpx;
+							line-height: 78rpx;
+							font-size: 56rpx;
+							color: #FFFFFF;
+							text-align: center;
+							.small{
+								font-size: $font-size-24;
+							}
+						}
+						.coupon-minMoney{
+							width: 100%;
+							height: 33rpx;
+							line-height: 33rpx;
+							font-size: $font-size-24;
+							color: #FFFFFF;
+							text-align: center;
+						}
+					}
+					.list-cell-ri{
+						width: 478rpx;
+						height: 100%;
+						box-sizing: border-box;
+						padding: 20rpx 24rpx 0 24rpx;
+						float: right;
+						.list-cell-top{
+							width: 100%;
+							height: 121rpx;
+							float: left;
+							border-bottom: 1px solid #e1e1e1;
+							.list-cell-type{
+								width: 286rpx;
+								height: 100%;
+								float: left;
+								.list-cell-tags{
+									width: 100%;
+									height: 32rpx;
+									margin-bottom: 7rpx;
+									.tags{
+										display: inline-block;
+										padding: 0 10rpx;
+										height: 32rpx;
+										line-height: 32rpx;
+										background-color: #ffdcce;
+										color: #f94b4b;
+										font-size: $font-size-20;
+										border-radius: 8rpx;
+										text-align: center;
+										float: left;
+									}
+								}
+								.list-cell-texts{
+									width: 100%;
+									height: auto;
+									line-height:35rpx;
+									text-overflow:ellipsis;
+									display: -webkit-box;
+									word-break: break-all;
+									-webkit-box-orient: vertical;
+									-webkit-line-clamp: 2;
+									overflow: hidden;
+									font-size: 26rpx;
+									color: #333333;
+								}
+							}
+							.list-cell-btn{
+								width: 128rpx;
+								height: 100%;
+								float: right;
+								.icon-used{
+									width: 100%;
+									height: 100%;
+									box-sizing: border-box;
+									padding-top: 57rpx;
+									.icon-used-btn{
+										width: 128rpx;
+										height: 48rpx;
+										border-radius: 28rpx;
+										line-height: 48rpx;
+										font-size: $font-size-26;
+										text-align: center;
+										&.receive{
+											background-image: linear-gradient(270deg, #f94b4b 0%, #feb673 100%);;
+											color: #FFFFFF;
+										}
+										&.make{
+											border: solid 1px #f94b4b;
+											color: #f94b4b;
+										}
+									}
+								}
+							}
+						}
+						.list-cell-time{
+							width: 100%;
+							height: 58rpx;
+							line-height: 58rpx;
+							text-align: left;
+							font-size: $font-size-20;
+							color: #999999;
+						}
+					}
+				}
+			}	
+			.tui-popup-coupon{
+				width: 100%;
+				height: 500rpx;
+				box-sizing: border-box;
+				padding:30rpx 20rpx;
+				.tui-popup-h1{
+					width: 100%;
+					height: 66rpx;
+					display: flex;
+					align-items: center;
+					.tui-popup-text{
+						flex: 1;
+						height: 66rpx;
+						line-height: 66rpx;
+						font-size: $font-size-30;
+						color: #333333;
+						&.red{
+							color: #f94b4b;
+						}
+						&.bold{
+							font-weight: bold;
+						}
+						&.left{
+							text-align: left;
+						}
+						&.right{
+							text-align: right;
+						}
+					}
+				}
+			}
+		}
+	}			
 	.footer{
 		width: 100%;
 		background-color: #FFFFFF;
 		height: 110rpx;
 		position: fixed;
 		bottom: 0rpx;
-		z-index: 100;
+		z-index: 1009;
 		.footer-le{
 			width: 520rpx;
 			height: 100%;
-			padding:0 24rpx;
+			padding-left: 24rpx;
 			float: left;
 			box-sizing: border-box;
 			.foot-check{
@@ -1437,7 +1853,7 @@
 					line-height: 45rpx;
 					color: $text-color;
 					float: left;
-					text-align: right;
+					text-align: left;
 					.money{
 						font-size: $font-size-24;
 						color: #999999;
@@ -1451,11 +1867,22 @@
 					.money-reduced{
 						margin-left: 10rpx;
 						font-size: $font-size-24;
-						color: $color-system;
+						color: #FF2A2A;
+					}
+					.money-popup{
+						height: 45rpx;
+						line-height: 45rpx;
+						display: inline-block;
+						float: right;
+						font-size: $font-size-24;
+						color: #FF2A2A;
+						.icon-xiangshangjiantou{
+							font-size: $font-size-30;
+							margin-left: 5rpx;
+						}
 					}
 				}
 				.sum-price{
-					text-align: right;
 					width: 100%;
 					height: 45rpx;
 					line-height: 45rpx;
@@ -1463,6 +1890,7 @@
 					color: $text-color;
 					float: left;
 					font-weight: normal;
+					text-align: left;
 					&.none{
 						height: 90rpx;
 						line-height: 90rpx;
@@ -1486,7 +1914,7 @@
 			align-items: center;
 			z-index: 999;
 			box-sizing: border-box;
-			padding: 13rpx 15rpx;
+			padding: 13rpx 15rpx 13rpx 5rpx;
 			&.none{
 				display: none;
 			}

pages/tabBar/home/index.vue

@@ -8,6 +8,8 @@
 			<banner :list="bannerImageList" v-if="isNavRequest"></banner>
 			<!-- 金刚区菜单 -->
 			<navbars :list="navBarsList" v-if="isNavRequest"></navbars>
+			<!-- 优惠券入口 -->
+			<coupon v-if="isNavRequest"></coupon>
 			<!-- 直播 -->
 			<page-special :templateData="templateData" v-if="isLiveRequest"></page-special>
 		</view>	
@@ -31,6 +33,7 @@
 	import customer from '@/components/cm-module/homeIndex/customer.vue'
 	import banner from '@/components/cm-module/homeIndex/banner.vue'
 	import navbars from '@/components/cm-module/homeIndex/navbars.vue'
+	import coupon from '@/components/cm-module/homeIndex/coupon.vue'
 	import pageFloor from '@/components/cm-module/homeIndex/pageFloor.vue'
 	import pageSpecial from '@/components/cm-module/homeIndex/pageSpecial.vue'
 	import supplierList from '@/components/cm-module/homeIndex/supplierList.vue'
@@ -43,6 +46,7 @@
 			customer,
 			banner,
 			navbars,
+			coupon,
 			pageFloor,
 			pageSpecial,
 			supplierList,

pages/tabBar/user/user.vue

@@ -50,7 +50,7 @@
 								<view class="main-account-icon none" v-else>-</view>
 								<view class="main-account-text">采美豆</view>
 							</view>
-							<view class="main-account-ri-view" @click="navigator('/pages/user/account/account-bean')">
+							<view class="main-account-ri-view" @click="navigator('/pages/user/coupon/coupon')">
 								<view class="main-account-icon" v-if="hasLogin">{{ userBeans ? userBeans : 0  }}</view>
 								<view class="main-account-icon none" v-else>-</view>
 								<view class="main-account-text">优惠券</view>

pages/user/coupon/coupon-collection.vue

@@ -0,0 +1,397 @@
+<template>
+	<view class="container clearfix">
+		<view class="container-list">
+			<template v-if="!showEmpty">
+				<view v-for="(coupon,index) in dataList" :key="index" :id="coupon.id" class="coupon-list">
+					<view class="list-cell-le">
+						<view class="coupon-maxMoney">
+							<text class="small">￥</text>
+							{{ coupon.maxMoney }}
+						</view>
+						<view class="coupon-minMoney">
+							满{{ coupon.minMoney }}可用
+						</view>
+					</view>
+					<view class="list-cell-ri">
+						<view class="list-cell-top">
+							<view class="list-cell-type">
+								<view class="list-cell-tags">
+									<text class="tags">{{ coupon.couponType | TypeFormat }}</text>
+								</view>
+								<view class="list-cell-texts" :class="currentTab == 1 || currentTab == 2 ? 'none' : ''">
+									<text v-if="coupon.useType == 1">{{ coupon.useType | TypeFormatText }}</text>
+									<text v-if="coupon.useType == 2">{{ coupon.useType | TypeFormatText }}</text>
+									<text v-if="coupon.useType == 3">{{ coupon.useType | TypeFormatText }}{{ coupon.couponText }}的商品</text>
+								</view>
+							</view>
+							<view class="list-cell-btn">
+								<view class="icon-used">
+									<view class="icon-used-btn receive" v-if="coupon.couponBtnType == 0" @click="receiveCoupon(coupon)">领取</view>
+									<view class="icon-used-btn make" v-if="coupon.couponBtnType == 1">去使用</view>
+								</view>
+							</view>
+						</view>
+						<view class="list-cell-time">{{ coupon.couponTime }}</view>
+					</view>
+				</view>
+				<view v-if="showLoading && dataList.length > 5">
+					<view class="loading-wrapper loading-wrapper-now" v-if="loadingNow">{{loadingText}}<text v-if="loadingText === '已至底部'">‧ ‧ ‧</text></view>
+					<view class="loading-wrapper loading-wrapper-btm" v-else>———<text class="btm-text">已至底部</text>———</view>
+				</view>
+			</template>
+			<view class="empty-container" v-else>
+				<image class="empty-container-image" :src="StaticUrl+'/icon/icon-coupon-empty@2x.png'"></image>
+				<text class="error-text">暂无可领的优惠券~</text>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import { mapState,mapMutations} from 'vuex';
+	import couponTabs from '@/components/cm-module/coupon/tui-tabs.vue'
+	export default {
+		components:{
+			couponTabs
+		},
+		data() {
+			return {
+				StaticUrl:this.$Static,
+				isIphoneX:this.$store.state.isIphoneX,
+				currentTab: 0,
+				navbar: [
+					{ name: "未使用",num:3 }, 
+					{ name: "已使用",num:4 }, 
+					{ name: "已失效",num:5 },
+				],
+				dataList:[
+					{
+						maxMoney:5000,
+						minMoney:1000,
+						couponType:1,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:1,
+						couponBtnType:0
+					},
+					{
+						maxMoney:2000,
+						minMoney:200,
+						couponType:2,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:2,
+						couponBtnType:0
+					},
+					{
+						maxMoney:4000,
+						minMoney:800,
+						couponType:3,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:3,
+						couponBtnType:0
+					},
+					{
+						maxMoney:6000,
+						minMoney:1000,
+						couponType:4,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:1,
+						couponBtnType:0
+					},
+					{
+						maxMoney:6000,
+						minMoney:1000,
+						couponType:4,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:1,
+						couponBtnType:0
+					},
+					{
+						maxMoney:6000,
+						minMoney:1000,
+						couponType:4,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:1,
+						couponBtnType:0
+					},
+					{
+						maxMoney:6000,
+						minMoney:1000,
+						couponType:4,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:1,
+						couponBtnType:0
+					},
+					{
+						maxMoney:6000,
+						minMoney:1000,
+						couponType:5,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:2,
+						couponBtnType:0
+					}
+				],
+				windowHeight:'',
+				scrollHeight:'',
+				showEmpty: false,
+				showLoading: false,
+				loadingNow: true,
+				loadingText: '上拉加载更多',
+				hasNextPage:false,
+				pullFlag: true,
+			}
+		},
+		onLoad() {
+			
+		},
+		filters: {
+			TypeFormat:function(value) {
+				switch (value) {
+					case 1:
+						return  '活动券';
+						break;
+					case 2:
+						return  '品类券';
+						break;
+					case 3:
+						return  '店铺券';
+						break;
+					case 4:
+						return  '专享券';
+						break;
+					case 5:
+						return  '新用户券';
+						break;
+				}
+			},
+			TypeFormatText:function(value) {
+				switch (value) {
+					case 1:
+						return  '全商城商品通用';
+						break;
+					case 2:
+						return  '仅限购买仪器类商品';
+						break;
+					case 3:
+						return  '仅可购买店铺';
+						break;
+				}
+			}
+		},
+		computed: {
+			...mapState(['hasLogin','userInfo','identity','isActivity'])
+		},
+		methods: {
+			setScrollHeight() {
+				const {windowHeight, pixelRatio} = wx.getSystemInfoSync();
+				this.windowHeight = windowHeight - 1;
+				this.scrollHeight = windowHeight - 1;
+			},
+			scrolltolower() {
+				if(this.total>this.productList.length && this.pullFlag) {
+					this.getListFromServer(true);
+				}
+			},
+			receiveCoupon(coupon){
+				coupon.couponBtnType = 1;
+			},
+			getListFromServer(loadMore) {//搜索商品
+				this.showLoading = true;
+				this.loadingNow = true;
+				this.loadingText = '加载中';
+				this.showEmpty = false;				
+				if(loadMore) {
+					this.listQuery.pageNum += 1;
+				}
+				this.ProductService.GetProductList(this.listQuery).then(response =>{
+					this.isShowWrapper = true
+					const data = response.data;
+					const dataList = data.list;
+					if(dataList && dataList.length > 0){
+						this.hasNextPage = data.hasNextPage;
+						this.showEmpty = false;
+						if(loadMore) {
+							this.productList = [...this.productList,...dataList];
+						} else {
+							this.productList = [...dataList];
+						}
+						// 防上拉暴滑
+						this.pullFlag = false;
+						setTimeout(()=>{ this.pullFlag = true; },500)
+						// 底部提示文案
+						if(this.hasNextPage) {
+							this.loadingText = '上拉加载更多';
+						} else {
+							this.showLoading = true;
+							this.loadingNow = false;
+						}
+					} else {
+						if(!loadMore) {
+							this.showEmpty = true;
+						}
+					}
+				}).catch(error =>{
+					this.$util.msg(error.msg,2000);
+				})
+			},
+			navigator(url){
+				this.$api.navigateTo(url)
+			},	
+		},
+		onShow(){
+			this.setScrollHeight();
+			this.$api.getComStorage('userInfo').then((resolve) =>{
+				this.userName = resolve.name;
+				this.userIdentity = resolve.userIdentity
+			}).catch(error =>{
+				
+			})
+		}
+	}
+</script>
+
+<style lang="scss">
+	page{
+		background-color: #F7F7F7;
+	}
+	.container{
+		width: 100%;
+		height: auto;
+	}
+	.container-list {
+		box-sizing: border-box;
+		padding:24rpx;
+		.empty-container-image {
+			width: 260rpx;
+			height: 260rpx;
+			margin-top: -300rpx;
+		}
+		.toIndexPage {
+			bottom: 390rpx;
+		}
+		.coupon-list{
+			width: 100%;
+			height: 200rpx;
+			margin-bottom: 24rpx;
+			box-sizing: border-box;
+			background: url(https://static.caimei365.com/app/img/icon/icon-coupon-uesb@2x.png);
+			background-size: cover;
+			.list-cell-le{
+				width: 224rpx;
+				height: 100%;
+				box-sizing: border-box;
+				padding: 37rpx 0;
+				float: left;
+				.coupon-maxMoney{
+					width: 100%;
+					height: 78rpx;
+					line-height: 78rpx;
+					font-size: 56rpx;
+					color: #FFFFFF;
+					text-align: center;
+					.small{
+						font-size: $font-size-24;
+					}
+				}
+				.coupon-minMoney{
+					width: 100%;
+					height: 33rpx;
+					line-height: 33rpx;
+					font-size: $font-size-24;
+					color: #FFFFFF;
+					text-align: center;
+				}
+			}
+			.list-cell-ri{
+				width: 478rpx;
+				height: 100%;
+				box-sizing: border-box;
+				padding: 20rpx 24rpx 0 24rpx;
+				float: right;
+				.list-cell-top{
+					width: 100%;
+					height: 121rpx;
+					float: left;
+					border-bottom: 1px solid #e1e1e1;
+					.list-cell-type{
+						width: 286rpx;
+						height: 100%;
+						float: left;
+						.list-cell-tags{
+							width: 100%;
+							height: 32rpx;
+							margin-bottom: 7rpx;
+							.tags{
+								display: inline-block;
+								padding: 0 10rpx;
+								height: 32rpx;
+								line-height: 32rpx;
+								background-color: #ffdcce;
+								color: #f94b4b;
+								font-size: $font-size-20;
+								border-radius: 8rpx;
+								text-align: center;
+								float: left;
+							}
+						}
+						.list-cell-texts{
+							width: 100%;
+							height: auto;
+							line-height:35rpx;
+							text-overflow:ellipsis;
+							display: -webkit-box;
+							word-break: break-all;
+							-webkit-box-orient: vertical;
+							-webkit-line-clamp: 2;
+							overflow: hidden;
+							font-size: 26rpx;
+							color: #333333;
+						}
+					}
+					.list-cell-btn{
+						width: 128rpx;
+						height: 100%;
+						float: right;
+						.icon-used{
+							width: 100%;
+							height: 100%;
+							box-sizing: border-box;
+							padding-top: 57rpx;
+							.icon-used-btn{
+								width: 128rpx;
+								height: 48rpx;
+								border-radius: 28rpx;
+								line-height: 48rpx;
+								font-size: $font-size-26;
+								text-align: center;
+								&.receive{
+									background-image: linear-gradient(270deg, #f94b4b 0%, #feb673 100%);;
+									color: #FFFFFF;
+								}
+								&.make{
+									border: solid 1px #f94b4b;
+									color: #f94b4b;
+								}
+							}
+						}
+					}
+				}
+				.list-cell-time{
+					width: 100%;
+					height: 58rpx;
+					line-height: 58rpx;
+					text-align: left;
+					font-size: $font-size-20;
+					color: #999999;
+				}
+			}
+		}
+	}
+</style>

pages/user/coupon/coupon-exchange.vue

@@ -0,0 +1,124 @@
+<template>
+	<view class="container clearfix">
+		<view class="coupon-content">
+			<view class="coupon-input">
+				<input class="input" type="text" v-model="params.couponCode" maxlength="16"  placeholder="请输入16位兑换码"/>
+			</view>
+			<view class="coupon-main">
+				<view class="coupon-button" @click="exchangeConfirm">立即兑换</view>
+				<view class="coupon-text">
+					<view class="coupon-h1">注意事项：</view>
+					<view class="coupon-h2">1. 兑换码获取：可通过采美线下发放或者销售顾问线上发放</view>
+					<view class="coupon-h2 indet">获得优惠券兑换码，兑换码由16位数字和字母组成。</view>
+					<view class="coupon-h2">2. 兑换码使用：在当前页面输入兑换码即可兑换相应优惠券</view>
+					<view class="coupon-h2 indet">一个兑换码只能兑换一张优惠券，不可重复使用。</view>
+					<view class="coupon-h2">3. 输入兑换码时请区分字母大小写。</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import { mapState,mapMutations} from 'vuex';
+	export default {
+		components:{
+			
+		},
+		data() {
+			return {
+				params:{
+					couponCode:'',
+				},
+				userName:'',
+				userIdentity:0
+			}
+		},
+		onLoad() {
+			
+		},
+		computed: {
+			...mapState(['hasLogin','userInfo','identity','isActivity'])
+		},
+		methods: {
+			exchangeConfirm(){
+				if( this.params.couponCode == ''){
+					this.$util.msg('请输入位兑换码',2000)
+					return
+				}
+			}
+		},
+		onShow(){
+			this.$api.getComStorage('userInfo').then((resolve) =>{
+				this.userName = resolve.name;
+				this.userIdentity = resolve.userIdentity
+			}).catch(error =>{
+				
+			})
+		}
+	}
+</script>
+
+<style lang="scss">
+	.container{
+		width: 100%;
+		height: auto;
+		.coupon-content{
+			width: 100%;
+			height: auto;
+			box-sizing: border-box;
+			padding: 0 40rpx;
+			padding-top: 60rpx;
+			.coupon-input{
+				width: 100%;
+				height: auto;
+				margin-bottom: 88rpx;
+				.input{
+					width: 100%;
+					height: 66rpx;
+					box-sizing: border-box;
+					border: 1px solid #e2e2e2;
+					line-height: 66rpx;
+					padding: 0 20rpx;
+					font-size: $font-size-26;
+					color: #b2b2b2;
+					border-radius: 2rpx;
+				}
+			}
+			.coupon-main{
+				width: 100%;
+				height: auto;
+				box-sizing: border-box;
+				.coupon-button{
+					width: 600rpx;
+					height: 90rpx;
+					margin: 0 auto;
+					border-radius: 50rpx;
+					line-height: 90rpx;
+					text-align: center;
+					background: $btn-confirm;
+					color: #FFFFFF;
+					font-size: $font-size-30;
+				}
+				.coupon-text{
+					width: 100%;
+					box-sizing: border-box;
+					padding: 0 20rpx;
+					margin-top: 40rpx;
+					line-height: 44rpx;
+					text-align: justify;
+					font-size: $font-size-24;
+					.coupon-h1{
+						color: #333333;
+					}
+					.coupon-h2{
+						color: #999999;
+						&.indet{
+							text-indent: 28rpx;
+						}
+					}
+				}
+			}
+		}
+	}
+</style>

pages/user/coupon/coupon-product.vue

@@ -0,0 +1,48 @@
+<template>
+	<view class="container clearfix">
+	
+	</view>
+</template>
+
+<script>
+	import { mapState,mapMutations} from 'vuex';
+	export default {
+		components:{
+			
+		},
+		data() {
+			return {
+				userName:'',
+				userIdentity:0
+			}
+		},
+		onLoad() {
+			if(!this.hasLogin){
+				uni.redirectTo({
+					url:'../../login/login'
+				})
+			}
+		},
+		computed: {
+			...mapState(['hasLogin','userInfo','identity','isActivity'])
+		},
+		methods: {
+
+		},
+		onShow(){
+			this.$api.getComStorage('userInfo').then((resolve) =>{
+				this.userName = resolve.name;
+				this.userIdentity = resolve.userIdentity
+			}).catch(error =>{
+				
+			})
+		}
+	}
+</script>
+
+<style lang="scss">
+	.container{
+		width: 100%;
+		height: auto;
+	}
+</style>

pages/user/coupon/coupon.vue

@@ -1,38 +1,248 @@
 <template>
-	<view class="container home clearfix" v-if="hasLogin">
-		<!-- <view class="coupon-title" v-if="userIdentity == 4">优惠券仅限{{userName}}（机构）使用 </view> -->
-		<view class="coupon-title" v-if="userIdentity == 4 || userIdentity == 2">优惠券仅限采美机构会员使用</view>
-		<!-- <view class="coupon-title" v-if="userIdentity == 2">优惠券仅限{{userName}}使用 </view> -->
-		<image class="coupon-image" src="http://static.caimei365.com/app/meibohui/app/activity-detail.jpg" mode=""></image>
+	<view class="container clearfix">
+		<view class="coupon-tabs">
+			<coupon-tabs  :tabs="navbar"
+						  :currentTab="currentTab>2?0:currentTab" 
+						  @change="change" 
+						  :itemWidth="(100/navbar.length)+'%'"
+						  selectedColor="#e15616" 
+						  sliderBgColor="#e15616">
+			</coupon-tabs>
+		</view>
+		<view class="container-list" :style="{'overflow':'auto',paddingBottom :isIphoneX ? '68rpx' : '0rpx','height':(dataList.length>6? windowHeight + 'px' : 'auto')}">
+			<scroll-view :style="{'height':(dataList.length>5? scrollHeight+'px' : 'auto')}" @scrolltolower="scrolltolower" scroll-y v-if="!showEmpty">
+				<view v-for="(coupon,index) in dataList" :key="index" :id="coupon.id" class="coupon-list" :class="listClass">
+					<view class="list-cell-le">
+						<view class="coupon-maxMoney">
+							<text class="small">￥</text>
+							{{ coupon.maxMoney }}
+						</view>
+						<view class="coupon-minMoney">
+							满{{ coupon.minMoney }}可用
+						</view>
+					</view>
+					<view class="list-cell-ri">
+						<view class="list-cell-top">
+							<view class="list-cell-type">
+								<view class="list-cell-tags">
+									<text class="tags" :class="currentTab == 1 || currentTab == 2 ? 'none' : ''">{{ coupon.couponType | TypeFormat }}</text>
+								</view>
+								<view class="list-cell-texts" :class="currentTab == 1 || currentTab == 2 ? 'none' : ''">
+									<text v-if="coupon.useType == 1">{{ coupon.useType | TypeFormatText }}</text>
+									<text v-if="coupon.useType == 2">{{ coupon.useType | TypeFormatText }}</text>
+									<text v-if="coupon.useType == 3">{{ coupon.useType | TypeFormatText }}{{ coupon.couponText }}的商品</text>
+								</view>
+							</view>
+							<view class="list-cell-btn">
+								<view class="icon-used" v-if="currentTab == 0">
+									<view class="icon-used-btn">去使用</view>
+								</view>
+								<view class="icon-use" v-if="currentTab == 1"></view>
+								<view class="icon-invalid" v-if="currentTab == 2"></view>
+							</view>
+						</view>
+						<view class="list-cell-time">{{ coupon.couponTime }}</view>
+					</view>
+				</view>
+				<view v-if="showLoading && dataList.length > 5">
+					<view class="loading-wrapper loading-wrapper-now" v-if="loadingNow">{{loadingText}}<text v-if="loadingText === '已至底部'">‧ ‧ ‧</text></view>
+					<view class="loading-wrapper loading-wrapper-btm" v-else>———<text class="btm-text">已至底部</text>———</view>
+				</view>
+			</scroll-view>
+			<view class="empty-container" v-else>
+				<image class="empty-container-image" :src="StaticUrl+'/icon/icon-coupon-empty@2x.png'"></image>
+				<text class="error-text">暂无优惠券~</text>
+			</view>
+		</view>
+		<view class="button-bottom" :style="{paddingBottom :isIphoneX ? '68rpx' : '0rpx',height:isIphoneX ?'168rpx' : '100rpx'}">
+			<view class="button-exchange" @click="navigator('/pages/user/coupon/coupon-exchange')">兑换优惠券</view>
+			<view class="button-receive" @click="navigator('/pages/user/coupon/coupon-collection')">领更多好券</view>
+		</view>
 	</view>
 </template>
 
 <script>
 	import { mapState,mapMutations} from 'vuex';
+	import couponTabs from '@/components/cm-module/coupon/tui-tabs.vue'
 	export default {
 		components:{
-			
+			couponTabs
 		},
 		data() {
 			return {
-				userName:'',
-				userIdentity:0
+				listClass:'list-used',
+				StaticUrl:this.$Static,
+				isIphoneX:this.$store.state.isIphoneX,
+				currentTab: 0,
+				navbar: [
+					{ name: "未使用",num:3 }, 
+					{ name: "已使用",num:4 }, 
+					{ name: "已失效",num:5 },
+				],
+				dataList:[
+					{
+						maxMoney:5000,
+						minMoney:1000,
+						couponType:1,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:1,
+					},
+					{
+						maxMoney:2000,
+						minMoney:200,
+						couponType:2,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:2,
+					},
+					{
+						maxMoney:4000,
+						minMoney:800,
+						couponType:3,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:3,
+					},
+					{
+						maxMoney:6000,
+						minMoney:1000,
+						couponType:4,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:1,
+					},
+					{
+						maxMoney:6000,
+						minMoney:1000,
+						couponType:5,
+						couponTime:'2021.06.28~2021.07.28',
+						couponText:'华熙生物技术有限公司',
+						useType:2
+					}
+				],
+				windowHeight:'',
+				scrollHeight:'',
+				showEmpty: false,
+				showLoading: false,
+				loadingNow: true,
+				loadingText: '上拉加载更多',
+				hasNextPage:false,
+				pullFlag: true,
 			}
 		},
 		onLoad() {
-			if(!this.hasLogin){
-				uni.redirectTo({
-					url:'../../login/login'
-				})
+			
+		},
+		filters: {
+			TypeFormat:function(value) {
+				switch (value) {
+					case 1:
+						return  '活动券';
+						break;
+					case 2:
+						return  '品类券';
+						break;
+					case 3:
+						return  '店铺券';
+						break;
+					case 4:
+						return  '专享券';
+						break;
+					case 5:
+						return  '新用户券';
+						break;
+				}
+			},
+			TypeFormatText:function(value) {
+				switch (value) {
+					case 1:
+						return  '全商城商品通用';
+						break;
+					case 2:
+						return  '仅限购买仪器类商品';
+						break;
+					case 3:
+						return  '仅可购买店铺';
+						break;
+				}
 			}
 		},
 		computed: {
 			...mapState(['hasLogin','userInfo','identity','isActivity'])
 		},
 		methods: {
-
+			setScrollHeight() {
+				const {windowHeight, pixelRatio} = wx.getSystemInfoSync();
+				this.windowHeight = windowHeight - 1;
+				this.scrollHeight = windowHeight - 1;
+			},
+			scrolltolower() {
+				if(this.total>this.productList.length && this.pullFlag) {
+					this.getListFromServer(true);
+				}
+			},
+			getListFromServer(loadMore) {//搜索商品
+				this.showLoading = true;
+				this.loadingNow = true;
+				this.loadingText = '加载中';
+				this.showEmpty = false;				
+				if(loadMore) {
+					this.listQuery.pageNum += 1;
+				}
+				this.ProductService.GetProductList(this.listQuery).then(response =>{
+					this.isShowWrapper = true
+					const data = response.data;
+					const dataList = data.list;
+					if(dataList && dataList.length > 0){
+						this.hasNextPage = data.hasNextPage;
+						this.showEmpty = false;
+						if(loadMore) {
+							this.productList = [...this.productList,...dataList];
+						} else {
+							this.productList = [...dataList];
+						}
+						// 防上拉暴滑
+						this.pullFlag = false;
+						setTimeout(()=>{ this.pullFlag = true; },500)
+						// 底部提示文案
+						if(this.hasNextPage) {
+							this.loadingText = '上拉加载更多';
+						} else {
+							this.showLoading = true;
+							this.loadingNow = false;
+						}
+					} else {
+						if(!loadMore) {
+							this.showEmpty = true;
+						}
+					}
+				}).catch(error =>{
+					this.$util.msg(error.msg,2000);
+				})
+			},
+			change(e) {
+				this.currentTab = e.index
+				console.log('currentTab',this.currentTab)
+				switch(this.currentTab){
+					case 0:
+						this.listClass = 'list-used'
+						break;
+					case 1:
+						this.listClass = 'list-none'
+						break;
+					case 2:
+						this.listClass = 'list-none'
+						break;
+					
+				}
+			},
+			navigator(url){
+				this.$api.navigateTo(url)
+			},	
 		},
 		onShow(){
+			this.setScrollHeight();
 			this.$api.getComStorage('userInfo').then((resolve) =>{
 				this.userName = resolve.name;
 				this.userIdentity = resolve.userIdentity
@@ -45,33 +255,206 @@
 
 <style lang="scss">
 	page{
-		
+		background-color: #F7F7F7;
+	}
+	.coupon-tabs{
+		width: 100%;
+		height: 80rpx;
+		position: fixed;
+		top: 0;
+		left: 0;
+		z-index: 99;
 	}
 	.container{
 		width: 100%;
 		height: auto;
-		background-color: #ff2e4c;
-		.coupon-title{
-			position: absolute;
+		padding-top: 80rpx;
+	}
+	.container-list {
+		box-sizing: border-box;
+		padding:24rpx;
+		scroll-view {
+			height: 100%;
+			overflow: scroll;
+		}	
+		.empty-container-image {
+			width: 260rpx;
+			height: 260rpx;
+			margin-top: -300rpx;
+		}
+		.toIndexPage {
+			bottom: 390rpx;
+		}
+		.coupon-list{
 			width: 100%;
-			height: 110rpx;
-			line-height: 110rpx;
-			font-size: $font-size-28;
-			font-weight: bold;
-			background-image: linear-gradient(0deg, #fffaec 0%, #fff7d6 50%, #fff4b9 100%), linear-gradient(#fffaef, #fffaef);
+			height: 200rpx;
+			margin-bottom: 24rpx;
 			box-sizing: border-box;
-			padding: 0 24rpx;
-			white-space: nowrap;
-			text-overflow: ellipsis;
-			overflow: hidden;
-			color: #fd3c5b;
+			&.list-used{
+				background: url(https://static.caimei365.com/app/img/icon/icon-coupon-uesb@2x.png);
+				background-size: cover;
+			}
+			&.list-none{
+				background: url(https://static.caimei365.com/app/img/icon/icon-coupon-none@2x.png);
+				background-size: cover;
+			}
+			.list-cell-le{
+				width: 224rpx;
+				height: 100%;
+				box-sizing: border-box;
+				padding: 37rpx 0;
+				float: left;
+				.coupon-maxMoney{
+					width: 100%;
+					height: 78rpx;
+					line-height: 78rpx;
+					font-size: 56rpx;
+					color: #FFFFFF;
+					text-align: center;
+					.small{
+						font-size: $font-size-24;
+					}
+				}
+				.coupon-minMoney{
+					width: 100%;
+					height: 33rpx;
+					line-height: 33rpx;
+					font-size: $font-size-24;
+					color: #FFFFFF;
+					text-align: center;
+				}
+			}
+			.list-cell-ri{
+				width: 478rpx;
+				height: 100%;
+				box-sizing: border-box;
+				padding: 20rpx 24rpx 0 24rpx;
+				float: right;
+				.list-cell-top{
+					width: 100%;
+					height: 121rpx;
+					float: left;
+					border-bottom: 1px solid #e1e1e1;
+					.list-cell-type{
+						width: 286rpx;
+						height: 100%;
+						float: left;
+						.list-cell-tags{
+							width: 100%;
+							height: 32rpx;
+							margin-bottom: 7rpx;
+							.tags{
+								display: inline-block;
+								padding: 0 10rpx;
+								height: 32rpx;
+								line-height: 32rpx;
+								background-color: #ffdcce;
+								color: #f94b4b;
+								font-size: $font-size-20;
+								border-radius: 8rpx;
+								text-align: center;
+								float: left;
+								&.none{
+									background-color: #dbdbdb;
+									color: #FFFFFF;
+								}
+							}
+						}
+						.list-cell-texts{
+							width: 100%;
+							height: auto;
+							line-height:35rpx;
+							text-overflow:ellipsis;
+							display: -webkit-box;
+							word-break: break-all;
+							-webkit-box-orient: vertical;
+							-webkit-line-clamp: 2;
+							overflow: hidden;
+							font-size: 26rpx;
+							color: #333333;
+							&.none{
+								color: #999999;
+							}
+						}
+					}
+					.list-cell-btn{
+						width: 128rpx;
+						height: 100%;
+						float: right;
+						.icon-used{
+							width: 100%;
+							height: 100%;
+							box-sizing: border-box;
+							padding-top: 57rpx;
+							.icon-used-btn{
+								width: 128rpx;
+								height: 48rpx;
+								border-radius: 28rpx;
+								border: solid 1px #f94b4b;
+								line-height: 48rpx;
+								font-size: $font-size-26;
+								color: #f94b4b;
+								text-align: center;
+							}
+						}
+						.icon-use{
+							width: 92rpx;
+							height: 92rpx;
+							box-sizing: border-box;
+							background: url(https://static.caimei365.com/app/img/icon/icon-coupon-use@2x.png);
+							background-size: cover;
+							float: right;
+						}
+						.icon-invalid{
+							width: 92rpx;
+							height: 92rpx;
+							box-sizing: border-box;
+							background: url(https://static.caimei365.com/app/img/icon/icon-coupon-invalid@2x.png);
+							background-size: cover;
+							float: right;
+						}
+					}
+				}
+				.list-cell-time{
+					width: 100%;
+					height: 58rpx;
+					line-height: 58rpx;
+					text-align: left;
+					font-size: $font-size-20;
+					color: #999999;
+				}
+			}
+		}
+	}
+	.button-bottom{
+		width: 100%;
+		position: fixed;
+		background-color: #FFFFFF;
+		bottom: 0;
+		left: 0;
+		box-sizing: border-box;
+		padding: 8rpx 24rpx;
+		.button-exchange{
+			width: 280rpx;
+			height: 100%;
+			background-color: #ffe6dc;
+			border-radius: 50rpx;
 			text-align: center;
+			line-height: 84rpx;
+			font-size: $font-size-30;
+			color: #e15616;
+			float: left;
 		}
-		.coupon-image{
-			width: 100%;
-			height: 1860rpx;
-			display: block;
-			
+		.button-receive{
+			width: 408rpx;
+			height: 100%;
+			background: $btn-confirm;
+			border-radius: 50rpx;
+			text-align: center;
+			line-height: 84rpx;
+			font-size: $font-size-30;
+			color: #FFFFFF;
+			float: right;
 		}
 	}
 </style>

search/pages/search/search.vue

@@ -69,23 +69,27 @@
 						<view class="list-details-price">
 							<template v-if="userIdentity == 3">
 								<view class="floor-item-act" v-if="item.actStatus==1">
+									<view class="coupon-tags">优惠券</view>
 									<view class="floor-tags" v-if="PromotionsFormat(item.promotions)">
 										{{item.promotions.name}}<text v-if="item.priceFlag != 1 && item.supplierId === shopId">:￥{{ item.price | NumFormat }}</text>
 									</view>
 									<view class="floor-tags" v-else>{{item.promotions.name}}</view>	
 								</view>
 								<view class="floor-item-act" v-if="item.actStatus ==0  &&  item.ladderPriceFlag==1">
+									<view class="coupon-tags">优惠券</view>
 									<view class="floor-tags">阶梯价格</view>	
 								</view>
 							</template>
 							<template v-else>
 								<view class="floor-item-act" v-if="item.actStatus==1">
+									<view class="coupon-tags">优惠券</view>
 									<view class="floor-tags" v-if="PromotionsFormat(item.promotions)">
 										{{item.promotions.name}}<text v-if="hasLogin && item.priceFlag != 1">:￥{{ item.price | NumFormat }}</text>
 									</view>
 									<view class="floor-tags" v-else>{{item.promotions.name}}</view>	
 								</view>
 								<view class="floor-item-act" v-if="item.actStatus ==0  &&  item.ladderPriceFlag==1">
+									<view class="coupon-tags">优惠券</view>
 									<view class="floor-tags">阶梯价格</view>	
 								</view>
 							</template>
@@ -804,9 +808,26 @@
 			text-align: center;
 			box-sizing: border-box;
 			float: right;
+			padding: 11rpx 0;
+			.coupon-tags{
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
+				background-color: #fff1eb;
+				line-height: 28rpx;
+				color: #f94b4b;
+				text-align: center;
+				display: inline-block;
+				padding:0 10rpx;
+				font-size: $font-size-20;
+				border: 1px solid #f94b4b;
+				float: left;
+				margin-right: 12rpx;
+			}
 			.floor-tags{
-				height: 28rpx;
-				border-radius: 6rpx;
+				height: 32rpx;
+				box-sizing: border-box;
+				border-radius: 8rpx;
 				background-color: #FFFFFF;
 				line-height: 28rpx;
 				color: $color-system;
@@ -814,10 +835,8 @@
 				display: inline-block;
 				padding:0 16rpx;
 				font-size: $font-size-20;
-				margin-left: 15rpx;
-				margin-top:15rpx;
 				border: 1px solid #E15616;
-				float: right;
+				float: left;
 			}
 		}
 		.price-icon {