新增智能电表、空调管理

doum

2026-06-18 93de43267e1663031fe5dc2f5ae40d128a182a76

 h5/pages/customer/electricity/recharge.vue

@@ -1,15 +1,31 @@
<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 class="cu-page cu-page--with-footer cu-page--with-fab">
    <view v-if="device" class="cu-recharge-hero cu-recharge-hero--electric">
      <view class="cu-recharge-hero__gradient">
        <view class="cu-recharge-hero__balance-block">
          <text class="cu-recharge-hero__balance-label">当前账户余额（元）</text>
          <text :class="['cu-recharge-hero__balance-value', balanceTone ? 'cu-recharge-hero__balance-value--' + balanceTone : '']">{{ balanceText }}</text>
        </view>
      </view>
      <view class="cu-line">房间：{{ device.roomInfo }}</view>
      <view class="cu-line">户号：{{ device.meterAccountNo }}</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 class="cu-recharge-hero__panel">
        <view class="cu-recharge-hero__device">
          <view class="cu-recharge-hero__icon cu-recharge-hero__icon--electric">⚡</view>
          <view class="cu-recharge-hero__device-main">
            <view class="cu-recharge-hero__title-row">
              <view class="cu-recharge-hero__title-wrap">
                <text class="cu-recharge-hero__title">{{ device.deviceName || '电表' }}</text>
              </view>
              <text :class="['cu-recharge-hero__status', device.statusCode === 1 ? 'cu-recharge-hero__status--ok' : 'cu-recharge-hero__status--bad']">{{ device.statusText || '未知' }}</text>
            </view>
            <text class="cu-recharge-hero__sub">{{ device.roomInfo || '暂无房间信息' }}</text>
          </view>
        </view>
        <view class="cu-recharge-hero__meta">
          <view class="cu-recharge-hero__meta-item">
            <text class="cu-recharge-hero__meta-label">电表地址</text>
            <text class="cu-recharge-hero__meta-value">{{ device.meterAddress || '-' }}</text>
          </view>
        </view>
      </view>
    </view>

@@ -36,12 +52,14 @@
    <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 { customerDeviceDetail, customerPayCreate } from '@/api'
import { invokeWxPay } from '@/utils/wxpay.js'
import { getBalanceTone } from '@/utils/utils.js'
export default {
  data () {
    return {
@@ -53,6 +71,16 @@
    }
  },
  onLoad (q) { this.deviceId = q.id; this.load() },
  computed: {
    balanceText () {
      if (!this.device || this.device.balance === null || this.device.balance === undefined || this.device.balance === '') return '-'
      const n = Number(this.device.balance)
      return Number.isNaN(n) ? this.device.balance : n.toFixed(2)
    },
    balanceTone () {
      return getBalanceTone(this.device && this.device.balance)
    }
  },
  methods: {
    load () {
      customerDeviceDetail({ deviceType: 0, deviceId: this.deviceId }).then(res => { this.device = res.data })