fix: 非会员模型选择跳转修改

Yi.Ai.Vue3/.eslintrc-auto-import.json

@@ -5,8 +5,6 @@
     "ComputedRef": true,
     "DirectiveBinding": true,
     "EffectScope": true,
-    "ElMessage": true,
-    "ElMessageBox": true,
     "ExtractDefaultPropTypes": true,
     "ExtractPropTypes": true,
     "ExtractPublicPropTypes": true,

Yi.Ai.Vue3/src/components/ModelSelect/index.vue

@@ -8,6 +8,7 @@ import Popover from '@/components/Popover/index.vue';
 import SvgIcon from '@/components/SvgIcon/index.vue';
 import { useUserStore } from '@/stores';
 import { useModelStore } from '@/stores/modules/model';
+import { showProductPackage } from '@/utils/product-package.ts';
 import { isUserVip } from '@/utils/user';
 
 const router = useRouter();
@@ -72,13 +73,13 @@ function handleModelClick(item: GetSessionListVO) {
       ${
         isUserVip()
           ? '<p class="text-sm text-gray-500">您可随时访问产品页面查看更多特权内容。</p>'
-          : '<p class="text-sm text-gray-500">点击下方按钮，立即升级为 VIP 会员！</p>'
+          : '<p class="text-sm text-gray-500">请点击右上角登录按钮，登录后进行购买！</p>'
       }
     </div>
     `,
       isUserVip() ? '会员状态' : '会员尊享',
       {
-        confirmButtonText: '前往产品页面',
+        confirmButtonText: '产品查看',
         cancelButtonText: '关闭',
         dangerouslyUseHTMLString: true,
         type: 'info',
@@ -87,10 +88,12 @@ function handleModelClick(item: GetSessionListVO) {
       },
     )
       .then(() => {
-        router.push({
+        showProductPackage();
-          name: 'products', // 使用命名路由
+
-          query: { from: isUserVip() ? 'vip' : 'user' }, // 可选：添加来源标识
+        // router.push({
-        });
+        //   name: 'products', // 使用命名路由
+        //   query: { from: isUserVip() ? 'vip' : 'user' }, // 可选：添加来源标识
+        // });
       })
       .catch(() => {
         // 点击右上角关闭或“关闭”按钮，不执行任何操作

Yi.Ai.Vue3/src/components/ProductPackage/index.vue

@@ -4,8 +4,10 @@ import { ElMessage } from 'element-plus';
 import { computed, onBeforeUnmount, onMounted, ref } from 'vue';
 import { useRouter } from 'vue-router';
 import { createOrder, getOrderStatus } from '@/api';
+import LoginDialog from '@/components/LoginDialog/index.vue';
 import SupportModelList from '@/components/userPersonalCenter/components/SupportModelList.vue';
 import ProductPage from '@/pages/products/index.vue';
+import { useUserStore } from '@/stores';
 
 const emit = defineEmits(['close']);
 
@@ -24,6 +26,8 @@ const packagesData = {
     { id: 9, name: '联系站长', desc: '', price: 0, tag: '企业级需求', discount: '' },
   ],
 };
+const userStore = useUserStore();
+const isLoginDialogVisible = computed(() => userStore.isLoginDialogVisible);
 
 const visible = ref(true);
 const activeTab = ref('member');
@@ -123,6 +127,10 @@ function selectPackage(pkg: any) {
   selectPackageObject.value = pkg;
 }
 
+function handleClickLogin() {
+  userStore.openLoginDialog();
+}
+
 async function pay() {
   if (!selectedId.value) {
     ElMessage.warning('请选择一个套餐');
@@ -242,8 +250,13 @@ function onClose() {
 </script>
 
 <template>
-  <el-dialog v-model="visible" :width="isMobile ? '90%' : '980px'" :fullscreen="isMobile && showDetails"
+  <!-- 登录弹框 -->
-    :show-close="false" destroy-on-close class="product-package-dialog" @close="onClose">
+  <LoginDialog v-model:visible="isLoginDialogVisible" />
+
+  <el-dialog
+    v-model="visible" :width="isMobile ? '90%' : '980px'" :fullscreen="isMobile && showDetails"
+    :show-close="false" destroy-on-close class="product-package-dialog" @close="onClose"
+  >
     <!-- 详情页 -->
     <div v-if="showDetails" class="details-view">
       <!-- 顶部标题和返回按钮 -->
@@ -302,10 +315,12 @@ function onClose() {
 
       <!-- Tab 切换 -->
       <div class="flex border-b mb-6 overflow-x-auto">
-        <div v-for="tab in tabs" :key="tab.key"
+        <div
+          v-for="tab in tabs" :key="tab.key"
           class="cursor-pointer px-5 py-2 -mb-px border-b-2 transition whitespace-nowrap" :class="activeTab === tab.key
             ? 'border-orange-500 text-orange-500 font-semibold'
-            : 'border-transparent text-gray-500 hover:text-orange-500'" @click="activeTab = tab.key">
+            : 'border-transparent text-gray-500 hover:text-orange-500'" @click="activeTab = tab.key"
+        >
           {{ tab.label }}
         </div>
       </div>
@@ -314,8 +329,10 @@ function onClose() {
       <div v-if="isMobile" class="mobile-layout">
         <!-- 套餐卡片列表 -->
         <div class="package-list">
-          <div v-for="pkg in currentPackages" :key="pkg.id" class="package-card"
+          <div
-            :class="{ selected: pkg.id === selectedId }" @click="selectPackage(pkg)">
+            v-for="pkg in currentPackages" :key="pkg.id" class="package-card"
+            :class="{ selected: pkg.id === selectedId }" @click="selectPackage(pkg)"
+          >
             <!-- 标签 -->
             <div v-if="pkg.discount" class="discount-tag">
               {{ pkg.discount }}
@@ -346,12 +363,15 @@ function onClose() {
             </div>
           </div>
         </div>
-          <div style="display: flex;justify-content: space-between;margin-top: 15px;">
+        <div style="display: flex;justify-content: space-between;margin-top: 15px;">
-            <div>
+          <div>
-              <p>充值后，加客服微信回复账号名，可专享vip售后服务</p>
+            <p>充值后，加客服微信回复账号名，可专享vip售后服务</p>
-              <p style="margin-top: 10px;">客服微信号：chengzilaoge520 或扫描右侧二维码</p>
+            <p style="margin-top: 10px;">
-            </div>
+              客服微信号：chengzilaoge520 或扫描右侧二维码
-            <div> <img style="height: 80px;width: 80px;" src="/src/assets/images/wx.png" alt="">
+            </p>
+          </div>
+          <div>
+            <img style="height: 80px;width: 80px;" src="/src/assets/images/wx.png" alt="">
           </div>
         </div>
         <!-- 权益预览 -->
@@ -389,13 +409,14 @@ function onClose() {
             <el-button text type="primary" class="view-details-btn" @click="toggleDetails">
               了解更多
             </el-button>
-            <el-button type="primary" :disabled="!selectedId || isLoading" :loading="isLoading" class="pay-button"
+            <el-button
-              @click="pay">
+              type="primary" :disabled="!selectedId || isLoading" :loading="isLoading" class="pay-button"
+              @click="pay"
+            >
               立即支付
             </el-button>
           </div>
 
-
           <div class="note-text">
             可叠加购买次数，过期时间以最后订单为准。<br>
             最终解释权归YiXinAI所有。
@@ -409,8 +430,10 @@ function onClose() {
         <div class="w-[60%] flex flex-col justify-between">
           <!-- 套餐卡片列表 -->
           <div class="flex flex-wrap gap-4">
-            <div v-for="pkg in currentPackages" :key="pkg.id" class="package-card"
+            <div
-              :class="{ selected: pkg.id === selectedId }" @click="selectPackage(pkg)">
+              v-for="pkg in currentPackages" :key="pkg.id" class="package-card"
+              :class="{ selected: pkg.id === selectedId }" @click="selectPackage(pkg)"
+            >
               <!-- 标签 -->
               <div v-if="pkg.discount" class="discount-tag">
                 {{ pkg.discount }}
@@ -444,62 +467,67 @@ function onClose() {
           <div style="display: flex;justify-content: space-between;margin-top: 15px;">
             <div>
               <p>充值后，加客服微信回复账号名，可专享vip售后服务</p>
-              <p style="margin-top: 10px;">客服微信号：chengzilaoge520 或扫描右侧二维码</p>
+              <p style="margin-top: 10px;">
-            </div>
+                客服微信号：chengzilaoge520 或扫描右侧二维码
-            <div> <img style="height: 80px;width: 80px;" src="/src/assets/images/wx.png" alt="">
+              </p>
-          </div>
-        </div>
-        <!-- 支付按钮 -->
-        <div class="payment-section">
-          <div v-if="false" class="agreement-text">
-            登录和注册都代表同意YiXinAI的会员协议
-          </div>
-          <div class="payment-action">
-            <div class="actual-payment">
-              <span>实际支付：</span>
-              <span class="price">¥{{ selectedPrice || 0 }}</span>
             </div>
             <div>
-              <el-button class="pay-button" text type="primary" @click="toggleDetails">
+              <img style="height: 80px;width: 80px;" src="/src/assets/images/wx.png" alt="">
-                了解更多
-              </el-button>
-              <el-button type="primary" size="large" :disabled="!selectedId || isLoading" :loading="isLoading"
-                class="pay-button" @click="pay">
-                立即支付
-              </el-button>
             </div>
           </div>
+          <!-- 支付按钮 -->
+          <div class="payment-section">
+            <div v-if="false" class="agreement-text">
+              登录和注册都代表同意YiXinAI的会员协议
+            </div>
+            <div class="payment-action">
+              <div class="actual-payment">
+                <span>实际支付：</span>
+                <span class="price">¥{{ selectedPrice || 0 }}</span>
+              </div>
+              <div>
+                <el-button class="pay-button" text type="primary" @click="toggleDetails">
+                  了解更多
+                </el-button>
+                <el-button
+                  type="primary" size="large" :disabled="!selectedId || isLoading" :loading="isLoading"
+                  class="pay-button" @click="pay"
+                >
+                  立即支付
+                </el-button>
+              </div>
+            </div>
 
-          <div class="note-text">
+            <div class="note-text">
-            可叠加购买次数，过期时间以最后订单为准。<br>
+              可叠加购买次数，过期时间以最后订单为准。<br>
-            最终解释权归YiXinAI所有。
+              最终解释权归YiXinAI所有。
+            </div>
           </div>
         </div>
-      </div>
 
-      <!-- 右栏 套餐权益 + 详情 -->
+        <!-- 右栏 套餐权益 + 详情 -->
-      <div class="w-[40%] flex flex-col justify-between right-panel max-h-400px overflow-y-auto">
+        <div class="w-[40%] flex flex-col justify-between right-panel max-h-400px overflow-y-auto">
-        <div>
+          <div>
-          <div class="section-title">
+            <div class="section-title">
-            会员权益
+              会员权益
-          </div>
+            </div>
-          <ul class="benefits-list ">
+            <ul class="benefits-list ">
-            <li v-for="(b, index) in currentBenefits" :key="index" class="benefit-item ">
+              <li v-for="(b, index) in currentBenefits" :key="index" class="benefit-item ">
-              <span class="dot">
+                <span class="dot">
-                <el-icon>
+                  <el-icon>
-                  <CircleCheck />
+                    <CircleCheck />
-                </el-icon>
+                  </el-icon>
-              </span>
+                </span>
-              <span>
+                <span>
-                <span class="benefit-name">{{ b.name }}</span>
+                  <span class="benefit-name">{{ b.name }}</span>
-                <span v-if="b.value">：{{ b.value }}</span>
+                  <span v-if="b.value">：{{ b.value }}</span>
-              </span>
+                </span>
-            </li>
+              </li>
-          </ul>
+            </ul>
 
-          <!-- 额外描述 -->
+            <!-- 额外描述 -->
-          <div v-if="activeTab === 'member'" class="extra-description ">
+            <div v-if="activeTab === 'member'" class="extra-description ">
-            <SupportModelList />
+              <SupportModelList />
 
             <!--              <div class="description-card"> -->
             <!--                <div class="title"> -->
@@ -524,18 +552,18 @@ function onClose() {
             <!--                  "AI+办公!"解锁300+工具箱会员权益 -->
             <!--                </div> -->
             <!--              </div> -->
+            </div>
           </div>
-        </div>
 
-        <!-- 查看详情 -->
+          <!-- 查看详情 -->
-        <div class="view-details">
+          <div class="view-details">
           <!--            <el-button text type="primary" @click="toggleDetails"> -->
           <!--              查看详情 -->
           <!--            </el-button> -->
+          </div>
         </div>
       </div>
     </div>
-    </div>
   </el-dialog>
 </template>
 

Yi.Ai.Vue3/types/components.d.ts

@@ -0,0 +1,43 @@
+/* eslint-disable */
+// @ts-nocheck
+// Generated by unplugin-vue-components
+// Read more: https://github.com/vuejs/core/pull/3399
+// biome-ignore lint: disable
+export {}
+
+/* prettier-ignore */
+declare module 'vue' {
+  export interface GlobalComponents {
+    AccountPassword: typeof import('./../src/components/LoginDialog/components/FormLogin/AccountPassword.vue')['default']
+    APIKeyManagement: typeof import('./../src/components/userPersonalCenter/components/APIKeyManagement.vue')['default']
+    DeepThinking: typeof import('./../src/components/DeepThinking/index.vue')['default']
+    ElAlert: typeof import('element-plus/es')['ElAlert']
+    ElButton: typeof import('element-plus/es')['ElButton']
+    ElCard: typeof import('element-plus/es')['ElCard']
+    ElCollapse: typeof import('element-plus/es')['ElCollapse']
+    ElCollapseItem: typeof import('element-plus/es')['ElCollapseItem']
+    ElDialog: typeof import('element-plus/es')['ElDialog']
+    ElDivider: typeof import('element-plus/es')['ElDivider']
+    ElImage: typeof import('element-plus/es')['ElImage']
+    FilesSelect: typeof import('./../src/components/FilesSelect/index.vue')['default']
+    IconSelect: typeof import('./../src/components/IconSelect/index.vue')['default']
+    Indexl: typeof import('./../src/components/SupportModelProducts/indexl.vue')['default']
+    LoginDialog: typeof import('./../src/components/LoginDialog/index.vue')['default']
+    ModeList: typeof import('./../src/components/modeList/index.vue')['default']
+    ModelSelect: typeof import('./../src/components/ModelSelect/index.vue')['default']
+    NavDialog: typeof import('./../src/components/userPersonalCenter/NavDialog.vue')['default']
+    Popover: typeof import('./../src/components/Popover/index.vue')['default']
+    ProductPackage: typeof import('./../src/components/ProductPackage/index.vue')['default']
+    QrCodeLogin: typeof import('./../src/components/LoginDialog/components/QrCodeLogin/index.vue')['default']
+    RechargeLog: typeof import('./../src/components/userPersonalCenter/components/RechargeLog.vue')['default']
+    RegistrationForm: typeof import('./../src/components/LoginDialog/components/FormLogin/RegistrationForm.vue')['default']
+    RouterLink: typeof import('vue-router')['RouterLink']
+    RouterView: typeof import('vue-router')['RouterView']
+    SupportModelList: typeof import('./../src/components/userPersonalCenter/components/SupportModelList.vue')['default']
+    SvgIcon: typeof import('./../src/components/SvgIcon/index.vue')['default']
+    UsageStatistics: typeof import('./../src/components/userPersonalCenter/components/UsageStatistics.vue')['default']
+    UserManagement: typeof import('./../src/components/userPersonalCenter/components/UserManagement.vue')['default']
+    VerificationCode: typeof import('./../src/components/LoginDialog/components/FormLogin/VerificationCode.vue')['default']
+    WelecomeText: typeof import('./../src/components/WelecomeText/index.vue')['default']
+  }
+}