订单支付

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

@@ -4,536 +4,109 @@ input::-webkit-inner-spin-button {
 input::-webkit-outer-spin-button {
 	-webkit-appearance: none;
 }
-.page-title {
-	width: 1190px;
-	height: 90px;
-	margin: 0 auto;
-	line-height: 1;
-}
-.page-title .page-name {
-	float: left;
-	display: block;
-	height: 30px;
-	padding: 30px 0;
-	color: #333;
-	font-size: 30px;
+/**
+ * PC端
+ */
+@media screen and (min-width:768px){
+    .inner{width: 1184px;margin: 0 auto;}
+    .pageTitle{height:57px;line-height:57px;padding-top:16px;width: 100%;box-sizing: border-box;padding: 0 16px;}
+    .pageTitle h1{color:#2D3036;font-size:16px;font-weight:bold;float:left}
+    .pageTitle h1 span{color:#627386;font-size:12px;font-weight:normal;}
+    .pageTitle .step{float:right;color:#999999;font-size:14px;height:44px;line-height:44px}
+    .pageTitle .step span{display:inline-block;height:20px;line-height:20px;vertical-align:middle;position:relative;}
+    .pageTitle .step span:before{font-style:normal;font-size:20px;vertical-align:text-top;margin-right:5px}
+    .pageTitle .step span:nth-of-type(1):before{content:'\2776'}
+    .pageTitle .step span:nth-of-type(2):before{content:'\2777'}
+    .pageTitle .step span:nth-of-type(3):before{content:'\2778'}
+    .pageTitle .step span:after{position:absolute;left:0;top:10px;content:'';width:50px;}
+    .pageTitle .step span:first-child{padding-left:0}
+    .pageTitle .step span:first-child:after{display:none}
+    .pageTitle .step span.on{color:#E15616}
+    .pageTitle .step label.line{width: 50px;height: 1px;background: #707070;display: inline-block; margin: 0px 10px}
+    .pageTitle .step label.line.on{background: #E15616;}
+    .pay-container {width: 100%;position: relative;opacity: 0;}
+    .pay-container.active{opacity: 1;}
+    .container{width: 100%;height: auto;float: left;margin-bottom: 30px;}
+    .pay-content{width: 1184px;margin: 0 auto;height: auto;}
+    .pay-title{width: 100%;height: auto;padding: 15px 20px;float: left;background: #ffffff;margin-bottom: 7px;box-sizing:border-box;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
+    .pay-title .title-money{width: 100%;height: 36px;float: left;margin: 7px 0;line-height: 36px;}
+    .pay-title .title-money.big{height: 60px;line-height: 60px;}
+    .pay-title .title-money p{font-size: 16px;color: #333333;float: left;margin-right: 80px;}
+    .pay-title .title-money p.pay-money-big{font-size: 24px;font-weight: bold;}
+    .pay-title .title-money .red{color: #FF2A2A;}
+    .pay-title .pay-input{width: 100%;height: 36px;float: left;line-height: 36px;}
+    .pay-title .pay-input p{font-size: 16px;color: #333333;float: left;}
+    .pay-title .pay-input .input-text{font-size: 18px;color: #333333;}
+    .pay-title .pay-input .input-text span{font-size: 14px;}
+    .pay-title .pay-input .input{width: 215px;height: 34px;display: inline-block;font-size: 14px;line-height: 34px;padding: 0 10px;border: 1px solid #EBEBEB;border-radius: 5px;}
+    .pay-ment{width: 100%;height: auto;float: left;background: #FFFFFF;margin-top: 7px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
+    .pay-ment .pay-record{width: 100%;height: auto;float: left;background: #FFFFFF;padding: 10px 0;box-sizing:border-box;}
+    .pay-ment .pay-record .record-title{width: 100%;padding: 0 20px;background: #FFFFFF;line-height: 44px;font-size: 16px;color: #333333;text-align: left;box-sizing:border-box;}
+    .pay-ment .pay-record .record-content{width: 1160px;height: auto;padding: 8px 540px 8px 20px;margin: 0 auto;background: #F7F7F7;border-radius: 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: #333333;text-align: left;line-height: 30px;}
+    .pay-ment .pay-record .record-content .record-li .record-tb{width: 33.33%;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-method{width: 100%;height: auto;float: left;background: #FFFFFF;margin-top: 20px;}
+    .pay-method .method-title{box-sizing:border-box;width: 100%;padding: 0 20px;background: #FFFFFF;line-height: 44px;font-size: 16px;color: #333333;text-align: left;border-bottom: 1px solid #F7F7F7;}
+    .pay-method .pay-method-tab{width: 100%;height: 42px;float: left;border-bottom: 1px solid #E15616;}
+    .pay-method .pay-method-tab .item{width: 110px;height: 42px;display: block;float: left;text-align: center;line-height: 42px;font-size: 14px;color: #333333;}
+    .pay-method .pay-method-tab .item.active{background: #E15616;color: #FFFFFF;}
+    .pay-method .method-content{width: 100%;height: auto;padding: 20px 0;float: left;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
+    .pay-method .method-content .payment-title{font-size: 14px;line-height: 30px;color: #FF2A2A;text-align: left;padding-left: 20px;}
+    .pay-method .method-content .payment{width: 100%;height: auto;}
+    .pay-bank{width: 100%;height: auto;padding: 0 0 8px 0;background: #FFFFFF;float: left;}
+    .pay-bank .bank-list{width: 100%;height: auto;padding-left: 8px;}
+    .pay-bank .bank-list .bank-text{line-height: 22px;height: 22px;font-size: 16px;color: #333333;padding-left: 20px;margin: 6px 0;}
+    .pay-bank .bank-list .bank-text span{color: #999999;}
+    .pay-bank .bank-list .bank-a{width: 124px;height: 44px;display: block;float: left;margin: 12px;border: 1px solid #FFFFFF;position: relative;border-radius: 2px;}
+    .pay-bank .bank-list .bank-b{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-link{width: 100%;height: 32px;padding: 0 20px;float: left;}
+    .pay-link p{float: left;font-size: 14px;line-height: 32px;color: #666;text-align: left;}
+    .pay-link a{width: 112px;height: 30px;border: 1px solid #e15616;background-color: #ffe6dc; display: block;text-align: center;float: left;font-size: 12px;line-height: 30px;border-radius: 20px;color: #e15616;margin-left: 16px;}
+    .pay-link .inviteCode{width: 112px;height: 30px;border: 1px solid #999;text-align: center;float: left;font-size: 12px;line-height: 30px;border-radius: 2px;color: #333;margin: 0 5px;}
+    .pay-error{width: 1200px;margin: 0 auto;height: 594px;margin-top: 20px;display: none;background: #FFFFFF;}
+    .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: #E15616;border-radius: 2px;font-size: 14px;text-align: center;line-height: 32px;color: #FFFFFF;float: right;}
+    .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: #999999;}
+    .payment-transfer .payment-transfer-main .label .label-t{color: #666;}
+    .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: 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;float: left;line-height: 18px;font-size: 12px;margin-top: 10px;margin-left: 5px;color: #FFF;text-align: center;}
+    .payment-transfer .payment-transfer-main .label .label-c{color: #E15616;}
+    .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;}
+    .footTop{margin-top: 0;}
 }
 
-.progress {
-	float: right;
-	width: 448px;
-	padding-top: 32px;
-}
-.progress-bar {
-	width: 368px;
-	height: 12px;
-	margin: 0 40px;
-}
-.progress .step-1 {
-	background: url(/public/3.0/img/order/progress_1.png) no-repeat center center;
-}
-.progress .step-2 {
-	background: url(/public/3.0/img/order/progress_2.png) no-repeat center center;
-}
-.progress .step-3 {
-	background: url(/public/3.0/img/order/progress_3.png) no-repeat center center;
-}
-.progress .progress-txt {
-	padding: 5px 0;
-	font-size: 12px;
-	font-family: Arial, "鐎瑰缍�;
-}
-.progress-txt .item {
-	float: left;
-	width: 92px;
-	text-align: center;
-}
-.progress-txt .item.middle {
-	width: 264px;
-}
 
-.progress-txt .item.current {
-	color: #E15616;
-}
-.pay-container {
-  width: 100%;
-  position: relative;
-  margin-bottom: 20px;
-  opacity: 0;
-}
-.pay-container.active{
-    opacity: 1;
-}
-.pay-content{
-    width: 1200px;
-    margin: 0 auto;
-    height: auto;
-}
-.pay-title{
-    width: 100%;
-    height: auto;
-    padding: 15px 20px;
-    float: left;
-    background: #ffffff;
-    margin-bottom: 7px;
-}
-.pay-title .title-money{
-	width: 100%;
-	height: 36px;
-	float: left;
-	margin: 7px 0;
-	line-height: 36px;
-}
-.pay-title .title-money.big{
-    height: 88px;
-    line-height: 88px;
-}
-.pay-title .title-money p{
-	font-size: 16px;
-	color: #333333;
-	float: left;
-	margin-right: 80px;
-}
-.pay-title .title-money p.pay-money-big{
-    font-size: 30px;
-}
-.pay-title .title-money .red{
-	color: #FF2A2A;
-}
-.pay-title .pay-input{
-	width: 100%;
-	height: 36px;
-	float: left;
-	line-height: 36px;
-}
-.pay-title .pay-input p{
-	font-size: 16px;
-	color: #333333;
-	float: left;
-}
-.pay-title .pay-input .input-text{
-	font-size: 18px;
-	color: #333333;
-}
-.pay-title .pay-input .input-text span{
-	font-size: 14px;
-}
-.pay-title .pay-input .input{
-	width: 215px;
-	height: 34px;
-	display: inline-block;
-	font-size: 14px;
-	line-height: 34px;
-	padding: 0 10px;
-	border: 1px solid #EBEBEB;
-	border-radius: 5px;
-}
-.pay-ment{
-    width: 100%;
-    height: auto;
-    float: left;
-    background: #FFFFFF;
-    margin-top: 7px;
-}
-.pay-ment .pay-record{
-    width: 100%;
-    height: auto;
-    float: left;
-    background: #FFFFFF;
-    padding: 10px 0;
-}
-.pay-ment .pay-record .record-title{
-    width: 100%;
-    padding: 0 20px;
-    background: #FFFFFF;
-    line-height: 44px;
-    font-size: 20px;
-    color: #333333;
-    text-align: left;
-}
-.pay-ment .pay-record .record-content{
-    width: 1160px;
-    height: auto;
-    padding: 8px 650px 8px 20px;
-    margin: 0 auto;
-    background: #F7F7F7;
-    border-radius: 5px;
-}
-.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: #333333;
-    text-align: left;
-    line-height: 30px;
-}
-.pay-ment .pay-record .record-content .record-li .record-tb{
-    width: 33.33%;
-    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-method{
- 	width: 100%;
-    height: auto;
-    float: left;
-    background: #FFFFFF;
-    margin-top: 20px;
-}
-.pay-method .method-title{
-	width: 100%;
-    padding: 0 20px;
-    background: #FFFFFF;
-    line-height: 44px;
-    font-size: 20px;
-    color: #333333;
-    text-align: left;
-    border-bottom: 1px solid #F7F7F7;
-}
-.pay-method .pay-method-tab{
-	width: 100%;
-	height: 42px;
-	float: left;
-	border-bottom: 2px solid #E15616;
-}
-.pay-method .pay-method-tab .item{
-	width: 110px;
-	height: 42px;
-	display: block;
-	float: left;
-	text-align: center;
-	line-height: 42px;
-	font-size: 14px;
-	color: #333333;
-}
-.pay-method .pay-method-tab .item.active{
-	background: #E15616;
-	color: #FFFFFF;
-}
-.pay-method .method-content{
-	width: 100%;
-	height: auto;
-	padding: 20px 0;
-	float: left;
-}
-.pay-method .method-content .payment-title{
-    font-size: 14px;
-    line-height: 30px;
-    color: #FF2A2A;
-    text-align: left;
-    padding-left: 20px;
-}
-.pay-method .method-content .payment{
-	width: 100%;
-	height: auto;
-}
-.pay-bank{
-    width: 100%;
-    height: auto;
-    padding: 0 0 8px 0;
-    background: #FFFFFF;
-    float: left;
-}
-.pay-bank .bank-list{
-    width: 100%;
-    height: auto;
-    padding-left: 8px;
-}
-.pay-bank .bank-list .bank-text{
-	line-height: 22px;
-	height: 22px;
-	font-size: 16px;
-	color: #333333;
-	padding-left: 20px;
-	margin: 6px 0;
-}
-.pay-bank .bank-list .bank-text span{
-	color: #999999;
-}
-.pay-bank .bank-list .bank-a{
-    width: 124px;
-    height: 44px;
-    display: block;
-    float: left;
-    margin: 12px;
-    border: 2px solid #FFFFFF;
-    position: relative;
-}
-.pay-bank .bank-list .bank-b{
-    width: 124px;
-    height: 44px;;
-    display: block;
-    float: left;
-    margin: 12px;
-    border: 2px solid #FFFFFF;
-    position: relative;
-}
-.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: 34px;
-    height: 28px;
-    position: absolute;
-    bottom: -2px;
-    right: -2px;
-    background: url("/web/order/img/iconbank-active@2x.png") no-repeat;
-    background-size: cover;
-}
-.pay-link{
-    width: 100%;
-    height: 32px;
-    padding: 0 20px;
-    float: left;
-}
-.pay-link p{
-    float: left;
-    font-size: 14px;
-    line-height: 32px;
-    color: #666;
-    text-align: left;
-}
-.pay-link a{
-    width: 112px;
-    height: 30px;
-    border: 1px solid #999;
-    display: block;
-    text-align: center;
-    float: left;
-    font-size: 12px;
-    line-height: 30px;
-    border-radius: 20px;
-    color: #333;
-    margin-left: 16px;
-}
-.pay-link .inviteCode{
-    width: 112px;
-    height: 30px;
-    border: 1px solid #999;
-    text-align: center;
-    float: left;
-    font-size: 12px;
-    line-height: 30px;
-    border-radius: 2px;
-    color: #333;
-    margin: 0 5px;
-}
-.pay-button{
-    width: 100%;
-    height: 44px;
-    padding: 0 20px;
-    margin: 20px 0;
-    float: left;
-}
-.pay-button a{
-    width: 208px;
-    height: 44px;
-    display: block;
-    background:linear-gradient(135deg,rgba(242,143,49,1) 0%,rgba(225,86,22,1) 100%);
-    border-radius: 5px;
-    font-size: 14px;
-    line-height: 44px;
-    text-align: center;
-    color: #FFF6D9;
-    float: right;
-}
-.pay-error{
-    width: 1200px;
-    margin: 0 auto;
-    height: 594px;
-    margin-top: 20px;
-    display: none;
-    background: #FFFFFF;
-}
-.pay-error .icon-error{
-    width: 248px;
-    height: 200px;
-    margin: 0 auto;
-    margin-top: 134px;
-}
-.pay-error .icon-error.again{
-    background: url("/web/order/img/icon-error--1.png") no-repeat;
-    background-size:contain ;
-}
-.pay-error .icon-error.offline{
-    background: url("/web/order/img/icon-error--2.png") no-repeat;
-    background-size:contain ;
-}
-.pay-error .icon-error.fail{
-    background: url("/web/order/img/icon-error--3.png") no-repeat;
-    background-size:contain ;
-}
-.pay-error .icon-error.paid{
-    background: url("/web/order/img/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;
-    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: 24px;
-    height: 24px;
-    display: block;
-    position: absolute;
-    right:12px;
-    top: 12px;
-    background: url("/web/login/img/icon-close.png")no-repeat;
-    background-size: cover;
-    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;
-}
-.pay-alert-content .pay-alert .button a{
-    width: 90px;
-    height: 32px;
-    display: block;
-    background: #E15616;
-    border-radius: 2px;
-    font-size: 14px;
-    text-align: center;
-    line-height: 32px;
-    color: #FFFFFF;
-    float: right;
-}
-.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: #999999;
-}
-.payment-transfer .payment-transfer-main .label .label-t{
-    color: #666;
-}
-.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: 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;
-    float: left;
-    line-height: 18px;
-    font-size: 12px;
-    margin-top: 10px;
-    margin-left: 5px;
-    color: #FFF;
-    text-align: center;
-}
-.payment-transfer .payment-transfer-main .label .label-c{
-    color: #E15616;
-}
+/**
+* 移动端
+*/
+@media screen and (max-width:768px){
+
+
+
+}

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

@@ -1,247 +1,65 @@
-.pay-container {
-  width: 100%;
-  min-height: 583px;
-  position: relative;
-  margin-bottom: 20px;
-  opacity: 0;
+/**
+ * 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;}
+    .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;margin: 0 auto;height: 436px;margin-top: 20px;background: #FFFFFF;box-sizing: border-box;padding: 30px 0;}
+    .pay-content.weixin{border: 2px solid #7AD237;}
+    .pay-content.ali{border: 2px solid #3D8FFB;}
+    .pay-codecontent{width: 1184px;height: auto;float: left;padding:  0 255px;box-sizing: border-box;}
+    .pay-codecontent .pay-amount{width: 278px;height: 100%;float: left;}
+    .pay-codecontent .pay-amount .pay-amount-text{width: 100%;height: auto;float: left;margin-bottom: 40px;}
+    .pay-codecontent .pay-amount .pay-amount-text p{font-size: 16px;text-align: left;color: #333;line-height: 34px;}
+    .pay-codecontent .pay-amount .pay-amount-text p span{margin-left: 5px;}
+    .pay-codecontent .pay-amount .pay-amount-icon{width: 278px;height: 205px;float: left;}
+    .pay-codecontent .pay-amount .pay-amount-icon img{width: 100%;height: 100%;display: block;}
+    .pay-codecontent .pay-codemain{width: 300px;height: auto;float: right;position: relative;}
+    .pay-codecontent .pay-codemain .code-title{width: 100%;height: 34px;line-height: 34px;font-size: 16px;color: #333333;margin-bottom: 20px;text-align: center;}
+    .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: 10px;}
+    .pay-codecontent .pay-codemain .code-footer .code-img{width: 84px;height: 28px;display: block;margin: 0 auto;}
+    /*.pay-alert-content{width: 100%;height: 100%;position: fixed;top: 0;left: 0;background: rgba(0,0,0,0.3);z-index: 9999;display: none;}*/
+    /*.pay-alert-content .pay-alert{width: 340px;height: 208px;padding:0 14px 14px 14px;background: #FFFFFF;border-radius: 5px;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;font-size: 18px;line-height: 48px;text-align: center;color: #333333;float: left;position: relative;border-bottom: 1px solid #EBEBEB;}*/
+    /*.pay-alert-content .pay-alert .title .icon-close{width: 24px;height: 24px;display: block;position: absolute;right:0;top: 12px;background: url("/web/login/img/icon-close.png")no-repeat;background-size: cover;cursor: pointer;}*/
+    /*.pay-alert-content .pay-alert .content{margin: 30px 0;width: 100%;height: auto;line-height: 24px;float: left;}*/
+    /*.pay-alert-content .pay-alert .content h1{text-align: center;font-size: 18px;color: #333333;font-weight: normal;}*/
+    /*.pay-alert-content .pay-alert .content p{text-align: center;font-size: 14px;color: #333333;font-weight: normal;}*/
+    /*.pay-alert-content .pay-alert .button{width: 100%;height: 32px;float: left;}*/
+    /*.pay-alert-content .pay-alert .button a{width: 148px;height: 32px;display: block;background: #E15616;border-radius: 5px;font-size: 14px;text-align: center;line-height: 32px;color: #FFFFFF;margin: 0 auto;}*/
+    .pay-codemain .model{position: absolute;width: 240px;height: 240px;top: 54px;left: 30px;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;}
+    /*微信二维码样式*/
+    iframe{width:202px !important;height: 260px !important}
+    .impowerBox .qrcode {width: 200px !important;}
+    .impowerBox .title {display: none;}
+    .impowerBox .info {width: 200px;}
+    .impowerBox .status_icon {display: none;}
+    .impowerBox .status {text-align: center;display: none;}
+    .impowerBox .qrcode{margin-top: 0;}
+}
+
+/**
+* 移动端
+*/
+@media screen and (max-width:768px){
+
+
+
 }
-.pay-container.active{
-    opacity: 1;
-}
-.pay-content{
-    width: 1200px;
-    margin: 0 auto;
-    height: 583px;
-    margin-top: 20px;
-    background: #FFFFFF;
-    padding-top: 108px;
-}
-.pay-content.weixin{
-    border: 2px solid #7AD237;
-}
-.pay-content.ali{
-    border: 2px solid #3D8FFB;
-}
-.pay-codecontent{
-    width: 1200px;
-    height: auto;
-    float: left;
-    padding:  0 255px;
-}
-.pay-codecontent .pay-amount{
-    width: 278px;
-    height: 100%;
-    float: left;
-}
-.pay-codecontent .pay-amount .pay-amount-text{
-    width: 100%;
-    height: auto;
-    float: left;
-    margin-bottom: 40px;
-}
-.pay-codecontent .pay-amount .pay-amount-text p{
-    font-size: 16px;
-    text-align: left;
-    color: #333;
-    line-height: 34px;
-}
-.pay-codecontent .pay-amount .pay-amount-text p span{
-    margin-left: 5px;
-}
-.pay-codecontent .pay-amount .pay-amount-icon{
-    width: 278px;
-    height: 205px;
-    float: left;
-}
-.pay-codecontent .pay-amount .pay-amount-icon img{
-    width: 100%;
-    height: 100%;
-    display: block;
-}
-.pay-codecontent .pay-codemain{
-    width: 300px;
-    height: auto;
-    float: right;
-    position: relative;
-}
-.pay-codecontent .pay-codemain .code-title{
-    width: 100%;
-    height: 34px;
-    line-height: 34px;
-    font-size: 16px;
-    color: #333333;
-    margin-bottom: 20px;
-    text-align: center;
-}
-.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("/web/order/img/icon-ali@2x.png")no-repeat;
-    background-size: contain;
-}
-.pay-codecontent .pay-codemain .pay-qrCode .icon-wechat{
-    background: url("/web/order/img/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: 10px;
-}
-.pay-codecontent .pay-codemain .code-footer .code-img{
-    width: 84px;
-    height: 28px;
-    display: block;
-    margin: 0 auto;
-}
-.pay-alert-content{
-    width: 100%;
-    height: 100%;
-    position: fixed;
-    top: 0;
-    left: 0;
-    background: rgba(0,0,0,0.3);
-    z-index: 9999;
-    display: none;
-}
-.pay-alert-content .pay-alert{
-    width: 340px;
-    height: 208px;
-    padding:0 14px 14px 14px;
-    background: #FFFFFF;
-    border-radius: 5px;
-    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;
-    font-size: 18px;
-    line-height: 48px;
-    text-align: center;
-    color: #333333;
-    float: left;
-    position: relative;
-    border-bottom: 1px solid #EBEBEB;
-}
-.pay-alert-content .pay-alert .title .icon-close{
-    width: 24px;
-    height: 24px;
-    display: block;
-    position: absolute;
-    right:0;
-    top: 12px;
-    background: url("/web/login/img/icon-close.png")no-repeat;
-    background-size: cover;
-    cursor: pointer;
-}
-.pay-alert-content .pay-alert .content{
-    margin: 30px 0;
-    width: 100%;
-    height: auto;
-    line-height: 24px;
-    float: left;
-}
-.pay-alert-content .pay-alert .content h1{
-    text-align: center;
-    font-size: 18px;
-    color: #333333;
-    font-weight: normal;
-}
-.pay-alert-content .pay-alert .content p{
-    text-align: center;
-    font-size: 14px;
-    color: #333333;
-    font-weight: normal;
-}
-.pay-alert-content .pay-alert .button{
-    width: 100%;
-    height: 32px;
-    float: left;
-}
-.pay-alert-content .pay-alert .button a{
-    width: 148px;
-    height: 32px;
-    display: block;
-    background: #E15616;
-    border-radius: 5px;
-    font-size: 14px;
-    text-align: center;
-    line-height: 32px;
-    color: #FFFFFF;
-    margin: 0 auto;
-}
-.pay-codemain .model{
-    position: absolute;
-    width: 220px;
-    height: 220px;
-    top: 54px;
-    left: 40px;
-    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;
-}
-/*微信二维码样式*/
-iframe{width:202px !important;height: 260px !important}
-.impowerBox .qrcode {width: 200px !important;}
-.impowerBox .title {display: none;}
-.impowerBox .info {width: 200px;}
-.impowerBox .status_icon {display: none;}
-.impowerBox .status {text-align: center;display: none;}
-.impowerBox .qrcode{margin-top: 0;}

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

@@ -1,111 +1,25 @@
-.pay-container{
-    margin-top: 20px;
-    opacity: 0;
-}
-.pay-container.active{
-    opacity: 1;
-}
-.page-title {
-    width: 1190px;
-    height: 90px;
-    margin: 0 auto;
-    line-height: 1;
-}
-.page-title .page-name {
-    float: left;
-    display: block;
-    height: 30px;
-    padding: 30px 0;
-    color: #333;
-    font-size: 30px;
-}
-
-.progress {
-    float: right;
-    width: 448px;
-    padding-top: 32px;
-}
-.progress-bar {
-    width: 368px;
-    height: 12px;
-    margin: 0 40px;
-}
-.progress .step-1 {
-    background: url(/public/3.0/img/order/progress_1.png) no-repeat center center;
-}
-.progress .step-2 {
-    background: url(/public/3.0/img/order/progress_2.png) no-repeat center center;
-}
-.progress .step-3 {
-    background: url(/public/3.0/img/order/progress_3.png) no-repeat center center;
-}
-.progress .progress-txt {
-    padding: 5px 0;
-    font-size: 12px;
-    font-family: Arial, "鐎瑰缍�;
-}
-.progress-txt .item {
-    float: left;
-    width: 92px;
-    text-align: center;
-}
-.progress-txt .item.middle {
-    width: 264px;
-}
+/**
+ * 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;}
+    .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{opacity: 0;}
+    .pay-container.active{opacity: 1;}
+    .pay-content{width: 1184px;margin: 0 auto;margin-bottom: 20px;height: 477px;padding: 50px 0;background-color: #FFFFFF;display: flex;flex-direction: column;}
+    .pay-content .success-icon{display: flex;justify-content: center;}
+    .pay-content .success-icon .icon{width: 200px;height: 200px;background-size: contain;}
+    .pay-content .success-icon .icon.icon-success{background: url("/img/pay/icon-success.png")no-repeat;}
+    .pay-content .success-icon .icon.icon-error{background: url("/img/pay/icon-error.png")no-repeat;}
+    .pay-content .success-text{display: flex;justify-content: center;}
+    .pay-content .success-text .tx1{line-height: 60px;font-size: 30px;color: #FF2A2A;text-align: center;font-weight: 600;}
+    .pay-content .success-text .tx2{line-height: 40px;font-size: 16px;color: #333;text-align: center;}
+    .pay-content .success-text .tx2 span{color: #FF2A2A;}
+    .pay-content .success-text .tx2 a{color: #e15616;margin-left: 10px;}
+    .pay-content .success-text .tx2 a:hover{text-decoration: underline;}
 
-.progress-txt .item.current {
-    color: #E15616;
-}
-.pay-content{
-    width: 1200px;
-    margin: 0 auto;
-    margin-bottom: 20px;
-    height: 477px;
-    padding: 50px 0;
-    background-color: #FFFFFF;
-    display: flex;
-    flex-direction: column;
-}
-.pay-content .success-icon{
-    display: flex;
-    justify-content: center;
-}
-.pay-content .success-icon .icon{
-    width: 200px;
-    height: 200px;
-    background-size: contain;
-}
-.pay-content .success-icon .icon.icon-success{
-    background: url("/web/order/img/icon-success.png")no-repeat;
-}
-.pay-content .success-icon .icon.icon-error{
-    background: url("/web/order/img/icon-error.png")no-repeat;
-}
-.pay-content .success-text{
-    display: flex;
-    justify-content: center;
-}
-.pay-content .success-text .tx1{
-    line-height: 60px;
-    font-size: 30px;
-    color: #FF2A2A;
-    text-align: center;
-    font-weight: 600;
-}
-.pay-content .success-text .tx2{
-    line-height: 40px;
-    font-size: 16px;
-    color: #333;
-    text-align: center;
-}
-.pay-content .success-text .tx2 span{
-    color: #FF2A2A;
-
-}
-.pay-content .success-text .tx2 a{
-    color: #e15616;
-    margin-left: 10px;
-}
-.pay-content .success-text .tx2 a:hover{
-    text-decoration: underline;
 }

src/main/resources/static/js/common/ajax.service.js

@@ -39,8 +39,8 @@ var Http = {
                 }
             }).then(function(res) {
                 if(res.code== -99){
-                    layer.msg('登录已失效,请重新登录', { icon: 7  }, function() {
-                        Http.loginOutFn();
+                    CAIMEI.Alert('登录已失效,请重新登录','去登录',true,function () {
+                        CAIMEI.Storage.clear();
                         location.href = "/login.html";
                     });
                 }else{
@@ -48,34 +48,14 @@ var Http = {
                 }
             }, function(error) {
                 if(error.status==504){
-                    alertInfo('网络请求超时，请重试~');
+                    CAIMEI.Alert('网络请求超时，请重试~','确定',true,function () {
+                        window.location.reload();
+                    });
                 }
                 def.reject(error);
             });
             return def;
         },
-        loginOutFn : function(){//退出登录
-            $.ajax({
-                type: "POST",
-                url: "/login_logoutAjax.action",
-                success: function (data) {
-                    var code = data.errcode;
-                    if(code == 0) {
-                        window.location.href = '/login.jsp';
-                        localStorage.removeItem('userInfo');
-                        if(window.location.href.indexOf("/?logout") > -1) {
-                            history.pushState(null, null, document.URL);  //防止页面后退
-                            window.addEventListener('popstate', function () {
-                                history.pushState(null, null, document.URL);
-                            });
-                        }
-                    }
-                },
-                error : function (res) {
-                    console.log('退出失败',res);
-                }
-            })
-        },
         uploadImage : function(option,callback) {//上传图片
             var NODE_ENV_BASE_URL = $("#spiServer").val();
             var NODE_ENV_BASE_URL = 'https://spi-b.caimei365.com';

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

@@ -13,32 +13,31 @@ var payContainer = new Vue({
             PAY_DATA:{}       //支付数据
         },
         bankData:[
-            {imgUrl:'/web/order/img/iconbank-01@2x.png',bankName:'中国工商银行',bankNum:'ICBC_B2B'},
-            {imgUrl:'/web/order/img/iconbank-02@2x.png',bankName:'招商银行',bankNum:'CMBCHINA_B2B'},
-            {imgUrl:'/web/order/img/iconbank-03@2x.png',bankName:'中国建设银行',bankNum:'CCB_B2B'},
-            {imgUrl:'/web/order/img/iconbank-04@2x.png',bankName:'交通银行',bankNum:'BOCO_B2B'},
-            {imgUrl:'/web/order/img/iconbank-05@2x.png',bankName:'兴业银行',bankNum:'CIB_B2B'},
-            {imgUrl:'/web/order/img/iconbank-06@2x.png',bankName:'中国民生银行',bankNum:'CMBC_B2B'},
-            {imgUrl:'/web/order/img/iconbank-07@2x.png',bankName:'中国广发银行',bankNum:'CEB_B2B'},
-            {imgUrl:'/web/order/img/iconbank-08@2x.png',bankName:'中国银行',bankNum:'BOC_B2B'},
-            {imgUrl:'/web/order/img/iconbank-09@2x.png',bankName:'平安银行',bankNum:'SZPA_B2B'},
-            {imgUrl:'/web/order/img/iconbank-10@2x.png',bankName:'中信银行',bankNum:'ECITIC_B2B'},
-            {imgUrl:'/web/order/img/iconbank-11@2x.png',bankName:'浦发银行',bankNum:'SPDB_B2B'},
-            {imgUrl:'/web/order/img/iconbank-12@2x.png',bankName:'华夏银行',bankNum:'HXB_B2B'},
-            {imgUrl:'/web/order/img/iconbank-13@2x.png',bankName:'北京银行',bankNum:'BCCB_B2B'},
-            {imgUrl:'/web/order/img/iconbank-14@2x.png',bankName:'中国农业银行',bankNum:'ABC_B2B'},
-            {imgUrl:'/web/order/img/iconbank-15@2x.png',bankName:'中国邮政储蓄银行',bankNum:'PSBC_B2B'},
-            {imgUrl:'/web/order/img/iconbank-16@2x.png',bankName:'徽商银行',bankNum:'HSB_B2B'},
-            {imgUrl:'/web/order/img/iconbank-17@2x.png',bankName:'青岛银行',bankNum:'QDYH_B2B'},
-            {imgUrl:'/web/order/img/iconbank-18@2x.png',bankName:'浙商银行',bankNum:'CZ_B2B'},
-            {imgUrl:'/web/order/img/iconbank-19@2x.png',bankName:'齐鲁银行',bankNum:'QLYH_B2B'},
+            {imgUrl:'/img/pay/iconbank-01@2x.png',bankName:'中国工商银行',bankNum:'ICBC_B2B'},
+            {imgUrl:'/img/pay/iconbank-02@2x.png',bankName:'招商银行',bankNum:'CMBCHINA_B2B'},
+            {imgUrl:'/img/pay/iconbank-03@2x.png',bankName:'中国建设银行',bankNum:'CCB_B2B'},
+            {imgUrl:'/img/pay/iconbank-04@2x.png',bankName:'交通银行',bankNum:'BOCO_B2B'},
+            {imgUrl:'/img/pay/iconbank-05@2x.png',bankName:'兴业银行',bankNum:'CIB_B2B'},
+            {imgUrl:'/img/pay/iconbank-06@2x.png',bankName:'中国民生银行',bankNum:'CMBC_B2B'},
+            {imgUrl:'/img/pay/iconbank-07@2x.png',bankName:'中国广发银行',bankNum:'CEB_B2B'},
+            {imgUrl:'/img/pay/iconbank-08@2x.png',bankName:'中国银行',bankNum:'BOC_B2B'},
+            {imgUrl:'/img/pay/iconbank-09@2x.png',bankName:'平安银行',bankNum:'SZPA_B2B'},
+            {imgUrl:'/img/pay/iconbank-10@2x.png',bankName:'中信银行',bankNum:'ECITIC_B2B'},
+            {imgUrl:'/img/pay/iconbank-11@2x.png',bankName:'浦发银行',bankNum:'SPDB_B2B'},
+            {imgUrl:'/img/pay/iconbank-12@2x.png',bankName:'华夏银行',bankNum:'HXB_B2B'},
+            {imgUrl:'/img/pay/iconbank-13@2x.png',bankName:'北京银行',bankNum:'BCCB_B2B'},
+            {imgUrl:'/img/pay/iconbank-14@2x.png',bankName:'中国农业银行',bankNum:'ABC_B2B'},
+            {imgUrl:'/img/pay/iconbank-15@2x.png',bankName:'中国邮政储蓄银行',bankNum:'PSBC_B2B'},
+            {imgUrl:'/img/pay/iconbank-16@2x.png',bankName:'徽商银行',bankNum:'HSB_B2B'},
+            {imgUrl:'/img/pay/iconbank-17@2x.png',bankName:'青岛银行',bankNum:'QDYH_B2B'},
+            {imgUrl:'/img/pay/iconbank-18@2x.png',bankName:'浙商银行',bankNum:'CZ_B2B'},
+            {imgUrl:'/img/pay/iconbank-19@2x.png',bankName:'齐鲁银行',bankNum:'QLYH_B2B'}
         ],
         methodTab:['线上支付','转账支付'],
         mobileData:[
-            {imgUrl:'/web/order/img/iconbank-ali@2x.png',bankName:'支付宝支付',bankNum:'ALIPAY'},
-            {imgUrl:'/web/order/img/iconbank-wx@2x.png',bankName:'微信支付',bankNum:'WEIXIN'},
-            {imgUrl:'/web/order/img/iconbank-bank@2x.png',bankName:'网银支付',bankNum:'ICBC_B2B'},
-
+            {imgUrl:'/img/pay/iconbank-ali@2x.png',bankName:'支付宝支付',bankNum:'ALIPAY'},
+            {imgUrl:'/img/pay/iconbank-wx@2x.png',bankName:'微信支付',bankNum:'WEIXIN'},
+            {imgUrl:'/img/pay/iconbank-bank@2x.png',bankName:'网银支付',bankNum:'ICBC_B2B'}
         ],
         pageType:'',//页面跳转类型
         paidAmount:'',//订单待付金额
@@ -66,7 +65,7 @@ var payContainer = new Vue({
         productID:''//发布商品的ID
     },
     filters: {
-        NumFormat(value) {
+        NumFormat:function(value) {
             if(!value) return '0.00';
             var intPart = Number(value) - Number(value)%1; //获取整数部分（这里是windy93的方法）
             var intPartFormat = intPart.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,'); //将整数部分逢三一断
@@ -86,169 +85,162 @@ var payContainer = new Vue({
     },
     methods: {
         infoPayOrderCheckoutCounter:function(){//初始化订单数据
-            var _this = this;
-            PayApi.PayOrderCheckoutCounter({orderId:_this.payInfo.PAY_ORDERID},function(response){
+            var _self = this;
+            PayApi.PayOrderCheckoutCounter({orderId:_self.payInfo.PAY_ORDERID},function(response){
                 if(response.code == 0){
                     // console.log(response);
                     var data = response.data; //金额初始化
-                    _this.payInfo.PAY_UNPAIDAMOUNT = (data.order.payableAmount - data.order.receiptAmount).toFixed(2);
-                    _this.payInfo.PAY_PAYAMOUNT = (data.order.payableAmount-data.order.receiptAmount).toFixed(2);
-                    _this.discernReceiptList = data.discernReceipt;
-                    _this.paidAmount =  (data.order.payableAmount-data.order.receiptAmount).toFixed(2);
-                    _this.receiptAmount =  data.order.receiptAmount;
-                    _this.payableAmount=  data.order.payableAmount;
-                    _this.balanceAmount =  ( _this.payableAmount - _this.receiptAmount).toFixed(2) - _this.payInfo.PAY_PAYAMOUNT;
-                    _this.payAmount =  (_this.payableAmount - _this.receiptAmount).toFixed(2);//本次支付金额
-                    _this.paySuccessCounter = data.order.paySuccessCounter;
-                    _this.receiptStatus =  data.order.receiptStatus;
-                    _this.invoiceStatus = data.order.invoiceStatus;
-                    _this.onlinePayFlag = data.order.onlinePayFlag;
-                    if(_this.receiptAmount>0){
-                        _this.payStatusText = '使用微信和企业网银支付全部金额后，供应商会在24小时后发货（周末、节假日顺延）。';
-                        _this.isReceiptStatus = false;
+                    _self.payInfo.PAY_UNPAIDAMOUNT = (data.order.payableAmount - data.order.receiptAmount).toFixed(2);
+                    _self.payInfo.PAY_PAYAMOUNT = (data.order.payableAmount-data.order.receiptAmount).toFixed(2);
+                    _self.discernReceiptList = data.discernReceipt;
+                    _self.paidAmount =  (data.order.payableAmount-data.order.receiptAmount).toFixed(2);
+                    _self.receiptAmount =  data.order.receiptAmount;
+                    _self.payableAmount=  data.order.payableAmount;
+                    _self.balanceAmount =  ( _self.payableAmount - _self.receiptAmount).toFixed(2) - _self.payInfo.PAY_PAYAMOUNT;
+                    _self.payAmount =  (_self.payableAmount - _self.receiptAmount).toFixed(2);//本次支付金额
+                    _self.paySuccessCounter = data.order.paySuccessCounter;
+                    _self.receiptStatus =  data.order.receiptStatus;
+                    _self.invoiceStatus = data.order.invoiceStatus;
+                    _self.onlinePayFlag = data.order.onlinePayFlag;
+                    if(_self.receiptAmount>0){
+                        _self.payStatusText = '使用微信和企业网银支付全部金额后，供应商会在24小时后发货（周末、节假日顺延）。';
+                        _self.isReceiptStatus = false;
                     }else{
-                        _this.payStatusText = '使用微信和企业网银支付全部金额后，供应商会在24小时后发货（周末、节假日顺延）。若着急发货，可以选择使用线下转账进行付款。';
-                _this.isReceiptStatus = true;
+                        _self.payStatusText = '使用微信和企业网银支付全部金额后，供应商会在24小时后发货（周末、节假日顺延）。若着急发货，可以选择使用线下转账进行付款。';
+                _self.isReceiptStatus = true;
             }
-            _this.isRequest = true;
+            _self.isRequest = true;
         }else{
             layer.msg(response.msg, {icon: 7});
 }
             })
         },
         PayMobileSubmitFn:function(){//点击移动支付方式
-            var _this = this;
-            if(_this.invoiceStatus){
-                _this.layerConfirm();
+            var _self = this;
+            if(_self.invoiceStatus){
+                _self.layerConfirm();
             }else{
-                if(_this.payInfo.PAY_BANK_NUM == ''){
-                    layer.msg('请选择支付方式！');
+                if(_self.payInfo.PAY_BANK_NUM == ''){
+                    CAIMEI.dialog('请选择支付方式');
                     return;
                 }
-                if(_this.payAmount == ''){
-                    layer.msg('请输入本次支付金额');
+                if(_self.payAmount == ''){
+                    CAIMEI.dialog('请输入本次支付金额');
                     return;
                 }
-                if(_this.payAmount == 0){
-                    layer.msg('本次支付金额不能为0');
+                if(_self.payAmount == 0){
+                    CAIMEI.dialog('本次支付金额不能为0');
                     return;
                 }
-                if(_this.payAmount*100 < 2){
-                    layer.msg('本次支付金额必须大于￥0.02');
+                if(_self.payAmount*100 < 2){
+                    CAIMEI.dialog('本次支付金额必须大于￥0.02');
                     return;
                 }
-                if(_this.payAmount > _this.paymentIimit){
-                    switch (_this.payInfo.PAY_BANK_NUM) {
+                if(_self.payAmount > _self.paymentIimit){
+                    switch (_self.payInfo.PAY_BANK_NUM) {
                         case 'WEIXIN':
-                            _this.paymentIimitText = '本次支付金额已超出微信支付限额，请输入小于5万的金额进行支付';
+                            _self.paymentIimitText = '本次支付金额已超出微信支付限额，请输入小于5万的金额进行支付';
                             break;
                         case 'ALIPAY':
-                            _this.paymentIimitText = '本次支付金额已超出支付宝限额，请输入小于5万的金额进行支付';
+                            _self.paymentIimitText = '本次支付金额已超出支付宝限额，请输入小于5万的金额进行支付';
                             break;
                     }
-                    layer.confirm(_this.paymentIimitText, {
-                        title:"提示",
-                        btn: ['知道了'], //按钮
-                    }, function () {
-                        layer.closeAll();
-                    }, function () {
-
-                    });
+                    CAIMEI.Alert(_self.paymentIimitText,'知道了');
                     return;
                 }
-                if(_this.payInfo.PAY_BANK_NUM == "WEIXIN"){
-                    if(_this.pageType === '1'){
-                        _this.payInfo.PAY_DATA = {//二手
-                            type:_this.payInfo.PAY_BANK_NUM,
-                            productId:_this.productID,
-                            amount:_this.payAmount,
-                            url:_this.payInfo.PAY_MOBILE_URL
+                if(_self.payInfo.PAY_BANK_NUM == "WEIXIN"){
+                    if(_self.pageType === '1'){
+                        _self.payInfo.PAY_DATA = {//二手
+                            type:_self.payInfo.PAY_BANK_NUM,
+                            productId:_self.productID,
+                            amount:_self.payAmount,
+                            url:_self.payInfo.PAY_MOBILE_URL
                         };
-                        _util.setStorageItem('PAY_DATA',JSON.stringify(_this.payInfo.PAY_DATA));
-                        window.open("/web/order/view/pay/caimei-paymobile.jsp?pageType=1");
-                        _this.isPayAlert = true;
+                        CAIMEI.Storage.setItem('PAY_DATA',JSON.stringify(_self.payInfo.PAY_DATA));
+                        window.open("/pay/caimei-paymobile.html?pageType=1");
+                        _self.isPayAlert = true;
                     }else{
-                        _this.payInfo.PAY_DATA = {//正常订单
-                            type:_this.payInfo.PAY_BANK_NUM,
-                            orderid:_this.payInfo.PAY_ORDERID,
-                            amount:_this.payAmount,
-                            url:_this.payInfo.PAY_MOBILE_URL
+                        _self.payInfo.PAY_DATA = {//正常订单
+                            type:_self.payInfo.PAY_BANK_NUM,
+                            orderid:_self.payInfo.PAY_ORDERID,
+                            amount:_self.payAmount,
+                            url:_self.payInfo.PAY_MOBILE_URL
                         };
-                        _util.setStorageItem('PAY_DATA',JSON.stringify(_this.payInfo.PAY_DATA));
-                        window.open("/web/order/view/pay/caimei-paymobile.jsp");
-                        _this.isPayAlert = true;
+                        CAIMEI.Storage.setItem('PAY_DATA',JSON.stringify(_self.payInfo.PAY_DATA));
+                        window.open("/pay/caimei-paymobile.html");
+                        _self.isPayAlert = true;
                     }
                 }else{
-                    if(_this.pageType === '1'){
+                    if(_self.pageType === '1'){
                         var params = {//二手
-                            payWay:_this.payInfo.PAY_BANK_NUM,
+                            payWay:_self.payInfo.PAY_BANK_NUM,
                             returnUrl:'https://www.caimei365.com/',
-                            productId:_this.productID,
+                            productId:_self.productID,
                         };
-                        _this.PayOrdersecondHandPay(params,_this.payInfo.PAY_BANK_NUM);
+                        _self.PayOrdersecondHandPay(params,_self.payInfo.PAY_BANK_NUM);
                     }else{
                         var params = {//正常订单
-                                payWay:_this.payInfo.PAY_BANK_NUM,
-                                payAmount:parseInt(_this.payAmount*100),
+                                payWay:_self.payInfo.PAY_BANK_NUM,
+                                payAmount:parseInt(_self.payAmount*100),
                                 returnUrl:'https://www.caimei365.com/',
-                                orderId:_this.payInfo.PAY_ORDERID
+                                orderId:_self.payInfo.PAY_ORDERID
                         };
-                        _this.PayOrderPcMallPay(params,_this.payInfo.PAY_BANK_NUM);
+                        _self.PayOrderPcMallPay(params,_self.payInfo.PAY_BANK_NUM);
                     }
                 }
             }
         },
         PaySubmitFn:function(){//点击网银支付方式
-            var _this = this;
-            if(_this.invoiceStatus){
-                _this.layerConfirm();
+            var _self = this;
+            if(_self.invoiceStatus){
+                _self.layerConfirm();
             }else{
-                if(_this.payInfo.PAY_BANK_NUM == ''){
-                    layer.msg('请选择银行！');
+                if(_self.payInfo.PAY_BANK_NUM == ''){
+                    CAIMEI.dialog('请选择银行！');
                     return;
                 }
-                if(_this.payAmount <= 10){
-                    layer.msg('企业网银支付的金额必须大于￥10.00');
+                if(_self.payAmount <= 10){
+                    CAIMEI.dialog('企业网银支付的金额必须大于￥10.00');
                     return;
                 }
-                if(_this.pageType === '1'){
+                if(_self.pageType === '1'){
                     var params = {//二手
                             payWay:'UNIONPAY',
-                            payAmount: parseInt(_this.payAmount*100),
-                            bankCode:_this.payInfo.PAY_BANK_NUM,
+                            payAmount: parseInt(_self.payAmount*100),
+                            bankCode:_self.payInfo.PAY_BANK_NUM,
                             returnUrl:'https://www.caimei365.com/',
-                            productId:_this.productID,
+                            productId:_self.productID,
                     };
-                    _this.PayOrdersecondHandPay(params,_this.payInfo.PAY_BANK_NUM);
+                    _self.PayOrdersecondHandPay(params,_self.payInfo.PAY_BANK_NUM);
                 }else{
                     var params = {//正常订单
                             payWay:'UNIONPAY',
-                            payAmount: parseInt(_this.payAmount*100),
-                            bankCode:_this.payInfo.PAY_BANK_NUM,
+                            payAmount: parseInt(_self.payAmount*100),
+                            bankCode:_self.payInfo.PAY_BANK_NUM,
                             returnUrl:'https://www.caimei365.com/',
-                            orderId:_this.payInfo.PAY_ORDERID
+                            orderId:_self.payInfo.PAY_ORDERID
                     };
-                    _this.PayOrderPcMallPay(params,_this.payInfo.PAY_BANK_NUM);
+                    _self.PayOrderPcMallPay(params,_self.payInfo.PAY_BANK_NUM);
                 }
             }
         },
         PayOrderPcMallPay:function(params,type){//网银&&支付宝生成支付地址
-            var _this = this;
+            var _self = this;
             PayApi.PayOrderPcMallPay(params,function(response){
                 if(response.code == 0){
-                    _this.isPayAlert = true;
-                    _this.mbOrderId = response.data.data.mbOrderId;
+                    _self.isPayAlert = true;
+                    _self.mbOrderId = response.data.data.mbOrderId;
                     if(type == 'ALIPAY'){
-                        _this.payInfo.PAY_MOBILE_URL = response.data.data.payUrl;
-                        _this.payInfo.PAY_DATA = {
-                            mbOrderId:_this.mbOrderId,
-                            type:_this.payInfo.PAY_BANK_NUM,
-                            orderid:_this.payInfo.PAY_ORDERID,
-                            amount:_this.payAmount,
-                            url:_this.payInfo.PAY_MOBILE_URL
+                        _self.payInfo.PAY_MOBILE_URL = response.data.data.payUrl;
+                        _self.payInfo.PAY_DATA = {
+                            mbOrderId:_self.mbOrderId,
+                            type:_self.payInfo.PAY_BANK_NUM,
+                            orderid:_self.payInfo.PAY_ORDERID,
+                            amount:_self.payAmount,
+                            url:_self.payInfo.PAY_MOBILE_URL
                         };
-                        _util.setStorageItem('PAY_DATA',JSON.stringify(_this.payInfo.PAY_DATA));
-                        window.open("/web/order/view/pay/caimei-paymobile.jsp?pageType=1");
+                        CAIMEI.Storage.setItem('PAY_DATA',JSON.stringify(_self.payInfo.PAY_DATA));
+                        window.open("/pay/caimei-paymobile.html?pageType=1");
                     }else{
                         window.open(response.data.data.payUrl);
                     }
@@ -258,33 +250,33 @@ var payContainer = new Vue({
             })
         },
         PayOrdersecondHandPay:function(params,type){//二手支付请求
-            var _this = this;
+            var _self = this;
             PayApi.PayOrdersecondHandPay(params,function(response){
                 if(response.code == 0){
-                    _this.isPayAlert = true;
-                    _this.mbOrderId = response.data.data.mbOrderId;
+                    _self.isPayAlert = true;
+                    _self.mbOrderId = response.data.data.mbOrderId;
                     if(type == 'ALIPAY'){
-                        _this.payInfo.PAY_MOBILE_URL = response.data.data.payUrl;
-                        if(_this.pageType === '1'){
-                            _this.payInfo.PAY_DATA = {
-                                mbOrderId:_this.mbOrderId,
-                                type:_this.payInfo.PAY_BANK_NUM,
-                                productId:_this.productID,
-                                amount:_this.payAmount,
-                                url:_this.payInfo.PAY_MOBILE_URL
+                        _self.payInfo.PAY_MOBILE_URL = response.data.data.payUrl;
+                        if(_self.pageType === '1'){
+                            _self.payInfo.PAY_DATA = {
+                                mbOrderId:_self.mbOrderId,
+                                type:_self.payInfo.PAY_BANK_NUM,
+                                productId:_self.productID,
+                                amount:_self.payAmount,
+                                url:_self.payInfo.PAY_MOBILE_URL
                             };
-                            _util.setStorageItem('PAY_DATA',JSON.stringify(_this.payInfo.PAY_DATA));
-                            window.open("/web/order/view/pay/caimei-paymobile.jsp?pageType=1");
+                            CAIMEI.Storage.setItem('PAY_DATA',JSON.stringify(_self.payInfo.PAY_DATA));
+                            window.open("/pay/caimei-paymobile.html?pageType=1");
                         }else{
-                            _this.payInfo.PAY_DATA = {
-                                mbOrderId:_this.mbOrderId,
-                                type:_this.payInfo.PAY_BANK_NUM,
-                                orderid:_this.payInfo.PAY_ORDERID,
-                                amount:_this.payAmount,
-                                url:_this.payInfo.PAY_MOBILE_URL
+                            _self.payInfo.PAY_DATA = {
+                                mbOrderId:_self.mbOrderId,
+                                type:_self.payInfo.PAY_BANK_NUM,
+                                orderid:_self.payInfo.PAY_ORDERID,
+                                amount:_self.payAmount,
+                                url:_self.payInfo.PAY_MOBILE_URL
                             };
-                            _util.setStorageItem('PAY_DATA',JSON.stringify(_this.payInfo.PAY_DATA));
-                            window.open("/web/order/view/pay/caimei-paymobile.jsp");
+                            CAIMEI.Storage.setItem('PAY_DATA',JSON.stringify(_self.payInfo.PAY_DATA));
+                            window.open("/pay/caimei-paymobile.html");
                         }
                     }else{
                         window.open(response.data.data.payUrl);
@@ -295,27 +287,27 @@ var payContainer = new Vue({
             })
         },
         changePayAmount:function(event){//输入支付金额控制
-            var _this = this;
+            var _self = this;
             var value = event.target.value;
             if(value == "" || value <0 ){//判断是否等于0 或者为空
-                _this.payAmount = '';
-                _this.payInfo.PAY_PAYAMOUNT = _this.payInfo.PAY_UNPAIDAMOUNT;
-                _this.balanceAmount = _this.toFixedFn(_this.payInfo.PAY_UNPAIDAMOUNT);
+                _self.payAmount = '';
+                _self.payInfo.PAY_PAYAMOUNT = _self.payInfo.PAY_UNPAIDAMOUNT;
+                _self.balanceAmount = _self.toFixedFn(_self.payInfo.PAY_UNPAIDAMOUNT);
                 return;
-            }else if(Number(value) > _this.payInfo.PAY_UNPAIDAMOUNT){//判断大于应付金额
-                _this.payAmount = _this.payInfo.PAY_UNPAIDAMOUNT;
-                _this.payInfo.PAY_PAYAMOUNT =  _this.payAmount;
-                _this.balanceAmount = _this.toFixedFn(_this.payInfo.PAY_UNPAIDAMOUNT-_this.payInfo.PAY_PAYAMOUNT);
+            }else if(Number(value) > _self.payInfo.PAY_UNPAIDAMOUNT){//判断大于应付金额
+                _self.payAmount = _self.payInfo.PAY_UNPAIDAMOUNT;
+                _self.payInfo.PAY_PAYAMOUNT =  _self.payAmount;
+                _self.balanceAmount = _self.toFixedFn(_self.payInfo.PAY_UNPAIDAMOUNT-_self.payInfo.PAY_PAYAMOUNT);
             }else{
-                _this.payAmount = value;
-                _this.payInfo.PAY_PAYAMOUNT = _this.payAmount;
-                _this.balanceAmount = _this.toFixedFn(_this.payInfo.PAY_UNPAIDAMOUNT-_this.payInfo.PAY_PAYAMOUNT);
+                _self.payAmount = value;
+                _self.payInfo.PAY_PAYAMOUNT = _self.payAmount;
+                _self.balanceAmount = _self.toFixedFn(_self.payInfo.PAY_UNPAIDAMOUNT-_self.payInfo.PAY_PAYAMOUNT);
             }
         },
         changePayAmountBlur:function(event){//失去焦点设置金额
-            var _this = this;
-            _this.payAmount = _this.toFixedFn(event.target.value);
-            _this.payInfo.PAY_PAYAMOUNT = _this.payAmount;
+            var _self = this;
+            _self.payAmount = _self.toFixedFn(event.target.value);
+            _self.payInfo.PAY_PAYAMOUNT = _self.payAmount;
         },
         changeTab:function(index,item){//选择支付方式切换
             this.tabIndex = index;
@@ -340,77 +332,77 @@ var payContainer = new Vue({
             this.payInfo.PAY_BANK_NUM = item.bankNum;
         },
         copyLinkPaySubmitFn:function(){//复制网银支付链接
-            var _this = this;
-            if(_this.invoiceStatus){
-                _this.layerConfirm();
+            var _self = this;
+            if(_self.invoiceStatus){
+                _self.layerConfirm();
             }else{
-                if(_this.payAmount == ''){
-                    layer.msg('请输入本次支付金额');
+                if(_self.payAmount == ''){
+                    CAIMEI.dialog('请输入本次支付金额');
                     return;
                 }
-                if(_this.payAmount == 0){
-                    layer.msg('本次支付金额不能为0');
+                if(_self.payAmount == 0){
+                    CAIMEI.dialog('本次支付金额不能为0');
                     return;
                 }
-                if(_this.payAmount <= 10){
-                    layer.msg('企业网银支付的金额必须大于￥10.00');
+                if(_self.payAmount <= 10){
+                    CAIMEI.dialog('企业网银支付的金额必须大于￥10.00');
                     return;
                 }
-                PayApi.PayOrderPayLink({unpaidAmount:_this.payAmount,orderId:_this.payInfo.PAY_ORDERID},function(response){
-                    _this.bankPayLink_url = response.data;
+                PayApi.PayOrderPayLink({unpaidAmount:_self.payAmount,orderId:_self.payInfo.PAY_ORDERID},function(response){
+                    _self.bankPayLink_url = response.data;
                     var oInput = document.createElement("textarea");
-                    oInput.value = _this.bankPayLink_url;
+                    oInput.value = _self.bankPayLink_url;
                     document.body.appendChild(oInput);
                     oInput.select(); // 选择对象
                     document.execCommand("Copy"); // 执行浏览器复制命令
                     document.body.removeChild(oInput);
-                    layer.msg('复制成功');
+                    CAIMEI.dialog('复制成功');
                 })
             }
         },
         copyOrderBtnSubmitFn:function(){//复制订单标识
-            var _this = this;
+            var _self = this;
             var oInput = document.createElement("textarea");
-            oInput.value = _this.orderIdentificationId;
+            oInput.value = _self.orderIdentificationId;
             document.body.appendChild(oInput);
             oInput.select(); // 选择对象
             document.execCommand("Copy"); // 执行浏览器复制命令
             document.body.removeChild(oInput);
-            layer.msg('复制成功');
+            CAIMEI.dialog('复制成功');
         },
         hidePayAlert:function(){//隐藏已支付弹窗
-            var _this = this;
-            _this.isPayAlert = false;
+            var _self = this;
+            _self.isPayAlert = false;
         },
         RefreshBody:function(){//刷新页面
-            var _this = this;
-            if(_this.payInfo.PAY_BANK_NUM == 'WEIXIN'){
-                PayApi.PayOrderPayWhetherSuccess({orderId: _this.payInfo.PAY_ORDERID, paySuccessCounter:_this.paySuccessCounter},function(response){
-                    _this.isPayAlert = false;
+            var _self = this;
+            if(_self.payInfo.PAY_BANK_NUM == 'WEIXIN'){
+                PayApi.PayOrderPayWhetherSuccess({orderId: _self.payInfo.PAY_ORDERID, paySuccessCounter:_self.paySuccessCounter},function(response){
+                    _self.isPayAlert = false;
                     if(response.code === 0){
-                        _this.windowLocationHref('success');
+                        _self.windowLocationHref('success');
                     }else{
-                        _this.windowLocationHref('error');
+                        _self.windowLocationHref('error');
                     }
                 });
             }else{
-                PayApi.PayOrderFindOrderStatus({mbOrderId:_this.mbOrderId},function(response){
-                    _this.isPayAlert = false;
+                PayApi.PayOrderFindOrderStatus({mbOrderId:_self.mbOrderId},function(response){
+                    _self.isPayAlert = false;
                     var data = response.data.data;
                     if(data.status === '1'){
-                        _this.windowLocationHref('success');
+                        _self.windowLocationHref('success');
                     }else{
-                        _this.windowLocationHref('error');
+                        _self.windowLocationHref('error');
                     }
                 });
             }
         },
         windowLocationHref:function(state){
-            var _this = this;
-            if( _this.pageType === '1'){
-                window.location.href = '/web/order/view/pay/caimei-success.jsp?pageType=second&type='+state+'&payAmount='+_this.payAmount;
+            var _self = this;
+            if( _self.pageType === '1'){
+                window.location.href = '/pay/success.html?pageType=second&type='+state+'&payAmount='+_self.payAmount;
             }else{
-                window.location.href = '/web/order/view/pay/caimei-success.jsp?pageType=www&type='+state+'&payAmount='+_this.payAmount;
+                window.location.href = '/pay/success.html?pageType=www&type='+state+'&payAmount='+_self.payAmount;
             }
         },
         payTypeText:function(state){//处理支付记录文字
@@ -433,37 +425,32 @@ var payContainer = new Vue({
             return Number(text).toFixed(2);
         },
         layerConfirm:function(){
-            layer.confirm('本次交易暂不支持线上支付开票,请使用线下转账的方式付款', {
-                title:"提示",
-                btn: ['知道了'], //按钮
-            }, function () {
-                layer.closeAll();
-                _this.payStatusText = '使用微信和企业网银支付全部金额后，供应商会在24小时后发货（周末、节假日顺延）。若着急发货，可以选择使用线下转账进行付款。';
-                _this.isReceiptStatus = true;
-            }, function () {
-
+            var _self = this;
+            CAIMEI.Alert('本次交易暂不支持线上支付开票,请使用线下转账的方式付款','知道了',true,function () {
+                _self.payStatusText = '使用微信和企业网银支付全部金额后，供应商会在24小时后发货（周末、节假日顺延）。若着急发货，可以选择使用线下转账进行付款。';
+                _self.isReceiptStatus = true;
             });
-        },
+        }
     },
     mounted: function () {
-        var _this = this;
-        _this.pageType = _util.getUrlParam('pageType');
-        if( _this.pageType === '1'){//二手
-            _this.productID = _util.getUrlParam('productID');
-            _this.payAmount = _this.toFixedFn(100);
-            _this.isRequest = true;
-            _this.payStatusText = '';
+        var _self = this;
+        _self.pageType = CAIMEI.getUrlParam('pageType');
+        if( _self.pageType === '1'){//二手
+            _self.productID = CAIMEI.getUrlParam('productID');
+            _self.payAmount = _self.toFixedFn(100);
+            _self.isRequest = true;
+            _self.payStatusText = '';
         }else{
-             var HrefType = _util.getUrlParam('type');
+             var HrefType = CAIMEI.getUrlParam('type');
             if(HrefType == 'payfirm'){
-                _this.payInfo.PAY_ORDERID =  _util.getUrlParam('orderID');
-                _this.orderIdentificationId = '#'+_this.payInfo.PAY_ORDERID+'#';
+                _self.payInfo.PAY_ORDERID =  CAIMEI.getUrlParam('orderID');
+                _self.orderIdentificationId = '#'+_self.payInfo.PAY_ORDERID+'#';
             }else{
                 var data =JSON.parse(localStorage.getItem("confirmOrderInfo"));
-                _this.payInfo.PAY_ORDERID = data.data.orderID;
-                _this.orderIdentificationId = '#'+_this.payInfo.PAY_ORDERID+'#';
+                _self.payInfo.PAY_ORDERID = data.data.orderID;
+                _self.orderIdentificationId = '#'+_self.payInfo.PAY_ORDERID+'#';
             }
-            _this.infoPayOrderCheckoutCounter();//正常订单初始化
+            _self.infoPayOrderCheckoutCounter();//正常订单初始化
         }
 
 

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

@@ -4,6 +4,7 @@
 var payContainer = new Vue({
     el:"#payContainer",
     data: {
+        loginLoading:true,
         payInfo:{
             PAY_TYPE:'',//支付类型 WEIXIN 微信支付  ALIPAY 支付宝支付
             PAY_ORDERID:'', //订单ID
@@ -28,7 +29,7 @@ var payContainer = new Vue({
         productID:''//商品ID
     },
     filters: {
-        NumFormat(value) {
+        NumFormat:function(value) {
             if(!value) return '0.00';
             var intPart = Number(value) - Number(value)%1; //获取整数部分（这里是windy93的方法）
             var intPartFormat = intPart.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,'); //将整数部分逢三一断
@@ -48,36 +49,32 @@ var payContainer = new Vue({
     },
     methods: {
         infoPayOrderCheckoutCounter:function(){//初始化订单数据
-            var _this = this;
-            if( _this.pageType === '1'){
-                layer.load(0,{shade: [0.1,'#000000']}); //0.1透明度的白色背景
+            var _self = this;
+            if( _self.pageType === '1'){
                 setTimeout(function(){
-                    _this.isRequest = true;
-                    switch (_this.payInfo.PAY_TYPE) {
+                    switch (_self.payInfo.PAY_TYPE) {
                         case 'WEIXIN':
-                            _this.getWrchatQrcodeShow();
+                            _self.getWrchatQrcodeShow();
                             break;
                         case 'ALIPAY':
-                            _this.getAliPayQrcodeInfo();
+                            _self.getAliPayQrcodeInfo();
                             break;
                     }
-                    layer.closeAll('loading');
                 },2000);
             }else{
-                PayApi.PayOrderCheckoutCounter({orderId:_this.payInfo.PAY_ORDERID},function(response){
+                PayApi.PayOrderCheckoutCounter({orderId:_self.payInfo.PAY_ORDERID},function(response){
                     if(response.code == 0){
                         // console.log(response);
                         var data = response.data;
-                        _this.orderNo = data.order.orderNo;
-                        _this.paySuccessCounter = data.order.paySuccessCounter;
-                        _this.payInfo.PAY_PAYAMOUNT = data.order.payableAmount-data.order.receiptAmount;
-                        _this.isRequest = true;
-                        switch (_this.payInfo.PAY_TYPE) {
+                        _self.orderNo = data.order.orderNo;
+                        _self.paySuccessCounter = data.order.paySuccessCounter;
+                        _self.payInfo.PAY_PAYAMOUNT = data.order.payableAmount-data.order.receiptAmount;
+                        switch (_self.payInfo.PAY_TYPE) {
                             case 'WEIXIN':
-                                _this.getWrchatQrcodeShow();
+                                _self.getWrchatQrcodeShow();
                                 break;
                             case 'ALIPAY':
-                                _this.getAliPayQrcodeInfo();
+                                _self.getAliPayQrcodeInfo();
                                 break;
                         }
 
@@ -88,63 +85,67 @@ var payContainer = new Vue({
             }
         },
         getAliPayQrcodeInfo:function(){//生成支付宝二维码
-            var _this = this;
+            var _self = this;
             var qrcode = new QRCode(document.getElementById("ali_pay_container"), {
-                render: "canvas", //也可以替换为table
-                text: _this.payInfo.PAY_MOBILE_URL,
-                width: 200,
-                height: 200,
-                colorDark : "#000000",
-                colorLight : "#ffffff",
-                correctLevel : QRCode.CorrectLevel.H
+                    render: "canvas", //也可以替换为table
+                    text: _self.payInfo.PAY_MOBILE_URL,
+                    width: 220,
+                    height: 220,
+                    colorDark : "#000000",
+                    colorLight : "#ffffff",
+                    correctLevel : QRCode.CorrectLevel.H
             });
+            _self.loginLoading = false;
+            _self.isRequest = true;
             var timeClock = setInterval(function(){
-                    _this.maxtime--;
-                    if (_this.maxtime == 0) {
+                    _self.maxtime--;
+                    if (_self.maxtime == 0) {
                         clearInterval(timeClock);
-                        _this.isRefresh = true;
+                        _self.isRefresh = true;
                     }
             },1000);
-            _this.setTimerAliPay();
+            _self.setTimerAliPay();
         },
         getWrchatQrcodeShow:function(){//生成微信二维码
-            var _this = this;
-            if( _this.pageType === '1'){
+            var _self = this;
+            if( _self.pageType === '1'){
                 var orderInfo = {//二手微信二维码参数
                         pageType:1,
-                        productId:_this.productID,
-                        payAmount:_this.payAmount
+                        productId:_self.productID,
+                        payAmount:_self.payAmount
                 };
             }else{
                 var orderInfo = {//普通订单微信二维码参数
                         pageType:0,
-                        orderID:_this.payInfo.PAY_ORDERID,
-                        payAmount:_this.payAmount
+                        orderID:_self.payInfo.PAY_ORDERID,
+                        payAmount:_self.payAmount
                 };
             }
-            _this.payInfo.PAY_MOBILE_URL = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxea43a0f9ebce9e66&redirect_uri=https://www.caimei365.com/web/order/view/pay/caimei-wechatpay.jsp&response_type=code&scope=snsapi_base&state="+JSON.stringify(orderInfo)+"#wechat_redirect";
+            _self.payInfo.PAY_MOBILE_URL = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxea43a0f9ebce9e66&redirect_uri=https://www.caimei365.com/web/order/view/pay/caimei-wechatpay.jsp&response_type=code&scope=snsapi_base&state="+JSON.stringify(orderInfo)+"#wechat_redirect";
             var qrcode = new QRCode(document.getElementById("wx_pay_container"), {
                 render: "canvas", //也可以替换为table
-                text: _this.payInfo.PAY_MOBILE_URL,
-                width: 200,
-                height: 200,
+                text: _self.payInfo.PAY_MOBILE_URL,
+                width: 220,
+                height: 220,
                 colorDark : "#000000",
                 colorLight : "#ffffff",
                 correctLevel : QRCode.CorrectLevel.H
             });
+            _self.loginLoading = false;
+            _self.isRequest = true;
             var timeClock = setInterval(function(){
-                _this.maxtime--;
-                if (_this.maxtime == 0) {
+                _self.maxtime--;
+                if (_self.maxtime == 0) {
                     clearInterval(timeClock);
-                    _this.isRefresh = true;
+                    _self.isRefresh = true;
                 }
             },1000);
-            _this.setTimerWechatPay();
+            _self.setTimerWechatPay();
         },
         setTimerWechatPay:function () {//定时任务查询微信支付结果
-            var _this = this;
+            var _self = this;
             var timer;
-            PayApi.PayOrderPayWhetherSuccess({orderId: _this.payInfo.PAY_ORDERID, paySuccessCounter:_this.paySuccessCounter},function(response){
+            PayApi.PayOrderPayWhetherSuccess({orderId: _self.payInfo.PAY_ORDERID, paySuccessCounter:_self.paySuccessCounter},function(response){
                 // console.log(response);
                 if(response.code === 0){
                     clearTimeout(timer); //清理定时任务
@@ -153,16 +154,16 @@ var payContainer = new Vue({
                         window.location.href = '/index.html';
                     },3000);
                 }else{
-                    timer = setTimeout(() => {
-                        _this.setTimerWechatPay()
+                    timer = setTimeout(function(){
+                        _self.setTimerWechatPay()
                     }, 1000*10);
                 }
             });
         },
         setTimerAliPay:function () {//定时任务查询支付宝支付结果
-            var _this = this;
+            var _self = this;
             var timer;
-            PayApi.PayOrderFindOrderStatus({mbOrderId:_this.mbOrderId},function(response){
+            PayApi.PayOrderFindOrderStatus({mbOrderId:_self.mbOrderId},function(response){
                 var data = response.data.data;
                 if(data.status === '1'){
                     clearTimeout(timer); //清理定时任务
@@ -171,38 +172,40 @@ var payContainer = new Vue({
                         window.location.href = '/index.html';
                     },3000);
                 }else{
-                    timer = setTimeout(() => {
-                        _this.setTimerAliPay()
+                    timer = setTimeout(function(){
+                        _self.setTimerAliPay()
                     }, 1000*10);
                 }
             });
         },
         hidePayAlert:function(){//隐藏已支付弹窗
-            var _this = this;
-            _this.isPayAlert = false;
+            var _self = this;
+            _self.isPayAlert = false;
         },
         toFixedFn:function(text){//处理小数点后两位数
             return Number(text).toFixed(2);
         },
     },
     mounted: function () {
-        var _this = this;
-        var payData = _util.getStorageItem('PAY_DATA');
-        _this.pageType = _util.getUrlParam('pageType');
-        if( _this.pageType === '1'){
-            _this.payInfo.PAY_TYPE = payData.type;
-            _this.productID = payData.productId;
-            _this.payInfo.PAY_MOBILE_URL = payData.url;
-            _this.mbOrderId = payData.mbOrderId;
-            _this.payAmount = _this.payableAmount = payData.amount;
+        var _self = this;
+        var payData = JSON.parse(CAIMEI.Storage.getItem('PAY_DATA'));
+        _self.pageType = CAIMEI.getUrlParam('pageType');
+        console.log(payData);
+        if( _self.pageType === '1'){
+            _self.payInfo.PAY_TYPE = payData.type;
+            _self.productID = payData.productId;
+            _self.payInfo.PAY_MOBILE_URL = payData.url;
+            _self.mbOrderId = payData.mbOrderId;
+            _self.payAmount = _self.payableAmount = payData.amount;
         }else{
-            _this.payInfo.PAY_TYPE = payData.type;
-            _this.payInfo.PAY_ORDERID = payData.orderid;
-            _this.payInfo.PAY_UNPAIDAMOUNT = payData.amount;
-            _this.payInfo.PAY_MOBILE_URL = payData.url;
-            _this.mbOrderId = payData.mbOrderId;
-            _this.payAmount =_this.payableAmount = _this.payInfo.PAY_UNPAIDAMOUNT;
+            _self.payInfo.PAY_TYPE = payData.type;
+            _self.payInfo.PAY_ORDERID = payData.orderid;
+            _self.payInfo.PAY_UNPAIDAMOUNT = payData.amount;
+            _self.payInfo.PAY_MOBILE_URL = payData.url;
+            _self.mbOrderId = payData.mbOrderId;
+            _self.payAmount =_self.payableAmount = _self.payInfo.PAY_UNPAIDAMOUNT;
         }
-        _this.infoPayOrderCheckoutCounter();
+        console.log(_self.payInfo.PAY_TYPE);
+        _self.infoPayOrderCheckoutCounter();
     }
 });

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

@@ -16,7 +16,7 @@ var payContainer = new Vue({
         isSuccessText:''
     },
     filters: {
-        NumFormat(value) {
+        NumFormat:function(value) {
             if(!value) return '0.00';
             var intPart = Number(value) - Number(value)%1; //获取整数部分（这里是windy93的方法）
             var intPartFormat = intPart.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,'); //将整数部分逢三一断
@@ -36,45 +36,45 @@ var payContainer = new Vue({
     },
     methods: {
         infoRequestBody:function(){//初始化支付状态信息
-            var _this = this;
-            if( _this.type == 'success'){
-                _this.isSuccess = true;
-                if(_this.pageType == 'second'){
-                    _this.isSuccessText ='支付成功，商品会在1-2个工作日内进行审核';
+            var _self = this;
+            if( _self.type == 'success'){
+                _self.isSuccess = true;
+                if(_self.pageType == 'second'){
+                    _self.isSuccessText ='支付成功，商品会在1-2个工作日内进行审核';
                 }else{
-                    _this.isSuccessText ='支付成功';
+                    _self.isSuccessText ='支付成功';
                 }
             }else{
-                _this.isSuccessText ='支付失败';
-                _this.isSuccess = false;
+                _self.isSuccessText ='支付失败';
+                _self.isSuccess = false;
             }
             //处理根据类型做跳转
-            switch (_this.pageType) {
+            switch (_self.pageType) {
                 case 'www':
-                    _this.linkText = '订单列表';
-                    _this.openLink = '/myaccount/orderlist--1-1.html';
+                    _self.linkText = '订单列表';
+                    _self.openLink = '/user/order/list.html?state=0';
                     break;
                 case 'second':
-                    if(_this.isSuccess){
-                        _this.linkText = '二手商品页面';
-                        _this.openLink = '/html/secondHand/secondList.jsp';
+                    if(_self.isSuccess){
+                        _self.linkText = '二手商品页面';
+                        _self.openLink = '/html/secondHand/secondList.jsp';
                     }else{
-                        _this.linkText = '发布商品页面';
-                        _this.openLink = '/html/maintenance/view/secondtransactions.jsp';
+                        _self.linkText = '发布商品页面';
+                        _self.openLink = '/html/maintenance/view/secondtransactions.jsp';
                     }
                     break;
                 default:
-                    _this.linkText = '回到首页';
-                    _this.openLink = '/index.html';
+                    _self.linkText = '回到首页';
+                    _self.openLink = '/index.html';
             }
-            _this.isRequest = true;
+            _self.isRequest = true;
             var timeClock = setInterval(function(){
-                _this.maxtime--;
-                if (_this.maxtime == 0) {
-                    window.location.href = _this.openLink;
+                _self.maxtime--;
+                if (_self.maxtime == 0) {
+                    // window.location.href = _self.openLink;
                     clearInterval(timeClock);
-                    _this.maxtime = 10;
-                    _this.isRefresh = true;
+                    _self.maxtime = 10;
+                    _self.isRefresh = true;
                 }
             },1000);
         },
@@ -83,10 +83,10 @@ var payContainer = new Vue({
         }
     },
     mounted: function () {
-        var _this = this;
-        _this.pageType = _util.getUrlParam('pageType');
-        _this.type = _util.getUrlParam('type');
-        _this.payAmount = _util.getUrlParam('payAmount');
-        _this.infoRequestBody();
+        var _self = this;
+        _self.pageType = CAIMEI.getUrlParam('pageType');
+        _self.type = CAIMEI.getUrlParam('type');
+        _self.payAmount = CAIMEI.getUrlParam('payAmount');
+        _self.infoRequestBody();
     }
 });

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

@@ -471,7 +471,7 @@ var shoppingConfirm = new Vue({
                     var data = { payableAmount: _self.deductMoney };
                     CAIMEI.Storage.removeItem('confirmOrderInfo');
                     CAIMEI.Storage.setItem('confirmOrderInfo',JSON.stringify({data:data}));
-                    window.location.href = '/order/paySuccess.jsp';
+                    window.location.href = '/pay/success.html';
                 }else if(response.code === 2){
                     var data = {
                         orderID:response.data.orderID,
@@ -481,7 +481,7 @@ var shoppingConfirm = new Vue({
                     };
                     CAIMEI.Storage.removeItem('confirmOrderInfo');
                     CAIMEI.Storage.setItem('confirmOrderInfo',JSON.stringify({data:data}));
-                    window.location.href = '/web/order/view/pay/caimei-paycash.jsp?type=confirm&orderID='+response.data.orderID;
+                    window.location.href = '/pay/caimei-paycash.html?type=confirm&orderID='+response.data.orderID;
                 }else{
                     CAIMEI.Alert(response.msg,'确定',false);
                     _self.isSubDisabled = false;

src/main/resources/static/lib/js/viewport-sitting.js

@@ -0,0 +1,34 @@
+/**
+ * 以下这段代码是用于根据移动端设备的屏幕分辨率计算出合适的根元素的大小
+ * 当设备宽度为375(iPhone6)时，根元素font-size=16px; 依次增大；
+ * 限制当为设备宽度大于768(iPad)之后，font-size不再继续增大
+ * scale 为meta viewport中的缩放大小
+ */
+(function (doc, win) {
+    var docEl = win.document.documentElement;
+    var resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize';
+    /**
+     * ================================================
+     *   设置根元素font-size
+     * 当设备宽度为375(iPhone6)时，根元素font-size=16px;
+     × ================================================
+     */
+    var refreshRem = function () {
+        var clientWidth = win.innerWidth
+            || doc.documentElement.clientWidth
+            || doc.body.clientWidth;
+
+        console.log(clientWidth)
+        if (!clientWidth) return;
+        var fz;
+        var width = clientWidth;
+        fz = 100 * width / 750;
+        docEl.style.fontSize = fz + 'px';
+    };
+
+    if (!doc.addEventListener) return;
+    win.addEventListener(resizeEvt, refreshRem, false);
+    doc.addEventListener('DOMContentLoaded', refreshRem, false);
+    refreshRem();
+
+})(document, window);

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

@@ -0,0 +1,146 @@
+<!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>
+    <title>采美365网-中国美业全方位线上交易服务互动平台，做美业，上采美</title>
+    <template th:replace="components/head-link"></template>
+    <link th:href="@{/css/pay/caimei-paycash.css(v=${version})}" rel="stylesheet" type="text/css">
+</head>
+<body>
+<!-- 引用头部 -->
+<template th:replace="components/header"></template>
+<div class="pay-container clear" id="payContainer" :class="isRequest ? 'active' : ''">
+    <div class="wrap">
+        <div class="pageTitle">
+            <div class="step">
+                <span class="on">我的购物车</span>
+                <label class="line on"></label>
+                <span class="on">核对订单信息</span>
+                <label class="line"></label>
+                <span class="on">成功提交订单</span>
+            </div>
+            <h1>收银台</h1>
+        </div>
+    </div>
+    <div class="container">
+        <div class="pay-content clear" >
+            <template v-if="pageType === '1'">
+                <div class="pay-title">
+                    <div class="title-money big">
+                        <p class="pay-money-big">付款金额：<span class="red">￥{{payAmount | NumFormat}}</span></p>
+                    </div>
+                </div>
+            </template>
+            <template v-else>
+                <div class="pay-title">
+                    <div class="title-money big">
+                        <p class="pay-money-big">待付金额：<span class="red" id="paidAmount">￥{{paidAmount | NumFormat}}</span></p>
+                    </div>
+                    <div class="title-money">
+                        <p>应付总额：<span id="payableAmount">￥{{payableAmount | NumFormat}}</span></p>
+                        <p>已付金额：<span id="receiptAmount">￥{{receiptAmount | NumFormat}}</span></p>
+                    </div>
+                    <div class="pay-input">
+                        <p>本次支付：</p>
+                        <p class="input-text">
+                            <span>￥</span>
+                            <input class="input" id="payAmount" v-model="payAmount" type="number" placeholder="输入金额不能大于待付金额" maxlength="10" @input="changePayAmount" @blur="changePayAmountBlur">
+                        </p>
+                    </div>
+                    <div class="title-money">
+                        <p>应付剩余：<span class="red" id="balanceAmount">￥{{balanceAmount | NumFormat}}</span></p>
+                    </div>
+                </div>
+            </template>
+            <div class="pay-ment"  v-if="pageType != '1'">
+                <div class="pay-record">
+                    <div class="record-title">支付记录</div>
+                    <div class="record-content clear" id="discernReceipt">
+                        <div class="record-li none" v-if="discernReceiptList.length== 0">暂无支付记录</div>
+                        <div class="record-li" v-for="(item, index) in discernReceiptList" :key="index" v-else>
+                            <div class="record-tb">￥{{item.receiptAmount | NumFormat}}</div>
+                            <div class="record-tb">{{payTypeText(item.payType)}}</div>
+                            <div class="record-tb">{{item.receiptDate}}</div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="pay-method">
+                <div class="method-title">选择支付方式</div>
+                <div class="pay-method-tab">
+                    <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">
+                        <div class="payment-title">{{payStatusText}}</div>
+                        <div class="pay-bank">
+                            <div class="bank-list" id="mobileContent">
+                                <a href="javascript:void(0);" class="bank-a" v-for="(item, index) in mobileData" :key="index" @click="checkMobilePay(index,item)" :class="{ active: mobileTabIndex === index }">
+                                    <img :src="item.imgUrl" :alt="item.bankName">
+                                </a>
+                            </div>
+                        </div>
+                        <div class="pay-bank"  v-if="mobileTabIndex === 2">
+                            <div class="bank-list" id="bankContent">
+                                <a href="javascript:void(0);" class="bank-b" v-for="(item, index) in bankData" :key="index" :class="{ active: bankTabIndex === index }"  @click="checkBankPay(index,item)">
+                                    <img :src="item.imgUrl" :alt="item.bankName">
+                                </a>
+                            </div>
+                        </div>
+                        <div class="pay-link" v-if="mobileTabIndex === 2 && pageType != '1'">
+                            <p>若您在公司的职位无法直接使用企业网银付款，请点击右侧“复制支付链接”按钮，将该链接发送给公司财务人员进行企业网银付款</p>
+                            <a href="javascript:void(0);" id="copyLink" @click="copyLinkPaySubmitFn">复制支付链接</a>
+                        </div>
+                    </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">除了线上支付，您还可以通过直接转账的方式付款</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}}</P>
+                                    <P class="text-p"><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>
+    </div>
+    <div class="pay-button-main">
+        <div class="inner">
+            <div class="pay-button" v-if="mobileTabIndex === 2">
+                <a href="javascript:void(0);" id="paySubmit" @click="PaySubmitFn">立即支付</a>
+            </div>
+            <div class="pay-button" v-else>
+                <a href="javascript:void(0);" id="payMobileSubmit" @click="PayMobileSubmitFn">立即支付</a>
+            </div>
+        </div>
+    </div>
+    <div class="pay-alert-content" v-if="isPayAlert">
+        <div class="pay-alert">
+            <div class="title"><p>确认提示</p><i class="icon-close" @click.stop="RefreshBody"></i></div>
+            <div class="content">
+                <h1>请在您新打开的页面上完成付款</h1>
+                <p>完成付款后请点击下面的按钮</p>
+            </div>
+            <div class="button" id="payButton"><a href="javascript:void(0);" @click="RefreshBody">已完成支付</a></div>
+        </div>
+    </div>
+</div>
+<!-- 引入底部 -->
+<template th:replace="components/footer"></template>
+<template th:replace="components/foot-link"></template>
+<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="@{/js/pay/caimei-paycash.js(v=${version})}"></script>
+</body>
+</html>

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

@@ -1,167 +0,0 @@
-<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" %>
-<%
-    String path = request.getContextPath();
-    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
-%>
-<%@ page contentType="text/html;charset=UTF-8" language="java" %>
-<%@ taglib prefix="s" uri="/struts-tags" %>
-<%
-    request.setAttribute("oldApi", SysConfig.getStringConfig("caimei.api.old"));
-    request.setAttribute("newApi", SysConfig.getStringConfig("caimei.api.new"));
-%>
-<!DOCTYPE html>
-<head>
-    <%--<base href="<%=basePath%>">--%>
-    <title>采美365网-中国美业全方位线上交易服务互动平台，做美业，上采美</title>
-    <meta charset="UTF-8">
-    <meta http-equiv="pragma" content="no-cache">
-    <meta http-equiv="cache-control" content="no-cache">
-    <meta http-equiv="expires" content="0">
-    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
-    <meta http-equiv="keywords" content="采美平台业务包括采美采购商城，采美正品联盟，美业供应链合作，美业平台综合运营，三方项目服务合作，美业信息咨询服务，美业二手市场，医美直播，品牌招商等。其中采购商城包括热门小气泡仪器、皮肤检测，水光仪器，中胚层治疗仪器，激光仪器，射频仪器，超声仪器，微针射频仪器，脱毛仪器、红蓝光，身体塑形溶脂仪器等。产品包括：医美术后修复产品，高端SPA产品，高端院线产品，医美家居护理产品，玻尿酸，动能素，精纯液，填充针剂，线材，消耗品等。">
-    <meta http-equiv="description"
-          content="采美365网，生美医美正品采购服务平台，国内第一家美容行业的B2B平台，具有一，二，三类医疗器械销售资质和进出口资质。聚集全球100多个优质供应商资源，包括医疗、非医疗美容产品和仪器设备，能够一站式满足医疗美容机构、生活美容机构、新兴皮肤管理中心等多样化采购需求。同时提供供应链合作，整合上下游资源，为美容产业的持续前进和发展提出新的解决方案。">
-    <link rel="shortcut icon" href="/public/3.0/img/favicon.ico"
-          type="image/x-icon">
-    <link rel="stylesheet" href="/public/3.0/css/common/common.css">
-    <link rel="stylesheet" href="/web/login/css/register.css">
-    <link rel="stylesheet" href="/web/order/css/caimei-paycash.css?version=<%=Math.random()%>">
-    <script src="/public/3.0/js/lib/jquery-1.9.1.min.js"></script>
-    <script src="/public/3.0/js/lib/juicer-min.js"></script>
-    <script src="/web/common/js/tools.js"></script>
-    <script src="/public/3.0/js/common/common.js"></script>
-    <script src="/public/3.0/js/lib/layer/layer.min.js"></script>
-    <script src="/web/common/js/common.js?version=<%=Math.random()%>"></script>
-    <script src="/public/3.0/js/lib/vue2.6.11.js"></script>
-</head>
-<body class="home">
-<!-- .header -->
-<%@ include file="/common/Newnav.jsp" %>
-<input type="text" hidden value="${TransactionTypeID}" id="getOrderID">
-<div class="pay-container clearfix" id="payContainer" :class="isRequest ? 'active' : ''">
-    <div class="page-title">
-        <div class="page-name">收银台</div>
-        <div class="progress" v-if="pageType != '1'">
-            <div class="progress-bar step-3"></div>
-            <div class="progress-txt">
-                <div class="item">我的进货单</div>
-                <div class="item middle">核对订单信息</div>
-                <div class="item current">成功提交订单</div>
-            </div>
-        </div>
-    </div>
-    <div class="pay-content clearfix" >
-        <template v-if="pageType === '1'">
-            <div class="pay-title">
-                <div class="title-money big">
-                    <p class="pay-money-big">付款金额：<span class="red">￥{{payAmount | NumFormat}}</span></p>
-                </div>
-            </div>
-        </template>
-        <template v-else>
-            <div class="pay-title">
-                <div class="title-money">
-                    <p>待付金额：<span class="red" id="paidAmount">￥{{paidAmount | NumFormat}}</span></p>
-                    <p>应付总额：<span id="payableAmount">￥{{payableAmount | NumFormat}}</span></p>
-                    <p>已付金额：<span id="receiptAmount">￥{{receiptAmount | NumFormat}}</span></p>
-                </div>
-                <div class="pay-input">
-                    <p>本次支付：</p>
-                    <p class="input-text">
-                        <span>￥</span>
-                        <input class="input" id="payAmount" v-model="payAmount" type="number" placeholder="输入金额不能大于待付金额" maxlength="10" @input="changePayAmount" @blur="changePayAmountBlur">
-                    </p>
-                </div>
-                <div class="title-money">
-                    <p>应付剩余：<span class="red" id="balanceAmount">￥{{balanceAmount | NumFormat}}</span></p>
-                </div>
-            </div>
-        </template>
-        <div class="pay-ment"  v-if="pageType != '1'">
-            <div class="pay-record">
-                <div class="record-title">支付记录</div>
-                <div class="record-content clearfix" id="discernReceipt">
-                    <div class="record-li none" v-if="discernReceiptList.length== 0">暂无支付记录</div>
-                    <div class="record-li" v-for="(item, index) in discernReceiptList" :key="index" v-else>
-                        <div class="record-tb">￥{{item.receiptAmount | NumFormat}}</div>
-                        <div class="record-tb">{{payTypeText(item.payType)}}</div>
-                        <div class="record-tb">{{item.receiptDate}}</div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="pay-method">
-            <div class="method-title">选择支付方式</div>
-            <div class="pay-method-tab">
-                <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">
-                    <div class="payment-title">{{payStatusText}}</div>
-                    <div class="pay-bank">
-                        <div class="bank-list" id="mobileContent">
-                            <a href="javascript:void(0);" class="bank-a" v-for="(item, index) in mobileData" :key="index" @click="checkMobilePay(index,item)" :class="{ active: mobileTabIndex === index }">
-                                <img :src="item.imgUrl" :alt="item.bankName">
-                            </a>
-                        </div>
-                    </div>
-                    <div class="pay-bank"  v-if="mobileTabIndex === 2">
-                        <div class="bank-list" id="bankContent">
-                            <a href="javascript:void(0);" class="bank-b" v-for="(item, index) in bankData" :key="index" :class="{ active: bankTabIndex === index }"  @click="checkBankPay(index,item)">
-                                <img :src="item.imgUrl" :alt="item.bankName">
-                            </a>
-                        </div>
-                    </div>
-                    <div class="pay-link" v-if="mobileTabIndex === 2 && pageType != '1'">
-                        <p>若您在公司的职位无法直接使用企业网银付款，请点击右侧“复制支付链接”按钮，将该链接发送给公司财务人员进行企业网银付款</p>
-                        <a href="javascript:void(0);" id="copyLink" @click="copyLinkPaySubmitFn">复制支付链接</a>
-                    </div>
-                    <div class="pay-button" v-if="mobileTabIndex === 2">
-                        <a href="javascript:void(0);" id="paySubmit" @click="PaySubmitFn">立即支付</a>
-                    </div>
-                    <div class="pay-button" v-else>
-                        <a href="javascript:void(0);" id="payMobileSubmit" @click="PayMobileSubmitFn">立即支付</a>
-                    </div>
-                </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">除了线上支付，您还可以通过直接转账的方式付款</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}}</P>
-                                <P class="text-p"><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>
-    <div class="pay-alert-content" v-if="isPayAlert">
-        <div class="pay-alert">
-            <div class="title"><p>确认提示</p><i class="icon-close" @click.stop="RefreshBody"></i></div>
-            <div class="content">
-                <h1>请在您新打开的页面上完成付款</h1>
-                <p>完成付款后请点击下面的按钮</p>
-            </div>
-            <div class="button" id="payButton"><a href="javascript:void(0);" @click="RefreshBody">已完成支付</a></div>
-        </div>
-    </div>
-</div>
-<%@ include file="/web/login/view/out_footer.jsp" %>
-<script src="/web/common/js/ajax.service.js?version=<%=Math.random()%>"></script>
-<script src="/web/common/js/api/user.service.js?version=<%=Math.random()%>"></script>
-<script src="/web/common/js/api/utils.service.js?version=<%=Math.random()%>"></script>
-<script src="/web/common/js/api/pay.service.js?version=<%=Math.random()%>"></script>
-<script src="/web/order/js/caimei-paycash.js?version=<%=Math.random()%>"></script>
-</body>
-</html>

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

@@ -0,0 +1,88 @@
+<!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>
+    <title>采美365网-中国美业全方位线上交易服务互动平台，做美业，上采美</title>
+    <template th:replace="components/head-link"></template>
+    <link th:href="@{/css/pay/caimei-paymobile.css(v=${version})}" rel="stylesheet" type="text/css">
+</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="${spiServer}" id="spiServer">
+        <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="isRequest ? 'active' : ''">
+        <div class="pay-content weixin clearfix" v-if="payInfo.PAY_TYPE === 'WEIXIN'">
+            <div class="pay-codecontent">
+                <div class="pay-amount">
+                    <div class="pay-amount-text">
+                        <p>交易金额: <span>￥{{payAmount | NumFormat}}</span> </p>
+                        <p>收款方: <span>深圳市采美信息技术有限公司</span> </p>
+                        <p v-if="pageType!='1' ">订单号: <span>{{orderNo}}</span> </p>
+                    </div>
+                    <div class="pay-amount-icon"><img src="/img/pay/icon-pay@2x.png" alt=""></div>
+                </div>
+                <div class="pay-codemain" id="WEIXIN-CONTENT">
+                    <div class="code-title"><p>扫码付款 <span class="payableAmount">￥{{payableAmount | NumFormat}}</span></p></div>
+                    <div class="pay-qrCode weixin" id="wx_pay_container">
+                        <i class="icon-wechat"></i>
+                    </div>
+                    <div class="model" v-if="isRefresh">
+                        <div class="refresh-div">
+                            <p>已失效,请重新发起支付</p>
+                        </div>
+                    </div>
+                    <div class="code-footer">
+                        <img class="code-img" src="/img/pay/icon-weixinpay@2x.png" alt="">
+                        <p>打开手机微信，扫一扫进行付款</p>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="pay-content ali clearfix" v-if="payInfo.PAY_TYPE === 'ALIPAY'">
+            <div class="pay-codecontent">
+                <div class="pay-amount">
+                    <div class="pay-amount-text">
+                        <p>交易金额: <span>￥{{payAmount | NumFormat}}</span> </p>
+                        <p>收款方: <span>深圳市采美信息技术有限公司</span> </p>
+                        <p v-if="pageType!='1' ">订单号: <span>{{orderNo}}</span> </p>
+                    </div>
+                    <div class="pay-amount-icon"><img src="/img/pay/icon-pay@2x.png" alt=""></div>
+                </div>
+                <div class="pay-codemain " id="ALIPAY-CONTENT">
+                    <div class="code-title"><p>扫码付款 <span class="payableAmount">￥{{payableAmount | NumFormat}}</span></p></div>
+                    <div class="pay-qrCode ali" id="ali_pay_container">
+                        <i class="icon-alipay"></i>
+                    </div>
+                    <div class="model" v-if="isRefresh">
+                        <div class="refresh-div">
+                            <p>已失效,请重新发起支付</p>
+                        </div>
+                    </div>
+                    <div class="code-footer">
+                        <img class="code-img" src="/img/pay/icon-alipay@2x.png" alt="">
+                        <p>打开手机支付宝，扫一扫进行付款</p>
+                    </div>
+                </div>
+            </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-paymobile.js(v=${version})}"></script>
+
+</body>
+</html>

src/main/resources/templates/pay/caimei-paymobile.jsp

@@ -1,128 +0,0 @@
-<%@ page import="com.caimei.utils.SysConfig" %><%--
-  Created by IntelliJ IDEA.
-  User: 828
-  Date: 2018/5/10
-  Time: 10:01
-  To change this template use File | Settings | File Templates.
---%>
-<%@ page contentType="text/html;charset=UTF-8" language="java" %>
-<%@ taglib prefix="s" uri="/struts-tags" %>
-<%
-    request.setAttribute("oldApi", SysConfig.getStringConfig("caimei.api.old"));
-    request.setAttribute("newApi", SysConfig.getStringConfig("caimei.api.new"));
-%>
-<!DOCTYPE html>
-<head>
-    <meta charset="UTF-8">
-    <meta http-equiv="pragma" content="no-cache">
-    <meta http-equiv="cache-control" content="no-cache">
-    <meta http-equiv="expires" content="0">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
-    <meta name="apple-mobile-web-app-capable" content="yes">
-    <meta name="apple-mobile-web-app-status-bar-style" content="black">
-    <meta http-equiv="keywords" content="采美平台业务包括采美采购商城，采美正品联盟，美业供应链合作，美业平台综合运营，三方项目服务合作，美业信息咨询服务，美业二手市场，医美直播，品牌招商等。其中采购商城包括热门小气泡仪器、皮肤检测，水光仪器，中胚层治疗仪器，激光仪器，射频仪器，超声仪器，微针射频仪器，脱毛仪器、红蓝光，身体塑形溶脂仪器等。产品包括：医美术后修复产品，高端SPA产品，高端院线产品，医美家居护理产品，玻尿酸，动能素，精纯液，填充针剂，线材，消耗品等。">
-    <meta http-equiv="description" content="采美365网，生美医美正品采购服务平台，国内第一家美容行业的B2B平台，具有一，二，三类医疗器械销售资质和进出口资质。聚集全球100多个优质供应商资源，包括医疗、非医疗美容产品和仪器设备，能够一站式满足医疗美容机构、生活美容机构、新兴皮肤管理中心等多样化采购需求。同时提供供应链合作，整合上下游资源，为美容产业的持续前进和发展提出新的解决方案。">
-    <title>采美365网-中国美业全方位线上交易服务互动平台，做美业，上采美</title>
-    <link rel="shortcut icon" href="/web/common/img/favicon.ico" type="image/x-icon">
-    <link rel="stylesheet" href="/web/common/css/reset.css">
-    <link rel="stylesheet" href="/web/login/css/register.css">
-    <link rel="stylesheet" href="/web/order/css/caimei-paymobile.css?version=<%=Math.random()%>">
-    <script src="/web/common/js/tools.js"></script>
-    <script src="/public/3.0/js/lib/layer/layer.min.js"></script>
-    <script src="/web/common/js/common.js?version=<%=Math.random()%>"></script>
-    <script src="/public/3.0/js/lib/vue2.6.11.js"></script>
-</head>
-<body>
-<div class="head-wrap">
-    <div class="head clearfix">
-        <div class="fl logo-to-index"><img src="/web/login/img/index_logo.png" alt=""></div>
-        <div class="fl main-thing">收银台</div>
-        <input id="oldApi" value='${oldApi}' type="hidden">
-        <input id="newApi" value='${newApi}' type="hidden">
-    </div>
-</div>
-<div class="pay-container weixin clearfix" id="payContainer" :class="isRequest ? 'active' : ''">
-    <div class="pay-content weixin clearfix" v-if="payInfo.PAY_TYPE === 'WEIXIN'">
-        <div class="pay-codecontent">
-            <div class="pay-amount">
-                <div class="pay-amount-text">
-                    <p>交易金额: <span>￥{{payAmount | NumFormat}}</span> </p>
-                    <p>收款方: <span>深圳市采美信息技术有限公司</span> </p>
-                    <p v-if="pageType!='1' ">订单号: <span>{{orderNo}}</span> </p>
-                </div>
-                <div class="pay-amount-icon"><img src="/web/order/img/icon-pay@2x.png" alt=""></div>
-            </div>
-            <div class="pay-codemain" id="WEIXIN-CONTENT">
-                <div class="code-title"><p>扫码付款 <span class="payableAmount">￥{{payableAmount | NumFormat}}</span></p></div>
-                <div class="pay-qrCode weixin" id="wx_pay_container">
-                    <i class="icon-wechat"></i>
-                </div>
-                <div class="model" v-if="isRefresh">
-                    <div class="refresh-div">
-                        <p>已失效,请重新发起支付</p>
-                    </div>
-                </div>
-                <div class="code-footer">
-                    <img class="code-img" src="/web/order/img/icon-weixinpay@2x.png" alt="">
-                    <p>打开手机微信，扫一扫进行付款</p>
-                </div>
-            </div>
-        </div>
-
-    </div>
-    <div class="pay-content ali clearfix" v-if="payInfo.PAY_TYPE === 'ALIPAY'">
-        <div class="pay-codecontent">
-            <div class="pay-amount">
-                <div class="pay-amount-text">
-                    <p>交易金额: <span>￥{{payAmount | NumFormat}}</span> </p>
-                    <p>收款方: <span>深圳市采美信息技术有限公司</span> </p>
-                    <p v-if="pageType!='1' ">订单号: <span>{{orderNo}}</span> </p>
-                </div>
-                <div class="pay-amount-icon"><img src="/web/order/img/icon-pay@2x.png" alt=""></div>
-            </div>
-            <div class="pay-codemain " id="ALIPAY-CONTENT">
-                <div class="code-title"><p>扫码付款 <span class="payableAmount">￥{{payableAmount | NumFormat}}</span></p></div>
-                <div class="pay-qrCode ali" id="ali_pay_container">
-                    <%--二维码--%>
-                    <i class="icon-alipay"></i>
-                </div>
-                <div class="model" v-if="isRefresh">
-                    <div class="refresh-div">
-                        <p>已失效,请重新发起支付</p>
-                    </div>
-                </div>
-                <div class="code-footer">
-                    <img class="code-img" src="/web/order/img/icon-alipay@2x.png" alt="">
-                    <p>打开手机支付宝，扫一扫进行付款</p>
-                </div>
-            </div>
-        </div>
-    </div>
-</div>
-<div class="pay-alert-content">
-    <div class="pay-alert">
-        <div class="title">
-            <p>确认提示</p>
-            <i class="icon-close"></i>
-        </div>
-        <div class="content">
-            <h1>请在您新打开的页面上完成付款</h1>
-            <p>完成付款后请点击下面的按钮</p>
-        </div>
-        <div class="button" id="payButton">
-            <a href="javascript:void(0);">已完成支付</a>
-        </div>
-    </div>
-</div>
-<%@ include file="/web/login/view/out_footer.jsp" %>
-<div class="cm-modal"></div>
-<script src="https://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>
-<script src="/web/common/js/lib/qrcode.min.js"></script>
-<script src="/web/common/js/ajax.service.js?version=<%=Math.random()%>"></script>
-<script src="/web/common/js/api/user.service.js?version=<%=Math.random()%>"></script>
-<script src="/web/common/js/api/utils.service.js?version=<%=Math.random()%>"></script>
-<script src="/web/common/js/api/pay.service.js?version=<%=Math.random()%>"></script>
-<script src="/web/order/js/caimei-paymobile.js?version=<%=Math.random()%>"></script>
-
-</body>
-</html>

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

@@ -0,0 +1,35 @@
+<!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>
+    <title>采美365网-中国美业全方位线上交易服务互动平台，做美业，上采美</title>
+    <template th:replace="components/head-link"></template>
+    <link th:href="@{/css/pay/caimei-success.css(v=${version})}" rel="stylesheet" type="text/css">
+</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="${spiServer}" id="spiServer">
+        <input type="hidden" th:value="${agent}" id="userAgent">
+    </div>
+</div>
+<div class="pay-container clearfix" id="payContainer" :class="isRequest ? 'active' : ''">
+    <div class="pay-content clearfix">
+            <div class="success-icon">
+                <div class="icon" :class="isSuccess ? 'icon-success' : 'icon-error'"></div>
+            </div>
+            <div class="success-text"><p class="tx1">{{isSuccessText}}</p></div>
+            <div class="success-text"><p class="tx2">付款金额: <span>￥{{payAmount | NumFormat}}</span> </p></div>
+            <div class="success-text"><p class="tx2"><span>{{maxtime}}s</span>后自动跳转到{{linkText}}<a :href="openLink">立即跳转</a></p></div>
+    </div>
+</div>
+<!-- 引入底部 -->
+<template th:replace="components/footer"></template>
+<template th:replace="components/foot-link"></template>
+<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="@{/js/pay/caimei-success.js(v=${version})}"></script>
+</body>
+</html>

src/main/resources/templates/pay/caimei-success.jsp

@@ -1,63 +0,0 @@
-<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" %>
-<%@ page import="com.caimei.utils.SysConfig" %>
-<%
-    String path = request.getContextPath();
-    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
-%>
-<%@ page contentType="text/html;charset=UTF-8" language="java" %>
-<%@ taglib prefix="s" uri="/struts-tags" %>
-<%
-    request.setAttribute("oldApi", SysConfig.getStringConfig("caimei.api.old"));
-    request.setAttribute("newApi", SysConfig.getStringConfig("caimei.api.new"));
-%>
-<!DOCTYPE html>
-<head>
-    <title>采美365网-中国美业全方位线上交易服务互动平台，做美业，上采美</title>
-    <meta charset="UTF-8">
-    <meta http-equiv="pragma" content="no-cache">
-    <meta http-equiv="cache-control" content="no-cache">
-    <meta http-equiv="expires" content="0">
-    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
-    <meta http-equiv="keywords" content="采美平台业务包括采美采购商城，采美正品联盟，美业供应链合作，美业平台综合运营，三方项目服务合作，美业信息咨询服务，美业二手市场，医美直播，品牌招商等。其中采购商城包括热门小气泡仪器、皮肤检测，水光仪器，中胚层治疗仪器，激光仪器，射频仪器，超声仪器，微针射频仪器，脱毛仪器、红蓝光，身体塑形溶脂仪器等。产品包括：医美术后修复产品，高端SPA产品，高端院线产品，医美家居护理产品，玻尿酸，动能素，精纯液，填充针剂，线材，消耗品等。">
-    <meta http-equiv="description"
-          content="采美365网，生美医美正品采购服务平台，国内第一家美容行业的B2B平台，具有一，二，三类医疗器械销售资质和进出口资质。聚集全球100多个优质供应商资源，包括医疗、非医疗美容产品和仪器设备，能够一站式满足医疗美容机构、生活美容机构、新兴皮肤管理中心等多样化采购需求。同时提供供应链合作，整合上下游资源，为美容产业的持续前进和发展提出新的解决方案。">
-    <link rel="shortcut icon" href="/public/3.0/img/favicon.ico"
-          type="image/x-icon">
-    <link rel="stylesheet" href="/public/3.0/css/common/common.css">
-    <link rel="stylesheet" href="/web/login/css/register.css">
-    <link rel="stylesheet" href="/web/order/css/caimei-success.css?version=<%=Math.random()%>">
-    <script src="/public/3.0/js/lib/jquery-1.9.1.min.js"></script>
-    <script src="/public/3.0/js/lib/juicer-min.js"></script>
-    <script src="/web/common/js/tools.js"></script>
-    <script src="/public/3.0/js/common/common.js"></script>
-    <script src="/public/3.0/js/lib/layer/layer.min.js"></script>
-    <script src="/web/common/js/common.js?version=<%=Math.random()%>"></script>
-    <script src="/public/3.0/js/lib/vue2.6.11.js"></script>
-</head>
-<body class="home">
-<div class="head-wrap">
-    <div class="head clearfix">
-        <div class="fl logo-to-index"><img src="/web/login/img/index_logo.png" alt=""></div>
-        <div class="fl main-thing">收银台</div>
-        <input id="oldApi" value='${oldApi}' type="hidden">
-        <input id="newApi" value='${newApi}' type="hidden">
-    </div>
-</div>
-<div class="pay-container clearfix" id="payContainer" :class="isRequest ? 'active' : ''">
-    <div class="pay-content clearfix">
-            <div class="success-icon">
-                <div class="icon" :class="isSuccess ? 'icon-success' : 'icon-error'"></div>
-            </div>
-            <div class="success-text"><p class="tx1">{{isSuccessText}}</p></div>
-            <div class="success-text"><p class="tx2">付款金额: <span>￥{{payAmount | NumFormat}}</span> </p></div>
-            <div class="success-text"><p class="tx2"><span>{{maxtime}}s</span>后自动跳转到{{linkText}}<a :href="openLink">立即跳转</a></p></div>
-    </div>
-</div>
-<%@ include file="/web/login/view/out_footer.jsp" %>
-<script src="/web/common/js/ajax.service.js?version=<%=Math.random()%>"></script>
-<script src="/web/common/js/api/user.service.js?version=<%=Math.random()%>"></script>
-<script src="/web/common/js/api/utils.service.js?version=<%=Math.random()%>"></script>
-<script src="/web/common/js/api/pay.service.js?version=<%=Math.random()%>"></script>
-<script src="/web/order/js/caimei-success.js?version=<%=Math.random()%>"></script>
-</body>
-</html>

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

@@ -0,0 +1,40 @@
+<!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>
+    <title>采美365网-中国美业全方位线上交易服务互动平台，做美业，上采美</title>
+    <template th:replace="components/head-link"></template>
+    <link th:href="@{/css/pay/caimei-success.css(v=${version})}" rel="stylesheet" type="text/css">
+</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="${spiServer}" id="spiServer">
+        <input type="hidden" th:value="${agent}" id="userAgent">
+    </div>
+</div>
+<div class="pay-container  clearfix" id="payContainer" :class="isRequest? 'active' : ''">
+    <div class="pay-amount">
+        <div class="icon"><img src="/web/order/img/icon-paybg@2x.png" alt=""></div>
+        <div class="pay-money">
+            <div class="label">付款金额</div>
+            <div class="mount"><span>￥</span>{{payAmount}}</div>
+        </div>
+    </div>
+    <div class="pay-button"><div class="btn" @click="WxPaySubmit">立即支付</div></div>
+    <div class="pay-logo">
+        <div class="logo">采美365网</div>
+    </div>
+</div>
+<script src="https://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>
+<!-- 引入底部 -->
+<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="@{/js/pay/caimei-success.js(v=${version})}"></script>
+</body>
+</html>

src/main/resources/templates/pay/caimei-wechatpay.jsp

@@ -1,60 +0,0 @@
-<%@ page import="com.caimei.utils.SysConfig" %><%--
-  Created by IntelliJ IDEA.
-  User: 828
-  Date: 2018/5/10
-  Time: 10:01
-  To change this template use File | Settings | File Templates.
---%>
-<%@ page contentType="text/html;charset=UTF-8" language="java" %>
-<%@ taglib prefix="s" uri="/struts-tags" %>
-<%
-    request.setAttribute("oldApi", SysConfig.getStringConfig("caimei.api.old"));
-    request.setAttribute("newApi", SysConfig.getStringConfig("caimei.api.new"));
-%>
-<!DOCTYPE html>
-<head>
-    <meta charset="UTF-8">
-    <meta http-equiv="pragma" content="no-cache">
-    <meta http-equiv="cache-control" content="no-cache">
-    <meta http-equiv="expires" content="0">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
-    <meta name="apple-mobile-web-app-capable" content="yes">
-    <meta name="apple-mobile-web-app-status-bar-style" content="black">
-    <meta name="viewport" id="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
-    <meta http-equiv="keywords" content="采美平台业务包括采美采购商城，采美正品联盟，美业供应链合作，美业平台综合运营，三方项目服务合作，美业信息咨询服务，美业二手市场，医美直播，品牌招商等。其中采购商城包括热门小气泡仪器、皮肤检测，水光仪器，中胚层治疗仪器，激光仪器，射频仪器，超声仪器，微针射频仪器，脱毛仪器、红蓝光，身体塑形溶脂仪器等。产品包括：医美术后修复产品，高端SPA产品，高端院线产品，医美家居护理产品，玻尿酸，动能素，精纯液，填充针剂，线材，消耗品等。">
-    <meta http-equiv="description" content="采美365网，生美医美正品采购服务平台，国内第一家美容行业的B2B平台，具有一，二，三类医疗器械销售资质和进出口资质。聚集全球100多个优质供应商资源，包括医疗、非医疗美容产品和仪器设备，能够一站式满足医疗美容机构、生活美容机构、新兴皮肤管理中心等多样化采购需求。同时提供供应链合作，整合上下游资源，为美容产业的持续前进和发展提出新的解决方案。">
-    <title>订单支付</title>
-    <link rel="shortcut icon" href="/web/common/img/favicon.ico" type="image/x-icon">
-    <link rel="stylesheet" href="/web/common/css/reset.css">
-    <link rel="stylesheet" href="/web/order/css/caimei-wechatpay.css?version=<%=Math.random()%>">
-    <script src="/web/common/js/tools.js"></script>
-    <script src="/public/3.0/js/lib/layer/layer.min.js"></script>
-    <script src="/web/common/js/common.js?version=<%=Math.random()%>"></script>
-    <script src="/web/common/js/lib/viewport-sitting.js?version=<%=Math.random()%>"></script>
-    <script src="/public/3.0/js/lib/vue2.6.11.js"></script>
-</head>
-<body>
-<input id="oldApi" value='${oldApi}' hidden>
-<input id="newApi" value='${newApi}' hidden>
-<div class="pay-container  clearfix" id="payContainer" :class="isRequest? 'active' : ''">
-    <div class="pay-amount">
-        <div class="icon"><img src="/web/order/img/icon-paybg@2x.png" alt=""></div>
-        <div class="pay-money">
-            <div class="label">付款金额</div>
-            <div class="mount"><span>￥</span>{{payAmount}}</div>
-        </div>
-    </div>
-    <div class="pay-button"><div class="btn" @click="WxPaySubmit">立即支付</div></div>
-    <div class="pay-logo">
-        <div class="logo">采美365网</div>
-    </div>
-</div>
-<script src="https://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>
-<script src="/web/common/js/ajax.service.js?version=<%=Math.random()%>"></script>
-<script src="/web/common/js/api/user.service.js?version=<%=Math.random()%>"></script>
-<script src="/web/common/js/api/utils.service.js?version=<%=Math.random()%>"></script>
-<script src="/web/common/js/api/pay.service.js?version=<%=Math.random()%>"></script>
-<script src="/web/order/js/caimei-wechatpay.js?version=<%=Math.random()%>"></script>
-
-</body>
-</html>