@cloudbase/weda-ui 3.1.6 → 3.2.0

package/dist/web/components/form/userOrgSelect/departTreeSelect/departTreeSelect.pc.js

@@ -0,0 +1,153 @@
+import React, { useState, useEffect } from 'react';
+import { emptyObject } from '../../../../utils/constant';
+import { renderDecorator } from '../../renderDecorator';
+import classNames from 'classnames';
+import { Dropdown, ConfigProvider, Text } from 'tea-component';
+import { getNode, getRelationData, dealOrgData } from '../utils';
+import { getDepartById, defaultRequest, } from '../../../../utils/getUserService';
+import '../userOrgSelect.less';
+import { DimTreeContent } from '../comTool';
+import isObjectEqual from '../../../../utils/isObjectEqual';
+export function DepartTreeSelectPC({ id, className, style, events = emptyObject, label = '人员选择', labelVisible = true, name = 'formUserTreeSelect', defaultValue = '', confirmValue = '', placeholder = '请选择人员', defaultValueType = 'noneDepart', disabled = false, layout = 'horizontal', requiredFlag = false, size = 'l', multiple = false, onChange = null, decorator, relation, request = defaultRequest, getDepartByIdRequest = getDepartById, }) {
+    // 两次默认值不同, 需要刷新
+    const prevDefaultRef = React.useRef(null);
+    const prevConfirmRef = React.useRef(null);
+    const [selectIds, setSelectIds] = useState([]);
+    // 用户单选
+    const [curSelectItem, setCurSelectItem] = useState({
+        orgId: null,
+        content: '',
+    });
+    const [treeData, setTreeData] = useState([]);
+    // 节点高亮
+    const [activeIds, setActiveIds] = useState([]);
+    //鼠标移入移除输入框
+    const [moveIn, setMoveIn] = useState(false);
+    const [open, setOpen] = useState(false);
+    const [originalTreeData, setOriginalTreeData] = useState([]);
+    const [errorInfo, setErrorInfo] = useState({
+        errorStatus: false,
+        errorMessage: null,
+    });
+    useEffect(() => {
+        initOrgsData();
+        if ((defaultValue &&
+            !isObjectEqual(prevDefaultRef.current !== defaultValue)) ||
+            (confirmValue && !isObjectEqual(prevConfirmRef.current !== confirmValue))) {
+            getdefaultUser();
+            prevDefaultRef.current = defaultValue;
+            prevConfirmRef.current = confirmValue;
+        }
+    }, [defaultValueType, confirmValue, defaultValue]);
+    useEffect(() => {
+        if (open) {
+            setErrorInfo({ errorStatus: false, errorMessage: null });
+            const orgId = (curSelectItem === null || curSelectItem === void 0 ? void 0 : curSelectItem.orgId) || null;
+            const node = getNode(treeData, orgId, 'orgId');
+            setActiveIds(node ? [node.id] : []);
+            setSelectIds(node ? [node.id] : []);
+        }
+    }, [open, treeData]);
+    // 初始化数据
+    const initOrgsData = async () => {
+        try {
+            setErrorInfo({ errorStatus: false, errorMessage: null });
+            const resData = (await request('InitRootOrgs', {})) || [];
+            const data = dealOrgData(resData);
+            setTreeData(data);
+            setOriginalTreeData([...data]);
+        }
+        catch (e) {
+            setErrorInfo({ errorStatus: true, errorMessage: e });
+        }
+    };
+    const getdefaultUser = async () => {
+        var _a;
+        try {
+            if ((defaultValueType === 'confirmDepart' && confirmValue.length !== 0) ||
+                defaultValue.length !== 0) {
+                const orgId = confirmValue.length !== 0 ? confirmValue : defaultValue;
+                const defaultUser = await getDepartByIdRequest({
+                    _id: orgId,
+                });
+                setCurSelectItem({ orgId: orgId, content: defaultUser });
+                (_a = events === null || events === void 0 ? void 0 : events.change) === null || _a === void 0 ? void 0 : _a.call(events, { value: orgId, data: { content: defaultUser } });
+            }
+        }
+        catch (e) {
+            setErrorInfo({ errorStatus: true, errorMessage: e });
+        }
+    };
+    const reset = (close) => {
+        setSelectIds([]);
+        setCurSelectItem({ orgId: null, content: '' });
+        setErrorInfo({ errorStatus: false, errorMessage: null });
+        setActiveIds([]);
+        onChange === null || onChange === void 0 ? void 0 : onChange(null);
+        close && setOpen(false);
+    };
+    // 外层组件类
+    const cls = classNames({
+        'weda-ui': true,
+        'weda-user-tree-select': true,
+        [className]: className,
+    });
+    return renderDecorator(React.createElement(ConfigProvider, { classPrefix: "wedatea2td" },
+        React.createElement("div", { onMouseEnter: () => {
+                setMoveIn(true);
+            }, onMouseLeave: () => {
+                setMoveIn(false);
+            } },
+            React.createElement(Dropdown, { className: classNames(`department-tree-select`, `size-${size}`), destroyOnClose: false, open: open, onOpenChange: (open) => {
+                    setOpen(open);
+                    setErrorInfo({ errorStatus: false, errorMessage: null });
+                }, button: React.createElement(SelectViewContainer, { curSelectItem: curSelectItem, multiple: multiple, placeholder: "\u8BF7\u9009\u62E9\u90E8\u95E8", moveIn: moveIn, onChange: () => reset(true) }), style: { width: '100%' }, appearance: multiple ? 'pure' : 'button', clickClose: false, disabled: disabled }, () => (React.createElement("div", { className: "dim-tree-select" },
+                React.createElement(DimTreeContent, { data: treeData, setTreeData: setTreeData, selectedIds: selectIds, activeIds: activeIds, needUser: false, request: request, errorInfo: errorInfo, searchType: "SearchByOrg", onActive: (ids) => {
+                        setActiveIds(ids);
+                        setSelectIds(ids);
+                    }, onReset: () => setTreeData(originalTreeData), onCancel: () => {
+                        setOpen(false);
+                        setErrorInfo({ errorStatus: false, errorMessage: null });
+                    }, onClear: () => reset(false), onConfirm: () => {
+                        var _a;
+                        const selectId = selectIds === null || selectIds === void 0 ? void 0 : selectIds[0];
+                        if (selectId) {
+                            const node = getNode(treeData, selectId, 'id');
+                            if (node) {
+                                setCurSelectItem(node);
+                                onChange === null || onChange === void 0 ? void 0 : onChange(node.orgId);
+                                setOpen(false);
+                                (_a = events === null || events === void 0 ? void 0 : events.change) === null || _a === void 0 ? void 0 : _a.call(events, { value: node.orgId, data: node });
+                            }
+                        }
+                    } })))))))({
+        id,
+        className: cls,
+        style,
+        label: labelVisible ? label : null,
+        layout,
+        multiCell: false,
+        requiredFlag,
+        size,
+    });
+}
+const SelectViewContainer = (props) => {
+    const { curSelectItem, placeholder, onChange, moveIn } = props;
+    if (!(curSelectItem === null || curSelectItem === void 0 ? void 0 : curSelectItem.orgId))
+        return React.createElement(Text, { className: "placeholder" }, placeholder);
+    return (React.createElement(React.Fragment, null,
+        React.createElement(ViewCell, { data: curSelectItem, showType: "tree", relation: undefined }),
+        moveIn && (React.createElement(React.Fragment, null,
+            React.createElement("div", { className: "weda-select-user-dept__dialog-input-clear", onClick: (e) => {
+                    e.stopPropagation();
+                    onChange === null || onChange === void 0 ? void 0 : onChange();
+                } },
+                React.createElement("p", { className: "weda-select-user-dept__dialog-input-clear-close" }))))));
+};
+const ViewCell = ({ data, showType, relation }) => {
+    if (showType === 'tree') {
+        return React.createElement(Text, { verticalAlign: "middle" }, (data === null || data === void 0 ? void 0 : data.content) || '-');
+    }
+    const defaultValue = getRelationData(relation);
+    return (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.id) ? (React.createElement(Text, { verticalAlign: "middle" }, defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.content)) : (React.createElement(Text, null, "-"));
+};

package/dist/web/components/form/userOrgSelect/departTreeSelect/index.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export default function DepartTreeSelect(props: any): JSX.Element;

package/dist/web/components/form/userOrgSelect/departTreeSelect/index.js

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import { ConfigProvider } from 'tea-component';
+// import './index.less';
+import { usePlatform } from '../../../../utils/platform';
+import { DepartTreeSelectH5 as DepartSelectH5 } from './departTreeSelect.h5';
+import { DepartTreeSelectPC as DepartSelectPC } from './departTreeSelect.pc';
+export default function DepartTreeSelect(props) {
+    const platform = usePlatform();
+    if ((props === null || props === void 0 ? void 0 : props.showType) === 'pc') {
+        return React.createElement(DepartSelectPC, { ...props });
+    }
+    if ((props === null || props === void 0 ? void 0 : props.showType) === 'h5') {
+        return React.createElement(DepartSelectH5, { ...props });
+    }
+    return platform === 'h5' ? (React.createElement(ConfigProvider, { classPrefix: "wedatea2td" },
+        React.createElement(DepartSelectH5, { ...props }))) : (React.createElement(DepartSelectPC, { ...props }));
+}

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

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export default function UserTreeSelect(props: any): JSX.Element;

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

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import { ConfigProvider } from 'tea-component';
+// import './index.less';
+import { usePlatform } from '../../../utils/platform';
+import { UserTreeSelectH5 as UserSelectH5 } from './userTreeSelect.h5';
+import { UserTreeSelectPC as UserSelectPC } from './userTreeSelect.pc';
+export default function UserTreeSelect(props) {
+    const platform = usePlatform();
+    if ((props === null || props === void 0 ? void 0 : props.showType) === 'pc') {
+        return React.createElement(UserSelectPC, { ...props });
+    }
+    if ((props === null || props === void 0 ? void 0 : props.showType) === 'h5') {
+        return React.createElement(UserSelectH5, { ...props });
+    }
+    return platform === 'h5' ? (React.createElement(ConfigProvider, { classPrefix: "wedatea2td" },
+        React.createElement(UserSelectH5, { ...props }))) : (React.createElement(UserSelectPC, { ...props }));
+}