Browse Source

Merge branch 'developerC' into developerA

# Conflicts:
#	pages/user/order/order-payment.vue
zhengjinyi 3 years ago
parent
commit
5541ccd216
2 changed files with 544 additions and 574 deletions
  1. 5 5
      components/cm-module/orderDetails/paymentRecord.vue
  2. 539 569
      pages/user/order/order-payment.vue

+ 5 - 5
components/cm-module/orderDetails/paymentRecord.vue

@@ -24,7 +24,7 @@
 
 <script>
 	export default{
-		name:"record",
+		name:'record',
 		props:{
 			discernReceiptList:{
 				type:Array
@@ -51,7 +51,7 @@
 			initData(res) {
 				if(res!=''){
 					this.isEmpty = false
-					this.paymentData = res;
+					this.paymentData = res
 				}else{
 					this.isEmpty = true
 				}
@@ -70,7 +70,7 @@
 						stateText = stateTextObject[key]
 					}
 				})
-				return stateText;
+				return stateText
 			},
 		}
 	}
@@ -134,11 +134,11 @@
 							color: $text-color;
 						}
 						&.pp{
-							flex: 3;
+							flex: 2;
 							color: $text-color;
 						}
 						&.tt{
-							flex: 4;
+							flex: 5;
 							color: #999999;
 						}
 					}

+ 539 - 569
pages/user/order/order-payment.vue

@@ -1,6 +1,6 @@
 <template>
-	<view class="container cashier" :style="{ paddingTop: CustomBar + 'px' }">
-		<cu-custom :navbar-data="nvabarData" @navigateBack="hanldNavigateBack"></cu-custom>
+	<view class="container cashier" :style="{paddingTop:CustomBar+'px'}">
+		<cu-custom :navbar-data='nvabarData' @navigateBack="hanldNavigateBack"></cu-custom>
 		<template v-if="isPaySwitch">
 			<view class="container-cash clearfix">
 				<view class="pay-bring-title">线上支付功能正在维护中,请使用线下转账方式支付订单</view>
@@ -8,7 +8,8 @@
 					<view class="pay-content">
 						<view class="pay-p"><text>待付金额</text></view>
 						<view class="pay-money">
-							<text class="pay-sm">¥</text> <text class="pay-bg">{{ payableAmount | NumFormat }}</text>
+							<text class="pay-sm">¥</text>
+							<text class="pay-bg">{{payableAmount | NumFormat}}</text>
 						</view>
 					</view>
 				</view>
@@ -16,27 +17,24 @@
 					<view class="pay-bring-content">
 						<view class="text-v title">转账信息</view>
 						<view class="text-v">开户行:中信银行(深圳泰然支行)</view>
-						<view class="text-v">银行卡号:{{ bankNumber }}</view> <view class="text-v">户名:周仁声</view>
-						<view class="text-v"
-							>订单标识:{{ payOrderId }}
-							<text class="clipboard" @click.stop="clipboard(payOrderId)">复制</text></view
-						>
+						<view class="text-v">银行卡号:{{bankNumber}}</view>
+						<view class="text-v">户名:周仁声</view>
+						<view class="text-v">订单标识:{{payOrderId}} <text class="clipboard" @click.stop="clipboard(payOrderId)">复制</text></view>
 						<view class="text-v title">特别注意</view>
-						<view class="text-v bg-color"
-							>请在转账备注中填写上述订单标识,方便财务快速审核,提高发货速度</view
-						>
+						<view class="text-v bg-color">请在转账备注中填写上述订单标识,方便财务快速审核,提高发货速度</view>
 					</view>
 				</view>
-			</view>
+			</view>		
 		</template>
 		<template v-else>
 			<view class="container-cash clearfix" v-if="invoiceStatus">
-				<view class="pay-bring-title">{{ payBringTitle }}</view>
+				<view class="pay-bring-title">{{payBringTitle}}</view>
 				<view class="container-wrapper">
 					<view class="pay-content">
 						<view class="pay-p"><text>待付金额</text></view>
 						<view class="pay-money">
-							<text class="pay-sm">¥</text> <text class="pay-bg">{{ payableAmount | NumFormat }}</text>
+							<text class="pay-sm">¥</text>
+							<text class="pay-bg">{{payableAmount | NumFormat}}</text>
 						</view>
 					</view>
 				</view>
@@ -44,37 +42,36 @@
 					<view class="pay-bring-content">
 						<view class="text-v title">转账信息</view>
 						<view class="text-v">开户行:中信银行(深圳泰然支行)</view>
-						<view class="text-v">银行卡号:{{ bankNumber }}</view> <view class="text-v">户名:周仁声</view>
-						<view class="text-v"
-							>订单标识:{{ payOrderId }}
-							<text class="clipboard" @click.stop="clipboard(payOrderId)">复制</text></view
-						>
+						<view class="text-v">银行卡号:{{bankNumber}}</view>
+						<view class="text-v">户名:周仁声</view>
+						<view class="text-v">订单标识:{{payOrderId}} <text class="clipboard" @click.stop="clipboard(payOrderId)">复制</text></view>
 						<view class="text-v title">特别注意</view>
-						<view class="text-v bg-color"
-							>请在转账备注中填写上述订单标识,方便财务快速审核,提高发货速度</view
-						>
+						<view class="text-v bg-color">请在转账备注中填写上述订单标识,方便财务快速审核,提高发货速度</view>
 					</view>
 				</view>
-			</view>
+			</view>		
 			<view class="container-cash clearfix" v-else>
 				<view class="container-wrapper">
 					<view class="pay-content">
 						<view class="pay-p"><text>待付金额</text></view>
 						<view class="pay-money">
-							<text class="pay-sm">¥</text> <text class="pay-bg">{{ payableAmount | NumFormat }}</text>
+							<text class="pay-sm">¥</text>
+							<text class="pay-bg">{{payableAmount | NumFormat}}</text>
 						</view>
 					</view>
 					<view class="pay-check">
 						<view class="check-title"><view class="text">选择支付方式</view></view>
 						<view class="pay-checked">
-							<view class="pay-item" :class="{ current: tabCurrentIndex === 0 }" @click="tabClick(0)">
+							<view  class="pay-item" :class="{ 'current' : tabCurrentIndex === 0}"   @click="tabClick(0)" >
 								<view class="item-l">
 									<view class="item-icon"><text class="iconfont icon-weixinzhifu"></text></view>
 									<view class="item-texts"><text>微信支付</text></view>
 								</view>
-								<view class="item-r"> <text class="iconfont icon-duigou"></text> </view>
+								<view class="item-r">
+									<text class="iconfont icon-duigou"></text>
+								</view>
 							</view>
-							<view class="pay-item" :class="{ current: tabCurrentIndex === 1 }" @click="tabClick(1)">
+							<view  class="pay-item" :class="{ 'current' : tabCurrentIndex === 1}"   @click="tabClick(1)" >
 								<view class="item-l">
 									<view class="item-icon"><text class="iconfont icon-qiyewangyinzhifu"></text></view>
 									<view class="item-text">
@@ -82,9 +79,11 @@
 										<view class="txt-t">需要在电脑端汇款</view>
 									</view>
 								</view>
-								<view class="item-r"> <text class="iconfont icon-duigou"></text> </view>
+								<view class="item-r">
+									<text class="iconfont icon-duigou"></text>
+								</view>
 							</view>
-							<view class="pay-item" :class="{ current: tabCurrentIndex === 2 }" @click="tabClick(2)">
+							<view  class="pay-item" :class="{ 'current' : tabCurrentIndex === 2}"   @click="tabClick(2)" >
 								<view class="item-l">
 									<view class="item-icon"><text class="iconfont icon-gerenwangyinzhifu"></text></view>
 									<view class="item-text">
@@ -92,47 +91,41 @@
 										<view class="txt-t">需要在电脑端汇款</view>
 									</view>
 								</view>
-								<view class="item-r"> <text class="iconfont icon-duigou"></text> </view>
+								<view class="item-r">
+									<text class="iconfont icon-duigou"></text>
+								</view>
 							</view>
 						</view>
 					</view>
 				</view>
 				<view class="pay-button">
-					<view class="btn" @click.stop="goOrderCash" :style="{ background: btnColor }">{{
-						buttonText
-					}}</view>
+					<view class="btn" @click.stop="goOrderCash" :style="{'background':btnColor}">{{buttonText}}</view>
 				</view>
 				<view class="pay-statustext">
 					<view class="pay-statustext-inner">
-						<view class="pay-icon"> <text class="iconfont icon-gantanhao-yuankuang"></text> </view>
+						<view class="pay-icon">
+							<text class="iconfont icon-gantanhao-yuankuang"></text>
+						</view>
 						<view class="pay-text">
-							<text>{{ payStatusText }}</text>
+							<text>{{payStatusText}}</text>
 						</view>
 					</view>
 				</view>
-				<view
-					class="pay-bring clearfix"
-					:style="{ paddingBottom: isIphoneX ? '68rpx' : '24rpx' }"
-					@click.stop="showTips"
-					v-if="isReceiptStatus"
-				>
+				<view class="pay-bring clearfix" :style="{paddingBottom:isIphoneX ? '68rpx' : '24rpx'}" @click.stop="showTips" v-if="isReceiptStatus">
 					<view class="pay-bring-line"><text class="line"></text></view>
 					<view class="pay-bring-content" v-if="!isShowTip">
-						<view class="text bg-color">查看转账信息</view> <view class="text">除了以上两种支付方式</view>
+						<view class="text bg-color">查看转账信息</view>
+						<view class="text">除了以上两种支付方式</view>
 						<view class="text">您还可以通过线下转账的方式付款</view>
 					</view>
 					<view class="pay-bring-content" v-else>
 						<view class="text-v title">转账信息</view>
 						<view class="text-v">开户行:中信银行(深圳泰然支行)</view>
-						<view class="text-v">银行卡号:{{ bankNumber }}</view> <view class="text-v">户名:周仁声</view>
-						<view class="text-v"
-							>订单标识:{{ payOrderId }}
-							<text class="clipboard" @click.stop="clipboard(payOrderId)">复制</text></view
-						>
+						<view class="text-v">银行卡号:{{bankNumber}}</view>
+						<view class="text-v">户名:周仁声</view>
+						<view class="text-v">订单标识:{{payOrderId}} <text class="clipboard" @click.stop="clipboard(payOrderId)">复制</text></view>
 						<view class="text-v title">特别注意</view>
-						<view class="text-v bg-color"
-							>请在转账备注中填写上述订单标识,方便财务快速审核,提高发货速度</view
-						>
+						<view class="text-v bg-color">请在转账备注中填写上述订单标识,方便财务快速审核,提高发货速度</view>
 					</view>
 				</view>
 			</view>
@@ -141,605 +134,582 @@
 </template>
 
 <script>
-const thorui = require('@/components/clipboard/clipboard.thorui.js')
-export default {
-	data() {
-		return {
-			orderId: '',
-			payableAmount: 0,
-			emptyWrapperH: '',
-			bankNumber: '6217 6803 0362 0897',
-			payOrderId: '',
-			nvabarData: {
-				//顶部自定义导航
-				showCapsule: 1, // 是否显示左上角图标  1表示显示  0表示不显示,
-				showSearch: 0,
-				title: '选择支付方式', // 导航栏 中间的标题
-				haveBack: false,
-				haveHome: true,
-				textLeft: this.$store.state.isIphone
-			},
-			isIphoneX: this.$store.state.isIphoneX,
-			CustomBar: this.CustomBar, // 顶部导航栏高度
-			tabCurrentIndex: 0,
-			isShowTip: false,
-			isReceiptStatus: false,
-			buttonText: '使用微信支付',
-			btnColor: '#09BB07',
-			receiptStatus: '',
-			invoiceStatus: false,
-			isPaySwitch: false,
-			optionType: '',
-			onlinePayFlag: '',
-			payBringTitle: '本次交易暂不支持线上支付,请使用线下转账方式付款',
-			payStatusText:
-				'使用微信和企业网银支付全部金额后,供应商会在24小时后发货(周末、节假日顺延)。若着急发货,可以选择使用线下转账进行付款。',
-			pageType: ''
-		}
-	},
-	onLoad(option) {
-		this.initData(option)
-	},
-	filters: {
-		NumFormat(value) {
-			if (!value) return '0.00'
-			/*原来用的是Number(value).toFixed(0),这样取整时有问题,例如0.51取整之后为1,感谢Nils指正*/
-			/*后来改成了 Number(value)|0,但是输入超过十一位就为负数了,具体见评论 */
-			var intPart = Number(value) - (Number(value) % 1) //获取整数部分(这里是windy93的方法)
-			var intPartFormat = intPart.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') //将整数部分逢三一断
-			var floatPart = '.00' //预定义小数部分
-			var value2Array = value.toString().split('.')
-			//=2表示数据有小数位
-			if (value2Array.length == 2) {
-				floatPart = value2Array[1].toString() //拿到小数部分
+	const thorui = require('@/components/clipboard/clipboard.thorui.js')
+	export default{
+		data(){
+			return{
+				orderId:'',
+				payableAmount:0,
+				emptyWrapperH: '',
+				bankNumber:'6217 6803 0362 0897',
+				payOrderId:'',
+				nvabarData: {		//顶部自定义导航
+					showCapsule:1, // 是否显示左上角图标  1表示显示  0表示不显示,
+					showSearch: 0,
+					title: '选择支付方式',  // 导航栏 中间的标题
+					haveBack:false,
+					haveHome:true,
+					textLeft:this.$store.state.isIphone
+				},
+				isIphoneX:this.$store.state.isIphoneX,
+				CustomBar:this.CustomBar,// 顶部导航栏高度
+				tabCurrentIndex:0,
+				isShowTip:false,
+				isReceiptStatus:false,
+				buttonText:'使用微信支付',
+				btnColor:'#09BB07',
+				receiptStatus:'',
+				invoiceStatus:false,
+				isPaySwitch:false,
+				optionType:'',
+				onlinePayFlag:'',
+				payBringTitle:'本次交易暂不支持线上支付,请使用线下转账方式付款',
+				payStatusText:'使用微信和企业网银支付全部金额后,供应商会在24小时后发货(周末、节假日顺延)。若着急发货,可以选择使用线下转账进行付款。',
+				pageType:''
+			}
+		},
+		onLoad(option) {
+			this.initData(option)
+		},
+		filters: {
+			NumFormat(value) {
+				if(!value) return '0.00'
+				/*原来用的是Number(value).toFixed(0),这样取整时有问题,例如0.51取整之后为1,感谢Nils指正*/
+				/*后来改成了 Number(value)|0,但是输入超过十一位就为负数了,具体见评论 */
+				var intPart = Number(value) - Number(value)%1 //获取整数部分(这里是windy93的方法)
+				var intPartFormat = intPart.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') //将整数部分逢三一断
+				var floatPart = '.00' //预定义小数部分
+				var value2Array = value.toString().split('.')
+				//=2表示数据有小数位
+				if(value2Array.length == 2) {
+					floatPart = value2Array[1].toString() //拿到小数部分
 
-				if (floatPart.length == 1) {
-					//补0,实际上用不着
-					return intPartFormat + '.' + floatPart + '0'
+					if(floatPart.length == 1) { //补0,实际上用不着
+						return intPartFormat + '.' + floatPart + '0'
+					} else {
+						return intPartFormat + '.' + floatPart
+					}
 				} else {
-					return intPartFormat + '.' + floatPart
+					return intPartFormat + floatPart
 				}
-			} else {
-				return intPartFormat + floatPart
-			}
-		}
-	},
-	methods: {
-		initData(e) {
-			console.log(e)
-			this.orderId = e.orderId
-			this.payOrderId = '#' + e.orderId + '#'
-			this.optionType = e.type
-			switch (e.type) {
-				case 'confirm':
-					this.nvabarData.haveBack = false
-					this.nvabarData.haveHome = true
-					this.nvabarData.title = '支付'
-					this.PayOrderOnLineSwitch()
-					this.PayOrderCheckoutCounter(this.orderId)
-					break
-				case 'payfirm':
-					this.nvabarData.haveBack = true
-					this.nvabarData.haveHome = false
-					this.nvabarData.title = '选择支付方式'
-					this.PayOrderOnLineSwitch()
-					this.PayOrderCheckoutCounter(this.orderId)
-					break
-				case 'onlinePay':
-					this.invoiceStatus = true
-					this.isPaySwitch = false
-					this.nvabarData.haveBack = true
-					this.nvabarData.haveHome = false
-					this.nvabarData.title = '付款提示'
-					this.payableAmount = e.Amount
-					this.payBringTitle =
-						'您已通过线下转账的方式支付了订单部分款项,剩余款项依然需要使用线下转账方式,给您带来的不便敬请谅解'
-					break
 			}
 		},
-		PayOrderOnLineSwitch() {
-			this.PayService.PayOrderOnLineSwitch()
-				.then(response => {
-					if (response.data === 0) {
+		methods:{
+			initData(e){
+				console.log(e)
+				this.orderId = e.orderId
+				this.payOrderId ='#'+e.orderId+'#'
+				this.optionType = e.type
+				switch(e.type){
+					case 'confirm':
+						this.nvabarData.haveBack = false
+						this.nvabarData.haveHome = true
+						this.nvabarData.title = '支付'
+						this.PayOrderOnLineSwitch()
+						this.PayOrderCheckoutCounter(this.orderId)
+						break
+					case 'payfirm':
+						this.nvabarData.haveBack = true
+						this.nvabarData.haveHome = false
+						this.nvabarData.title = '选择支付方式'
+						this.PayOrderOnLineSwitch()
+						this.PayOrderCheckoutCounter(this.orderId)
+						break
+					case 'onlinePay':
+						this.invoiceStatus = true
+						this.isPaySwitch = false
+						this.nvabarData.haveBack = true
+						this.nvabarData.haveHome = false
+						this.nvabarData.title = '付款提示'
+						this.payableAmount = e.Amount
+						this.payBringTitle = '您已通过线下转账的方式支付了订单部分款项,剩余款项依然需要使用线下转账方式,给您带来的不便敬请谅解'
+						break
+				}
+			},
+			PayOrderOnLineSwitch(){
+				this.PayService.PayOrderOnLineSwitch().then(response=>{
+					if(response.data === 0 ){
 						this.isPaySwitch = true
-					} else {
+					}else{
 						this.isPaySwitch = false
 					}
+				}).catch(error =>{
+					this.$util.msg(error.msg,2000)
 				})
-				.catch(error => {
-					this.$util.msg(error.msg, 2000)
-				})
-		},
-		PayOrderCheckoutCounter(orderId) {
-			this.PayService.PayOrderCheckoutCounter({ orderId: orderId })
-				.then(response => {
+			},
+			PayOrderCheckoutCounter(orderId){
+				this.PayService.PayOrderCheckoutCounter({orderId:orderId}).then(response =>{
 					let data = response.data.order
-					this.payableAmount = data.payableAmount - data.receiptAmount //待付金额
-					this.receiptStatus = data.receiptStatus
-					this.onlinePayFlag = data.onlinePayFlag
+					this.payableAmount = data.payableAmount - data.receiptAmount  //待付金额
+					this.receiptStatus =  data.receiptStatus
+					this.onlinePayFlag = data.onlinePayFlag					
 					//判断线上线下显示
-					if (this.optionType == 'onlinePay') {
+					if(this.optionType == 'onlinePay'){
 						this.invoiceStatus = true
-					} else {
+					}else{
 						this.invoiceStatus = data.invoiceStatus
 					}
-					if (data.receiptAmount > 0) {
-						this.payStatusText =
-							'使用微信和企业网银支付全部金额后,供应商会在24小时后发货(周末、节假日顺延)。'
+					if(data.receiptAmount>0){
+						this.payStatusText = '使用微信和企业网银支付全部金额后,供应商会在24小时后发货(周末、节假日顺延)。'
 						this.isReceiptStatus = false
-					} else {
-						this.payStatusText =
-							'使用微信和企业网银支付全部金额后,供应商会在24小时后发货(周末、节假日顺延)。若着急发货,可以选择使用线下转账进行付款。'
+					}else{
+						this.payStatusText = '使用微信和企业网银支付全部金额后,供应商会在24小时后发货(周末、节假日顺延)。若着急发货,可以选择使用线下转账进行付款。'
 						this.isReceiptStatus = true
 					}
+				}).catch(error =>{
+					this.$util.msg(error.msg,2000)
 				})
-				.catch(error => {
-					this.$util.msg(error.msg, 2000)
-				})
-		},
-		goOrderCash() {
-			if (this.invoiceStatus) {
-				this.$util.modal(
-					'',
-					'本次交易暂不支持线上支付开票,请使用线下转账的方式付款',
-					'知道了',
-					'',
-					false,
-					() => {}
-				)
-				this.payStatusText =
-					'使用微信和企业网银支付全部金额后,供应商会在24小时后发货(周末、节假日顺延)。若着急发货,可以选择使用线下转账进行付款。'
-				this.isReceiptStatus = true
-			} else {
-				// 友盟埋点收集选择支付方式
-				if (process.env.NODE_ENV != 'development') {
-					this.$uma.trackEvent('Um_Event_ChooseWechatPay', {
-						Um_Key_PageName: '线上支付',
-						Um_Key_SourcePage: '选择支付',
-						Um_Key_PayName: `${this.buttonText}`,
-						Um_Key_PayOrderID: `${this.orderId}`
-					})
+			},
+			goOrderCash(){
+				if(this.invoiceStatus){
+					this.$util.modal('','本次交易暂不支持线上支付开票,请使用线下转账的方式付款','知道了','',false,() =>{})
+					this.payStatusText = '使用微信和企业网银支付全部金额后,供应商会在24小时后发货(周末、节假日顺延)。若着急发货,可以选择使用线下转账进行付款。'
+					this.isReceiptStatus = true
+				}else{
+					// 友盟埋点收集选择支付方式
+					if(process.env.NODE_ENV != 'development'){
+						this.$uma.trackEvent('Um_Event_ChooseWechatPay', {
+							Um_Key_PageName: '线上支付',
+							Um_Key_SourcePage: '选择支付',
+							Um_Key_PayName:`${this.buttonText}`,
+							Um_Key_PayOrderID:`${this.orderId}`
+						})
+					}
+					switch(this.tabCurrentIndex){
+						case 0:
+							this.$api.navigateTo(`/pages/user/order/order-pay?type=0&orderId=${this.orderId}`)
+							break
+						case 1:
+							this.$api.navigateTo(`/pages/user/order/order-pay?type=1&orderId=${this.orderId}`)
+							break
+						case 2:
+							this.$api.navigateTo(`/pages/user/order/order-pay?type=2&orderId=${this.orderId}`)
+							break
+					}
 				}
-				switch (this.tabCurrentIndex) {
+			},
+			tabClick(index) {//tab切换
+				this.tabCurrentIndex = index
+				switch(index){
 					case 0:
-						this.$api.navigateTo(`/pages/user/order/order-pay?type=0&orderId=${this.orderId}`)
+						this.btnColor='#09BB07'
+						this.buttonText='使用微信支付'
 						break
 					case 1:
-						this.$api.navigateTo(`/pages/user/order/order-pay?type=1&orderId=${this.orderId}`)
+						this.btnColor='#034582'
+						this.buttonText='使用企业网银支付'
 						break
 					case 2:
-						this.$api.navigateTo(`/pages/user/order/order-pay?type=2&orderId=${this.orderId}`)
+						this.btnColor='#034582'
+						this.buttonText='使用个人网银支付'
 						break
 				}
-			}
-		},
-		tabClick(index) {
-			//tab切换
-			this.tabCurrentIndex = index
-			switch (index) {
-				case 0:
-					this.btnColor = '#09BB07'
-					this.buttonText = '使用微信支付'
-					break
-				case 1:
-					this.btnColor = '#034582'
-					this.buttonText = '使用企业网银支付'
-					break
-				case 2:
-					this.btnColor = '#034582'
-					this.buttonText = '使用个人网银支付'
-					break
-			}
-		},
-		hanldNavigateBack() {
-			//页面返回
-			uni.navigateBack({
-				delta: 1
-			})
-		},
-		showTips() {
-			this.isShowTip = !this.isShowTip
+			},
+			hanldNavigateBack(){//页面返回
+				uni.navigateBack({
+					delta: 1
+				})
+			},
+			showTips(){
+				this.isShowTip=!this.isShowTip
+			},
+			clipboard(data) {
+				thorui.getClipboardData(data, (res) => {
+					if (res) {
+						this.$util.msg('复制成功',2000,true,'success')
+					} else {
+						this.$util.msg('复制失败',2000,true,'none')
+					}
+				})
+			},
 		},
-		clipboard(data) {
-			thorui.getClipboardData(data, res => {
-				if (res) {
-					this.$util.msg('复制成功', 2000, true, 'success')
-				} else {
-					this.$util.msg('复制失败', 2000, true, 'none')
-				}
-			})
+		onShow() {
+
 		}
-	},
-	onShow() {}
-}
+	}
 </script>
 
 <style lang="scss">
-page {
-	height: auto !important;
-	background-color: #ffffff;
-}
-.container-cash {
-	width: 100%;
-	padding-bottom: 250rpx;
-	.pay-bring-title {
-		box-sizing: border-box;
-		width: 100%;
-		min-height: 96rpx;
-		padding: 20rpx 24rpx;
-		line-height: 48rpx;
-		text-align: left;
-		font-size: $font-size-24;
-		background: rgba(255, 234, 221, 1);
-		color: $color-system;
+	page{
+		height: auto !important;
+		background-color: #FFFFFF;
 	}
-	.container-wrapper {
-		width: 662rpx;
-		margin: 0 auto;
-		.pay-title {
-			font-size: $font-size-32;
-			line-height: 44rpx;
-			text-align: center;
-			color: #2a86ff;
-			margin: 40rpx 0 0 0;
+	.container-cash{
+		width: 100%;
+		padding-bottom: 250rpx;
+		.pay-bring-title{
+			box-sizing: border-box;
 			width: 100%;
-			float: left;
+			min-height: 96rpx;
+			padding: 20rpx 24rpx;
+			line-height: 48rpx;
+			text-align: left;
+			font-size: $font-size-24;
+			background:rgba(255,234,221,1);
+			color: $color-system;
 		}
-		.pay-content {
-			width: 574rpx;
-			height: 136rpx;
-			padding: 52rpx 44rpx;
-			background: url(https://img.caimei365.com/group1/M00/03/BD/Cmis218ekFyAHoAzAALhR3oBpDI049.png) no-repeat;
-			background-size: cover;
-			float: left;
-			margin-top: 40rpx;
-			.pay-p {
-				font-size: $font-size-26;
-				color: #ffffff;
-				line-height: 36rpx;
+		.container-wrapper{
+			width:662rpx;
+			margin: 0 auto;
+			.pay-title{
+				font-size: $font-size-32;
+				line-height: 44rpx;
+				text-align: center;
+				color: #2A86FF;
+				margin: 40rpx 0 0 0;
+				width: 100%;
+				float: left;
 			}
-			.pay-money {
-				color: #ffffff;
-				line-height: 84rpx;
-				font-weight: bold;
-				.pay-sm {
+			.pay-content{
+				width: 574rpx;
+				height: 136rpx;
+				padding: 52rpx 44rpx;
+				background: url(https://img.caimei365.com/group1/M00/03/BD/Cmis218ekFyAHoAzAALhR3oBpDI049.png) no-repeat;
+				background-size: cover;
+				float: left;
+				margin-top: 40rpx;
+				.pay-p{
 					font-size: $font-size-26;
+					color: #FFFFFF;
+					line-height: 36rpx;
 				}
-				.pay-bg {
-					font-size: 50rpx;
+				.pay-money{
+					color: #FFFFFF;
+					line-height: 84rpx;
+					font-weight: bold;
+					.pay-sm{
+						font-size: $font-size-26;
+					}
+					.pay-bg{
+						font-size: 50rpx;
+					}
 				}
 			}
-		}
-		.pay-check {
-			width: 100%;
-			height: auto;
-			float: left;
-			.check-title {
-				width: 622rpx;
-				height: 40rpx;
-				line-height: 40rpx;
-				padding: 0 20rpx;
-				margin-top: 24rpx;
-				.text {
-					font-size: $font-size-28;
-					color: $text-color;
-					text-align: left;
-					float: left;
-				}
-				.icon {
-					width: 40rpx;
+			.pay-check{
+				width: 100%;
+				height: auto;
+				float: left;
+				.check-title{
+					width: 622rpx;
 					height: 40rpx;
-					border-radius: 50%;
 					line-height: 40rpx;
-					text-align: center;
-					color: #ffffff;
-					font-size: $font-size-24;
-					background: radial-gradient(
-						circle,
-						rgba(225, 86, 22, 1) 0%,
-						rgba(255, 170, 0, 1) 67%,
-						rgba(249, 185, 156, 1) 100%
-					);
-					float: right;
+					padding: 0 20rpx;
+					margin-top: 24rpx;
+					.text{
+						font-size: $font-size-28;
+						color: $text-color;
+						text-align: left;
+						float: left;
+					}
+					.icon{
+						width: 40rpx;
+						height: 40rpx;
+						border-radius: 50%;
+						line-height: 40rpx;
+						text-align: center;
+						color: #FFFFFF;
+						font-size: $font-size-24;
+						background: radial-gradient(circle,rgba(225,86,22,1) 0%,rgba(255,170,0,1) 67%,rgba(249,185,156,1) 100%);
+						float: right;
+					}
 				}
-			}
-			.pay-checked {
-				width: 100%;
-				height: auto;
-				.pay-item {
-					width: 618rpx;
-					height: 96rpx;
-					border: 2px solid #f5f5f5;
-					border-radius: 30rpx;
-					padding: 20rpx;
-					margin: 24rpx 0;
-					display: flex;
-					background-color: #ffffff;
-					&.current {
-						border-color: $color-system;
-						.item-r {
-							.icon-duigou {
-								color: $color-system;
+				.pay-checked{
+					width: 100%;
+					height: auto;
+					.pay-item{
+						width: 618rpx;
+						height: 96rpx;
+						border: 2px solid #F5F5F5;
+						border-radius: 30rpx;
+						padding: 20rpx;
+						margin: 24rpx 0;
+						display: flex;
+						background-color: #FFFFFF;
+						&.current{
+							border-color:$color-system;
+							.item-r{
+								.icon-duigou{
+									color: $color-system;
+								}
 							}
 						}
-					}
-					.item-l {
-						flex: 8;
-						.item-icon {
-							width: 96rpx;
-							height: 96rpx;
-							float: left;
-							text-align: center;
-							line-height: 96rpx;
-							margin-right: 20rpx;
-							.iconfont {
-								font-size: 88rpx;
-							}
-							.icon-weixinzhifu {
-								color: #09bb07;
+						.item-l{
+							flex: 8;
+							.item-icon{
+								width: 96rpx;
+								height: 96rpx;
+								float: left;
+								text-align: center;
+								line-height: 96rpx;
+								margin-right: 20rpx;
+								.iconfont{
+									font-size:88rpx;
+								}
+								.icon-weixinzhifu{
+									color: #09BB07;
+								}
+								.icon-gerenwangyinzhifu{
+									color: #034582;
+								}
+								.icon-qiyewangyinzhifu{
+									color: #004889;
+								}
 							}
-							.icon-gerenwangyinzhifu {
-								color: #034582;
+							.item-texts{
+								line-height: 96rpx;
+								font-size:$font-size-26;
+								color: $text-color;
 							}
-							.icon-qiyewangyinzhifu {
-								color: #004889;
+							.item-text{
+								line-height: 48rpx;
+								font-size:$font-size-26;
+								.txt-p{
+									color: $text-color;
+								}
+								.txt-t{
+									color: #999999;
+								}
 							}
 						}
-						.item-texts {
+						.item-r{
+							flex: 2;
+							text-align: center;
 							line-height: 96rpx;
-							font-size: $font-size-26;
-							color: $text-color;
-						}
-						.item-text {
-							line-height: 48rpx;
-							font-size: $font-size-26;
-							.txt-p {
-								color: $text-color;
+							.icon-duigou{
+								font-size: 60rpx;
+								color: #FFFFFF;
 							}
-							.txt-t {
-								color: #999999;
-							}
-						}
-					}
-					.item-r {
-						flex: 2;
-						text-align: center;
-						line-height: 96rpx;
-						.icon-duigou {
-							font-size: 60rpx;
-							color: #ffffff;
 						}
 					}
 				}
 			}
 		}
-	}
-	.pay-button {
-		width: 100%;
-		float: left;
-		margin-top: 30rpx;
-		.btn {
-			width: 662rpx;
-			height: 88rpx;
-			border-radius: 44rpx;
-			font-size: $font-size-28;
-			line-height: 88rpx;
-			color: #ffffff;
-			margin: 0 auto;
-			text-align: center;
-			background: $btn-confirm;
-		}
-	}
-	.pay-statustext {
-		width: 100%;
-		height: 120rpx;
-		float: left;
-		margin-top: 40rpx;
-		.pay-statustext-inner {
-			width: 662rpx;
-			height: 100%;
-			margin: 0 auto;
-			.pay-icon {
-				width: 62rpx;
-				height: 100%;
-				float: left;
+		.pay-button{
+			width: 100%;
+			float: left;
+			margin-top:30rpx;
+			.btn{
+				width: 662rpx;
+				height: 88rpx;
+				border-radius: 44rpx;
+				font-size: $font-size-28;
+				line-height: 88rpx;
+				color: #FFFFFF;
+				margin: 0 auto;
 				text-align: center;
-				.iconfont {
-					color: #ff2a2a;
-					font-size: $font-size-36;
-					line-height: 20rpx;
-				}
+				background:$btn-confirm;
 			}
-			.pay-text {
-				width: 560rpx;
+		}
+		.pay-statustext{
+			width: 100%;
+			height: 120rpx;
+			float: left;
+			margin-top:40rpx;
+			.pay-statustext-inner{
+				width: 662rpx;
 				height: 100%;
-				float: left;
-				line-height: 40rpx;
-				font-size: $font-size-26;
-				color: #ff2a2a;
-				text-align: justify;
+				margin: 0 auto;
+				.pay-icon{
+					width: 62rpx;
+					height: 100%;
+					float: left;
+					text-align: center;
+					.iconfont{
+						color: #FF2A2A;
+						font-size:$font-size-36;
+						line-height: 20rpx;
+					}
+				}
+				.pay-text{
+					width: 560rpx;
+					height: 100%;
+					float: left;
+					line-height: 40rpx;
+					font-size: $font-size-26;
+					color: #FF2A2A;
+					text-align: justify;
+				}
 			}
 		}
-	}
-	.pay-bring {
-		width: 100%;
-		min-height: 190rpx;
-		padding: 24rpx 0;
-		background-color: #ffffff;
-		box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
-		position: fixed;
-		bottom: 0;
-		left: 0;
-		border-radius: 30rpx 30rpx 0 0;
-		display: flex;
-		align-items: center;
-		flex-direction: column;
-		.pay-bring-line {
+		.pay-bring{
+			width: 100%;
+			min-height: 190rpx;
+			padding: 24rpx 0;
+			background-color: #FFFFFF;
+			box-shadow:0px 3px 6px rgba(0,0,0,0.16);
+			position: fixed;
+			bottom: 0;
+			left: 0;
+			border-radius: 30rpx 30rpx 0 0;
 			display: flex;
 			align-items: center;
-			.line {
-				display: inline-block;
-				width: 48rpx;
-				height: 2px;
-				background-color: #707070;
-			}
-		}
-		.pay-bring-content {
-			width: 654rpx;
-			height: auto;
-			padding: 0 24rpx;
-			.text {
-				font-size: $font-size-24;
-				color: #666;
-				line-height: 44rpx;
-				text-align: center;
-				&.bg-color {
-					color: $color-system;
-					line-height: 88rpx;
+			flex-direction: column;
+			.pay-bring-line{
+				display: flex;
+				align-items: center;
+				.line{
+					display: inline-block;
+					width: 48rpx;
+					height: 2px;
+					background-color: #707070;
 				}
 			}
-			.text-v {
-				font-size: $font-size-28;
-				color: #999;
-				line-height: 70rpx;
-				text-align: left;
-				&.title {
-					font-size: $font-size-26;
-					color: #666666;
-				}
-				&.bg-color {
+			.pay-bring-content{
+				width: 654rpx;
+				height: auto;
+				padding: 0 24rpx;
+				.text{
+					font-size: $font-size-24;
+					color: #666;
 					line-height: 44rpx;
-					color: $color-system;
-				}
-				.clipboard {
-					width: 84rpx;
-					height: 36rpx;
-					background: linear-gradient(34deg, rgba(255, 41, 41, 1) 0%, rgba(255, 109, 27, 1) 100%);
 					text-align: center;
-					font-size: $font-size-24;
-					color: #ffffff;
-					border-radius: 4rpx;
-					line-height: 36rpx;
-					display: inline-block;
-					margin-left: 10rpx;
-				}
-			}
-		}
-	}
-	.pay-bring-wrapper {
-		width: 100%;
-		padding: 24rpx 0;
-		background-color: #ffffff;
-		display: flex;
-		align-items: center;
-		flex-direction: column;
-		.pay-bring-content {
-			width: 654rpx;
-			height: auto;
-			padding: 0 24rpx;
-			.text {
-				font-size: $font-size-24;
-				color: #666;
-				line-height: 44rpx;
-				text-align: center;
-				&.bg-color {
-					color: $color-system;
-					line-height: 88rpx;
+					&.bg-color{
+						color: $color-system;
+						line-height: 88rpx;
+					}
 				}
-			}
-			.text-v {
-				font-size: $font-size-28;
-				color: #999;
-				line-height: 70rpx;
-				text-align: left;
-				&.title {
+				.text-v{
 					font-size: $font-size-28;
-					color: #666666;
+					color: #999;
+					line-height: 70rpx;
+					text-align: left;
+					&.title{
+						font-size: $font-size-26;
+						color: #666666;
+					}
+					&.bg-color{
+						line-height: 44rpx;
+						color: $color-system;
+					}
+					.clipboard{
+						width: 84rpx;
+						height: 36rpx;
+						background:linear-gradient(34deg,rgba(255,41,41,1) 0%,rgba(255,109,27,1) 100%);
+						text-align: center;
+						font-size: $font-size-24;
+						color: #FFFFFF;
+						border-radius: 4rpx;
+						line-height: 36rpx;
+						display: inline-block;
+						margin-left: 10rpx;
+					}
 				}
-				&.bg-color {
+			}
+		}
+		.pay-bring-wrapper{
+			width: 100%;
+			padding: 24rpx 0;
+			background-color: #FFFFFF;
+			display: flex;
+			align-items: center;
+			flex-direction: column;
+			.pay-bring-content{
+				width: 654rpx;
+				height: auto;
+				padding: 0 24rpx;
+				.text{
+					font-size: $font-size-24;
+					color: #666;
 					line-height: 44rpx;
-					color: $color-system;
-				}
-				.clipboard {
-					width: 84rpx;
-					height: 36rpx;
-					background: linear-gradient(34deg, rgba(255, 41, 41, 1) 0%, rgba(255, 109, 27, 1) 100%);
 					text-align: center;
-					font-size: $font-size-24;
-					color: #ffffff;
-					border-radius: 4rpx;
-					line-height: 36rpx;
-					display: inline-block;
-					margin-left: 10rpx;
+					&.bg-color{
+						color: $color-system;
+						line-height: 88rpx;
+					}
+				}
+				.text-v{
+					font-size: $font-size-28;
+					color: #999;
+					line-height: 70rpx;
+					text-align: left;
+					&.title{
+						font-size: $font-size-28;
+						color: #666666;
+					}
+					&.bg-color{
+						line-height: 44rpx;
+						color: $color-system;
+					}
+					.clipboard{
+						width: 84rpx;
+						height: 36rpx;
+						background:linear-gradient(34deg,rgba(255,41,41,1) 0%,rgba(255,109,27,1) 100%);
+						text-align: center;
+						font-size: $font-size-24;
+						color: #FFFFFF;
+						border-radius: 4rpx;
+						line-height: 36rpx;
+						display: inline-block;
+						margin-left: 10rpx;
+					}
 				}
 			}
 		}
 	}
-}
-.freight-alert {
-	width: 100%;
-	height: 100%;
-	background: rgba(0, 0, 0, 0.5);
-	position: fixed;
-	top: 0;
-	left: 0;
-	z-index: 8888;
-	transition: all 0.4s;
-	&.none {
-		display: none;
-	}
-	&.show {
-		display: block;
-	}
-	.content {
-		width: 422rpx;
-		height: 434rpx;
-		position: absolute;
-		background: $bg-color;
-		left: 0;
-		right: 0;
-		bottom: 0;
+	.freight-alert{
+		width: 100%;
+		height: 100%;
+		background: rgba(0,0,0,.5);
+		position: fixed;
 		top: 0;
-		margin: auto;
-		padding: 20rpx 32rpx;
-		border-radius: 12rpx;
-		.title {
-			width: 100%;
-			height: 68rpx;
-			line-height: 68rpx;
-			font-size: $font-size-28;
-			color: $text-color;
-			text-align: center;
-			position: relative;
-			.icon-iconfontguanbi {
-				width: 68rpx;
+		left: 0;
+		z-index: 8888;
+		transition: all 0.4s;
+		&.none{
+			display: none;
+		}
+		&.show{
+			display: block;
+		}
+		.content{
+			width: 422rpx;
+			height:434rpx;
+			position: absolute;
+			background: $bg-color;
+			left: 0;
+			right: 0;
+			bottom: 0;
+			top: 0;
+			margin: auto;
+			padding: 20rpx 32rpx;
+			border-radius: 12rpx;
+			.title{
+				width: 100%;
 				height: 68rpx;
-				text-align: center;
 				line-height: 68rpx;
-				position: absolute;
-				right: 0;
-				top: 0;
-				font-size: $font-size-36;
-				color: #999999;
-			}
-		}
-		.text-content {
-			width: 100%;
-			height: auto;
-			.text {
-				padding: 20rpx 0;
-				line-height: 44rpx;
-				font-size: $font-size-26;
-				color: #666666;
-				text-align: justify;
+				font-size: $font-size-28;
+				color: $text-color;
+				text-align: center;
+				position: relative;
+				.icon-iconfontguanbi{
+					width: 68rpx;
+					height: 68rpx;
+					text-align: center;
+					line-height: 68rpx;
+					position: absolute;
+					right: 0;
+					top: 0;
+					font-size: $font-size-36;
+					color: #999999;
+				}
 			}
-			.text-p {
-				line-height: 44rpx;
-				font-size: $font-size-26;
-				color: $color-system;
-				text-align: left;
+			.text-content{
+				width: 100%;
+				height: auto;
+				.text{
+					padding: 20rpx 0;
+					line-height: 44rpx;
+					font-size: $font-size-26;
+					color:#666666;
+					text-align: justify;
+				}
+				.text-p{
+					line-height: 44rpx;
+					font-size: $font-size-26;
+					color:$color-system;
+					text-align: left;
+				}
 			}
 		}
 	}
-}
 </style>