zent
Version:
一套前端设计语言和基于React的实现
47 lines (46 loc) • 2.71 kB
JavaScript
import { __assign } from "tslib";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import cn from 'classnames';
import Icon from '../../../icon';
import InlineLoading from '../../../loading/InlineLoading';
import { FILE_UPLOAD_STATUS } from '../../constants';
import { useItemHandler } from '../../hooks/item-handler';
var getFileIcon = function (item) {
var status = item.status;
if (status === FILE_UPLOAD_STATUS.failed) {
return (_jsx(Icon, { className: "zent-single-upload-item-icon", type: "error-circle" }, void 0));
}
if (status === FILE_UPLOAD_STATUS.uploading) {
return (_jsx(InlineLoading, { className: "zent-single-upload-item-icon", loading: true, icon: "circle", iconSize: 14 }, void 0));
}
return null;
};
var SingleUploadItem = function (props) {
var _a, _b;
var i18n = props.i18n, item = props.item;
var _c = useItemHandler(props), deleteHandler = _c.deleteHandler, retryHandler = _c.retryHandler;
var isFailed = item.status === FILE_UPLOAD_STATUS.failed;
var isUploading = item.status === FILE_UPLOAD_STATUS.uploading;
var displayName = [
FILE_UPLOAD_STATUS.beforeUpload,
FILE_UPLOAD_STATUS.uploading,
].includes(item.status)
? i18n.uploading
: item.name;
var cls = cn('zent-single-upload-item', (_a = {},
_a['zent-single-upload-item__failed'] = isFailed,
_a['zent-single-upload-item__uploading'] = isUploading,
_a));
var actions = {
retry: (_jsx("a", __assign({ className: "zent-single-upload-item-retry", onClick: retryHandler, "data-zv": '10.0.17' }, { children: i18n.retry }), "retry")),
cancel: (_jsx("a", __assign({ onClick: deleteHandler, "data-zv": '10.0.17' }, { children: i18n.cancel }), "cancel")),
delete: (_jsx("a", __assign({ onClick: deleteHandler, "data-zv": '10.0.17' }, { children: i18n.delete }), "delete")),
};
var statusActions = (_b = {},
_b[FILE_UPLOAD_STATUS.uploading] = [actions.cancel],
_b[FILE_UPLOAD_STATUS.failed] = [actions.retry, actions.delete],
_b[FILE_UPLOAD_STATUS.success] = [actions.delete],
_b);
return (_jsx("div", __assign({ className: cls, "data-zv": '10.0.17' }, { children: _jsxs("div", __assign({ className: "zent-single-upload-item-info", "data-zv": '10.0.17' }, { children: [getFileIcon(item), _jsx("div", __assign({ className: "zent-single-upload-item-name", "data-zv": '10.0.17' }, { children: displayName }), void 0), _jsx("div", __assign({ className: "zent-single-upload-item-actions", "data-zv": '10.0.17' }, { children: statusActions[item.status] }), void 0)] }), void 0) }), item.id));
};
export default SingleUploadItem;