zent/es/upload/Upload.js

一套前端设计语言和基于React的实现

import { __assign, __extends } from "tslib";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import cn from 'classnames';
import AbstractMultiUpload from './components/AbstractMultiUpload';
import NormalUploadList from './components/normal/List';
import NormalUploadTrigger from './components/normal/Trigger';
import { DEFAULT_ENABLE_MULTIPLE, DEFAULT_MAX_AMOUNT, DEFAULT_MAX_SIZE, FILE_UPLOAD_STATUS, } from './constants';
import { formatFileSize } from './utils/format-file-size';
import { getTipsContent } from './utils/get-tips-content';
import { I18nReceiver } from '../i18n';
import { createBaseNewUploadFileItem } from './utils/create-new-upload-file-item';
var Upload = (function (_super) {
    __extends(Upload, _super);
    function Upload() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    Upload.prototype.createNewUploadFileItem = function (file) {
        return createBaseNewUploadFileItem(file);
    };
    Upload.prototype.renderTips = function () {
        var _a = this.props, tips = _a.tips, maxSize = _a.maxSize;
        var config = __assign(__assign({}, this.props), { formattedMaxSize: formatFileSize(maxSize) });
        var tipsContent = getTipsContent(tips, config);
        return (tipsContent && _jsx("div", __assign({ className: "zent-file-upload-tips", "data-zv": '10.0.17' }, { children: tipsContent }), void 0));
    };
    Upload.prototype.renderUploadList = function (i18n) {
        var _a = this.props, sortable = _a.sortable, pagination = _a.pagination, pageSize = _a.pageSize, customUploadItem = _a.customUploadItem;
        return (_jsx(NormalUploadList, { i18n: i18n, fileList: this.fileList, onRetry: this.retryUploadItem, onDelete: this.deleteUploadItem, onSortChange: this.updateFileList, sortable: sortable, pagination: pagination, pageSize: pageSize, customUploadItem: customUploadItem }, void 0));
    };
    Upload.prototype.renderTrigger = function (i18n) {
        var _a = this
            .props, accept = _a.accept, maxAmount = _a.maxAmount, maxSize = _a.maxSize, multiple = _a.multiple, disabled = _a.disabled;
        var fileList = this.state.fileList;
        return (_jsx(NormalUploadTrigger, { i18n: i18n, accept: accept, maxAmount: maxAmount, maxSize: maxSize, multiple: multiple, disabled: disabled, remainAmount: this.remainAmount, fileList: fileList, onAddFile: this.onTriggerUploadFile, onError: this.emitOnError }, void 0));
    };
    Upload.prototype.render = function () {
        var _this = this;
        var className = this.props.className;
        return (_jsx(I18nReceiver, __assign({ componentName: "Upload" }, { children: function (i18n) {
                return (_jsxs("div", __assign({ className: cn('zent-file-upload', className), "data-zv": '10.0.17' }, { children: [_this.renderUploadList(i18n), _jsxs("div", __assign({ className: "zent-file-upload-trigger-wrapper", "data-zv": '10.0.17' }, { children: [_this.renderTrigger(i18n), _this.renderTips()] }), void 0)] }), void 0));
            } }), void 0));
    };
    Upload.defaultProps = {
        maxAmount: DEFAULT_MAX_AMOUNT,
        maxSize: DEFAULT_MAX_SIZE,
        multiple: DEFAULT_ENABLE_MULTIPLE,
        manualUpload: false,
        sortable: false,
        pageSize: 5,
        pagination: false,
    };
    Upload.FILE_UPLOAD_STATUS = FILE_UPLOAD_STATUS;
    return Upload;
}(AbstractMultiUpload));
export { Upload };
export default Upload;