800 lines
		
	
	
		
			19 KiB
		
	
	
	
		
			Vue
		
	
	
	
			
		
		
	
	
			800 lines
		
	
	
		
			19 KiB
		
	
	
	
		
			Vue
		
	
	
	
| <!--
 | ||
|  * @Descripttion:
 | ||
|  * @version:
 | ||
|  * @Author: kBank
 | ||
|  * @Date: 2022-11-21 15:11:22
 | ||
| -->
 | ||
| <template>
 | ||
|   <view class="content">
 | ||
|     <view class="index_header"> </view>
 | ||
|     <view class="contxt">
 | ||
|       <view class="tit">{{ '待支付金额' }}</view>
 | ||
|       <view class="tit1">
 | ||
|         {{ userInfo.currencyIcon }}{{ objTree.amount | numberToCurrency }}
 | ||
|       </view>
 | ||
|       <view class="kuang">
 | ||
|         <u-collapse
 | ||
|           :value="activeNames"
 | ||
|           ref="collapse"
 | ||
|           @open="change"
 | ||
|           @close="close"
 | ||
|           accordion
 | ||
|           :border="false"
 | ||
|         >
 | ||
|           <u-collapse-item name="1" v-if="userInfo.memberCode != 'ZK68880628'">
 | ||
|             <view slot="title" class="pf">
 | ||
|               <img src="@/static/images/yhkzf.jpg" alt="" />
 | ||
|               <view>{{ '钱包支付' }}</view>
 | ||
|             </view>
 | ||
|             <view
 | ||
|               class="quan_i"
 | ||
|               v-show="account.consumeBalance == 0 || account.consumeDeduct > 0"
 | ||
|             >
 | ||
|               <view class="tTit">{{ '消费账户' }}</view>
 | ||
|               <view class="lan">
 | ||
|                 <view>
 | ||
|                   {{ account.consumeBalance | numberToCurrency | isLocal }}
 | ||
|                 </view>
 | ||
|                 <view>
 | ||
|                   -{{ account.consumeDeduct | numberToCurrency | isLocal }}
 | ||
|                 </view>
 | ||
|               </view>
 | ||
|             </view>
 | ||
|             <view
 | ||
|               class="quan_i"
 | ||
|               v-show="account.bonusBalance == 0 || account.bonusDeduct > 0"
 | ||
|             >
 | ||
|               <view class="tTit">{{ '奖金账户' }}</view>
 | ||
|               <view class="lan">
 | ||
|                 <view>
 | ||
|                   {{ account.bonusBalance | numberToCurrency | isLocal }}
 | ||
|                 </view>
 | ||
|                 <view>
 | ||
|                   -{{ account.bonusDeduct | numberToCurrency | isLocal }}
 | ||
|                 </view>
 | ||
|               </view>
 | ||
|             </view>
 | ||
|             <view class="quan_i" v-show="payDetail.payAccount3 > 0">
 | ||
|               <view class="tTit">{{ '政策账户' }}</view>
 | ||
|               <view class="lan">
 | ||
|                 <view>
 | ||
|                   {{ payDetail.account3 | numberToCurrency | isLocal }}
 | ||
|                 </view>
 | ||
|                 <view>
 | ||
|                   -{{ payDetail.payAccount3 | numberToCurrency | isLocal }}
 | ||
|                 </view>
 | ||
|               </view>
 | ||
|             </view>
 | ||
|             <view
 | ||
|               class="quan_i"
 | ||
|               v-show="account.cashBalance == 0 || account.cashDeduct > 0"
 | ||
|             >
 | ||
|               <view class="tTit">{{ '现金账户' }}</view>
 | ||
|               <view class="lan">
 | ||
|                 <view>
 | ||
|                   {{ account.cashBalance | numberToCurrency | isLocal }}
 | ||
|                 </view>
 | ||
|                 <view>
 | ||
|                   -{{ account.cashDeduct | numberToCurrency | isLocal }}
 | ||
|                 </view>
 | ||
|               </view>
 | ||
|             </view>
 | ||
| 
 | ||
|             <view class="quan_i" v-show="payDetail.payAccount5 > 0">
 | ||
|               <view class="tTit">{{ '重消账户' }}</view>
 | ||
|               <view class="lan">
 | ||
|                 <view>
 | ||
|                   {{ payDetail.account5 | numberToCurrency | isLocal }}
 | ||
|                 </view>
 | ||
|                 <view>
 | ||
|                   -{{ payDetail.payAccount5 | numberToCurrency | isLocal }}
 | ||
|                 </view>
 | ||
|               </view>
 | ||
|             </view>
 | ||
|             <view class="quan_i" v-show="payDetail.payAccount6 > 0">
 | ||
|               <view class="tTit">{{ '积分账户' }}</view>
 | ||
|               <view class="lan">
 | ||
|                 <view>
 | ||
|                   {{ payDetail.account6 | numberToCurrency | isLocal }}
 | ||
|                 </view>
 | ||
|                 <view>
 | ||
|                   -{{ payDetail.payAccount6 | numberToCurrency | isLocal }}
 | ||
|                 </view>
 | ||
|               </view>
 | ||
|             </view>
 | ||
|             <view class="quan_i" v-show="payDetail.payAccount7 > 0">
 | ||
|               <view class="tTit">{{ '鼓励账户' }}</view>
 | ||
|               <view class="lan">
 | ||
|                 <view>
 | ||
|                   {{ payDetail.account7 | numberToCurrency | isLocal }}
 | ||
|                 </view>
 | ||
|                 <view>
 | ||
|                   -{{ payDetail.payAccount7 | numberToCurrency | isLocal }}
 | ||
|                 </view>
 | ||
|               </view>
 | ||
|             </view>
 | ||
|             <view class="quan_i" v-show="payDetail.payAccount8 > 0">
 | ||
|               <view class="tTit">{{ '复购券账户' }}</view>
 | ||
|               <view class="lan">
 | ||
|                 <view>
 | ||
|                   {{ payDetail.account8 | numberToCurrency | isLocal }}
 | ||
|                 </view>
 | ||
|                 <view>
 | ||
|                   -{{ payDetail.payAccount8 | numberToCurrency | isLocal }}
 | ||
|                 </view>
 | ||
|               </view>
 | ||
|             </view>
 | ||
|             <view class="quan_i" v-show="payDetail.payAccount9 > 0">
 | ||
|               <view class="tTit">{{ '全球积分' }}</view>
 | ||
|               <view class="lan">
 | ||
|                 <view>
 | ||
|                   {{ payDetail.account9 | numberToCurrency | isLocal }}
 | ||
|                 </view>
 | ||
|                 <view>
 | ||
|                   -{{ payDetail.payAccount9 | numberToCurrency | isLocal }}
 | ||
|                 </view>
 | ||
|               </view>
 | ||
|             </view>
 | ||
|             <view class="quan_i" v-show="payDetail.payAccount10 > 0">
 | ||
|               <view class="tTit">{{ '车奖积分' }}</view>
 | ||
|               <view class="lan">
 | ||
|                 <view>
 | ||
|                   {{ payDetail.account10 | numberToCurrency | isLocal }}
 | ||
|                 </view>
 | ||
|                 <view>
 | ||
|                   -{{ payDetail.payAccount10 | numberToCurrency | isLocal }}
 | ||
|                 </view>
 | ||
|               </view>
 | ||
|             </view>
 | ||
|           </u-collapse-item>
 | ||
|         </u-collapse>
 | ||
|       </view>
 | ||
|     </view>
 | ||
|     <!-- 输入验证码,密码 -->
 | ||
|     <u-popup :show="isPw" mode="center" closeable @close="closePw">
 | ||
|       <view class="t_tit">{{ '支付验证' }}</view>
 | ||
|       <view class="box">
 | ||
|         <view class="c_tit" v-if="isBank">{{ '请输入短信验证码' }}</view>
 | ||
|         <view class="c_tit" v-else>{{ '请输入密码' }}</view>
 | ||
|         <u--input
 | ||
|           v-if="isBank"
 | ||
|           border="surround"
 | ||
|           v-model="codeValue"
 | ||
|         ></u--input>
 | ||
|         <u--input
 | ||
|           v-else
 | ||
|           border="surround"
 | ||
|           type="password"
 | ||
|           v-model="codeValue"
 | ||
|         ></u--input>
 | ||
|         <u-button
 | ||
|           type="success"
 | ||
|           class="uBtn"
 | ||
|           shape="circle"
 | ||
|           :loading="isLoading"
 | ||
|           loadingText="支付中"
 | ||
|           @tap="payPw()"
 | ||
|           color="linear-gradient(to right, #005BAC, #005BAC )"
 | ||
|           >{{ '立即支付' }}
 | ||
|         </u-button>
 | ||
|       </view>
 | ||
|     </u-popup>
 | ||
|     <!-- 底部 -->
 | ||
|     <view class="footer_f">
 | ||
|       <view class="footer">
 | ||
|         <view class="footer_r">
 | ||
|           <u-button
 | ||
|             type="success"
 | ||
|             class="uBtn"
 | ||
|             shape="circle"
 | ||
|             :loading="isLoading"
 | ||
|             loadingText="支付中"
 | ||
|             @tap="quickPay(isRecharge)"
 | ||
|             color="linear-gradient(to right, #005BAC, #005BAC )"
 | ||
|             >{{ '立即支付' }}
 | ||
|           </u-button>
 | ||
|         </view>
 | ||
|       </view>
 | ||
|     </view>
 | ||
|     <!-- 成功 -->
 | ||
|     <u-modal
 | ||
|       :show="showSucce"
 | ||
|       showConfirmButton
 | ||
|       :content="content"
 | ||
|       confirmColor="#DE3932"
 | ||
|       @confirm="reset"
 | ||
|       ref="uModal"
 | ||
|       :asyncClose="true"
 | ||
|     ></u-modal>
 | ||
|     <!-- 二维码 -->
 | ||
|     <u-popup :show="wxPopup" mode="center" closeable @close="closewxPopup">
 | ||
|       <view class="t_tit">{{ '微信支付' }}</view>
 | ||
|       <view class="pay_code">
 | ||
|         <div ref="qrCodeUrlWx" class="qrcode"></div>
 | ||
|       </view>
 | ||
|     </u-popup>
 | ||
|     <successDialog
 | ||
|       @successClose="successClose"
 | ||
|       ref="successDialog"
 | ||
|     ></successDialog>
 | ||
|   </view>
 | ||
| </template>
 | ||
| 
 | ||
| <script>
 | ||
| import * as api from '@/config/pay.js'
 | ||
| import QRCode from 'qrcodejs2'
 | ||
| 
 | ||
| import successDialog from '@/components/successDialog.vue'
 | ||
| import * as act from '@/config/activity.js'
 | ||
| var payStatus
 | ||
| export default {
 | ||
|   components: {
 | ||
|     successDialog,
 | ||
|   },
 | ||
|   data() {
 | ||
|     return {
 | ||
|       payList: {},
 | ||
|       isLoading: false,
 | ||
|       clockTime: '',
 | ||
|       specialArea: '',
 | ||
|       orderCode: '',
 | ||
|       orderData: {
 | ||
|         orderAmount: '',
 | ||
|       },
 | ||
|       countDown: '',
 | ||
|       payDetail: {
 | ||
|         payAccount1: 1,
 | ||
|       },
 | ||
|       paramsPost: '',
 | ||
|       isShare: false, //分享用户第一次爆单
 | ||
|       userInfo: '',
 | ||
|       activeNames: 1,
 | ||
|       whatPay: '',
 | ||
|       hfList: [],
 | ||
|       jdList: [],
 | ||
|       businessType: '',
 | ||
|       isBank: '',
 | ||
|       isPw: false,
 | ||
|       codeValue: '',
 | ||
|       bindCode: '',
 | ||
|       showSucce: false, //
 | ||
|       sucPay: 0,
 | ||
|       content: '支付成功',
 | ||
|       wxPopup: false,
 | ||
|       luckydrawData: {},
 | ||
|       isRecharge: false,
 | ||
|       czJe: '',
 | ||
|       objTree: {},
 | ||
|       account: {},
 | ||
|     }
 | ||
|   },
 | ||
|   onLoad(options) {
 | ||
|     uni.setNavigationBarTitle({
 | ||
|       title: '订单支付',
 | ||
|     })
 | ||
|     // this.paramsPost = JSON.parse(options.paramsPost)
 | ||
|     // if (this.paramsPost.isRecharge) {
 | ||
|     // 	this.isRecharge = this.paramsPost.isRecharge
 | ||
|     // 	this.businessType = 3
 | ||
|     // 	uni.setNavigationBarTitle({
 | ||
|     // 		title: '充值'
 | ||
|     // 	});
 | ||
|     // 	// this.businessType =
 | ||
|     // } else {
 | ||
|     // 	uni.setNavigationBarTitle({
 | ||
|     // 		title: '订单支付'
 | ||
|     // 	});
 | ||
|     // 	this.isRecharge = false
 | ||
|     // 	if (JSON.parse(options.paramsPost).orderType == 4) {
 | ||
|     // 		this.orderCode = this.paramsPost.orderCode
 | ||
|     // 		this.luckydrawData = this.paramsPost.luckydrawData
 | ||
|     // 		// 抽奖支付处理(查询订单支付信息以及显示等)
 | ||
|     // 		this.businessType = 4 //抽奖
 | ||
|     // 		this.specialArea = this.paramsPost.specialArea
 | ||
|     // 		this.getLuckdrawDetail()
 | ||
|     // 	} else {
 | ||
|     // 		this.userInfo = uni.getStorageSync('User')
 | ||
|     // 		if (
 | ||
|     // 			this.userInfo.registerFans == 0 ||
 | ||
|     // 			this.userInfo.registerShare == 0
 | ||
|     // 		) {
 | ||
|     // 			this.isShare = true
 | ||
|     // 		}
 | ||
| 
 | ||
|     // 		this.specialArea =
 | ||
|     // 			this.paramsPost.specialArea || this.paramsPost.orderType
 | ||
|     // 		this.orderCode = this.paramsPost.orderCode
 | ||
|     // 		this.businessType = options.businessType
 | ||
|     // 		// this.getInfo()
 | ||
| 
 | ||
|     // 		// 获取订单信息
 | ||
|     // 		this.getOrderInfo()
 | ||
|     // 		if (!this.isShare) {
 | ||
|     // 			// 获取消费信息
 | ||
|     // 			this.getSpendInfo()
 | ||
|     // 		}
 | ||
|     // 	}
 | ||
|     // }
 | ||
| 
 | ||
|     // // 获取支付配置
 | ||
|     // this.getPayConfig()
 | ||
|     // clearInterval(this.clockTime)
 | ||
|     this.objTree = JSON.parse(options.treeObj)
 | ||
|     this.getAccount()
 | ||
|   },
 | ||
| 
 | ||
|   onShow() {
 | ||
|     // 获取银行卡
 | ||
|     // this.getBankList()
 | ||
|   },
 | ||
|   methods: {
 | ||
|     getAccount() {
 | ||
|       api
 | ||
|         .deductionAccount({
 | ||
|           pkBaseId: this.objTree.pkBaseId,
 | ||
|           pkTreeRule: this.objTree.pkTreeRule,
 | ||
|           shopQuantity: this.objTree.quantity,
 | ||
|         })
 | ||
|         .then(res => {
 | ||
|           this.account = res.data
 | ||
|           this.$nextTick(() => {
 | ||
|             this.$refs.collapse.init()
 | ||
|           })
 | ||
|           this.$forceUpdate()
 | ||
|         })
 | ||
|     },
 | ||
|     //查询充值抽奖次数
 | ||
|     getLuckdrawDetail() {
 | ||
|       // 抽奖支付处理(查询订单支付信息以及显示等)
 | ||
|       act
 | ||
|         .getLuckdrawDetail({
 | ||
|           pkBaseId: this.luckydrawData.pkBaseId,
 | ||
|           payNum: this.luckydrawData.payNum,
 | ||
|         })
 | ||
|         .then(res => {
 | ||
|           if (res.code == 200) {
 | ||
|             this.orderData.orderAmount = res.data.toBePaidMoney
 | ||
|             this.payDetail = res.data
 | ||
|             // this.downTime()
 | ||
|           }
 | ||
|         })
 | ||
|     },
 | ||
|     closewxPopup() {
 | ||
|       this.wxPopup = false
 | ||
|       this.$refs.qrCodeUrlWx.innerHTML = ''
 | ||
|       clearInterval(payStatus)
 | ||
|     },
 | ||
|     // 绑定银行卡
 | ||
|     bindBank(val) {
 | ||
|       uni.navigateTo({
 | ||
|         url: '/pages/pay/bindBank?bank=' + val,
 | ||
|       })
 | ||
|     },
 | ||
| 
 | ||
|     selPayRadio(val, e) {
 | ||
|       if (e) {
 | ||
|         e.stopPropagation()
 | ||
|       }
 | ||
|       this.whatPay = val
 | ||
|     },
 | ||
|     closePw() {
 | ||
|       this.isPw = false
 | ||
|     },
 | ||
|     successClose() {
 | ||
|       uni.redirectTo({
 | ||
|         url: '/pages/mine/order/index',
 | ||
|       })
 | ||
|     },
 | ||
|     payPw() {
 | ||
|       let obj = {
 | ||
|         pkBaseId: this.objTree.pkBaseId,
 | ||
|         pkTreeRule: this.objTree.pkTreeRule,
 | ||
|         shopQuantity: this.objTree.quantity,
 | ||
|         payPwd: this.codeValue,
 | ||
|       }
 | ||
|       api.shoppingTree(obj).then(res => {
 | ||
|         if (res.code == 200) {
 | ||
|           uni.showToast({
 | ||
|             title: res.msg,
 | ||
|             icon: 'none',
 | ||
|             duration: 1500,
 | ||
|           })
 | ||
|           this.isPw = false
 | ||
|           setTimeout(() => {
 | ||
|             uni.switchTab({ url: '/pages/index/index' })
 | ||
|           }, 1500)
 | ||
|         } else {
 | ||
|           uni.showToast({
 | ||
|             title: res.msg,
 | ||
|             icon: 'none',
 | ||
|             duration: 1500,
 | ||
|           })
 | ||
|         }
 | ||
|       })
 | ||
|     },
 | ||
|     quickPay(cz) {
 | ||
|       this.isPw = true
 | ||
|     },
 | ||
|     scanPayBfWx(val) {
 | ||
|       let params
 | ||
|       if (this.isRecharge) {
 | ||
|         params = {
 | ||
|           businessType: 3, //订单类型充值
 | ||
|           businessCode: this.orderCode,
 | ||
|           payChannel: val,
 | ||
|           payType: 2,
 | ||
|         }
 | ||
|       } else {
 | ||
|         params = {
 | ||
|           businessType: this.businessType, //订单类型充值
 | ||
|           businessCode: this.orderCode,
 | ||
|           payChannel: val,
 | ||
|           payType: 2,
 | ||
|         }
 | ||
|       }
 | ||
|       api.unifiedorder(params).then(res => {
 | ||
|         this.wxPopup = true
 | ||
|         this.$nextTick(() => {
 | ||
|           new QRCode(
 | ||
|             this.$refs.qrCodeUrlWx,
 | ||
|             {
 | ||
|               width: 280,
 | ||
|               height: 280,
 | ||
|               text: res.data,
 | ||
|               colorDark: '#000000',
 | ||
|               colorLight: '#ffffff',
 | ||
|               correctLevel: QRCode.CorrectLevel.Q,
 | ||
|               textAlign: 'center',
 | ||
|             },
 | ||
|             1000
 | ||
|           )
 | ||
|         })
 | ||
|       })
 | ||
|       this.checkPayStatus(params)
 | ||
|     },
 | ||
|     change(e) {
 | ||
|       this.activeNames = e
 | ||
|     },
 | ||
|     close(e) {
 | ||
|       if (e == 1) {
 | ||
|         this.activeNames = 2
 | ||
|       } else {
 | ||
|         this.activeNames = 1
 | ||
|       }
 | ||
|     },
 | ||
|     getPayConfig() {
 | ||
|       api.payConfig().then(res => {
 | ||
|         this.payList = res.data
 | ||
|       })
 | ||
|     },
 | ||
|     getBankList() {
 | ||
|       api.jdBankList().then(res => {
 | ||
|         this.jdList = res.data
 | ||
|       })
 | ||
|       // api.hfBankList().then((res) => {
 | ||
|       //     this.hfList = res.data
 | ||
|       // })
 | ||
|       this.$nextTick(() => {
 | ||
|         this.$refs.collapse.init()
 | ||
|       })
 | ||
|       this.$forceUpdate()
 | ||
|     },
 | ||
|     getOrderInfo() {
 | ||
|       api
 | ||
|         .orderInfo({
 | ||
|           specialArea: this.specialArea,
 | ||
|           orderCode: this.orderCode,
 | ||
|         })
 | ||
|         .then(res => {
 | ||
|           this.orderData = res.data
 | ||
|           this.downTime()
 | ||
|         })
 | ||
|     },
 | ||
|     downTime() {
 | ||
|       let that = this
 | ||
|       this.clockTime = setInterval(() => {
 | ||
|         if (that.orderData.payTime && that.orderData.payTime > 0) {
 | ||
|           that.countDown = this.getTime(this.orderData.payTime--)
 | ||
|         } else {
 | ||
|           that.countDown = '00:00:00'
 | ||
|         }
 | ||
|       }, 1000)
 | ||
|     },
 | ||
|     getSpendInfo() {
 | ||
|       api
 | ||
|         .spendDetails({
 | ||
|           specialArea: this.specialArea,
 | ||
|           orderCode: this.orderCode,
 | ||
|         })
 | ||
|         .then(res => {
 | ||
|           // this.payDetail = res.data
 | ||
|           this.$set(this, 'payDetail', res.data)
 | ||
|           this.$nextTick(() => {
 | ||
|             this.$refs.collapse.init()
 | ||
|           })
 | ||
|           this.$forceUpdate()
 | ||
|         })
 | ||
|     },
 | ||
|     reset() {
 | ||
|       this.$store.dispatch('GetInfo').then(res => {
 | ||
|         uni.reLaunch({
 | ||
|           url: '/pages/index/index',
 | ||
|         })
 | ||
|       })
 | ||
|     },
 | ||
|     // 查询订单状态
 | ||
|     checkPayStatus(data) {
 | ||
|       let that = this
 | ||
|       // 定时器
 | ||
|       payStatus = setInterval(() => {
 | ||
|         if (that.sucPay == 1) {
 | ||
|           // 清除定时器
 | ||
|           clearInterval(payStatus)
 | ||
|           this.wxPopup = false
 | ||
|           this.showSucce = true
 | ||
|         } else {
 | ||
|           api.payStatus(data).then(res => {
 | ||
|             that.sucPay = res.data
 | ||
|           })
 | ||
|         }
 | ||
|       }, 2000)
 | ||
|     },
 | ||
|     getTime(time) {
 | ||
|       // 转换为式分秒
 | ||
|       let h = parseInt((time / 60 / 60) % 24)
 | ||
|       h = h < 10 ? '0' + h : h
 | ||
|       let m = parseInt((time / 60) % 60)
 | ||
|       m = m < 10 ? '0' + m : m
 | ||
|       let s = parseInt(time % 60)
 | ||
|       s = s < 10 ? '0' + s : s
 | ||
|       // 作为返回值返回
 | ||
|       return h + ':' + m + ':' + s
 | ||
|     },
 | ||
|   },
 | ||
| }
 | ||
| </script>
 | ||
| 
 | ||
| <style lang="scss" scoped>
 | ||
| .content {
 | ||
|   background: #f9f9f9;
 | ||
|   min-height: calc(100vh - 44px);
 | ||
| }
 | ||
| 
 | ||
| .index_header {
 | ||
|   background: #f9f9f9;
 | ||
|   height: 330rpx;
 | ||
| }
 | ||
| 
 | ||
| .contxt {
 | ||
|   margin-top: -220rpx;
 | ||
|   padding: 0 26rpx;
 | ||
|   padding-bottom: 300rpx;
 | ||
|   height: 75vh;
 | ||
| }
 | ||
| 
 | ||
| .tit {
 | ||
|   font-size: 24px;
 | ||
|   font-family:
 | ||
|     PingFang SC-Semibold,
 | ||
|     PingFang SC;
 | ||
|   font-weight: 600;
 | ||
|   text-align: center;
 | ||
|   color: #333333;
 | ||
|   margin-bottom: 20rpx;
 | ||
| }
 | ||
| 
 | ||
| .tit1 {
 | ||
|   font-size: 24px;
 | ||
|   font-family:
 | ||
|     PingFang SC-Semibold,
 | ||
|     PingFang SC;
 | ||
|   font-weight: 600;
 | ||
|   color: #e02b26;
 | ||
|   text-align: center;
 | ||
|   margin-bottom: 20rpx;
 | ||
| }
 | ||
| 
 | ||
| .tit2 {
 | ||
|   font-size: 11px;
 | ||
|   font-family:
 | ||
|     PingFang SC-Regular,
 | ||
|     PingFang SC;
 | ||
|   font-weight: 400;
 | ||
|   color: #666666;
 | ||
|   display: flex;
 | ||
|   justify-content: center;
 | ||
|   align-items: center;
 | ||
| }
 | ||
| 
 | ||
| .tit3 {
 | ||
|   font-size: 14px;
 | ||
|   font-weight: 400;
 | ||
|   color: #f33030;
 | ||
|   margin: 0 5px;
 | ||
| }
 | ||
| 
 | ||
| .kuang {
 | ||
|   margin-top: 20rpx; // padding: 20rpx;
 | ||
|   background: #fff;
 | ||
|   box-shadow: 0px 2px 10px 0px rgba(204, 204, 204, 0.5);
 | ||
|   border-radius: 10px 10px 10px 10px;
 | ||
| }
 | ||
| 
 | ||
| .pf {
 | ||
|   display: flex;
 | ||
|   align-items: center;
 | ||
|   font-size: 12px;
 | ||
|   font-family:
 | ||
|     PingFang SC-Semibold,
 | ||
|     PingFang SC;
 | ||
|   font-weight: 600;
 | ||
|   color: #333333;
 | ||
|   img {
 | ||
|     width: 20px;
 | ||
|     height: 20px;
 | ||
|     margin-right: 10px;
 | ||
|   }
 | ||
| }
 | ||
| 
 | ||
| ::v-deep .u-radio-group {
 | ||
|   flex: none;
 | ||
| }
 | ||
| 
 | ||
| .flex_ac {
 | ||
|   display: flex;
 | ||
|   align-items: center;
 | ||
|   width: 100%;
 | ||
|   justify-content: space-between;
 | ||
|   border-bottom: 1px solid rgba(0, 0, 0, 0.1);
 | ||
|   padding: 18rpx 0;
 | ||
| }
 | ||
| 
 | ||
| .flex_ac1 {
 | ||
|   display: flex;
 | ||
|   flex-direction: column; // align-items: center;
 | ||
|   width: 100%;
 | ||
|   justify-content: space-between;
 | ||
|   border-bottom: 1px solid rgba(0, 0, 0, 0.1);
 | ||
|   padding: 18rpx 0;
 | ||
| }
 | ||
| 
 | ||
| .flex_ac_i {
 | ||
|   display: flex;
 | ||
|   align-items: center;
 | ||
|   font-size: 12px;
 | ||
|   font-family:
 | ||
|     PingFang SC-Regular,
 | ||
|     PingFang SC;
 | ||
|   font-weight: 400;
 | ||
|   color: #333333;
 | ||
|   img {
 | ||
|     width: 16px;
 | ||
|     height: 16px;
 | ||
|     margin-right: 20rpx;
 | ||
|   }
 | ||
| }
 | ||
| 
 | ||
| ::v-deep .u-collapse-item__content__text {
 | ||
|   padding: 0px 15px;
 | ||
| }
 | ||
| 
 | ||
| .pad {
 | ||
|   width: 100%;
 | ||
|   display: flex;
 | ||
|   flex-direction: column;
 | ||
| }
 | ||
| 
 | ||
| .pay_flax {
 | ||
|   display: flex;
 | ||
|   align-items: center;
 | ||
|   margin-top: 15px;
 | ||
|   font-size: 12px;
 | ||
|   font-weight: 400;
 | ||
|   color: #666666;
 | ||
|   cursor: pointer;
 | ||
| }
 | ||
| 
 | ||
| .flax_i {
 | ||
|   flex: 1;
 | ||
|   margin-left: 36rpx;
 | ||
| }
 | ||
| 
 | ||
| .flex_bet {
 | ||
|   justify-content: space-between;
 | ||
| }
 | ||
| 
 | ||
| .img1 {
 | ||
|   width: 16px;
 | ||
|   height: 16px;
 | ||
|   margin-right: 10px;
 | ||
| }
 | ||
| 
 | ||
| .footer_f {
 | ||
|   position: fixed;
 | ||
|   bottom: 0;
 | ||
|   width: 100%;
 | ||
|   z-index: 10;
 | ||
|   box-shadow: 0px -2px 20px 0px rgba(204, 204, 204, 0.5);
 | ||
| }
 | ||
| 
 | ||
| .footer {
 | ||
|   display: flex;
 | ||
|   justify-content: space-between;
 | ||
|   padding: 20rpx 24rpx 40rpx 20rpx;
 | ||
|   background: #fff;
 | ||
|   .footer_l {
 | ||
|   }
 | ||
|   .footer_r {
 | ||
|     flex: 1;
 | ||
|     display: flex;
 | ||
|     align-items: center;
 | ||
|     font-size: 20rpx;
 | ||
|     font-weight: 500;
 | ||
|     color: #333333;
 | ||
|   }
 | ||
| }
 | ||
| 
 | ||
| ::v-deep .u-popup__content {
 | ||
|   width: 80%;
 | ||
| }
 | ||
| 
 | ||
| .t_tit {
 | ||
|   text-align: center;
 | ||
|   margin-top: 20px;
 | ||
| }
 | ||
| 
 | ||
| .c_tit {
 | ||
|   margin-bottom: 20px;
 | ||
| }
 | ||
| 
 | ||
| .box {
 | ||
|   padding: 40px;
 | ||
|   text-align: center;
 | ||
| }
 | ||
| 
 | ||
| .uBtn {
 | ||
|   margin-top: 20px;
 | ||
| }
 | ||
| 
 | ||
| .pay_code {
 | ||
|   text-align: center;
 | ||
|   margin-top: 20px;
 | ||
|   padding: 20rpx;
 | ||
|   .qrcodeWx {
 | ||
|   }
 | ||
| }
 | ||
| 
 | ||
| .qrcode {
 | ||
|   display: inline-block;
 | ||
|   img {
 | ||
|     width: 132px;
 | ||
|     height: 132px;
 | ||
|     background-color: #fff; //设置白色背景色
 | ||
|     padding: 6px; // 利用padding的特性,挤出白边
 | ||
|     box-sizing: border-box;
 | ||
|   }
 | ||
| }
 | ||
| 
 | ||
| .lan {
 | ||
|   display: flex;
 | ||
|   align-items: center;
 | ||
|   justify-content: space-between;
 | ||
|   color: #666;
 | ||
|   font-size: 12px;
 | ||
|   font-family:
 | ||
|     PingFang SC-Semibold,
 | ||
|     PingFang SC;
 | ||
|   font-weight: 600;
 | ||
|   color: #999;
 | ||
| }
 | ||
| 
 | ||
| .tTit {
 | ||
|   font-size: 12px;
 | ||
|   font-family:
 | ||
|     PingFang SC-Semibold,
 | ||
|     PingFang SC;
 | ||
|   font-weight: 600;
 | ||
|   color: #666;
 | ||
| }
 | ||
| </style>
 |