From 2c86a8bd60deed0dd0e044bad6fb83f75d19a332 Mon Sep 17 00:00:00 2001
From: wlzboy <66905212@qq.com>
Date: 星期日, 26 十月 2025 15:05:50 +0800
Subject: [PATCH] Merge branch 'feature-task'
---
app/pages/mine/index.vue | 339 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 339 insertions(+), 0 deletions(-)
diff --git a/app/pages/mine/index.vue b/app/pages/mine/index.vue
new file mode 100644
index 0000000..e6ccd74
--- /dev/null
+++ b/app/pages/mine/index.vue
@@ -0,0 +1,339 @@
+<template>
+ <view class="mine-container">
+ <!--椤堕儴涓汉淇℃伅鏍�-->
+ <view class="header-section">
+ <view class="flex padding justify-between">
+ <view class="flex align-center">
+ <view v-if="!avatar" class="cu-avatar xl round bg-white">
+ <view class="iconfont icon-people text-gray icon"></view>
+ </view>
+ <image v-if="avatar" @click="handleToAvatar" :src="avatar" class="cu-avatar xl round" mode="widthFix">
+ </image>
+ <view v-if="!name" @click="handleToLogin" class="login-tip">
+ 鐐瑰嚮鐧诲綍
+ </view>
+ <view v-if="name" @click="handleToInfo" class="user-info">
+ <view class="u_title">
+ {{ name }}
+ </view>
+ </view>
+ </view>
+ <view @click="handleToInfo" class="flex align-center">
+ <text>涓汉淇℃伅</text>
+ <view class="iconfont icon-right"></view>
+ </view>
+ </view>
+ </view>
+
+ <scroll-view class="content-section" scroll-y="true">
+ <!-- 鐢ㄦ埛淇℃伅灞曠ず -->
+ <view class="user-info-section">
+ <view class="info-item">
+ <view class="info-label">鏄电О锛�</view>
+ <view class="info-value">{{ name || '鏈櫥褰�' }}</view>
+ </view>
+ <view class="info-item">
+ <view class="info-label">鎵嬫満鍙风爜锛�</view>
+ <view class="info-value">{{ phonenumber || '鏈粦瀹�' }}</view>
+ </view>
+ <view class="info-item">
+ <view class="info-label">鎵�灞炲垎鍏徃锛�</view>
+ <view class="info-value">{{ deptName || '鏈缃�' }}</view>
+ </view>
+ <view class="info-item">
+ <view class="info-label">缁戝畾杞﹁締锛�</view>
+ <view class="info-value">{{ boundVehicle || '鏈粦瀹�' }}</view>
+ </view>
+ <view class="info-item">
+ <view class="info-label">App鐗堟湰鍙凤細</view>
+ <view class="info-value">{{ version || '1.0.0' }}</view>
+ </view>
+ </view>
+
+ <view class="menu-list">
+ <!-- 缁戝畾/瑙ｇ粦杞﹁締 -->
+ <view class="list-cell list-cell-arrow" @click="handleVehicleBinding">
+ <view class="menu-item-box">
+ <view class="iconfont icon-car menu-icon"></view>
+ <view>{{ boundVehicle && boundVehicle !== '鏈粦瀹�' ? '鏇存崲杞﹁締' : '缁戝畾杞﹁締' }}</view>
+ </view>
+ </view>
+
+ <!-- 閫�鍑虹櫥褰� -->
+ <view class="list-cell list-cell-arrow" @click="handleLogout">
+ <view class="menu-item-box">
+ <view class="iconfont icon-logout menu-icon text-red"></view>
+ <view class="text-red">閫�鍑虹櫥褰�</view>
+ </view>
+ </view>
+ </view>
+ </scroll-view>
+ </view>
+</template>
+
+<script>
+ import storage from '@/utils/storage'
+ import { getUserProfile } from "@/api/system/user"
+ import { getUserBoundVehicle, unbindVehicleFromUser } from '@/api/vehicle'
+ import { getSystemInfo } from '@/utils/common'
+
+ export default {
+ data() {
+ return {
+ name: this.$store.state.user.nickName,
+ phonenumber: '',
+ deptName: '', // 鎵�灞炲垎鍏徃
+ boundVehicle: '', // 缁戝畾鐨勮溅杈嗕俊鎭�
+ boundVehicleId: null, // 缁戝畾鐨勮溅杈咺D
+ version: getApp().globalData.config.appInfo.version
+ }
+ },
+ computed: {
+ avatar() {
+ return this.$store.state.user.avatar
+ },
+ windowHeight() {
+ return getSystemInfo().windowHeight - 50
+ }
+ },
+ onLoad() {
+ this.getUserInfo()
+ },
+ onShow() {
+ // 姣忔鏄剧ず椤甸潰鏃跺埛鏂扮敤鎴蜂俊鎭�
+ this.getUserInfo()
+ },
+ methods: {
+ // 鑾峰彇鐢ㄦ埛淇℃伅
+ getUserInfo() {
+ const userId = this.$store.state.user.userId
+
+ // 鑾峰彇鐢ㄦ埛鍩烘湰淇℃伅
+ getUserProfile().then(response => {
+ const user = response.data
+ this.name = user.nickName || user.userName // 浼樺厛浣跨敤鏄电О
+ this.phonenumber = user.phonenumber
+ this.deptName = user.dept ? user.dept.deptName : '鏈缃�'
+ }).catch(() => {
+ // 鑾峰彇鐢ㄦ埛淇℃伅澶辫触鏃朵娇鐢ㄩ粯璁ゅ��
+ this.name = this.$store.state.user.nickName || '鏈櫥褰�'
+ this.phonenumber = '鏈粦瀹�'
+ this.deptName = '鏈缃�'
+ })
+
+ // 鑾峰彇鐢ㄦ埛缁戝畾鐨勮溅杈嗕俊鎭�
+ if (userId) {
+ getUserBoundVehicle(userId).then(response => {
+ if (response.code === 200 && response.data) {
+ const vehicle = response.data
+ this.boundVehicle = vehicle.vehicleNumber || '鏈煡杞︾墝'
+ this.boundVehicleId = vehicle.vehicleId
+ } else {
+ this.boundVehicle = '鏈粦瀹�'
+ this.boundVehicleId = null
+ }
+ }).catch(() => {
+ this.boundVehicle = '鏈粦瀹�'
+ this.boundVehicleId = null
+ })
+ }
+ },
+
+ // 澶勭悊杞﹁締缁戝畾鎿嶄綔
+ handleVehicleBinding() {
+ this.$tab.navigateTo('/pages/bind-vehicle')
+ },
+
+ handleToInfo() {
+ this.$tab.navigateTo('/pages/mine/info/index')
+ },
+ handleToEditInfo() {
+ this.$tab.navigateTo('/pages/mine/info/edit')
+ },
+ handleToSetting() {
+ this.$tab.navigateTo('/pages/mine/setting/index')
+ },
+ handleToLogin() {
+ this.$tab.reLaunch('/pages/login')
+ },
+ handleToAvatar() {
+ this.$tab.navigateTo('/pages/mine/avatar/index')
+ },
+ handleLogout() {
+ this.$modal.confirm('纭畾閫�鍑虹櫥褰曞悧锛�').then(() => {
+ this.$store.dispatch('LogOut').then(() => {
+ this.$tab.reLaunch('/pages/login')
+ })
+ })
+ }
+ }
+ }
+</script>
+
+<style lang="scss">
+ page {
+ background-color: #f5f6f7;
+ }
+
+ .mine-container {
+ width: 100%;
+ height: 100vh;
+ display: flex;
+ flex-direction: column;
+ // 闅愯棌婊氬姩鏉′絾淇濇寔婊氬姩鍔熻兘
+ ::-webkit-scrollbar {
+ display: none;
+ width: 0 !important;
+ height: 0 !important;
+ background: transparent;
+ }
+
+ // Firefox婊氬姩鏉￠殣钘�
+ * {
+ scrollbar-width: none; /* Firefox */
+ }
+
+ // IE/Edge婊氬姩鏉￠殣钘�
+ * {
+ -ms-overflow-style: none; /* IE 10+ */
+ }
+
+ .header-section {
+ padding: 15px 15px 45px 15px;
+ background-color: #3c96f3;
+ color: white;
+ flex-shrink: 0; // 闃叉鏀剁缉
+
+ .login-tip {
+ font-size: 18px;
+ margin-left: 10px;
+ }
+
+ .cu-avatar {
+ border: 2px solid #eaeaea;
+
+ .icon {
+ font-size: 40px;
+ }
+ }
+
+ .user-info {
+ margin-left: 15px;
+
+ .u_title {
+ font-size: 18px;
+ line-height: 30px;
+ }
+ }
+ }
+
+ .content-section {
+ flex: 1;
+ position: relative;
+ top: -50px;
+ // 闅愯棌婊氬姩鏉′絾淇濇寔婊氬姩鍔熻兘
+ ::-webkit-scrollbar {
+ display: none;
+ width: 0 !important;
+ height: 0 !important;
+ background: transparent;
+ }
+
+ // Firefox婊氬姩鏉￠殣钘�
+ * {
+ scrollbar-width: none; /* Firefox */
+ }
+
+ // IE/Edge婊氬姩鏉￠殣钘�
+ * {
+ -ms-overflow-style: none; /* IE 10+ */
+ }
+
+ // 鐢ㄦ埛淇℃伅灞曠ず鍖哄煙
+ .user-info-section {
+ background-color: white;
+ border-radius: 8px;
+ padding: 20rpx 30rpx;
+ margin: 15rpx;
+ box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+
+ .info-item {
+ display: flex;
+ padding: 15rpx 0;
+ border-bottom: 1rpx solid #f0f0f0;
+
+ &:last-child {
+ border-bottom: none;
+ }
+
+ .info-label {
+ font-size: 28rpx;
+ color: #666;
+ width: 180rpx;
+ flex-shrink: 0;
+ }
+
+ .info-value {
+ font-size: 28rpx;
+ color: #333;
+ flex: 1;
+ }
+ }
+ }
+
+ // 鑿滃崟鍒楄〃鏍峰紡
+ .menu-list {
+ background-color: white;
+ border-radius: 8px;
+ margin: 15rpx;
+ overflow: hidden;
+
+ .list-cell {
+ padding: 30rpx;
+ border-bottom: 1rpx solid #f0f0f0;
+ cursor: pointer;
+ transition: background-color 0.2s;
+
+ &:last-child {
+ border-bottom: none;
+ }
+
+ &:active {
+ background-color: #f5f5f5;
+ }
+
+ .menu-item-box {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+
+ .menu-icon {
+ font-size: 36rpx;
+ margin-right: 20rpx;
+ }
+
+ view {
+ flex: 1;
+ font-size: 32rpx;
+ color: #333;
+ }
+
+ .text-red {
+ color: #ff4d4f;
+ }
+ }
+
+ &.list-cell-arrow .menu-item-box::after {
+ content: '';
+ width: 16rpx;
+ height: 16rpx;
+ border-top: 2rpx solid #999;
+ border-right: 2rpx solid #999;
+ transform: rotate(45deg);
+ margin-left: 20rpx;
+ }
+ }
+ }
+ }
+ }
+</style>
\ No newline at end of file
--
Gitblit v1.9.1