模型列表添加表格展示模式 服务支持和如何购买的跳转问题

src/views/computingResource/resourceList.vue

@@ -37,7 +37,7 @@
     </div>
 
     <div class="info-content">
-      <div v-if="tabActive !== 999" class="switch-display" @click="showVersion = (showVersion === 1 ? 2 : 1)">
+      <div class="switch-display" @click="showVersion = (showVersion === 1 ? 2 : 1)">
         <svg-icon v-show="showVersion === 2" color="#2E77E3" icon-class="list-1"/>
         <svg-icon v-show="showVersion === 1" color="#2E77E3" icon-class="table"/>
       </div>
@@ -58,7 +58,71 @@
               清空筛选
             </el-button>
           </div>
-          <div class="model-list">
+          <div v-if="showVersion === 1" class="version-1" style="padding-bottom: 90px;">
+            <el-table v-if="filteredModels.length !== 0" :data="filteredModels" :max-height="490" style="width: 100%">
+              <el-table-column prop="modelName" label="模型名" width="190px"/>
+              <el-table-column label="收费方式">
+                <template #default="{ row }">
+                  {{ billingTagText(row) }}
+                </template>
+              </el-table-column>
+              <el-table-column label="标签">
+                <template #default="{ row }">
+                  <el-text 
+                    class="mx-1"
+                    v-for="(tag, index) in modelTags(row)"
+                    :key="tag"
+                    :type="tagColors[index % tagColors.length]"
+                   >{{tag}}</el-text>
+                </template>
+              </el-table-column>
+              <el-table-column label="描述">
+                <template #default="{ row }">
+                  <el-text truncated>
+                    {{ row.description }}
+                  </el-text>
+                </template>
+              </el-table-column>
+              <el-table-column label="输入价格">
+                <template #default="{ row }">
+                  <div v-if="Number(row?.quotaType) === 1">-</div>
+                  <div v-else-if="row?.billingMode === 'tiered_expr' && row?.tiers && row.tiers.length > 0">
+                    <b>¥{{ formatPrice(row.tiers[0].inputRatio) }} / 1M</b>
+                  </div>
+                  <div v-else>
+                    <b>¥{{ formatPrice(row.inputPrice) }} / 1M</b>
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column label="输出价格">
+                <template #default="{ row }">
+                  <div v-if="Number(row?.quotaType) === 1">-</div>
+                  <div v-else-if="row?.billingMode === 'tiered_expr' && row?.tiers && row.tiers.length > 0">
+                    <b>¥{{ formatPrice(row.tiers[0].outputRatio) }} / 1M</b>
+                  </div>
+                  <div v-else>
+                    <b>¥{{ formatPrice(row.outputPrice) }} / 1M</b>
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column label="单次价格">
+                <template #default="{ row }">
+                  <div v-if="Number(row?.quotaType) === 1">
+                    <b>¥{{ formatPrice(row.inputPrice) }}</b>
+                  </div>
+                  <div v-else>-</div>
+                </template>
+              </el-table-column>
+              <el-table-column label="操作">
+                <template #default="{row}">
+                  <el-button type="primary" class="action-button" @click="openModelDetail(row)">详情
+                  </el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+            <el-empty v-if="filteredModels.length === 0" description="暂无模型"/>
+          </div>
+          <div v-else class="model-list">
             <model-card v-for="m in filteredModels" :key="m.modelName" :model="m" @click="openModelDetail(m)" />
           </div>
         </el-tab-pane>
@@ -459,7 +523,6 @@
         </div>
       </template>
     </el-drawer>
-
   </div>
 </template>
 
@@ -1032,6 +1095,24 @@ function handleGetTokenCta() {
   })
 }
 
+function formatPrice(price) {
+  if (price === null || price === undefined) return '-'
+  const num = Number(price)
+  if (Number.isNaN(num)) return '-'
+  return num.toFixed(4).replace(/\.?0+$/, '')
+}
+
+function billingTagText(model) {
+  if (Number(model?.quotaType) === 1) return '按次收费'
+  if (model?.billingMode === 'tiered_expr') return '动态计费'
+  return '按量收费'
+}
+
+function modelTags(model) {
+  if (!model?.tags) return []
+  return model.tags.split(',').map(t => t.trim()).filter(t => t)
+}
+
 onMounted(() => {
   getModelList()
   checkTokenStatus()

src/views/index.vue

@@ -149,12 +149,12 @@
             普惠算力公共服务平台，期待您的加入</h5>
           <p class="desc">
             让我们共同引领行业创新浪潮，共绘算力时代蓝图，成为超算互联网服务领域的佼佼者</p></div>
-        <div class="right"><span class="a-btn"> 加入我们</span></div>
+        <!-- <div class="right"><span class="a-btn"> 加入我们</span></div> -->
       </div>
     </div>
 
     <div class="content-footer">
-      <div class="content-detail">
+      <div class="content-detail" @click="router.push('/industryApplications/index')">
         <img src="@/assets/images/indexImg/content1.png" alt=""/>
         <div class="name">服务支持</div>
         <div class="more">了解更多 ></div>
@@ -164,7 +164,7 @@
         <div class="name">联系我们</div>
         <div class="more">了解更多 ></div>
       </div>
-      <div class="content-detail">
+      <div class="content-detail" @click="router.push('/computingResource/resourceList?type=999')">
         <img src="@/assets/images/indexImg/content3.png" alt=""/>
         <div class="name">如何购买</div>
         <div class="more">了解更多 ></div>

src/views/industryApplications/index.vue

@@ -28,7 +28,7 @@
     </div>
 
     <div class="content-footer">
-      <div class="content-detail">
+      <div class="content-detail" @click="router.push('/industryApplications/index')">
         <img src="@/assets/images/indexImg/content1.png" alt=""/>
         <div class="name">服务支持</div>
         <div class="more">了解更多 ></div>
@@ -38,7 +38,7 @@
         <div class="name">联系我们</div>
         <div class="more">了解更多 ></div>
       </div>
-      <div class="content-detail">
+      <div class="content-detail" @click="router.push('/computingResource/resourceList?type=999')">
         <img src="@/assets/images/indexImg/content3.png" alt=""/>
         <div class="name">如何购买</div>
         <div class="more">了解更多 ></div>