mobile-more
Version:
基于 antd-mobile v5 扩展移动端 UI 组件
94 lines • 4.19 kB
JavaScript
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
var _excluded = ["file", "renderView", "unsupportedTipText", "iframeToolbar", "closeIcon", "imageRender", "renderFooter", "onClose"];
import React, { useMemo } from 'react';
import { isNil } from 'ut2';
import { download } from 'util-helpers';
import classNames from 'classnames';
import { XLg } from 'doly-icons';
import { ImageViewer } from 'antd-mobile';
import MediaViewer from './MediaViewer';
import { getFileThumbUrl, isValidPdfUrl, supports, transformUploadFile } from './utils';
import { prefixClass } from '../../config';
import "./index.css";
var prefixCls = "".concat(prefixClass, "-file-viewer");
var BizFileViewer = function BizFileViewer(props) {
var file = props.file,
renderView = props.renderView,
customUnsupportedTipText = props.unsupportedTipText,
_props$iframeToolbar = props.iframeToolbar,
iframeToolbar = _props$iframeToolbar === void 0 ? false : _props$iframeToolbar,
closeIcon = props.closeIcon,
imageRender = props.imageRender,
_renderFooter = props.renderFooter,
onClose = props.onClose,
restProps = _objectWithoutProperties(props, _excluded);
var fileInfo = useMemo(function () {
return transformUploadFile(file);
}, [file]);
return /*#__PURE__*/React.createElement(ImageViewer, _objectSpread(_objectSpread({
imageRender: fileInfo.fileType === 'image' ? imageRender : function () {
var view;
if (imageRender) {
view = imageRender.apply(void 0, arguments);
} else {
if (fileInfo.fileType === 'pdf') {
if (isValidPdfUrl(fileInfo.url)) {
view = /*#__PURE__*/React.createElement("iframe", {
src: fileInfo.url + (iframeToolbar ? '' : '#toolbar=0'),
style: {
border: '0 none',
width: '75vw',
height: '80vh'
}
});
}
} else if (fileInfo.fileType === 'audio' || fileInfo.fileType === 'video') {
view = /*#__PURE__*/React.createElement(MediaViewer, {
url: fileInfo.url,
mediaType: fileInfo.fileType
});
}
if (typeof renderView === 'function') {
view = renderView(view, fileInfo);
}
if (isNil(view) || view === false) {
if (typeof customUnsupportedTipText === 'function') {
view = customUnsupportedTipText(fileInfo);
} else if (customUnsupportedTipText) {
view = customUnsupportedTipText;
} else {
view = /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-unsupported")
}, "\u8BE5\u6587\u4EF6\u4E0D\u652F\u6301\u9884\u89C8\uFF0C\u4F60\u53EF\u4EE5", /*#__PURE__*/React.createElement("a", {
onClick: function onClick() {
return download(fileInfo.url, {
dataType: 'url',
fileName: fileInfo.name
});
}
}, "\u70B9\u51FB\u4E0B\u8F7D"), "\u540E\u67E5\u770B\u3002");
}
}
}
return /*#__PURE__*/React.createElement("div", {
className: classNames(prefixCls, _defineProperty({}, "".concat(prefixCls, "-").concat(fileInfo.fileType), !!fileInfo.fileType))
}, view);
},
onClose: onClose
}, restProps), {}, {
image: fileInfo.url,
renderFooter: function renderFooter(image) {
var footerContent = _renderFooter === null || _renderFooter === void 0 ? void 0 : _renderFooter(image);
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-preview-close"),
onClick: onClose
}, closeIcon || /*#__PURE__*/React.createElement(XLg, null)), footerContent);
}
}));
};
BizFileViewer.getFileThumbUrl = getFileThumbUrl;
BizFileViewer.transformUploadFile = transformUploadFile;
BizFileViewer.supports = supports;
export default BizFileViewer;