knk/lib/components/basic/view/file_preview.js

react components based on react

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _react = _interopRequireWildcard(require("react"));
var _antd = require("antd");
var _entry = require("react-pdf/build/entry.noworker");
var _tool = require("../../../common/tool");
var _propTypes = _interopRequireDefault(require("prop-types"));
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
/**
 * 文件预览组件
 */

var FilePreview = function FilePreview(props) {
  var _useState = (0, _react.useState)(false),
    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
    modal = _useState2[0],
    setModal = _useState2[1];
  var _useState3 = (0, _react.useState)(null),
    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
    numPages = _useState4[0],
    setnumPages = _useState4[1];
  var handleDocumentLoad = function handleDocumentLoad(_ref) {
    var pages = _ref.pages;
    setnumPages(pages);
  };
  var handleCloseModal = function handleCloseModal() {
    setModal(false);
  };
  var path = props.path,
    children = props.children;
  var match = path.match(/\.(pdf|jpg|jpeg|png|gif)/i);
  var suffix = match ? match[1] : '';
  switch (suffix) {
    case 'pdf':
      return /*#__PURE__*/_react.default.createElement("div", {
        className: "app-file-preview"
      }, /*#__PURE__*/_react.default.createElement("div", {
        onClick: function onClick(e) {
          e.preventDefault();
          setModal(true);
        }
      }, children), /*#__PURE__*/_react.default.createElement(_antd.Modal, {
        title: "PDF\u9884\u89C8",
        style: {
          top: 10
        },
        width: 800,
        visible: modal,
        footer: null,
        onCancel: handleCloseModal
      }, /*#__PURE__*/_react.default.createElement("div", {
        className: "app-pdf"
      }, /*#__PURE__*/_react.default.createElement("div", {
        className: "app-pdf-container"
      }, /*#__PURE__*/_react.default.createElement("div", {
        className: "app-pdf-container-document"
      }, /*#__PURE__*/_react.default.createElement(_entry.Document, {
        error: "\u8F7D\u5165PDF\u6587\u4EF6\u9519\u8BEF",
        loading: "\u8F7D\u5165PDF\u6587\u4EF6\u4E2D,\u8BF7\u7A0D\u540E",
        file: "/file/?path=".concat(encodeURIComponent(path)),
        onLoadSuccess: handleDocumentLoad,
        onLoadError: _tool.log.info
      }, Array.from(new Array(numPages), function (el, index) {
        return /*#__PURE__*/_react.default.createElement(_entry.Page, {
          key: "page_".concat(index + 1),
          pageNumber: index + 1,
          width: Math.min(600, document.body.clientWidth - 52)
        });
      })))))));
    case 'jpg':
    case 'jpeg':
    case 'png':
    case 'gift':
      return /*#__PURE__*/_react.default.createElement("div", {
        className: "app-file-preview"
      }, /*#__PURE__*/_react.default.createElement("div", {
        onClick: function onClick(e) {
          e.preventDefault();
          setModal(true);
        }
      }, children), /*#__PURE__*/_react.default.createElement(_antd.Modal, {
        title: "\u56FE\u7247\u9884\u89C8",
        visible: modal,
        footer: null,
        onCancel: handleCloseModal
      }, /*#__PURE__*/_react.default.createElement("div", {
        className: "app-file-preview-image"
      }, /*#__PURE__*/_react.default.createElement("a", {
        href: path,
        target: "_blank",
        rel: "noopener noreferrer"
      }, /*#__PURE__*/_react.default.createElement("img", {
        src: path
      })))));
    default:
      return /*#__PURE__*/_react.default.createElement("div", {
        className: "app-file-preview"
      }, children);
  }
};
FilePreview.propTypes = {
  path: _propTypes.default.string,
  children: _propTypes.default.any
};
var _default = exports.default = FilePreview;