<template>
|
<view class="cu-page cu-page--with-footer">
|
<view class="cu-device-summary" v-if="device">
|
<view class="cu-row cu-row--between">
|
<text class="cu-name">{{ device.deviceName }}</text>
|
<text class="cu-status cu-status--ok">{{ device.statusText }}</text>
|
</view>
|
<view class="cu-line">房间：{{ device.roomInfo }}</view>
|
<view class="cu-device-summary__balance">
|
<view class="cu-device-summary__balance-label">当前账户余额</view>
|
<view class="cu-device-summary__balance-value">{{ device.balance }}</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>
|
</view>
|
</template>
|
|
<script>
|
import { customerDeviceDetail, customerPayCreate } from '@/api'
|
import { invokeWxPay } from '@/utils/wxpay.js'
|
export default {
|
data () {
|
return {
|
deviceId: null,
|
device: null,
|
amount: '',
|
remark: '',
|
quickAmounts: [50, 100, 200, 500]
|
}
|
},
|
onLoad (q) { this.deviceId = q.id; this.load() },
|
methods: {
|
load () {
|
customerDeviceDetail({ deviceType: 1, deviceId: this.deviceId }).then(res => { this.device = res.data })
|
},
|
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>
|
