<template>
  <business-page-layout title="我的" :show-tabbar="true" :tab-index="1">
    <view class="mine-container">
      <view class="profile-panel">
        <view class="avatar-circle"><text>{{ avatarText }}</text></view>
        <view class="user-info">
          <text class="user-name">{{ displayName }}</text>
          <view class="role-badge"><text class="role-text">{{ roleText }}</text></view>
        </view>
      </view>
      <view class="setting-panel">
        <wx-bind-entry ref="wxBindEntry" />
        <account-switch-entry />
      </view>
      <view class="logout-wrap">
        <u-button
          :throttle-time="0"
          shape="circle"
          :custom-style="{ backgroundColor: '#6ACDBB', color: '#fff', height: '96rpx' }"
          @click="logout"
        >退出登录</u-button>
      </view>
    </view>
  </business-page-layout>
</template>

<script>
/**
 * 业务员「我的」：对齐医生（菜单卡 + 绿色退出），保留绑定微信
 */
import BusinessPageLayout from '@/subPackages/sub_salesperson/components/business-page-layout.vue'
import AccountSwitchEntry from '@/components/account-switch/account-switch-entry.vue'
import WxBindEntry from '@/components/wx-bind-entry/wx-bind-entry.vue'
import { getSalespersonContext } from '@/subPackages/sub_salesperson/common/context.js'
import { clearLoginStorage } from '@/utils/loginSession.js'

export default {
  components: { BusinessPageLayout, AccountSwitchEntry, WxBindEntry },
  provide() { return { businessContext: getSalespersonContext() } },
  data() { return { displayName: '', roleText: '业务员' } },
  computed: { avatarText() { return (this.displayName || '业').slice(0, 1) } },
  onShow() {
    const user = uni.getStorageSync('salesperson_user') || {}
    this.displayName = user.nick_name || '业务员'
    this.roleText = (user.roles && user.roles.name) || '业务员'
    if (this.$refs.wxBindEntry) this.$refs.wxBindEntry.refresh()
  },
  methods: {
    logout() {
      uni.showModal({
        title: '提示', content: '确定退出登录？', confirmColor: '#6ACDBB',
        success: (res) => {
          if (!res.confirm) return
          clearLoginStorage()
          uni.reLaunch({ url: '/pages/login/index' })
        },
      })
    },
  },
}
</script>

<style lang="scss" scoped>
.mine-container { min-height: 100vh; background: #F5F7F8; padding-bottom: 60rpx; }
.profile-panel { display: flex; align-items: center; background: #fff; padding: 60rpx 40rpx; margin-bottom: 24rpx; }
.avatar-circle {
  width: 128rpx; height: 128rpx; border-radius: 50%;
  background: linear-gradient(135deg, #6acdbb, #4db6a8); color: #fff; font-size: 52rpx;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.user-info { margin-left: 32rpx; }
.user-name { font-size: 40rpx; font-weight: 700; display: block; margin-bottom: 12rpx; }
.role-badge { display: inline-block; background: rgba(106,205,187,.1); padding: 4rpx 16rpx; border-radius: 8rpx; }
.role-text { font-size: 22rpx; color: #4db6a8; }
.setting-panel { background: #fff; padding: 8rpx 40rpx 16rpx; margin-bottom: 24rpx; }
.logout-wrap { padding: 0 40rpx 32rpx; }
</style>
