@voplus/morpho-document 1.4.97 → 1.4.99

package/es/components/DocumentList/index.js

@@ -1,195 +1,195 @@
-import { Badge, Empty, Upload, message } from "@voplus/antd";
-import { BatchContext, BatchContextState, ListDataContext, useCreateListDataState, } from "@voplus/morpho-ui/es/data";
-import { BatchHeader, DeleteButton, MoveButton, } from "@voplus/morpho-ui/es/components/layout/ListView/headers";
-import { useAutoUpdateListData, useDocumentListEffect, useDocumentStore, } from "@voplus/morpho-document-core";
-import { DocumentStatusFilter, FlagFilter } from "../../controls/filters";
-import React, { useRef, useState } from "react";
-import { useApplicationContext, useDeepMemo } from "@voplus/morpho-data";
-import AddDocDropdown from "../AddDocDropdown";
-import DocumentItem from "../DocumentItem/index";
-import DocumentItemFrame from "../../controls/DocumentItemFrame";
-import DocumentPasteUpload from "../DocumentPasteUpload";
-import DocumentSelectDialog from "../DocumentSelectDialog";
-import { FontAwesomeIcon as FAIcon } from "@fortawesome/react-fontawesome";
-import InfiniteScrollView from "@voplus/morpho-ui/es/controls/InfiniteScrollView";
-import ListHeader from "@voplus/morpho-ui/es/components/layout/ListView/headers/ListHeader";
-import NewDocumentForm from "../NewDocumentForm";
-import SearchHeader from "@voplus/morpho-ui/es/components/layout/ListView/headers/SearchHeader";
-import ShortcutFilter from "../../controls/filters/ShortcutFilter";
-import { State } from "./state";
-import classNames from "classnames";
-import { faCloudUpload } from "@fortawesome/pro-duotone-svg-icons";
-import { observe } from "@voplus/morpho-ui";
-import { runInAction } from "mobx";
-import styles from "./index.less";
-import { useRenderOnChange } from "@voplus/morpho-ui";
-const DocumentList = (props) => {
-    const containerRef = useRef(null);
-    const store = useDocumentStore();
-    const [state] = useState(new State(store));
-    const { user } = useApplicationContext();
-    /**是否能Upload*/
-    const [disabled, setDisabled] = useState(props.disabled);
-    /**e.g. exclude={["Task", "Agenda"]} 結果:不會顯示 Task和Agenda文件*/
-    state.exclude = props.exclude || [];
-    state.contains = props.contains || [];
-    state.props = props;
-    state.id = props.id || "";
-    /** 建立 ListView 和useDocumentListEffect所需的ListDataState. 会根据state.id重建所以不需reset. */
-    const list = useCreateListDataState({
-        filterDefaults: {
-            includes: props.includes !== undefined ? props.includes : "tags",
-        },
-    }, [state.id]);
-    const batch = useDeepMemo(() => new BatchContextState(list), [props.id]);
-    /** 如果 list.filters.options变更了就重渲染，使下一行的useDocumentListEffect 可以接收新参数*/
-    useRenderOnChange(() => list.filters.options);
-    /** 把ListDataState传给useDocumentListEffect,使之可以自動更新loading, hasmore. */
-    useDocumentListEffect(list, (result, total) => {
-        runInAction(() => {
-            state.total = total;
-            list.union(result);
-        });
-    }, {
-        ...list.filters.options,
-        Filters: state.filters,
-        Total: true,
-    });
-    /** useOnNewDocument, useOnDeleteDocument的sugar syntax 自動更新list. */
-    useAutoUpdateListData(list, (d, type) => {
-        if ((d.parentId === state.id && !state.exclude.includes(d.type)) ||
-            list.data.filter((item) => item.id === d.id).length) {
-            // type === "new" ? state.total++ : state.total--;
-            return true;
-        }
-        return false;
-    });
-    const header = observe(() => (React.createElement(React.Fragment, null,
-        props.multiple && (React.createElement(BatchHeader, { viewTitle: React.createElement(React.Fragment, null,
-                props.viewTitle ? props.viewTitle : "Sub-Documents",
-                props.total && (React.createElement(Badge, { count: state.total, overflowCount: 9999, className: "site-badge-count" }))), buttons: [
-                React.createElement(DeleteButton, { execute: state.onDelete, key: "DeleteButton" }),
-                React.createElement(MoveButton, { execute: onMove, key: "MoveButton" }),
-            ] })),
-        props.type === "select" && React.createElement(SearchHeader, { onChange: (val) => onSearch(val) }))));
-    const items = (item) => {
-        return observe(() => (React.createElement(DocumentItemFrame, { frameProps: {
-                borderProps: { location: "left", color: "#fff ", size: "0px" },
-            } },
-            React.createElement(DocumentItem, { type: props.type ? props.type : "sub", item: {
-                    id: item.id,
-                    reload: props.reload,
-                    multiple: batch.multiple,
-                    checked: checked(item.id),
-                    onChangeDisabled: onChangeDisabled,
-                    onSelectDocument: props.onSelectDocument,
-                } }))));
-    };
-    return observe(() => (React.createElement(React.Fragment, null,
-        React.createElement(ListDataContext.Provider, { value: list },
-            React.createElement("div", { ref: containerRef, className: classNames(styles["documents-list"], props.className) },
-                React.createElement(BatchContext.Provider, { value: batch },
-                    props.header && (React.createElement(ListHeader, { renderId: props.id, header: header, quickSearch: props.search, searchOptions: {
-                            width: "150px",
-                            onChange: onSearch,
-                        }, filterViewProps: {
-                            columns: [React.createElement(DocumentStatusFilter, { key: "Status" }), React.createElement(FlagFilter, { key: "Flag" })],
-                            footerFilter: props.shortcutFilter ? React.createElement(ShortcutFilter, null) : null,
-                            onFilter: (c) => {
-                                c.filter();
-                                state.filterList = c === null || c === void 0 ? void 0 : c.options.Filters;
-                            },
-                            onReset: (c) => {
-                                c.reset();
-                                state.filterList = [];
-                            },
-                        }, sortOptions: [
-                            { label: "Name", value: "Name" },
-                            { label: "Create Date", value: "CreateDate" },
-                        ], addOptions: {
-                            children: (React.createElement(React.Fragment, null,
-                                props.addAble ? (React.createElement(AddDocDropdown, { id: props.id, className: "margin-left-10", onItemClick: (val) => state.onItemClick(val), onCancelClick: () => state.cancel(), onUploading: onUploading })) : null,
-                                props.versionsMenu)),
-                        } })),
-                    React.createElement("div", { className: "doc-list-content" },
-                        React.createElement(Upload.Dragger, { className: classNames("doc-list-page", !disabled && "doc-drag-hover", !list.loading && !list.data.length && !disabled && "cursor"), action: `https://${state.getHost}/api/files/${props.id}`, headers: {
-                                Authorization: `Bearer ${user.info.accessToken}`,
-                            }, fileList: state.fileList, showUploadList: state.fileList.length > 0, onChange: onUploading, 
-                            // customRequest={(option: any) => state.customRequest(option)}
-                            disabled: disabled, openFileDialogOnClick: false, multiple: true },
-                            React.createElement(InfiniteScrollView, { empty: list.isEmpty, emptyProps: disabled
-                                    ? { image: Empty.PRESENTED_IMAGE_DEFAULT, description: "No Data" }
-                                    : {
-                                        image: React.createElement(FAIcon, { icon: faCloudUpload, size: "5x", color: "#797979" }),
-                                        description: "Drop files here to upload.",
-                                    }, loading: list.loading, hasMore: list.hasMore, loadMore: () => list.triggerNextPage(), ...props.infiniteScrollViewProps }, batch.multiple ? (React.createElement(BatchHeader.CheckGroup, { className: "list-view-page" }, list.data.map((item) => (React.createElement(React.Fragment, { key: item.id }, items(item)))))) : (list.data.map((item) => (React.createElement(React.Fragment, { key: item.id }, items(item))))))))),
-                state.addAble && (React.createElement(NewDocumentForm, { parentId: props.id, type: state.type, onCancel: () => runInAction(() => (state.addAble = false)) })))),
-        !disabled && React.createElement(DocumentPasteUpload, { id: props.id, containerRef: containerRef }),
-        state.shortcut && React.createElement(DocumentSelectDialog, { onSelect: onCreateShortcut }))));
-    /**change disabled Upload function
-     * 只要顯示 quickview就disable documentList的upload
-     * 原因：(上传文件至QuickView會错误的上传多一份到documentList )
-     * 好像是modal顯示時, 之前的element 沒有接到mouseleave, 不知道是antd的bug還是就是這樣的......
-     */
-    function onChangeDisabled(newDisabled) {
-        setDisabled(newDisabled);
-    }
-    /** check move */
-    async function onMove(state) {
-        if (!state.ids.length)
-            return message.info("Nothing to choice");
-        store.cut(state.ids);
-        message.info("Placed in clipboard");
-    }
-    function onCreateShortcut(doc) {
-        const shortcuts = [];
-        doc.map((item) => {
-            shortcuts.push({ TargetId: item.id, ParentId: state.id, Name: "" });
-        });
-        store.createShortcuts({ data: shortcuts, error: "message" });
-        state.shortcut = false;
-    }
-    /** 文件上传中、完成、失败回调函数 */
-    function onUploading({ file, fileList }) {
-        /**上传完成不显示进度条 */
-        runInAction(() => {
-            state.fileList = fileList.filter((f) => f.status !== "done");
-            if (file.status === "done") {
-                list.union([file.response]);
-            }
-        });
-    }
-    /** SearchHeader 查找文件name */
-    function onSearch(value) {
-        runInAction(() => {
-            if (state.timeout) {
-                clearTimeout(state.timeout);
-            }
-            state.timeout = setTimeout(() => {
-                state.timeout = null;
-                state.filterName = value;
-                list.triggerName(value);
-            }, 1500);
-        });
-    }
-    /** type="select" item是否为选中状态 */
-    function checked(id) {
-        var _a;
-        const check = (_a = props.selectedLists) === null || _a === void 0 ? void 0 : _a.find((v) => {
-            return v.id === id;
-        });
-        if (check)
-            return true;
-        return false;
-    }
-};
-DocumentList.defaultProps = {
-    header: true,
-    search: true,
-    total: true,
-    addAble: true,
-    disabled: false,
-    appendLocation: "bottom",
-};
-export default DocumentList;
+import { Badge, Empty, Upload, message } from "@voplus/antd";
+import { BatchContext, BatchContextState, ListDataContext, useCreateListDataState, } from "@voplus/morpho-ui/es/data";
+import { BatchHeader, DeleteButton, MoveButton, } from "@voplus/morpho-ui/es/components/layout/ListView/headers";
+import { useAutoUpdateListData, useDocumentListEffect, useDocumentStore, } from "@voplus/morpho-document-core";
+import { DocumentStatusFilter, FlagFilter } from "../../controls/filters";
+import React, { useRef, useState } from "react";
+import { useApplicationContext, useDeepMemo } from "@voplus/morpho-data";
+import AddDocDropdown from "../AddDocDropdown";
+import DocumentItem from "../DocumentItem/index";
+import DocumentItemFrame from "../../controls/DocumentItemFrame";
+import DocumentPasteUpload from "../DocumentPasteUpload";
+import DocumentSelectDialog from "../DocumentSelectDialog";
+import { FontAwesomeIcon as FAIcon } from "@fortawesome/react-fontawesome";
+import InfiniteScrollView from "@voplus/morpho-ui/es/controls/InfiniteScrollView";
+import ListHeader from "@voplus/morpho-ui/es/components/layout/ListView/headers/ListHeader";
+import NewDocumentForm from "../NewDocumentForm";
+import SearchHeader from "@voplus/morpho-ui/es/components/layout/ListView/headers/SearchHeader";
+import ShortcutFilter from "../../controls/filters/ShortcutFilter";
+import { State } from "./state";
+import classNames from "classnames";
+import { faCloudUpload } from "@fortawesome/pro-duotone-svg-icons";
+import { observe } from "@voplus/morpho-ui";
+import { runInAction } from "mobx";
+import styles from "./index.less";
+import { useRenderOnChange } from "@voplus/morpho-ui";
+const DocumentList = (props) => {
+    const containerRef = useRef(null);
+    const store = useDocumentStore();
+    const [state] = useState(new State(store));
+    const { user } = useApplicationContext();
+    /**是否能Upload*/
+    const [disabled, setDisabled] = useState(props.disabled);
+    /**e.g. exclude={["Task", "Agenda"]} 結果:不會顯示 Task和Agenda文件*/
+    state.exclude = props.exclude || [];
+    state.contains = props.contains || [];
+    state.props = props;
+    state.id = props.id || "";
+    /** 建立 ListView 和useDocumentListEffect所需的ListDataState. 会根据state.id重建所以不需reset. */
+    const list = useCreateListDataState({
+        filterDefaults: {
+            includes: props.includes !== undefined ? props.includes : "tags",
+        },
+    }, [state.id]);
+    const batch = useDeepMemo(() => new BatchContextState(list), [props.id]);
+    /** 如果 list.filters.options变更了就重渲染，使下一行的useDocumentListEffect 可以接收新参数*/
+    useRenderOnChange(() => list.filters.options);
+    /** 把ListDataState传给useDocumentListEffect,使之可以自動更新loading, hasmore. */
+    useDocumentListEffect(list, (result, total) => {
+        runInAction(() => {
+            state.total = total;
+            list.union(result);
+        });
+    }, {
+        ...list.filters.options,
+        Filters: state.filters,
+        Total: true,
+    });
+    /** useOnNewDocument, useOnDeleteDocument的sugar syntax 自動更新list. */
+    useAutoUpdateListData(list, (d, type) => {
+        if ((d.parentId === state.id && !state.exclude.includes(d.type)) ||
+            list.data.filter((item) => item.id === d.id).length) {
+            // type === "new" ? state.total++ : state.total--;
+            return true;
+        }
+        return false;
+    });
+    const header = observe(() => (React.createElement(React.Fragment, null,
+        props.multiple && (React.createElement(BatchHeader, { viewTitle: React.createElement(React.Fragment, null,
+                props.viewTitle ? props.viewTitle : "Sub-Documents",
+                props.total && (React.createElement(Badge, { count: state.total, overflowCount: 9999, className: "site-badge-count" }))), buttons: [
+                React.createElement(DeleteButton, { execute: state.onDelete, key: "DeleteButton" }),
+                React.createElement(MoveButton, { execute: onMove, key: "MoveButton" }),
+            ] })),
+        props.type === "select" && React.createElement(SearchHeader, { onChange: (val) => onSearch(val) }))));
+    const items = (item) => {
+        return observe(() => (React.createElement(DocumentItemFrame, { frameProps: {
+                borderProps: { location: "left", color: "#fff ", size: "0px" },
+            } },
+            React.createElement(DocumentItem, { type: props.type ? props.type : "sub", item: {
+                    id: item.id,
+                    reload: props.reload,
+                    multiple: batch.multiple,
+                    checked: checked(item.id),
+                    onChangeDisabled: onChangeDisabled,
+                    onSelectDocument: props.onSelectDocument,
+                } }))));
+    };
+    return observe(() => (React.createElement(React.Fragment, null,
+        React.createElement(ListDataContext.Provider, { value: list },
+            React.createElement("div", { ref: containerRef, className: classNames(styles["documents-list"], props.className) },
+                React.createElement(BatchContext.Provider, { value: batch },
+                    props.header && (React.createElement(ListHeader, { renderId: props.id, header: header, quickSearch: props.search, searchOptions: {
+                            width: "150px",
+                            onChange: onSearch,
+                        }, filterViewProps: {
+                            columns: [React.createElement(DocumentStatusFilter, { key: "Status" }), React.createElement(FlagFilter, { key: "Flag" })],
+                            footerFilter: props.shortcutFilter ? React.createElement(ShortcutFilter, null) : null,
+                            onFilter: (c) => {
+                                c.filter();
+                                state.filterList = c === null || c === void 0 ? void 0 : c.options.Filters;
+                            },
+                            onReset: (c) => {
+                                c.reset();
+                                state.filterList = [];
+                            },
+                        }, sortOptions: [
+                            { label: "Name", value: "Name" },
+                            { label: "Create Date", value: "CreateDate" },
+                        ], addOptions: {
+                            children: (React.createElement(React.Fragment, null,
+                                props.addAble ? (React.createElement(AddDocDropdown, { id: props.id, className: "margin-left-10", onItemClick: (val) => state.onItemClick(val), onCancelClick: () => state.cancel(), onUploading: onUploading })) : null,
+                                props.versionsMenu)),
+                        } })),
+                    React.createElement("div", { className: "doc-list-content" },
+                        React.createElement(Upload.Dragger, { className: classNames("doc-list-page", !disabled && "doc-drag-hover", !list.loading && !list.data.length && !disabled && "cursor"), action: `https://${state.getHost}/api/files/${props.id}`, headers: {
+                                Authorization: `Bearer ${user.info.accessToken}`,
+                            }, fileList: state.fileList, showUploadList: state.fileList.length > 0, onChange: onUploading, 
+                            // customRequest={(option: any) => state.customRequest(option)}
+                            disabled: disabled, openFileDialogOnClick: false, multiple: true },
+                            React.createElement(InfiniteScrollView, { empty: list.isEmpty, emptyProps: disabled
+                                    ? { image: Empty.PRESENTED_IMAGE_DEFAULT, description: "No Data" }
+                                    : {
+                                        image: React.createElement(FAIcon, { icon: faCloudUpload, size: "5x", color: "#797979" }),
+                                        description: "Drop files here to upload.",
+                                    }, loading: list.loading, hasMore: list.hasMore, loadMore: () => list.triggerNextPage(), ...props.infiniteScrollViewProps }, batch.multiple ? (React.createElement(BatchHeader.CheckGroup, { className: "list-view-page" }, list.data.map((item) => (React.createElement(React.Fragment, { key: item.id }, items(item)))))) : (list.data.map((item) => (React.createElement(React.Fragment, { key: item.id }, items(item))))))))),
+                state.addAble && (React.createElement(NewDocumentForm, { parentId: props.id, type: state.type, onCancel: () => runInAction(() => (state.addAble = false)) })))),
+        !disabled && React.createElement(DocumentPasteUpload, { id: props.id, containerRef: containerRef }),
+        state.shortcut && React.createElement(DocumentSelectDialog, { onSelect: onCreateShortcut }))));
+    /**change disabled Upload function
+     * 只要顯示 quickview就disable documentList的upload
+     * 原因：(上传文件至QuickView會错误的上传多一份到documentList )
+     * 好像是modal顯示時, 之前的element 沒有接到mouseleave, 不知道是antd的bug還是就是這樣的......
+     */
+    function onChangeDisabled(newDisabled) {
+        setDisabled(newDisabled);
+    }
+    /** check move */
+    async function onMove(state) {
+        if (!state.ids.length)
+            return message.info("Nothing to choice");
+        store.cut(state.ids);
+        message.info("Placed in clipboard");
+    }
+    function onCreateShortcut(doc) {
+        const shortcuts = [];
+        doc.map((item) => {
+            shortcuts.push({ TargetId: item.id, ParentId: state.id, Name: "" });
+        });
+        store.createShortcuts({ data: shortcuts, error: "message" });
+        state.shortcut = false;
+    }
+    /** 文件上传中、完成、失败回调函数 */
+    function onUploading({ file, fileList }) {
+        /**上传完成不显示进度条 */
+        runInAction(() => {
+            state.fileList = fileList.filter((f) => f.status !== "done");
+            if (file.status === "done") {
+                list.union([file.response]);
+            }
+        });
+    }
+    /** SearchHeader 查找文件name */
+    function onSearch(value) {
+        runInAction(() => {
+            if (state.timeout) {
+                clearTimeout(state.timeout);
+            }
+            state.timeout = setTimeout(() => {
+                state.timeout = null;
+                state.filterName = value;
+                list.triggerName(value);
+            }, 1500);
+        });
+    }
+    /** type="select" item是否为选中状态 */
+    function checked(id) {
+        var _a;
+        const check = (_a = props.selectedLists) === null || _a === void 0 ? void 0 : _a.find((v) => {
+            return v.id === id;
+        });
+        if (check)
+            return true;
+        return false;
+    }
+};
+DocumentList.defaultProps = {
+    header: true,
+    search: true,
+    total: true,
+    addAble: true,
+    disabled: false,
+    appendLocation: "bottom",
+};
+export default DocumentList;
 //# sourceMappingURL=index.js.map

package/es/components/DocumentList/state.d.ts

@@ -1,58 +1,58 @@
-import { DocumentListProps, DocumentStore } from "@voplus/morpho-document-core";
-import { BatchContextState } from "@voplus/morpho-ui/es/data";
-import { FilterOption } from "@voplus/morpho-data";
-import { SortParameters } from "@voplus/morpho-data/es/types";
-import { UploadFile } from "@voplus/antd/es/upload/interface";
-import { docType } from "../../data";
-export declare class State {
-    private _store;
-    props: DocumentListProps;
-    constructor(_store: DocumentStore);
-    id: string;
-    /** Checkbox ids */
-    ids: string[];
-    total: number;
-    /** all documents to check  */
-    checkAll: boolean;
-    /** show multiple documentlist */
-    multiple: boolean;
-    /** documentlist filter name */
-    filterName: string;
-    filterList?: FilterOption[];
-    /** e.g. exclude={["Task", "Agenda"]} 結果:不會顯示 Task和Agenda文件 */
-    exclude: string[];
-    /** e.g. contains={["Task", "Agenda"]} 結果:只顯示 Task和Agenda文件 */
-    contains: string[];
-    /** timeout input documentname */
-    timeout: any;
-    shortcut: boolean;
-    /** NewDocumentForm */
-    addAble: boolean;
-    /** add document type */
-    type?: docType;
-    /** */
-    fileList: UploadFile[];
-    sortData: SortParameters;
-    /** documentList add Drop down more menus hidden*/
-    cancel(): void;
-    /** update multiple */
-    updateMultiple(multiple: boolean): void;
-    /** check delete */
-    onDelete: (state: BatchContextState) => Promise<any>;
-    /** Upload 通过覆盖默认的上传行为，可以自定义自己的上传实现 */
-    customRequest(option: any): Promise<void>;
-    /** AddDocDropdown(新增type下拉Menu) item click */
-    onItemClick(val: docType): void;
-    /**
-     * document filters
-     * @return document filters
-     */
-    get filters(): any[];
-    /**
-     * document sort
-     * @return document sort
-     */
-    get sort(): SortParameters;
-    /** 获取请求host */
-    get getHost(): string;
-}
+import { DocumentListProps, DocumentStore } from "@voplus/morpho-document-core";
+import { BatchContextState } from "@voplus/morpho-ui/es/data";
+import { FilterOption } from "@voplus/morpho-data";
+import { SortParameters } from "@voplus/morpho-data/es/types";
+import { UploadFile } from "@voplus/antd/es/upload/interface";
+import { docType } from "../../data";
+export declare class State {
+    private _store;
+    props: DocumentListProps;
+    constructor(_store: DocumentStore);
+    id: string;
+    /** Checkbox ids */
+    ids: string[];
+    total: number;
+    /** all documents to check  */
+    checkAll: boolean;
+    /** show multiple documentlist */
+    multiple: boolean;
+    /** documentlist filter name */
+    filterName: string;
+    filterList?: FilterOption[];
+    /** e.g. exclude={["Task", "Agenda"]} 結果:不會顯示 Task和Agenda文件 */
+    exclude: string[];
+    /** e.g. contains={["Task", "Agenda"]} 結果:只顯示 Task和Agenda文件 */
+    contains: string[];
+    /** timeout input documentname */
+    timeout: any;
+    shortcut: boolean;
+    /** NewDocumentForm */
+    addAble: boolean;
+    /** add document type */
+    type?: docType;
+    /** */
+    fileList: UploadFile[];
+    sortData: SortParameters;
+    /** documentList add Drop down more menus hidden*/
+    cancel(): void;
+    /** update multiple */
+    updateMultiple(multiple: boolean): void;
+    /** check delete */
+    onDelete: (state: BatchContextState) => Promise<any>;
+    /** Upload 通过覆盖默认的上传行为，可以自定义自己的上传实现 */
+    customRequest(option: any): Promise<void>;
+    /** AddDocDropdown(新增type下拉Menu) item click */
+    onItemClick(val: docType): void;
+    /**
+     * document filters
+     * @return document filters
+     */
+    get filters(): any[];
+    /**
+     * document sort
+     * @return document sort
+     */
+    get sort(): SortParameters;
+    /** 获取请求host */
+    get getHost(): string;
+}