import React, { useState, useCallback, useEffect } from 'react';
import IceContainer from '@icedesign/container';
import {
  Input,
  Button,
  Message,
  NumberPicker,
  DatePicker,
  Radio,
  Select,
  Checkbox
} from '@alifd/next';
import {
  FormBinderWrapper as IceFormBinderWrapper,
  FormBinder as IceFormBinder,
  FormError as IceFormError
} from '@icedesign/form-binder';
import styles from './formItem.module.scss';
const { Option } = Select;
import inputType from './inputType';
export default function ProductCommonPropertyFormItem({
  propertyItem,
  events
}) {
  const {
    propertyValueInputType,
    propertyKeyText,
    propertyKeyId,
    initValue
    // propertyValueVOList
  } = propertyItem;
  const [propertyValueVOList, setPropertyValueVOList] = useState([
    ...propertyItem.propertyValueVOList
  ]);

  useEffect(() => {
    setPropertyValueVOList(propertyItem.propertyValueVOList);
  }, [propertyItem]);

  if (propertyValueInputType == 7 || propertyValueInputType == 3) {
    return (
      <Select
        className={styles.goodsName}
        dataSource={propertyValueVOList}
        defaultValue={initValue}
        onChange={val => events.onChange(val, propertyKeyId)}
        itemRender={item => {
          return item.propertyValueText;
        }}
        valueRender={item => {
          return item.propertyValueText;
        }}
      />
    );
  }
  if (propertyValueInputType == 1) {
    return (
      <Input
        defaultValue={initValue}
        placeholder={propertyKeyText}
        className={styles.goodsName}
      />
    );
  }
  return null;
}