@zjlab-fe/data-hub-ui 0.21.7 → 0.23.0

package/es/components/operator-chain/components/VirtualDropdown.js

@@ -0,0 +1,56 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import React, { useState, useRef } from 'react';
+import { Input, Select } from 'antd';
+import { "filter-popup" as filter_popup, "filter-popup-top" as filter_popup_top, "virtual-dropdown-container" as virtual_dropdown_container, "virtual-dropdown-content" as virtual_dropdown_content, "virtual-dropdown-items" as virtual_dropdown_items, "virtual-dropdown-item" as virtual_dropdown_item } from '../index.module.scss.js';
+
+const { Search } = Input;
+const ITEM_HEIGHT = 32;
+const FIXED_HEIGHT = 420;
+function VirtualDropdown({ menu, onItemClick, onSelect, onInputChange }) {
+    const [scrollTop, setScrollTop] = useState(0);
+    const [selectedType, setSelectedType] = useState('');
+    const [searchValue, setSearchValue] = useState('');
+    const containerRef = useRef(null);
+    // 从menu中提取唯一的类型选项
+    const typeOptions = React.useMemo(() => {
+        const typeMap = new Map();
+        menu.forEach((item) => {
+            if (item.typeId && item.type) {
+                typeMap.set(item.typeId.toString(), item.type);
+            }
+        });
+        const options = Array.from(typeMap.entries()).map(([value, label]) => ({
+            label,
+            value: Number(value),
+        }));
+        // 添加默认的"全部"选项
+        return [{ label: '全部类型', value: '' }, ...options];
+    }, [menu]);
+    const visibleCount = Math.ceil(FIXED_HEIGHT / ITEM_HEIGHT);
+    const startIndex = Math.floor(scrollTop / ITEM_HEIGHT);
+    const endIndex = Math.min(startIndex + visibleCount, menu.length);
+    const offsetY = startIndex * ITEM_HEIGHT;
+    const handleScroll = (e) => {
+        setScrollTop(e.currentTarget.scrollTop);
+    };
+    const handleSelectChange = (value) => {
+        setSelectedType(value);
+        onSelect === null || onSelect === void 0 ? void 0 : onSelect(Number(value));
+    };
+    const handleInputChange = (e) => {
+        const value = e.target.value;
+        setSearchValue(value);
+        onInputChange === null || onInputChange === void 0 ? void 0 : onInputChange(value);
+    };
+    const filteredMenu = menu.filter((item) => {
+        const typeMatch = !selectedType || item.typeId === Number(selectedType);
+        const searchMatch = !searchValue || (item.title || item.id).toLowerCase().includes(searchValue.toLowerCase());
+        return typeMatch && searchMatch;
+    });
+    const visibleItems = filteredMenu.slice(startIndex, endIndex);
+    return (jsxs("div", { className: filter_popup, children: [jsxs("div", { className: filter_popup_top, children: [jsx(Select, { placeholder: "\u9009\u62E9\u7C7B\u578B", style: { width: 140 }, allowClear: true, onChange: handleSelectChange, options: typeOptions, defaultValue: '' }), jsx(Search, { placeholder: "\u641C\u7D22\u7B97\u5B50", style: { width: 200 }, allowClear: true, onChange: handleInputChange })] }), jsx("div", { ref: containerRef, onScroll: handleScroll, className: virtual_dropdown_container, style: {
+                    maxHeight: FIXED_HEIGHT,
+                }, children: jsx("div", { className: virtual_dropdown_content, style: { height: filteredMenu.length * ITEM_HEIGHT }, children: jsx("div", { className: virtual_dropdown_items, style: { transform: `translateY(${offsetY}px)` }, children: visibleItems.map((item) => (jsx("div", { onClick: () => onItemClick(item.id), className: virtual_dropdown_item, children: item.title || item.id }, item.id))) }) }) })] }));
+}
+
+export { VirtualDropdown as default };

package/es/components/operator-chain/index.js

@@ -0,0 +1,83 @@
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { forwardRef, useState, useImperativeHandle, useEffect } from 'react';
+import SingleCard from './components/SingleCard.js';
+import AddButton from './components/AddButton.js';
+import IOCard from './components/IOCard.js';
+import { "card-line-container" as card_line_container } from './index.module.scss.js';
+
+var index = forwardRef(function OperatorChain({ type = 'default', defaultValues = [], menu = [], isEdit = false, onClick, onChange, onActive, }, ref) {
+    const [activeCardIndex, setActiveCardIndex] = useState(null);
+    const [cards, setCards] = useState(() => {
+        // 初始化时直接处理 defaultValues
+        const initialCards = defaultValues.length
+            ? defaultValues.map(({ id, title, description }) => ({ id, title, description }))
+            : [];
+        // 如果是 dataIO 类型，直接添加 IMPORT/EXPORT 节点
+        if (type === 'dataIO') {
+            return [{ id: 'IMPORT' }, ...initialCards, { id: 'EXPORT' }];
+        }
+        return initialCards;
+    });
+    const handleClick = (index, id) => {
+        setActiveCardIndex(index);
+        onClick === null || onClick === void 0 ? void 0 : onClick(id || '');
+    };
+    const handleDelete = (index, id) => {
+        const updatedCards = [...cards];
+        updatedCards.splice(index, 1);
+        setCards(updatedCards);
+        if (activeCardIndex === index) {
+            setActiveCardIndex(null);
+        }
+        else if (activeCardIndex !== null && activeCardIndex > index) {
+            setActiveCardIndex((prev) => prev - 1);
+        }
+    };
+    const handleAdd = (index, id) => {
+        const newCard = menu.find((item) => item.id === id);
+        if (newCard) {
+            const updatedCards = [...cards];
+            updatedCards.splice(index + 1, 0, newCard);
+            setCards(updatedCards);
+            setActiveCardIndex(index + 1);
+        }
+    };
+    useImperativeHandle(ref, () => ({
+        getCards: () => [...cards],
+        getActiveCardId: () => {
+            if (activeCardIndex === null || activeCardIndex < 0 || activeCardIndex >= cards.length) {
+                return null;
+            }
+            return cards[activeCardIndex].id;
+        },
+    }));
+    useEffect(() => {
+        const newCards = defaultValues.length
+            ? defaultValues.map(({ id, title, description }) => ({ id, title, description }))
+            : [];
+        if (type === 'dataIO') {
+            setCards([{ id: 'IMPORT' }, ...newCards, { id: 'EXPORT' }]);
+        }
+        else {
+            setCards(newCards);
+        }
+    }, [defaultValues, type]);
+    useEffect(() => {
+        // 只在非初始化时触发 onChange
+        if (cards.length > 0 || defaultValues.length === 0) {
+            onChange === null || onChange === void 0 ? void 0 : onChange(cards);
+        }
+    }, [cards, onChange, defaultValues.length]);
+    useEffect(() => {
+        // 当激活卡片变化时触发 onActive 回调
+        if (activeCardIndex === null || activeCardIndex < 0 || activeCardIndex >= cards.length) {
+            onActive === null || onActive === void 0 ? void 0 : onActive(null);
+        }
+        else {
+            onActive === null || onActive === void 0 ? void 0 : onActive(cards[activeCardIndex].id);
+        }
+    }, [activeCardIndex, cards, onActive]);
+    return (jsxs("div", { style: { display: 'flex', flexDirection: 'column', padding: 20 }, children: [cards.map((card, index) => (jsx("div", { children: card.id === 'IMPORT' ? (jsx(IOCard, { id: card.id, isActive: activeCardIndex === index, onClick: (id) => handleClick(index, id) })) : null }, index))), jsx("div", { className: type === 'dataIO' ? card_line_container : null, children: cards.map((card, index) => (jsxs("div", { style: { marginLeft: '15px' }, children: [card.id === 'IMPORT' && (jsx(AddButton, { menu: menu, onClick: (id) => handleAdd(index, id), isEdit: isEdit })), card.id !== 'IMPORT' && card.id !== 'EXPORT' && (jsxs(Fragment, { children: [jsx(SingleCard, { isEdit: isEdit, isActive: activeCardIndex === index, onClick: (id) => handleClick(index, id), onDelete: (id) => handleDelete(index), title: card.title, description: card.description, id: card.id }), jsx(AddButton, { menu: menu, onClick: (id) => handleAdd(index, id), isEdit: isEdit })] }))] }, index))) }), cards.map((card, index) => (jsx("div", { children: card.id === 'EXPORT' ? (jsx(IOCard, { id: card.id, isActive: activeCardIndex === index, onClick: (id) => handleClick(index, id) })) : null }, index)))] }));
+});
+
+export { index as default };

package/es/components/operator-chain/index.module.scss.js

@@ -0,0 +1,232 @@
+var style = document.createElement('style');
+style.textContent = `@charset "UTF-8";
+.index-module__card-body___2yy9w {
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: flex-start;
+  padding: 12px 16px 12px 20px;
+  gap: 4px;
+  isolation: isolate;
+  position: relative;
+  width: 260px;
+  height: 82px;
+  background: #ffffff;
+  border: 1px solid #edf2fc;
+  box-shadow: 0px 2px 8px rgba(7, 35, 76, 0.1);
+  border-radius: 8px;
+  cursor: pointer;
+  transition: border-color 0.3s;
+}
+.index-module__card-body___2yy9w::before {
+  content: "";
+  position: absolute;
+  width: 3px;
+  height: 58px;
+  left: 1px;
+  top: 12px;
+  background: rgba(23, 117, 254, 0.5);
+  border-radius: 0px 8px 8px 0px;
+  flex: none;
+  order: 2;
+  flex-grow: 0;
+  z-index: 2;
+}
+.index-module__card-body___2yy9w.index-module__hover___6yqUE {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: flex-start;
+  padding: 12px 16px 12px 20px;
+  gap: 4px;
+  isolation: isolate;
+  background: #ffffff;
+  border: 1px solid rgba(23, 117, 254, 0.3);
+  box-shadow: 0px 8px 24px rgba(7, 35, 76, 0.15);
+  border-radius: 8px;
+}
+.index-module__card-body___2yy9w.index-module__active___0YZNX {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: flex-start;
+  padding: 12px 16px 12px 20px;
+  gap: 4px;
+  isolation: isolate;
+  background: #ffffff;
+  border: 1px solid #1775fe;
+  box-shadow: 0px 2px 8px rgba(7, 35, 76, 0.1);
+  border-radius: 8px;
+}
+.index-module__card-body___2yy9w.index-module__active___0YZNX::before {
+  background: #1775fe;
+}
+.index-module__card-body___2yy9w .index-module__delete-btn-container___6Lsv3 {
+  position: absolute;
+  top: 0px;
+  right: 0;
+  cursor: pointer;
+  color: #1775fe;
+  opacity: 0;
+  transform: translateX(0);
+  transition: all 0.3s ease;
+}
+.index-module__card-body___2yy9w:hover .index-module__delete-btn-container___6Lsv3 {
+  opacity: 1;
+  transform: translateX(0);
+}
+.index-module__active___0YZNX {
+  border-color: #1775fe !important;
+  background-color: #ffffff !important;
+}
+.index-module__iocard___On10h {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  width: 284px;
+}
+.index-module__iocard___On10h::before {
+  content: "";
+  box-sizing: border-box;
+  width: 16px;
+  height: 16px;
+  border: 2px solid #99a1af;
+  background: radial-gradient(circle, #99a1af 0 30%, transparent 30% 70%, #99a1af 70% 100%);
+  border-radius: 50%;
+  flex: none;
+}
+.index-module__iocard-body___6BzLs {
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+  padding: 10px 0px;
+  gap: 10px;
+  width: 260px;
+  height: 40px;
+  background: #ffffff;
+  border: 1px solid #eaf1fe;
+  box-shadow: 0px 2px 8px rgba(7, 35, 76, 0.1);
+  border-radius: 16777200px;
+  cursor: pointer;
+  transition: border-color 0.3s;
+}
+.index-module__iocard-body___6BzLs:hover {
+  border: 1px solid rgba(23, 117, 254, 0.3);
+  /* 投影1 */
+  box-shadow: 0px 8px 24px rgba(7, 35, 76, 0.15);
+  border-radius: 16777200px;
+}
+.index-module__iocard-body___6BzLs.index-module__active___0YZNX {
+  background: #ffffff;
+  border: 1px solid #1775fe;
+  box-shadow: 0px 2px 8px rgba(7, 35, 76, 0.1);
+  border-radius: 16777200px;
+}
+.index-module__card-title___7aaE0 {
+  width: 224px;
+  height: 20px;
+  font-style: normal;
+  font-weight: 500;
+  font-size: 14px;
+  line-height: 20px;
+  color: #222427;
+  position: relative;
+}
+.index-module__card-description___UlkWG {
+  width: 224px;
+  height: 34px;
+  font-style: normal;
+  font-weight: 400;
+  font-size: 12px;
+  color: #565b63;
+  overflow: hidden;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  line-clamp: 2;
+  text-overflow: ellipsis;
+  min-height: 40px;
+  -webkit-box-orient: vertical;
+}
+.index-module__divider-block___PZ78i {
+  width: 260px;
+  height: 20px;
+  transition: all 0.3s;
+}
+.index-module__card-divider___SG2-r {
+  width: 260px;
+  height: 20px;
+  opacity: 0;
+  transition: opacity 0.3s ease;
+}
+.index-module__divider-block___PZ78i:hover .index-module__card-divider___SG2-r {
+  opacity: 1;
+}
+.index-module__dropdown-menu___3Bqbj {
+  width: 200px !important;
+  max-height: 200px !important;
+  overflow-y: auto !important;
+}
+.index-module__virtual-dropdown-container___V9-Ly {
+  overflow-y: auto;
+  position: relative;
+  width: 100%;
+}
+.index-module__virtual-dropdown-content___NM-r1 {
+  position: relative;
+}
+.index-module__virtual-dropdown-items___Eo3-C {
+  position: absolute;
+  width: 100%;
+}
+.index-module__virtual-dropdown-item___le2A5 {
+  height: 32px;
+  padding: 0 12px;
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  transition: background-color 0.2s;
+}
+.index-module__virtual-dropdown-item___le2A5:hover {
+  background-color: #f5f5f5;
+}
+.index-module__card-line-container___Xup5i {
+  margin-left: 7px;
+  width: 284px;
+  border-left: 1px dashed #99a1af;
+}
+/**
+ * 筛选面板css
+ */
+.index-module__filter-popup___ERPmR {
+  /* 选项 */
+  /* Auto layout */
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  padding: 12px 0px;
+  gap: 8px;
+  width: 372px;
+  height: 456px;
+  background: #ffffff;
+  /* drop-shadow/0.12+0.8+0.5 */
+  box-shadow: 0px 3px 6px -4px rgba(0, 0, 0, 0.12), 0px 6px 16px rgba(0, 0, 0, 0.08), 0px 9px 28px 8px rgba(0, 0, 0, 0.05);
+  border-radius: 2px;
+}
+.index-module__filter-popup-top___VryEA {
+  /* Frame 2147223236 */
+  /* Auto layout */
+  display: flex;
+  flex-direction: row;
+  align-items: flex-start;
+  padding: 0px 12px;
+  gap: 8px;
+  height: 32px;
+}`;
+document.head.appendChild(style);
+
+var card_body = "index-module__card-body___2yy9w";var active = "index-module__active___0YZNX";var delete_btn_container = "index-module__delete-btn-container___6Lsv3";var iocard = "index-module__iocard___On10h";var iocard_body = "index-module__iocard-body___6BzLs";var card_title = "index-module__card-title___7aaE0";var card_description = "index-module__card-description___UlkWG";var divider_block = "index-module__divider-block___PZ78i";var card_divider = "index-module__card-divider___SG2-r";var virtual_dropdown_container = "index-module__virtual-dropdown-container___V9-Ly";var virtual_dropdown_content = "index-module__virtual-dropdown-content___NM-r1";var virtual_dropdown_items = "index-module__virtual-dropdown-items___Eo3-C";var virtual_dropdown_item = "index-module__virtual-dropdown-item___le2A5";var card_line_container = "index-module__card-line-container___Xup5i";var filter_popup = "index-module__filter-popup___ERPmR";var filter_popup_top = "index-module__filter-popup-top___VryEA";
+
+export { active, card_body as "card-body", card_description as "card-description", card_divider as "card-divider", card_line_container as "card-line-container", card_title as "card-title", delete_btn_container as "delete-btn-container", divider_block as "divider-block", filter_popup as "filter-popup", filter_popup_top as "filter-popup-top", iocard, iocard_body as "iocard-body", virtual_dropdown_container as "virtual-dropdown-container", virtual_dropdown_content as "virtual-dropdown-content", virtual_dropdown_item as "virtual-dropdown-item", virtual_dropdown_items as "virtual-dropdown-items" };

package/es/components/permission-editor/index.js

@@ -0,0 +1,9 @@
+import 'tslib';
+import 'react/jsx-runtime';
+import 'react';
+import 'antd';
+import PermissionEditor from './permissionEditor/index.js';
+
+
+
+export { PermissionEditor as default };

package/es/components/permission-editor/permissionEditModal/index.js

@@ -0,0 +1,37 @@
+import { __awaiter } from 'tslib';
+import { jsx } from 'react/jsx-runtime';
+import { useState, useEffect } from 'react';
+import { Modal, Button, message } from 'antd';
+import PermissionEditor from '../permissionEditor/index.js';
+
+const PermissionEditModal = ({ open, onCancel, onSave, initialPermissions = [], }) => {
+    const [selectedPermissions, setSelectedPermissions] = useState(initialPermissions);
+    const [loading, setLoading] = useState(false);
+    // 当 modal 打开时重置权限状态
+    useEffect(() => {
+        if (open) {
+            setSelectedPermissions(initialPermissions);
+        }
+    }, [open, initialPermissions]);
+    const handleSave = () => __awaiter(void 0, void 0, void 0, function* () {
+        try {
+            onSave === null || onSave === void 0 ? void 0 : onSave(selectedPermissions);
+            onCancel();
+        }
+        catch (error) {
+            message.error('权限更新失败');
+            console.error('保存权限失败:', error);
+        }
+    });
+    const handleCancel = () => {
+        // 重置为初始状态
+        setSelectedPermissions(initialPermissions);
+        onCancel();
+    };
+    return (jsx(Modal, { title: `编辑权限`, open: open, onCancel: handleCancel, width: 600, destroyOnClose: true, footer: [
+            jsx(Button, { onClick: handleCancel, children: "\u53D6\u6D88" }, "cancel"),
+            jsx(Button, { type: "primary", loading: loading, onClick: handleSave, children: "\u4FDD\u5B58" }, "save"),
+        ], children: jsx("div", { style: { padding: '16px 0' }, children: jsx(PermissionEditor, { initialPermissions: selectedPermissions, onChange: setSelectedPermissions, editable: true }) }) }));
+};
+
+export { PermissionEditModal as default };

package/es/components/permission-editor/permissionEditor/index.js

@@ -0,0 +1,253 @@
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import React from 'react';
+import { Tag, Flex } from 'antd';
+import { unEditable, tagReadonly } from './index.module.scss.js';
+import { CheckCircleOutlined } from '@ant-design/icons';
+
+const permissionTags = [
+    {
+        label: '数据权限',
+        value: 'agentic',
+        readOnly: false,
+        children: [
+            {
+                label: '检索智能体',
+                value: '13',
+                readOnly: false,
+            },
+        ],
+    },
+    {
+        label: '工作台权限',
+        value: 'workbench',
+        readOnly: false,
+        children: [
+            {
+                label: '语料生产服务',
+                value: '20',
+                readOnly: false,
+            },
+            {
+                label: '语料质量评估',
+                value: '18',
+                readOnly: false,
+            },
+            {
+                label: '可视化工作流',
+                value: '1',
+                readOnly: false,
+            },
+            {
+                label: '文档标注',
+                value: '8',
+                readOnly: false,
+            },
+            {
+                label: '模型训练',
+                value: '19',
+                readOnly: false,
+            },
+            {
+                label: '计量中心',
+                value: '23',
+                readOnly: false,
+            },
+            {
+                label: '模型部署',
+                value: '21',
+                readOnly: true,
+            },
+            {
+                label: '模型管理',
+                value: '22',
+                readOnly: true,
+            },
+        ],
+    },
+    {
+        label: '语料检索权限',
+        value: 'corpus_index',
+        readOnly: false,
+        children: [
+            {
+                label: '文献语料检索',
+                value: '14',
+                readOnly: false,
+            },
+            {
+                label: '网页语料筛选',
+                value: '15',
+                readOnly: false,
+            },
+        ],
+    },
+    {
+        label: '语料生产权限',
+        value: 'corpus_product',
+        readOnly: false,
+        children: [
+            {
+                label: '文档语料生产',
+                value: '16',
+                readOnly: false,
+            },
+            {
+                label: '网页语料生产',
+                value: '17',
+                readOnly: false,
+            },
+        ],
+    },
+];
+const PermissionEditor = ({ initialPermissions = [], onChange, editable = true, }) => {
+    // 将新格式转换为内部使用的扁平化格式
+    const convertToFlatFormat = (permissions) => {
+        const flatTags = [];
+        permissions.forEach((module) => {
+            // 添加权限列表中的所有子权限
+            flatTags.push(...module.grentedList);
+            // 查找对应的父级标签
+            const parentTag = permissionTags.find((tag) => tag.value === module.module);
+            if (parentTag) {
+                if (parentTag.children.length === 0) {
+                    // 如果是没有子级的模块（如 agentic），直接添加父模块
+                    flatTags.push(module.module);
+                }
+                else {
+                    // 如果有子级，检查是否所有可选的子权限都被选中
+                    const availableChildren = parentTag.children.filter((child) => !child.readOnly);
+                    const availableChildValues = availableChildren.map((child) => child.value);
+                    // 检查是否所有可选子级都在权限列表中
+                    const allAvailableChildrenSelected = availableChildValues.length > 0 &&
+                        availableChildValues.every((childValue) => module.grentedList.includes(childValue));
+                    if (allAvailableChildrenSelected) {
+                        flatTags.push(module.module);
+                    }
+                }
+            }
+        });
+        return flatTags;
+    };
+    // 将扁平化格式转换为新格式
+    const convertToModuleFormat = (flatTags) => {
+        const modules = [];
+        permissionTags.forEach((tag) => {
+            const modulePermissions = [];
+            // 检查子权限
+            tag.children.forEach((child) => {
+                if (flatTags.includes(child.value)) {
+                    modulePermissions.push(child.value);
+                }
+            });
+            // 只有在以下情况下才添加模块：
+            // 1. 模块没有子级且父级被选中（如 agentic）
+            // 2. 模块有子级且有子权限被选中
+            if (tag.children.length === 0) {
+                // 没有子级的模块，只有父级被选中时才添加
+                if (flatTags.includes(tag.value)) {
+                    modules.push({
+                        module: tag.value,
+                        grentedList: [],
+                    });
+                }
+            }
+            else {
+                // 1.有子级的模块，只有有子权限被选中时才添加
+                // if (modulePermissions.length > 0) {
+                //   modules.push({
+                //     module: tag.value,
+                //     grentedList: modulePermissions,
+                //   });
+                // }
+                // 2.无论有没有子权限时都添加
+                modules.push({
+                    module: tag.value,
+                    grentedList: modulePermissions,
+                });
+            }
+        });
+        return modules;
+    };
+    const [selectedTags, setSelectedTags] = React.useState(convertToFlatFormat(initialPermissions));
+    const handleChange = (tag, checked, readOnly) => {
+        // 如果整体不可编辑或者标签只读，则不处理
+        if (!editable || readOnly)
+            return;
+        // 查找当前操作的标签
+        const currentTag = permissionTags.find((t) => t.value === tag);
+        let nextSelectedTags;
+        if (currentTag && currentTag.children.length > 0) {
+            // 如果是父级标签且有子级
+            if (checked) {
+                // 选中父级时，同时选中所有非只读的子级
+                const childValues = currentTag.children
+                    .filter((child) => !child.readOnly)
+                    .map((child) => child.value);
+                nextSelectedTags = Array.from(new Set([...selectedTags, tag, ...childValues]));
+            }
+            else {
+                // 取消父级时，同时取消所有子级
+                const childValues = currentTag.children.map((child) => child.value);
+                nextSelectedTags = selectedTags.filter((t) => t !== tag && !childValues.includes(t));
+            }
+        }
+        else {
+            // 子级标签的操作
+            if (checked) {
+                nextSelectedTags = [...selectedTags, tag];
+                // 检查是否需要自动选中父级
+                const parentTag = permissionTags.find((parent) => parent.children.some((child) => child.value === tag));
+                if (parentTag) {
+                    // 获取所有非只读的子级
+                    const availableChildren = parentTag.children.filter((child) => !child.readOnly);
+                    const availableChildValues = availableChildren.map((child) => child.value);
+                    // 检查是否所有可选的子级都已被选中
+                    const allAvailableChildrenSelected = availableChildValues.every((childValue) => nextSelectedTags.includes(childValue));
+                    // 如果所有可选子级都被选中，且父级未被选中，则自动选中父级
+                    if (allAvailableChildrenSelected && !nextSelectedTags.includes(parentTag.value)) {
+                        nextSelectedTags = [...nextSelectedTags, parentTag.value];
+                    }
+                }
+            }
+            else {
+                nextSelectedTags = selectedTags.filter((t) => t !== tag);
+                // 如果取消的是子级，检查是否需要取消父级
+                const parentTag = permissionTags.find((parent) => parent.children.some((child) => child.value === tag));
+                if (parentTag && selectedTags.includes(parentTag.value)) {
+                    // 如果父级是选中状态，取消父级
+                    nextSelectedTags = nextSelectedTags.filter((t) => t !== parentTag.value);
+                }
+            }
+        }
+        const modulePermissions = convertToModuleFormat(nextSelectedTags);
+        console.log('You are interested in: ', nextSelectedTags);
+        setSelectedTags(nextSelectedTags);
+        onChange === null || onChange === void 0 ? void 0 : onChange(modulePermissions);
+    };
+    return (jsx(Fragment, { children: permissionTags.map((tag) => {
+            var _a;
+            const isSelected = selectedTags.includes(tag.value);
+            return (jsxs("div", { style: { width: '100%', margin: '8px 0' }, className: !editable ? unEditable : '', children: [jsx("span", { style: { fontSize: '16px', fontWeight: 500, marginRight: 8 }, children: tag.label }), editable && (jsx(Tag.CheckableTag, { checked: isSelected, onChange: (checked) => handleChange(tag.value, checked, tag.readOnly), style: {
+                            cursor: tag.readOnly ? 'not-allowed' : 'pointer',
+                            opacity: tag.readOnly ? 0.7 : 1,
+                            margin: '5px 0',
+                            paddingBlock: 0,
+                            color: isSelected ? '#FFFFFF' : '#a8a8a8',
+                            paddingInline: 0,
+                            height: 18,
+                            width: 18,
+                            border: 0,
+                            borderRadius: '50%',
+                        }, className: tag.readOnly ? tagReadonly : '', children: jsx(CheckCircleOutlined, { style: { fontSize: '18px' }, title: isSelected ? '取消全选' : '全选' }) }, tag.value)), jsx(Flex, { gap: 5, wrap: true, align: "center", children: (_a = tag.children) === null || _a === void 0 ? void 0 : _a.map((child) => {
+                            const isChildSelected = selectedTags.includes(child.value);
+                            return (jsx(Tag.CheckableTag, { checked: isChildSelected, onChange: (checked) => handleChange(child.value, checked, child.readOnly), style: {
+                                    cursor: child.readOnly ? 'not-allowed' : 'pointer',
+                                    opacity: child.readOnly ? 0.7 : 1,
+                                    margin: '5px 0',
+                                    border: '1px solid #979797',
+                                }, className: child.readOnly ? tagReadonly : '', children: child.label }, child.value));
+                        }) })] }, tag.value));
+        }) }));
+};
+
+export { PermissionEditor as default };