Merge branch 'master' of http://139.186.142.91:10010/r/productDev/gtzxingli...

rk

2026-04-28 a59ff44b2eaa7020f0529632d9ec064c4dc38e27

 app/pages/mine/mine.vue

@@ -1,20 +1,72 @@
<template>
   <view class="index">
      <view class="index_list">
         <view class="index_list_item">
            <view class="index_list_item_info">
               <text>SHE事件上报</text>
               <text>FAC/NM</text>
            </view>
            <image src="/static/bg_a.png" mode="widthFix"></image>
   <view class="mine-page">
      <view class="mine-page__nav" :style="{ paddingTop: statusBarHeight + 'px' }">
         <view class="mine-page__nav-inner">
            <text class="mine-page__nav-title">我的</text>
         </view>
         <view class="index_list_item">
            <view class="index_list_item_info">
               <text>跌绊滑风险上报</text>
               <text>TAG</text>
      </view>

      <view class="mine-page__body" :style="bodyStyle">
         <view class="mine-page__content">
            <view class="mine-page__profile">
               <image class="mine-page__avatar" :src="userInfo.imgurl || '/static/image/ic_pic@2x.png'" mode="aspectFill"></image>
               <view class="mine-page__profile-info">
                  <view class="mine-page__name-row">
                     <text class="mine-page__name">{{ userInfo.name }}</text>
                     <view v-if="userInfo.driverLevel" class="mine-page__level-tag">
                        <image src="/static/image/ic_jiangpai@2x.png" mode="widthFix" class="mine-page__level-dot"></image>
                        <text class="mine-page__level-text">{{ getDriverLevelText(userInfo.driverLevel) }}</text>
                     </view>
                  </view>
                  <text class="mine-page__phone">{{ userInfo.telephone || '' }} （{{ userInfo.carCode || '' }} ）</text>
               </view>
            </view>
            <image src="/static/bg_b.png" mode="widthFix"></image>

            <view class="income-card">
               <view class="income-card__left">
                  <text class="income-card__label">累计佣金(元)</text>
                  <text class="income-card__value">{{ currentProfile.totalIncome }}</text>
               </view>
               <view class="income-card__right">
                  <view class="income-card__stat">
                     <text class="income-card__stat-label">待结算(元)：</text>
                     <text class="income-card__stat-value">{{ currentProfile.pendingIncome }}</text>
                  </view>
                  <view class="income-card__stat">
                     <text class="income-card__stat-label">订单总数：</text>
                     <text class="income-card__stat-value">{{ currentProfile.orderCount }}</text>
                  </view>
               </view>
            </view>

            <view class="menu-panel">
               <view v-for="item in menuList" :key="item.title" class="menu-panel__item" @click="jump(item)">
                  <text class="menu-panel__title">{{ item.title }}</text>
                  <view class="menu-panel__right">
                     <template v-if="item.key === 'wallet'">
                        <text class="menu-panel__sub menu-panel__sub--muted">余额：{{ currentProfile.walletBalance }}</text>
                     </template>
                     <template v-if="item.key === 'driver'">
                        <text v-if="userInfo.auditStatus === 99" class="menu-panel__sub menu-panel__sub--danger">完成认证后即可接单</text>
                        <text v-else-if="userInfo.auditStatus === 0" class="menu-panel__sub menu-panel__sub--danger">审核中</text>
                        <text v-if="userInfo.auditStatus === 2" class="menu-panel__sub menu-panel__sub--danger">已驳回</text>
                        <text v-else-if="userInfo.auditStatus === 3" class="menu-panel__sub menu-panel__sub--primary">已认证</text>
                     </template>
                     <template v-else-if="item.key === 'setting'">
                        <text class="menu-panel__sub menu-panel__sub--muted">当前版本V1.0.0</text>
                     </template>
                     <view class="menu-panel__arrow">
                        <image src="/static/image/mine_ar2@2x.png" mode="widthFix"></image>
                     </view>
                  </view>
               </view>
            </view>
            <view style="width: 100%; height: 5rpx;"></view>
         </view>
      </view>

      <view class="mine-page__footer">
         <button class="mine-page__logout" hover-class="mine-page__logout--hover" @click.stop="handleLogout">退出登录</button>
      </view>
   </view>
</template>
@@ -22,89 +74,373 @@
<script>
   import { mapState } from 'vuex'
   export default {
      computed: {
         ...mapState(['userInfo'])
      },
      data() {
         return {
            title: 'Hello'
            statusBarHeight: 0,
            navHeight: 0,
            useVerifiedState: true,
            menuList: [
               { key: 'wallet', title: '我的钱包' },
               { key: 'driver', title: '司机认证' },
               { key: 'agreementPrivacy', title: '司机隐私政策', type: 'driverPrivacyPolicy' },
               { key: 'agreementErrandLuggage', title: '跑腿车主行李寄存须知', type: 'errandLuggageStorageNotice' },
               { key: 'agreementErrandService', title: '跑腿达人服务协议', type: 'errandServiceAgreement' },
               { key: 'agreementErrandRisk', title: '跑腿达人风险承诺', type: 'errandRiskCommitment' },
               { key: 'agreementOwnerLuggage', title: '平台车主行李寄存须知', type: 'ownerLuggageStorageNotice' },
               { key: 'agreementOwnerService', title: '平台车主服务协议', type: 'ownerServiceAgreement' },
               { key: 'agreementOwnerRisk', title: '平台车主风险承诺', type: 'ownerRiskCommitment' },
               { key: 'help', title: '帮助与客服' },
               { key: 'setting', title: '设置' }
            ],
            profileStates: {
               guest: {
                  name: '汤子新',
                  phone: '18166565677',
                  levelTag: '',
                  totalIncome: '-',
                  pendingIncome: '-',
                  orderCount: '-',
                  walletBalance: '¥0',
                  verified: false
               },
               verified: {
                  name: '汤子新',
                  phone: '18166565677（皖BD23189）',
                  levelTag: 'S级',
                  totalIncome: '-',
                  pendingIncome: '-',
                  orderCount: '-',
                  walletBalance: '¥0',
                  verified: true
               }
            }
         }
      },
      computed: {
         ...mapState(['userInfo']),
         currentProfile() {
            return this.useVerifiedState ? this.profileStates.verified : this.profileStates.guest
         },
         bodyStyle() {
            return {
               marginTop: this.navHeight + 'px'
            }
         }
      },
      onLoad() {

         const systemInfo = uni.getSystemInfoSync()
         this.statusBarHeight = systemInfo.statusBarHeight || 0
         this.navHeight = this.statusBarHeight + uni.upx2px(88)
      },
      onShow() {
         this.getStats()
         this.getUserInfo()
      },
      methods: {
         jump(type) {
            switch (type) {
               case 1:
         getUserInfo() {
            this.$u.api.verifyDetail().then(user => {
               if (user.code === 200) {
                  this.$store.commit('setUserInfo', user.data);
               }
            })
         },
         getStats() {
            this.$u.api.stats().then(res => {
               if (res.code === 200 && res.data) {
                  this.profileStates.verified.totalIncome = (res.data.totalCommission / 100).toFixed(2)
                  this.profileStates.verified.pendingIncome = (res.data.pendingCommission / 100).toFixed(2)
                  this.profileStates.verified.orderCount = res.data.totalOrderCount || 0
                  this.profileStates.verified.walletBalance = '¥' + (res.data.balance / 100).toFixed(2)
               }
            })
         },
         getDriverLevelText(level) {
            const map = { 5: 'S', 4: 'A', 3: 'B', 2: 'C', 1: 'D' }
            return map[level] ? map[level] + '级' : ''
         },
         jump(item) {
            console.log(item)
            if (item.key === 'setting') {
               uni.navigateTo({
                  url: '/pages/settings/settings'
               })
            } else if (item.key === 'driver') {
               if (this.userInfo.auditStatus === 99) {
                  uni.navigateTo({
                     url: '/pages/reporting_she/reporting_she'
                     url: '/pages/driver-certification/driver-certification'
                  })
                  break;
               case 2:
               } else {
                  uni.navigateTo({
                     url: '/pages/riskReporting/riskReporting'
                     url: '/pages/certification-details/certification-details'
                  })
                  break;
               case 3:
                  uni.navigateTo({
                     url: '/pages/report_dca/report_dca'
                  })
                  break;
               }
            } else if (item.key === 'wallet') {
               uni.navigateTo({
                  url: '/pages/wallet/wallet'
               })
            } else if (item.key && item.key.startsWith('agreement')) {
               uni.navigateTo({
                  url: `/pages/agreement/agreement?type=${item.type}&title=${encodeURIComponent(item.title)}`
               })
            }
         },
         handleLogout() {
            uni.showToast({ title: '退出中...', icon: 'loading' })
            this.$u.api.logOutDriver().then(res => {
               console.log('logout res', res)
               if (res.code === 200) {
                  this.$store.commit('clearAll')
                  uni.reLaunch({
                     url: '/pages/login/login'
                  })
               }
            }).catch(err => {
               console.log('logout err', err)
            })
         }
      }
   }
</script>

<style lang="scss" scoped>
   .index {
      width: 100vw;
      padding: 30rpx;
   .mine-page {
      background: #f6f8fc;

      &__nav {
         position: fixed;
         left: 0;
         top: 0;
         right: 0;
         z-index: 10;
         background: #ffffff;
      }

      &__nav-inner {
         height: 88rpx;
         display: flex;
         align-items: center;
         padding: 0 26rpx;
      }

      &__nav-title {
         font-size: 36rpx;
         font-weight: 700;
         color: #2b3139;
      }

      &__body {
         box-sizing: border-box;
         // overflow: hidden;
      }

      &__content {
         padding: 28rpx 20rpx 0;
      }

      &__profile {
         display: flex;
         align-items: center;
         gap: 20rpx;
         padding: 8rpx 0 24rpx;
      }

      &__avatar {
         width: 92rpx;
         height: 92rpx;
         border-radius: 50%;
         background: #e8f1ff;
         flex-shrink: 0;
      }

      &__profile-info {
         flex: 1;
         min-width: 0;
      }

      &__name-row {
         display: flex;
         align-items: center;
         gap: 12rpx;
      }

      &__name {
         font-size: 40rpx;
         font-weight: 700;
         color: #2b3139;
      }

      &__level-tag {
         display: flex;
         align-items: center;
         gap: 6rpx;
         padding: 4rpx 10rpx;
         border-radius: 999rpx;
         background: linear-gradient(180deg, #ff9e68 0%, #ff7d34 100%);
      }

      &__level-dot {
         width: 20rpx;
         height: 24rpx;
      }
		
      &__level-text {
         font-size: 22rpx;
         font-weight: 700;
         color: #ffffff;
      }

      &__phone {
         display: block;
         margin-top: 10rpx;
         font-size: 28rpx;
         color: #8f96a3;
      }

      &__footer {
         position: fixed;
         left: 0;
         right: 0;
         bottom: 60rpx;
         // padding: 16rpx 0 calc(env(safe-area-inset-bottom) + 20rpx);
         display: flex;
         justify-content: center;
      }

      &__logout {
         width: 200rpx;
         height: 72rpx;
         line-height: 72rpx;	
         border-radius: 36rpx;
         background: #ffffff;
         border: 1rpx solid #999999;
         font-weight: 400;
         font-size: 28rpx;
         color: #333333;
         padding: 0;

         &::after {
            border: 0;
         }

         &--hover {
            opacity: 0.92;
         }
      }
   }

   .income-card {
      position: relative;
      display: flex;
      justify-content: space-between;
      gap: 20rpx;
      padding: 10rpx 30rpx 40rpx 30rpx;
      box-sizing: border-box;
      height: calc(100vh - 44px - 50px);
      background: linear-gradient( 180deg, #B5D2FF 0%, #FFFFFF 100%);
      .index_list {
         width: 100%;
      background-image: url('../../static/image/ming_bg@2x.png');
      background-repeat: no-repeat;
      background-size: 100% 100%;
      overflow: hidden;

      &__left,
      &__right {
         position: relative;
         z-index: 1;
      }

      &__left {
         flex: 1;
      }

      &__label,
      &__stat-label,
      &__stat-value {
         font-size: 24rpx;
         color: rgba(255, 255, 255, 0.78);
      }

      &__value {
         display: block;
         margin-top: 20rpx;
         font-size: 52rpx;
         line-height: 1;
         font-weight: normal;
         color: #ffffff;
      }

      &__right {
         display: flex;
         flex-direction: column;
         margin-top: 12rpx;
         .index_list_item {
         align-items: flex-end;
         justify-content: flex-end;
         gap: 18rpx;
         padding-top: 12rpx;
      }

      &__stat {
         display: flex;
         align-items: center;
         gap: 10rpx;
      }
   }

   .menu-panel {
      margin-top: 20rpx;
      margin-bottom: 200rpx;
      border-radius: 22rpx;
      background: #ffffff;
      overflow: hidden;

      &__item {
         display: flex;
         justify-content: space-between;
         align-items: center;
         height: 102rpx;
         padding: 0 24rpx;
         box-sizing: border-box;
         border-bottom: 1rpx solid #eef1f5;

         &:last-child {
            border-bottom: 0;
         }
      }

      &__title {
         font-size: 34rpx;
         font-weight: 600;
         color: #2b3139;
      }

      &__right {
         display: flex;
         align-items: flex-start;
         gap: 10rpx;
      }

      &__sub {
         font-size: 26rpx;
         white-space: nowrap;

         &--muted {
            color: #b2b8c1;
         }

         &--danger {
            color: #FA1010;
         }

         &--warning {
            color: #ff7b38;
         }

         &--primary {
            color: #106EFA;
         }
      }

      &__arrow {
         width: 16rpx;
         height: 28rpx;
         image {
            width: 100%;
            height: 200rpx;
            margin-bottom: 30rpx;
            position: relative;
            .index_list_item_info {
               width: 100%;
               height: 100%;
               padding: 0 48rpx;
               box-sizing: border-box;
               display: flex;
               justify-content: center;
               flex-direction: column;
               position: relative;
               z-index: 99;
               text {
                  &:nth-child(1) {
                     font-weight: bold;
                     font-size: 34rpx;
                     color: #FFFFFF;
                  }
                  &:nth-child(2) {
                     font-weight: 400;
                     font-size: 26rpx;
                     color: rgba(255,255,255,0.6);
                     margin-top: 10rpx;
                  }
               }
            }
            image {
               width: 100%;
               height: 100%;
               position: absolute;
               top: 0;
               left: 0;
            }
         }
      }
   }