Skip to content

phsl / client

Go to a project
Commit ee07a517 by renyizhao
Options

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

parent bd639314
Showing with 90 additions and 9 deletions
src/views/computingResource/resourceList.vue
...@@ -37,7 +37,7 @@ ...@@ -37,7 +37,7 @@
</div> </div>
<div class="info-content"> <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 === 2" color="#2E77E3" icon-class="list-1"/>
<svg-icon v-show="showVersion === 1" color="#2E77E3" icon-class="table"/> <svg-icon v-show="showVersion === 1" color="#2E77E3" icon-class="table"/>
</div> </div>
...@@ -58,7 +58,71 @@ ...@@ -58,7 +58,71 @@
清空筛选 清空筛选
</el-button> </el-button>
</div> </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)" /> <model-card v-for="m in filteredModels" :key="m.modelName" :model="m" @click="openModelDetail(m)" />
</div> </div>
</el-tab-pane> </el-tab-pane>
...@@ -459,8 +523,7 @@ ...@@ -459,8 +523,7 @@
</div> </div>
</template> </template>
</el-drawer> </el-drawer>
</div>
</div>
</template> </template>
<script name="ResourceList" setup> <script name="ResourceList" setup>
...@@ -1032,6 +1095,24 @@ function handleGetTokenCta() { ...@@ -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(() => { onMounted(() => {
getModelList() getModelList()
checkTokenStatus() checkTokenStatus()
......
src/views/index.vue
...@@ -149,12 +149,12 @@ ...@@ -149,12 +149,12 @@
普惠算力公共服务平台，期待您的加入</h5> 普惠算力公共服务平台，期待您的加入</h5>
<p class="desc"> <p class="desc">
让我们共同引领行业创新浪潮，共绘算力时代蓝图，成为超算互联网服务领域的佼佼者</p></div> 让我们共同引领行业创新浪潮，共绘算力时代蓝图，成为超算互联网服务领域的佼佼者</p></div>
<div class="right"><span class="a-btn"> 加入我们</span></div> <!-- <div class="right"><span class="a-btn"> 加入我们</span></div> -->
</div> </div>
</div> </div>
<div class="content-footer"> <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=""/> <img src="@/assets/images/indexImg/content1.png" alt=""/>
<div class="name">服务支持</div> <div class="name">服务支持</div>
<div class="more">了解更多 ></div> <div class="more">了解更多 ></div>
...@@ -164,7 +164,7 @@ ...@@ -164,7 +164,7 @@
<div class="name">联系我们</div> <div class="name">联系我们</div>
<div class="more">了解更多 ></div> <div class="more">了解更多 ></div>
</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=""/> <img src="@/assets/images/indexImg/content3.png" alt=""/>
<div class="name">如何购买</div> <div class="name">如何购买</div>
<div class="more">了解更多 ></div> <div class="more">了解更多 ></div>
......
src/views/industryApplications/index.vue
...@@ -28,7 +28,7 @@ ...@@ -28,7 +28,7 @@
</div> </div>
<div class="content-footer"> <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=""/> <img src="@/assets/images/indexImg/content1.png" alt=""/>
<div class="name">服务支持</div> <div class="name">服务支持</div>
<div class="more">了解更多 ></div> <div class="more">了解更多 ></div>
...@@ -38,7 +38,7 @@ ...@@ -38,7 +38,7 @@
<div class="name">联系我们</div> <div class="name">联系我们</div>
<div class="more">了解更多 ></div> <div class="more">了解更多 ></div>
</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=""/> <img src="@/assets/images/indexImg/content3.png" alt=""/>
<div class="name">如何购买</div> <div class="name">如何购买</div>
<div class="more">了解更多 ></div> <div class="more">了解更多 ></div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment