import React, { useState, useEffect, useMemo, useContext } from 'react'
import { Input, message, ConfigProvider } from 'antd'
import Icon, { EllipsisOutlined } from '@ant-design/icons'
import * as icons from '@ant-design/icons'
import { GetFieldValueFromTable } from '../../../../apis/process'
import './index.less'

const iconList = Object.keys(icons).filter((item) => typeof icons[item] === 'object')

const debounce = (fn) => {
  let t = null
  return function (e) {
    const context = this
    const args = arguments
    if (t) {
      clearTimeout(t)
    }
    t = setTimeout(function () {
      fn.call(context, args)
    }, 200)
  }
}

const TextInput = (props) => {

  const userInfo = window?.globalConfig?.userInfo || { fullName: '【本人姓名】', depart: { name: '【本人部门】' } }
  const { getPrefixCls } = useContext(ConfigProvider.ConfigContext)
  const prefixCls = getPrefixCls('pandaXform')
  const { value, onChange, schema, addons } = props
  const { title, disabled, placeholder, presetValue, addonBefore, addonAfter, maxLength, rules, uniqueVerify, tableName, fieldName } = schema

  const handleChange = (e) => {
    if (addons) {
      onChange(e.target.value)
    }
  }

  useEffect(() => {
    let paths = ['【本人姓名】', '【本人部门】']
    let value = presetValue
    if (paths.includes(value)) {
      if (value === '【本人姓名】') {
        value = userInfo.fullName
      } else if (value === '【本人部门】') {
        value = userInfo.depart.name
      }
    }
    if (addons) {
      addons.setValue(addons.dataPath, value)
    } else {
      onChange(value)
    }
  }, [presetValue])

  useEffect(() => {
    if (uniqueVerify === '表名/字段名' && tableName && fieldName) {
      if (addons) {
        let getValue = async (params) => {
          const [rule, value, callback] = params
          const { code, data, msg } = await GetFieldValueFromTable(tableName, fieldName, `${fieldName}=${value}`)
          if (Array.isArray(data) && data.length) {
            callback(new Error(`${title}已重复,请重新输入`));
          } else {
            callback()
          }
        }
        let uniqueRules = [
          {
            validator: debounce(getValue)
          }
        ]
        addons.setSchemaByPath(addons.dataPath, { ...schema, rules: uniqueRules })
      }
    }
  }, [uniqueVerify, tableName, fieldName])

  return (
    <div className={`${prefixCls}-input`} isdisabled={JSON.stringify(disabled)}>
      <Input
        disabled={disabled}
        value={value}
        maxLength={maxLength}
        placeholder={disabled ? null : placeholder}
        onChange={handleChange}
        addonBefore={iconList.includes(addonBefore) ? <Icon style={{ color: 'pink' }} component={icons[addonBefore]} /> : addonBefore}
        addonAfter={iconList.includes(addonAfter) ? <Icon component={icons[addonAfter]} /> : addonAfter}
      />
    </div>
  )

}

export default TextInput