style: 整体调整

Yi.Ai.Vue3/.claude/settings.json

@@ -0,0 +1,7 @@
+{
+  "env": {
+    "ANTHROPIC_AUTH_TOKEN": "sk-lVcGFMOQfXYtZWp1rD4SaBNDNpM270UX2wDqWh",
+    "ANTHROPIC_BASE_URL": "https://api.token-ai.cn",
+	"ANTHROPIC_MODEL": "gpt-4o-mini"
+  }
+}

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

@@ -208,7 +208,7 @@ function openContact() {
 </h4>
         <img
           src="${wxSrc.value}"
-          class="w-50 h-70 border border-gray-200 rounded-lg shadow-md cursor-pointer hover:shadow-lg transition-transform hover:scale-105"
+          class="w-50 h-50 border border-gray-200 rounded-lg shadow-md cursor-pointer hover:shadow-lg transition-transform hover:scale-105"
           onclick="document.getElementById('wechat-qrcode-fullscreen').style.display = 'flex'"
           alt="微信二维码"
         >
@@ -218,7 +218,7 @@ function openContact() {
 </h4>
         <img
           src="${wxGroupQD}"
-          class="w-50 h-70 border border-gray-200 rounded-lg shadow-md cursor-pointer hover:shadow-lg transition-transform hover:scale-105"
+          class="w-50 h-50 border border-gray-200 rounded-lg shadow-md cursor-pointer hover:shadow-lg transition-transform hover:scale-105"
           onclick="document.getElementById('wx-group-qrcode-fullscreen').style.display = 'flex'"
           alt="微信二维码"
         >

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

@@ -242,15 +242,8 @@ function onClose() {
 </script>
 
 <template>
-  <el-dialog
+  <el-dialog v-model="visible" :width="isMobile ? '90%' : '980px'" :fullscreen="isMobile && showDetails"
-    v-model="visible"
+    :show-close="false" destroy-on-close class="product-package-dialog" @close="onClose">
-    :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">
       <!-- 顶部标题和返回按钮 -->
@@ -309,15 +302,10 @@ function onClose() {
 
       <!-- Tab 切换 -->
       <div class="flex border-b mb-6 overflow-x-auto">
-        <div
+        <div v-for="tab in tabs" :key="tab.key"
-          v-for="tab in tabs"
+          class="cursor-pointer px-5 py-2 -mb-px border-b-2 transition whitespace-nowrap" :class="activeTab === tab.key
-          :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'"
+            : 'border-transparent text-gray-500 hover:text-orange-500'" @click="activeTab = tab.key">
-          @click="activeTab = tab.key"
-        >
           {{ tab.label }}
         </div>
       </div>
@@ -326,13 +314,8 @@ function onClose() {
       <div v-if="isMobile" class="mobile-layout">
         <!-- 套餐卡片列表 -->
         <div class="package-list">
-          <div
+          <div v-for="pkg in currentPackages" :key="pkg.id" class="package-card"
-            v-for="pkg in currentPackages"
+            :class="{ selected: pkg.id === selectedId }" @click="selectPackage(pkg)">
-            :key="pkg.id"
-            class="package-card"
-            :class="{ selected: pkg.id === selectedId }"
-            @click="selectPackage(pkg)"
-          >
             <!-- 标签 -->
             <div v-if="pkg.discount" class="discount-tag">
               {{ pkg.discount }}
@@ -363,20 +346,25 @@ function onClose() {
             </div>
           </div>
         </div>
-
+          <div style="display: flex;justify-content: space-between;margin-top: 15px;">
+            <div>
+              <p>充值后，加客服微信回复账号名，可专享vip售后服务</p>
+              <p style="margin-top: 10px;">客服微信号：chengzilaoge520 或扫描右侧二维码</p>
+            </div>
+            <div> <img style="height: 80px;width: 80px;" src="/src/assets/images/wx.png" alt="">
+          </div>
+        </div>
         <!-- 权益预览 -->
         <div class="benefits-preview max-h-200px overflow-y-auto">
           <div class="section-title">
             专属权益
           </div>
           <ul class="benefits-list">
-            <li
+            <li v-for="(b, index) in currentBenefits" :key="index" class="benefit-item">
-              v-for="(b, index) in currentBenefits"
-              :key="index"
-              class="benefit-item"
-            >
               <span class="dot">
-                <el-icon><CircleCheck /></el-icon>
+                <el-icon>
+                  <CircleCheck />
+                </el-icon>
               </span>
 
               <span>
@@ -398,24 +386,16 @@ function onClose() {
               <span>实际支付：</span>
               <span class="price">¥{{ selectedPrice || 0 }}</span>
             </div>
-            <el-button
+            <el-button text type="primary" class="view-details-btn" @click="toggleDetails">
-              text
-              type="primary"
-              class="view-details-btn"
-              @click="toggleDetails"
-            >
               了解更多
             </el-button>
-            <el-button
+            <el-button type="primary" :disabled="!selectedId || isLoading" :loading="isLoading" class="pay-button"
-              type="primary"
+              @click="pay">
-              :disabled="!selectedId || isLoading"
-              :loading="isLoading"
-              class="pay-button"
-              @click="pay"
-            >
               立即支付
             </el-button>
           </div>
+
+
           <div class="note-text">
             可叠加购买次数，过期时间以最后订单为准。<br>
             最终解释权归YiXinAI所有。
@@ -429,13 +409,8 @@ function onClose() {
         <div class="w-[60%] flex flex-col justify-between">
           <!-- 套餐卡片列表 -->
           <div class="flex flex-wrap gap-4">
-            <div
+            <div v-for="pkg in currentPackages" :key="pkg.id" class="package-card"
-              v-for="pkg in currentPackages"
+              :class="{ selected: pkg.id === selectedId }" @click="selectPackage(pkg)">
-              :key="pkg.id"
-              class="package-card"
-              :class="{ selected: pkg.id === selectedId }"
-              @click="selectPackage(pkg)"
-            >
               <!-- 标签 -->
               <div v-if="pkg.discount" class="discount-tag">
                 {{ pkg.discount }}
@@ -466,100 +441,100 @@ function onClose() {
               </div>
             </div>
           </div>
-
+          <div style="display: flex;justify-content: space-between;margin-top: 15px;">
-          <!-- 支付按钮 -->
+            <div>
-          <div class="payment-section">
+              <p>充值后，加客服微信回复账号名，可专享vip售后服务</p>
-            <div v-if="false" class="agreement-text">
+              <p style="margin-top: 10px;">客服微信号：chengzilaoge520 或扫描右侧二维码</p>
-              登录和注册都代表同意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">
-              可叠加购买次数，过期时间以最后订单为准。<br>
-              最终解释权归YiXinAI所有。
             </div>
+            <div> <img style="height: 80px;width: 80px;" src="/src/assets/images/wx.png" alt="">
           </div>
         </div>
-
+        <!-- 支付按钮 -->
-        <!-- 右栏 套餐权益 + 详情 -->
+        <div class="payment-section">
-        <div class="w-[40%] flex flex-col justify-between right-panel max-h-400px overflow-y-auto">
+          <div v-if="false" class="agreement-text">
-          <div>
+            登录和注册都代表同意YiXinAI的会员协议
-            <div class="section-title">
+          </div>
-              会员权益
+          <div class="payment-action">
+            <div class="actual-payment">
+              <span>实际支付：</span>
+              <span class="price">¥{{ selectedPrice || 0 }}</span>
             </div>
-            <ul class="benefits-list ">
+            <div>
-              <li
+              <el-button class="pay-button" text type="primary" @click="toggleDetails">
-                v-for="(b, index) in currentBenefits"
+                了解更多
-                :key="index"
+              </el-button>
-                class="benefit-item "
+              <el-button type="primary" size="large" :disabled="!selectedId || isLoading" :loading="isLoading"
-              >
+                class="pay-button" @click="pay">
-                <span class="dot">
+                立即支付
-                  <el-icon><CircleCheck /></el-icon>
+              </el-button>
-                </span>
-                <span>
-                  <span class="benefit-name">{{ b.name }}</span>
-                  <span v-if="b.value">：{{ b.value }}</span>
-                </span>
-              </li>
-            </ul>
-
-            <!-- 额外描述 -->
-            <div v-if="activeTab === 'member'" class="extra-description ">
-              <SupportModelList />
-
-              <!--              <div class="description-card"> -->
-              <!--                <div class="title"> -->
-              <!--                  前沿模型AI对话 -->
-              <!--                </div> -->
-              <!--                <div class="subtext"> -->
-              <!--                  DP-RI深度思考、精准解答 -->
-              <!--                </div> -->
-              <!--                <div class="subtext"> -->
-              <!--                  AI写作、文档对话、AI思维导图等赋能职场 -->
-              <!--                </div> -->
-              <!--              </div> -->
-
-              <!--              <div class="description-card"> -->
-              <!--                <div class="title"> -->
-              <!--                  AI绘图与设计能力 -->
-              <!--                </div> -->
-              <!--                <div class="subtext"> -->
-              <!--                  视觉吸睛赋能 -->
-              <!--                </div> -->
-              <!--                <div class="subtext"> -->
-              <!--                  "AI+办公!"解锁300+工具箱会员权益 -->
-              <!--                </div> -->
-              <!--              </div> -->
             </div>
           </div>
 
-          <!-- 查看详情 -->
+          <div class="note-text">
-          <div class="view-details">
+            可叠加购买次数，过期时间以最后订单为准。<br>
-            <!--            <el-button text type="primary" @click="toggleDetails"> -->
+            最终解释权归YiXinAI所有。
-            <!--              查看详情 -->
-            <!--            </el-button> -->
           </div>
         </div>
       </div>
+
+      <!-- 右栏 套餐权益 + 详情 -->
+      <div class="w-[40%] flex flex-col justify-between right-panel max-h-400px overflow-y-auto">
+        <div>
+          <div class="section-title">
+            会员权益
+          </div>
+          <ul class="benefits-list ">
+            <li v-for="(b, index) in currentBenefits" :key="index" class="benefit-item ">
+              <span class="dot">
+                <el-icon>
+                  <CircleCheck />
+                </el-icon>
+              </span>
+              <span>
+                <span class="benefit-name">{{ b.name }}</span>
+                <span v-if="b.value">：{{ b.value }}</span>
+              </span>
+            </li>
+          </ul>
+
+          <!-- 额外描述 -->
+          <div v-if="activeTab === 'member'" class="extra-description ">
+            <SupportModelList />
+
+            <!--              <div class="description-card"> -->
+            <!--                <div class="title"> -->
+            <!--                  前沿模型AI对话 -->
+            <!--                </div> -->
+            <!--                <div class="subtext"> -->
+            <!--                  DP-RI深度思考、精准解答 -->
+            <!--                </div> -->
+            <!--                <div class="subtext"> -->
+            <!--                  AI写作、文档对话、AI思维导图等赋能职场 -->
+            <!--                </div> -->
+            <!--              </div> -->
+
+            <!--              <div class="description-card"> -->
+            <!--                <div class="title"> -->
+            <!--                  AI绘图与设计能力 -->
+            <!--                </div> -->
+            <!--                <div class="subtext"> -->
+            <!--                  视觉吸睛赋能 -->
+            <!--                </div> -->
+            <!--                <div class="subtext"> -->
+            <!--                  "AI+办公!"解锁300+工具箱会员权益 -->
+            <!--                </div> -->
+            <!--              </div> -->
+          </div>
+        </div>
+
+        <!-- 查看详情 -->
+        <div class="view-details">
+          <!--            <el-button text type="primary" @click="toggleDetails"> -->
+          <!--              查看详情 -->
+          <!--            </el-button> -->
+        </div>
+      </div>
+    </div>
     </div>
   </el-dialog>
 </template>
@@ -580,7 +555,8 @@ function onClose() {
       width: 100%;
       border-collapse: collapse;
 
-      .table-header, .table-row {
+      .table-header,
+      .table-row {
         display: table-row;
       }
 
@@ -620,13 +596,16 @@ function onClose() {
       border-radius: 8px;
       padding: 16px;
       transition: all 0.3s;
-
+      cursor: pointer;
       &.selected {
         border: 3px solid #fde19d;
         background-image: url('@/assets/images/product_background.svg');
-        background-repeat: no-repeat; /* 按需设置是否重复 */
+        background-repeat: no-repeat;
-        background-size: cover; /* 按需设置背景图尺寸适配方式，比如 cover、contain 等 */
+        /* 按需设置是否重复 */
-        background-position: bottom; /* 按需设置背景图位置 */
+        background-size: cover;
+        /* 按需设置背景图尺寸适配方式，比如 cover、contain 等 */
+        background-position: bottom;
+        /* 按需设置背景图位置 */
 
         box-shadow: 0 4px 6px -1px #fff4e3;
       }
@@ -767,6 +746,7 @@ function onClose() {
   /* 桌面端样式 */
   .desktop-layout {
     .package-card {
+      cursor: pointer;
       position: relative;
       width: calc(50% - 0.5rem);
       border: 1px solid #e5e7eb;
@@ -782,9 +762,12 @@ function onClose() {
       &.selected {
         border: 3px solid #fde19d;
         background-image: url('@/assets/images/product_background.svg');
-        background-repeat: no-repeat; /* 按需设置是否重复 */
+        background-repeat: no-repeat;
-        background-size: cover; /* 按需设置背景图尺寸适配方式，比如 cover、contain 等 */
+        /* 按需设置是否重复 */
-        background-position: bottom; /* 按需设置背景图位置 */
+        background-size: cover;
+        /* 按需设置背景图尺寸适配方式，比如 cover、contain 等 */
+        background-position: bottom;
+        /* 按需设置背景图位置 */
 
         box-shadow: 0 4px 6px -1px #fff4e3;
       }
@@ -953,7 +936,8 @@ function onClose() {
         overflow-x: auto;
         white-space: nowrap;
 
-        .table-header, .table-row {
+        .table-header,
+        .table-row {
           display: table;
           width: 100%;
           table-layout: fixed;

Yi.Ai.Vue3/src/components/SupportModelProducts/indexl.vue

@@ -97,7 +97,7 @@ const models = [
     </div>
     <div class="mt-8 text-center">
       <h2 class="text-2xl font-semibold mb-2">
-        一口价订阅，仅需 <span class="text-red-500 text-3xl font-bold">19.9元/月</span>  起
+        一口价订阅，最低仅需 <span class="text-red-500 text-3xl font-bold">19.9元/月</span>  起
       </h2>
       <p class="text-gray-600 mb-4">
         即解锁以上全部模型，随时切换，无需单独付费。

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

@@ -72,7 +72,7 @@ function openContact() {
 
     <div class="mt-8 text-center">
       <h2 class="text-2xl font-semibold mb-2">
-        一口价订阅，仅需 <span class="text-red-500 text-3xl font-bold">9.9元/月</span>
+        一口价订阅，最低仅需 <span class="text-red-500 text-3xl font-bold">9.9元/月</span>
       </h2>
       <p class="text-gray-600 mb-4">
         即解锁以上全部模型，随时切换，无需单独付费。

Yi.Ai.Vue3/src/components/userPersonalCenter/components/APIKeyManagement.vue

@@ -247,6 +247,7 @@ onMounted(async () => {
           href="https://ccnetcore.com/article/3a1bc4d1-6a7d-751d-91cc-2817eb2ddcde"
           target="_blank"
           class="flex items-center gap-2 group"
+          style="color: #E6A23C;"
           title="点击跳转玩法指南专栏"
         >
           【意心Ai】AI工具玩法指南
@@ -261,7 +262,7 @@ onMounted(async () => {
         <!-- 自适应缩放 iframe -->
         <iframe
           src="https://ccnetcore.com/article/3a1bc4d1-6a7d-751d-91cc-2817eb2ddcde"
-          class="min-w-full h-[700px] scale-100 hover:scale-[0.98] transition-transform duration-300"
+          class="min-w-full h-[700px] scale-100  duration-300"
           loading="lazy"
           sandbox="allow-scripts allow-same-origin allow-popups"
           @load="document.querySelector('.iframe-loading')?.remove()"

Yi.Ai.Vue3/src/components/userPersonalCenter/components/RechargeLog.vue

@@ -27,10 +27,10 @@ const showWechatFullscreen = ref(false);
 const showWxGroupFullscreen = ref(false);
 
 const wxSrc = computed(
-  () => `${import.meta.env.VITE_WEB_BASE_API}/wwwroot/aihub/wx.png`,
+  () => `/src/assets/images/wx.png`,
 );
 const wxGroupQD = computed(
-  () => `${import.meta.env.VITE_WEB_BASE_API}/wwwroot/aihub/jlq.png`,
+  () => `/src/assets/images/wx.png`,
 );
 
 // 复制微信号
@@ -237,7 +237,7 @@ onMounted(() => {
         </el-tooltip>
         <el-input
           v-model="searchText"
-          placeholder="搜索联系方式/备注"
+          placeholder="搜索备注"
           clearable
           style="width: 200px; margin-left: 10px;"
           @clear="handleSearchClear"
@@ -294,14 +294,14 @@ onMounted(() => {
         sortable="custom"
         show-overflow-tooltip
       />
-      <el-table-column show-overflow-tooltip prop="contactInfo" width="100" label="联系方式">
+      <!-- <el-table-column show-overflow-tooltip prop="contactInfo" width="100" label="联系方式">
         <template #default="{ row }">
           <el-tooltip v-if="row.contactInfo && row.contactInfo.length > 8" :content="row.contactInfo" placement="top">
             <span class="ellipsis-text">{{ row.contactInfo }}</span>
           </el-tooltip>
           <span v-else>{{ row.contactInfo || '-' }}</span>
         </template>
-      </el-table-column>
+      </el-table-column> -->
       <el-table-column show-overflow-tooltip prop="remark" label="备注" width="160">
         <template #default="{ row }">
           <el-tooltip v-if="row.remark && row.remark.length > 10" :content="row.remark" placement="top">

Yi.Ai.Vue3/src/components/userPersonalCenter/components/UsageStatistics.vue

@@ -364,7 +364,7 @@ onBeforeUnmount(() => {
         <div class="card-header">
           <span>近七天每日Token消耗量</span>
           <el-tag type="primary">
-            总计: {{ totalTokens }} tokens
+            近七日总计: {{ totalTokens }} tokens
           </el-tag>
         </div>
       </template>
@@ -387,7 +387,7 @@ onBeforeUnmount(() => {
     <el-card v-loading="loading" class="chart-card">
       <template #header>
         <div class="card-header">
-          <span>各模型Token消耗量</span>
+          <span>各模型总Token消耗量</span>
         </div>
       </template>
       <div class="chart-container">

Yi.Ai.Vue3/src/pages/payResult/index.vue

@@ -256,7 +256,7 @@ function contactCustomerService() {
         <h4>站长微信(备注“AI”以便通过)</h4>
         <img
           :src="wxSrc"
-          class="w-50 py-5 h-70 border border-gray-200 rounded-lg shadow-md cursor-pointer hover:shadow-lg transition-transform hover:scale-105"
+          class=" py-5  border border-gray-200 rounded-lg shadow-md cursor-pointer hover:shadow-lg transition-transform hover:scale-105"
           alt="微信二维码"
         >
       </div>

Yi.Ai.Vue3/src/pages/products/index.vue

@@ -3,10 +3,10 @@ import { ElMessageBox } from 'element-plus';
 import SupportModelProducts from '@/components/SupportModelProducts/indexl.vue';
 
 const wxSrc = computed(
-  () => `${import.meta.env.VITE_WEB_BASE_API}/wwwroot/aihub/wx.png`,
+  () => `/src/assets/images/wx.png`,
 );
 // 微信群二维码
-const wxGroupQD = `${import.meta.env.VITE_WEB_BASE_API}/wwwroot/aihub/jlq.png`;
+const wxGroupQD = `/src/assets/images/wx.png`;
 const srcList = [
   wxGroupQD,
 ];
@@ -222,7 +222,7 @@ function openContact() {
             </h4>
             <img
               :src="wxSrc"
-              class="w-50 h-70 border border-gray-200 rounded-lg shadow-md cursor-pointer hover:shadow-lg transition-transform hover:scale-105"
+              class="w-50 h-50 border border-gray-200 rounded-lg shadow-md cursor-pointer hover:shadow-lg transition-transform hover:scale-105"
               onclick="document.getElementById('wechat-qrcode-fullscreen').style.display = 'flex'"
               alt="微信二维码"
             >
@@ -233,7 +233,7 @@ function openContact() {
             <img
               :src="wxGroupQD"
 
-              class="w-50 h-70 border border-gray-200 rounded-lg shadow-md cursor-pointer hover:shadow-lg transition-transform hover:scale-105"
+              class="w-50 h-50 border border-gray-200 rounded-lg shadow-md cursor-pointer hover:shadow-lg transition-transform hover:scale-105"
               onclick="document.getElementById('wx-group-qrcode-fullscreen').style.display = 'flex'"
               alt="微信二维码"
             >
@@ -349,7 +349,7 @@ function openContact() {
     </el-divider>
     <el-collapse class="max-w-3xl mx-auto flex justify-center" accordion>
       <el-image
-        style="width: 500px; height: auto;"
+        style="width: 200px; height: 200px;"
         :src="wxGroupQD"
         :zoom-rate="1.2"
         :max-scale="7"