<script setup lang="ts">
import {useMessage} from 'naive-ui'

import {api} from '@/tools/web.ts'
import type {AiiProviderPublicWithoutKey} from '@/types/aii.ts'

const MESSAGE = useMessage()

const showModal = defineModel('showModal', { required: true })

const { provider, reload } = defineProps<{
  provider: AiiProviderPublicWithoutKey
  reload: () => void
}>()

function onSave() {
  api.post(`/aii/provider/${provider.id}/`, JSON.stringify(provider)).then(() => {
    MESSAGE.success(`模型提供商 [${provider.id}]${provider.name} 成功保存~`)
    showModal.value = false
    reload()
  }).catch((err) => {
    MESSAGE.error(`修改提供商信息失败：${err}`)
  })
}
</script>

<template>
  <n-modal v-model:show="showModal" preset="card" title="修改模型提供商">
    <n-alert type="warning" class="in-form-alert">
      不支持更换 API Key。如果需要更换 Key，请移除并重新添加模型提供商与模型。
    </n-alert>
    <n-form label-placement="left" label-align="right" label-width="auto" :model="provider">
      <n-form-item label="提供商名称" path="name" :rule="{ required: true, trigger: 'blur' }">
        <n-input v-model:value="provider.name" />
      </n-form-item>
      <n-form-item label="Base URL" path="base_url" :rule="{ required: true, trigger: 'blur' }">
        <n-input v-model:value="provider.base_url" />
      </n-form-item>
      <n-form-item label="操作">
        <n-button secondary type="primary" @click="onSave()">确认</n-button>
      </n-form-item>
    </n-form>
  </n-modal>
</template>

<style scoped></style>
