124 lines
3.3 KiB
Vue
124 lines
3.3 KiB
Vue
<template>
|
||
<div class="ai-config">
|
||
<el-form :model="configForm" label-width="150px" class="config-form">
|
||
<el-divider content-position="left">模型配置</el-divider>
|
||
|
||
<el-form-item label="AI模型">
|
||
<el-select v-model="configForm.model" placeholder="选择AI模型">
|
||
<el-option label="GPT-3.5" value="gpt-3.5" />
|
||
<el-option label="GPT-4" value="gpt-4" />
|
||
<el-option label="Claude" value="claude" />
|
||
</el-select>
|
||
</el-form-item>
|
||
|
||
<el-form-item label="API Key">
|
||
<el-input v-model="configForm.apiKey" type="password" show-password />
|
||
</el-form-item>
|
||
|
||
<el-form-item label="API地址">
|
||
<el-input v-model="configForm.apiUrl" />
|
||
</el-form-item>
|
||
|
||
<el-divider content-position="left">对话配置</el-divider>
|
||
|
||
<el-form-item label="温度值">
|
||
<el-slider v-model="configForm.temperature" :min="0" :max="2" :step="0.1" show-input />
|
||
<span class="help-text">控制回答的随机性，值越大回答越随机</span>
|
||
</el-form-item>
|
||
|
||
<el-form-item label="最大token数">
|
||
<el-input-number v-model="configForm.maxTokens" :min="100" :max="4000" />
|
||
</el-form-item>
|
||
|
||
<el-form-item label="历史对话轮数">
|
||
<el-input-number v-model="configForm.historyTurns" :min="1" :max="20" />
|
||
</el-form-item>
|
||
|
||
<el-divider content-position="left">功能配置</el-divider>
|
||
|
||
<el-form-item label="启用流式输出">
|
||
<el-switch v-model="configForm.enableStreaming" />
|
||
</el-form-item>
|
||
|
||
<el-form-item label="启用文件解读">
|
||
<el-switch v-model="configForm.enableFileInterpretation" />
|
||
</el-form-item>
|
||
|
||
<el-form-item label="启用知识库检索">
|
||
<el-switch v-model="configForm.enableKnowledgeRetrieval" />
|
||
</el-form-item>
|
||
|
||
<el-form-item label="系统提示词">
|
||
<el-input
|
||
v-model="configForm.systemPrompt"
|
||
type="textarea"
|
||
:rows="6"
|
||
placeholder="设置AI助手的角色和行为..."
|
||
/>
|
||
</el-form-item>
|
||
|
||
<el-form-item>
|
||
<el-button type="primary" @click="handleSave">保存配置</el-button>
|
||
<el-button @click="handleTest">测试连接</el-button>
|
||
<el-button @click="handleReset">重置</el-button>
|
||
</el-form-item>
|
||
</el-form>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import { ref, onMounted } from 'vue';
|
||
import { ElForm, ElFormItem, ElSelect, ElOption, ElInput, ElSlider, ElInputNumber, ElSwitch, ElButton, ElDivider, ElMessage } from 'element-plus';
|
||
|
||
const configForm = ref({
|
||
model: 'gpt-3.5',
|
||
apiKey: '',
|
||
apiUrl: '',
|
||
temperature: 0.7,
|
||
maxTokens: 2000,
|
||
historyTurns: 5,
|
||
enableStreaming: true,
|
||
enableFileInterpretation: true,
|
||
enableKnowledgeRetrieval: true,
|
||
systemPrompt: ''
|
||
});
|
||
|
||
onMounted(() => {
|
||
loadConfig();
|
||
});
|
||
|
||
function loadConfig() {
|
||
// TODO: 加载AI配置
|
||
}
|
||
|
||
function handleSave() {
|
||
// TODO: 保存配置
|
||
ElMessage.success('配置保存成功');
|
||
}
|
||
|
||
function handleTest() {
|
||
// TODO: 测试API连接
|
||
ElMessage.info('正在测试连接...');
|
||
}
|
||
|
||
function handleReset() {
|
||
// TODO: 重置配置
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.ai-config {
|
||
padding: 20px;
|
||
max-width: 800px;
|
||
}
|
||
|
||
.config-form {
|
||
.help-text {
|
||
font-size: 12px;
|
||
color: #999;
|
||
margin-left: 12px;
|
||
}
|
||
}
|
||
</style>
|
||
|