doum
2026-06-17 ea689dd91eaa72425dc01759042c3b4eb2186512
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
<template>
  <view class="cu-page cu-page--home">
    <view class="cu-hero">
      <view class="cu-hero__greet">
        <view class="cu-avatar">{{ customerInitial }}</view>
        <view>
          <view class="cu-hero__hi">{{ greeting }}</view>
          <view class="cu-hero__name">{{ home.customerName || '商户用户' }}</view>
        </view>
      </view>
    </view>
 
    <view class="cu-home-body">
      <view v-if="banners.length" class="cu-banner-wrap">
        <u-swiper :list="banners" keyName="imageUrl" height="160" radius="12" indicator indicatorMode="dot" />
      </view>
 
      <view class="cu-section-title">专属服务</view>
      <view class="cu-service-grid">
        <view class="cu-service-item cu-service-item--electric" @click="go('/pages/customer/electricity/list')">
          <view class="cu-service-item__icon">⚡</view>
          <text class="cu-service-item__label">交电费</text>
          <text class="cu-service-item__desc">电表 / 空调充值</text>
        </view>
        <view class="cu-service-item cu-service-item--contract" @click="go('/pages/customer/contract/list')">
          <view class="cu-service-item__icon">
            <u-icon name="file-text-fill" color="#40a9ff" size="24" />
          </view>
          <text class="cu-service-item__label">查合同</text>
          <text class="cu-service-item__desc">租赁合同查询</text>
        </view>
        <view class="cu-service-item cu-service-item--bill" @click="go('/pages/customer/bill/list')">
          <view class="cu-service-item__icon">💳</view>
          <text class="cu-service-item__label">查账单</text>
          <text class="cu-service-item__desc">在线缴费</text>
        </view>
        <view class="cu-service-item cu-service-item--record" @click="go('/pages/customer/recharge/record')">
          <view class="cu-service-item__icon">📋</view>
          <text class="cu-service-item__label">充值记录</text>
          <text class="cu-service-item__desc">历史充值明细</text>
        </view>
      </view>
 
      <view class="cu-footer-bar">
        <view class="cu-footer-btn cu-footer-btn--primary" @click="onSwitchRole">切换角色</view>
        <view class="cu-footer-btn" @click="logout">退出登录</view>
      </view>
    </view>
  </view>
</template>
 
<script>
import { customerBanners, customerHome } from '@/api'
import { switchRole, goRoleSelect } from '@/utils/roleSwitch.js'
export default {
  data () {
    return { banners: [], home: {} }
  },
  computed: {
    greeting () {
      const h = new Date().getHours()
      if (h < 12) return '早上好'
      if (h < 18) return '下午好'
      return '晚上好'
    },
    customerInitial () {
      const name = (this.home.customerName || '商').trim()
      return name.charAt(0)
    }
  },
  onShow () {
    customerBanners().then(res => {
      this.banners = (res.data || []).map(b => ({ imageUrl: b.imageUrl, title: b.title }))
    })
    customerHome().then(res => { this.home = res.data || {} })
  },
  methods: {
    go (url) { uni.navigateTo({ url }) },
    onSwitchRole () { switchRole() },
    logout () { goRoleSelect() }
  }
}
</script>