import React from 'react';
import { Form, Input, Switch, Select } from 'antd';
import type { FormInstance } from 'antd';

interface DictionaryItem {
  ID: number;
  name: string;
  type: string;
  status: boolean;
  desc: string;
  parentID?: number;
}

interface DictionaryFormProps {
  form: FormInstance;
  availableParentDictionaries: DictionaryItem[];
}

const DictionaryForm: React.FC<DictionaryFormProps> = ({
  form,
  availableParentDictionaries,
}) => {
  return (
    <Form form={form} layout="vertical">
      <Form.Item label="父级字典" name="parentID">
        <Select
          placeholder="请选择父级字典（可选）"
          allowClear
          showSearch
          optionFilterProp="label"
          options={availableParentDictionaries.map((dict) => ({
            label: `${dict.name}（${dict.type}）`,
            value: dict.ID,
          }))}
        />
      </Form.Item>
      <Form.Item
        label="字典名（中）"
        name="name"
        rules={[{ required: true, message: '请输入字典名（中）' }]}
      >
        <Input placeholder="请输入字典名（中）" />
      </Form.Item>
      <Form.Item
        label="字典名（英）"
        name="type"
        rules={[{ required: true, message: '请输入字典名（英）' }]}
      >
        <Input placeholder="请输入字典名（英）" />
      </Form.Item>
      <Form.Item label="状态" name="status" valuePropName="checked" initialValue={true}>
        <Switch checkedChildren="开启" unCheckedChildren="停用" />
      </Form.Item>
      <Form.Item
        label="描述"
        name="desc"
        rules={[{ required: true, message: '请输入描述' }]}
      >
        <Input.TextArea placeholder="请输入描述" rows={3} />
      </Form.Item>
    </Form>
  );
};

export default DictionaryForm;
