import { Form, Select } from "antd";
import { FormDatas } from "./interface";
import { useEffect, useState } from "react";
import { base } from "@/service/base";
const { Option } = Select;
export const FormSelect = (v: FormDatas) => {
  const [list, setList] = useState<any>([]);
  useEffect(() => {
    if (v.selectList && v.selectList.length > 0) {
      setList(v.selectList);
    } else {
      base.get(`${v.selectUrl}/?size=50&offset=1`, "").then((res) => {
        setList(res.data.record ?? []);
      });
    }
  }, [v.selectUrl, v.selectList]);
  return (
    <Form.Item
      key={v.label}
      label={v.label}
      name={v.name}
      rules={v.rules}
    >
      <Select placeholder={v.placeholder} mode={v.model} 
        style={{ width: "100%" ,minWidth:"200px"}} >
        {list?.map((item: any, index) => {
          return <Option key={JSON.stringify(item)} value={item.identity}>
            {item[v.keys ?? "name"]}
          </Option>
        })}
      </Select>
    </Form.Item>
  );
};