支付

src/main/java/com/caimei/www/controller/authorized/PayController.java

@@ -21,6 +21,9 @@ public class PayController extends BaseController {
     /** 微信小程序网银支付链接页 */
     private static final String CAIMAI_MOBILE = "pay/caimei-paymobile";
 
+    /** 微信小程序网银支付链接页 */
+    private static final String CAIMAI_UNDER = "pay/caimei-payunder";
+
     /** 微信小程序网银支付链接页 */
     private static final String CAIMAI_STARSPAY = "pay/caimei-starspay";
 
@@ -65,6 +68,12 @@ public class PayController extends BaseController {
     @GetMapping("/pay/caimei-paymobile.html")
     public String caimeiPayMobile() {return CAIMAI_MOBILE; }
 
+    /**
+     * 线下转账页面
+     */
+    @GetMapping("/pay/caimei-payunder.html")
+    public String caimeiPayUnder() {return CAIMAI_UNDER; }
+
     /**
      * 星范小程序网银支付页
      */

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

@@ -113,16 +113,6 @@ input::-webkit-outer-spin-button {
     .pay-alert-content .pay-big-alert .button a.btn-close{border: 1px solid #B8BFCA;color: #4A4F58;background-color: #FFFFFF;}
 
     .payment-transfer{width: 100%;height: auto;padding: 0 24px;}
-    .payment-transfer .payment-transfer-main{width: 100%;height: auto;}
-    .payment-transfer .payment-transfer-main .label{width: 100%;height: 38px;line-height: 38px;font-size: 13px;color: #333;}
-    .payment-transfer .payment-transfer-main .label .label-title{color: #E15616;padding-left: 20px;position: relative;}
-    .payment-transfer .payment-transfer-main .label .label-title .icon{width: 16px;height: 16px;display: block;position: absolute;top: 2px;left: 0;}
-    .payment-transfer .payment-transfer-main .label .label-title .icon:before{width: 16px;height: 16px;background-position: -340px -415px;}    .payment-transfer .payment-transfer-main .label .label-t{color: #627386;}
-    .payment-transfer .payment-transfer-main .label .text{color: #333;float: left;width: 25%;}
-    .payment-transfer .payment-transfer-main .label .text-p{color: #333;float: left;}
-    .payment-transfer .payment-transfer-main .label .text-p input{border: none;background-color: #FFF;width: 60px;font-size: 14px;color: #333;}
-    .payment-transfer .payment-transfer-main .label .text-p .copy{display: inline-block;width:42px;height:18px;background:linear-gradient(34deg,rgba(255,41,41,1) 0%,rgba(255,109,27,1) 100%);opacity:1;border-radius:3px;line-height: 18px;font-size: 12px;margin-top: 10px;margin-left:10px;color: #FFF;text-align: center;}
-    .payment-transfer .payment-transfer-main .label .label-c{color: #FF2A2A;}
     .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(135deg,rgba(242,143,49,1) 0%,rgba(225,86,22,1) 100%);border-radius: 2px;font-size: 14px;line-height: 50px;text-align: center;color: #FFF6D9;float: right;}

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

@@ -2,12 +2,6 @@
  * PC端
  */
 @media screen and (min-width:768px){
-    .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:68px;height: 81px;float: left;}
-    .head-wrap .logo a{width:68px;height: 81px;display: block;}
-    .head-wrap .logo a img{width:68px;height: 81px;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: 436px;position: relative;margin-bottom: 60px;}
     .pay-container .container{opacity:0;}
     .pay-container .container.active{opacity: 1;}
@@ -38,6 +32,29 @@
     .pay-list-cell .list-cell-pros.p1 .cell-pros-name{width: 300px;float: left;height: 100px;box-sizing: border-box;padding:30px 0;}
     .pay-list-cell .list-cell-pros.p1 .cell-pros-name p{width: 100%;font-size: 16px;line-height: 20px;color: #22272E;text-align: left;text-overflow: ellipsis;display: -webkit-box;word-break: break-all;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;}
     .pay-list-cell .list-cell-pros.p2,.pay-list-cell .list-cell-pros.p3,.pay-list-cell .list-cell-pros.p4{font-size: 16px;line-height: 100px;color: #22272E;text-align: left;}
+    .pay-list-cell .list-cell-button{width: 100%;height: 36px;margin-top:5px}
+    .pay-list-cell .list-cell-button .list-cell-vleft {float: right;}
+    .pay-list-cell .list-cell-button .list-cell-btn{width: 90px;height: 36px;float: right;border-radius: 2px;line-height: 36px;font-size: 14px;text-align: center;background-color: #E15616;color: #FFFFFF;margin-left: 40px;cursor: pointer;}
+    .pay-list-cell .list-cell-button .list-cell-btn:hover{background-color: rgba(225,86,22,0.9);}
+    .pay-list-cell .list-cell-button .list-cell-msg{float: right;margin-left: 40px;line-height: 36px;font-size: 16px;color: #22272E;}
+    .pay-list-cell .list-cell-button .list-cell-msg span{font-weight: bold;}
+    .pay-list-cell .list-cell-button .list-cell-msg span.red{color: #F94B4B;}
+
+    /*  弹窗  */
+    .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: 560px;height: 274px;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 .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")-319px 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;}
+    .pay-alert-content .pay-big-alert .content-top{width: 100%;height: auto;float: left;}
+    .pay-alert-content .pay-big-alert .content-viw{width:50%;height: 34px;float: left;line-height: 34px;font-weight: bold;font-size: 14px;color: #22272E;text-align: left;}
+    .pay-alert-content .pay-big-alert .content-viw span{font-weight: normal;}
+    .pay-alert-content .pay-big-alert .content-viw span.red{color: #F94B4B;}
+    .pay-alert-content .pay-big-alert .content-viw span.copy{margin-left:20px;display:inline-block;width: 56px;height: 24px;background-image: linear-gradient(214deg, #ff2929 0%, #ff6d1b 100%);border-radius: 2px;line-height: 24px;text-align: center;font-size: 12px;color: #FFF;margin-top: 6px;cursor: pointer;}
+    .pay-alert-content .pay-big-alert .content-bot{width: 100%;height: 64px;float: left;box-sizing: border-box;background-color: #FFFAF8;padding: 10px 16px;margin-top: 20px;}
+    .pay-alert-content .pay-big-alert .content-bot p{line-height: 22px;font-size: 14px;color: #E15616;}
+
 
 }
 
@@ -45,40 +62,51 @@
 * 移动端
 */
 @media screen and (max-width:768px){
-    body{min-width: 100%;background-color: #FFFFFF;}
-    footer{display: none;}
-    .head-wrap{width: 100%;height: 16vw;border: 1px solid #EBEBEB;}
-    .head-wrap .inner{width: 35vw;height: 16vw;}
-    .head-wrap .logo{width:13.6vw;height: 16vw;float: left;}
-    .head-wrap .logo a{width:13.6vw;height: 16vw;display: block;}
-    .head-wrap .logo a img{width:13.6vw;height: 16vw;display: block;}
-    .head-wrap .text{height: 16vw;float: left;margin-left: 10px;line-height: 16vw;font-size: 6vw;color: #333333;}
-    .pay-container {width: 100%;min-height: 100%;position: relative;margin-bottom: 0;}
+    .pay-container {width: 100%;min-height: 40vw;position: relative;margin-bottom: 2vw;}
     .pay-container .container{opacity:0;}
     .pay-container .container.active{opacity: 1;}
-    .pay-content{width: 100%;margin: 0 auto;height:100%;margin-top: 0;background: #FFFFFF;box-sizing: border-box;padding: 0;}
-    .pay-content.weixin{border: none;}
-    .pay-content.ali{border: none;}
-    .pay-codecontent{width: 100%;height: auto;float: left;padding:  0 2.4vw;box-sizing: border-box;}
-    .pay-codecontent .pay-amount{width:  100%;height: auto;float: left;}
-    .pay-codecontent .pay-amount .pay-amount-text{width: 100%;height: auto;float: left;margin-bottom: 4vw;}
-    .pay-codecontent .pay-amount .pay-amount-text p{font-size: 4vw;text-align: center;color: #333;line-height: 8vw;}
-    .pay-codecontent .pay-amount .pay-amount-text p span{margin-left: 5px;}
-    .pay-codecontent .pay-amount .pay-amount-icon{display: none;}
-    .pay-codecontent .pay-codemain{width: 100%;height: auto;float: right;position: relative;}
-    .pay-codecontent .pay-codemain .code-title{width: 100%;height:8vw;line-height:8vw;font-size: 4vw;color: #333333;margin-bottom: 20px;text-align: center;font-weight: bold;}
-    .pay-codecontent .pay-codemain .code-title span{color: #E15616;}
-    .pay-codecontent .pay-codemain .pay-qrCode{width: 220px;height: 220px;position: relative;margin: 0 auto;padding: 8px;border: 2px solid #ebebeb;}
-    .pay-codecontent .pay-codemain .pay-qrCode.weixin{border-color:#7AD237 ;}
-    .pay-codecontent .pay-codemain .pay-qrCode.ali{border-color:#26A1EE ;}
-    .pay-codecontent .pay-codemain .pay-qrCode i{width: 48px;height: 48px;display: block;position: absolute;top: 0;left: 0;right: 0;bottom: 0;margin: auto;}
-    .pay-codecontent .pay-codemain .pay-qrCode .icon-alipay{background: url("/img/pay/icon-ali@2x.png")no-repeat;background-size: contain;}
-    .pay-codecontent .pay-codemain .pay-qrCode .icon-wechat{background: url("/img/pay/icon-wechatpay@2x.png")no-repeat;background-size: contain;}
-    .pay-codecontent .pay-codemain .code-footer{width: 100%;height: 33px;line-height: 33px;font-size: 14px;color: #333333;text-align: center;margin-top: 10vw;}
-    .pay-codecontent .pay-codemain .code-footer .code-img{width: 84px;height: 28px;display: block;margin: 0 auto;}
-    .pay-codemain .model{position: absolute;width: 240px;height: 240px;top: 54px;left:18vw;display: flex;justify-content: center;align-items: center;background: rgba(255,255,255,1);color: #999;z-index: 99999;border: 1px solid #EBEBEB;}
-    .pay-codemain .model .refresh{width: 21px;height: 21px;display: block;margin: 0 auto;margin-bottom: 3px;}
-    .pay-codemain .model  .refresh-div{width: 100px;height: auto;display: block;}
-    .pay-codemain .model  .refresh-div p{text-align: center;font-size: 14px;line-height: 20px;}
+    .pay-content{width: 100%;margin: 0 auto;height: auto;box-sizing: border-box;}
+    .pay-content .pay-title{width: 100%;height: auto;box-sizing: border-box;padding:4vw 3.5vw;background-color: #FFFFFF;margin-bottom: 2vw;}
+    .pay-content .pay-title-t{width: 100%;line-height: 6vw;font-size: 3.4vw;color: #333333;font-weight: bold;}
+    .pay-content .pay-title-p{line-height: 4vw;font-size: 3vw;color: #E15616;font-weight: normal;}
+    .pay-content .pay-title-btn{width: 40vw;background: #1890F9;height: 11.2vw;line-height:11.2vw;text-align: center;font-size: 3.4vw;color: #FFFFFF;margin: 0 auto;margin-top: 5vw;}
+    .pay-list-cell{width: 100%;height: auto;box-sizing: border-box;padding: 3.2vw;background-color: #FFFFFF;margin-bottom: 2vw;position: relative;}
+    .pay-list-cell .list-cell-title{width: 100%;height:12.8vw;box-sizing: border-box;padding:2.4vw 0;border-bottom: 1px solid #E1E1E1;}
+    .pay-list-cell .list-cell-title .list-cell-logo{width: 6.4vw;height: 6.4vw;box-sizing: border-box;border: 1px solid #E1E1E1;border-radius: 2px;float: left;}
+    .pay-list-cell .list-cell-title .list-cell-logo img{width: 100%;height: 100%;display: block;}
+    .pay-list-cell .list-cell-title .list-cell-name {float: left;margin-left:3vw;line-height: 6.4vw;font-size: 3.4vw;color: #333333;}
+    .pay-list-cell .list-cell-content{width: 100%;height: auto;box-sizing: border-box;padding: 2.4vw 0;}
+    .pay-list-cell .list-cell-pros{float: left;}
+    .pay-list-cell .list-cell-pros.p1{width: 100%;}
+    .pay-list-cell .list-cell-pros.p2,.pay-list-cell .list-cell-pros.p3,.pay-list-cell .list-cell-pros.p4{width: 33.33%;margin-top: 4vw;font-size: 3.4VW;line-height: 4vw;color: #22272E;text-align: left;}
+    .pay-list-cell .list-cell-pros.p2 span,.pay-list-cell .list-cell-pros.p3 span,.pay-list-cell .list-cell-pros.p4 span{font-size: 3vw;color: #627386;margin-bottom: 1vw;}
+    .pay-list-cell .list-cell-pros.p2 p,.pay-list-cell .list-cell-pros.p3 p,.pay-list-cell .list-cell-pros.p4 p{margin-top: 2vw;}
+    .pay-list-cell .list-cell-pros.p1 .cell-pros-image{width: 15vw;height: 15vw;float: left;margin-right: 2.6vw;box-sizing: border-box;border: 1px solid #E1E1E1;border-radius: 2px;}
+    .pay-list-cell .list-cell-pros.p1 .cell-pros-image img{width: 100%;height: 100%;display: block;}
+    .pay-list-cell .list-cell-pros.p1 .cell-pros-name{width: 75vw;float: left;height: 15vw;box-sizing: border-box;padding:3vw 0;}
+    .pay-list-cell .list-cell-pros.p1 .cell-pros-name p{width: 100%;font-size: 3.4vw;line-height: 4vw;color: #22272E;text-align: left;text-overflow: ellipsis;display: -webkit-box;word-break: break-all;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;}
+    .pay-list-cell .list-cell-button{width: 100%;height: 9.6vw;}
+    .pay-list-cell .list-cell-button .list-cell-vleft {float: right;}
+    .pay-list-cell .list-cell-button .list-cell-vleft.btn{position: absolute;bottom: 3.4vw;right: 3.4vw;}
+    .pay-list-cell .list-cell-button .list-cell-btn{width: 22.4vw;height: 9.6vw;float: right;border-radius: 2px;line-height: 9.6vw;font-size: 3.4vw;text-align: center;background-color: #E15616;color: #FFFFFF;margin-left: 40px;cursor: pointer;}
+    .pay-list-cell .list-cell-button .list-cell-btn:hover{background-color: rgba(225,86,22,0.9);}
+    .pay-list-cell .list-cell-button .list-cell-msg{float: left;margin-left: 8vw;line-height: 9.6vw;font-size: 3.4vw;color: #22272E;}
+    .pay-list-cell .list-cell-button .list-cell-msg span{font-weight: bold;}
+    .pay-list-cell .list-cell-button .list-cell-msg span.red{color: #F94B4B;}
+
+    /*  弹窗  */
+    .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: 74.8vw;height: 83.6vw;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 .title{width: 100%;height: 11vw;box-sizing: border-box;font-size: 3.6vw;line-height: 11vw;text-align: left;color: #333333;float: left;position: relative;border-bottom: 1px solid #EFEFEF;background-color: #FFFFFF;padding: 0 3.4vw;}
+    .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")-319px 0 no-repeat;cursor: pointer;}
+    .pay-alert-content .pay-big-alert .content{width: 100%;height: auto;line-height: 8vw;float: left;padding: 4vw;box-sizing: border-box;}
+    .pay-alert-content .pay-big-alert .content-top{width: 100%;height: auto;float: left;}
+    .pay-alert-content .pay-big-alert .content-viw{width:100%;height: 8vw;float: left;line-height: 8vw;font-weight: bold;font-size: 3.4vw;color: #22272E;text-align: left;}
+    .pay-alert-content .pay-big-alert .content-viw span{font-weight: normal;}
+    .pay-alert-content .pay-big-alert .content-viw span.red{color: #F94B4B;}
+    .pay-alert-content .pay-big-alert .content-viw span.copy{margin-left:4vw;display:inline-block;width: 12.4vw;height: 5.2vw;background-image: linear-gradient(214deg, #ff2929 0%, #ff6d1b 100%);border-radius: 2px;line-height: 5.2vw;text-align: center;font-size: 3vw;color: #FFF;margin-top: 6px;cursor: pointer;}
+    .pay-alert-content .pay-big-alert .content-bot{width: 100%;height: 20vw;float: left;box-sizing: border-box;background-color: #FFFAF8;padding: 2.8vw;margin-top: 4vw;}
+    .pay-alert-content .pay-big-alert .content-bot p{line-height: 5vw;font-size: 3vw;color: #E15616;}
 
 }

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

@@ -0,0 +1,59 @@
+/**
+ * PC端
+ */
+@media screen and (min-width:768px){
+    .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:68px;height: 81px;float: left;}
+    .head-wrap .logo a{width:68px;height: 81px;display: block;}
+    .head-wrap .logo a img{width:68px;height: 81px;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: 436px;position: relative;margin-bottom: 20px;}
+    .pay-container .container{opacity:0;}
+    .pay-container .container.active{opacity: 1;}
+    .pay-content{width: 1184px;height: 502px;margin: 0 auto;padding:0 24px;box-sizing: border-box;background: #FFFFFF;}
+    .pay-title{width: 100%;height: 60px;line-height: 60px;font-size: 16px;color: #E15616;}
+    .pay-amount{width:100%;height: 128px;background: url("/img/pay/icon-under@2x.png");background-size: cover;padding: 25px 20px;box-sizing: border-box;}
+    .pay-amount p{line-height: 35px;font-size: 16px;color: #FFFFFF;}
+    .pay-amount h1{line-height: 35px;font-size: 28px;color: #FFFFFF;}
+    .pay-bank{width: 100%;height: auto;margin-top: 30px;float: left;}
+    .pay-bank .pay-bank-content{width: 60%;}
+    .pay-bank .content-viw{width:50%;height: 40px;float: left;line-height: 40px;font-weight: bold;font-size: 14px;color: #22272E;text-align: left;}
+    .pay-bank .content-viw span{font-weight: normal;}
+    .pay-bank .content-viw span.red{color: #F94B4B;}
+    .pay-bank .content-viw span.copy{margin-left:20px;display:inline-block;width: 56px;height: 24px;background-image: linear-gradient(214deg, #ff2929 0%, #ff6d1b 100%);border-radius: 2px;line-height: 24px;text-align: center;font-size: 12px;color: #FFF;margin-top: 6px;cursor: pointer;}
+    .pay-msg{width: 100%;height: 56px;margin-top:40px;float: left;}
+    .pay-msg p{width: 600px;height: 56px;line-height: 56px;background: #FFFAF8;font-size: 14px;color: #E15621;text-align: left;box-sizing: border-box;padding: 0 10px;}
+
+}
+
+/**
+* 移动端
+*/
+@media screen and (max-width:768px){
+    body{min-width: 100%;background-color: #FFFFFF;}
+    footer{display: none;}
+    .head-wrap{width: 100%;height: 16vw;border: 1px solid #EBEBEB;}
+    .head-wrap .inner{width: 35vw;height: 16vw;margin: 0 auto;}
+    .head-wrap .logo{width:13.6vw;height: 16vw;float: left;}
+    .head-wrap .logo a{width:13.6vw;height: 16vw;display: block;}
+    .head-wrap .logo a img{width:13.6vw;height: 16vw;display: block;}
+    .head-wrap .text{height: 16vw;float: left;margin-left: 10px;line-height: 16vw;font-size: 6vw;color: #333333;}
+    .pay-container {width: 100%;height: auto; position: relative;margin-bottom: 6vw;}
+    .pay-container .container{opacity:0;}
+    .pay-container .container.active{opacity: 1;}
+    .pay-content{width: 100%;height: auto;box-sizing: border-box;background: #FFFFFF;}
+    .pay-title{width: 100%;height: 10vw;line-height: 10vw;font-size: 3.2vw;color: #E15616;padding:0 3.2vw;}
+    .pay-amount{width:100%;height: 34.6vw;background: url("/img/pay/icon-underh5@2x.png");background-size: cover;padding: 7vw;box-sizing: border-box;}
+    .pay-amount p{line-height: 10.3vw;font-size: 4vw;color: #FFFFFF;}
+    .pay-amount h1{line-height: 10.3vw;font-size: 6.4vw;color: #FFFFFF;}
+    .pay-bank{width: 100%;height: auto;margin-top: 6vw;float: left;padding: 0 3.2vw;box-sizing: border-box;}
+    .pay-bank .pay-bank-content{width: 60%;}
+    .pay-bank .content-viw{width:100%;height:10vw;float: left;line-height: 10vw;font-weight: bold;font-size: 14px;color: #22272E;text-align: left;}
+    .pay-bank .content-viw span{font-weight: normal;}
+    .pay-bank .content-viw span.red{color: #F94B4B;}
+    .pay-bank .content-viw span.copy{margin-left:4vw;display:inline-block;width: 12.4vw;height: 5.2vw;background-image: linear-gradient(214deg, #ff2929 0%, #ff6d1b 100%);border-radius: 2px;line-height: 5.2vw;text-align: center;font-size: 3vw;color: #FFF;margin-top: 6px;cursor: pointer;}
+    .pay-msg{width: 100%;height: 15.8vw;margin-top:6vw;float: left;box-sizing: border-box;padding: 0 3.2vw;}
+    .pay-msg p{width: 100%;height: 15.8vw;line-height: 5vw;background: #FFFAF8;font-size: 14px;color: #E15621;text-align: left;box-sizing: border-box;padding:3vw;}
+
+}

src/main/resources/static/css/user-center/order/detail.css

@@ -32,11 +32,11 @@ li{list-style:none}
     .order-container .section .section-info .order-content .order-item p .none{color:#22272e;}
     /*商品信息*/
     .order-container .section-list{margin-bottom: 10px;width: 100%;height: auto;box-sizing:border-box;}
-    .order-container .section-shopinfo{width: 100%;height: auto;margin-bottom: 5px;box-sizing: border-box;padding: 0 20px 0px 20px;background-color: #FFFFFF;}
-    .order-container .section-shopinfo .title{width: 100%;height: 56px;box-sizing: border-box;padding: 8px 0;border-bottom: 1px solid #e2e7ef;}
+    .order-container .section-shopinfo{width: 100%;height: auto;margin-bottom: 5px;box-sizing: border-box;padding: 0;background-color: #FFFFFF;}
+    .order-container .section-shopinfo .title{width: 100%;height: 56px;box-sizing: border-box;padding: 8px 20px;border-bottom: 1px solid #e2e7ef;}
     .order-container .section-shopinfo .title .logo{width: 39px;height: 39px;box-sizing: border-box;border: 1px solid #e2e7ef;float: left;display: block;margin-right: 5px;}
     .order-container .section-shopinfo .title .name{line-height: 40px;float: left;font-size: 14px;color: #22272E;text-align: left;margin-right: 20px;}
-    .order-container .section-shopinfo .product{width: 100%;height: auto;}
+    .order-container .section-shopinfo .product{width: 100%;height: auto;box-sizing: border-box;padding: 0 20px;}
     .order-container .section-shopinfo .section-prosinfo{width: 100%;height: 126px;padding: 16px 0 0;}
     .order-container .section-shopinfo .product-t{width: 100%;min-height: 100px;float: left;}
     .order-container .section-shopinfo .product-t .image{width: 98px;height: 98px;float: left;border: 1px solid #e2e7ef;margin-right: 10px;position: relative;}
@@ -59,21 +59,13 @@ li{list-style:none}
     .order-container .section-shopinfo .product-t .price>p .red{color: #FF2A2A;}
     .price-total{padding-top:20px;text-align:right;color:#22272e;font-size:16px}
     .price-total span{color:#f94b4b}
-    .order-container .section-shopinfo .shopinfo-bott{width: 100%;height: auto;box-sizing: border-box;padding-left:110px;line-height: 38px;color: #22272E;    border-top: 1px dashed #F7F7F7;}
-    .order-container .section-shopinfo .shopinfo-bott p .red{color: #FF2A2A;}
-    .order-container .section-shopinfo .shopinfo-bott .bott-top{width: 100%;float: left;height: 60px;}
-    .order-container .section-shopinfo .shopinfo-bott .bott-bot{width: 100%;float: left;}
-    .order-container .section-shopinfo .shopinfo-bott .count{float: left;font-size: 14px;}
-    .order-container .section-shopinfo .shopinfo-bott .count.none{line-height: 60px;}
-    .order-container .section-shopinfo .shopinfo-bott .count span{color: #E15616;margin: 5px 0;}
-    .order-container .section-shopinfo .shopinfo-bott .total{float: right;font-size: 16px;display: inline-block;text-align:right;}
-    .order-container .section-shopinfo .shopinfo-bott .total p{display: inline-block;float: left;height: 30px;line-height: 30px;width: 100%;}
-    .order-container .section-shopinfo .shopinfo-bott .total p .money{font-size: 14px;color: #999999;text-decoration: line-through;}
-    .order-container .section-shopinfo .shopinfo-bott .total p .money-sign{font-size: 14px;color: #999999;text-decoration: line-through;}
-    .order-container .section-shopinfo .shopinfo-bott .total p .money-reduced{margin-left: 5px;font-size: 14px;color: #e15616;}
-    .order-container .section-shopinfo .shopinfo-bott .total p.none{line-height: 60px;}
-    .order-container .section-shopinfo .bott-bot p{color: #627386;}
-    .order-container .section-shopinfo .bott-bot span{margin-left: 10px;color: #22272E;}
+    .order-container .section-shopinfo .shopinfo-bott{width: 100%;height: 72px;box-sizing: border-box;color: #22272E;background-color: #FFFAF8;padding: 8px 20px;margin-top: 5px;}
+    .order-container .section-shopinfo .shopinfo-bott p{display:inline-block;margin-right:50px;line-height: 28px;color: #627386;font-size: 14px;float: left;}
+    .order-container .section-shopinfo .shopinfo-bott .red{color: #f94b4b;}
+    .order-container .section-shopinfo .shopinfo-bott .org{color: #e15616;}
+    .order-container .section-shopinfo .shopinfo-bott .none{color:#22272e;}
+    .order-container .section-shopinfo .shopinfo-note{width: 100%;height: 30px;line-height: 30px;padding: 10px 20px 16px 20px;}
+    .order-container .section-shopinfo .shopinfo-note p{color: #22272E;}
     /*发票信息*/
     .order-container .section-invoice{margin-bottom: 10px;width: 100%;height: auto;box-sizing: border-box;float: left;padding:16px 20px;background-color: #FFFFFF;}
     .order-container .section-invoice .tit{width: 100%;line-height: 24px;font-size: 14px;color: #22272E;height: 24px;float: left;}
@@ -144,13 +136,13 @@ li{list-style:none}
     .order-container .order-item p.org{width:auto}
     .order-container .order-item p.org span{color:#e15616}
     .order-container .order-item p.address{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
-    .section-shopinfo .title{border-bottom:1px solid #F7F7F7;height:7.4vw;line-height:7.4vw;padding:1.3vw 0;position:relative}
+    .section-shopinfo .title{border-bottom:1px solid #F7F7F7;height:7.4vw;line-height:7.4vw;padding:1.3vw 3.2vw;position:relative}
     .section-shopinfo .logo{width:7.4vw;height:7.4vw;border:1px solid #F7F7F7;margin-right:2vw}
     .section-shopinfo .name{display:inline-block;color:#9aa5b5}
     .section-shopinfo .title .priceTag{width:22vw;height:6.4vw;position:absolute;right:0;top:2vw}
     .section-shopinfo .title .priceTag .tag{top:0}
-    .section-shopinfo{width:100%;background:#FFF;color:#9aa5b5;font-size:3.4vw;margin-top:1.5vw;padding:2vw 3.2vw;box-sizing:border-box}
-    .section-shopinfo .product{padding:2vw 0;box-sizing:border-box}
+    .section-shopinfo{width:100%;background:#FFF;color:#9aa5b5;font-size:3.4vw;margin-top:1.5vw;padding:2vw 0;box-sizing:border-box}
+    .section-shopinfo .product{padding:2vw 3.2vw;box-sizing:border-box}
     .section-prosinfo{padding:1vw 0 1vw 32.2vw;position:relative;margin-top:2vw}
     .section-prosinfo .image{width:28vw;position:absolute;left:0;top:0}
     .section-prosinfo .image img{width:28vw;height:28vw}
@@ -158,7 +150,7 @@ li{list-style:none}
     .section-prosinfo .text .tit{max-height:10.4vw;line-height:5.2vw;color:#22272e;font-size:3.7vw;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
     .section-prosinfo .text .info{position:relative}
     .section-prosinfo .text .info .priceTag .tag{position:absolute;right:0;top:auto;left:auto;}
-    .section-prosinfo .text .info>p{display:inline-block;min-width:48%;font-size:3.1vw;color:#627386}
+    .section-prosinfo .text .info>p{display:inline-block;min-width:48%;font-size:3.1vw;color:#627386;line-height: 6vw;}
     .section-prosinfo .text .info>p .red{color:#FF2A2A}
 
     /*会员标签*/
@@ -168,18 +160,17 @@ li{list-style:none}
     .section-prosinfo .text .svip-tag .svip-price{z-index:1;position:relative;float: left;padding-left:5.4vw;padding-right:0.6vw;margin-left:-6vw;line-height:4.74vw;height: 4.74vw; background:#F0CB72;opacity:1;border-radius:2px;font-size:2.8vw}
     .section-prosinfo .text .svip-tag .svip-price span{color: #333}
     .section-prosinfo .text .svip-tag .svip-price span:nth-child(2){margin-left: -0.4vw}
-
     .section-prosinfo .text .price{font-size:3.4vw;color:#627386}
     .section-prosinfo .text .price .red{color:#f94b4b}
-    .shopinfo-bott{border-top:1px solid #F7F7F7;width:100%;box-sizing:border-box;margin:0 auto;line-height:10.6vw;color:#22272e;font-size:3.4vw;text-align:right;padding:0 3.2vw}
-    .shopinfo-bott .total p{width: 100%;float: right;line-height: 6vw;}
-    .shopinfo-bott .total p .money{color: #999999;text-decoration: line-through;}
-    .shopinfo-bott .total p .money-sign{color: #999999;text-decoration: line-through;}
-    .shopinfo-bott .total p .money-reduced{color: #e15616;}
-    .shopinfo-bott p{display:inline-block;margin-left:3vw}
-    .shopinfo-bott p .red{color:#627386}
-    .shopinfo-bott .bott-bot{text-align:left;line-height:6vw;color:#627386;padding-bottom:2vw}
-    .shopinfo-bott .bott-bot p{margin:0}
+
+    .order-container .section-shopinfo .shopinfo-bott{width: 100%;height: auto;box-sizing: border-box;color: #22272E;background-color: #FFFAF8;padding: 2vw 3.2vw;margin-top: 2vw;}
+    .order-container .section-shopinfo .shopinfo-bott p{display:inline-block;margin-right:8vw;line-height: 6.8vw;color: #627386;font-size: 3.4vw;float: left;}
+    .order-container .section-shopinfo .shopinfo-bott .red{color: #f94b4b;}
+    .order-container .section-shopinfo .shopinfo-bott .org{color: #e15616;}
+    .order-container .section-shopinfo .shopinfo-bott .none{color:#22272e;}
+    .order-container .section-shopinfo .shopinfo-note{width: 100%;height: auto;line-height: 6vw;padding: 3.2vw 3.2vw 0 3.2vw;box-sizing: border-box;}
+    .order-container .section-shopinfo .shopinfo-note p{width: 100%;color: #22272E;text-overflow: ellipsis;display: -webkit-box;word-break: break-all;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;}
+
     .section-invoice p{font-size:3.4vw;color:#627386;line-height:5vw;padding:1.6vw 0}
     .section-invoice p span{color:#22272e}
     .section-invoice .tit p{font-size:3.7vw;color:#22272e}

src/main/resources/static/js/pay/caimei-hlbpay.js

@@ -42,7 +42,6 @@ var payContainer = new Vue({
         bankTabIndex:0,
         isRequest:false,
         isPayAlert:false,
-        isPayBigAlert:false,
         isPaySwitch:false,
         paySuccessCounter:'',
         bankPayLink_url:'',
@@ -626,11 +625,6 @@ var payContainer = new Vue({
                     _self.payInfo.payType = '2';
                     _self.payInfo.payUserType = 'USER';
                     break;
-                case 4:// 大额网银
-                    _self.bankTabIndex = 0
-                    _self.payInfo.payType = '2';
-                    _self.payInfo.payUserType = 'USER';
-                    break;
             }
         },
         checkBankPay:function(index,item){//选择网银支付方式-选择银行
@@ -643,11 +637,6 @@ var payContainer = new Vue({
                 case 3:// 个人网银
                     _self.payInfo.payBankNum = item.b2C;
                     break;
-                case 4:// 大额网银
-                    _self.bankTabIndex = 0
-                    _self.payInfo.payType = '2';
-                    _self.payInfo.payUserType = 'USER';
-                    break;
             }
         },
         copyLinkPaySubmitFn:function(){//复制网银支付链接
@@ -811,9 +800,6 @@ var payContainer = new Vue({
                 _self.payStatusText = '使用任何一种线上支付方式支付全部金额后，供应商会在24小时后发货（周末、节假日顺延）。若着急发货，可以选择使用线下转账进行付款。';
                 _self.isReceiptStatus = true;
             });
-        },
-        closeBigAlert:function () {
-            this.isPayBigAlert = false
         }
     },
     mounted: function () {

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

@@ -85,8 +85,10 @@ var payContainer = new Vue({
             }
         ],
         isRequest:false,
+        orderIdentificationId:'',
         orderId:0,
-        userId:0
+        userId:0,
+        isPayBigAlert:false // 线下转账弹窗
     },
     filters: {
         NumFormat:function(value) {
@@ -110,23 +112,26 @@ var payContainer = new Vue({
                     _self.payInfo.payAmount = data.order.payableAmount-data.order.receiptAmount;
                     _self.loginLoading = false;
                     _self.isRequest = true;
-                    switch (_self.payInfo.payType) {
-                        case 'WEIXIN':
-                            _self.getWrchatQrcodeShow();
-                            break;
-                        case 'ALIPAY':
-                            _self.getAliPayQrcodeInfo();
-                            break;
-                    }
-
                 }else{
                     CAIMEI.Alert(response.msg,'确定',false);
                 }
             })
         },
-        hidePayAlert:function(){//隐藏已支付弹窗
+        copyOrderBtnSubmitFn:function(){//复制订单标识
             var _self = this;
-            _self.isPayAlert = false;
+            var oInput = document.createElement("textarea");
+            oInput.value = _self.orderIdentificationId;
+            document.body.appendChild(oInput);
+            oInput.select(); // 选择对象
+            document.execCommand("Copy"); // 执行浏览器复制命令
+            document.body.removeChild(oInput);
+            CAIMEI.dialog('复制成功');
+        },
+        handleAlert:function () {
+            this.isPayBigAlert = true;
+        },
+        closeBigAlert:function () {
+            this.isPayBigAlert = false;
         },
         toFixedFn:function(text){//处理小数点后两位数
             return Number(text).toFixed(2);
@@ -135,6 +140,7 @@ var payContainer = new Vue({
     mounted: function () {
         var _self = this;
         _self.orderId = CAIMEI.getUrlParam('orderId');
+        _self.orderIdentificationId = '#'+ _self.orderId+'#';
         console.log(_self.payInfo.payType);
         _self.infoPayOrderCheckoutCounter();
     }

src/main/resources/static/js/pay/caimei-payunder.js

@@ -0,0 +1,65 @@
+/**
+ *Created by ZHJY on 2020/7/14.
+ */
+var payContainer = new Vue({
+    el:"#payContainer",
+    data: {
+        loginLoading:true,
+        isRequest:false,
+        orderIdentificationId:'',
+        orderId:0,
+        userId:0
+    },
+    filters: {
+        NumFormat:function(value) {
+            //处理金额
+            if (value) {
+                return Number(value).toFixed(2)
+            } else {
+                return '0.00'
+            }
+        }
+    },
+    methods: {
+        infoPayOrderCheckoutCounter:function(){//初始化订单数据
+            var _self = this;
+            PayApi.PayOrderCheckoutCounter({orderId:_self.orderId},function(response){
+                if(response.code == 0){
+                    // console.log(response);
+                    var data = response.data;
+                    _self.orderNo = data.order.orderNo;
+                    _self.paySuccessCounter = data.order.paySuccessCounter;
+                    _self.loginLoading = false;
+                    _self.isRequest = true;
+                    switch (_self.payInfo.payType) {
+                        case 'WEIXIN':
+                            _self.getWrchatQrcodeShow();
+                            break;
+                        case 'ALIPAY':
+                            _self.getAliPayQrcodeInfo();
+                            break;
+                    }
+
+                }else{
+                    CAIMEI.Alert(response.msg,'确定',false);
+                }
+            })
+        },
+        copyOrderBtnSubmitFn:function(){//复制订单标识
+            var _self = this;
+            var oInput = document.createElement("textarea");
+            oInput.value = _self.orderIdentificationId;
+            document.body.appendChild(oInput);
+            oInput.select(); // 选择对象
+            document.execCommand("Copy"); // 执行浏览器复制命令
+            document.body.removeChild(oInput);
+            CAIMEI.dialog('复制成功');
+        },
+    },
+    mounted: function () {
+        var _self = this;
+        _self.orderId = CAIMEI.getUrlParam('orderId');
+        _self.orderIdentificationId = '#'+ _self.orderId+'#';
+        _self.infoPayOrderCheckoutCounter();
+    }
+});

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

@@ -91,13 +91,11 @@
                 <div class="method-title">选择支付方式</div>
                 <div class="pay-method-tab mf">
                     <a class="item" href="javascript:void(0);" @click="changeTab(0)" :class ="{ active: tabIndex === 0 }">线上支付</a>
-                    <a class="item" href="javascript:void(0);" @click="changeTab(1)" :class ="{ active: tabIndex === 1 }" v-if="isReceiptStatus">线下转账</a>
                 </div>
                 <div class="method-content">
                     <div class="payment" id="mobilePayment" v-if="tabIndex === 0">
                         <template v-if="pageType !== '2' && pageType != '3'">
-                            <div class="payment-title">1.{{payStatusText}}</div>
-                            <div class="payment-title">2.大额支付请使用大额银联转账方式进行付款。</div>
+                            <div class="payment-title">{{payStatusText}}</div>
                         </template>
                         <div class="pay-bank">
                             <div class="bank-list" id="mobileContent">
@@ -116,9 +114,6 @@
                                 <a href="javascript:void(0);" class="bank-a mIcon" @click="checkMobilePay(3,'ICBC_B2C')" :class="{ active: mobileTabIndex === 3 }">
                                     <img src="/img/pay/iconbank-B2Cbank@2x.png" alt="个人网银">
                                 </a>
-                                <a href="javascript:void(0);" v-if="pageType !== '1' && pageType != '2'  && pageType != '3'" class="bank-a mIcon" @click="checkMobilePay(4,'ICBC_B2C')" :class="{ active: mobileTabIndex === 4 }">
-                                    <img src="/img/pay/iconbank-bigbank@2x.png" alt="大额网银转账">
-                                </a>
                             </div>
                         </div>
                         <div class="pay-bank"  v-if="mobileTabIndex === 2 && isPC">
@@ -146,24 +141,6 @@
                             <div class="iframe" v-html="iframe" style="display: none;"></div>
                         </template>
                     </div>
-                    <div class="payment" id="offlinePayment" v-if="tabIndex === 1">
-                        <div class="payment-transfer">
-                            <div class="payment-transfer-main" id="paymentTransferMain">
-                                <div class="label"><P class="label-title"><i class="icon mIcon"></i>除了线上支付，您还可以通过直接转账的方式付款</P></div>
-                                <div class="label"><P class="label-t">转账信息</P></div>
-                                <div class="label">
-                                    <P class="text">开户行：中信银行（深圳泰然支行）</P>
-                                    <P class="text">银行卡号：6217 6803 0362 0897</P>
-                                    <P class="text">户名：周仁声</P>
-                                </div>
-                                <div class="label">
-                                    <P class="text-p">订单标识：{{orderIdentificationId}}<a href="javascript: void(0);" class="copy" @click="copyOrderBtnSubmitFn">复制</a></P>
-                                </div>
-                                <div class="label"><P class="label-t">特别注意</P></div>
-                                <div class="label"><P class="label-c">请在转账备注中填写上述订单标识，方便财务快速审核，提高发货速度</P></div>
-                            </div>
-                        </div>
-                    </div>
                 </div>
             </div>
         </div>
@@ -197,24 +174,6 @@
             <div class="button" id="payButton"><a href="javascript:void(0);" @click="RefreshBody">已完成支付</a></div>
         </div>
     </div>
-    <div class="pay-alert-content" v-if="isPayBigAlert">
-        <div class="pay-big-alert">
-            <div class="title"><p>大额银联转账信息</p><i class="icon-close" @click.stop="closeBigAlert"></i></div>
-            <div class="content">
-                <p class="text">请使用银行手机app或者网银输入以下信息进行转账。 每次发起支付请求，收款账号都会变化，请使用最新的收款账号进行转账。</p>
-                <p>户名: <span>{{ bigPayInfo.receiveName }}</span></p>
-                <p>收款账号: <span>{{ bigPayInfo.receiveAccountNo }}</span></p>
-                <p>银行: <span>{{ bigPayInfo.accountName }}</span></p>
-                <p>收款方开户地: <span>{{ bigPayInfo.areaInfo }}</span></p>
-                <p>收款网点: <span>{{ bigPayInfo.accountName }}</span></p>
-            </div>
-            <div class="button">
-                <a class="btn btn-close" href="javascript:void(0);" @click="closeBigAlert">换种支付方式</a>
-                <a class="btn btn-confirm" href="javascript:void(0);" @click="RefreshBigBody">已完成转账，请点击</a>
-            </div>
-        </div>
-    </div>
-
 </div>
 <!-- 引入底部 -->
 <template th:replace="components/footer"></template>

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

@@ -143,24 +143,6 @@
                             </div>
                         </template>
                     </div>
-                    <div class="payment" id="offlinePayment" v-if="tabIndex === 1">
-                        <div class="payment-transfer">
-                            <div class="payment-transfer-main" id="paymentTransferMain">
-                                <div class="label"><P class="label-title"><i class="icon mIcon"></i>除了线上支付，您还可以通过直接转账的方式付款</P></div>
-                                <div class="label"><P class="label-t">转账信息</P></div>
-                                <div class="label">
-                                    <P class="text">开户行：中信银行（深圳泰然支行）</P>
-                                    <P class="text">银行卡号：6217 6803 0362 0897</P>
-                                    <P class="text">户名：周仁声</P>
-                                </div>
-                                <div class="label">
-                                    <P class="text-p">订单标识：{{orderIdentificationId}}<a href="javascript: void(0);" class="copy" @click="copyOrderBtnSubmitFn">复制</a></P>
-                                </div>
-                                <div class="label"><P class="label-t">特别注意</P></div>
-                                <div class="label"><P class="label-c">请在转账备注中填写上述订单标识，方便财务快速审核，提高发货速度</P></div>
-                            </div>
-                        </div>
-                    </div>
                 </div>
             </div>
         </div>

src/main/resources/templates/pay/caimei-paylist.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>
-    <template th:replace="pay/components/pay-link"></template>
+    <template th:replace="components/head-link"></template>
     <link th:href="@{/css/pay/caimei-paylist.css(v=${version})}" rel="stylesheet" type="text/css">
     <template th:replace="components/analysis"></template>
 </head>
@@ -17,23 +17,27 @@
     <div class="container" :class="{active: isRequest}" v-show="isRequest">
         <div class="pay-content">
             <div class="pay-title">
-                <div class="pay-title-le">支付订单<span>（因线上支付政策调整，请对每家店铺分别进行付款；若需要直接转账支付订单，请点击右侧按钮查看线下转账信息）</span></div>
-                <div class="pay-title-btn">查看线下转账信息</div>
+                <div class="pay-title-le" v-if="isPC">支付订单<span>（因线上支付政策调整，请对每家店铺分别进行付款；若需要直接转账支付订单，请点击右侧按钮查看线下转账信息）</span></div>
+                <template v-else>
+                    <div class="pay-title-t">支付订单</div>
+                    <div class="pay-title-p">（因线上支付政策调整，请对每家店铺分别进行付款；若需要直接转账支付订单，请点击右侧按钮查看线下转账信息）</div>
+                </template>
+                <div class="pay-title-btn" @click="handleAlert">查看线下转账信息</div>
             </div>
-            <div class="pay-list-title">
+            <div class="pay-list-title" v-if="isPC">
                 <div class="pay-list-view t1">商品信息</div>
                 <div class="pay-list-view t2">单价(元)</div>
                 <div class="pay-list-view t3">数量</div>
                 <div class="pay-list-view t4">小计(元)</div>
             </div>
-            <div class="pay-list-cell clear" v-for="(list, index) in list" :key="index">
+            <div class="pay-list-cell clear" v-for="(list, index) in list" :key="index" :style="{paddingBottom : !isPC && list.paystaut == 0 ? '13.4vw' : '20px'}">
                 <div class="list-cell-title">
                     <div class="list-cell-logo">
                         <img :src="list.shopLogo" alt="">
                     </div>
                     <div class="list-cell-name" v-text="list.shopName"></div>
                 </div>
-                <div class="list-cell-content" v-for="(pros, prosIndex) in list.cartList" :key="prosIndex">
+                <div class="list-cell-content clear" v-for="(pros, prosIndex) in list.cartList" :key="prosIndex">
                     <div class="list-cell-pros p1">
                         <div class="cell-pros-image">
                             <img :src="pros.image" alt="">
@@ -43,28 +47,61 @@
                         </div>
                     </div>
                     <div class="list-cell-pros p2">
+                        <span v-if="!isPC">单价:</span>
                         <p>￥{{pros.price  | NumFormat}}</p>
                     </div>
                     <div class="list-cell-pros p3">
+                        <span v-if="!isPC">数量:</span>
                         <p>{{ pros.num }}</p>
                     </div>
                     <div class="list-cell-pros p4">
+                        <span v-if="!isPC">小计(元):</span>
                         <p>￥{{pros.price | NumFormat}}</p>
                     </div>
                 </div>
                 <div class="list-cell-button">
-                    <div class="list-cell-msg">
-
+                    <div class="list-cell-vleft btn">
+                        <div class="list-cell-btn" v-if="list.paystaut == 0">支付</div>
+                        <div class="list-cell-msg" v-if="list.paidAmount>0">
+                            待付：<span class="red">￥{{list.paidAmount | NumFormat}}</span>
+                        </div>
                     </div>
-                    <div class="list-cell-msg">
-
+                    <div class="list-cell-vleft">
+                        <div class="list-cell-msg" v-if="list.payAmount>0">
+                            已付：<span>￥{{list.payAmount | NumFormat}}</span>
+                        </div>
+                        <div class="list-cell-msg" v-if="list.coupon>0">
+                            优惠：<span>￥{{list.coupon | NumFormat}}</span>
+                        </div>
                     </div>
-                    <div class="list-cell-msg">
-
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="pay-alert-content" v-if="isPayBigAlert" :class="isPayBigAlert ? 'show' : 'none'">
+        <div class="pay-big-alert">
+            <div class="title"><p>线下转账信息</p><i class="icon-close" @click.stop="closeBigAlert"></i></div>
+            <div class="content">
+                <div class="content-top">
+                    <div class="content-viw">
+                        待付金额：<span class="red">￥1600.00</span>
                     </div>
-                    <div class="list-cell-btn">
-
+                    <div class="content-viw">
+                        开户行：<span>中信银行（深圳泰然支行）</span>
+                    </div>
+                    <div class="content-viw">
+                        户名：<span>周仁声</span>
                     </div>
+                    <div class="content-viw">
+                        银行卡号：<span>6217 6803 0362 0897</span>
+                    </div>
+                    <div class="content-viw">
+                        订单标识：<span v-text="orderIdentificationId"></span><span class="copy" @click="copyOrderBtnSubmitFn">复制</span>
+                    </div>
+                </div>
+                <div class="content-bot">
+                    <p>特别注意：</p>
+                    <p>请在转账备注中填写上述订单标识，方便采美财务人员快速审核，提高发货速度</p>
                 </div>
             </div>
         </div>

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

@@ -0,0 +1,60 @@
+<!DOCTYPE html>
+<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>
+    <template th:replace="pay/components/pay-link"></template>
+    <link th:href="@{/css/pay/caimei-payunder.css(v=${version})}" rel="stylesheet" type="text/css">
+    <template th:replace="components/analysis"></template>
+</head>
+<body>
+<div class="head-wrap">
+    <div class="inner clear">
+        <div class="logo"><a href="/index.html"><img src="/img/base/index_logo.png" alt=""></a></div>
+        <div class="text">收银台</div>
+        <input type="hidden" th:value="${coreServer}" id="coreServer">
+        <input type="hidden" th:value="${agent}" id="userAgent">
+    </div>
+</div>
+<div class="pay-container weixin clear" id="payContainer" >
+    <div v-if="loginLoading" class="loading" :style="{opacity: loginLoading ? '1' :'0'}">
+        <img src="/img/base/loading.gif">
+    </div>
+    <div class="container" :class="{active: isRequest}" v-show="isRequest">
+        <div class="pay-content clearfix">
+            <div class="pay-title">提示：本次交易暂不支持线上支付，请使用线下转账方式付款。</div>
+            <div class="pay-amount">
+                <p>待付金额：</p>
+                <h1>￥100000.00</h1>
+            </div>
+            <div class="pay-bank">
+                <div class="pay-bank-content">
+                    <div class="content-viw">
+                        开户行：<span>中信银行（深圳泰然支行）</span>
+                    </div>
+                    <div class="content-viw">
+                        户名：<span>周仁声</span>
+                    </div>
+                    <div class="content-viw">
+                        银行卡号：<span>6217 6803 0362 0897</span>
+                    </div>
+                    <div class="content-viw">
+                        订单标识：<span v-text="orderIdentificationId"></span><span class="copy" @click="copyOrderBtnSubmitFn">复制</span>
+                    </div>
+                </div>
+            </div>
+            <div class="pay-msg">
+                <p>特别注意：请在转账备注中填写上述订单标识，方便采美财务人员快速审核，提高发货速度</p>
+            </div>
+        </div>
+    </div>
+</div>
+<!-- 引入底部 -->
+<template th:replace="components/footer"></template>
+<template th:replace="components/foot-link"></template>
+<script src="https://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/common/serviceapi/pay.service.js(v=${version})}"></script>
+<script charset="utf-8" type="text/javascript" th:src="@{/lib/qrcode.min.js(v=${version})}"></script>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/pay/caimei-payunder.js(v=${version})}"></script>
+
+</body>
+</html>

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

@@ -152,20 +152,15 @@
                                     </div>
                                 </div>
                                 <div class="shopinfo-bott clear">
-                                    <div class="bott-top">
-                                        <div class="count" :class="shop.promotionFullReduction == 0 ? 'none' : ''">共<span class="red">{{shop.itemCount}}</span>件商品</div>
-                                        <div class="total">
-                                            <p class="sum-none" v-if="shop.promotionFullReduction>0">
-                                                <span class="money-sign">￥</span>
-                                                <span class="money">{{ (shop.totalAmount+shop.promotionFullReduction) | NumFormat }}</span>
-                                                <span class="money-reduced">减<span>￥{{ (shop.promotionFullReduction) | NumFormat}}</span></span>
-                                            </p>
-                                            <p :class="shop.promotionFullReduction == 0 ? 'none' : ''"><span>合计：</span><span class="red">￥{{shop.totalAmount | NumFormat}}</span></p>
-                                        </div>
-                                    </div>
-                                    <div v-if="shop.note" class="bott-bot">
-                                         <p>备注: <span>{{shop.note ? shop.note : '无'}}</span></p>
-                                    </div>
+                                    <p v-if="shop.totalAmount>0">商品总额：<span class="none" >{{shop.totalAmount }}</span> </p>
+                                    <p v-if="shop.totalAmount>0">优惠：<span class="none">￥{{shop.totalAmount | NumFormat}}</span> </p>
+                                    <p v-if="shop.totalAmount>0">余额抵扣：<span class="none">￥{{shop.totalAmount | NumFormat}}</span> </p>
+                                    <p v-if="shop.totalAmount>0">应付金额：<span class="none">￥{{shop.totalAmount | NumFormat}}</span> </p>
+                                    <p v-if="shop.totalAmount>0">已付金额：<span class="none">￥{{shop.totalAmount | NumFormat}}</span> </p>
+                                    <p v-if="shop.totalAmount>0">待付金额：<span class="red">￥{{shop.totalAmount | NumFormat}}</span> </p>
+                                </div>
+                                <div class="shopinfo-note" v-if="shop.note" >
+                                    <p>备注:{{shop.note ? shop.note : '无'}}</p>
                                 </div>
                             </div>
                         </div>