ui: 新增Dify高级配置折叠面板
变更项: 1. Dify应用卡片新增‘展开/收起高级配置’按钮,默认收起。 2. 高级面板内提供可选覆盖字段:mode/endpoint/response_mode/request_timeout。 3. 保持主表单只展示刚需字段,兼顾简洁维护与高级调优。 4. 保存时移除前端状态字段 advanced_open,避免污染后端配置数据。
This commit is contained in:
@@ -87,7 +87,12 @@
|
||||
<el-card v-for="(item, index) in catalog.dify_apps" :key="item.uid" class="entry-card" shadow="never">
|
||||
<div slot="header" class="entry-header">
|
||||
<strong>{% raw %}{{ item.name || `DifyApp ${index + 1}` }}{% endraw %}</strong>
|
||||
<el-button type="text" class="danger-text" @click="removeDifyApp(index)">删除</el-button>
|
||||
<div class="entry-actions">
|
||||
<el-button type="text" @click="item.advanced_open = !item.advanced_open">
|
||||
{% raw %}{{ item.advanced_open ? '收起高级配置' : '展开高级配置' }}{% endraw %}
|
||||
</el-button>
|
||||
<el-button type="text" class="danger-text" @click="removeDifyApp(index)">删除</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="entry-grid">
|
||||
<el-input v-model="item.name" placeholder="应用名,例如:chat_main"></el-input>
|
||||
@@ -102,6 +107,15 @@
|
||||
</el-input>
|
||||
<el-input v-model="item.workflow_output_key" placeholder="workflow_output_key,例如:text"></el-input>
|
||||
</div>
|
||||
<div class="advanced-panel" v-if="item.advanced_open">
|
||||
<div class="advanced-title">高级覆盖项(可选)</div>
|
||||
<div class="entry-grid">
|
||||
<el-input v-model="item.config.mode" placeholder="覆盖 mode(可选)"></el-input>
|
||||
<el-input v-model="item.config.endpoint" placeholder="覆盖 endpoint(可选)"></el-input>
|
||||
<el-input v-model="item.config.response_mode" placeholder="覆盖 response_mode(可选)"></el-input>
|
||||
<el-input-number v-model="item.config.request_timeout" :min="1" :step="1" placeholder="覆盖 request_timeout(可选)"></el-input-number>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
<el-empty v-else description="暂无 Dify 应用"></el-empty>
|
||||
@@ -255,6 +269,7 @@
|
||||
newDifyApp() {
|
||||
return {
|
||||
uid: this.newUid(),
|
||||
advanced_open: false,
|
||||
name: '',
|
||||
provider_template: '',
|
||||
app_key: '',
|
||||
@@ -305,6 +320,7 @@
|
||||
normalizeDifyApp(item) {
|
||||
return {
|
||||
uid: this.newUid(),
|
||||
advanced_open: false,
|
||||
name: item.name || '',
|
||||
provider_template: item.provider_template || '',
|
||||
app_key: item.app_key || '',
|
||||
@@ -439,6 +455,7 @@
|
||||
dify_apps: (this.catalog.dify_apps || []).map(item => {
|
||||
const cleaned = { ...item };
|
||||
delete cleaned.uid;
|
||||
delete cleaned.advanced_open;
|
||||
return cleaned;
|
||||
}),
|
||||
backends: (this.catalog.backends || []).map(item => {
|
||||
@@ -499,7 +516,21 @@
|
||||
.section-list { display: flex; flex-direction: column; gap: 12px; }
|
||||
.entry-card { border: 1px solid rgba(148,163,184,0.16); border-radius: 14px; }
|
||||
.entry-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
|
||||
.entry-actions { display: flex; align-items: center; gap: 10px; }
|
||||
.entry-grid { display: grid; grid-template-columns: repeat(2, minmax(220px, 1fr)); gap: 10px 14px; }
|
||||
.advanced-panel {
|
||||
margin-top: 12px;
|
||||
padding: 12px;
|
||||
border-radius: 10px;
|
||||
border: 1px dashed rgba(148,163,184,0.5);
|
||||
background: rgba(148,163,184,0.06);
|
||||
}
|
||||
.advanced-title {
|
||||
font-size: 12px;
|
||||
color: #475569;
|
||||
margin-bottom: 10px;
|
||||
font-weight: 600;
|
||||
}
|
||||
.scene-row {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(260px, 1fr) minmax(160px, 220px) minmax(220px, 1fr) auto;
|
||||
|
||||
Reference in New Issue
Block a user