<script setup lang="ts">
import { ref } from 'vue';
import OperateModel from '@/components/advanced/operate-model.vue';

defineOptions({
  name: 'OssConfigOperateModal',
  inheritAttrs: false
});

defineProps<{ statusOptions: Api.SystemManage.DictInfo[]; isHttpsOptions: Api.SystemManage.DictInfo[] }>();

type Model = Omit<Api.SystemManage.OssConfig, 'ossConfigId'>;
type RuleKey = keyof Pick<Model, 'configKey' | 'accessKey' | 'secretKey' | 'bucketName' | 'endpoint'>;

const model = ref<Model>({
  configKey: '',
  endpoint: '',
  bucketName: '',
  prefix: '',
  region: '',
  status: '0', // 默认启用状态
  accessKey: '',
  secretKey: '', // 新增字段
  isHttps: 'N', // 默认不使用HTTPS
  remark: null
});

const rules: Record<RuleKey, App.Global.FormRule | App.Global.FormRule[]> = {
  configKey: { required: true, message: 'configKey不能为空', trigger: 'blur' },
  accessKey: [
    { required: true, message: 'accessKey不能为空', trigger: 'blur' },
    {
      min: 2,
      max: 200,
      message: 'accessKey长度必须介于 2 和 100 之间',
      trigger: 'blur'
    }
  ],
  secretKey: [
    { required: true, message: 'secretKey不能为空', trigger: 'blur' },
    {
      min: 2,
      max: 100,
      message: 'secretKey长度必须介于 2 和 100 之间',
      trigger: 'blur'
    }
  ],
  bucketName: [
    { required: true, message: 'bucketName不能为空', trigger: 'blur' },
    {
      min: 2,
      max: 100,
      message: 'bucketName长度必须介于 2 和 100 之间',
      trigger: 'blur'
    }
  ],
  endpoint: [
    { required: true, message: 'endpoint不能为空', trigger: 'blur' },
    {
      min: 2,
      max: 100,
      message: 'endpoint名称长度必须介于 2 和 100 之间',
      trigger: 'blur'
    }
  ]
};

const configKeyDatas = [
  { value: 'minio', label: 'Minio' },
  { value: 'qiniu', label: '七牛云' },
  { value: 'aliyun', label: '阿里云' },
  { value: 'qcloud', label: '腾讯云' }
];
</script>

<template>
  <OperateModel v-model:model="model" :rules="rules" title="参数" v-bind="$attrs">
    <template #formItem>
      <NFormItemGi span="24" label="配置名称" path="configKey">
        <NSelect v-model:value="model.configKey" :options="configKeyDatas" />
      </NFormItemGi>
      <NFormItemGi span="24 m:12" label="访问站点" path="endpoint">
        <NInput v-model:value="model.endpoint" placeholder="请输入访问站点地址" />
      </NFormItemGi>
      <NFormItemGi span="24 m:12" label="accessKey" path="accessKey">
        <NInput v-model:value="model.accessKey" placeholder="请输入accessKey" />
      </NFormItemGi>
      <NFormItemGi span="24 m:12" label="秘钥" path="secretKey">
        <NInput v-model:value="model.secretKey" placeholder="请输入秘钥" />
      </NFormItemGi>
      <NFormItemGi span="24 m:12" label="桶名称" path="bucketName">
        <NInput v-model:value="model.bucketName" placeholder="请输入存储桶名称" />
      </NFormItemGi>
      <NFormItemGi span="24 m:12" label="前缀" path="prefix">
        <NInput v-model:value="model.prefix" placeholder="请输入前缀" />
      </NFormItemGi>
      <NFormItemGi span="24 m:12" label="是否使用HTTPS" path="isHttps">
        <NRadioGroup v-model:value="model.isHttps">
          <NSpace>
            <NRadio
              v-for="option in isHttpsOptions"
              :key="option.dictValue"
              :value="option.dictValue"
              :label="option.dictLabel"
            />
          </NSpace>
        </NRadioGroup>
      </NFormItemGi>
      <NFormItemGi span="24 m:12" label="域" path="region">
        <NInput v-model:value="model.region" placeholder="请输入域" />
      </NFormItemGi>
      <NFormItemGi span="24 m:12" label="状态" path="status">
        <NSelect
          v-model:value="model.status"
          :options="statusOptions"
          label-field="dictLabel"
          value-field="dictValue"
          placeholder="请选择状态"
        />
      </NFormItemGi>
      <NFormItemGi span="24" label="备注" path="remark">
        <NInput v-model:value="model.remark" type="textarea" placeholder="请输入备注" />
      </NFormItemGi>
    </template>
  </OperateModel>
</template>

<style scoped></style>
