优惠券

src/main/resources/static/css/base/base.h5.css

@@ -13,6 +13,7 @@
 .icon.shop:before{width:7.5vw;height:6vw;background-position:-91vw -.5vw}
 .icon.heart:before{width:5.5vw;height:5.5vw;background-position:0 -17vw}
 .icon.shop .tips{display:none;}
+.couponTag{padding:0 2vw;border:.27vw solid #f94b4b;background:#fff1eb;font-size:2.8vw;float:left;height:4.2vw;line-height:4.2vw;color: #f94b4b;border-radius: 0.2vw;margin-right: 1vw;}
 .mf{display:-ms-flexbox;display:-webkit-flex;display:flex;}
 .mfbt{display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-justify-content:space-between;justify-content:space-between;}
 .mfc{display:-ms-flexbox;display:-webkit-flex;display:flex;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center}

src/main/resources/static/css/base/base.pc.css

@@ -350,7 +350,9 @@ iframe{width:320px !important;height: 280px !important}
 .empty a{color:#E15616;}
 
 /*采美豆弹窗样式*/
-.cmbeans-alert-box{width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;flex-direction: column;position: fixed;left: 0;top: 0;background: rgba(51,51,51,0.7);z-index: 99999;}
+.cmbeans-alert-box{width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;flex-direction: column;position: fixed;left: 0;top: 0;background: rgba(51,51,51,0.7);z-index: 99999;opacity: 0;}
+.cmbeans-alert-box.hide{opacity: 0;}
+.cmbeans-alert-box.show{opacity: 1;}
 .cmbeans-alert-image{width: 404px;height: 342px;position: absolute;top: 0;left: 0;bottom: 0;right: 0;margin: auto;box-sizing: border-box;}
 .cmbeans-alert-image img{width: 404px;height: 342px;display: block;}
 .cmbeans-alert-image .icon{width:30px;height:30px;display: block;position: absolute;top: 45px;right: -35px;cursor: pointer;}

src/main/resources/static/css/product/detail.h5.css

@@ -86,7 +86,7 @@ li{list-style:none}
 .Beautyfair .tag{width: 11.3vw;height: 4.3vw;line-height: 4.3vw;font-size: 2.8vw;float: left;margin-right: 1.3vw;text-align: center;color: #FFFFFF !important;background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);border-radius: 0px 2.7vw 0px 0px;margin-top: 1vw;}
 /*优惠券弹窗*/
 .coupon-popup{width:100%;height:100%;position:fixed;bottom:0;left:0;background-color:rgba(0,0,0,.4);z-index: 99999;}
-.coupon-popup .model-content{width:100%;height:106.7vw;position:absolute;bottom:0;left:0;right:0;bottom:0;background-color:#FFFFFF;margin:auto;border-radius:2px;box-sizing:border-box}
+.coupon-popup .coupon-popup-model-content{width:100%;height:106.7vw;position:absolute;bottom:0;left:0;right:0;bottom:0;background-color:#FFFFFF;margin:auto;border-radius:2px;box-sizing:border-box}
 .coupon-popup .title{width:100%;height:11vw;float:left;box-sizing:border-box;position:relative;padding:2.3vw 0;background-color: #f8f8f8;}
 .coupon-popup .title p{font-size:3.4vw;line-height:6.4vw;text-align:center;color:#333333;font-weight: bold;}
 .coupon-popup .title .icon{width:6.4vw;height:6.4vw;display:block;position:absolute;right:0;top:0;cursor:pointer;padding:10px}
@@ -109,4 +109,5 @@ li{list-style:none}
 .coupon-popup .coupon-list-cell .coupon-list-ri.none{padding: 9.5vw 6vw;}
 .coupon-popup .coupon-list-cell .coupon-tags{height: 4.8vw;line-height: 4.8vw;text-align: center;background-color: #f94b4b;color: #FFF;border-radius: 1.6vw 0 1.6vw 0;position: absolute;top: 0;left: 0;padding: 0 1.5vw;font-size: 3vw;}
 .coupon-popup .coupon-list-cell{background: url("/img/account/icon-coupon-uesb@h52x.png") no-repeat;background-size: cover;}
+.coupon-popup .coupon-list-cell.none{background: url("/img/account/icon-coupon-received@h52x.png") no-repeat;background-size: cover;}
 

src/main/resources/static/css/product/detail.pc.css

@@ -153,7 +153,7 @@ input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appear
 .Beautyfair .tag{width: 44px;height: 18px;line-height: 18px;font-size: 12px;float: left;margin-right: 5px;text-align: center;color: #FFFFFF !important;background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);border-radius: 0px 10px 0px 0px;margin-top: 8px;}
 /*优惠券弹窗*/
 .coupon-popup{width:100%;height:100%;position:fixed;top:0;left:0;background-color:rgba(0,0,0,.4);z-index: 99999;}
-.coupon-popup .model-content{width:540px;height:492px;position:absolute;top:0;left:0;right:0;bottom:0;background-color:#FFFFFF;margin:auto;border-radius:2px;box-sizing:border-box}
+.coupon-popup .coupon-popup-model-content{width:540px;height:492px;position:absolute;top:0;left:0;right:0;bottom:0;background-color:#FFFFFF;margin:auto;border-radius:2px;box-sizing:border-box}
 .coupon-popup .title{width:100%;height:50px;float:left;box-sizing:border-box;position:relative;padding:0 24px;background-color: #f8f8f8;}
 .coupon-popup .title p{font-size:16px;line-height:50px;text-align:left;color:#333333;float:left;font-weight: bold;}
 .coupon-popup .title .icon{width:16px;height:16px;display:block;position:absolute;right:0;top:0;cursor:pointer;padding:10px}
@@ -166,6 +166,7 @@ input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appear
 .coupon-popup .coupon-popup-content{width:100%;height:385px;box-sizing:border-box;padding: 16px 0;float: left;}
 .coupon-popup .coupon-popup-scroll{width:100%;height:100%;box-sizing:border-box;padding:0 45px;float:left;overflow:hidden;overflow-y:auto}
 .coupon-popup .coupon-list-cell{width: 369px;height: 148px;float: left;margin-bottom:24px;position: relative;background: url("/img/account/icon-coupon-uesb@2x.png") no-repeat;background-size: cover;}
+.coupon-popup .coupon-list-cell.none{background: url("/img/account/icon-coupon-received@2x.png") no-repeat;background-size: cover;}
 .coupon-popup .coupon-list-cell .coupon-list-le{width: 299px;height: 148px;float: left;box-sizing: border-box;padding: 24px 14px 12px 14px;}
 .coupon-popup .coupon-list-cell .coupon-list-money{width: 100%;height: 56px;line-height: 56px;color: #f94b4b;font-size: 14px;text-align: left;}
 .coupon-popup .coupon-list-cell .coupon-list-money .maxMoney{font-size: 40px;margin-right: 8px;}

src/main/resources/static/css/shopping/shopping.css

@@ -194,6 +194,32 @@ li{list-style:none}
     .invoiceForm .formLine .label{position:absolute;left:0;top:0;width:120px;text-align:right;line-height:36px;font-size:14px}
     .invoiceForm .formLine input[disabled]{border:none}
 
+    /*优惠券弹窗*/
+    .coupon-popup{width:100%;height:100%;position:fixed;top:0;left:0;background-color:rgba(0,0,0,.4);z-index: 99999;}
+    .coupon-popup .coupon-popup-model-content{width:540px;height:492px;position:absolute;top:0;left:0;right:0;bottom:0;background-color:#FFFFFF;margin:auto;border-radius:2px;box-sizing:border-box}
+    .coupon-popup .title{width:100%;height:50px;float:left;box-sizing:border-box;position:relative;padding:0 24px;background-color: #f8f8f8;}
+    .coupon-popup .title p{font-size:16px;line-height:50px;text-align:left;color:#333333;float:left;font-weight: bold;}
+    .coupon-popup .title .icon{width:16px;height:16px;display:block;position:absolute;right:0;top:0;cursor:pointer;padding:10px}
+    .coupon-popup .title .icon:before{width:16px;height:16px;background-position:-318px 0}
+    .coupon-popup .coupon-popup-main{width:100%;height:442px;box-sizing:border-box;padding:0 40px;float:left;}
+    .coupon-popup .coupon-popup-tabs{width: 100%;height: 57px;box-sizing: border-box;border-bottom: 1px solid #efefef;float: left;}
+    .coupon-popup .popup-tabs-cell{width: 230px; float: left;box-sizing: border-box;padding: 0 91px;}
+    .coupon-popup .popup-tabs-cell span{display: block;line-height: 57px;height: 57px;font-size: 16px;color: #333;cursor: pointer;box-sizing: border-box;text-align: center;}
+    .coupon-popup .popup-tabs-cell.active span{color: #E15621;border-bottom: 1px solid #E15621;}
+    .coupon-popup .coupon-popup-content{width:100%;height:385px;box-sizing:border-box;padding: 16px 0;float: left;}
+    .coupon-popup .coupon-popup-scroll{width:100%;height:100%;box-sizing:border-box;padding:0 45px;float:left;overflow:hidden;overflow-y:auto}
+    .coupon-popup .coupon-list-cell{width: 369px;height: 148px;float: left;margin-bottom:24px;position: relative;background: url("/img/account/icon-coupon-uesb@2x.png") no-repeat;background-size: cover;}
+    .coupon-popup .coupon-list-cell.none{background: url("/img/account/icon-coupon-received@2x.png") no-repeat;background-size: cover;}
+    .coupon-popup .coupon-list-cell .coupon-list-le{width: 299px;height: 148px;float: left;box-sizing: border-box;padding: 24px 14px 12px 14px;}
+    .coupon-popup .coupon-list-cell .coupon-list-money{width: 100%;height: 56px;line-height: 56px;color: #f94b4b;font-size: 14px;text-align: left;}
+    .coupon-popup .coupon-list-cell .coupon-list-money .maxMoney{font-size: 40px;margin-right: 8px;}
+    .coupon-popup .coupon-list-cell .coupon-list-name{width: 100%;height: 22px;line-height: 22px;color: #333333;font-size: 14px;text-align: left;margin-top: 13px;}
+    .coupon-popup .coupon-list-cell .coupon-list-time{width: 100%;height: 22px;line-height: 22px;color: #999999;font-size: 12px;text-align: left;}
+    .coupon-popup .coupon-list-cell .coupon-list-ri{width: 70px;height: 148px;float: left;box-sizing: border-box;padding: 54px 27px;font-size: 16px;color: #FFF;cursor: pointer;}
+    .coupon-popup .coupon-list-cell .coupon-list-ri.none{padding: 45px 27px;}
+    .coupon-popup .coupon-list-cell .coupon-tags{height: 24px;line-height: 24px;text-align: center;border-radius: 8px 0 8px 0;position: absolute;top: 0;left: 0;padding: 0 10px;background-color: #f94b4b;color: #FFF;}
+
+
 }
 
 /**
@@ -220,8 +246,10 @@ li{list-style:none}
     .listWrap .supplierItem.disable{background:#f1f0f5}
     .listWrap .supplierItem em{font-style:normal}
     .listWrap .supplierTit{border-bottom:1px solid #F7F7F7;height:7.4vw;line-height:7.4vw;padding:1.3vw 3.3vw;position:relative;}
-    .listWrap .supplierTit .price{width:22vw;height:6.4vw;position:absolute;right:0;top:2vw;}
-    .listWrap .supplierTit .priceTag .tag{top:0;}
+    .listWrap .supplierTit .price{height:6.4vw;float: left;}
+    .listWrap .supplierTit .shop{display: block;float: left;}
+    .listWrap .supplierTit .couponTag{float:left;margin-left: 10px;height: 6.4vw;line-height: 6.4vw;box-sizing: border-box;border-radius: 0.2vw;}
+    .listWrap .supplierTit .priceTag .tag{float: left;position: relative;top: 0;left: 0;margin-left: 2vw;}
     .listWrap .cartItem{padding:2.2vw 3.3vw;height:24vw;line-height:24vw;position:relative}
     .listWrap .supplierBtn{border-top:1px solid #F7F7F7;width:93vw;margin:0 auto;padding-bottom:2vw;color:#22272e;font-size:3.4vw;text-align:right}
     .listWrap .supplierBtn em{color:#f55c5c}
@@ -329,6 +357,32 @@ li{list-style:none}
     /* 发票 */
     .invoiceWrap .formLine .diyBox {width: 28vw;}
 
+    /*优惠券弹窗*/
+    .coupon-popup{width:100%;height:100%;position:fixed;bottom:0;left:0;background-color:rgba(0,0,0,.4);z-index: 99999;}
+    .coupon-popup .coupon-popup-model-content{width:100%;height:106.7vw;position:absolute;bottom:0;left:0;right:0;bottom:0;background-color:#FFFFFF;margin:auto;border-radius:2px;box-sizing:border-box}
+    .coupon-popup .title{width:100%;height:11vw;float:left;box-sizing:border-box;position:relative;padding:2.3vw 0;background-color: #f8f8f8;}
+    .coupon-popup .title p{font-size:3.4vw;line-height:6.4vw;text-align:center;color:#333333;font-weight: bold;}
+    .coupon-popup .title .icon{width:6.4vw;height:6.4vw;display:block;position:absolute;right:0;top:0;cursor:pointer;padding:10px}
+    .coupon-popup .title .icon:before{width:6.4vw;height:6.4vw;background-position:-33.6vw 0;}
+    .coupon-popup .coupon-popup-main{width:100%;height:95.7vw;box-sizing:border-box;padding:0 3.5vw;float:left;}
+    .coupon-popup .coupon-popup-tabs{width: 100%;height: 11vw;box-sizing: border-box;border-bottom: 1px solid #efefef;float: left;}
+    .coupon-popup .popup-tabs-cell{width: 50%; float: left;box-sizing: border-box;padding: 0 18.1vw;}
+    .coupon-popup .popup-tabs-cell span{display: block;line-height: 11vw;height: 11vw;font-size: 3.4vw;color: #333;cursor: pointer;box-sizing: border-box;text-align: center;}
+    .coupon-popup .popup-tabs-cell.active span{color: #E15621;border-bottom: 1px solid #E15621;}
+    .coupon-popup .coupon-popup-content{width:100%;height:84.7vw;box-sizing:border-box;padding: 4vw 0;float: left;}
+    .coupon-popup .coupon-popup-scroll{width:100%;height:100%;box-sizing:border-box;float:left;overflow:hidden;overflow-y:auto}
+    .coupon-popup .coupon-list-cell{width: 93.1vw;height: 33vw;float: left;margin: 0 0 2.4vw 0;position: relative;border-radius: 1vw;}
+    .coupon-popup .coupon-list-cell .coupon-list-le{width: 77.6vw;height: 33vw;float: left;box-sizing: border-box;padding: 6.8vw 3.7vw 3.3vw 3.7vw;}
+    .coupon-popup .coupon-list-cell .coupon-list-money{width: 100%;height:10vw;line-height: 10vw;color: #f94b4b;font-size: 3vw;text-align: left; }
+    .coupon-popup .coupon-list-cell .coupon-list-money .maxMoney{font-size: 7.2vw;margin-right: 2.4vw;}
+    .coupon-popup .coupon-list-cell .coupon-list-money.none, .coupon-list-cell .coupon-list-name.none, .coupon-list-cell .coupon-list-time.none{color: #FFF;}
+    .coupon-popup .coupon-list-cell .coupon-list-name{width: 100%;height: 4.8vw;line-height: 4.8vw;color: #333333;font-size: 3.4vw;text-align: left;margin-top: 4vw;}
+    .coupon-popup .coupon-list-cell .coupon-list-time{width: 100%;height: 4.8vw;line-height: 4.8vw;color: #999999;font-size: 2.4vw;text-align: left;}
+    .coupon-popup .coupon-list-cell .coupon-list-ri{width: 15.5vw;height: 33vw;float: left;box-sizing: border-box;padding: 11.8vw 6vw;font-size:3.4vw;color: #FFF;cursor: pointer;}
+    .coupon-popup .coupon-list-cell .coupon-list-ri.none{padding: 9.5vw 6vw;}
+    .coupon-popup .coupon-list-cell .coupon-tags{height: 4.8vw;line-height: 4.8vw;text-align: center;background-color: #f94b4b;color: #FFF;border-radius: 1.6vw 0 1.6vw 0;position: absolute;top: 0;left: 0;padding: 0 1.5vw;font-size: 3vw;}
+    .coupon-popup .coupon-list-cell{background: url("/img/account/icon-coupon-uesb@h52x.png") no-repeat;background-size: cover;}
+    .coupon-popup .coupon-list-cell.none{background: url("/img/account/icon-coupon-received@h52x.png") no-repeat;background-size: cover;}
 
 }
 

src/main/resources/static/js/product/detail.js

@@ -319,10 +319,6 @@ var productDetail = new Vue({
         toUpgrade: function() {
             setBeforeUrl();
             window.location.href = '/user/setting/upgrade.html';
-        },
-        queryCouponTabs:function (value){
-            var _self = this;
-            _self.currentTab = value;
         },
 		addShopCart: function(){ //加入购物车
 		    var _self = this;
@@ -383,6 +379,10 @@ var productDetail = new Vue({
                 }
             });
         },
+        queryCouponTabs:function (value){// 切换优惠券
+            var _self = this;
+            _self.currentTab = value;
+        },
         showPopup:function(){// 显示优惠券弹窗
             var _self = this;
             _self.isShowPopup = true;

src/main/resources/static/js/shopping/cart.js

@@ -15,7 +15,90 @@ var shoppingCart = new Vue({
         originalPrice: 0,
         allChecked: true,
         submitIds: [],//去结算商品Ids
-
+        isShowPopup:false,
+        currentTab:0,
+        dataList:[
+            {
+                maxMoney:5000,
+                minMoney:1000,
+                couponType:1,
+                couponTime:'2021.06.28~2021.07.28',
+                couponText:'华熙生物技术有限公司',
+                useType:1,
+                couponBtnType:0,
+                status:0,
+            },
+            {
+                maxMoney:2000,
+                minMoney:200,
+                couponType:2,
+                couponTime:'2021.06.28~2021.07.28',
+                couponText:'华熙生物技术有限公司',
+                useType:2,
+                couponBtnType:0,
+                status:1,
+            },
+            {
+                maxMoney:4000,
+                minMoney:800,
+                couponType:3,
+                couponTime:'2021.06.28~2021.07.28',
+                couponText:'华熙生物技术有限公司',
+                useType:3,
+                couponBtnType:0,
+                status:2,
+            },
+            {
+                maxMoney:6000,
+                minMoney:1000,
+                couponType:4,
+                couponTime:'2021.06.28~2021.07.28',
+                couponText:'华熙生物技术有限公司',
+                useType:1,
+                couponBtnType:0,
+                status:0,
+            },
+            {
+                maxMoney:6000,
+                minMoney:1000,
+                couponType:4,
+                couponTime:'2021.06.28~2021.07.28',
+                couponText:'华熙生物技术有限公司',
+                useType:1,
+                couponBtnType:0,
+                status:0,
+            },
+            {
+                maxMoney:6000,
+                minMoney:1000,
+                couponType:4,
+                couponTime:'2021.06.28~2021.07.28',
+                couponText:'华熙生物技术有限公司',
+                useType:1,
+                couponBtnType:0,
+                status:1,
+            },
+            {
+                maxMoney:6000,
+                minMoney:1000,
+                couponType:4,
+                couponTime:'2021.06.28~2021.07.28',
+                couponText:'华熙生物技术有限公司',
+                useType:1,
+                couponBtnType:0,
+                status:2,
+            },
+            {
+                maxMoney:6000,
+                minMoney:1000,
+                couponType:5,
+                couponTime:'2021.06.28~2021.07.28',
+                couponText:'华熙生物技术有限公司',
+                useType:2,
+                couponBtnType:0,
+                status:1,
+            }
+        ],
     },
     watch:{
         listData: {
@@ -29,6 +112,38 @@ var shoppingCart = new Vue({
     filters: {
         NumFormat: function (text) {//处理金额
             return Number(text).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: {
@@ -297,7 +412,19 @@ var shoppingCart = new Vue({
                 // type:（1购物车提交[对应表cm_cart]，2直接购买提交, 3协销下单）
                 window.location.href = '/shopping/confirm.html?type=1';
             }
-        }
+        },
+        queryCouponTabs:function (value){
+            var _self = this;
+            _self.currentTab = value;
+        },
+        showPopup:function(){// 显示优惠券弹窗
+            var _self = this;
+            _self.isShowPopup = true;
+        },
+        hidePopup:function(){// 隐藏优惠券弹窗
+            var _self = this;
+            _self.isShowPopup = false;
+        },
     },
     created: function () {
         if(globalUserData){

src/main/resources/templates/product/detail.html

@@ -301,7 +301,7 @@
         </div>
         <!--优惠券弹窗-->
         <div class="coupon-popup" v-show="isShowPopup">
-            <div class="model-content">
+            <div class="coupon-popup-model-content">
                 <div class="title"><p>优惠券</p><i class="icon mIcon" @click="hidePopup"></i></div>
                 <div class="coupon-popup-main">
                     <div class="coupon-popup-tabs">
@@ -310,7 +310,7 @@
                     </div>
                     <div class="coupon-popup-content">
                         <div class="coupon-popup-scroll">
-                            <div class="coupon-list-cell" v-for="(coupon, index) in dataList" :key="index">
+                            <div class="coupon-list-cell" v-for="(coupon, index) in dataList" :key="index" :class="currentTab == 1 ? 'none' : ''">
                                 <div class="coupon-list-le">
                                     <div class="coupon-list-money">
                                         <p>￥<span class="maxMoney">{{ coupon.maxMoney }}</span><span class="minMoney">满{{ coupon.minMoney }}可用</span></p>
@@ -322,9 +322,9 @@
                                     </div>
                                     <div class="coupon-list-time">{{ coupon.couponTime }}</div>
                                 </div>
-                                <div class="coupon-list-ri" :class="coupon.couponBtnType == 1 ? 'none' : ''">
-                                    <span v-if="coupon.couponBtnType == 0" @click="receiveCoupon(coupon)">领取</span>
-                                    <span v-if="coupon.couponBtnType == 1">去使用</span>
+                                <div class="coupon-list-ri" :class="currentTab == 1 ? 'none' : ''">
+                                    <span v-if="currentTab == 0" @click="receiveCoupon(coupon)">领取</span>
+                                    <span v-if="currentTab == 1">已领取</span>
                                 </div>
                                 <div class="coupon-tags">{{ coupon.couponType | TypeFormat }}</div>
                             </div>

src/main/resources/templates/shopping/cart.html

@@ -49,7 +49,7 @@
                     <div class="c0">
                         <input class="check" type="checkbox" @change="ckeckSupplier($event, supplier.checked)" v-model="supplier.checked">
                     </div>
-                    <a  :href="'/supplier-'+supplier.id+'.html'" target="_blank">
+                    <a  class="shop" :href="'/supplier-'+supplier.id+'.html'" target="_blank">
                         <img class="img" :src="supplier.logo">
                         <span class="name" v-text="supplier.name"></span>
                     </a>
@@ -78,7 +78,7 @@
                                 </div>
                             </div>
                         </div>
-                        <div class="couponTag" style="float: left;margin-left: 10px;">领券</div>
+                        <div class="couponTag">领券</div>
                     </div>
                 </div>
                 <div class="cartItem clear"  v-for="cart in supplier.cartList" >
@@ -209,6 +209,40 @@
             </div>
         </div>
     </div>
+    <!--优惠券弹窗-->
+    <div class="coupon-popup" v-show="isShowPopup">
+        <div class="coupon-popup-model-content">
+            <div class="title"><p>优惠券</p><i class="icon mIcon" @click="hidePopup"></i></div>
+            <div class="coupon-popup-main">
+                <div class="coupon-popup-tabs">
+                    <div class="popup-tabs-cell" :class="currentTab == 0 ? 'active' : ''" @click="queryCouponTabs(0)"><span>未领取</span></div>
+                    <div class="popup-tabs-cell" :class="currentTab == 1 ? 'active' : ''" @click="queryCouponTabs(1)"><span>已领取</span></div>
+                </div>
+                <div class="coupon-popup-content">
+                    <div class="coupon-popup-scroll">
+                        <div class="coupon-list-cell" v-for="(coupon, index) in dataList" :key="index" :class="currentTab == 1 ? 'none' : ''">
+                            <div class="coupon-list-le">
+                                <div class="coupon-list-money">
+                                    <p>￥<span class="maxMoney">{{ coupon.maxMoney }}</span><span class="minMoney">满{{ coupon.minMoney }}可用</span></p>
+                                </div>
+                                <div class="coupon-list-name">
+                                    <p v-if="coupon.useType == 1">{{ coupon.useType | TypeFormatText }}</p>
+                                    <p v-if="coupon.useType == 2">{{ coupon.useType | TypeFormatText }}</p>
+                                    <p v-if="coupon.useType == 3">{{ coupon.useType | TypeFormatText }}{{ coupon.couponText }}的商品</p>
+                                </div>
+                                <div class="coupon-list-time">{{ coupon.couponTime }}</div>
+                            </div>
+                            <div class="coupon-list-ri" :class="currentTab == 1 ? 'none' : ''">
+                                <span v-if="currentTab == 0" @click="receiveCoupon(coupon)">领取</span>
+                                <span v-if="currentTab == 1">已领取</span>
+                            </div>
+                            <div class="coupon-tags">{{ coupon.couponType | TypeFormat }}</div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
 </div>
 
 <!-- 引入底部 -->

src/main/resources/templates/user-center/dashboard.html

@@ -166,7 +166,7 @@
             </div>
         </div>
         <!-- 采美豆弹窗 -->
-        <div class="cmbeans-alert-box" v-if="isShowBeansAlet">
+        <div class="cmbeans-alert-box" v-if="isShowBeansAlet" :class="isShowBeansAlet ? 'show' : 'hide'">
             <template v-if="beansType == 12">
                 <div class="cmbeans-alert-image">
                     <img src="/img/account/icon-beans-12@2x.png" alt="">

src/main/resources/templates/user-center/order/detail.html

@@ -69,9 +69,10 @@
                                     <p v-if="orderInfo.freePostFlag == '0'">运费：<span class="none">包邮</span> </p>
                                     <p v-if="orderInfo.freePostFlag == '-1'">运费：<span class="none">到付</span> </p>
                                     <p v-if="orderInfo.freePostFlag == '1'">运费：<span class="none">￥{{orderInfo.freight | NumFormat}}</span> </p>
-                                    <p>采美豆抵用运费：<span class="none" v-if="orderInfo.userBeans>0">{{orderInfo.userBeans }}</span> </p>
+                                    <p v-if="orderInfo.userBeans>0">采美豆抵用运费：<span class="none" >{{orderInfo.userBeans }}</span> </p>
                                     <p v-if="orderInfo.discountFee>0">经理折扣：<span class="none">￥{{orderInfo.discountFee | NumFormat}}</span> </p>
                                     <p v-if="orderInfo.promotionFullReduction>0">促销满减：<span class="none">￥{{orderInfo.promotionFullReduction | NumFormat}}</span> </p>
+                                    <p>优惠券：<span class="red">￥{{orderInfo.promotionFullReduction | NumFormat}}</span> </p>
                                     <p v-if="orderInfo.presentCount>0">赠品数：<span class="none">{{orderInfo.presentCount}}</span></p>
                                 </div>
                             </div>
@@ -244,7 +245,7 @@
         </div>
     </div>
     <!-- 采美豆弹窗 -->
-    <div class="cmbeans-alert-box" v-if="isShowBeansAlet">
+    <div class="cmbeans-alert-box" v-if="isShowBeansAlet" :class="isShowBeansAlet ? 'show' : 'hide'">
         <div class="cmbeans-alert-content" :style="{'background-image': 'url('+bgImagePath+')'}">
             <div class="cmbeans-alert-content-text">恭喜您获得采美豆！</div>
             <div class="cmbeans-alert-content-bean">

src/main/resources/templates/user-center/order/list.html

@@ -139,7 +139,7 @@
         </div>
     </div>
     <!-- 采美豆弹窗 -->
-    <div class="cmbeans-alert-box" v-if="isShowBeansAlet">
+    <div class="cmbeans-alert-box" v-if="isShowBeansAlet" :class="isShowBeansAlet ? 'show' : 'hide'">
         <div class="cmbeans-alert-content" :style="{'background-image': 'url('+bgImagePath+')'}">
             <div class="cmbeans-alert-content-text">恭喜您获得采美豆！</div>
             <div class="cmbeans-alert-content-bean">