import { useEffect, useState } from 'react';
import { Select } from 'antd'
import { getInvoiceFillDetail,getInvoiceFillList } from '@/services/invoiceFill'

const Option = Select.Option;
export default (props) => {
  const { value, onChange, ...otherProps } = props;

  const showType = 0; // 不显示报错

  const [list, setList] = useState([])

  const searchData = (val) => { 
    getInvoiceFillList({ pageSize: 999,name:val }, showType).then(res => {
      setList(res.records || [])
    })    
  }

  const handleSearch = (text) => {
    if (text) {
      searchData(text)
    }else{
      getInvoiceFillList({ pageSize: 999 }, showType).then(res => {
        setList(res.records || [])
      })
    }
  }

  useEffect(() => {
    if (value) {
      getInvoiceFillDetail(value).then((res) => {
        setList([res])
      })
    }else{
      getInvoiceFillList({ pageSize: 999 }, showType).then(res => {
        setList(res.records || [])
      })
    }
  }, [value])

  return (
    <Select
      showSearch
      value={value}
      defaultActiveFirstOption={false}
      showArrow={false}
      filterOption={false}
      onSearch={handleSearch}
      onChange={onChange}
      notFoundContent={null}
      {...otherProps}
    >
      {
        list.map((item) => {
          return (
            <Option key={item.invoiceId} value={item.invoiceId}>{item.name}</Option>
          )
        })
      }
    </Select>
  )
}
