@cloudbase/weda-ui 3.2.1 → 3.3.1

package/dist/web/components/form/uploader/uploader.pc.d.ts

@@ -1,29 +0,0 @@
-/// <reference types="react" />
-import { H5UploaderProps } from './uploader.h5';
-export declare const CLASS_PREFIX = "weda-uploader-pc";
-export declare const IMAGE_TYPES: string[];
-/**
- * 上传图片-官方组件
- */
-export declare function UploaderPC({ layout, className, id, style, title, tips, ...props }: {
-    [x: string]: any;
-    layout: any;
-    className: any;
-    id: any;
-    style: any;
-    title: any;
-    tips: any;
-}): JSX.Element;
-export declare function UploaderPCInner(props: any): JSX.Element;
-export interface TcbImageProps {
-    fileID?: string;
-    isZoom?: boolean;
-    onError?: (e: unknown) => void;
-}
-export declare const TcbImage: (props: TcbImageProps) => JSX.Element;
-export interface PropsType extends H5UploaderProps {
-    tips?: string;
-    value: string | string[];
-    btnTitle?: string;
-    uploadPath?: string;
-}

package/dist/web/components/form/uploader/uploader.pc.js

@@ -1,214 +0,0 @@
-import * as React from 'react';
-import { Upload, Button, Icon, message, ErrorTip, ImagePreview, ConfigProvider, } from 'tea-component';
-import classNames from '../../../utils/classnames';
-import { getCloudInstance, getTempFileURL } from '../../../utils/tcb';
-import { isCloudFileID, randomStr } from '../../../utils/platform';
-import isObjectEqual from '../../../utils/isObjectEqual';
-import { emptyObject } from '../../../utils/constant';
-// 默认组件类前缀
-export const CLASS_PREFIX = 'weda-uploader-pc';
-// 默认图片类型
-export const IMAGE_TYPES = [
-    'image/jpg',
-    'image/png',
-    'image/tif',
-    'image/bmp',
-    'image/jpeg',
-    'image/tiff',
-    'image/gif',
-];
-/**
- * 上传图片-官方组件
- */
-// eslint-disable-next-line react/prop-types
-export function UploaderPC({ layout, className, id, style, title, tips, ...props }) {
-    const cls = classNames({
-        'weda-ui': true,
-        [CLASS_PREFIX]: true,
-        [layout]: layout,
-        [className]: className,
-    });
-    return (React.createElement("div", { className: cls, id: id, style: style },
-        React.createElement("div", { className: `${CLASS_PREFIX}__header` },
-            title && React.createElement("div", { className: `${CLASS_PREFIX}__title` }, title),
-            tips && (React.createElement("div", { className: `${CLASS_PREFIX}__description` }, tips || ''))),
-        React.createElement(UploaderPCInner, { ...props })));
-}
-export function UploaderPCInner(props) {
-    const { tips = '', btnTitle = '上传图片', maxUploadCount = 9, maxSize = 10, value: defaultValue, // 需要兼容 cloud:和https: 协议，需要兼容 字符串和字符串数组
-    acceptTypes = IMAGE_TYPES, uploadPath = 'weda-uploader', events = emptyObject, single = false, disabled = false, onChange, } = props;
-    // 上传中
-    const [uploading, setUploading] = React.useState(false);
-    //上传进度
-    const [progress, setProgress] = React.useState(0);
-    // 文件列表
-    const [fileIDList, setfileIDList] = React.useState([]);
-    const fileRef = React.useRef([]);
-    React.useEffect(() => {
-        let initialValue = []
-            .concat(defaultValue)
-            .filter((d) => typeof d === 'string' && d !== '');
-        if (single) {
-            initialValue = initialValue[0] ? [initialValue[0]] : [];
-        }
-        setfileIDList(initialValue);
-    }, [defaultValue]);
-    // 值变化事件
-    React.useEffect(() => {
-        if (!isObjectEqual(fileRef.current, fileIDList)) {
-            if (single) {
-                const file = fileIDList[0] || '';
-                onChange && onChange(file);
-                events.change && events.change({ value: file });
-            }
-            else {
-                onChange && onChange(fileIDList);
-                events.change && events.change({ value: fileIDList });
-            }
-            fileRef.current = fileIDList;
-        }
-    });
-    //验证上传文件类型是否合法
-    const islegalType = (files, accepts) => {
-        const illegalType = [];
-        let isImage = true;
-        for (const file of files) {
-            if ((file === null || file === void 0 ? void 0 : file.type.split('/')[0]) !== 'image') {
-                message.error({ content: '请上传图片' });
-                isImage = false;
-                break;
-            }
-            accepts.some((item) => item === (file === null || file === void 0 ? void 0 : file.type))
-                ? null
-                : illegalType.push(file === null || file === void 0 ? void 0 : file.type);
-        }
-        if (!isImage)
-            return false;
-        if (illegalType.length > 0) {
-            message.error({
-                content: '不支持上传' +
-                    Array.from(new Set(illegalType)).join(',') +
-                    '格式图片',
-            });
-            return false;
-        }
-        return true;
-    };
-    // 方法：上传前，判断图片大小、数量是否满足，取消默认组件的上传事件，用自定义的 tcb 上传方法
-    const beforeHandle = (file, fileList, isAccepted, error) => {
-        if (!islegalType(fileList, extraProps['accept']))
-            return;
-        if (!isAccepted) {
-            try {
-                const errorList = [];
-                if (error.find((item) => (item === null || item === void 0 ? void 0 : item.code) === 'file-invalid-type')) {
-                    errorList.push('上传图片类型错误');
-                }
-                if (error.find((item) => (item === null || item === void 0 ? void 0 : item.code) === 'file-too-large')) {
-                    errorList.push(`上传图片大小不能超过${maxSize}M`);
-                }
-                message.error({ content: errorList.join(', ') });
-            }
-            catch (e) { }
-            return false;
-        }
-        uploadTcb(file);
-        return false;
-    };
-    // 自定义上传到 Tcb 的 COS
-    const uploadTcb = (file) => {
-        setUploading(true);
-        getCloudInstance().then(async (tcb) => {
-            try {
-                const cloudPath = `${uploadPath}/${randomStr()}-${file === null || file === void 0 ? void 0 : file.name}`;
-                const { fileID } = await tcb.uploadFile({
-                    cloudPath,
-                    filePath: file,
-                    onUploadProgress: onProgress,
-                });
-                fileID && setfileIDList((list) => [...list, fileID]);
-                fileID && events.success && events.success({ value: fileID, file });
-            }
-            catch (err) {
-                message.error({ content: `${err}` || '上传失败' });
-                events.error && events.error(err);
-            }
-            finally {
-                setUploading(false);
-                setProgress(0);
-            }
-        });
-    };
-    // 计算上传进度
-    const onProgress = (progressEvent) => {
-        let percentCompleted = 0;
-        try {
-            percentCompleted = Math.round((progressEvent.loaded * 100) / progressEvent.total);
-            percentCompleted < 100 ? percentCompleted : 100;
-        }
-        catch (e) { }
-        setProgress(percentCompleted);
-    };
-    // 删除图片
-    const deleteHandle = (fileID) => {
-        setfileIDList((list) => list.filter((d) => d !== fileID));
-    };
-    // 转换后的属性
-    const extraProps = {};
-    extraProps['accept'] =
-        acceptTypes.includes('image/*') || acceptTypes.length === 0
-            ? IMAGE_TYPES
-            : Array.from(new Set(acceptTypes));
-    tips && (extraProps['title'] = tips);
-    maxSize && (extraProps['maxSize'] = maxSize * 1024 * 1024);
-    return (React.createElement(ConfigProvider, { classPrefix: "wedatea2td" },
-        React.createElement("div", { className: "_weda-fn-upload-result" },
-            fileIDList.map((d) => (React.createElement("div", { className: "_weda-fn-upload-result__item", key: d },
-                React.createElement(TcbImage, { fileID: d }),
-                React.createElement("div", { className: "_weda-fn-upload-result__op" },
-                    React.createElement(Button, { disabled: disabled, onClick: () => deleteHandle(d), className: `${CLASS_PREFIX}__btn` }, "\u5220\u9664"))))),
-            uploading && (React.createElement("div", { className: "_weda-fn-upload-result__item" },
-                React.createElement("div", { className: "_weda-fn-upload-result__status", key: "_place_image" },
-                    React.createElement(Icon, { type: "loading" }),
-                    !!progress && (React.createElement("span", { className: "wedatea2td-mt-1n wedatea2td-text-label wedatea2td-fz-reset" },
-                        "\u4E0A\u4F20",
-                        progress,
-                        "%..."))))),
-            React.createElement("div", { className: `${CLASS_PREFIX}__input-box` }, disabled ? (React.createElement("li", { className: "_weda-fn-upload-result__item wedatea2td-disabled" },
-                React.createElement("div", { className: "_weda-fn-upload-result__status" },
-                    React.createElement("i", { className: "wedatea2td-icon wedatea2td-icon-plus", role: "img", "aria-label": "plus" }),
-                    React.createElement("span", { className: "wedatea2td-mt-1n wedatea2td-text-label wedatea2td-fz-reset" }, btnTitle)))) : (((!single && fileIDList.length < maxUploadCount) ||
-                (single && fileIDList.length < 1)) && ( // single 模式时，仅当数组为空时显示
-            React.createElement(Upload, { ...extraProps, beforeUpload: beforeHandle },
-                React.createElement("li", { className: "_weda-fn-upload-result__item _weda-fn-upload-result__item--upload" },
-                    React.createElement("div", { className: "_weda-fn-upload-result__status" },
-                        React.createElement("i", { className: "wedatea2td-icon wedatea2td-icon-plus", role: "img", "aria-label": "plus" }),
-                        React.createElement("span", { className: "wedatea2td-mt-1n wedatea2td-text-label wedatea2td-fz-reset" }, btnTitle))))))))));
-}
-export const TcbImage = (props) => {
-    const { fileID, isZoom, ...rest } = props;
-    const [src, setSrc] = React.useState('');
-    const [isError, setIsError] = React.useState(false);
-    React.useEffect(() => {
-        const getSrc = async () => {
-            try {
-                const url = await getTempFileURL(fileID);
-                const _src = encodeURI(url);
-                _src ? setSrc(_src) : setIsError(true);
-            }
-            catch (e) {
-                message.error({ content: '图片加载失败' });
-            }
-        };
-        isCloudFileID(fileID) ? getSrc() : setSrc(fileID);
-    }, [fileID]);
-    return isError ? (React.createElement(ErrorTip, null)) : src ? (isZoom ? (React.createElement(ImagePreview, { key: fileID, className: `${CLASS_PREFIX}__image`, ...rest, src: src, previewSrc: src, 
-        /** @ts-expect-error tea imagepreview onError */
-        onError: (e) => {
-            setIsError(true);
-            (props === null || props === void 0 ? void 0 : props.onError) && props.onError(e);
-        } })) : (React.createElement("img", { key: fileID, className: `${CLASS_PREFIX}__image`, ...rest, src: src, onError: (e) => {
-            setIsError(true);
-            (props === null || props === void 0 ? void 0 : props.onError) && props.onError(e);
-        } }))) : null;
-};

package/dist/web/components/form/uploaderFile/index.d.ts

@@ -1,4 +0,0 @@
-/**
- * 文件组件上传，区分 h5端/pc端
- */
-export default function UploaderFile(props: any): JSX.Element;

package/dist/web/components/form/uploaderFile/index.js

@@ -1,19 +0,0 @@
-/* eslint-disable react/prop-types */
-import * as React from 'react';
-import { usePlatform } from '../../../utils/platform';
-import { UploadFileH5 as UploaderH5 } from './uploadFile.h5';
-import { UploadFilePc } from './uploadFile.pc';
-import './index.css';
-/**
- * 文件组件上传，区分 h5端/pc端
- */
-export default function UploaderFile(props) {
-    const platform = usePlatform();
-    if ((props === null || props === void 0 ? void 0 : props.showType) === 'pc') {
-        return React.createElement(UploadFilePc, { ...props });
-    }
-    if ((props === null || props === void 0 ? void 0 : props.showType) === 'h5') {
-        return React.createElement(UploaderH5, { ...props });
-    }
-    return platform === 'h5' ? (React.createElement(UploaderH5, { ...props })) : (React.createElement(UploadFilePc, { ...props }));
-}

package/dist/web/components/form/uploaderFile/uploadFile.h5.d.ts

@@ -1,23 +0,0 @@
-/// <reference types="react" />
-import type { CommonFormPropsType } from '../types';
-export declare const FILES_TYPES: string[];
-export declare function UploadFileH5({ layout, id, style, labelVisible, label, requiredFlag, disabled, className, acceptTypes, tips, btnTitle, maxUploadCount, maxSize, deleteVisible, downloadVisible, value, // 需要兼容 cloud:和https: 协议，需要兼容字符串和字符串数组
-events, defaultValue, uploadPath, single, onChange, isEdit, }: IUploadFileH5): JSX.Element;
-export interface IUploadFileH5 extends CommonFormPropsType {
-    className?: string;
-    label?: string;
-    tips?: string;
-    btnTitle?: string;
-    maxUploadCount?: number;
-    deleteVisible?: boolean;
-    downloadVisible?: boolean;
-    acceptTypes?: Readonly<string[] | string>;
-    disabled?: boolean;
-    defaultValue?: string | string[];
-    maxSize?: number;
-    value?: Readonly<string | string[]>;
-    uploadPath?: string;
-    single?: boolean;
-    onChange?: (v: any) => void;
-    isEdit: boolean;
-}

package/dist/web/components/form/uploaderFile/uploadFile.h5.js

@@ -1,337 +0,0 @@
-import * as React from 'react';
-import weui from '../../../utils/weui';
-import isObjectEqual from '../../../utils/isObjectEqual';
-import { ConfigProvider, Button, Icon, Text, List, Progress, Tooltip, } from 'tea-component';
-import { filterStrList, isCloudFileID, isHttpFileID, transSize, downloadFile, transFileCloudidToName, randomStr, } from '../../../utils/platform';
-import { getCloudInstance, getTempFileURL } from '../../../utils/tcb';
-import classNames from '../../../utils/classnames';
-import { renderDecorator } from '../renderDecorator';
-import { emptyArray, emptyObject } from '../../../utils/constant';
-// 默认组件类前缀
-const CLASS_PREFIX = 'weda-upload-file-mobile';
-// 默认图片类型
-export const FILES_TYPES = [
-    '.doc',
-    '.docx',
-    '.xml',
-    'application/msword',
-    'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
-];
-// 上传状态字典
-const statusMap = {
-    UPLOAD_STATUS_PENDING: { title: '等待上传', icon: 'pending' },
-    UPLOAD_STATUS_LOADING: { title: '上传中', icon: 'loading' },
-    UPLOAD_STATUS_SUCCESS: { title: '上传成功', icon: 'success' },
-    UPLOAD_STATUS_ERROR: { title: '上传失败', icon: 'error' },
-};
-// 上传文件Context
-const FileContext = React.createContext(null);
-/**
- * 上传文件 H5 版本
- */
-const defaultStyle = { margin: '0,-5px' };
-export function UploadFileH5({ 
-// 系统属性
-layout, id = '', style = defaultStyle, labelVisible = true, label = '上传文件', requiredFlag = false, disabled = false, className = '', acceptTypes = emptyArray, 
-// 组件属性
-tips = '', btnTitle = '点击上传', maxUploadCount = 9, maxSize = 10, deleteVisible = true, downloadVisible = true, value = emptyArray, // 需要兼容 cloud:和https: 协议，需要兼容字符串和字符串数组
-events = emptyObject, defaultValue, uploadPath = 'weda-uploader', single = true, onChange = null, isEdit = true, }) {
-    const [fileIDList, setfileIDList] = React.useState(filterStrList([].concat(defaultValue, value))); // 上传成功文件ID列表，fileID[]
-    const [fileList, setFileList] = React.useState([]); // 上传中的文件列表，file[]，file为原始文件 + uuid属性
-    const [fileSizeObj, setFileSizeObj] = React.useState({}); // 管理上传文件大小 {uuid:size}
-    // 两次默认值不同, 需要刷新
-    const prevDefaultRef = React.useRef([]);
-    const fileRef = React.useRef(fileIDList);
-    React.useMemo(() => {
-        //有有效默认值时不刷新，解决初次渲染默认值不显示问题
-        if (defaultValue &&
-            !isObjectEqual(prevDefaultRef.current, defaultValue) &&
-            (JSON.stringify(prevDefaultRef.current) == '[]' ||
-                !prevDefaultRef.current)) {
-            prevDefaultRef.current = defaultValue;
-            setfileIDList(filterStrList([].concat(defaultValue)));
-        }
-    }, [defaultValue]);
-    React.useEffect(() => {
-        var _a, _b, _c;
-        // 外部 onChange 事件
-        const pureFileIDList = fileIDList.filter((d) => isCloudFileID(d) || isHttpFileID(d));
-        if (single) {
-            const file = pureFileIDList[0] || '';
-            file && onChange && onChange(file);
-            (_a = events === null || events === void 0 ? void 0 : events.change) === null || _a === void 0 ? void 0 : _a.call(events, { value: file });
-        }
-        else {
-            onChange && onChange(pureFileIDList);
-            (_b = events === null || events === void 0 ? void 0 : events.change) === null || _b === void 0 ? void 0 : _b.call(events, { value: pureFileIDList });
-        }
-        if (!isObjectEqual(fileRef.current, fileIDList)) {
-            (_c = events === null || events === void 0 ? void 0 : events.success) === null || _c === void 0 ? void 0 : _c.call(events, { value: pureFileIDList });
-            fileRef.current = fileIDList;
-        }
-    }, [fileIDList]);
-    // 外层组件类
-    const cls = classNames({
-        'weda-ui': true,
-        //'weui-cells': true,
-        //'weui-cells_form': true,
-        'weui-cells_checkbox': true,
-        [className]: className,
-    });
-    const accepts = React.useMemo(() => {
-        return acceptTypes.includes('*') || acceptTypes.length === 0
-            ? ['*']
-            : Array.from(new Set(acceptTypes));
-    }, [acceptTypes]);
-    const islegalType = (files, accepts) => {
-        const illegalType = [];
-        for (const file of files) {
-            accepts.some((item) => item === (file === null || file === void 0 ? void 0 : file.type))
-                ? null
-                : illegalType.push(file === null || file === void 0 ? void 0 : file.type);
-        }
-        if (illegalType.length > 0) {
-            weui.alert('不支持上传' + Array.from(new Set(illegalType)).join(',') + '格式文件');
-            return false;
-        }
-        return true;
-    };
-    // 上传后文件列表 fileIDList 改变事件，'add'|'delete'
-    const handleChange = ({ fileID, uuid, type, size }) => {
-        // 上传时新增事件
-        if (type === 'add') {
-            fileID && setFileSizeObj((obj) => ({ ...obj, [fileID]: size }));
-            fileID && setfileIDList((fileIDList) => [...fileIDList, fileID]);
-        }
-        else {
-            fileID &&
-                setfileIDList((fileIDList) => fileIDList.filter((f) => f !== fileID));
-        }
-        uuid && setFileList((list) => list.filter((item) => uuid !== (item === null || item === void 0 ? void 0 : item._uuid)));
-    };
-    // 上传组件属性
-    const uploadProps = {
-        multiple: !single,
-    };
-    tips && (uploadProps['label'] = tips);
-    maxSize && (uploadProps['maxSize'] = maxSize * 1024 * 1024);
-    const btnDisabled = fileIDList.length >= maxUploadCount ||
-        (single && fileIDList.length > 0) ||
-        disabled;
-    return renderDecorator(React.createElement(ConfigProvider, { classPrefix: "wedatea2td" },
-        React.createElement(FileContext.Provider, { value: {
-                uploadPath,
-                downloadVisible,
-                deleteVisible,
-                onChange: handleChange,
-                isEdit,
-                events,
-                fileSizeObj,
-            } },
-            React.createElement("div", { "data-testid": "uploadFileH5", className: cls, id: id, style: style },
-                React.createElement("div", { className: classNames(`${CLASS_PREFIX}`) },
-                    isEdit && (React.createElement("div", { className: classNames(`${CLASS_PREFIX}__hd`, layout) },
-                        React.createElement("div", null, btnDisabled ? (React.createElement(Button, { type: "weak", className: classNames(`${CLASS_PREFIX}__btn--weak`), disabled: btnDisabled }, btnTitle)) : (React.createElement("div", null,
-                            React.createElement("input", { id: "uploaderInput", type: "file", "data-testid": "button-up", className: "weui-uploader-mobile__input", accept: accepts.join(','), multiple: !single, onChange: (e) => {
-                                    const fileList = [...e.target.files];
-                                    //校验逻辑与图片有出入，文件类型限制为全部时，不设限
-                                    if (!(accepts.includes('*') ||
-                                        accepts.includes('') ||
-                                        accepts.length === 0) &&
-                                        !islegalType(fileList, accepts))
-                                        return;
-                                    if (single && fileList.length > 1) {
-                                        weui.alert(`上传文件总数不能超过1个`);
-                                        return false;
-                                    }
-                                    if (fileList.length + fileIDList.length >
-                                        maxUploadCount) {
-                                        weui.alert(`上传文件总数不能超过${maxUploadCount}个`);
-                                        return false;
-                                    }
-                                    if (maxSize &&
-                                        fileList.some((f) => f.size > maxSize * 1024 * 1024)) {
-                                        weui.alert(`请上传不超过${maxSize}M的文件`);
-                                        return false;
-                                    }
-                                    if (fileList.some((f) => f.size > 1024 * 1024 * 1024)) {
-                                        weui.alert(`请上传不超过1024M的文件`);
-                                        return false;
-                                    }
-                                    fileList.forEach((f) => (f['_uuid'] = randomStr()));
-                                    setFileList((list) => [...list, ...fileList]);
-                                } }),
-                            React.createElement("a", { type: "weak", className: "wedatea2td-btn wedatea2td-btn--weak", style: { fontSize: '1em' } }, "\u70B9\u51FB\u4E0A\u4F20"),
-                            !single && (React.createElement(Text, { className: `${CLASS_PREFIX}__tips` }, "\u652F\u6301\u6279\u91CF\u4E0A\u4F20"))))))),
-                    React.createElement("div", { className: `${CLASS_PREFIX}__bd` },
-                        React.createElement(List, null,
-                            fileIDList.map((d) => (React.createElement(List.Item, { key: d }, React.createElement(TcbFileEcho, { fileID: d, fileList: fileList, onChange: handleChange, disabled: disabled, deleteVisible: deleteVisible, downloadVisible: downloadVisible })))),
-                            fileList.map((item) => (React.createElement(List.Item, { key: item === null || item === void 0 ? void 0 : item._uuid }, React.createElement(TcbFileUpload, { disabled: disabled, file: item, downloadVisible: downloadVisible, deleteVisible: deleteVisible && !disabled })))))))))))({
-        id,
-        className: cls,
-        style,
-        label: labelVisible ? label : null,
-        layout,
-        multiCell: false,
-        requiredFlag,
-    });
-}
-/**
- * 基于 FileID 文件回显组件
- */
-const TcbFileEcho = ({ fileID, disabled }) => {
-    const [src, setSrc] = React.useState('');
-    const { fileSizeObj } = React.useContext(FileContext) || {};
-    React.useEffect(() => {
-        const fetchFileId = async (id) => {
-            if (isCloudFileID(id)) {
-                try {
-                    const fileSrc = await getTempFileURL(id);
-                    setSrc(fileSrc);
-                }
-                catch (e) { }
-            }
-            else {
-                setSrc(id);
-            }
-        };
-        fetchFileId(fileID);
-    }, [fileID]);
-    //上传文件名称
-    const label = React.useMemo(() => {
-        if (isCloudFileID(fileID)) {
-            return transFileCloudidToName(fileID);
-        }
-        else {
-            return fileID;
-        }
-    }, [fileID]);
-    //上传文件列表展示
-    return (React.createElement("div", { className: `${CLASS_PREFIX}__item` },
-        React.createElement("div", { className: `${CLASS_PREFIX}__item-left` },
-            React.createElement(UploadFileStatus, { title: label, size: fileSizeObj[fileID] || '--' })),
-        React.createElement("div", { className: `${CLASS_PREFIX}__btn-group` },
-            React.createElement(UploadFileAction, { disabled: disabled, status: "UPLOAD_STATUS_SUCCESS", fileID: fileID, src: src }))));
-};
-/**
- * 基于 File 上传文件过程组件
- */
-const TcbFileUpload = ({ file, disabled }) => {
-    const { uploadPath, onChange, events } = React.useContext(FileContext) || {};
-    const [percent, setPercent] = React.useState(0); // 上传进度
-    const [status, setStatus] = React.useState('UPLOAD_STATUS_PENDING'); // 上传状态
-    const cancleRef = React.useRef(''); // 取消的uuid
-    // 上传文件相关属性
-    const { size, title, uuid } = React.useMemo(() => {
-        const size = transSize(file === null || file === void 0 ? void 0 : file.size);
-        const title = (file === null || file === void 0 ? void 0 : file.name) || '';
-        const uuid = file === null || file === void 0 ? void 0 : file._uuid;
-        return { size, title, uuid };
-    }, [file === null || file === void 0 ? void 0 : file._uuid]);
-    React.useEffect(() => {
-        handleUpload(file);
-    }, [file === null || file === void 0 ? void 0 : file._uuid]);
-    // 上传过程
-    const handleUpload = async (file) => {
-        var _a;
-        const tcb = await getCloudInstance();
-        try {
-            setStatus('UPLOAD_STATUS_PENDING');
-            const { fileID } = await tcb.uploadFile({
-                cloudPath: `${uploadPath}/${randomStr()}-${file === null || file === void 0 ? void 0 : file.name}`,
-                filePath: file,
-                onUploadProgress: (progressEvent) => {
-                    let percent = 0;
-                    percent = Math.round((progressEvent.loaded * 100) / progressEvent.total);
-                    setStatus('UPLOAD_STATUS_LOADING');
-                    setPercent(percent < 100 ? percent : 100);
-                },
-            });
-            !cancleRef.current && (onChange === null || onChange === void 0 ? void 0 : onChange({ fileID, type: 'add', uuid, size }));
-            setStatus('UPLOAD_STATUS_SUCCESS');
-        }
-        catch (err) {
-            setStatus('UPLOAD_STATUS_ERROR');
-            (_a = events === null || events === void 0 ? void 0 : events.error) === null || _a === void 0 ? void 0 : _a.call(events, err);
-        }
-    };
-    return (React.createElement("div", { className: `${CLASS_PREFIX}__item`, role: "TcbFileUpload" },
-        React.createElement("div", { className: `${CLASS_PREFIX}__item-left` },
-            React.createElement(UploadFileStatus, { status: status, percent: percent, size: size, title: title, percentSize: (((file === null || file === void 0 ? void 0 : file.size) / 1024) * percent) / 100 })),
-        React.createElement("div", { className: `${CLASS_PREFIX}__btn-group` },
-            React.createElement(UploadFileAction, { file: file, uuid: file === null || file === void 0 ? void 0 : file._uuid, status: status, onCancel: (uuid) => {
-                    cancleRef.current = uuid;
-                    onChange === null || onChange === void 0 ? void 0 : onChange({ type: 'delete', uuid });
-                }, onReLoad: handleUpload, disabled: disabled }))));
-};
-/**
- * 上传文件状态组件
- */
-const UploadFileStatus = ({ status = 'UPLOAD_STATUS_SUCCESS', percent = 0, size, title = null, percentSize = 0, }) => {
-    var _a, _b;
-    const { isEdit } = React.useContext(FileContext) || {};
-    //上传中、待上传状态
-    if (status == 'UPLOAD_STATUS_LOADING' ||
-        (status == 'UPLOAD_STATUS_PENDING' && percent)) {
-        return (React.createElement(React.Fragment, null,
-            React.createElement("div", { className: `${CLASS_PREFIX}__file-detail` },
-                React.createElement(Text, { className: `${CLASS_PREFIX}__file-name` }, title),
-                React.createElement("div", { className: `${CLASS_PREFIX}__file-status` },
-                    React.createElement("div", { className: `${CLASS_PREFIX}__file-status` },
-                        React.createElement(Progress, { percent: percent, theme: "default", strokeColor: '#0052D9', className: `${CLASS_PREFIX}__file-progress` })))),
-            React.createElement("div", { className: `${CLASS_PREFIX}__file-foot` },
-                React.createElement("div", null,
-                    React.createElement(Text, null,
-                        Math.floor(percentSize),
-                        "K/"),
-                    React.createElement(Text, null, size)),
-                React.createElement(Text, null, status === 'UPLOAD_STATUS_PENDING' ? '等待上传' : '上传中'))));
-    }
-    return (React.createElement(React.Fragment, null,
-        React.createElement("div", { className: `${CLASS_PREFIX}__file-detail` },
-            React.createElement(Tooltip, { title: title },
-                React.createElement(Text, { className: `${CLASS_PREFIX}__file-name` }, title)),
-            isEdit && (React.createElement("div", { className: `${CLASS_PREFIX}__file-status` },
-                React.createElement(Icon, { type: ((_a = statusMap[status]) === null || _a === void 0 ? void 0 : _a.icon) ||
-                        statusMap['UPLOAD_STATUS_PENDING'].icon }),
-                React.createElement(Text, { className: `${CLASS_PREFIX}__file-status--msg` }, ((_b = statusMap[status]) === null || _b === void 0 ? void 0 : _b.title) ||
-                    statusMap['UPLOAD_STATUS_PENDING'].title)))),
-        isEdit && (React.createElement("div", { className: `${CLASS_PREFIX}__file-foot` },
-            React.createElement("div", null,
-                React.createElement(Text, null, size))))));
-};
-/**
- * 操作列组件, onChange 从最外层 UploadFilePc 传进来
- * props: { status, fileID, uuid, src, onChange }
- */
-const UploadFileAction = ({ status = 'UPLOAD_STATUS_PENDING', fileID = '', uuid = '', src = '', file = null, onReLoad = null, onCancel = null, disabled, }) => {
-    const { onChange, downloadVisible, deleteVisible, isEdit } = React.useContext(FileContext) || {};
-    // 操作列按钮-删除
-    const renderDelete = () => isEdit && (React.createElement(Button, { icon: "delete", onClick: () => onChange === null || onChange === void 0 ? void 0 : onChange({ fileID, uuid, type: 'delete' }), disabled: disabled }));
-    // 操作列按钮-取消
-    const renderCancel = () => isEdit && React.createElement(Button, { icon: "dismiss", onClick: () => onCancel === null || onCancel === void 0 ? void 0 : onCancel(uuid) });
-    // 操作列按钮-重新上传
-    const renderReLoad = () => isEdit && (React.createElement(Button, { icon: "refresh", onClick: () => {
-            onReLoad === null || onReLoad === void 0 ? void 0 : onReLoad(file);
-        } }));
-    // 操作列按钮-下载
-    const renderDownLoad = () => (React.createElement(Button, { icon: "download", onClick: () => downloadFile(src) }));
-    switch (status) {
-        case 'UPLOAD_STATUS_PENDING':
-            return renderCancel();
-        case 'UPLOAD_STATUS_LOADING':
-            return renderCancel();
-        case 'UPLOAD_STATUS_SUCCESS':
-            return (React.createElement(React.Fragment, null,
-                deleteVisible && renderDelete(),
-                ' ',
-                downloadVisible && renderDownLoad()));
-        case 'UPLOAD_STATUS_ERROR':
-            return (React.createElement(React.Fragment, null,
-                deleteVisible && renderDelete(),
-                " ",
-                renderReLoad()));
-        default:
-            return null;
-    }
-};

package/dist/web/components/form/uploaderFile/uploadFile.pc.d.ts

@@ -1,24 +0,0 @@
-/// <reference types="react" />
-import type { CommonFormPropsType } from '../types';
-import type { unknownFunction } from '../../../types';
-/**
- * 上传文件 PC 版本
- */
-export declare function UploadFilePc({ layout, id, style, labelVisible, label, requiredFlag, disabled, className, events, decorator, tips, btnTitle, maxUploadCount, maxSize, single, defaultValue, // 组件默认初始化值
-value, // 用于模型组件中 formily 的值管理
-acceptTypes, downloadVisible, deleteVisible, uploadPath, onChange, isEdit, }: IUploaderFilePc): JSX.Element;
-export interface IUploaderFilePc extends CommonFormPropsType {
-    btnTitle?: string;
-    maxUploadCount?: number;
-    downloadVisible?: boolean;
-    deleteVisible?: boolean;
-    defaultValue?: Readonly<string | string[]>;
-    maxSize?: number;
-    single?: boolean;
-    acceptTypes?: Readonly<string[]>;
-    tips?: string;
-    value?: Readonly<string | string[]>;
-    uploadPath?: string;
-    isEdit?: boolean;
-    onChange?: unknownFunction;
-}