zzh
b43dee5753
All checks were successful
Build and Deploy Front / deploy (push) Successful in 6m13s
卡片可真正追加模型（JSON 存 apiSecret），默认提供商置顶；同步各助手选模逻辑，并附带查价页与邀新文案调整。 Co-authored-by: Cursor <cursoragent@cursor.com>
97 lines
2.2 KiB
Vue
97 lines
2.2 KiB
Vue
<template>
|
||
<div class="xhs-page-panel ai-providers-panel">
|
||
<div class="table-toolbar">
|
||
<div class="toolbar-left">
|
||
<div>
|
||
<p class="xhs-panel-title">AI 助手 · 模型接入</p>
|
||
<p class="xhs-panel-desc">
|
||
默认提供 ChatGPT、豆包、DeepSeek、智谱；卡片内可新增/修改文字模型，也可编辑密钥，支持禁用。
|
||
</p>
|
||
</div>
|
||
</div>
|
||
<div class="toolbar-right">
|
||
<a-button :disabled="loading" @click="emit('refresh')">刷新</a-button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="panel-body">
|
||
<a-spin :loading="loading" class="grid-spin">
|
||
<div v-if="providers.length" class="providers-grid">
|
||
<AiProviderCard
|
||
v-for="p in providers"
|
||
:key="p.providerKey"
|
||
:provider="p"
|
||
@edit="(item) => emit('edit', item)"
|
||
@disable="(item) => emit('disable', item)"
|
||
@saved="emit('refresh')"
|
||
/>
|
||
</div>
|
||
<div v-else class="empty-hint">
|
||
暂无 AI 提供商配置。请确认已执行 seed_xhs_ai_providers.sql 初始化模板。
|
||
</div>
|
||
</a-spin>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import AiProviderCard from './AiProviderCard.vue';
|
||
import type { AiProviderItem } from './providerCatalog';
|
||
|
||
defineProps<{
|
||
providers: AiProviderItem[];
|
||
loading?: boolean;
|
||
}>();
|
||
|
||
const emit = defineEmits<{
|
||
(e: 'refresh'): void;
|
||
(e: 'edit', provider: AiProviderItem): void;
|
||
(e: 'disable', provider: AiProviderItem): void;
|
||
}>();
|
||
</script>
|
||
|
||
<style scoped lang="less">
|
||
@import '@/views/xhs/_shared/xhs-page.less';
|
||
|
||
.ai-providers-panel {
|
||
padding: 16px;
|
||
}
|
||
|
||
.toolbar-left {
|
||
flex-direction: column;
|
||
align-items: flex-start !important;
|
||
gap: 0 !important;
|
||
}
|
||
|
||
.panel-body {
|
||
flex: 1;
|
||
min-height: 0;
|
||
overflow: auto;
|
||
}
|
||
|
||
.grid-spin {
|
||
display: block;
|
||
width: 100%;
|
||
}
|
||
|
||
.providers-grid {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||
gap: 16px;
|
||
}
|
||
|
||
.empty-hint {
|
||
padding: 48px 16px;
|
||
text-align: center;
|
||
font-size: 13px;
|
||
color: var(--color-text-3);
|
||
line-height: 1.6;
|
||
}
|
||
|
||
@media (max-width: 900px) {
|
||
.providers-grid {
|
||
grid-template-columns: 1fr;
|
||
}
|
||
}
|
||
</style>
|