<template>
    <div class="main">
        <el-card class="box-card">
            <template #header>
                <div class="card-header">
                    <span>服务设置</span>
                </div>
            </template>
            <el-space direction="vertical" alignment="start" :size="30">
            <el-form ref="configRef" :model="form" :rules="rules" label-width="150px">
              <el-form-item label="Api Server:" prop="apiServer">
                <el-input v-model="form.apiServer" style="width: 500px;"></el-input>
              </el-form-item>
              <el-form-item label="Api Key:" prop="apiKey">
                <el-input v-model="form.apiKey"></el-input>
              </el-form-item>
              <el-form-item label="Api Server备用:" prop="apiServer2">
                <el-input v-model="form.apiServer2"></el-input>
              </el-form-item>
              <el-form-item>
                <el-button type="primary" @click="submitForm">确 定</el-button>
              </el-form-item>
            </el-form>
            </el-space>
        </el-card>
    </div>
 </template>
 
 <script setup name="developer">
import { updateConfigByKey, getConfigKey } from "@/api/system/config";
const { proxy } = getCurrentInstance();
const data = reactive({
  form: {},
  rules: {
    apiServer: [{ required: true, message: "参数名称不能为空", trigger: "blur" }],
    apiKey: [{ required: true, message: "参数键名不能为空", trigger: "blur" }],
    apiServer2: [{ required: true, message: "参数键值不能为空", trigger: "blur" }]
  }
});
const { form, rules } = toRefs(data);

function getConfig () {
  getConfigKey("api2gpt.server.url").then(response => {
    form.value.apiServer = response.msg
  })
  getConfigKey("api2gpt.server.key").then(response => {
    form.value.apiKey = response.msg
  })
  getConfigKey("api2gpt.server.backup").then(response => {
    form.value.apiServer2 = response.msg
  })
}

function submitForm() {
  proxy.$refs["configRef"].validate(valid => {
    if (valid) {
      updateConfigByKey({
        "api2gpt.server.url": form.value.apiServer,
        "api2gpt.server.key": form.value.apiKey,
        "api2gpt.server.backup": form.value.apiServer2
      }).then(response => {
        proxy.$modal.msgSuccess("修改成功");
      });
    }
  })
}

getConfig()
</script>
 
 <style scoped lang="scss">
 .main {
    padding: 20px;
 }
 </style>
 
 