wlzboy
2025-10-26 1626d13ec8b1a63676e63cf95c5004c4118da3b3
app/pages/mine/index.vue
@@ -14,7 +14,7 @@
          </view>
          <view v-if="name" @click="handleToInfo" class="user-info">
            <view class="u_title">
              用户名:{{ name }}
              {{ name }}
            </view>
          </view>
        </view>
@@ -26,34 +26,19 @@
    </view>
    <scroll-view class="content-section" scroll-y="true">
      <view class="mine-actions grid col-4 text-center">
        <view class="action-item" @click="handleJiaoLiuQun">
          <view class="iconfont icon-friendfill text-pink icon"></view>
          <text class="text">交流群</text>
        </view>
        <view class="action-item" @click="handleBuilding">
          <view class="iconfont icon-service text-blue icon"></view>
          <text class="text">在线客服</text>
        </view>
        <view class="action-item" @click="handleBuilding">
          <view class="iconfont icon-community text-mauve icon"></view>
          <text class="text">反馈社区</text>
        </view>
        <view class="action-item" @click="handleBuilding">
          <view class="iconfont icon-dianzan text-green icon"></view>
          <text class="text">点赞我们</text>
        </view>
      </view>
      <!-- 用户信息展示 -->
      <view class="user-info-section">
        <view class="info-item">
          <view class="info-label">用户名:</view>
          <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>
@@ -63,39 +48,22 @@
          <view class="info-label">App版本号:</view>
          <view class="info-value">{{ version || '1.0.0' }}</view>
        </view>
        <!-- 绑定/解绑车辆操作 -->
        <view class="vehicle-actions" v-if="boundVehicle && boundVehicle !== '未绑定'">
          <button class="unbind-btn" @click="unbindVehicle">取消绑定车辆</button>
        </view>
        <view class="vehicle-actions" v-else>
          <button class="bind-btn" @click="goToBindVehicle">绑定车辆</button>
        </view>
      </view>
      <view class="menu-list">
        <view class="list-cell list-cell-arrow" @click="handleToEditInfo">
        <!-- 绑定/解绑车辆 -->
        <view class="list-cell list-cell-arrow" @click="handleVehicleBinding">
          <view class="menu-item-box">
            <view class="iconfont icon-user menu-icon"></view>
            <view>编辑资料</view>
            <view class="iconfont icon-car menu-icon"></view>
            <view>{{ boundVehicle && boundVehicle !== '未绑定' ? '更换车辆' : '绑定车辆' }}</view>
          </view>
        </view>
        <view class="list-cell list-cell-arrow" @click="handleHelp">
        <!-- 退出登录 -->
        <view class="list-cell list-cell-arrow" @click="handleLogout">
          <view class="menu-item-box">
            <view class="iconfont icon-help menu-icon"></view>
            <view>常见问题</view>
          </view>
        </view>
        <view class="list-cell list-cell-arrow" @click="handleAbout">
          <view class="menu-item-box">
            <view class="iconfont icon-aixin menu-icon"></view>
            <view>关于我们</view>
          </view>
        </view>
        <view class="list-cell list-cell-arrow" @click="handleToSetting">
          <view class="menu-item-box">
            <view class="iconfont icon-setting menu-icon"></view>
            <view>应用设置</view>
            <view class="iconfont icon-logout menu-icon text-red"></view>
            <view class="text-red">退出登录</view>
          </view>
        </view>
      </view>
@@ -107,12 +75,14 @@
  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.name,
        name: this.$store.state.user.nickName,
        phonenumber: '',
        deptName: '', // 所属分公司
        boundVehicle: '', // 绑定的车辆信息
        boundVehicleId: null, // 绑定的车辆ID
        version: getApp().globalData.config.appInfo.version
@@ -123,10 +93,14 @@
        return this.$store.state.user.avatar
      },
      windowHeight() {
        return uni.getSystemInfoSync().windowHeight - 50
        return getSystemInfo().windowHeight - 50
      }
    },
    onLoad() {
      this.getUserInfo()
    },
    onShow() {
      // 每次显示页面时刷新用户信息
      this.getUserInfo()
    },
    methods: {
@@ -137,12 +111,14 @@
        // 获取用户基本信息
        getUserProfile().then(response => {
          const user = response.data
          this.name = user.userName
          this.name = user.nickName || user.userName // 优先使用昵称
          this.phonenumber = user.phonenumber
          this.deptName = user.dept ? user.dept.deptName : '未设置'
        }).catch(() => {
          // 获取用户信息失败时使用默认值
          this.name = this.$store.state.user.name || '未登录'
          this.name = this.$store.state.user.nickName || '未登录'
          this.phonenumber = '未绑定'
          this.deptName = '未设置'
        })
        
        // 获取用户绑定的车辆信息
@@ -163,40 +139,9 @@
        }
      },
      
      // 跳转到绑定车辆页面
      goToBindVehicle() {
      // 处理车辆绑定操作
      handleVehicleBinding() {
        this.$tab.navigateTo('/pages/bind-vehicle')
      },
      // 取消绑定车辆
      unbindVehicle() {
        const userId = this.$store.state.user.userId
        const vehicleId = this.boundVehicleId
        if (!userId || !vehicleId) {
          this.$modal.showToast('无法获取绑定信息')
          return
        }
        this.$modal.confirm(`确认取消绑定车辆 ${this.boundVehicle} 吗?`).then(() => {
          // 调用API取消绑定车辆
          unbindVehicleFromUser(userId, vehicleId).then(response => {
            if (response.code === 200) {
              this.boundVehicle = '未绑定'
              this.boundVehicleId = null
              this.$modal.showToast('取消绑定成功')
              // 更新用户信息
              this.$store.dispatch('GetInfo')
            } else {
              this.$modal.showToast(response.msg || '取消绑定失败')
            }
          }).catch(error => {
            console.error('取消绑定失败:', error)
            this.$modal.showToast('取消绑定失败,请重试')
          })
        }).catch(() => {
          // 用户取消操作
        })
      },
      
      handleToInfo() {
@@ -215,23 +160,11 @@
        this.$tab.navigateTo('/pages/mine/avatar/index')
      },
      handleLogout() {
        this.$modal.confirm('确定注销并退出系统吗?').then(() => {
        this.$modal.confirm('确定退出登录吗?').then(() => {
          this.$store.dispatch('LogOut').then(() => {
            this.$tab.reLaunch('/pages/index')
            this.$tab.reLaunch('/pages/login')
          })
        })
      },
      handleHelp() {
        this.$tab.navigateTo('/pages/mine/help/index')
      },
      handleAbout() {
        this.$tab.navigateTo('/pages/mine/about/index')
      },
      handleJiaoLiuQun() {
        this.$modal.showToast('QQ群:①133713780(满)、②146013835(满)、③189091635')
      },
      handleBuilding() {
        this.$modal.showToast('模块建设中~')
      }
    }
  }
@@ -315,25 +248,6 @@
      * {
        -ms-overflow-style: none; /* IE 10+ */
      }
      .mine-actions {
        margin: 15px 15px;
        padding: 20px 0px;
        border-radius: 8px;
        background-color: white;
        .action-item {
          .icon {
            font-size: 28px;
          }
          .text {
            display: block;
            font-size: 13px;
            margin: 8px 0px;
          }
        }
      }
      
      // 用户信息展示区域
      .user-info-section {
@@ -365,26 +279,58 @@
            flex: 1;
          }
        }
      }
      // 菜单列表样式
      .menu-list {
        background-color: white;
        border-radius: 8px;
        margin: 15rpx;
        overflow: hidden;
        
        .vehicle-actions {
          padding: 30rpx 0 10rpx 0;
          text-align: center;
        .list-cell {
          padding: 30rpx;
          border-bottom: 1rpx solid #f0f0f0;
          cursor: pointer;
          transition: background-color 0.2s;
          
          .bind-btn, .unbind-btn {
            width: 80%;
            height: 80rpx;
            border-radius: 10rpx;
            font-size: 32rpx;
          &:last-child {
            border-bottom: none;
          }
          
          .bind-btn {
            background-color: #007AFF;
            color: white;
          &:active {
            background-color: #f5f5f5;
          }
          
          .unbind-btn {
            background-color: #ff4d4f;
            color: white;
          .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;
          }
        }
      }