vap1 0.1.4 → 0.1.6

package/components/SearchBar/ByField.js

@@ -55,7 +55,13 @@ const SearchBarByField = (props) => {
     //     })
     //     return result;
     // }
-    const clear = () => setData({});
+    const clear = () => setData(prev => {
+        let data = {};
+        lodash_1.default.keys(prev).map(item => {
+            data[item] = null;
+        });
+        return data;
+    });
     const search = () => props.onSearch(data);
     const setIsExpand = (isExpand) => {
         if (isAwaysExpand)

package/components/SearchBar/ByKeyword.js

@@ -1,16 +1,38 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SearchBarByKeyword = void 0;
-const react_1 = __importDefault(require("react"));
+const react_1 = __importStar(require("react"));
 const antd_1 = require("antd");
 const Popover_1 = require("../_adapt/Popover");
 const ByField_1 = require("./ByField");
 const utils_1 = require("../../utils");
 const Const_1 = require("../_setup/Const");
 const SearchBarByKeyword = (props) => {
+    const [open, setOpen] = (0, react_1.useState)(false);
+    const spanRef = (0, react_1.useRef)(null);
     const inputProps = {
         className: "c-searchbar-keyword",
         placeholder: utils_1.i18n.txt(Const_1.V.INPUT_SEARCH_KEYWORD),
@@ -22,13 +44,33 @@ const SearchBarByKeyword = (props) => {
         }
     }
     if (props.fields && props.fields.length) {
-        inputProps.suffix = react_1.default.createElement(Popover_1.Popover, { trigger: "click", placement: "bottom", content: react_1.default.createElement(react_1.default.Fragment, null,
-                react_1.default.createElement("h3", null, utils_1.i18n.txt(Const_1.V.INPUT_SEARCH_ADVANCE)),
-                react_1.default.createElement("div", { className: 'c-searchbar' },
-                    react_1.default.createElement(ByField_1.SearchBarByField, Object.assign({}, props, { 
-                        // @ts-ignore
-                        __innerExpand: true, __innerOutside: true })))), overlayClassName: 'c-searchbar-keyword-more', getPopupContainer: () => document.getElementById('vap-app-content') },
-            react_1.default.createElement("span", { className: 'vicon vicon-menu', title: utils_1.i18n.txt(Const_1.V.INPUT_SEARCH_ADVANCE) }));
+        inputProps.suffix = react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement("span", { ref: spanRef, onClick: () => setOpen(true), style: { pointerEvents: props.disabled ? 'none' : 'unset' }, className: 'vicon vicon-menu', title: utils_1.i18n.txt(Const_1.V.INPUT_SEARCH_ADVANCE) }, "\u00A0"),
+            react_1.default.createElement(Popover_1.Popover, { open: open, 
+                // open={true}
+                onOpenChange: setOpen, trigger: "click", placement: "bottom", content: react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement("h3", null, utils_1.i18n.txt(Const_1.V.INPUT_SEARCH_ADVANCE)),
+                    react_1.default.createElement("div", { className: 'c-searchbar' },
+                        react_1.default.createElement(ByField_1.SearchBarByField, Object.assign({}, props, { onSearch: (param) => {
+                                props.onSearch(param);
+                                setOpen(false);
+                            }, 
+                            // @ts-ignore
+                            __innerExpand: true, __innerOutside: true })))), 
+                // autoAdjustOverflow={false}
+                overlayClassName: 'c-searchbar-keyword-more', getPopupContainer: () => {
+                    const maskEls = document.getElementsByClassName('ant-modal-mask');
+                    let hasMask = false;
+                    for (let i = 0, _i = maskEls.length; i < _i; i++) {
+                        if (!maskEls.item(i).classList.contains('ant-modal-mask-hidden')) {
+                            hasMask = true;
+                            break;
+                        }
+                    }
+                    if (!hasMask)
+                        return document.getElementById('vap-app-content');
+                    return spanRef.current.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement;
+                } }));
     }
     return react_1.default.createElement(antd_1.Input.Search, Object.assign({}, inputProps, { onSearch: keyword => props.onSearch({ keyword_: keyword }), enterButton: utils_1.i18n.txt(Const_1.V.BTN_SEARCH) }));
 };

package/components/Tables/STable.d.ts

@@ -1,5 +1,13 @@
 import React from 'react';
 import { ListInit } from '../../hooks/_list';
 import type { BaseTableProps } from './index';
-export type STableProps = BaseTableProps & ListInit;
+export type STableProps = BaseTableProps & ListInit & {
+    /**
+     * ˵�� pageSize : Ĭ��Ϊ false �� ����ҳ��
+     *
+     * Ϊ true ʱ����ϵͳĬ�Ϸ�ҳ�����з�ҳ
+     * Ϊ ���� ʱ�� ��ָ���ķ�ҳ��С���з�ҳ
+    */
+    pageSize?: true | number;
+};
 export declare const STable: (props: STableProps) => React.JSX.Element;

package/components/Tables/STable.js

@@ -22,16 +22,31 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.STable = void 0;
+const lodash_1 = __importDefault(require("lodash"));
 const react_1 = __importStar(require("react"));
 const useArray_1 = require("../../hooks/useArray");
 const VTable_1 = require("./VTable");
+const utils_1 = require("../../utils");
 const STable = (props) => {
-    const model = (0, useArray_1.useArray)(props);
-    (0, react_1.useEffect)(() => {
-        model.setList(props.list);
-    }, [props.list]);
-    return react_1.default.createElement(VTable_1.VTable, Object.assign({}, props, { model: model }));
+    const arrOption = lodash_1.default.pick(props, ['list', 'rowKey', 'list', 'api']);
+    if (props.pageSize) {
+        if (lodash_1.default.isNumber(props.pageSize)) {
+            arrOption.pageSize = props.pageSize;
+        }
+        else {
+            arrOption.pageSize = utils_1.GLOBAL.CONFIG.PAGINATION.SIZE_DEFAULT;
+        }
+    }
+    else {
+        arrOption.pageSize = 0;
+    }
+    const model = (0, useArray_1.useArray)(arrOption);
+    (0, react_1.useEffect)(() => { model.setList(props.list); }, [props.list]);
+    return react_1.default.createElement(VTable_1.VTable, Object.assign({}, props, { pagination: arrOption.pageSize == 0 ? false : { hideOnSinglePage: true }, model: model }));
 };
 exports.STable = STable;

package/components/Tables/VTable.js

@@ -65,7 +65,12 @@ const _VTable = (0, react_1.forwardRef)((props, ref) => {
         }
     }, [state.selected]);
     // 更新页数
-    (0, react_1.useEffect)(() => { start.current = pageSize * (pageNo - 1); }, [pageSize, pageNo]);
+    (0, react_1.useLayoutEffect)(() => {
+        start.current = pageSize * (pageNo - 1);
+        // @ts-ignore
+        if (props.model.mode == 'static')
+            update();
+    }, [pageSize, pageNo]);
     // 计算 clolum
     const columns = (0, react_1.useMemo)(() => {
         let cols = [];
@@ -186,7 +191,7 @@ const _VTable = (0, react_1.forwardRef)((props, ref) => {
         // scroll={scroll}
         // tableLayout="fixed"
         // showSorterTooltip={false}
-        size: utils_1.GLOBAL.CONFIG.TABLE.SIZE }, props, tableProps, { className: utils_1.StringUtil.className(['c-table'], props.className), pagination: false, columns: columns, locale: { emptyText: react_1.default.createElement(antd_1.Empty, { style: { marginTop: 24 } }) }, dataSource: list, loading: isQuerying, onChange: (x, y, field) => {
+        size: utils_1.GLOBAL.CONFIG.TABLE.SIZE, locale: { emptyText: react_1.default.createElement(antd_1.Empty, { style: { marginTop: 24 } }) } }, props, tableProps, { className: utils_1.StringUtil.className(['c-table'], props.className), pagination: false, columns: columns, dataSource: list, loading: isQuerying, onChange: (x, y, field) => {
             if (field.column) {
                 orderBy(field.field, field.order == 'ascend' ? 'asc' : 'desc');
             }
@@ -196,18 +201,21 @@ const _VTable = (0, react_1.forwardRef)((props, ref) => {
         } }));
 });
 exports.VTable = (0, react_1.forwardRef)((props, ref) => {
+    var _a;
     const { isQuerying, pageNo, pageSize, total, totalAcc, param, pageTo, query, cost } = props.model;
     // 通过 ref 方式交互，后续扩展方法实现定制联页选择
     const selectedRef = (0, react_1.useRef)({ selected: [[], []], onSelected: () => { }, });
     // 对外提供getSelected方法获取当前选择的数据
-    (0, react_1.useImperativeHandle)(ref, () => ({
-        getSelected() {
-            return selectedRef.current.selected;
-        },
-        getParams: () => {
-            return props.model.param;
-        }
-    }), []);
+    (0, react_1.useImperativeHandle)(ref, () => {
+        return {
+            getSelected() {
+                return selectedRef.current.selected;
+            },
+            getParams: () => {
+                return props.model.param;
+            }
+        };
+    }, [(_a = props.model) === null || _a === void 0 ? void 0 : _a.param]);
     let boxProps = lodash_1.default.pick(props, ['selectBar', 'style', 'className', 'default', 'mode']);
     if (props.searchBar) {
         boxProps.searchBar = Object.assign(Object.assign({}, props.searchBar), { disabled: isQuerying, onSearch: (data) => {

package/components/Trees/ActionTree.js

@@ -500,7 +500,6 @@ const _Actiontree = (0, react_1.forwardRef)((props, ref) => {
         antd_1.message.success(txt(Const_1.V.TREE_SORT_SUCCESS));
     });
     const ADD_TITLE = () => {
-        // console.log(modals.modalState)
         const { pos, node } = modals.modalState.extra || {};
         if (!action.canSort) {
             if (pos == INSER_POS.INNER) {

package/components/Trees/COTree/COSelect.d.ts

@@ -0,0 +1,45 @@
+import type { FC } from 'react';
+import type { COTreeProps, COTreeValueItem, FLAG } from './COTree';
+import type { FieldDataType } from '../../UForm/index';
+/**
+ * 说明 ，CEMS 机构存储，支持3种格式
+ * COTreeValueItem[] : 数组模式 如 [{key:'xxx',flag:1},{key:'yyy',flag:0},{key:'zzz',flag:2} ]
+ * string : 以 ',',':'分隔，如 "xxx:1,yyy:0,zzz:2"
+ * object : 以 key:Flag 的对象，如 {xxx:1,yyy:0,zzz:2}
+*/
+type SelectedValue = COTreeValueItem[] | string | Record<string, FLAG>;
+export type COSelectProps = Omit<COTreeProps, 'onChange' | 'value'> & {
+    /**
+     * 数据格式，判定方式：
+     * 1. 如果指定，则已指定的为准
+     * 2. 如果没有指定，则取传入的 value 对象，根据 value 的类型给值 (字串，数组，对象)
+     * 3. 如果没有传入 value 对象，则使用 'array'
+    */
+    dataType?: FieldDataType;
+    /**
+     * 值，强行控制
+    */
+    value?: SelectedValue;
+    /**
+     * 选中状态改变时
+    */
+    onChange: (value: SelectedValue) => void;
+    /**
+     * 默认提示
+    */
+    placeholder?: string;
+    /**
+     * 是否支持清空
+    */
+    allowClear?: boolean;
+    /**
+     * 禁用
+    */
+    disabled?: boolean;
+    /**
+     * 宽度
+    */
+    width?: number;
+};
+export declare const COSelect: FC<COSelectProps>;
+export {};

package/components/Trees/COTree/COSelect.js

@@ -0,0 +1,107 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.COSelect = void 0;
+const react_1 = __importStar(require("react"));
+const lodash_1 = __importDefault(require("lodash"));
+const antd_1 = require("antd");
+const Tables_1 = require("../../Tables");
+const COTree_1 = require("./COTree");
+const utils_1 = require("../../../utils");
+const COTreeUtil_1 = require("./COTreeUtil");
+const COSelect = props => {
+    const orgCodeRender = (0, react_1.useMemo)(() => utils_1.Renders.ApiPostRender({
+        api: props.api || utils_1.GLOBAL.CONFIG.BASIC.ORG_API,
+        nameField: props.titleField || utils_1.GLOBAL.CONFIG.BASIC.ORG_FIELDS[1],
+        valueFiled: props.keyField || utils_1.GLOBAL.CONFIG.BASIC.ORG_FIELDS[0],
+        render: (info) => {
+            if (info.label)
+                return react_1.default.createElement("span", { title: info.label }, info.label);
+            return react_1.default.createElement("span", { title: info.value }, info.value);
+        }
+    }), []);
+    const convert = (0, react_1.useMemo)(() => {
+        if (props.dataType)
+            return props.dataType;
+        if (lodash_1.default.has(props, 'value')) {
+            if (lodash_1.default.isString(props.value))
+                return 'string';
+            if (lodash_1.default.isArray(props.value))
+                return 'array';
+            if (lodash_1.default.isPlainObject(props.value))
+                return 'object';
+        }
+        return 'array';
+    }, [props.dataType]);
+    const value = (0, react_1.useMemo)(() => {
+        switch (convert) {
+            case 'array':
+                return props.value;
+            case 'object':
+                return (0, COTreeUtil_1.convertFormObject)(props.value);
+            case 'string':
+                return (0, COTreeUtil_1.convertFormString)(props.value);
+        }
+    }, [props.value, convert]);
+    const selectValue = (0, react_1.useMemo)(() => {
+        return (value || []).filter(item => item.flag != 1);
+    }, [value]);
+    const onChange = (0, react_1.useCallback)((value) => {
+        switch (convert) {
+            case 'array':
+                props.onChange(value);
+                return;
+            case 'object':
+                props.onChange((0, COTreeUtil_1.invertToObject)(value));
+                return;
+            case 'string':
+                props.onChange((0, COTreeUtil_1.invertToString)(value));
+                return;
+        }
+    }, [convert]);
+    return react_1.default.createElement(antd_1.Input.Group, { compact: true, style: { width: props.width || '100%', display: 'flex' } },
+        react_1.default.createElement(antd_1.Select, { maxTagCount: 1, mode: "tags", disabled: props.disabled, maxTagPlaceholder: react_1.default.createElement(react_1.default.Fragment, null), showSearch: false, className: 'co-select', allowClear: props.allowClear, 
+            // onClear={() => props.onChange([])}
+            placeholder: props.placeholder || '请选择机构', style: { flexGrow: 1 }, showAction: ["click"], 
+            // options={[]}
+            labelInValue: true, 
+            // open
+            // open={open}
+            // onDropdownVisibleChange={(open) => {
+            //     setOpen(open)
+            // }}
+            value: selectValue, dropdownStyle: { width: props.width || '100%', maxHeight: 360, overflow: 'auto' }, dropdownRender: () => react_1.default.createElement(COTree_1.COTree, Object.assign({}, props, { value: value, onChange: onChange })), getPopupContainer: (evt) => {
+                return evt.parentElement.parentElement;
+            } }),
+        react_1.default.createElement(antd_1.Popover, { style: { width: 480 }, content: () => react_1.default.createElement(Tables_1.STable, { style: { width: 460 }, list: value || [], columns: [
+                    { dataIndex: 'key', title: '机构名称', render: orgCodeRender },
+                    { dataIndex: 'flag', title: '状态', render: COTreeUtil_1.flagRender, width: 100 },
+                ], pagination: false }) },
+            react_1.default.createElement(antd_1.Button, { disabled: value.length == 0, type: "primary" }, "\u67E5\u770B\u5DF2\u9009")));
+};
+exports.COSelect = COSelect;

package/components/Trees/COTree/COTree.d.ts

@@ -0,0 +1,74 @@
+import type { FC, Key } from 'react';
+import type { BaseTreeOpts } from '../../../utils/TreeUtil';
+import type { PlainObject } from '../../../basetype';
+/**
+  * 选中状态，
+  * 0 = 全选当前及子级
+  * 1 = 只选其子级，排除当前节点
+  * 2 = 仅选当前，可自选子级
+ */
+export type FLAG = 0 | 1 | 2;
+/**
+ * 选择记录
+*/
+export type COTreeValueItem = {
+    /**
+     * 机构编码
+    */
+    key: string;
+    /**
+     * 选中状态
+    */
+    flag: FLAG;
+};
+/**
+ * COTree = CEMS ORG Tree
+ * CEMS 以下的应用，以及使用CEMS机构策略的模块可以使用
+*/
+export type COTreeProps = BaseTreeOpts & {
+    /**
+     * 需要先行转换
+    */
+    value?: COTreeValueItem[];
+    /**
+     * 选中状态改变时
+    */
+    onChange: (value: COTreeValueItem[]) => void;
+    /**
+     * 用于查询
+    */
+    api?: string;
+    /**
+     * 根节点API 与rootCode 二选一
+    */
+    rootApi?: string;
+    /**
+        * 是否存在子节点，如果有些属性，则根据此值不必多点一次加号
+       */
+    checkField?: string;
+    /**
+     * 展开子节点：
+     *
+     * 方式一：传一个 api 接口地址，必须返回 VData<Array<Object>> 格式
+     *
+     * 方式二：传一个方法 ，接收一个父节点参数，必须返回  Promise<TreeNodeData[]> (不要返回 children, 仅返回一级)
+    */
+    childApi?: string | ((parentId: Key) => Promise<PlainObject[]>);
+    /**
+     * 禁用选择方法
+    */
+    disableNode?: (data: any) => boolean;
+    /**
+     * 名称字段
+    */
+    titleField?: string;
+    /**
+     * 本标题后面添加状态
+    */
+    selectTip?: boolean;
+};
+export type TreeContext = Map<string, {
+    parent: string;
+    children?: string[];
+}>;
+export declare const COTree: FC<COTreeProps>;

package/components/Trees/COTree/COTree.js

@@ -0,0 +1,207 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.COTree = void 0;
+const react_1 = __importStar(require("react"));
+const lodash_1 = __importDefault(require("lodash"));
+const utils_1 = require("../../../utils");
+const antd_1 = require("antd");
+const COTreeUtil_1 = require("./COTreeUtil");
+const hooks_1 = require("../../../hooks");
+const EMPTY_SET = new Set();
+const loopId = (parent, ctx, toDel) => {
+    let node = ctx.get(parent);
+    if (node && node.children && node.children.length) {
+        for (let id of node.children) {
+            toDel.push(id);
+            loopId(id, ctx, toDel);
+        }
+    }
+};
+const getPos = (nodes, key, parent, keyField) => {
+    for (let i = 0, _i = nodes.length; i < _i; i++) {
+        const node = nodes[i];
+        if (key == node[keyField]) {
+            return [...parent, i];
+        }
+        else {
+            if (lodash_1.default.isArray(node.children) && node.children.length) {
+                let result = getPos(node.children, key, [...parent, i], keyField);
+                if (result != null) {
+                    return result;
+                }
+            }
+        }
+    }
+    return null;
+};
+const COTree = (props) => {
+    const treeContext = (0, react_1.useRef)(new Map());
+    const [ALL, setAll] = (0, react_1.useState)(null);
+    const { keyField, titleField, sortField, parentField, checkField } = (0, react_1.useMemo)(() => ({
+        keyField: props.keyField || utils_1.GLOBAL.CONFIG.BASIC.ORG_FIELDS[0],
+        titleField: props.titleField || utils_1.GLOBAL.CONFIG.BASIC.ORG_FIELDS[1],
+        sortField: props.sortField,
+        parentField: props.parentField || utils_1.GLOBAL.CONFIG.BASIC.ORG_FIELDS[2],
+        checkField: props.checkField || utils_1.GLOBAL.CONFIG.BASIC.ORG_FIELDS[3],
+    }), []);
+    const setChildren = (parentKey, children) => setAll(all => {
+        const pos = getPos(all || [], parentKey, [], keyField);
+        if (pos == null || pos.length == 0)
+            return all;
+        let arr = [...(all || [])];
+        const path = pos.map(i => `[${i}]`).join('.children');
+        lodash_1.default.set(arr, path, Object.assign(Object.assign({}, lodash_1.default.get(arr, path)), { children }));
+        return arr;
+    });
+    const getChildren = (0, react_1.useMemo)(() => {
+        if (props.childApi && lodash_1.default.isFunction(props.childApi)) {
+            return (parentId) => __awaiter(void 0, void 0, void 0, function* () {
+                let result = yield props.childApi(parentId);
+                if (lodash_1.default.isArray(result)) {
+                    return result;
+                }
+            });
+        }
+        let childAPI = props.childApi || utils_1.GLOBAL.CONFIG.BASIC.ORG_CHILDREN;
+        return (parentCode) => __awaiter(void 0, void 0, void 0, function* () {
+            // treeContext.current
+            // const children = await getChildren(resp.data[keyField])
+            const resp = yield utils_1.Ajax.GET(`${childAPI}${parentCode}`);
+            if (lodash_1.default.isArray(resp.data)) {
+                const ids = resp.data.map(item => item[keyField]);
+                ids.map(id => treeContext.current.set(id, { parent: parentCode }));
+                const ctx = treeContext.current.get(parentCode);
+                if (ctx != null) {
+                    ctx.children = ids;
+                }
+                else {
+                    treeContext.current.set(parentCode, { parent: '', children: resp.data.map(item => item[keyField]) });
+                }
+                return resp.data;
+            }
+            return [];
+        });
+    }, []);
+    (0, hooks_1.useEffectFunction)(() => __awaiter(void 0, void 0, void 0, function* () {
+        let childrenResponse;
+        if (props.rootCode) {
+            childrenResponse = getChildren(props.rootCode);
+        }
+        else if (props.rootApi) {
+            childrenResponse = utils_1.Ajax.GET(props.rootApi);
+        }
+        else {
+            childrenResponse = utils_1.Ajax.GET(utils_1.GLOBAL.CONFIG.BASIC.ORG_ROOT);
+        }
+        const resp = yield childrenResponse;
+        if (resp.code != '0') {
+            antd_1.message.error(resp.message);
+            setAll([]);
+            return;
+        }
+        if (lodash_1.default.isArray(resp.data)) {
+            resp.data.map(item => {
+                treeContext.current.set(item[keyField], { parent: '' });
+            });
+            setAll(resp.data);
+        }
+        else {
+            treeContext.current.set(resp.data[keyField], { parent: '' });
+            const children = yield getChildren(resp.data[keyField]);
+            setAll([Object.assign(Object.assign({}, resp.data), { children })]);
+        }
+    }), []);
+    const [treeProps, FULL_CHECKED, HALF_CHECKED, XOR_CHECKED] = (0, react_1.useMemo)(() => {
+        if (ALL == null)
+            return [{}, EMPTY_SET, EMPTY_SET, EMPTY_SET];
+        return (0, COTreeUtil_1.getTreeDataByLoaded)(ALL, props, { keyField, titleField, sortField, parentField, checkField });
+    }, [props, ALL]);
+    const loadData = (treeNode) => __awaiter(void 0, void 0, void 0, function* () {
+        const children = yield getChildren(treeNode.props.key);
+        setChildren(treeNode.props.key, children);
+    });
+    if (ALL === null)
+        return react_1.default.createElement(antd_1.Spin, { style: { display: 'block', margin: '24px auto' } });
+    let defaultExpandedKeys = (ALL === null || ALL === void 0 ? void 0 : ALL.length) == 1 ? [ALL[0][keyField]] : [];
+    const onCheck = (checked, info) => {
+        const key = info.node.props.key;
+        if (HALF_CHECKED.has(key)) {
+            // 本级变为1
+            const arr = utils_1.ArrayUtil.update(props.value || [], { key, flag: 1 }, 'key');
+            props.onChange(arr);
+        }
+        else if (XOR_CHECKED.has(key)) {
+            // 本极变为0，若存在下级，则清除之
+            let arr = utils_1.ArrayUtil.update(props.value || [], { key, flag: 0 }, 'key');
+            let toDel = [];
+            loopId(key, treeContext.current, toDel);
+            if (toDel.length) {
+                arr = utils_1.ArrayUtil.del(arr, toDel, 'key');
+            }
+            props.onChange(arr);
+        }
+        else if (FULL_CHECKED.has(key)) {
+            let toDel = [key];
+            loopId(key, treeContext.current, toDel);
+            const arr = utils_1.ArrayUtil.del(props.value || [], toDel, 'key');
+            props.onChange(arr);
+        }
+        else {
+            // 本级变为2, 如果上级为空，则变为2
+            const valueArr = [];
+            const valueSet = new Set();
+            (props.value || []).map(item => {
+                valueArr.push(item);
+                valueSet.add(item.key);
+            });
+            valueArr.push({ key, flag: 2 });
+            let ctx = treeContext.current.get(key);
+            while (ctx != null && ctx.parent != '') {
+                if (!valueSet.has(ctx.parent)) {
+                    valueArr.push({ key: ctx.parent, flag: 2 });
+                    ctx = treeContext.current.get(ctx.parent);
+                    continue;
+                }
+                break;
+            }
+            props.onChange(valueArr);
+        }
+    };
+    return react_1.default.createElement(antd_1.Tree, Object.assign({ className: 'c-tree co-tree', multiple: true, checkable: true, defaultExpandedKeys: defaultExpandedKeys, selectable: false, selectedKeys: [], checkStrictly: true, showLine: true, showIcon: true }, treeProps, { loadData: loadData, onCheck: onCheck }));
+};
+exports.COTree = COTree;

package/components/Trees/COTree/COTreeUtil.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import type { TreeProps } from 'antd/es/tree/Tree';
+import type { COTreeProps, COTreeValueItem, FLAG } from './COTree';
+import type { PlainObject } from '../../../basetype';
+export type TreeFields = {
+    keyField: string;
+    titleField: string;
+    sortField?: string;
+    parentField: string;
+    checkField?: string;
+};
+export declare const flagRender: (flag: FLAG) => React.JSX.Element;
+export declare const getTreeDataByLoaded: (all: any[], treeProps: COTreeProps, FIELDS: TreeFields) => [TreeProps, Set<string>, Set<string>, Set<string>];
+export declare const convertFormObject: (obj: PlainObject) => COTreeValueItem[];
+export declare const invertToObject: (items: COTreeValueItem[]) => PlainObject;
+export declare const convertFormString: (txt: string) => COTreeValueItem[];
+export declare const invertToString: (items: COTreeValueItem[]) => string;