import React from 'react';
import ReactDOM from 'react-dom';
import Upload from '..';
import { Button, Dialog, Icon } from '../..';
const showImg = url => {
    Dialog.show({
        title: 'img preview',
        content: React.createElement("img", { src: url, style: { width: 400, height: 400 } }),
        footer: false,
    });
};
const actionRender = file => {
    console.log(file);
    return (React.createElement("span", { style: { position: 'absolute', right: 50 } },
        React.createElement(Button, { text: true, onClick: e => {
                e.preventDefault();
                showImg(file.url);
            }, size: "large" },
            React.createElement(Icon, { type: "eye", style: { marginRight: 12, cursor: 'pointer' } })),
        React.createElement(Button, { text: true, component: "a", href: file.url, target: "_blank" },
            React.createElement(Icon, { type: "download", style: { cursor: 'pointer' } }))));
};
const itemRender = file => {
    console.log(file);
    return (React.createElement("div", null,
        React.createElement("img", { src: file.url, style: { maxWidth: '100%', maxHeight: '100%' } }),
        React.createElement("div", { style: {
                position: 'absolute',
                top: 0,
                right: 0,
                bottom: 0,
                left: 0,
                background: 'rgba(0,0,0,.5)',
                color: '#ddd',
                display: 'flex',
                flexDirection: 'column',
                alignItems: 'center',
            } },
            React.createElement(Icon, { type: "eye", style: { marginTop: 40 } }),
            React.createElement("span", { style: { marginTop: 10 } }, "06:08"))));
};
const data = [
    {
        name: 'IMG.png',
        state: 'done',
        size: 100,
        url: 'https://img.alicdn.com/tps/TB19O79MVXXXXcZXVXXXXXXXXXX-1024-1024.jpg',
    },
];
ReactDOM.render(React.createElement("div", null,
    React.createElement(Upload, { listType: "text", action: "https://www.easy-mock.com/mock/5b713974309d0d7d107a74a3/alifd/upload", accept: "image/png, image/jpg, image/jpeg, image/gif, image/bmp", beforeUpload: beforeUpload, onChange: onChange, fileNameRender: file => (React.createElement("span", null, file.name)), defaultValue: data }),
    React.createElement(Upload, { listType: "image", action: "https://www.easy-mock.com/mock/5b713974309d0d7d107a74a3/alifd/upload", accept: "image/png, image/jpg, image/jpeg, image/gif, image/bmp", beforeUpload: beforeUpload, onChange: onChange, actionRender: actionRender, defaultValue: data }),
    React.createElement("br", null),
    React.createElement(Upload.Card, { listType: "card", accept: "image/png, image/jpg, image/jpeg, image/gif, image/bmp", defaultValue: data, 
        // @ts-ignore
        itemRender: itemRender }),
    ","), document.getElementById('upload-demo-12'));
function beforeUpload(info) {
    console.log('beforeUpload callback : ', info);
}
function onChange(info) {
    console.log('onChange callback : ', info);
}
