From 91cc1c09b056ffd630fd4b699cda3d63e18b1ff6 Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Tue, 28 Oct 2025 17:00:42 +0800
Subject: [PATCH] feat:我的页面资源更换，及部分样式调整
---
src/static/images/user/info.png | 0
src/pages/user/index.vue | 384 ++++++++++++++++++++++++++++--------------------------
src/static/images/user/password.png | 0
src/static/images/user/logo1.png | 0
src/static/images/user/logo2.png | 0
5 files changed, 200 insertions(+), 184 deletions(-)
diff --git a/src/pages/user/index.vue b/src/pages/user/index.vue
index 3ffa1a2..07a9282 100644
--- a/src/pages/user/index.vue
+++ b/src/pages/user/index.vue
@@ -1,209 +1,225 @@
<!-- 我的 -->
<template>
- <view class="page-wrap">
-
- <view class="flex items-center pb-30rpx pl-30rpx pr-20rpx">
- <view class="mr-20rpx">
- <u-avatar :src="user.avatar" size="70" />
- </view>
- <view class="flex-1">
- <view class="userName">{{ userStore?.userInfo?.nick_name }}</view>
- <view class="departs">
- <img src="/src/static/images/user/mobile.svg" alt="" />
- <span>{{user.deptName}}</span>
- </view>
- </view>
- <view class="rightLogo">
- <img src="/src/static/images/user/logo2.svg" alt="" />
- </view>
- </view>
- <view class="personalInformation">
- <div class="message">
- <div class="messagebox">个人信息</div>
- <div class="editInfo" @click="handelEdit(1)">点击编辑
- <img src="/src/static/images/user/rightBtn.svg" alt="" /></div>
- </div>
- <div class="passwordBox">
- <div class="messagebox">修改密码</div>
- <div class="editInfo" @click="handelEdit(2)">点击编辑 <img src="/src/static/images/user/rightBtn.svg" alt="" /></div>
- </div>
- </view>
+ <view class="page-wrap">
- <view class="mt-20rpx">
- <div class="goOutStyle" @click="logOut">退出登录</div>
- </view>
- <div class="bottomLogo"><img src="/src/static/images/user/logo1.svg" alt="" /></div>
- </view>
+ <view class="flex items-center pb-30rpx pl-30rpx pr-20rpx">
+ <view class="mr-20rpx">
+ <u-avatar :src="user.avatar" size="70" />
+ </view>
+ <view class="flex-1">
+ <view class="userName">{{ userStore?.userInfo?.nick_name }}</view>
+ <view class="departs">
+ <img src="/src/static/images/user/mobile.svg" alt="" />
+ <span>{{user.deptName}}</span>
+ </view>
+ </view>
+ <view class="rightLogo">
+ <img src="/src/static/images/user/logo2.png" alt="" />
+ </view>
+ </view>
+ <view class="personalInformation">
+ <div class="message">
+ <div class="messagebox">个人信息</div>
+ <div class="editInfo" @click="handelEdit(1)">点击编辑
+ <img src="/src/static/images/user/rightBtn.svg" alt="" />
+ </div>
+ </div>
+ <div class="passwordBox">
+ <div class="messagebox">修改密码</div>
+ <div class="editInfo" @click="handelEdit(2)">点击编辑 <img src="/src/static/images/user/rightBtn.svg" alt="" />
+ </div>
+ </div>
+ </view>
+
+ <view class="mt-20rpx">
+ <div class="goOutStyle" @click="logOut">退出登录</div>
+ </view>
+ <div class="bottomLogo"><img src="/src/static/images/user/logo1.png" alt="" /></div>
+ </view>
</template>
<script setup>
- import {
- getUserInfo,
- updateInfo,
- updatePassword
- } from '@/api/user/index.js';
- import {
- useClipboard
- } from "@/hooks";
- import {
- useUserStore
- } from "@/store/index.js";
- import {
- onShow
- } from "@dcloudio/uni-app";
- import {
- getDeviceRegionApi
- } from "@/api/map.js";
+ import {
+ getUserInfo,
+ updateInfo,
+ updatePassword
+ } from '@/api/user/index.js';
+ import {
+ useClipboard
+ } from "@/hooks";
+ import {
+ useUserStore
+ } from "@/store/index.js";
+ import {
+ onShow
+ } from "@dcloudio/uni-app";
+ import {
+ getDeviceRegionApi
+ } from "@/api/map.js";
- const {
- setClipboardData,
- getClipboardData
- } = useClipboard();
- const userStore = useUserStore();
- const user = ref('')
- const getUserInfoData = () => {
- getUserInfo().then(res => {
- user.value = res.data.data;
- });
- };
+ const {
+ setClipboardData,
+ getClipboardData
+ } = useClipboard();
+ const userStore = useUserStore();
+ const user = ref('')
+ const getUserInfoData = () => {
+ getUserInfo().then(res => {
+ user.value = res.data.data;
+ });
+ };
- function logOut() {
- userStore.setUserInfo(null)
- uni.redirectTo({
- url: '/pages/login/index'
- })
- }
+ function logOut() {
+ userStore.setUserInfo(null)
+ uni.redirectTo({
+ url: '/pages/login/index'
+ })
+ }
- function getDeviceRegion() {
- getDeviceRegionApi().then(res => {
- // console.log(res.data.data, '用户设备')
- })
- }
- const handelEdit=(val)=>{
+ function getDeviceRegion() {
+ getDeviceRegionApi().then(res => {
+ // console.log(res.data.data, '用户设备')
+ })
+ }
+ const handelEdit = (val) => {
- if(val === 1){
- uni.navigateTo({
- url: `/subPackages/userDetail/infos/index`
- });
- }else {
- uni.navigateTo({
- url: `/subPackages/userDetail/password/index`
- });
- }
+ if (val === 1) {
+ uni.navigateTo({
+ url: `/subPackages/userDetail/infos/index`
+ });
+ } else {
+ uni.navigateTo({
+ url: `/subPackages/userDetail/password/index`
+ });
+ }
- }
- // 登录鉴权，微信小程序端点击tabbar的底层逻辑不触发uni.switchTab，需要在页面onShow生命周期中校验权限
- onShow(async () => {
- getDeviceRegion()
- getUserInfoData()
- uni.setTabBarItem({
- index: 2, // Tab 的索引（从0开始）
- visible: false,
- })
- uni.setTabBarItem({
- index: 3, // Tab
- visible: true,
- });
- });
+ }
+ // 登录鉴权，微信小程序端点击tabbar的底层逻辑不触发uni.switchTab，需要在页面onShow生命周期中校验权限
+ onShow(async () => {
+ getDeviceRegion()
+ getUserInfoData()
+ uni.setTabBarItem({
+ index: 2, // Tab 的索引（从0开始）
+ visible: false,
+ })
+ uni.setTabBarItem({
+ index: 3, // Tab
+ visible: true,
+ });
+ });
</script>
<style scoped lang="scss">
- .page-wrap {
- width: 100%;
- height: 100%;
-
- padding-top: 88rpx;
- }
+ .page-wrap {
+ width: 100%;
+ height: 100%;
- .userName {
- font-family: "Source Han Sans CN";
- font-weight: 500;
- font-size: 36rpx;
- color: #000000;
+ padding-top: 88rpx;
+ }
- }
+ .userName {
+ font-weight: 700;
+ font-size: 36rpx;
+ color: #000000;
- .departs {
- display: flex;
- align-items: center;
- margin-top: 22rpx;
+ }
- span {
- font-family: "Source Han Sans CN";
- font-weight: 400;
- font-size: 28rpx;
- color: rgba(0, 0, 0, 0.6);
- margin-left: 6rpx;
- }
- }
+ .departs {
+ display: flex;
+ align-items: center;
+ margin-top: 22rpx;
- .rightLogo {
- width: 200rpx;
- height: 80rpx;
- }
- .bottomLogo {
- position: absolute;
- bottom:50rpx;
- left: 0;
- right: 0;
- margin: 0 auto;
- text-align: center;
- }
- .goOutStyle {
- width: 590rpx;
- height: 76rpx;
- background: #1D6FE9;
- border-radius: 40rpx;
- font-family: "Source Han Sans CN";
- font-weight: 400;
- font-size: 28rpx;
- color: #FFFFFF;
- text-align: center;
- line-height: 76rpx;
- margin: auto;
- margin-top: 114rpx;
- }
+ span {
+ font-family: "Source Han Sans CN";
+ font-weight: 400;
+ font-size: 28rpx;
+ color: rgba(0, 0, 0, 0.6);
+ margin-left: 6rpx;
+ }
+ }
- .personalInformation {
- display: flex;
- justify-content: space-between;
- padding: 0 24rpx;
+ .rightLogo {
+ width: 200rpx;
+ height: 80rpx;
- .message,
- .passwordBox {
- width: 340rpx;
- height:160rpx;
- .messagebox{
- padding: 20rpx 24rpx;
- font-family: "Source Han Sans CN";
- font-weight: 500;
- font-size: 28rpx;
- color: #000000;
- }
- .editInfo {
- padding: 20rpx 24rpx;
- color: rgba(0, 0, 0, 0.5);
- font-family: "Source Han Sans CN";
- font-weight: 400;
- font-size: 24rpx;
- display: flex;
- align-items: center;
- img{
- width: 28rpx;
- height: 28rpx;
- }
- }
- }
+ img {
+ width: 100%;
+ height: 100%;
+ }
+ }
- .message {
- background: url('/src/static/images/user/info.svg') no-repeat center;
- background-size: 100% 100%;
+ .bottomLogo {
+ position: absolute;
+ bottom: 50rpx;
+ left: 0;
+ right: 0;
+ margin: 0 auto;
+ text-align: center;
- }
+ img {
+ width: 128rpx;
+ height: 52rpx;
+ }
+ }
- .passwordBox {
- background: url('/src/static/images/user/password.svg') no-repeat center;
- background-size: 100% 100%;
+ .goOutStyle {
+ width: 590rpx;
+ height: 76rpx;
+ background: #1D6FE9;
+ border-radius: 40rpx;
+ font-family: "Source Han Sans CN";
+ font-weight: 400;
+ font-size: 28rpx;
+ color: #FFFFFF;
+ text-align: center;
+ line-height: 76rpx;
+ margin: auto;
+ margin-top: 114rpx;
+ }
- }
- }
+ .personalInformation {
+ display: flex;
+ justify-content: space-between;
+ padding: 0 24rpx;
+
+ .message,
+ .passwordBox {
+ width: 340rpx;
+ height: 160rpx;
+
+ .messagebox {
+ padding: 20rpx 24rpx;
+ font-family: "Source Han Sans CN";
+ font-weight: 500;
+ font-size: 28rpx;
+ color: #000000;
+ }
+
+ .editInfo {
+ padding: 20rpx 24rpx;
+ color: rgba(0, 0, 0, 0.5);
+ font-family: "Source Han Sans CN";
+ font-weight: 400;
+ font-size: 24rpx;
+ display: flex;
+ align-items: center;
+
+ img {
+ width: 28rpx;
+ height: 28rpx;
+ }
+ }
+ }
+
+ .message {
+ background: url('/src/static/images/user/info.png') no-repeat center;
+ background-size: 100% 100%;
+
+ }
+
+ .passwordBox {
+ background: url('/src/static/images/user/password.png') no-repeat center;
+ background-size: 100% 100%;
+
+ }
+ }
</style>
diff --git a/src/static/images/user/info.png b/src/static/images/user/info.png
new file mode 100644
index 0000000..5fb503e
--- /dev/null
+++ b/src/static/images/user/info.png
Binary files differ
diff --git a/src/static/images/user/logo1.png b/src/static/images/user/logo1.png
new file mode 100644
index 0000000..08b5a6d
--- /dev/null
+++ b/src/static/images/user/logo1.png
Binary files differ
diff --git a/src/static/images/user/logo2.png b/src/static/images/user/logo2.png
new file mode 100644
index 0000000..90f48e1
--- /dev/null
+++ b/src/static/images/user/logo2.png
Binary files differ
diff --git a/src/static/images/user/password.png b/src/static/images/user/password.png
new file mode 100644
index 0000000..595d5ff
--- /dev/null
+++ b/src/static/images/user/password.png
Binary files differ
--
Gitblit v1.9.3