From 01a5ad53027cff7e88ecbaafe3d9009a26a9bac5 Mon Sep 17 00:00:00 2001
From: Gsh <15170702455@163.com>
Date: Mon, 30 Jun 2025 17:53:59 +0800
Subject: [PATCH] =?UTF-8?q?fix=EF=BC=9A=E6=A8=A1=E5=9E=8B=E9=80=89?=
 =?UTF-8?q?=E6=8B=A9=E9=99=90=E5=88=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 Yi.Ai.Vue3/config/index.js                    |  0
 .../src/components/ModelSelect/index.vue      | 79 ++++++++++++++++---
 .../components/Header/components/Avatar.vue   |  5 +-
 3 files changed, 74 insertions(+), 10 deletions(-)
 create mode 100644 Yi.Ai.Vue3/config/index.js

diff --git a/Yi.Ai.Vue3/config/index.js b/Yi.Ai.Vue3/config/index.js
new file mode 100644
index 00000000..e69de29b
diff --git a/Yi.Ai.Vue3/src/components/ModelSelect/index.vue b/Yi.Ai.Vue3/src/components/ModelSelect/index.vue
index caaf69f6..7a30a734 100644
--- a/Yi.Ai.Vue3/src/components/ModelSelect/index.vue
+++ b/Yi.Ai.Vue3/src/components/ModelSelect/index.vue
@@ -1,13 +1,27 @@
 <!-- 切换模型 -->
 <script setup lang="ts">
 import type { GetSessionListVO } from '@/api/model/types';
+import { Lock } from '@element-plus/icons-vue';
+import { useRouter } from 'vue-router';
 import Popover from '@/components/Popover/index.vue';
+
 import SvgIcon from '@/components/SvgIcon/index.vue';
 import { useUserStore } from '@/stores';
 import { useModelStore } from '@/stores/modules/model';
 
+const router = useRouter();
+
+// 用户角色
+const isUserRoleVip = computed(() => {
+  const roles = userStore.userInfo?.roles ?? [];
+  return roles.some(role => role.roleCode === 'YiXinAi-Vip');
+});
 const userStore = useUserStore();
 const modelStore = useModelStore();
+// 检查模型是否可用
+function isModelAvailable(item: GetSessionListVO) {
+  return isUserRoleVip.value || item.modelName === 'DeepSeek-R1';
+}
 
 onMounted(async () => {
   await modelStore.requestModelList();
@@ -42,13 +56,50 @@ async function showPopover() {
   // 获取最新的模型列表
   await modelStore.requestModelList();
 }
-// 用户角色
-// const isUserRoleVip = computed(() => {
-//   const roles = userStore.userInfo?.roles ?? [];
-//   return roles.some(role => role.roleCode === 'YiXinAi-Vip');
-// });
+
 // 点击
-function handleClick(item: GetSessionListVO) {
+// 处理模型点击
+function handleModelClick(item: GetSessionListVO) {
+  if (!isModelAvailable(item)) {
+    ElMessageBox.confirm(
+      `
+    <div class="text-center leading-relaxed">
+      <h3 class="text-lg font-bold mb-3">${isUserRoleVip.value ? 'YiXinAI-VIP 会员' : '成为 YiXinAI-VIP'}</h3>
+      <p class="mb-2">
+        ${
+          isUserRoleVip.value
+            ? '您已是尊贵会员，享受全部 AI 模型与专属服务。感谢您的支持！'
+            : '解锁所有 AI 模型，无限加速，专属客服，尽享尊贵体验。'
+        }
+      </p>
+      ${
+        isUserRoleVip.value
+          ? '<p class="text-sm text-gray-500">您可随时访问产品页面查看更多特权内容。</p>'
+          : '<p class="text-sm text-gray-500">点击下方按钮，立即升级为 VIP 会员！</p>'
+      }
+    </div>
+    `,
+      isUserRoleVip.value ? '会员状态' : '会员尊享',
+      {
+        confirmButtonText: '前往产品页面',
+        cancelButtonText: '关闭',
+        dangerouslyUseHTMLString: true,
+        type: 'info',
+        center: true,
+        roundButton: true,
+      },
+    )
+      .then(() => {
+        router.push({
+          name: 'products', // 使用命名路由
+          query: { from: isUserRoleVip.value ? 'vip' : 'user' }, // 可选：添加来源标识
+        });
+      })
+      .catch(() => {
+        // 点击右上角关闭或“关闭”按钮，不执行任何操作
+      });
+  }
+
   console.log('handleClick--', item);
   modelStore.setCurrentModelInfo(item);
   popoverRef.value?.hide?.();
@@ -95,11 +146,21 @@ function handleClick(item: GetSessionListVO) {
           >
             <template #trigger>
               <div
-                class="popover-content-box-item p-4px font-size-12px text-overflow line-height-16px"
-                :class="{ 'bg-[rgba(0,0,0,.04)] is-select': item.modelName === currentModelName }"
-                @click="handleClick(item)"
+                class="popover-content-box-item p-4px font-size-12px text-overflow line-height-16px relative"
+                :class="[
+                  { 'bg-[rgba(0,0,0,.04)] is-select': item.modelName === currentModelName },
+                  { 'cursor-not-allowed opacity-60': !isModelAvailable(item) },
+                ]"
+                @click="handleModelClick(item)"
               >
                 {{ item.modelName }}
+                <!-- VIP锁定图标 -->
+                <el-icon
+                  v-if="!isModelAvailable(item)"
+                  class="absolute right-1 top-1/2 transform -translate-y-1/2"
+                >
+                  <Lock />
+                </el-icon>
               </div>
             </template>
             <div
diff --git a/Yi.Ai.Vue3/src/layouts/components/Header/components/Avatar.vue b/Yi.Ai.Vue3/src/layouts/components/Header/components/Avatar.vue
index f6b0e98b..c97b43aa 100644
--- a/Yi.Ai.Vue3/src/layouts/components/Header/components/Avatar.vue
+++ b/Yi.Ai.Vue3/src/layouts/components/Header/components/Avatar.vue
@@ -15,8 +15,11 @@ const userRole = computed(() => {
   return roles.some(role => role.roleCode === 'YiXinAi-Vip') ? 'vip' : 'user';
 });
 
+// const src = computed(
+//   () => userStore.userInfo?.avatar ?? 'https://avatars.githubusercontent.com/u/76239030',
+// );
 const src = computed(
-  () => userStore.userInfo?.avatar ?? 'https://avatars.githubusercontent.com/u/76239030',
+  () => userStore.userInfo.user.icon ? `${import.meta.env.VITE_WEB_BASE_API}/file/${userStore.userInfo.user.icon}` : `@/assets/images/logo.png`,
 );
 
 /* 弹出面板 开始 */