支付修改

src/main/resources/static/css/pay/caimei-pay.css

@@ -1,152 +1,152 @@
-/**
- * PC端
- */
-/*@media screen and (min-width:768px){*/
-    .inner{width: 1184px;margin: 0 auto;}
-    .container{width: 100%;height: auto;}
-    .head-wrap{width: 100%;height: 81px;float: left;background-color: #FFFFFF;margin-bottom: 26px;}
-    .head-wrap .inner{width:1184px;height: 81px;margin: 0 auto;    background-color: #FFFFFF;}
-.head-wrap .logo{width:228px;height: 76px;float: left;}
-.head-wrap .logo a{width:228px;height: 76px;display: block;}
-.head-wrap .logo a img{width:228px;height: 76px;display: block;}
-    .head-wrap .text{height: 81px;float: left;margin-left: 10px;line-height: 81px;font-size: 30px;color: #333333;}
-    .pay-container {width: 100%;min-height: 550px;position: relative;margin-bottom:0;opacity: 0;}
-    .pay-container.active{opacity: 1;}
-    .pay-content{width: 1184px;margin: 0 auto;height: auto;margin-top: 20px;}
-    .pay-title{width: 100%;height: 64px;padding: 12px 20px;float: left;background: #ffffff;margin-bottom: 20px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);box-sizing: border-box;}
-    .pay-title .title-left{float: left;}
-    .pay-title .title-left p{font-size: 24px;line-height: 40px;color: #333333;}
-    .pay-title .title-left #userName{font-size: 24px;color: #333333;}
-    .pay-title .title-left span{font-size: 16px;line-height: 40px;color: #666666;}
-    .pay-title .title-left span.color{color: #FF5B00;}
-    .pay-title .title-right{float: right;height: 40px;}
-    .pay-title .title-right .time{width: 172px;height: 40px;padding-left: 62px;background: url("/img/pay/icon-time.png")no-repeat;background-size: cover;box-sizing: border-box;}
-    .pay-title .title-right .time span{width: 24px;height: 24px;display: block;margin: 8px 5px;float: left;font-size: 16px;line-height: 24px;text-align: center;color: #FFFFFF;}
-    .pay-svip{margin-top:24px}
-    .pay-svip+.pay-method .method-title{background:#F5F5F5 !important}
-    .pay-svip .pay-svip-title{padding:0 0 16px 16px;font-size:16px;font-weight:400;color:#2D3036}
-    .pay-svip .content{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:1184px;height:78px;padding-left:112px;padding-right:24px;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(/img/member/pc-cm-svip-bg-03.png) no-repeat center;background-size:1184px 78px}
-    .pay-svip .pay-svip-detail{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}
-    .pay-svip .pay-svip-detail .tit{font-size:16px;font-weight:400;color:#4E4539;padding-bottom:4px}
-    .pay-svip .pay-svip-detail .pay-amount{margin-left:18px;font-size:28px;font-weight:bold;color:#4E4539}
-    .pay-svip .pay-svip-detail .pay-amount > span{font-size:12px;vertical-align:0}
-    .pay-svip .svip-indent{padding-top:24px;font-size:16px;font-weight:bold;color:#4E4539}
-    .pay-goods .good-top{width: 100%;float: left;box-sizing: border-box;}
-    .pay-goods .good-top .good-top-inner{width: 100%;height: 55px;padding: 0 20px;float: left;border-bottom: 1px solid #F7F7F7;box-sizing: border-box;}
-    .pay-goods .good-top .bot-left{float: right;height: 24px;line-height: 24px;font-size: 12px;padding: 16px 0 15px 0;color: #999999;cursor: pointer;}
-    .pay-goods .good-top .bot-left .icon-down{width: 24px;height: 24px;display: block;background: url("/img/pay/icon-bot.gif");float: left;}
-    .pay-goods .good-top .bot-left .icon-down.roter{transform: rotate(180deg);}
-    .pay-goods .good-top .bot-left p{float: left;margin-left: 5px;}
-    .pay-goods .good-top .bot-right{float: left;height: 55px;}
-    .pay-goods .good-top .bot-right .bot-num{float: left;line-height: 55px;margin-right: 30px;}
-    .pay-goods .good-top .bot-right .bot-num span{font-size: 14px;color: #333333;}
-    .pay-goods .good-top .bot-right .bot-num span.p{color: #333333;}
-    .pay-goods .good-top .bot-right .bot-num span.red{color: #FF2A2A;}
-    .pay-goods .good-top .ws-count-price{font-size: 24px;padding-top: 25px}
-    .pay-goods .good-top .ws-count-price span.red{color: #FF2A2A;font-weight: bold}
-    .pay-goods .good-top .ws-bot-right{padding: 20px 0;float: left}
-    .pay-goods .good-top .ws-bot-right .bot-num{float: left;margin-right: 30px;}
-    .pay-goods .good-top .good-top-inner{float: unset;height: auto}
-    .pay-goods{width: 100%;height: auto;float: left;background: #ffffff;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
-    .pay-goods .good-main{width: 100%;height: auto;float: left;}
-    .pay-goods .good-main .list-title{width: 100%;height: 40px;padding: 0 20px;float: left;box-sizing: border-box;}
-    .pay-goods .good-main .list-title .t-li{font-size: 14px;color: #333333;line-height: 44px;float: left;text-align: center;display: flex;align-items: center;flex-direction: column;}
-    .pay-goods .good-main .list-title .t-li:nth-child(1){width: 8%;}
-    .pay-goods .good-main .list-title .t-li:nth-child(2){width: 15%;}
-    .pay-goods .good-main .list-title .t-li:nth-child(3){width: 27%;}
-    .pay-goods .good-main .list-title .t-li:nth-child(4){width: 10%;}
-    .pay-goods .good-main .list-title .t-li:nth-child(5){width: 15%;}
-    .pay-goods .good-main .list-title .t-li:nth-child(6){width: 10%;}
-    .pay-goods .good-main .list-title .t-li:nth-child(7){width: 15%;}
-
-    .pay-goods .good-main .list-container{width: 100%;height: auto;background: #ffffff;padding: 10px 20px;float: left;border-bottom: 1px solid #F7F7F7;opacity: 1;box-sizing: border-box;}
-    .pay-goods .good-main .list-container.active{height: 0;opacity: 0;}
-    .pay-goods .good-main .list-container .list-main{width: 100%;height: 48px;float: left;}
-    .pay-goods .good-main .list-container .list-main.active{background-color: #F7F7F7;}
-    .pay-goods .good-main .list-container .list-main .t-li{position: relative; font-size: 14px;color: #333333;line-height: 48px;float: left;text-align: center;display: flex;align-items: center;flex-direction: column;}
-    .pay-goods .good-main .list-container .list-main .t-li:nth-child(1){width: 8%;}
-    .pay-goods .good-main .list-container .list-main .t-li:nth-child(2){width: 15%;}
-    .pay-goods .good-main .list-container .list-main .t-li:nth-child(3){width: 27%;text-align: justify;text-overflow:ellipsis;display: -webkit-box;word-break: break-all;-webkit-box-orient: vertical;-webkit-line-clamp: 1;overflow: hidden;}
-    .pay-goods .good-main .list-container .list-main .t-li:nth-child(4){width: 10%;}
-    .pay-goods .good-main .list-container .list-main .t-li:nth-child(5){width: 15%;}
-    .pay-goods .good-main .list-container .list-main .t-li:nth-child(6){width: 10%;}
-    .pay-goods .good-main .list-container .list-main .t-li:nth-child(7){width: 15%;}
-    .pay-goods .good-main .list-container .list-main .t-li img{width: 30px;height: 30px;border-radius: 5px;background-color: #f7f7f7;margin-top: 9px;}
-    .pay-goods .good-main .list-container .list-main .t-li .tag{display: block; position: absolute;z-index: 10;left: 50%;top: 33px;transform: translateX(-50%);width: 40px;font-size: 12px;background: #FF2A2A;color: #fff;line-height: 18px;text-align: center;border-radius: 0 0 4px 4px}
-    .pay-goods .good-main .ws-list-container .list-main {height: 60px !important;}
-    .pay-goods .good-main .ws-list-container .list-main .t-li img{width:40px;height: 40px;}
-    .pay-goods .good-main .list-total{text-align: right;font-size: 18px;padding: 20px 25px;float: right;margin-right: 60px}
-    .pay-goods .good-main .list-total span.red{color: #FF2A2A}
-    .pay-ment{width: 100%;height: auto;float: left;margin-top: 20px;}
-    .pay-ment .pay-message{width: 100%;height: 48px;box-sizing: border-box;line-height: 48px;float: left;background: #FFFFFF;padding: 0 20px;margin-bottom: 20px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
-    .pay-ment .pay-message .message-num{float: left;margin-right: 80px;font-size: 14px;color: #333333;}
-    .pay-ment .pay-message .message-num .red{color: #FF2A2A;}
-    .pay-ment .pay-record{width: 100%;height: auto;float: left;padding: 0 20px 20px 20px;background: #FFFFFF;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);box-sizing: border-box;}
-    .pay-ment .pay-record .record-title{width: 100%;line-height: 44px;font-size: 18px;color: #333333;text-align: left;}
-    .pay-ment .pay-record .record-content{width: 100%;height: auto;padding: 8px 20px;background: #F7F7F7;border: 5px;box-sizing: border-box;}
-    .pay-ment .pay-record .record-content .record-li{width: 100%;height: 30px;float: left;}
-    .pay-ment .pay-record .record-content .record-li.none{font-size: 14px;color: #999999;text-align: left;line-height: 30px;}
-    .pay-ment .pay-record .record-content .record-li .record-tb{width: 20%;height: 30px;float: left;font-size: 14px;color: #333333;text-align: left;line-height: 30px;}
-    .pay-ment .pay-record .record-content .record-li .record-tb:last-child{text-align: right;color: #999999;}
-    .pay-bank{width: 100%;height: auto;padding: 0 0 8px 0;background: #FFFFFF;margin-top: 20px;float: left;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
-    .pay-bank .bank-title{width: 100%;line-height: 54px;font-size: 18px;color: #333333;float: left;padding-left: 20px;box-sizing: border-box;}
-    .pay-bank .bank-title span.color{color: #FF5B00;font-size: 16px;}
-    .pay-bank .bank-title span.big{font-size: 24px;}
-    .pay-bank .bank-list{width: 100%;height: auto;padding-left: 8px;}
-    .pay-bank .bank-list a{width: 124px;height: 44px;;display: block;float: left;margin: 12px;border: 1px solid #FFFFFF;position: relative;border-radius: 2px;}
-    .pay-bank .bank-list a img{width: 100%;height: 100%;display: block;}
-    .pay-bank .bank-list a.active{border-color: #FF2A2A;}
-    .pay-bank .bank-list a.active:before{content: '';width: 20px;height: 20px;position: absolute;bottom: 0;right: -2px;background: url("/img/base/icon.png")-210px -252px no-repeat;}
-    .pay-error-content{width: 1184px;margin: 0 auto;height: 594px;background: #FFFFFF;}
-    .pay-error{width: 1184px;margin: 0 auto;height: 594px;background: #FFFFFF;float: left;margin-bottom: 20px;}
-    .pay-error .icon-error{width: 248px;height: 200px;margin: 0 auto;margin-top: 134px;}
-    .pay-error .icon-error.again{background: url("/img/pay/icon-error--1.png") no-repeat;background-size:contain ;}
-    .pay-error .icon-error.offline{background: url("/img/pay/icon-error--2.png") no-repeat;background-size:contain ;}
-    .pay-error .icon-error.fail{background: url("/img/pay/icon-error--3.png") no-repeat;background-size:contain ;}
-    .pay-error .icon-error.paid{background: url("/img/pay/icon-error-5.png") no-repeat;background-size:contain ;}
-    .pay-error .error-msg{font-size: 16px;color: #333333;text-align: center;line-height: 22px;margin-top: 10px;}
-    .pay-error .error-msgnone{font-size: 16px;color: #999999;text-align: center;line-height: 22px;margin-top: 10px;}
-    .pay-alert-content{width: 100%;height: 100%;position: fixed;top: 0;left: 0;background: rgba(0,0,0,0.3);z-index: 9999;}
-    .pay-alert-content .pay-alert{width: 340px;height: 208px;background: #FFFFFF;border-radius: 2px;position: absolute;top: 0;right: 0;left: 0;bottom: 0;margin: auto;z-index: 9998;}
-    .pay-alert-content .pay-alert .title{width: 100%;height: 48px;box-sizing: border-box;font-size: 14px;line-height: 48px;text-align: left;color: #333333;float: left;position: relative;border-bottom: 1px solid #EFEFEF;background-color: #F8F8F8;padding: 0 14px;}
-    .pay-alert-content .pay-alert .title .icon-close{width: 16px;height: 16px;display: block;position: absolute;right:12px;top: 12px;background: url("/img/base/icon.png")-319px 0 no-repeat;cursor: pointer;}
-    .pay-alert-content .pay-alert .content{margin: 30px 0;width: 100%;height: auto;line-height: 24px;float: left;padding: 0 14px;}
-    .pay-alert-content .pay-alert .content h1{text-align: left;font-size: 16px;color: #333333;font-weight: normal;}
-    .pay-alert-content .pay-alert .content p{text-align: left;font-size: 14px;color: #666666;font-weight: normal;}
-    .pay-alert-content .pay-alert .button{width: 100%;height: 32px;float: left;padding: 0 14px;box-sizing: border-box;}
-    .pay-alert-content .pay-alert .button a{width: 90px;height: 32px;display: block;background: #FF5B00;border-radius: 2px;font-size: 14px;text-align: center;line-height: 32px;color: #FFFFFF;float: right;}
-    .pay-button-main{margin-top:30px;width: 100%;height: 72px;box-sizing: border-box;padding: 11px 0;background-color: #FFFFFF;float: left;border-bottom: 1px solid #EBEBEB;}
-    .pay-button-main .pay-button{width: 100%;height: 50px;float: left;}
-    .pay-button-main .pay-button a{width: 232px;height: 50px;display: block;background:linear-gradient(90deg, #FF9300 0%, #FF5B00 100%);border-radius: 2px;font-size: 14px;line-height: 50px;text-align: center;color: #FFF6D9;float: right;}
-    .pay-button-main .pay-button a.disabled{background: #EFEFEF;color:#999999;}
-    .footTop{margin-top: 0;}
-
-/*}*/
-
-/**
-* 移动端
-*/
-/*@media screen and (max-width:768px){*/
-/*    .head-wrap{box-sizing:border-box;padding:0 3.2vw;height:15vw;line-height:15vw;background:#FFF;font-size:4.6vw}*/
-/*    .head-wrap .logo{height:15vw;float:left;margin-right:3vw}*/
-/*    .head-wrap .logo img{height:15vw}*/
-/*    .pay-title,.pay-goods{margin-top:2.6vw;background:#FFF;position:relative;padding:2.6vw 3.2vw;line-height:7vw}*/
-/*    .pay-title .title-left p span{display:block;color:#FF5B00;font-size:3.4vw}*/
-/*    .pay-title .title-left p span:first-child{color:#333;font-size:4.2vw}*/
-/*    .pay-title .title-right{text-align:right}*/
-/*    .pay-title .title-right .time{box-sizing:border-box;padding-right:2vw;display:inline-block;width:40vw;height:10vw;line-height:9vw;background:url(/img/pay/icon-time.png)no-repeat;background-size:100% 100%}*/
-/*    .pay-title .title-right .time span{display:inline-block;width:7vw;text-align:center;color:#FFF;vertical-align:middle}*/
-/*    .pay-goods .bot-num{display:inline-block;width: 49%;}*/
-/*    .pay-goods .bot-num span.red{color: #FF2A2A;}*/
-/*    .pay-goods .bot-left{text-align: right;color: #999999;line-height: 10vw;}*/
-/*    .pay-goods .bot-left p{display:inline-block;}*/
-/*    .pay-goods .bot-left .icon-down {display:inline-block;width: 4vw;height: 4vw;background: url(/img/pay/icon-bot.gif);background-size: 100% 100%;vertical-align: text-bottom;}*/
-/*    .pay-goods .list-title{display: none;}*/
-
-
-
-
-
-
-/*}*/
-
+/**
+ * PC端
+ */
+/*@media screen and (min-width:768px){*/
+    .inner{width: 1184px;margin: 0 auto;}
+    .container{width: 100%;height: auto;}
+    .head-wrap{width: 100%;height: 81px;float: left;background-color: #FFFFFF;margin-bottom: 26px;}
+    .head-wrap .inner{width:1184px;height: 81px;margin: 0 auto;    background-color: #FFFFFF;}
+.head-wrap .logo{width:228px;height: 76px;float: left;}
+.head-wrap .logo a{width:228px;height: 76px;display: block;}
+.head-wrap .logo a img{width:228px;height: 76px;display: block;}
+    .head-wrap .text{height: 81px;float: left;margin-left: 10px;line-height: 81px;font-size: 30px;color: #333333;}
+    .pay-container {width: 100%;min-height: 550px;position: relative;margin-bottom:0;opacity: 0;}
+    .pay-container.active{opacity: 1;}
+    .pay-content{width: 1184px;margin: 0 auto;height: auto;margin-top: 20px;}
+    .pay-title{width: 100%;height: 64px;padding: 12px 20px;float: left;border-radius: 8px; background: #ffffff;margin-bottom: 20px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);box-sizing: border-box;}
+    .pay-title .title-left{float: left;}
+    .pay-title .title-left p{font-size: 24px;line-height: 40px;color: #333333;}
+    .pay-title .title-left #userName{font-size: 24px;color: #333333;}
+    .pay-title .title-left span{font-size: 16px;line-height: 40px;color: #666666;}
+    .pay-title .title-left span.color{color: #FF5B00;}
+    .pay-title .title-right{float: right;height: 40px;}
+    .pay-title .title-right .time{width: 172px;height: 40px;padding-left: 62px;background: url("/img/pay/icon-time.png")no-repeat;background-size: cover;box-sizing: border-box;}
+    .pay-title .title-right .time span{width: 24px;height: 24px;display: block;margin: 8px 5px;float: left;font-size: 16px;line-height: 24px;text-align: center;color: #FFFFFF;}
+    .pay-svip{margin-top:24px}
+    .pay-svip+.pay-method .method-title{background:#F5F5F5 !important}
+    .pay-svip .pay-svip-title{padding:0 0 16px 16px;font-size:16px;font-weight:400;color:#2D3036}
+    .pay-svip .content{border-radius: 8px; display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:1184px;height:78px;padding-left:112px;padding-right:24px;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(/img/member/pc-cm-svip-bg-03.png) no-repeat center;background-size:1184px 78px}
+    .pay-svip .pay-svip-detail{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}
+    .pay-svip .pay-svip-detail .tit{font-size:16px;font-weight:400;color:#4E4539;padding-bottom:4px}
+    .pay-svip .pay-svip-detail .pay-amount{margin-left:18px;font-size:28px;font-weight:bold;color:#4E4539}
+    .pay-svip .pay-svip-detail .pay-amount > span{font-size:12px;vertical-align:0}
+    .pay-svip .svip-indent{padding-top:24px;font-size:16px;font-weight:bold;color:#4E4539}
+    .pay-goods .good-top{width: 100%;float: left;box-sizing: border-box;}
+    .pay-goods .good-top .good-top-inner{width: 100%;height: 55px;padding: 0 20px;float: left;border-bottom: 1px solid #F7F7F7;box-sizing: border-box;}
+    .pay-goods .good-top .bot-left{float: right;height: 24px;line-height: 24px;font-size: 12px;padding: 16px 0 15px 0;color: #999999;cursor: pointer;}
+    .pay-goods .good-top .bot-left .icon-down{width: 24px;height: 24px;display: block;background: url("/img/pay/icon-bot.gif");float: left;}
+    .pay-goods .good-top .bot-left .icon-down.roter{transform: rotate(180deg);}
+    .pay-goods .good-top .bot-left p{float: left;margin-left: 5px;}
+    .pay-goods .good-top .bot-right{float: left;height: 55px;}
+    .pay-goods .good-top .bot-right .bot-num{float: left;line-height: 55px;margin-right: 30px;}
+    .pay-goods .good-top .bot-right .bot-num span{font-size: 14px;color: #333333;}
+    .pay-goods .good-top .bot-right .bot-num span.p{color: #333333;}
+    .pay-goods .good-top .bot-right .bot-num span.red{color: #FF2A2A;}
+    .pay-goods .good-top .ws-count-price{font-size: 24px;padding-top: 25px}
+    .pay-goods .good-top .ws-count-price span.red{color: #FF2A2A;font-weight: bold}
+    .pay-goods .good-top .ws-bot-right{padding: 20px 0;float: left}
+    .pay-goods .good-top .ws-bot-right .bot-num{float: left;margin-right: 30px;}
+    .pay-goods .good-top .good-top-inner{float: unset;height: auto}
+    .pay-goods{width: 100%;height: auto;float: left;background: #ffffff;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
+    .pay-goods .good-main{width: 100%;height: auto;float: left;}
+    .pay-goods .good-main .list-title{width: 100%;height: 40px;padding: 0 20px;float: left;box-sizing: border-box;}
+    .pay-goods .good-main .list-title .t-li{font-size: 14px;color: #333333;line-height: 44px;float: left;text-align: center;display: flex;align-items: center;flex-direction: column;}
+    .pay-goods .good-main .list-title .t-li:nth-child(1){width: 8%;}
+    .pay-goods .good-main .list-title .t-li:nth-child(2){width: 15%;}
+    .pay-goods .good-main .list-title .t-li:nth-child(3){width: 27%;}
+    .pay-goods .good-main .list-title .t-li:nth-child(4){width: 10%;}
+    .pay-goods .good-main .list-title .t-li:nth-child(5){width: 15%;}
+    .pay-goods .good-main .list-title .t-li:nth-child(6){width: 10%;}
+    .pay-goods .good-main .list-title .t-li:nth-child(7){width: 15%;}
+
+    .pay-goods .good-main .list-container{width: 100%;height: auto;background: #ffffff;padding: 10px 20px;float: left;border-bottom: 1px solid #F7F7F7;opacity: 1;box-sizing: border-box;}
+    .pay-goods .good-main .list-container.active{height: 0;opacity: 0;}
+    .pay-goods .good-main .list-container .list-main{width: 100%;height: 48px;float: left;}
+    .pay-goods .good-main .list-container .list-main.active{background-color: #F7F7F7;}
+    .pay-goods .good-main .list-container .list-main .t-li{position: relative; font-size: 14px;color: #333333;line-height: 48px;float: left;text-align: center;display: flex;align-items: center;flex-direction: column;}
+    .pay-goods .good-main .list-container .list-main .t-li:nth-child(1){width: 8%;}
+    .pay-goods .good-main .list-container .list-main .t-li:nth-child(2){width: 15%;}
+    .pay-goods .good-main .list-container .list-main .t-li:nth-child(3){width: 27%;text-align: justify;text-overflow:ellipsis;display: -webkit-box;word-break: break-all;-webkit-box-orient: vertical;-webkit-line-clamp: 1;overflow: hidden;}
+    .pay-goods .good-main .list-container .list-main .t-li:nth-child(4){width: 10%;}
+    .pay-goods .good-main .list-container .list-main .t-li:nth-child(5){width: 15%;}
+    .pay-goods .good-main .list-container .list-main .t-li:nth-child(6){width: 10%;}
+    .pay-goods .good-main .list-container .list-main .t-li:nth-child(7){width: 15%;}
+    .pay-goods .good-main .list-container .list-main .t-li img{width: 30px;height: 30px;border-radius: 5px;background-color: #f7f7f7;margin-top: 9px;}
+    .pay-goods .good-main .list-container .list-main .t-li .tag{display: block; position: absolute;z-index: 10;left: 50%;top: 33px;transform: translateX(-50%);width: 40px;font-size: 12px;background: #FF2A2A;color: #fff;line-height: 18px;text-align: center;border-radius: 0 0 4px 4px}
+    .pay-goods .good-main .ws-list-container .list-main {height: 60px !important;}
+    .pay-goods .good-main .ws-list-container .list-main .t-li img{width:40px;height: 40px;}
+    .pay-goods .good-main .list-total{text-align: right;font-size: 18px;padding: 20px 25px;float: right;margin-right: 60px}
+    .pay-goods .good-main .list-total span.red{color: #FF2A2A}
+    .pay-ment{width: 100%;height: auto;float: left;margin-top: 20px;}
+    .pay-ment .pay-message{width: 100%;height: 48px;box-sizing: border-box;line-height: 48px;float: left;background: #FFFFFF;padding: 0 20px;margin-bottom: 20px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
+    .pay-ment .pay-message .message-num{float: left;margin-right: 80px;font-size: 14px;color: #333333;}
+    .pay-ment .pay-message .message-num .red{color: #FF2A2A;}
+    .pay-ment .pay-record{width: 100%;height: auto;float: left;padding: 0 20px 20px 20px;background: #FFFFFF;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);box-sizing: border-box;}
+    .pay-ment .pay-record .record-title{width: 100%;line-height: 44px;font-size: 18px;color: #333333;text-align: left;}
+    .pay-ment .pay-record .record-content{width: 100%;height: auto;padding: 8px 20px;background: #F7F7F7;border: 5px;box-sizing: border-box;}
+    .pay-ment .pay-record .record-content .record-li{width: 100%;height: 30px;float: left;}
+    .pay-ment .pay-record .record-content .record-li.none{font-size: 14px;color: #999999;text-align: left;line-height: 30px;}
+    .pay-ment .pay-record .record-content .record-li .record-tb{width: 20%;height: 30px;float: left;font-size: 14px;color: #333333;text-align: left;line-height: 30px;}
+    .pay-ment .pay-record .record-content .record-li .record-tb:last-child{text-align: right;color: #999999;}
+    .pay-bank{width: 100%;height: auto;padding: 0 0 8px 0;border-radius: 8px; background: #FFFFFF;margin-top: 20px;float: left;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
+    .pay-bank .bank-title{width: 100%;line-height: 54px;font-size: 18px;color: #333333;float: left;padding-left: 20px;box-sizing: border-box;}
+    .pay-bank .bank-title span.color{color: #FF5B00;font-size: 16px;}
+    .pay-bank .bank-title span.big{font-size: 24px;}
+    .pay-bank .bank-list{width: 100%;height: auto;padding-left: 8px;}
+    .pay-bank .bank-list a{width: 124px;height: 44px;;display: block;float: left;margin: 12px;border: 1px solid #FFFFFF;position: relative;border-radius: 2px;}
+    .pay-bank .bank-list a img{width: 100%;height: 100%;display: block;}
+    .pay-bank .bank-list a.active{border-color: #FF2A2A;}
+    .pay-bank .bank-list a.active:before{content: '';width: 20px;height: 20px;position: absolute;bottom: 0;right: -2px;background: url("/img/base/icon.png")-210px -252px no-repeat;}
+    .pay-error-content{width: 1184px;margin: 0 auto;height: 594px;background: #FFFFFF;}
+    .pay-error{width: 1184px;margin: 0 auto;height: 594px;background: #FFFFFF;float: left;margin-bottom: 20px;}
+    .pay-error .icon-error{width: 248px;height: 200px;margin: 0 auto;margin-top: 134px;}
+    .pay-error .icon-error.again{background: url("/img/pay/icon-error--1.png") no-repeat;background-size:contain ;}
+    .pay-error .icon-error.offline{background: url("/img/pay/icon-error--2.png") no-repeat;background-size:contain ;}
+    .pay-error .icon-error.fail{background: url("/img/pay/icon-error--3.png") no-repeat;background-size:contain ;}
+    .pay-error .icon-error.paid{background: url("/img/pay/icon-error-5.png") no-repeat;background-size:contain ;}
+    .pay-error .error-msg{font-size: 16px;color: #333333;text-align: center;line-height: 22px;margin-top: 10px;}
+    .pay-error .error-msgnone{font-size: 16px;color: #999999;text-align: center;line-height: 22px;margin-top: 10px;}
+    .pay-alert-content{width: 100%;height: 100%;position: fixed;top: 0;left: 0;background: rgba(0,0,0,0.3);z-index: 9999;}
+    .pay-alert-content .pay-alert{width: 340px;height: 208px;background: #FFFFFF;border-radius: 2px;position: absolute;top: 0;right: 0;left: 0;bottom: 0;margin: auto;z-index: 9998;}
+    .pay-alert-content .pay-alert .title{width: 100%;height: 48px;box-sizing: border-box;font-size: 14px;line-height: 48px;text-align: left;color: #333333;float: left;position: relative;border-bottom: 1px solid #EFEFEF;background-color: #F8F8F8;padding: 0 14px;}
+    .pay-alert-content .pay-alert .title .icon-close{width: 16px;height: 16px;display: block;position: absolute;right:12px;top: 12px;background: url("/img/base/icon.png")-319px 0 no-repeat;cursor: pointer;}
+    .pay-alert-content .pay-alert .content{margin: 30px 0;width: 100%;height: auto;line-height: 24px;float: left;padding: 0 14px;}
+    .pay-alert-content .pay-alert .content h1{text-align: left;font-size: 16px;color: #333333;font-weight: normal;}
+    .pay-alert-content .pay-alert .content p{text-align: left;font-size: 14px;color: #666666;font-weight: normal;}
+    .pay-alert-content .pay-alert .button{width: 100%;height: 32px;float: left;padding: 0 14px;box-sizing: border-box;}
+    .pay-alert-content .pay-alert .button a{width: 90px;height: 32px;display: block;background: #FF5B00;border-radius: 2px;font-size: 14px;text-align: center;line-height: 32px;color: #FFFFFF;float: right;}
+    .pay-button-main{margin-top:30px;width: 100%;height: 72px;box-sizing: border-box;padding: 11px 0;background-color: #FFFFFF;float: left;border-bottom: 1px solid #EBEBEB;}
+    .pay-button-main .pay-button{width: 100%;height: 50px;float: left;}
+    .pay-button-main .pay-button a{width: 232px;height: 50px;display: block;background:linear-gradient(90deg, #FF9300 0%, #FF5B00 100%);border-radius: 26px;font-size: 14px;line-height: 50px;text-align: center;color: #FFF6D9;float: right;}
+    .pay-button-main .pay-button a.disabled{background: #EFEFEF;color:#999999;}
+    .footTop{margin-top: 0;}
+
+/*}*/
+
+/**
+* 移动端
+*/
+/*@media screen and (max-width:768px){*/
+/*    .head-wrap{box-sizing:border-box;padding:0 3.2vw;height:15vw;line-height:15vw;background:#FFF;font-size:4.6vw}*/
+/*    .head-wrap .logo{height:15vw;float:left;margin-right:3vw}*/
+/*    .head-wrap .logo img{height:15vw}*/
+/*    .pay-title,.pay-goods{margin-top:2.6vw;background:#FFF;position:relative;padding:2.6vw 3.2vw;line-height:7vw}*/
+/*    .pay-title .title-left p span{display:block;color:#FF5B00;font-size:3.4vw}*/
+/*    .pay-title .title-left p span:first-child{color:#333;font-size:4.2vw}*/
+/*    .pay-title .title-right{text-align:right}*/
+/*    .pay-title .title-right .time{box-sizing:border-box;padding-right:2vw;display:inline-block;width:40vw;height:10vw;line-height:9vw;background:url(/img/pay/icon-time.png)no-repeat;background-size:100% 100%}*/
+/*    .pay-title .title-right .time span{display:inline-block;width:7vw;text-align:center;color:#FFF;vertical-align:middle}*/
+/*    .pay-goods .bot-num{display:inline-block;width: 49%;}*/
+/*    .pay-goods .bot-num span.red{color: #FF2A2A;}*/
+/*    .pay-goods .bot-left{text-align: right;color: #999999;line-height: 10vw;}*/
+/*    .pay-goods .bot-left p{display:inline-block;}*/
+/*    .pay-goods .bot-left .icon-down {display:inline-block;width: 4vw;height: 4vw;background: url(/img/pay/icon-bot.gif);background-size: 100% 100%;vertical-align: text-bottom;}*/
+/*    .pay-goods .list-title{display: none;}*/
+
+
+
+
+
+
+/*}*/
+

src/main/resources/static/css/pay/caimei-paycash.css

@@ -47,7 +47,7 @@ input::-webkit-outer-spin-button {
     .pay-svip{margin-top:24px}
     .pay-svip+.pay-method .method-title{background:#F5F5F5 !important}
     .pay-svip .pay-svip-title{padding:0 0 16px 16px;font-size:16px;font-weight:400;color:#2D3036}
-    .pay-svip .content{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:1184px;height:78px;padding-left:112px;padding-right:24px;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(/img/member/pc-cm-svip-bg-03.png) no-repeat center;background-size:1184px 78px}
+    .pay-svip .content{border-radius: 8px; display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:1184px;height:78px;padding-left:112px;padding-right:24px;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(/img/member/pc-cm-svip-bg-03.png) no-repeat center;background-size:1184px 78px}
     .pay-svip .pay-svip-detail{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}
     .pay-svip .pay-svip-detail .tit{font-size:16px;font-weight:400;color:#4E4539;padding-bottom:4px}
     .pay-svip .pay-svip-detail .pay-amount{margin-left:18px;font-size:28px;font-weight:bold;color:#4E4539}
@@ -55,7 +55,7 @@ input::-webkit-outer-spin-button {
     .pay-svip .svip-indent{padding-top:24px;font-size:16px;font-weight:bold;color:#4E4539}
     /*优惠券*/
     .pay-coupontitle{line-height: 72px;font-size: 24px;width: 100%;box-sizing: border-box;padding: 0 16px;font-weight: bold;}
-    .pay-coupon{width: 100%;height: 118px;box-sizing: border-box;padding: 16px;background: #FFFFFF;}
+    .pay-coupon{width: 100%;height: 118px;box-sizing: border-box;padding: 16px;background: #FFFFFF;border-radius: 8px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
     .pay-coupon .pay-coupon-title{width: 100%;line-height: 24px;font-size: 18px;color: #333333;margin-bottom: 16px;}
     .pay-coupon .pay-coupon-title span{color: #FF5B00;}
     .pay-coupon .pay-coupon-content{font-size: 24px;color: #333333;line-height: 32px;}
@@ -145,8 +145,12 @@ input::-webkit-outer-spin-button {
     .payment-transfer{width: 100%;height: auto;padding: 0 24px;}
     .pay-button-main{width: 100%;height: 72px;box-sizing: border-box;padding: 11px 0;background-color: #FFFFFF;float: left;border-bottom: 1px solid #EBEBEB;}
     .pay-button-main .pay-button{width: 100%;height: 50px;float: left;}
-    .pay-button-main .pay-button a{width: 232px;height: 50px;display: block;background:linear-gradient(90deg, #FF9300 0%, #FF5B00 100%);border-radius: 25px;font-size: 14px;line-height: 50px;text-align: center;color: #FFF6D9;float: right;}
+    .pay-button-main .pay-button a{width: 232px;height: 50px;font-weight: 600; display: block;background:linear-gradient(90deg, #FF9300 0%, #FF5B00 100%);border-radius: 25px;font-size: 15px;line-height: 50px;text-align: center;color: #FFF6D9;float: right;}
     .pay-button-main .pay-button a.disabled{background: #EFEFEF;color:#999999;}
+    .pay-button-main .pay-button a.ali{background: #3D8FFB;}
+    .pay-button-main .pay-button a.wechat{background: #07c160;}
+    .pay-button-main .pay-button a.onpay{background: #007ACC;}
+    .pay-button-main .pay-button a.pepay{background: #16AFE8;}
     .footTop{margin-top: 0;}
     .jconfirm .jconfirm-box div.jconfirm-closeIcon{display: none !important;}
 

src/main/resources/static/css/pay/caimei-paylist.css

@@ -10,13 +10,13 @@
     .pay-content .pay-title-le{float: left;line-height: 28px;font-size: 16px;color: #333333;font-weight: bold;}
     .pay-content .pay-title-le span{line-height: 28px;font-size: 14px;color: #FF5B00;font-weight: normal;}
     .pay-content .pay-title-btn{float: right;padding: 0 10px;background: #1890F9;height: 28px;line-height: 28px;text-align: center;border-radius: 4px;font-size: 12px;color: #FFFFFF;cursor: pointer;}
-    .pay-list-title{width: 100%;height: 56px;background-color: #FFFFFF;padding: 0 16px;box-sizing: border-box;margin-bottom: 10px;}
+    .pay-list-title{width: 100%;height: 56px;border-radius: 8px; background-color: #FFFFFF;padding: 0 16px;box-sizing: border-box;margin-bottom: 10px;}
     .pay-list-title .pay-list-view{float: left;line-height: 56px;font-size: 14px;color: #627386;text-align: left;}
     .pay-list-title .pay-list-view.t1{width: 40%;}
     .pay-list-title .pay-list-view.t2{width: 20%;}
     .pay-list-title .pay-list-view.t3{width: 15%;}
     .pay-list-title .pay-list-view.t4{width: 10%;}
-    .pay-list-cell{width: 100%;height: auto;box-sizing: border-box;padding: 0 16px 20px 16px;background-color: #FFFFFF;margin-bottom: 10px;}
+    .pay-list-cell{width: 100%;height: auto;border-radius: 8px;box-sizing: border-box;padding: 0 16px 20px 16px;background-color: #FFFFFF;margin-bottom: 10px;}
     .pay-list-cell .list-cell-title{width: 100%;height:60px;box-sizing: border-box;padding:10px 0;border-bottom: 1px solid #E1E1E1;}
     .pay-list-cell .list-cell-title .list-cell-logo{width: 40px;height: 40px;box-sizing: border-box;border: 1px solid #E1E1E1;border-radius: 2px;float: left;}
     .pay-list-cell .list-cell-title .list-cell-logo img{width: 39px;height: 39px;display: block;}
@@ -46,7 +46,7 @@
     /*  弹窗  */
     .pay-alert-content{width: 100%;height: 100%;position: fixed;top: 0;left: 0;background: rgba(0,0,0,0.3);z-index: 9999;opacity: 0;}
     .pay-alert-content.show{opacity: 1;}
-    .pay-alert-content .pay-big-alert{width: 440px;height: 402px;background: #FFFFFF;border-radius: 2px;position: absolute;top: 0;right: 0;left: 0;bottom: 0;margin: auto;z-index: 9998;}
+    .pay-alert-content .pay-big-alert{width: 440px;height: 402px;background: #FFFFFF;border-radius: 8px;overflow: hidden; position: absolute;top: 0;right: 0;left: 0;bottom: 0;margin: auto;z-index: 9998;}
     .pay-alert-content .pay-big-alert .title{width: 100%;height: 48px;box-sizing: border-box;font-size: 14px;line-height: 48px;text-align: left;color: #333333;float: left;position: relative;border-bottom: 1px solid #EFEFEF;background-color: #FFFFFF;padding: 0 14px;}
     .pay-alert-content .pay-big-alert .title .icon-close{width: 16px;height: 16px;display: block;position: absolute;right:12px;top: 12px;background: url("/img/base/icon.png")-312px 0 no-repeat;cursor: pointer;}
     .pay-alert-content .pay-big-alert .content{width: 100%;height: 225px;line-height: 24px;float: left;padding: 16px;box-sizing: border-box;}

src/main/resources/static/css/user-center/order/remarks-add-pay.css

@@ -1,7 +1,7 @@
 @media screen and (min-width:768px) {
     textarea::placeholder {color: #9aa5b5;}
     .crumbs {font-size: 16px;color: #22272e}
-    .add-logistics{height: 600px;background-color: #ffffff;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);padding:80px 160px;color: #627386;box-sizing: border-box;}
+    .add-logistics{height: 600px;background-color: #ffffff;border-radius: 8px;overflow: hidden; box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);padding:80px 160px;color: #627386;box-sizing: border-box;}
     .add-pay-form{width: 100%;height: 100%;box-sizing: border-box;}
     .mIcon.add{background: url(/img/account/add.png) no-repeat;height: 90px;display: block;background-size: 100px;}
     .upload-file{position: relative;float: left;margin: 10px 10px 10px 0px;cursor: pointer;width: 100px;height: 100px;border-radius: 2px;box-sizing: border-box;border: 1px dashed #B8BFCA;}

src/main/resources/static/js/base.js

@@ -67,6 +67,7 @@ const globalHead = new Vue({
         },
         noticeNum: 0,
         shopId: '',
+        userId: 0,
         userIdentity: '',
         articleType: '',
         isFiexd: false,
@@ -330,6 +331,7 @@ const globalHead = new Vue({
         this.initClassufyTab();
         var userData = JSON.parse(window.localStorage.getItem('userInfo'));
         if (userData != null) {
+            this.userId = userData.userId;
             this.userIdentity = userData.userIdentity;
             this.shopId = userData.shopId;
         }

src/main/resources/static/js/pay/mixin/cardsMixns.js

@@ -1,282 +1,286 @@
-// 快捷支付银行卡
-const defaultParams = {
-    userId: globalUserData.userId, //机构UserId
-    quickPayBankNumber: '', //快捷支付用户银行卡号/信用卡号
-    quickPayMobile: '', //快捷支付银行卡绑定手机号
-    quickPayBankExpireTime: '', //快捷支付信用卡过期时间,只包含年月，格式yy-MM
-    quickPayUserName: '', //快捷支付用户姓名
-    idCard: '', //身份证号
-    cvvCode: '' //信用卡安全码
-}
-const defaultCodeParams = {
-    orderId:'',
-    infoId:'',
-    bindCode:'',
-    flag:2,// 1绑卡 2 付款
-}
-var cardsMixns = function () {
-    return {
-        data() {
-            return {
-                bankList:[],
-                cardtype:'1',
-                maxLen:24,
-                isPopup:false,
-                current:'',
-                bankTabsIndex:1,
-                tabsIndex:1,
-                bankIndex:'',
-                isCardStep:1,
-                isHassCardStep:0,
-                isShowSupport:false,
-                checkedCards:{},
-                params: Object.assign({}, defaultParams),
-                codeParams:Object.assign({}, defaultCodeParams),
-                showCardNumber:'',
-                mobilCount:0,
-                mobileCodeText:'获取验证码',
-                mobilTime:null,
-                isMobileDisabled:false,
-                isPayCodeAlert:false,
-                errorMsg:'',
-                isErrorMsg:false
-            }
-        },
-        filters: {
-            cardsFormat(valus) {
-                // 银行卡只显示最后四位数 ,隐藏信息用*代替
-                return  valus.replace(/^(\d{4})\d+(\d{4})$/,"$1****$2")
-            },
-            bankNumeberFilter(value){
-                return value.substring(value.length-4,value.length)
-            }
-        },
-        computed: {
-            disabled() {
-                return !(this.bankIndex === 0 || this.bankIndex > 0);
-            },
-            disabled1() {
-                return !(this.params.quickPayUserName && this.params.quickPayBankNumber.length > 18);
-            },
-            disabled2() {
-                return this.params.quickPayBankNumber.length <= 12;
-            },
-            disabled3() {
-                if (this.cardtype === '1') {
-                    return !(
-                        this.params.quickPayUserName !== '' &&
-                        this.params.idCard !== '' &&
-                        this.params.quickPayMobile !== ''
-                    )
-                } else {
-                    return !(
-                        this.params.quickPayUserName !== '' &&
-                        this.params.idCard !== '' &&
-                        this.params.quickPayMobile !== '' &&
-                        this.params.quickPayBankExpireTime !== '' &&
-                        this.params.cvvCode !== ''
-                    )
-                }
-            },
-            disabled4() {
-                return !(this.codeParams.bindCode && this.codeParams.bindCode.length === 6 );
-            },
-            phoneNumbe() {
-                // 手机号仅显示前三位及后四位数字，隐藏信息用*代替
-                return this.params.quickPayMobile.substr(0, 3) + '****' + this.params.quickPayMobile.substring(7)
-            },
-        },
-        methods: {
-            orderPayQuickPay() {
-                //绑卡支付
-                const _self = this;
-                this.params.payAmount = this.payAmount;
-                PayApi.orderPayQuickPay(this.params,function(response){
-                    if(response.code === 0){
-                        _self.codeParams = {..._self.codeParams ,...response.data};
-                        console.log('_self.codeParams',_self.codeParams)
-                        _self.handleCodeTime()
-                        setTimeout(() => {
-                            _self.isPayCodeAlert = true
-                        }, 500)
-                    }else{
-                        console.log('获取绑卡验证码失败')
-                    }
-                })
-            },
-            handleCodeTime() {
-                // 倒计时
-                const _self = this;
-                const TIME_COUNT = 60;
-                if (!_self.mobilTime) {
-                    _self.mobilCount = TIME_COUNT;
-                    _self.isMobileDisabled = true;
-                    _self.mobilTime = setInterval(function(){
-                        if (_self.mobilCount > 1 && _self.mobilCount <= TIME_COUNT) {
-                            _self.mobilCount--;
-                            _self.mobileCodeText = _self.mobilCount +'秒后重发';
-                        } else {
-                            _self.isMobileDisabled = false;
-                            clearInterval(_self.mobilTime);
-                            _self.mobilTime = null;
-                            _self.mobileCodeText = '获取验证码';
-                        }
-                    },1000)
-                }
-            },
-            handleConfirm(){
-                //校验并绑定
-                const _self = this;
-                if(this.disabled4){ return }
-                PayApi.orderPayQuickBindCode(this.codeParams,function(response){
-                    if(response.code === 0){
-                        CAIMEI.dialog('绑卡成功');
-                        setTimeout(() => {
-                            _self.isPopup = false;
-                        }, 2000)
-                    }else{
-                        console.log('绑卡失败')
-                    }
-                })
-            },
-            handleCheckQuickCode(){
-                // 校验并支付
-                const _self = this;
-                PayApi.orderPayQuickBindCode(this.codeParams,function(response){
-                    if(response.code === 0){
-                        _self.isPayCodeAlert = false
-                        _self.windowLocationHref('success');
-                    }else if(response.code === -2){
-                        _self.isErrorMsg = true
-                        _self.errorMsg = response.msg
-                    }else{
-                        _self.isPayCodeAlert = false
-                        CAIMEI.dialog(response.msg);
-                    }
-                })
-            },
-            orderPayQuickBankInfos (cardType) {// 获取网银支付银行列表
-                const _self = this
-                PayApi.orderPayQuickBankInfos({ cardType:cardType },function(response){
-                    if(response.code === 0){
-                        _self.bankList = response.data;
-
-                    }else{
-                        console.log('获取网银支付银行列表异常')
-                    }
-                })
-            },
-            userClubBanks(){//查询银行卡列表
-                const _self = this;
-                PayApi.userClubBanks({ userId : this.params.userId  },function (response) {
-                    if(response.code === 0){
-                        _self.list = response.data;
-                        _self.isRequset = false;
-                    }else{
-                        CAIMEI.Alert(response.msg, '确定', false);
-                    }
-                })
-            },
-            handleCardStep(){
-                // 选择银行下一步
-                if(this.disabled){ return }
-                this.isCardStep = 1
-            },
-            handleHassCardStep(){
-                // 选择银行下一步
-                if(this.disabled2){ return }
-                this.isHassCardStep = 1
-            },
-            handleGetBindCode(){
-                //获取短信验证码
-                const reg = /^1\d{10}$/;
-                if(this.disabled3){ return }
-                if(!reg.test(this.params.quickPayMobile)){
-                    CAIMEI.dialog('请输入正确的手机号');
-                    return
-                }
-                this.isPopup = false;
-                this.orderPayQuickPay();
-            },
-            handleBankTabsClick(index){
-                // 切换借记卡&贷记卡
-                this.bankTabsIndex = index
-                this.orderPayQuickBankInfos(index)
-            },
-            handleTabsClick(index){
-                // 切换
-                console.log('tabsIndex',index)
-                this.tabsIndex = index
-            },
-            handleShowPopup(){
-                //显示添加银行卡弹窗
-                this.bankTabsIndex = 1
-                this.orderPayQuickBankInfos(this.bankTabsIndex)
-                this.handeleInitParams()
-                this.isHassCardStep = 0
-                this.isPopup = true
-            },
-            hanldeChooseBanks(cards,index){
-                //选择银行
-                this.bankIndex = index
-                this.checkedCards = cards
-                console.log('bank',cards)
-            },
-            handleCloseModel(){
-                //关闭窗口
-                this.tabsIndex = 1
-                this.bankIndex = ''
-                this.isCardStep = 1
-                this.isPopup = false
-            },
-            handleCodeInput(e){
-                // 隐藏
-                this.isErrorMsg = false
-            },
-            handleInput(e) {
-                this.showCardNumber = this.formatAccNo(e.target.value)
-                this.params.quickPayBankNumber = this.showCardNumber.split(/[\t\r\f\n\s]*/g).join('')
-            },
-            handleCloseCodeAlert(){
-                //关闭获取短信验证弹窗
-                this.isPayCodeAlert = false
-            },
-            handeleInitParams(){
-                // 初始化快捷支付信息
-                this.showCardNumber ='';
-                this.params = Object.assign({}, defaultParams);
-                this.codeParams= Object.assign({}, defaultCodeParams);
-                if (this.pageType === '2') { // 支付会员
-                    this.params.quickPayFlag = 2;
-                    this.params.vipRecordId = this.vipRecordId ;
-                } else if(this.pageType === '3') {// 支付优惠券
-                    this.params.source = 2;
-                    this.params.quickPayFlag = 4;
-                    this.params.couponId = this.couponId ;
-                    this.params.couponRecordId = this.couponRecordId ;
-                }else{ // 订单
-                    this.params.quickPayFlag = 1;
-                    this.params.shopOrderId = this.payInfo.shopOrderId
-                }
-            },
-            handleCheckQuickCards(index,cards){
-                this.mobileTabIndex = 4
-                this.current = index
-                this.params = {...this.params,...cards}
-            },
-            formatAccNo(value) {
-                const newValue = value.replace(/([^0-9])/g, '') // 只允许输入数字
-                const formatValue = newValue.replace(/(\d{4})(?=\d)/g, '$1 ') // 每4个数字后面加一个空格
-                const inputLen = this.getOriginValue().length
-                if (inputLen > this.maxLen) {
-                    return
-                }
-                return formatValue
-            },
-            getOriginValue() {
-                //获取input的原始值
-                return this.showCardNumber.split(' ').join('');
-            },
-        }
-    }
-}();
+// 快捷支付银行卡
+const defaultParams = {
+    userId: globalUserData.userId, //机构UserId
+    quickPayBankNumber: '', //快捷支付用户银行卡号/信用卡号
+    quickPayMobile: '', //快捷支付银行卡绑定手机号
+    quickPayBankExpireTime: '', //快捷支付信用卡过期时间,只包含年月，格式yy-MM
+    quickPayUserName: '', //快捷支付用户姓名
+    idCard: '', //身份证号
+    cvvCode: '' //信用卡安全码
+}
+const defaultCodeParams = {
+    orderId:'',
+    infoId:'',
+    bindCode:'',
+    flag:2,// 1绑卡 2 付款
+}
+var cardsMixns = function () {
+    return {
+        data() {
+            return {
+                bankList:[],
+                cardtype:'1',
+                maxLen:24,
+                isPopup:false,
+                current:'',
+                bankTabsIndex:1,
+                tabsIndex:1,
+                bankIndex:'',
+                isCardStep:1,
+                isHassCardStep:0,
+                isShowSupport:false,
+                checkedCards:{},
+                params: Object.assign({}, defaultParams),
+                codeParams:Object.assign({}, defaultCodeParams),
+                showCardNumber:'',
+                mobilCount:0,
+                mobileCodeText:'获取验证码',
+                mobilTime:null,
+                isMobileDisabled:false,
+                isPayCodeAlert:false,
+                errorMsg:'',
+                isErrorMsg:false
+            }
+        },
+        filters: {
+            cardsFormat(valus) {
+                // 银行卡只显示最后四位数 ,隐藏信息用*代替
+                return  valus.replace(/^(\d{4})\d+(\d{4})$/,"$1****$2")
+            },
+            bankNumeberFilter(value){
+                return value.substring(value.length-4,value.length)
+            }
+        },
+        computed: {
+            disabled() {
+                return !(this.bankIndex === 0 || this.bankIndex > 0);
+            },
+            disabled1() {
+                return !(this.params.quickPayUserName && this.params.quickPayBankNumber.length > 18);
+            },
+            disabled2() {
+                return this.params.quickPayBankNumber.length <= 12;
+            },
+            disabled3() {
+                if (this.cardtype === '1') {
+                    return !(
+                        this.params.quickPayUserName !== '' &&
+                        this.params.idCard !== '' &&
+                        this.params.quickPayMobile !== ''
+                    )
+                } else {
+                    return !(
+                        this.params.quickPayUserName !== '' &&
+                        this.params.idCard !== '' &&
+                        this.params.quickPayMobile !== '' &&
+                        this.params.quickPayBankExpireTime !== '' &&
+                        this.params.cvvCode !== ''
+                    )
+                }
+            },
+            disabled4() {
+                return !(this.codeParams.bindCode && this.codeParams.bindCode.length === 6 );
+            },
+            phoneNumbe() {
+                // 手机号仅显示前三位及后四位数字，隐藏信息用*代替
+                return this.params.quickPayMobile.substr(0, 3) + '****' + this.params.quickPayMobile.substring(7)
+            },
+        },
+        methods: {
+            orderPayQuickPay() {
+                //绑卡支付
+                const _self = this;
+                this.params.payAmount = this.payAmount;
+                if(!this.params.quickPayBankNumber){
+                    CAIMEI.dialog('请先添加快捷支付银行卡~');
+                    return;
+                }
+                PayApi.orderPayQuickPay(this.params,function(response){
+                    if(response.code === 0){
+                        _self.codeParams = {..._self.codeParams ,...response.data};
+                        console.log('_self.codeParams',_self.codeParams)
+                        _self.handleCodeTime()
+                        setTimeout(() => {
+                            _self.isPayCodeAlert = true
+                        }, 500)
+                    }else{
+                        console.log('获取绑卡验证码失败')
+                    }
+                })
+            },
+            handleCodeTime() {
+                // 倒计时
+                const _self = this;
+                const TIME_COUNT = 60;
+                if (!_self.mobilTime) {
+                    _self.mobilCount = TIME_COUNT;
+                    _self.isMobileDisabled = true;
+                    _self.mobilTime = setInterval(function(){
+                        if (_self.mobilCount > 1 && _self.mobilCount <= TIME_COUNT) {
+                            _self.mobilCount--;
+                            _self.mobileCodeText = _self.mobilCount +'秒后重发';
+                        } else {
+                            _self.isMobileDisabled = false;
+                            clearInterval(_self.mobilTime);
+                            _self.mobilTime = null;
+                            _self.mobileCodeText = '获取验证码';
+                        }
+                    },1000)
+                }
+            },
+            handleConfirm(){
+                //校验并绑定
+                const _self = this;
+                if(this.disabled4){ return }
+                PayApi.orderPayQuickBindCode(this.codeParams,function(response){
+                    if(response.code === 0){
+                        CAIMEI.dialog('绑卡成功');
+                        setTimeout(() => {
+                            _self.isPopup = false;
+                        }, 2000)
+                    }else{
+                        console.log('绑卡失败')
+                    }
+                })
+            },
+            handleCheckQuickCode(){
+                // 校验并支付
+                const _self = this;
+                PayApi.orderPayQuickBindCode(this.codeParams,function(response){
+                    if(response.code === 0){
+                        _self.isPayCodeAlert = false
+                        _self.windowLocationHref('success');
+                    }else if(response.code === -2){
+                        _self.isErrorMsg = true
+                        _self.errorMsg = response.msg
+                    }else{
+                        _self.isPayCodeAlert = false
+                        CAIMEI.dialog(response.msg);
+                    }
+                })
+            },
+            orderPayQuickBankInfos (cardType) {// 获取网银支付银行列表
+                const _self = this
+                PayApi.orderPayQuickBankInfos({ cardType:cardType },function(response){
+                    if(response.code === 0){
+                        _self.bankList = response.data;
+
+                    }else{
+                        console.log('获取网银支付银行列表异常')
+                    }
+                })
+            },
+            userClubBanks(){//查询银行卡列表
+                const _self = this;
+                PayApi.userClubBanks({ userId : this.params.userId  },function (response) {
+                    if(response.code === 0){
+                        _self.list = response.data;
+                        _self.isRequset = false;
+                    }else{
+                        CAIMEI.Alert(response.msg, '确定', false);
+                    }
+                })
+            },
+            handleCardStep(){
+                // 选择银行下一步
+                if(this.disabled){ return }
+                this.isCardStep = 1
+            },
+            handleHassCardStep(){
+                // 选择银行下一步
+                if(this.disabled2){ return }
+                this.isHassCardStep = 1
+            },
+            handleGetBindCode(){
+                //获取短信验证码
+                const reg = /^1\d{10}$/;
+                if(this.disabled3){ return }
+                if(!reg.test(this.params.quickPayMobile)){
+                    CAIMEI.dialog('请输入正确的手机号');
+                    return
+                }
+                this.isPopup = false;
+                this.orderPayQuickPay();
+            },
+            handleBankTabsClick(index){
+                // 切换借记卡&贷记卡
+                this.bankTabsIndex = index
+                this.orderPayQuickBankInfos(index)
+            },
+            handleTabsClick(index){
+                // 切换
+                console.log('tabsIndex',index)
+                this.tabsIndex = index
+            },
+            handleShowPopup(){
+                //显示添加银行卡弹窗
+                this.bankTabsIndex = 1
+                this.orderPayQuickBankInfos(this.bankTabsIndex)
+                this.handeleInitParams()
+                this.isHassCardStep = 0
+                this.isPopup = true
+            },
+            hanldeChooseBanks(cards,index){
+                //选择银行
+                this.bankIndex = index
+                this.checkedCards = cards
+                console.log('bank',cards)
+            },
+            handleCloseModel(){
+                //关闭窗口
+                this.tabsIndex = 1
+                this.bankIndex = ''
+                this.isCardStep = 1
+                this.isPopup = false
+            },
+            handleCodeInput(e){
+                // 隐藏
+                this.isErrorMsg = false
+            },
+            handleInput(e) {
+                this.showCardNumber = this.formatAccNo(e.target.value)
+                this.params.quickPayBankNumber = this.showCardNumber.split(/[\t\r\f\n\s]*/g).join('')
+            },
+            handleCloseCodeAlert(){
+                //关闭获取短信验证弹窗
+                this.isPayCodeAlert = false
+            },
+            handeleInitParams(){
+                // 初始化快捷支付信息
+                this.showCardNumber ='';
+                this.params = Object.assign({}, defaultParams);
+                this.codeParams= Object.assign({}, defaultCodeParams);
+                if (this.pageType === '2') { // 支付会员
+                    this.params.quickPayFlag = 2;
+                    this.params.vipRecordId = this.vipRecordId ;
+                } else if(this.pageType === '3') {// 支付优惠券
+                    this.params.source = 2;
+                    this.params.quickPayFlag = 4;
+                    this.params.couponId = this.couponId ;
+                    this.params.couponRecordId = this.couponRecordId ;
+                }else{ // 订单
+                    this.params.quickPayFlag = 1;
+                    this.params.shopOrderId = this.payInfo.shopOrderId
+                }
+            },
+            handleCheckQuickCards(index,cards){
+                this.mobileTabIndex = 4
+                this.current = index
+                this.params = {...this.params,...cards}
+            },
+            formatAccNo(value) {
+                const newValue = value.replace(/([^0-9])/g, '') // 只允许输入数字
+                const formatValue = newValue.replace(/(\d{4})(?=\d)/g, '$1 ') // 每4个数字后面加一个空格
+                const inputLen = this.getOriginValue().length
+                if (inputLen > this.maxLen) {
+                    return
+                }
+                return formatValue
+            },
+            getOriginValue() {
+                //获取input的原始值
+                return this.showCardNumber.split(' ').join('');
+            },
+        }
+    }
+}();

src/main/resources/templates/components/header.html

@@ -5,7 +5,7 @@
             <div class="header_top_left">欢迎来到采美采购服务平台</div>
             <div class="header_top_left"></div>
             <ul class="header_top_ul">
-                <li class="headsupplier">
+                <li class="headsupplier" v-if="userId===0 || userIdentity === 3">
                     <a class="tab_name">供应商服务</a>
                     <div class="supplierData">
                         <div class="supplierLink" v-for="(item, index) in activeLinks" :key="index" @click="goHeaderLink(item.link)">{{item.title}}</div>

src/main/resources/templates/pay/caimei-hlbpay.html

@@ -170,22 +170,22 @@
         <div class="inner">
             <template v-if="showAliPayMode">
                 <div class="pay-button" v-if="mobileTabIndex === 0">
-                    <a href="javascript:void(0);" id="payMobileSubmit" @click="PayMobileSubmitFn" :class="isSubMitStatus ? 'disabled' : ''" onclick="_czc.push(['_trackEvent','线上支付宝支付','点击','移动支付','','Um_Event_ConfirmMobilePay'])">立即支付</a>
+                    <a href="javascript:void(0);" class="ali" id="payMobileSubmit" @click="PayMobileSubmitFn" :class="isSubMitStatus ? 'disabled' : ''" onclick="_czc.push(['_trackEvent','线上支付宝支付','点击','移动支付','','Um_Event_ConfirmMobilePay'])">支付宝支付</a>
                 </div>
             </template>
             <template v-if="showWeChatPayMode">
                 <div class="pay-button" v-if="mobileTabIndex === 1">
-                    <a href="javascript:void(0);" id="payMobileSubmit1" @click="PayMobileSubmitFn" :class="isSubMitStatus ? 'disabled' : ''" onclick="_czc.push(['_trackEvent','线上微信支付','点击','移动支付','','Um_Event_ConfirmMobilePay1'])">立即支付</a>
+                    <a href="javascript:void(0);" class="wechat" id="payMobileSubmit1" @click="PayMobileSubmitFn" :class="isSubMitStatus ? 'disabled' : ''" onclick="_czc.push(['_trackEvent','线上微信支付','点击','移动支付','','Um_Event_ConfirmMobilePay1'])">微信支付</a>
                 </div>
             </template>
             <div class="pay-button" v-if="mobileTabIndex === 2">
-                <a v-show="isPC" href="javascript:void(0);" id="paySubmit" @click="PaySubmitFn" :class="isSubMitStatus ? 'disabled' : ''" onclick="_czc.push(['_trackEvent','线上企业网银支付','点击','网银支付','','Um_Event_CopyUnionPay'])">立即支付</a>
+                <a v-show="isPC" href="javascript:void(0);" class="onpay" id="paySubmit" @click="PaySubmitFn" :class="isSubMitStatus ? 'disabled' : ''" onclick="_czc.push(['_trackEvent','线上企业网银支付','点击','网银支付','','Um_Event_CopyUnionPay'])">企业网银支付</a>
             </div>
             <div class="pay-button" v-if="mobileTabIndex === 3">
-                <a v-show="isPC" href="javascript:void(0);" id="paySubmit1" @click="PaySubmitFn" :class="isSubMitStatus ? 'disabled' : ''" onclick="_czc.push(['_trackEvent','线上个人网银支付','点击','网银支付','','Um_Event_CopyUnionPay2'])">立即支付</a>
+                <a v-show="isPC" href="javascript:void(0);" class="pepay" id="paySubmit1" @click="PaySubmitFn" :class="isSubMitStatus ? 'disabled' : ''" onclick="_czc.push(['_trackEvent','线上个人网银支付','点击','网银支付','','Um_Event_CopyUnionPay2'])">个人网银支付</a>
             </div>
             <div class="pay-button" v-if="mobileTabIndex === 4">
-                <a href="javascript:void(0);" id="paySubmit2" @click="handleQuickPay" :class="isSubMitStatus ? 'disabled' : ''" onclick="_czc.push(['_trackEvent','快捷支付','点击','网银支付','','Um_Event_CopyUnionPay3'])">立即支付</a>
+                <a href="javascript:void(0);" id="paySubmit2" class="quck" @click="handleQuickPay" :class="isSubMitStatus ? 'disabled' : ''" onclick="_czc.push(['_trackEvent','快捷支付','点击','网银支付','','Um_Event_CopyUnionPay3'])">使用银行卡快捷支付</a>
             </div>
         </div>
     </div>

src/main/resources/templates/user-center/order/remarks-add-pay.html

@@ -2,7 +2,7 @@
 <html lang="zh-CN" xmlns:th="https://www.thymeleaf.org" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xsi:schemaLocation="https://www.thymeleaf.org ">
 <head>
-  <title>采美365网-上传支付凭证</title>
+  <title>采美365网-我的交易 > 我的订单 > 上传支付凭证</title>
   <template th:replace="components/head-link"></template>
   <link th:href="@{/css/base/center.css(v=${version})}" rel="stylesheet" type="text/css">
   <!--element ui 样式表-->