/**
 * Author: wjw
 * Date:
 * Description:
 */
import React, { useState, useEffect, forwardRef } from 'react';
import { connect } from 'dva';
import { Card, Button, Row, Col, Input } from 'antd';
import styles from './index.less';
const { TextArea } = Input;
const InputCom = forwardRef((props, ref) => {
  const { value, onChange, placeholder, max, type = 'input', style, disabled, defaultLen = 0 } = props;
  const onIptChange = ({ target: { value } }) => {
    if (onChange) {
      onChange(value);
    }
  };
  const suffix = (
    <span style={{ lineHeight: '20px' }}>
      {(value) ? (value.length + defaultLen) : ((!value && defaultLen) ? defaultLen : 0) }/{!defaultLen ? max : 500}
    </span>
  );
  const params = {
    autoComplete: 'off',
    maxLength: max,
    placeholder,
    value,
    style,
    onChange: onIptChange,
    disabled,
  };
  return (
    <div>
      {type === 'input' && <Input {...params} suffix={suffix} />}
      {type === 'textArea' && (
        <div style={{ position: 'relative' }}>
          <TextArea {...params} rows={4} />
          <div className={styles.suffixttextarea}>{suffix}</div>
        </div>
      )}
    </div>
  );
});

export default InputCom;