import React, { useState, useEffect, useMemo } from 'react';
import { Select } from 'antd';
import apis from '../../services/apis';
import request from '../../utils/request'

const { Option } = Select;

/**
 *
 *
 * @param {*} props
 * @returns
 */
const ChannelSelect = props => {
  const [data, setData] = useState([])
  const {disabled=false}=props
  useEffect(() => {
    getChannelSelect();
  }, [props.value])

  const all = props.all || false


  const getChannelSelect = e => {
    request({ ...apis.channelList.getList, params: { pageNumber: 1, pageSize: 999 } }).then(data => {
      setData(data.records)
      // 默认选中第一个
    })
  }

  return (
    <Select
      showSearch
      value={props.value}
      style={{ width: '250px' }}
      placeholder="请选择渠道"
      onChange={props.onChange}
      filterOption={(input, option) =>
        option.props.children && option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
      }
      disabled={disabled}>
      {all && <Option key="" value="">全部渠道</Option>}
      {data.map(Item => (
        <Option key={Item.channelId} value={Item.channelId}> {Item.channelName} </Option>
      ))}
    </Select>
  )
}
export default ChannelSelect
