fix:修改模型配置

src/views/operation/configModels/index.vue

@@ -41,16 +41,14 @@
 		<!-- 修改对话框 -->
 		<el-dialog :title="dialogTitle" v-model="dialogOpen" width="980px" append-to-body :close-on-click-modal="false"
 			@close="cancel">
-			<el-form :model="dialogForm" :rules="dialogRules" ref="configModelsRef" label-width="80px">
+			<el-form :model="dialogForm" :rules="dialogRules" ref="configModelsRef" label-width="110px" class="config-form">
 				<el-row>
-					<el-col :span="24">
+					<el-col :span="12">
 						<el-form-item label="模型名称" prop="useCase">
 							<el-input v-model="dialogForm.useCase" disabled="true" />
 						</el-form-item>
 					</el-col>
-				</el-row>
+					<el-col :span="12">
-				<el-row>
-					<el-col :span="24">
 						<el-form-item label="模型" prop="modelId">
 							<el-select v-model="dialogForm.modelId" placeholder="请选择模型" @change="handleModelChange">
 								<el-option 
@@ -64,10 +62,38 @@
 					</el-col>
 				</el-row>
 				<el-row>
-					<el-col :span="24">
+					<el-col :span="12">
-						<el-form-item label="API密钥" prop="apiKey">
+						<el-form-item label="Api Url" prop="apiUrl">
-							<el-input v-model="dialogForm.apiKey" type="textarea" placeholder="请输入API密钥"
+							<el-input v-model="dialogForm.apiUrl" placeholder="请输入Api Url"></el-input>
-								rows="4"></el-input>
+						</el-form-item>
+					</el-col>
+					<el-col :span="12">
+						<el-form-item label="Api密钥" prop="apiKey">
+							<el-input v-model="dialogForm.apiKey" placeholder="请输入Api密钥"></el-input>
+						</el-form-item>
+					</el-col>
+				</el-row>
+				<el-row>
+					<el-col :span="12">
+						<el-form-item label="Top-K" prop="topK">
+							<el-slider :step="1" :min="0" :max="100" v-model="dialogForm.topK" show-input />
+						</el-form-item>
+					</el-col>
+					<el-col :span="12">
+						<el-form-item label="Top-P" prop="topP">
+							<el-slider :step="0.01" :min="0" :max="1" v-model="dialogForm.topP" show-input />
+						</el-form-item>
+					</el-col>
+				</el-row>
+				<el-row>
+					<el-col :span="12">
+						<el-form-item label="最大回复长度" prop="temperature">
+							<el-slider :step="1" :min="1" :max="163840" v-model="dialogForm.maxTokens" show-input />
+						</el-form-item>
+					</el-col>
+					<el-col :span="12">
+						<el-form-item label="温度" prop="temperature">
+							<el-slider :step="0.01" :min="0" :max="1" v-model="dialogForm.temperature" show-input />
 						</el-form-item>
 					</el-col>
 				</el-row>
@@ -114,11 +140,21 @@ const dialogForm = ref({
 	modelName: '',
 	modelPrompt: '',
 	apiKey: '',
+	apiUrl:'',
+	temperature:'',
+	topK:'',
+	topP:'',
+	maxTokens:'',
 })
 const dialogRules = ref({
 	modelId: [{ required: true, message: '请选择模型', trigger: ['change'] }],
 	modelPrompt: [{ required: true, message: '请输入提示词', trigger: ['blur'] }],
 	apiKey: [{ required: true, message: '请输入API密钥', trigger: ['blur'] }],
+	apiUrl: [{ required: true, message: '请输入API Url', trigger: ['blur'] }],
+	temperature: [{ required: true, message: '请输入温度', trigger: ['blur'] }],
+	topK: [{ required: true, message: '请输入Top-K', trigger: ['blur'] }],
+	topP: [{ required: true, message: '请输入Top-P', trigger: ['blur'] }],
+	maxTokens: [{ required: true, message: '请输入最大回复长度', trigger: ['blur'] }],
 })
 
 const data = reactive({
@@ -136,7 +172,6 @@ const { queryParams } = toRefs(data)
 /** 查询模型列表 */
 function getModelList() {
 	getDicts('model_name').then(res => {
-		console.log(res.data);
 		modelsOptions.value = res.data
 	})
 }
@@ -159,6 +194,11 @@ function submitForm() {
 				modelName: data.modelName,
 				modelPrompt: data.modelPrompt,
 				apiKey: data.apiKey,
+				apiUrl: data.apiUrl,
+				temperature: data.temperature,
+				topK: data.topK,
+				topP: data.topP,
+				maxTokens: data.maxTokens,
 			}
 			
 			// 调用更新接口
@@ -237,4 +277,47 @@ onMounted(() => {
 	// 列表查询
 	getList()
 })
-</script>
+</script>
+<style lang="scss" scoped>
+	.config-form{
+		.el-slider {
+			--el-slider-button-size: 14px;
+			--el-slider-height: 4px;
+		}
+		.el-slider__button {
+			border: solid 1px #bbbfc4;
+			&.hover {
+				border: solid 2px #5E8BFB;
+			}
+		}
+		.el-slider__runway.show-input {
+			margin-right: 12px;
+			}
+			.el-slider__input {
+			width: 72px;
+		}
+
+		:deep(.el-slider__input){
+			width: 130px;
+			margin-left: 30px;
+		}
+
+		:deep(.el-slider__bar) {
+			height: 6px;
+			background-color: #5E8BFB;
+		}
+
+		:deep(.el-slider__runway) {
+			background: #E8E8E8;
+			height: 6px;
+		}
+
+		:deep(.el-slider__button.hover){
+			border: 4px solid #3067EF;
+			transform: scale(1.3);
+		}
+		:deep(.el-input__wrapper.is-focus){
+			box-shadow: 0 0 0 1px var(--el-input-border-color, var(--el-border-color)) inset;
+		}
+	}
+</style>