OfficeSystem/components/my/My.vue

<template>
  <view class="mine-page">
    <view 
      class="card settings-card"
      v-if="showPrivateSwitch"
    >
      <view class="setting-row">
        <text class="setting-label">私有视角</text>
        <uv-switch v-model="filterSelf" />
      </view>
      <text class="setting-desc">开启后仅展示分配给我的客户和任务数据</text>
    </view>

    <!-- 版本管理 -->
    <view class="card version-card">
      <view class="version-header">
        <text class="version-title">版本管理</text>
      </view>
      
      <view class="version-info">
        <view class="version-item">
          <text class="version-label">当前版本</text>
          <text class="version-value">{{ currentVersion }}</text>
        </view>
        
        <view class="version-item" v-if="latestVersion">
          <text class="version-label">最新版本</text>
          <text class="version-value" :class="{ 'new-version': hasUpdate }">
            {{ latestVersion }}
            <text v-if="hasUpdate" class="update-badge">有新版本</text>
          </text>
        </view>
        <view class="version-item" v-else>
          <text class="version-label">最新版本</text>
          <text class="version-value">未检查</text>
        </view>
      </view>

      <view class="version-actions">
        <uv-button 
          type="primary" 
          :plain="true" 
          size="small"
          @click="checkUpdate"
          :loading="checking"
        >
          {{ checking ? '检查中...' : '检查更新' }}
        </uv-button>
        
        <uv-button 
          v-if="hasUpdate && updateInfo"
          type="error" 
          size="small"
          @click="handleUpdate"
          style="margin-left: 20rpx;"
        >
          立即更新
        </uv-button>
      </view>
    </view>

    <view class="card">

      <uv-button type="error" :plain="true" @click="onLogout" :loading="loading">
        退出登录
      </uv-button>
    </view>
  </view>
</template>

<script setup>
import { ref, computed, onMounted } from 'vue'
import { storeToRefs } from 'pinia'
import { useUserStore } from '@/store/user'
import { logout } from '@/api/user'
import { getCurrentVersion, checkForUpdate, showUpdateDialog, compareVersion } from '@/utils/update'

const loading = ref(false)
const checking = ref(false)
const currentVersion = ref('')
const latestVersion = ref('')
const updateInfo = ref(null)
const hasUpdate = computed(() => {
  if (!latestVersion.value || !currentVersion.value) return false
  return compareVersion(currentVersion.value, latestVersion.value) < 0
})

const userStore = useUserStore()
const { privateView, userInfo } = storeToRefs(userStore)
const filterSelf = computed({
  get: () => privateView.value,
  set: (val) => userStore.setPrivateView(val)
})
const showPrivateSwitch = computed(() =>
  userInfo.value?.roles?.some(r => ['admin', 'sys_admin'].includes(r))
)

// 获取当前版本
onMounted(() => {
  const version = getCurrentVersion()
  currentVersion.value = version.versionName || '未知'
})

// 检查更新
const checkUpdate = async () => {
  if (checking.value) return
  checking.value = true
  
  try {
    const result = await checkForUpdate(true) // 静默检查，不显示提示
    
    if (result && result.hasUpdate) {
      latestVersion.value = result.versionName || ''
      updateInfo.value = result
      uni.showToast({
        title: '发现新版本',
        icon: 'success',
        duration: 2000
      })
    } else {
      latestVersion.value = currentVersion.value
      updateInfo.value = null
      uni.showToast({
        title: '已是最新版本',
        icon: 'success',
        duration: 2000
      })
    }
  } catch (error) {
    console.error('检查更新失败:', error)
    uni.showToast({
      title: '检查更新失败',
      icon: 'none',
      duration: 2000
    })
  } finally {
    checking.value = false
  }
}

// 处理更新
const handleUpdate = () => {
  if (!updateInfo.value || !updateInfo.value.downloadUrl) {
    uni.showToast({
      title: '更新信息无效',
      icon: 'none'
    })
    return
  }
  
  // 显示更新确认对话框，用户确认后会自动下载和安装
  showUpdateDialog(updateInfo.value)
}

const onLogout = async () => {
  if (loading.value) return
  loading.value = true
  try {
    await logout()
  } catch (e) {
    // 忽略错误
  } finally {
    userStore.logout()
    uni.$uv.toast('已退出登录')
    setTimeout(() => {
      uni.reLaunch({ url: '/pages/login/index' })
    }, 200)
    loading.value = false
  }
}
</script>

<style lang="scss" scoped>
.mine-page {

  background-color: #f6f7fb;

  box-sizing: border-box;
}

.card {
  background: #ffffff;
  border-radius: 16rpx;
  padding: 32rpx;
  box-shadow: 0 6rpx 20rpx rgba(0, 0, 0, 0.04);
}

.settings-card {
  margin-bottom: 24rpx;
}

.setting-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.setting-label {
  font-size: 30rpx;
  font-weight: 500;
  color: #111827;
}

.setting-desc {
  margin-top: 14rpx;
  font-size: 24rpx;
  color: #6b7280;
}

.version-card {
  margin-bottom: 24rpx;
}

.version-header {
  margin-bottom: 24rpx;
}

.version-title {
  font-size: 30rpx;
  font-weight: 600;
  color: #111827;
}

.version-info {
  margin-bottom: 24rpx;
}

.version-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16rpx 0;
  border-bottom: 1rpx solid #f3f4f6;
}

.version-item:last-child {
  border-bottom: none;
}

.version-label {
  font-size: 28rpx;
  color: #6b7280;
}

.version-value {
  font-size: 28rpx;
  font-weight: 500;
  color: #111827;
  display: flex;
  align-items: center;
  gap: 12rpx;
}

.version-value.new-version {
  color: #ef4444;
}

.update-badge {
  font-size: 20rpx;
  background: #fee2e2;
  color: #dc2626;
  padding: 4rpx 12rpx;
  border-radius: 12rpx;
  font-weight: normal;
}

.version-actions {
  display: flex;
  align-items: center;
  margin-top: 8rpx;
}

.title {
  font-size: 30rpx;
  font-weight: 600;
  margin-bottom: 24rpx;
  color: #111827;
}
</style>