| | |
| | | </view> |
| | | <view v-if="name" @click="handleToInfo" class="user-info"> |
| | | <view class="u_title"> |
| | | 用户名:{{ name }} |
| | | {{ name }} |
| | | </view> |
| | | </view> |
| | | </view> |
| | |
| | | </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> |
| | |
| | | <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="handleUserAgreement"> |
| | | |
| | | <!-- 退出登录 --> |
| | | <view class="list-cell list-cell-arrow" @click="handleLogout"> |
| | | <view class="menu-item-box"> |
| | | <view class="iconfont icon-text menu-icon"></view> |
| | | <view>用户服务协议</view> |
| | | </view> |
| | | </view> |
| | | <view class="list-cell list-cell-arrow" @click="handlePrivacyPolicy"> |
| | | <view class="menu-item-box"> |
| | | <view class="iconfont icon-safe menu-icon"></view> |
| | | <view>隐私政策</view> |
| | | </view> |
| | | </view> |
| | | <view class="list-cell list-cell-arrow" @click="handleHelp"> |
| | | <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> |
| | |
| | | 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, // 绑定的车辆ID |
| | | version: getApp().globalData.config.appInfo.version |
| | |
| | | return this.$store.state.user.avatar |
| | | }, |
| | | windowHeight() { |
| | | return uni.getSystemInfoSync().windowHeight - 50 |
| | | return getSystemInfo().windowHeight - 50 |
| | | } |
| | | }, |
| | | onLoad() { |
| | | this.getUserInfo() |
| | | }, |
| | | onShow() { |
| | | // 每次显示页面时刷新用户信息 |
| | | this.getUserInfo() |
| | | }, |
| | | methods: { |
| | |
| | | // 获取用户基本信息 |
| | | 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.nickName || '未登录' |
| | | this.phonenumber = '未绑定' |
| | | this.deptName = '未设置' |
| | | }) |
| | | |
| | | // 获取用户绑定的车辆信息 |
| | |
| | | } |
| | | }, |
| | | |
| | | // 跳转到绑定车辆页面 |
| | | 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() { |
| | |
| | | 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') |
| | | }, |
| | | handleUserAgreement() { |
| | | this.$tab.navigateTo('/pages/mine/user-agreement/index') |
| | | }, |
| | | handlePrivacyPolicy() { |
| | | this.$tab.navigateTo('/pages/mine/privacy-policy/index') |
| | | }, |
| | | handleJiaoLiuQun() { |
| | | this.$modal.showToast('QQ群:①133713780(满)、②146013835(满)、③189091635') |
| | | }, |
| | | handleBuilding() { |
| | | this.$modal.showToast('模块建设中~') |
| | | } |
| | | } |
| | | } |
| | |
| | | * { |
| | | -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 { |
| | |
| | | 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; |
| | | } |
| | | } |
| | | } |