xwl2023/Yi.Framework
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 2.7 模型库优化

Browse Source
This commit is contained in:
Gsh
2025-12-11 21:35:32 +08:00
parent a46a552097
commit 6e2ca8f1c3
4 changed files with 50 additions and 114 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
Yi.Ai.Vue3/src/api/model/types.ts
View File

@@ -34,8 +34,7 @@ export interface ModelLibraryDto {
name: string;
description?: string;
modelType: ModelTypeEnum;
modelTypeName: string;
modelApiType: ModelApiTypeEnum;
modelApiTypes: Array;
modelApiTypeName: string;
multiplierShow: number;
providerName?: string;

98
Yi.Ai.Vue3/src/pages/modelLibrary/element.text
View File

@@ -1,98 +0,0 @@
<template>
<div class="flex gap-2">
<el-tag v-for="tag in tags" :key="tag.name" closable :type="tag.type">
{{ tag.name }}
</el-tag>
</div>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
import type { TagProps } from 'element-plus'
interface TagsItem {
name: string
type: TagProps['type']
}
const tags = ref<TagsItem[]>([
{ name: 'Tag 1', type: 'primary' },
{ name: 'Tag 2', type: 'success' },
{ name: 'Tag 3', type: 'info' },
{ name: 'Tag 4', type: 'warning' },
{ name: 'Tag 5', type: 'danger' },
])
</script>
<template>
<div class="flex gap-2">
<el-check-tag checked>Checked</el-check-tag>
<el-check-tag :checked="checked" @change="onChange">Toggle me</el-check-tag>
<el-check-tag disabled>Disabled</el-check-tag>
</div>
<div class="flex gap-2 mt-4">
<el-check-tag :checked="checked1" type="primary" @change="onChange1">
Tag 1
</el-check-tag>
<el-check-tag :checked="checked2" type="success" @change="onChange2">
Tag 2
</el-check-tag>
<el-check-tag :checked="checked3" type="info" @change="onChange3">
Tag 3
</el-check-tag>
<el-check-tag :checked="checked4" type="warning" @change="onChange4">
Tag 4
</el-check-tag>
<el-check-tag :checked="checked5" type="danger" @change="onChange5">
Tag 5
</el-check-tag>
<el-check-tag
:checked="checked6"
disabled
type="success"
@change="onChange6"
>
Tag 6
</el-check-tag>
</div>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
const checked = ref(false)
const checked1 = ref(true)
const checked2 = ref(true)
const checked3 = ref(true)
const checked4 = ref(true)
const checked5 = ref(true)
const checked6 = ref(true)
const onChange = (status: boolean) => {
checked.value = status
}
const onChange1 = (status: boolean) => {
checked1.value = status
}
const onChange2 = (status: boolean) => {
checked2.value = status
}
const onChange3 = (status: boolean) => {
checked3.value = status
}
const onChange4 = (status: boolean) => {
checked4.value = status
}
const onChange5 = (status: boolean) => {
checked5.value = status
}
const onChange6 = (status: boolean) => {
checked6.value = status
}
</script>

61
Yi.Ai.Vue3/src/pages/modelLibrary/index.vue
View File

@@ -217,7 +217,9 @@ onMounted(() => {
<div class="banner-header">
<div class="banner-left">
<div class="banner-text-section">
<h1 class="banner-title">意心AI模型库</h1>
<h1 class="banner-title">
意心AI模型库
</h1>
<p class="banner-subtitle">
探索并接入全球顶尖AI模型，覆盖文本、图像、嵌入等多个领域
</p>
@@ -229,8 +231,12 @@ onMounted(() => {
<el-icon><Box /></el-icon>
</div>
<div class="stat-info">
<div class="stat-value">{{ totalCount }}</div>
<div class="stat-label">可用模型</div>
<div class="stat-value">
{{ totalCount }}
</div>
<div class="stat-label">
可用模型
</div>
</div>
</div>
<div class="stat-card">
@@ -238,8 +244,12 @@ onMounted(() => {
<el-icon><OfficeBuilding /></el-icon>
</div>
<div class="stat-info">
<div class="stat-value">{{ providerList.length>1?providerList.length:1 - 1 }}</div>
<div class="stat-label">支持供应商</div>
<div class="stat-value">
{{ providerList.length > 1 ? providerList.length : 1 - 1 }}
</div>
<div class="stat-label">
支持供应商
</div>
</div>
</div>
</div>
@@ -304,6 +314,7 @@ onMounted(() => {
:key="provider"
:checked="selectedProviders.includes(provider)"
class="filter-tag"
@change="toggleProvider(provider)"
>
{{ provider }}
@@ -463,8 +474,8 @@ onMounted(() => {
<el-tag size="small">
{{ model.modelTypeName }}
</el-tag>
<el-tag size="small">
{{ model.modelApiTypeName }}
<el-tag v-for="item in model.modelApiTypes" :key="item" size="small">
{{ item.modelApiTypeName }}
</el-tag>
</div>
<div class="model-pricing">
@@ -956,24 +967,49 @@ onMounted(() => {
color: #606266;
line-height: 1.7;
margin: 0 0 20px 0;
-webkit-box-orient: vertical;
min-height: 48px; /* 保持2行的高度 */
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
//overflow: hidden;
min-height: 48px;
line-clamp: 2;
overflow: hidden;
/* 添加过渡效果 */
transition: all 0.3s ease;
max-height: 3.4em; /* 2行高度 (1.7 * 2 = 3.4em) */
&.placeholder {
color: #c0c4cc;
font-family: 'Monaco', 'Menlo', monospace;
font-size: 12px;
}
/* 悬停时展开 */
&:hover {
-webkit-line-clamp: unset; /* 取消行数限制 */
line-clamp: unset;
max-height: none; /* 取消最大高度限制 */
overflow: visible; /* 显示全部内容 */
/* 可选：添加背景或边框突出显示 */
background-color: #f9f9f9;
//padding: 8px 12px;
border-radius: 4px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
//margin-bottom: 20px; /* 保持原有间距 */
/* 如果是绝对定位的父容器，可以增加z-index */
z-index: 10;
position: relative;
}
}
.model-footer {
display: flex;
justify-content: space-between;
align-items: center;
gap: 16px;
gap: 6px;
padding-top: 16px;
border-top: 1px solid #f0f0f0;
@@ -988,7 +1024,7 @@ onMounted(() => {
display: flex;
align-items: center;
gap: 8px;
padding: 6px 12px;
padding: 6px 6px;
background: linear-gradient(135deg, rgba(102, 126, 234, 0.08) 0%, rgba(118, 75, 162, 0.08) 100%);
border-radius: 8px;
white-space: nowrap;
@@ -1054,7 +1090,6 @@ onMounted(() => {
}
}
// 流光溢彩动画
@keyframes gradientFlow {
0% {