<template>
|
<view class="cu-page cu-page--with-footer cu-page--with-fab">
|
<view class="cu-device-summary">
|
<view class="cu-device-summary__title">商户空调统一账户</view>
|
<view class="cu-device-summary__balance">
|
<view class="cu-device-summary__balance-label">当前空调电费余额</view>
|
<view :class="['cu-device-summary__balance-value', balanceTone ? 'cu-device-summary__balance-value--' + balanceTone : '']">{{ balanceText }}</view>
|
</view>
|
</view>
|
|
<view class="cu-pay-amount-box">
|
<view class="cu-pay-amount-box__label">充值金额</view>
|
<view class="cu-pay-amount-box__input-wrap">
|
<text class="cu-pay-amount-box__symbol">¥</text>
|
<input v-model="amount" class="cu-pay-amount-box__input" type="digit" placeholder="0.00" />
|
</view>
|
<view class="cu-quick-amounts">
|
<text
|
v-for="q in quickAmounts"
|
:key="q"
|
:class="['cu-quick-amount', String(amount) === String(q) ? 'cu-quick-amount--active' : '']"
|
@click="amount = String(q)"
|
>{{ q }}元</text>
|
</view>
|
<view class="cu-pay-amount-box__remark">
|
<text class="cu-pay-amount-box__remark-label">备注</text>
|
<input v-model="remark" placeholder="选填" />
|
</view>
|
</view>
|
|
<view class="cu-page-footer">
|
<view class="cu-btn cu-btn--primary" @click="submit">确认充值{{ amount ? ' ¥' + amount : '' }}</view>
|
</view>
|
<cu-workbench-fab />
|
</view>
|
</template>
|
|
<script>
|
import { customerHome, customerPayCreate } from '@/api'
|
import { invokeWxPay } from '@/utils/wxpay.js'
|
import { getBalanceTone } from '@/utils/utils.js'
|
|
export default {
|
data () {
|
return {
|
gsBalance: null,
|
amount: '',
|
remark: '',
|
quickAmounts: [50, 100, 200, 500]
|
}
|
},
|
computed: {
|
balanceText () {
|
if (this.gsBalance === null || this.gsBalance === undefined || this.gsBalance === '') return '-'
|
const n = Number(this.gsBalance)
|
return Number.isNaN(n) ? this.gsBalance : n.toFixed(2)
|
},
|
balanceTone () {
|
return getBalanceTone(this.gsBalance)
|
}
|
},
|
onShow () { this.load() },
|
methods: {
|
load () {
|
customerHome().then(res => {
|
const gs = res.data && res.data.gsConfig
|
this.gsBalance = gs ? gs.leftMoney : null
|
})
|
},
|
submit () {
|
if (!this.amount) return uni.showToast({ title: '请输入金额', icon: 'none' })
|
customerPayCreate({
|
orderType: 1,
|
amount: Number(this.amount),
|
remark: this.remark,
|
openid: this.$store.state.openId
|
}).then(async res => {
|
try {
|
await invokeWxPay(res.data)
|
uni.redirectTo({ url: `/pages/customer/pay/result?success=1&orderNo=${res.data.orderNo}&type=recharge` })
|
} catch (e) {
|
uni.redirectTo({ url: `/pages/customer/pay/result?success=0&orderNo=${res.data.orderNo}&type=recharge` })
|
}
|
})
|
}
|
}
|
}
|
</script>
|