优化了“修改模型”页面,优化了“获取模型配置”功能

This commit is contained in:
CGD
2025-04-08 09:09:05 +08:00
parent d901b0ed34
commit f4218b032a
@@ -15,11 +15,11 @@
<div style="display: flex; align-items: center; gap: 20px;"> <div style="display: flex; align-items: center; gap: 20px;">
<div style="display: flex; align-items: center;"> <div style="display: flex; align-items: center;">
<span style="margin-right: 8px;">是否启用</span> <span style="margin-right: 8px;">是否启用</span>
<el-switch v-model="form.isEnabled" :active-value="1" :inactive-value="0" class="custom-switch"></el-switch> <el-switch v-model="form.isEnabled" :active-value="1" :inactive-value="0" class="custom-switch"></el-switch>
</div> </div>
<div style="display: flex; align-items: center;"> <div style="display: flex; align-items: center;">
<span style="margin-right: 8px;">设为默认</span> <span style="margin-right: 8px;">设为默认</span>
<el-switch v-model="form.isDefault" :active-value="1" :inactive-value="0" class="custom-switch"></el-switch> <el-switch v-model="form.isDefault" :active-value="1" :inactive-value="0" class="custom-switch"></el-switch>
</div> </div>
</div> </div>
</div> </div>
@@ -59,21 +59,26 @@
</el-form> </el-form>
<div style="font-size: 20px; font-weight: bold; color: #3d4566; margin-bottom: 15px;">调用信息</div> <div style="font-size: 20px; font-weight: bold; color: #3d4566; margin-bottom: 15px;">调用信息</div>
<div style="height: 2px; background: #e9e9e9; margin-bottom: 15px;"></div> <div style="height: 2px; background: #e9e9e9; margin-bottom: 22px;"></div>
<el-form :model="form" label-width="100px" label-position="left" class="custom-form"> <el-form :model="form.configJson" ref="callInfoForm" label-width="100px" label-position="left" class="custom-form">
<div style="display: flex; gap: 10px; margin-bottom: 15px;"> <template v-for="(row, rowIndex) in chunkedCallInfoFields">
<el-form-item label="模型名称" prop="modelName" style="flex: 0.5; margin-bottom: 0;"> <div :key="rowIndex" style="display: flex; gap: 20px; margin-bottom: 0;">
<el-input v-model="form.name" placeholder="请输入model_name" class="custom-input-bg"></el-input> <el-form-item v-for="field in row"
</el-form-item> :key="field.prop"
<el-form-item label="接口地址" prop="apiUrl" style="flex: 1; margin-bottom: 0;"> :label="field.label"
<el-input v-model="form.apiUrl" placeholder="请输入base_url" class="custom-input-bg"></el-input> :prop="field.prop"
</el-form-item> style="flex: 1;">
</div> <el-input
v-model="form.configJson[field.prop]"
<el-form-item label="秘钥信息" prop="apiKey"> :placeholder="field.placeholder"
<el-input v-model="form.apiKey" placeholder="请输入api_key" show-password class="custom-input-bg"></el-input> :type="field.type || 'text'"
</el-form-item> class="custom-input-bg"
:show-password="field.type === 'password'">
</el-input>
</el-form-item>
</div>
</template>
</el-form> </el-form>
</div> </div>
@@ -111,7 +116,7 @@ const DEFAULT_CONFIG_JSON = {
export default { export default {
name: "ModelEditDialog", name: "ModelEditDialog",
props: { props: {
visible: { type: Boolean, default: false }, visible: { type: Boolean, default: false },
modelData: { modelData: {
type: Object, type: Object,
@@ -135,12 +140,56 @@ export default {
docLink: "", docLink: "",
remark: "", remark: "",
sort: 0, sort: 0,
apiKey: "",
apiUrl: "",
configJson: JSON.parse(JSON.stringify(DEFAULT_CONFIG_JSON)) configJson: JSON.parse(JSON.stringify(DEFAULT_CONFIG_JSON))
} }
}; };
}, },
computed: {
callInfoFields() {
const fieldsMap = {
llm: [
{ label: '模型名称', prop: 'model_name', placeholder: '请输入model_name' },
{ label: '接口地址', prop: 'base_url', placeholder: '请输入base_url' },
{ label: '秘钥信息', prop: 'api_key', placeholder: '请输入api_key', type: 'password' }
],
vad: [
{ label: '模型目录', prop: 'model_dir', placeholder: '请输入model_dir' },
{ label: '阈值', prop: 'threshold', placeholder: '请输入threshold' },
{ label: '静音时长', prop: 'min_silence_duration_ms', placeholder: '请输入min_silence_duration_ms' }
],
asr: [
{ label: 'App ID', prop: 'appid', placeholder: '请输入appid' },
{ label: '集群', prop: 'cluster', placeholder: '请输入cluster' },
{ label: '访问令牌', prop: 'access_token', placeholder: '请输入access_token', type: 'password' },
{ label: '输出目录', prop: 'output_dir', placeholder: '请输入output_dir' }
],
intent: [
{ label: '模型', prop: 'llm', placeholder: '请输入model' },
{ label: '类型', prop: 'type', placeholder: '请输入类型' }
],
tts: [
{ label: '模型', prop: 'model', placeholder: '请输入model' },
{ label: '语音ID', prop: 'voice_id', placeholder: '请输入voice_id' },
{ label: 'Group ID', prop: 'group_id', placeholder: '请输入group_id' },
{ label: 'API Key', prop: 'api_key', placeholder: '请输入api_key', type: 'password' },
],
memory: [
{ label: 'API Key', prop: 'api_key', placeholder: '请输入api_key', type: 'password' },
{ label: '类型', prop: 'type', placeholder: '请输入类型' }
]
};
return fieldsMap[this.modelType] || [];
},
chunkedCallInfoFields() {
const chunkSize = 2;
const result = [];
for (let i = 0; i < this.callInfoFields.length; i += chunkSize) {
result.push(this.callInfoFields.slice(i, i + chunkSize));
}
return result;
},
},
watch: { watch: {
modelType() { modelType() {
this.resetProviders() this.resetProviders()
@@ -169,8 +218,6 @@ export default {
docLink: "", docLink: "",
remark: "", remark: "",
sort: 0, sort: 0,
apiKey: "",
apiUrl: "",
configJson: JSON.parse(JSON.stringify(DEFAULT_CONFIG_JSON)) configJson: JSON.parse(JSON.stringify(DEFAULT_CONFIG_JSON))
}; };
}, },
@@ -184,13 +231,18 @@ export default {
if (data.code === 0 && data.data) { if (data.code === 0 && data.data) {
const model = data.data; const model = data.data;
let configJson = model.configJson || {}; let configJson = model.configJson || {};
if (typeof configJson !== 'object' || Array.isArray(configJson)) { if (typeof configJson !== 'object' || Array.isArray(configJson)) {
console.warn('Invalid configJson format, using default'); console.warn('Invalid configJson format, using default');
configJson = {}; configJson = {};
} }
this.callInfoFields.forEach(field => {
if (!configJson.hasOwnProperty(field.prop)) {
configJson[field.prop] = '';
}
});
this.form = { this.form = {
id: model.id || "", id: model.id || "",
modelType: model.modelType || "", modelType: model.modelType || "",
@@ -201,9 +253,6 @@ export default {
docLink: model.docLink || "", docLink: model.docLink || "",
remark: model.remark || "", remark: model.remark || "",
sort: model.sort || 0, sort: model.sort || 0,
apiKey: configJson.api_key || "",
apiUrl: configJson.base_url || "",
name:configJson.model_name,
configJson: { configJson: {
...JSON.parse(JSON.stringify(DEFAULT_CONFIG_JSON)), ...JSON.parse(JSON.stringify(DEFAULT_CONFIG_JSON)),
...configJson, ...configJson,
@@ -219,21 +268,19 @@ export default {
}, },
handleSave() { handleSave() {
const formData = { const formData = {
modelCode: this.form.code, modelCode: this.form.modelCode,
modelName: this.form.name, modelName: this.form.modelName,
supplier: this.form.supplier,
isDefault: this.form.isDefault ? 1 : 0, isDefault: this.form.isDefault ? 1 : 0,
isEnabled: this.form.isEnable ? 1 : 0, isEnabled: this.form.isEnabled ? 1 : 0,
docLink: this.form.docUrl, docLink: this.form.docLink,
sort: this.form.sort,
remark: this.form.remark, remark: this.form.remark,
sort: this.form.sort || 0,
configJson: { configJson: {
provider: this.form.supplier, ...this.form.configJson,
modelName: this.form.modelName, type: this.form.configJson.type || this.modelType
apiUrl: this.form.apiUrl,
apiKey: this.form.apiKey
} }
}; };
this.$emit("save", formData); this.$emit("save", formData);
this.dialogVisible = false; this.dialogVisible = false;
}, },
@@ -248,7 +295,6 @@ export default {
this.providersLoaded = true; this.providersLoaded = true;
}); });
}, },
} }
}; };
</script> </script>
@@ -413,4 +459,22 @@ export default {
.custom-input-bg .el-input__inner { .custom-input-bg .el-input__inner {
height: 32px; height: 32px;
} }
.custom-form .el-form-item {
margin-bottom: 20px;
}
.custom-input-bg .el-input__inner {
height: 32px;
}
.custom-form .el-form-item__label {
color: #3d4566;
font-weight: normal;
text-align: right;
padding-right: 20px;
}
</style> </style>