import React, { useState } from 'react';
import { Upload, Button, Icon } from '@btri-ui/base';
import { UploadFile, UploadProps } from 'antd';

export default () => {
  const [fileList, setFileList] = useState<UploadFile[]>([]);

  const handleChange: UploadProps['onChange'] = ({
    fileList: newFileList,
    event,
  }) => {
    console.log(event, 444);

    setFileList(newFileList);
  };

  const uploadButton = (
    <div>
      <Icon iconName="PlusBig" style={{ fontSize: '24px' }} />
      <div style={{ marginTop: 8 }}>点击上传图片</div>
    </div>
  );

  return (
    <>
      <Upload
        action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
        fileList={fileList}
        onChange={handleChange}
        listType="picture-card"
        showUploadList={{
          showPreviewIcon: true,
          showRemoveIcon: true,
          showDownloadIcon: true,
        }}
        pictureCardTips="仅支持jpg、png格式"
        onDownload={() => {
          window.open(
            'https://static-dist-pub.oss-cn-hangzhou.aliyuncs.com/ibuilding-ui/static/images/ImageDemoPic1.png',
          );
        }}
      >
        {uploadButton}
      </Upload>
    </>
  );
};