From 8e5fb21a2bf621291c1ceee396c01e3d42553511 Mon Sep 17 00:00:00 2001
From: web <candymxq888@outlook.com>
Date: 星期四, 03 七月 2025 17:23:23 +0800
Subject: [PATCH] 修改首页，添加记录
---
pages/user/index.vue | 81 +++++++++++++++++++++++++++-------------
1 files changed, 54 insertions(+), 27 deletions(-)
diff --git a/pages/user/index.vue b/pages/user/index.vue
index 81d14c5..3bdda58 100644
--- a/pages/user/index.vue
+++ b/pages/user/index.vue
@@ -1,23 +1,30 @@
<template>
<view class="user" :style="{paddingTop:topHeight + 'rpx'}">
<view class="content">
- <view class="userInfo">
+ <view class="user" @click="setUser">
<view class="userImg">
- <image src="/static/images/login/wx.png" mode="widthFix"></image>
+ <image :src="userInfo?.headImg" mode="widthFix"></image>
</view>
<view class="info">
- <view class="name">张三</view>
- <view class="balance">余额：233.5</view>
+ <text class="name">{{userInfo?.nickName}}</text>
</view>
</view>
<view class="typeList">
<view class="typeItem">
- <view class="name">充值记录</view>
- <uni-icons type="right" size="20"></uni-icons>
+ <view class="name">剩余水量</view>
+ <view class="val">{{userInfo?.balance}}m³</view>
+ </view>
+ <view class="typeItem">
+ <view class="name">总购水量</view>
+ <view class="val">{{userInfo?.sumBuyCount}}m³</view>
+ </view>
+ <view class="typeItem">
+ <view class="name">累计水量</view>
+ <view class="val">{{userInfo?.sumUseCount}}m³</view>
</view>
</view>
<view class="loginOut">
- <button type="primary" plain>退出登录</button>
+ <button class="btn" type="primary" plain @click="loginOut">退出登录</button>
</view>
</view>
</view>
@@ -27,43 +34,63 @@
import { onMounted, ref } from "vue";
const topHeight = ref(0)
+ const userInfo = ref()
// 获取状态栏高度
- function getTopHeight(){
+ const getTopHeight = () => {
if(uni.getMenuButtonBoundingClientRect){
topHeight.value = uni.getMenuButtonBoundingClientRect().bottom * 2
}
}
+ const setUser = () => {
+ uni.navigateTo({
+ url: '/pages/userSet/index'
+ })
+ }
+
+ // 退出登录
+ const loginOut = () => {
+ uni.showModal({
+ title: '温馨提示',
+ content: '确认退出登录？',
+ success: (res) => {
+ if(res.confirm){
+ uni.removeStorageSync('openId')
+ uni.removeStorageSync('token')
+ uni.navigateTo({
+ url: '/pages/login/index'
+ })
+ }
+ }
+ })
+ }
+
onMounted(() => {
getTopHeight()
+ userInfo.value = JSON.parse(uni.getStorageSync('userInfo'))
})
</script>
<style lang="scss" scoped>
.content{
- padding: 20rpx;
- .userInfo{
+ padding: 0 32rpx;
+ .user{
+ height: 100rpx;
display: flex;
align-items: center;
- padding: 40rpx;
- background: linear-gradient(90deg, #CCCCCC, #CCFFFF);
- border-radius: 20rpx;
.userImg{
- flex-shrink: 0;
- width: 100rpx;
- height: 100rpx;
- margin-right: 40rpx;
+ width: 80rpx;
+ height: 80rpx;
image{
width: 100%;
- border-radius: 10rpx;
+ border-radius: 50%;
}
}
.info{
- flex-grow: 1;
- font-size: 36rpx;
- .balance{
- font-weight: bold;
+ margin-left: 30rpx;
+ .name{
+ vertical-align: text-bottom;
}
}
}
@@ -78,11 +105,11 @@
}
}
.loginOut{
- margin-top: 400rpx;
- // button{
- // color: $uni-base-color;
- // border-color: $uni-base-color;
- // }
+ margin-top: 200rpx;
+ .btn{
+ color: $uni-base-color;
+ border-color: $uni-base-color;
+ }
}
}
</style>
\ No newline at end of file
--
Gitblit v1.9.3