|
@@ -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>
|