@funcho/ui 1.1.8 → 1.1.10

package/dist/esm/business/TreeCheckFilter/TreeCheckFilter.vue.mjs

@@ -0,0 +1,208 @@
+import { defineComponent, ref, createElementBlock, openBlock, normalizeClass, unref, createCommentVNode, createElementVNode, createBlock, withKeys, normalizeStyle, createVNode, withCtx, mergeProps } from 'vue';
+import { useNamespace } from '../../hooks/use-namespace.mjs';
+import '../../components/Button/index.mjs';
+import '../../components/Dialog/index.mjs';
+import '../../components/ConfigProvider/index.mjs';
+import { FcInput } from '../../components/Input/index.mjs';
+import { FcTree } from '../../components/Tree/index.mjs';
+import '../../components/Tabs/index.mjs';
+import '../../components/TabPane/index.mjs';
+import '../../components/Steps/index.mjs';
+import '../../components/Step/index.mjs';
+import '../../components/InputNumber/index.mjs';
+import '../../components/Select/index.mjs';
+import '../../components/Option/index.mjs';
+import '../../components/DatePicker/index.mjs';
+import '../../components/DatePickerPanel/index.mjs';
+import '../../components/Tooltip/index.mjs';
+import '../../components/Icon/index.mjs';
+import '../../components/Notification/index.mjs';
+import '../../components/Link/index.mjs';
+import '../../components/Text/index.mjs';
+import { FcScrollbar } from '../../components/Scrollbar/index.mjs';
+import '../../components/Splitter/index.mjs';
+import '../../components/SplitterPanel/index.mjs';
+import '../../components/Autocomplete/index.mjs';
+import '../../components/Cascader/index.mjs';
+import '../../components/CascaderPanel/index.mjs';
+import { FcCheckbox } from '../../components/Checkbox/index.mjs';
+import '../../components/CheckboxGroup/index.mjs';
+import '../../components/CheckboxButton/index.mjs';
+import '../../components/Form/index.mjs';
+import '../../components/FormItem/index.mjs';
+import '../../components/InputTag/index.mjs';
+import '../../components/Radio/index.mjs';
+import '../../components/RadioGroup/index.mjs';
+import '../../components/SelectV2/index.mjs';
+import '../../components/Switch/index.mjs';
+import '../../components/TimePicker/index.mjs';
+import '../../components/TimeSelect/index.mjs';
+import '../../components/TreeSelect/index.mjs';
+import '../../components/Upload/index.mjs';
+import '../../components/Avatar/index.mjs';
+import '../../components/AvatarGroup/index.mjs';
+import '../../components/Badge/index.mjs';
+import '../../components/Card/index.mjs';
+import '../../components/Descriptions/index.mjs';
+import '../../components/DescriptionsItem/index.mjs';
+import '../../components/Empty/index.mjs';
+import '../../components/Image/index.mjs';
+import '../../components/ImageViewer/index.mjs';
+import '../../components/Pagination/index.mjs';
+import '../../components/Table/index.mjs';
+import '../../components/TableColumn/index.mjs';
+import '../../components/TableV2/index.mjs';
+import '../../components/Tag/index.mjs';
+import '../../components/Breadcrumb/index.mjs';
+import '../../components/BreadcrumbItem/index.mjs';
+import '../../components/Drawer/index.mjs';
+import '../../components/Popconfirm/index.mjs';
+import '../../components/IconComponent/index.mjs';
+import '../../components/Popover/index.mjs';
+import '../../components/Result/index.mjs';
+import '../../components/Progress/index.mjs';
+import '../../components/Divider/index.mjs';
+import '../../components/Dropdown/index.mjs';
+import '../../components/DropdownMenu/index.mjs';
+import '../../components/DropdownItem/index.mjs';
+import '../../components/Menu/index.mjs';
+import '../../components/SubMenu/index.mjs';
+import '../../components/MenuItem/index.mjs';
+import '../../components/RadioButton/index.mjs';
+import '../../components/MenuItemGroup/index.mjs';
+import '../../components/Collapse/index.mjs';
+import '../../components/CollapseItem/index.mjs';
+import '../../components/ContextMenu/index.mjs';
+import '../../components/CodeEditor/index.mjs';
+import '../../components/RichEditor/index.mjs';
+import { Search } from '@funcho/icons-vue';
+import { useElementSize } from '@vueuse/core';
+
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "FcProTreeCheckFilter",
+    inheritAttrs: false
+  },
+  __name: "TreeCheckFilter",
+  props: {
+    border: { type: Boolean, default: true },
+    label: { default: "全选" },
+    data: { default: () => [] },
+    nodeKey: { default: "value" },
+    showCheckbox: { type: Boolean, default: true },
+    showSearch: { type: Boolean, default: true }
+  },
+  setup(__props, { expose: __expose }) {
+    const ns = useNamespace("pro-tree-check-filter");
+    const treeCheckFilterHeader = ref(null);
+    const { height: treeCheckFilterHeaderHeight } = useElementSize(treeCheckFilterHeader, void 0, {
+      box: "border-box"
+    });
+    const props = __props;
+    const checkAll = ref(false);
+    const indeterminate = ref(false);
+    const queryValue = ref("");
+    const treeRef = ref();
+    const handelSearch = () => {
+      treeRef.value?.filter(queryValue.value);
+    };
+    const filterNode = (value, data) => {
+      if (!value) return true;
+      return data.label.includes(value);
+    };
+    const handleCheckAllChange = () => {
+      if (checkAll.value) {
+        treeRef.value?.setCheckedNodes([]);
+        checkAll.value = false;
+        indeterminate.value = false;
+      } else {
+        const currentCheckedKeys = treeRef.value?.getCheckedKeys();
+        const nodesMap = treeRef.value?.store.nodesMap || {};
+        const visibleKeys = [];
+        Object.values(nodesMap).forEach((node) => {
+          if (node.level > 0 && node.visible && node.isLeaf && !node.disabled) {
+            visibleKeys.push(node.data[props.nodeKey]);
+          }
+        });
+        const finalKeys = Array.from(/* @__PURE__ */ new Set([...currentCheckedKeys, ...visibleKeys]));
+        treeRef.value?.setCheckedKeys(finalKeys);
+        checkAll.value = isAllAvailableChecked();
+        indeterminate.value = !checkAll.value && finalKeys.length > 0;
+      }
+    };
+    const handleTreeCheckChange = () => {
+      const currentCheckedKeys = treeRef.value?.getCheckedKeys();
+      checkAll.value = isAllAvailableChecked();
+      indeterminate.value = !checkAll.value && currentCheckedKeys.length > 0;
+    };
+    const isAllAvailableChecked = () => {
+      const nodesMap = treeRef.value?.store.nodesMap || {};
+      const availableNodes = Object.values(nodesMap).filter((node) => node.level > 0 && !node.disabled);
+      if (availableNodes.length === 0) return false;
+      return availableNodes.every((node) => node.checked);
+    };
+    __expose(
+      new Proxy(
+        {},
+        {
+          get(_, key) {
+            return treeRef.value?.[key];
+          },
+          has(_, key) {
+            return key in treeRef.value;
+          }
+        }
+      )
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass({ [unref(ns).b()]: true, [unref(ns).is("border")]: __props.border })
+      }, [
+        __props.showCheckbox || __props.showSearch ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          ref_key: "treeCheckFilterHeader",
+          ref: treeCheckFilterHeader,
+          class: normalizeClass(unref(ns).e("header"))
+        }, [
+          __props.showCheckbox ? (openBlock(), createBlock(unref(FcCheckbox), {
+            key: 0,
+            "model-value": checkAll.value,
+            label: __props.label,
+            indeterminate: indeterminate.value,
+            onClick: handleCheckAllChange
+          }, null, 8, ["model-value", "label", "indeterminate"])) : createCommentVNode("", true),
+          __props.showSearch ? (openBlock(), createBlock(unref(FcInput), {
+            key: 1,
+            modelValue: queryValue.value,
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => queryValue.value = $event),
+            placeholder: "请输入关键词",
+            "prefix-icon": unref(Search),
+            onClear: handelSearch,
+            onKeyup: withKeys(handelSearch, ["enter"])
+          }, null, 8, ["modelValue", "prefix-icon"])) : createCommentVNode("", true)
+        ], 2)) : createCommentVNode("", true),
+        createElementVNode("div", {
+          class: normalizeClass(unref(ns).e("body")),
+          style: normalizeStyle({ height: `calc(100% - ${unref(treeCheckFilterHeaderHeight)}px)` })
+        }, [
+          createVNode(unref(FcScrollbar), { height: "100%" }, {
+            default: withCtx(() => [
+              createVNode(unref(FcTree), mergeProps(_ctx.$attrs, {
+                ref_key: "treeRef",
+                ref: treeRef,
+                "show-checkbox": "",
+                data: __props.data,
+                "filter-node-method": filterNode,
+                "node-key": __props.nodeKey,
+                onCheck: handleTreeCheckChange
+              }), null, 16, ["data", "node-key"])
+            ]),
+            _: 1
+          })
+        ], 6)
+      ], 2);
+    };
+  }
+});
+
+export { _sfc_main as default };

package/dist/esm/business/TreeCheckFilter/TreeCheckFilter.vue3.mjs

@@ -0,0 +1,6 @@
+import _sfc_main from './TreeCheckFilter.vue.mjs';
+/* empty css                      */
+
+
+
+export { _sfc_main as default };

package/dist/esm/business/TreeCheckFilter/index.mjs

@@ -0,0 +1,7 @@
+import _sfc_main from './TreeCheckFilter.vue.mjs';
+/* empty css                      */
+import { withInstall } from '../../_utils/with-install.mjs';
+
+const FcProTreeCheckFilter = withInstall(_sfc_main);
+
+export { FcProTreeCheckFilter, FcProTreeCheckFilter as default };

package/dist/esm/business/TreeTransfer/TreeTransfer.vue.mjs

@@ -0,0 +1,190 @@
+import { defineComponent, ref, createElementBlock, openBlock, normalizeClass, unref, createElementVNode, createVNode, mergeProps, createBlock, createCommentVNode, withCtx } from 'vue';
+import { useNamespace } from '../../hooks/use-namespace.mjs';
+import _sfc_main$1 from '../TreeCheckFilter/TreeCheckFilter.vue.mjs';
+/* empty css                                       */
+import '../../components/Button/index.mjs';
+import '../../components/Dialog/index.mjs';
+import '../../components/ConfigProvider/index.mjs';
+import '../../components/Input/index.mjs';
+import '../../components/Tree/index.mjs';
+import '../../components/Tabs/index.mjs';
+import '../../components/TabPane/index.mjs';
+import '../../components/Steps/index.mjs';
+import '../../components/Step/index.mjs';
+import '../../components/InputNumber/index.mjs';
+import '../../components/Select/index.mjs';
+import '../../components/Option/index.mjs';
+import '../../components/DatePicker/index.mjs';
+import '../../components/DatePickerPanel/index.mjs';
+import { FcTooltip } from '../../components/Tooltip/index.mjs';
+import '../../components/Icon/index.mjs';
+import { FcNotification } from '../../components/Notification/index.mjs';
+import '../../components/Link/index.mjs';
+import '../../components/Text/index.mjs';
+import '../../components/Scrollbar/index.mjs';
+import '../../components/Splitter/index.mjs';
+import '../../components/SplitterPanel/index.mjs';
+import '../../components/Autocomplete/index.mjs';
+import '../../components/Cascader/index.mjs';
+import '../../components/CascaderPanel/index.mjs';
+import '../../components/Checkbox/index.mjs';
+import '../../components/CheckboxGroup/index.mjs';
+import '../../components/CheckboxButton/index.mjs';
+import '../../components/Form/index.mjs';
+import '../../components/FormItem/index.mjs';
+import '../../components/InputTag/index.mjs';
+import '../../components/Radio/index.mjs';
+import '../../components/RadioGroup/index.mjs';
+import '../../components/SelectV2/index.mjs';
+import '../../components/Switch/index.mjs';
+import '../../components/TimePicker/index.mjs';
+import '../../components/TimeSelect/index.mjs';
+import '../../components/TreeSelect/index.mjs';
+import '../../components/Upload/index.mjs';
+import '../../components/Avatar/index.mjs';
+import '../../components/AvatarGroup/index.mjs';
+import '../../components/Badge/index.mjs';
+import '../../components/Card/index.mjs';
+import '../../components/Descriptions/index.mjs';
+import '../../components/DescriptionsItem/index.mjs';
+import '../../components/Empty/index.mjs';
+import '../../components/Image/index.mjs';
+import '../../components/ImageViewer/index.mjs';
+import '../../components/Pagination/index.mjs';
+import '../../components/Table/index.mjs';
+import '../../components/TableColumn/index.mjs';
+import '../../components/TableV2/index.mjs';
+import '../../components/Tag/index.mjs';
+import '../../components/Breadcrumb/index.mjs';
+import '../../components/BreadcrumbItem/index.mjs';
+import '../../components/Drawer/index.mjs';
+import '../../components/Popconfirm/index.mjs';
+import { FcIconComponent } from '../../components/IconComponent/index.mjs';
+import '../../components/Popover/index.mjs';
+import '../../components/Result/index.mjs';
+import '../../components/Progress/index.mjs';
+import '../../components/Divider/index.mjs';
+import '../../components/Dropdown/index.mjs';
+import '../../components/DropdownMenu/index.mjs';
+import '../../components/DropdownItem/index.mjs';
+import '../../components/Menu/index.mjs';
+import '../../components/SubMenu/index.mjs';
+import '../../components/MenuItem/index.mjs';
+import '../../components/RadioButton/index.mjs';
+import '../../components/MenuItemGroup/index.mjs';
+import '../../components/Collapse/index.mjs';
+import '../../components/CollapseItem/index.mjs';
+import '../../components/ContextMenu/index.mjs';
+import '../../components/CodeEditor/index.mjs';
+import '../../components/RichEditor/index.mjs';
+
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "FcProTreeTransfer",
+    inheritAttrs: false
+  },
+  __name: "TreeTransfer",
+  props: {
+    leftProps: { default: () => ({}) },
+    rightProps: { default: () => ({}) }
+  },
+  emits: ["add", "remove"],
+  setup(__props, { emit: __emit }) {
+    const ns = useNamespace("pro-tree-transfer");
+    const leftTreeRef = ref();
+    const rightTreeRef = ref();
+    const emits = __emit;
+    const handleAddClick = () => {
+      const keys = leftTreeRef.value?.getCheckedKeys(false) || [];
+      if (keys.length === 0) {
+        FcNotification({
+          type: "warning",
+          message: "请选择左侧内容"
+        });
+        return;
+      }
+      const nodes = leftTreeRef.value?.getCheckedNodes(false, false) || [];
+      emits("add", leftTreeRef.value, nodes, keys);
+    };
+    const handleRemoveClick = () => {
+      const keys = rightTreeRef.value?.getCheckedKeys(false) || [];
+      if (keys.length === 0) {
+        FcNotification({
+          type: "warning",
+          message: "请选择右侧内容"
+        });
+        return;
+      }
+      const nodes = rightTreeRef.value?.getCheckedNodes(false, false) || [];
+      emits("remove", rightTreeRef.value, nodes, keys);
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(unref(ns).b())
+      }, [
+        createElementVNode("div", {
+          class: normalizeClass(unref(ns).e("left"))
+        }, [
+          createVNode(_sfc_main$1, mergeProps({
+            ref_key: "leftTreeRef",
+            ref: leftTreeRef
+          }, __props.leftProps), null, 16)
+        ], 2),
+        createElementVNode("div", {
+          class: normalizeClass(unref(ns).e("center"))
+        }, [
+          !__props.leftProps.hiddenBtn ? (openBlock(), createBlock(unref(FcTooltip), {
+            key: 0,
+            content: __props.leftProps.tooltip || "新增",
+            placement: "top",
+            "fallback-placements": ["top", "bottom", "left", "right"]
+          }, {
+            default: withCtx(() => [
+              createElementVNode("div", {
+                class: normalizeClass(unref(ns).e("right")),
+                onClick: handleAddClick
+              }, [
+                createVNode(unref(FcIconComponent), {
+                  name: "FcRightArrow",
+                  size: "32",
+                  color: "#165dff"
+                })
+              ], 2)
+            ]),
+            _: 1
+          }, 8, ["content"])) : createCommentVNode("", true),
+          !__props.rightProps.hiddenBtn ? (openBlock(), createBlock(unref(FcTooltip), {
+            key: 1,
+            content: __props.rightProps.tooltip || "删除",
+            placement: "top",
+            "fallback-placements": ["top", "bottom", "left", "right"]
+          }, {
+            default: withCtx(() => [
+              createElementVNode("div", {
+                class: normalizeClass(unref(ns).e("left")),
+                onClick: handleRemoveClick
+              }, [
+                createVNode(unref(FcIconComponent), {
+                  name: "FcLeftArrow",
+                  size: "32",
+                  color: "#ff3232"
+                })
+              ], 2)
+            ]),
+            _: 1
+          }, 8, ["content"])) : createCommentVNode("", true)
+        ], 2),
+        createElementVNode("div", {
+          class: normalizeClass(unref(ns).e("right"))
+        }, [
+          createVNode(_sfc_main$1, mergeProps({
+            ref_key: "rightTreeRef",
+            ref: rightTreeRef
+          }, __props.rightProps), null, 16)
+        ], 2)
+      ], 2);
+    };
+  }
+});
+
+export { _sfc_main as default };

package/dist/esm/business/TreeTransfer/TreeTransfer.vue3.mjs

@@ -0,0 +1,6 @@
+import _sfc_main from './TreeTransfer.vue.mjs';
+/* empty css                   */
+
+
+
+export { _sfc_main as default };

package/dist/esm/business/TreeTransfer/index.mjs

@@ -0,0 +1,7 @@
+import _sfc_main from './TreeTransfer.vue.mjs';
+/* empty css                   */
+import { withInstall } from '../../_utils/with-install.mjs';
+
+const FcProTreeTransfer = withInstall(_sfc_main);
+
+export { FcProTreeTransfer, FcProTreeTransfer as default };

package/dist/esm/business/index.mjs

@@ -1,3 +1,5 @@
 export { FcProSidebarMainLayout } from './SidebarMainLayout/index.mjs';
 export { FcProDataTable } from './DataTable/index.mjs';
 export { FcProForm } from './ProForm/index.mjs';
+export { FcProTreeCheckFilter } from './TreeCheckFilter/index.mjs';
+export { FcProTreeTransfer } from './TreeTransfer/index.mjs';

package/dist/esm/index.mjs

@@ -87,6 +87,8 @@ export { FcRichEditor, FcRichEditorInput } from './components/RichEditor/index.m
 export { FcProSidebarMainLayout } from './business/SidebarMainLayout/index.mjs';
 export { FcProDataTable } from './business/DataTable/index.mjs';
 export { FcProForm } from './business/ProForm/index.mjs';
+export { FcProTreeCheckFilter } from './business/TreeCheckFilter/index.mjs';
+export { FcProTreeTransfer } from './business/TreeTransfer/index.mjs';
 
 const components = Object.keys(index$1).map((key) => {
   return index$1[key];

package/dist/esm/packages/ui/package.json.mjs

@@ -1,3 +1,3 @@
-const version = "1.1.8";
+const version = "1.1.10";
 
 export { version };

package/dist/style.css

@@ -17107,7 +17107,7 @@ to {
 .fc-mkui-data-table .fc-mkui-data-table__query-form {
   flex: 1;
   display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
+  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
   gap: 8px 24px;
 }
 .fc-mkui-data-table .fc-mkui-data-table__query-form .fc-ui-form-item {
@@ -17136,4 +17136,65 @@ to {
 }
 .fc-mkui-data-table__actions .fc-ui-button {
   margin: 0;
+}.fc-mkui-pro-tree-check-filter {
+  height: 100%;
+}
+.fc-mkui-pro-tree-check-filter.is-border {
+  border: 1px solid #c5d6ff;
+  border-radius: 2px;
+}
+.fc-mkui-pro-tree-check-filter__header {
+  display: flex;
+  align-items: center;
+  gap: 30%;
+  padding: 10px;
+  border-bottom: 1px solid #c5d6ff;
+}.fc-mkui-pro-tree-transfer {
+  display: flex;
+  width: 100%;
+  height: 100%;
+}
+.fc-mkui-pro-tree-transfer__left {
+  flex: 1;
+}
+.fc-mkui-pro-tree-transfer__left .fc-mkui-pro-tree-check-filter.is-border {
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+}
+.fc-mkui-pro-tree-transfer__right {
+  flex: 1;
+}
+.fc-mkui-pro-tree-transfer__right .fc-mkui-pro-tree-check-filter.is-border {
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
+}
+.fc-mkui-pro-tree-transfer__center {
+  display: flex;
+  flex-direction: column;
+  width: 52px;
+  flex-shrink: 0;
+  border-top: 1px solid #c5d6ff;
+  border-bottom: 1px solid #c5d6ff;
+}
+.fc-mkui-pro-tree-transfer__center .fc-mkui-pro-tree-transfer__right {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: all 0.3s;
+}
+.fc-mkui-pro-tree-transfer__center .fc-mkui-pro-tree-transfer__right:hover {
+  background: #f5f7fa;
+  cursor: pointer;
+}
+.fc-mkui-pro-tree-transfer__center .fc-mkui-pro-tree-transfer__left {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: all 0.3s;
+}
+.fc-mkui-pro-tree-transfer__center .fc-mkui-pro-tree-transfer__left:hover {
+  background: #f5f7fa;
+  cursor: pointer;
 }

package/dist/types/business/TreeCheckFilter/TreeCheckFilter.types.d.ts

@@ -0,0 +1 @@
+export {};