"use strict";

var _react = _interopRequireDefault(require("react"));

var _reactDom = _interopRequireDefault(require("react-dom"));

var _ = _interopRequireDefault(require(".."));

var _2 = require("../..");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

var showImg = function showImg(url) {
  _2.Dialog.show({
    title: 'img preview',
    content: /*#__PURE__*/_react["default"].createElement("img", {
      src: url,
      style: {
        width: 400,
        height: 400
      }
    }),
    footer: false
  });
};

var actionRender = function actionRender(file) {
  console.log(file);
  return /*#__PURE__*/_react["default"].createElement("span", {
    style: {
      position: 'absolute',
      right: 50
    }
  }, /*#__PURE__*/_react["default"].createElement(_2.Button, {
    text: true,
    onClick: function onClick(e) {
      e.preventDefault();
      showImg(file.url);
    },
    size: "large"
  }, /*#__PURE__*/_react["default"].createElement(_2.Icon, {
    type: "eye",
    style: {
      marginRight: 12,
      cursor: 'pointer'
    }
  })), /*#__PURE__*/_react["default"].createElement(_2.Button, {
    text: true,
    component: "a",
    href: file.url,
    target: "_blank"
  }, /*#__PURE__*/_react["default"].createElement(_2.Icon, {
    type: "download",
    style: {
      cursor: 'pointer'
    }
  })));
};

var itemRender = function itemRender(file) {
  console.log(file);
  return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement("img", {
    src: file.url,
    style: {
      maxWidth: '100%',
      maxHeight: '100%'
    }
  }), /*#__PURE__*/_react["default"].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'
    }
  }, /*#__PURE__*/_react["default"].createElement(_2.Icon, {
    type: "eye",
    style: {
      marginTop: 40
    }
  }), /*#__PURE__*/_react["default"].createElement("span", {
    style: {
      marginTop: 10
    }
  }, "06:08")));
};

var data = [{
  name: 'IMG.png',
  state: 'done',
  size: 100,
  url: 'https://img.alicdn.com/tps/TB19O79MVXXXXcZXVXXXXXXXXXX-1024-1024.jpg'
}];

_reactDom["default"].render( /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_["default"], {
  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: function fileNameRender(file) {
    return /*#__PURE__*/_react["default"].createElement("span", null, file.name);
  },
  defaultValue: data
}), /*#__PURE__*/_react["default"].createElement(_["default"], {
  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
}), /*#__PURE__*/_react["default"].createElement("br", null), /*#__PURE__*/_react["default"].createElement(_["default"].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);
}