@cloudbase/weda-ui 3.4.11-alpha.1 → 3.4.12

package/dist/web/components/form/userOrgSelect/component/depart-select/departTreeSelect.h5.js

@@ -1,156 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-/* eslint-disable @typescript-eslint/no-explicit-any */
-import React, { useState, useLayoutEffect } from 'react';
-import List from 'rc-virtual-list';
-import { renderDecorator } from '../../../renderDecorator';
-import { IconFont } from 'tdesign-icons-react';
-import classNames from '../../../../../utils/classnames';
-import { fetchSearchOrg, getNodeFromTreeByCode } from '../../common/utils';
-import { Modal, Button, ConfigProvider, Radio, Status, Bubble, } from 'tea-component';
-import { ModalSearchH5 } from '../modal-search-h5';
-import { LoadingStatus, ErrorStatus } from '../error-tips';
-import debounce from '../../../../../utils/debounce';
-import '../userOrgSelect.css';
-import { OrgPaths } from '../OrgPaths';
-export function DepartTreeSelectH5({ id, className, style, label = '部门选择', labelVisible = true, name = 'formDepartTreeSelect', placeholder = '请选择部门', disabled = false, layout = 'horizontal', requiredFlag = false, size = 'l', decorator, multiple = true, focus: autoFocus = false, confirmOrgList, setConfirmOrgList, selectedOrgList, setSelectedOrgList, errorInfo, setErrorInfo, orgList, treeData, }) {
-    var _a;
-    const cls = classNames({
-        'weda-ui': true,
-        'weda-select-user-dept': true,
-        [className]: className,
-    });
-    const subCls = classNames({
-        'weui-cell': true,
-        'weui-cell_active': true,
-        'weui-cell_form': true,
-        'weui-cell_disabled': disabled,
-    });
-    const [visible, setVisible] = React.useState(false);
-    const [isSearch, setIsSearch] = useState(false);
-    // 当前显示的树结构
-    const [showTreeData, setShowTreeData] = useState(treeData);
-    // currentItem从那一个部门点击进到下个部门的
-    const [currentItem, setCurrentItem] = useState(null);
-    const [searchValue, setSearchValue] = useState('');
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    const [loading, setLoading] = useState({ id: null, status: false });
-    const [listHeight, setListHeight] = useState(0);
-    useLayoutEffect(() => {
-        const windowHeight = window.screen.height;
-        const listHeight = windowHeight - 35 - 80 - 80 - 50; // 顶部标题35px，搜索框80px，底部按钮80px, 选择结果50px
-        setListHeight(listHeight - 100); // 底部再留缓冲
-    }, []);
-    const handleFocus = (value) => {
-        setIsSearch(value);
-    };
-    const cancleSearch = () => {
-        setErrorInfo({ errorStatus: false, errorMessage: null });
-        handleFocus(false);
-        setSearchValue('');
-        setShowTreeData(treeData);
-        // initOrgsData();
-    };
-    const onSearch = debounce((key) => {
-        try {
-            setErrorInfo({ errorStatus: false, errorMessage: null });
-            if (key && key.length > 0) {
-                const res = fetchSearchOrg({ key, orgList });
-                setShowTreeData(res);
-            }
-            else {
-                setShowTreeData(treeData);
-            }
-        }
-        catch (e) {
-            setErrorInfo({ errorStatus: true, errorMessage: e });
-        }
-    }, 500);
-    const onFocus = function () {
-        setSearchValue('');
-        setVisible(true);
-        setShowTreeData(treeData);
-    };
-    const onClose = () => {
-        setSelectedOrgList(confirmOrgList);
-        setErrorInfo({ errorStatus: false, errorMessage: null });
-        setVisible(false);
-        setShowTreeData(treeData);
-    };
-    const onConfirm = (selectedOrgList = []) => {
-        setConfirmOrgList(selectedOrgList);
-        setErrorInfo({ errorStatus: false, errorMessage: null });
-        setShowTreeData(treeData);
-        setVisible(false);
-    };
-    // 获取某节点子部门
-    const loadItem = (item) => {
-        setShowTreeData((item === null || item === void 0 ? void 0 : item.children) ? [].concat(item === null || item === void 0 ? void 0 : item.children) : []);
-        setCurrentItem(item);
-    };
-    // 返回targetItem节点所在的层级
-    const returnToLevelOfNode = (targetItem) => {
-        if (!targetItem) {
-            return;
-        }
-        // 已经返回到根节点层级
-        if (!targetItem.parentCode) {
-            setShowTreeData(treeData);
-            setCurrentItem(null);
-        }
-        else {
-            // 要返回targetItem所在的层级，需要找到targetItem的父节点parent，再显示parent的子节点即可
-            const parent = getNodeFromTreeByCode(treeData, targetItem.parentCode);
-            setShowTreeData((parent === null || parent === void 0 ? void 0 : parent.children) || []);
-            // 标记当前是从根节点进到这一层
-            setCurrentItem(parent);
-        }
-    };
-    return renderDecorator(_jsx(ConfigProvider, { classPrefix: "wedatea2td", children: _jsxs("div", { className: subCls, children: [_jsx("div", { className: "weui-cell__bd weui-flex", children: _jsx("input", { className: "weui-input", placeholder: placeholder, 
-                        //value={value}
-                        value: (confirmOrgList || []).map((e) => e === null || e === void 0 ? void 0 : e.content).join(','), disabled: disabled, name: name, autoFocus: autoFocus, onClick: onFocus, readOnly: true, role: "input" }) }), _jsxs(Modal, { disableEscape: true, maskClosable: false, visible: visible, onClose: onClose, destroyOnClose: true, className: `weda-ui weda-select-user-dept__dialog`, children: [_jsxs(Modal.Body, { className: ((_a = selectedOrgList[0]) === null || _a === void 0 ? void 0 : _a.id) ? 'is-selected-value' : '', children: [_jsxs("div", { className: "weda-select-user-dept__dialog-header", children: [_jsx("div", { className: !currentItem ? '' : 'arrow-left', onClick: () => returnToLevelOfNode(currentItem) }), currentItem ? currentItem.content : '选择部门'] }), _jsx(ModalSearchH5, { value: searchValue, onChange: (key) => {
-                                        onSearch(key);
-                                        setSearchValue(key);
-                                    }, onCancel: cancleSearch, isSearch: isSearch, onFocus: () => {
-                                        handleFocus(true);
-                                    } }), (errorInfo === null || errorInfo === void 0 ? void 0 : errorInfo.errorStatus) ? (_jsx(ErrorStatus, { description: (errorInfo === null || errorInfo === void 0 ? void 0 : errorInfo.errorMessage) || null })) : !(loading === null || loading === void 0 ? void 0 : loading.status) ? (_jsx(_Fragment, { children: showTreeData && showTreeData.length > 0 ? (_jsx(List, { className: classNames('weda-select-user-dept__dialog-list'), data: showTreeData, height: 400, itemHeight: 40, itemKey: "id", children: (item) => {
-                                            var _a;
-                                            return (_jsx("div", { className: "weda-select-user-dept__list-item", children: _jsxs("div", { className: "weda-select-user-dept__list-item-wrap", children: [_jsxs(Radio.Group, { value: (_a = selectedOrgList.filter((e) => (e === null || e === void 0 ? void 0 : e.id) === (item === null || item === void 0 ? void 0 : item.id))[0]) === null || _a === void 0 ? void 0 : _a.id, onChange: (value) => {
-                                                                const ids = selectedOrgList.map((item) => item === null || item === void 0 ? void 0 : item.id);
-                                                                // 多选情况，取消选中某元素时
-                                                                if (ids.indexOf(value) !== -1) {
-                                                                    setSelectedOrgList(selectedOrgList.filter((e) => e.id !== value));
-                                                                }
-                                                                else {
-                                                                    if (multiple) {
-                                                                        setSelectedOrgList([
-                                                                            ...selectedOrgList,
-                                                                            item,
-                                                                        ]);
-                                                                    }
-                                                                    else {
-                                                                        setSelectedOrgList([item]);
-                                                                    }
-                                                                }
-                                                            }, layout: "column", children: [_jsx(_Fragment, { children: item.type !== 'corp' && (item === null || item === void 0 ? void 0 : item.selectable) ? (_jsx(Radio, { name: item === null || item === void 0 ? void 0 : item.id, children: _jsxs("div", { className: "weda-select-user-dept__item-detail weda-select-user-dept__item-detail-is-org", onClick: () => {
-                                                                                (item === null || item === void 0 ? void 0 : item.children) ? loadItem(item) : false;
-                                                                            }, children: [_jsx("div", { className: "item-name", children: item === null || item === void 0 ? void 0 : item.content }), (item === null || item === void 0 ? void 0 : item.children) &&
-                                                                                    loading.id !== item.id && (_jsx("div", { className: "lcap-icon lcap-icon-chevronright" }))] }) })) : (_jsxs("div", { className: "weda-select-user-dept__item-detail weda-select-user-dept__item-detail-is-org", onClick: () => {
-                                                                            (item === null || item === void 0 ? void 0 : item.children) ? loadItem(item) : false;
-                                                                        }, children: [_jsx("div", { className: "item-name", children: item === null || item === void 0 ? void 0 : item.content }), (item === null || item === void 0 ? void 0 : item.children) && loading.id !== item.id && (_jsx("div", { className: "lcap-icon lcap-icon-chevronright" }))] })) }), isSearch && searchValue && (_jsx("div", { className: "item-org-h5", children: _jsx(OrgPaths, { nodeId: item === null || item === void 0 ? void 0 : item.id, treeData: treeData }) }))] }), loading.id === (item === null || item === void 0 ? void 0 : item.id) && (loading === null || loading === void 0 ? void 0 : loading.status) && (_jsx("div", { children: _jsx(IconFont, { name: "loading", className: `weda-grid-navigation__fonticon depart_loading` }) }))] }) }, item === null || item === void 0 ? void 0 : item.id));
-                                        } })) : (_jsx(Status, { className: "dim-tree-select--blank", icon: 'blank', size: 's', title: `暂无部门数据` })) })) : (_jsx(LoadingStatus, {}))] }), _jsx(Modal.Footer, { children: _jsxs("div", { children: [selectedOrgList.length > 0 && (_jsxs("div", { className: "weda-select-user-dept__select-result", children: [_jsx("div", { className: "weda-select-user-dept__select-label", children: "\u5DF2\u9009\u62E9" }), _jsx("div", { className: "weda-select-user-dept__result-list", children: selectedOrgList.map((d) => (_jsxs("div", { className: "weda-select-user-dept__result-item", onClick: () => {
-                                                        setSelectedOrgList(selectedOrgList.filter((e) => (e === null || e === void 0 ? void 0 : e.id) !== (d === null || d === void 0 ? void 0 : d.id)));
-                                                    }, children: [_jsx("div", { children: d === null || d === void 0 ? void 0 : d.content }), _jsx("div", { className: "close" })] }, (d === null || d === void 0 ? void 0 : d.id) || (d === null || d === void 0 ? void 0 : d.value)))) })] })), _jsxs("div", { className: "weda-select-user-dept__btn-group", children: [_jsx(Button, { type: "weak", onClick: onClose, children: "\u53D6\u6D88" }), _jsx(Bubble, { content: selectedOrgList.length === 0 && confirmOrgList.length === 0
-                                                    ? '请选择部门'
-                                                    : null, className: "weda-select-user-dept__bubble", children: _jsx(Button, { type: "primary", onClick: () => onConfirm(selectedOrgList), disabled: selectedOrgList.length === 0 &&
-                                                        confirmOrgList.length === 0, children: "\u786E\u5B9A" }) })] })] }) })] })] }) }))({
-        id,
-        className: cls,
-        style,
-        label: labelVisible ? label : null,
-        multiCell: false,
-        requiredFlag,
-        layout,
-        size,
-        decorator,
-    });
-}