<template>
|
<view class="cu-page cu-page--home">
|
<view class="cu-hero">
|
<view class="cu-profile-bar">
|
<view class="cu-profile-bar__info">
|
<view class="cu-avatar">{{ customerInitial }}</view>
|
<view>
|
<view class="cu-hero__hi">{{ greeting }}</view>
|
<view class="cu-hero__name">{{ displayName }}</view>
|
</view>
|
</view>
|
<view class="cu-profile-actions">
|
<view class="cu-profile-action cu-profile-action--pill" @click="logout">
|
<u-icon name="minus-circle-fill" color="#ffffff" size="18" />
|
<text class="cu-profile-action__text">退出</text>
|
</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-service-panel">
|
<view class="cu-section-head">
|
<view class="cu-section-head__bar" />
|
<text class="cu-section-head__title">专属服务</text>
|
</view>
|
<view class="cu-service-grid">
|
<view class="cu-service-card cu-service-card--electric" @click="go('/pages/customer/electricity/list')">
|
<view class="cu-service-card__top">
|
<view class="cu-service-card__icon">
|
<u-icon name="coupon-fill" color="#fa8c16" size="26" />
|
</view>
|
<text class="cu-service-card__arrow">›</text>
|
</view>
|
<text class="cu-service-card__label">交电费</text>
|
<text class="cu-service-card__desc">电表 / 空调充值</text>
|
</view>
|
<view class="cu-service-card cu-service-card--contract" @click="go('/pages/customer/contract/list')">
|
<view class="cu-service-card__top">
|
<view class="cu-service-card__icon">
|
<u-icon name="file-text-fill" color="#40a9ff" size="26" />
|
</view>
|
<text class="cu-service-card__arrow">›</text>
|
</view>
|
<text class="cu-service-card__label">查合同</text>
|
<text class="cu-service-card__desc">租赁合同查询</text>
|
</view>
|
<view class="cu-service-card cu-service-card--bill" @click="go('/pages/customer/bill/list')">
|
<view class="cu-service-card__top">
|
<view class="cu-service-card__icon">
|
<u-icon name="red-packet-fill" color="#597ef7" size="26" />
|
</view>
|
<text class="cu-service-card__arrow">›</text>
|
</view>
|
<text class="cu-service-card__label">查账单</text>
|
<text class="cu-service-card__desc">在线缴费</text>
|
</view>
|
<view class="cu-service-card cu-service-card--record" @click="go('/pages/customer/recharge/record')">
|
<view class="cu-service-card__top">
|
<view class="cu-service-card__icon">
|
<u-icon name="list" color="#9254de" size="26" />
|
</view>
|
<text class="cu-service-card__arrow">›</text>
|
</view>
|
<text class="cu-service-card__label">充值记录</text>
|
<text class="cu-service-card__desc">历史充值明细</text>
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import { customerBanners, customerHome, customerLogout } from '@/api'
|
import { switchRole } 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 '晚上好'
|
},
|
displayName () {
|
return this.home.displayName || this.home.customerName || '商户用户'
|
},
|
customerInitial () {
|
const name = (this.home.memberName || 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 }) },
|
logout () { switchRole(customerLogout) }
|
}
|
}
|
</script>
|
