import React, { useEffect, useState } from 'react';
import moment from 'moment';
import { DatePicker } from 'antd';

/**
 * 主要是做了一个日期的格式转换
 */
export default (props) => {
  const { value, onChange, ...leftProps } = props;
  const [val, setVal] = useState(value ? moment(value, 'YYYY-MM-DD HH:mm') : undefined);

  const handelChange = (e) => {
    if (onChange) {
      onChange(e ? e.format('YYYY-MM-DD HH:mm') : undefined);
    }
  }

  useEffect(() => {
    setVal(value ? moment(value, 'YYYY-MM-DD HH:mm') : undefined);
  }, [value])

  return (
    <DatePicker value={val} showTime={{ format: 'HH:mm' }} format="YYYY-MM-DD HH:mm"  {...leftProps} onChange={handelChange} />
  )
}