@ibiz-template/vue3-components 0.2.0 → 0.2.2

package/es/control/list/list.mjs

@@ -3,6 +3,8 @@ import { useControlController, useNamespace } from '@ibiz-template/vue3-util';
 import { isNil } from 'lodash-es';
 import { ListController } from '@ibiz-template/runtime';
 import './list.css';
+import '../../util/index.mjs';
+import { usePagination } from '../../util/pagination/use-pagination.mjs';
 
 "use strict";
 function _isSlot(s) {
@@ -61,8 +63,16 @@ const ListControl = /* @__PURE__ */ defineComponent({
   setup(props) {
     const c = useControlController((...args) => new ListController(...args));
     const ns = useNamespace(`control-${c.model.controlType.toLowerCase()}`);
-    const isLodeMore = computed(() => {
-      return c.state.items.length >= c.state.total || c.state.isLoading;
+    const {
+      onPageChange,
+      onPageRefresh,
+      onPageSizeChange
+    } = usePagination(c);
+    const isLodeMoreDisabled = computed(() => {
+      if (c.model.enablePagingBar === true) {
+        return true;
+      }
+      return c.state.items.length >= c.state.total || c.state.isLoading || c.state.total <= c.state.size;
     });
     const renderPanelItem = (item, modelData) => {
       const {
@@ -127,7 +137,7 @@ const ListControl = /* @__PURE__ */ defineComponent({
       return withDirectives(createVNode("div", {
         "class": [ns.b("scroll"), ns.b("content")],
         "infinite-scroll-distance": 10,
-        "infinite-scroll-disabled": isLodeMore.value
+        "infinite-scroll-disabled": isLodeMoreDisabled.value
       }, [c.state.items.map((item) => {
         return createVNode("div", {
           "class": [ns.b("scroll-item")]
@@ -173,6 +183,7 @@ const ListControl = /* @__PURE__ */ defineComponent({
         return;
       }
       return isLoaded && createVNode(resolveComponent("iBizNoData"), {
+        "class": ns.b("content"),
         "text": c.model.emptyText,
         "emptyTextLanguageRes": c.model.emptyTextLanguageRes
       }, _isSlot(_slot = renderQuickToolBar()) ? _slot : {
@@ -184,14 +195,33 @@ const ListControl = /* @__PURE__ */ defineComponent({
       ns,
       renderListContent,
       renderNoData,
-      renderBatchToolBar
+      renderBatchToolBar,
+      onPageChange,
+      onPageRefresh,
+      onPageSizeChange
     };
   },
   render() {
+    const {
+      enablePagingBar
+    } = this.c.model;
+    let content = null;
+    if (this.c.state.isCreated) {
+      content = [this.c.state.items.length > 0 ? this.renderListContent() : this.renderNoData(), this.renderBatchToolBar(), enablePagingBar ? createVNode(resolveComponent("iBizPagination"), {
+        "class": this.ns.e("pagination"),
+        "total": this.c.state.total,
+        "curPage": this.c.state.curPage,
+        "size": this.c.state.size,
+        "onChange": this.onPageChange,
+        "onPageSizeChange": this.onPageSizeChange,
+        "onPageRefresh": this.onPageRefresh
+      }, null) : null];
+    }
     return createVNode(resolveComponent("iBizControlBase"), {
+      "class": [this.ns.is("enable-page", !!enablePagingBar)],
       "controller": this.c
-    }, {
-      default: () => [this.c.state.isCreated && (this.c.state.items.length > 0 ? this.renderListContent() : this.renderNoData()), this.renderBatchToolBar()]
+    }, _isSlot(content) ? content : {
+      default: () => [content]
     });
   }
 });

package/es/control/tree/el-tree-util.d.ts

@@ -15,67 +15,39 @@ export declare function useElTreeUtil(treeRef: Ref<InstanceType<typeof ElTree> |
     getTreeInstance: () => {
         $: import("vue").ComponentInternalInstance;
         $data: {};
-        $props: {
-            props?: import("element-plus/es/components/tree/src/tree.type").TreeOptionProps | undefined;
-            data?: unknown[] | undefined;
-            checkStrictly?: boolean | undefined;
-            lazy?: boolean | undefined;
-            accordion?: boolean | undefined;
-            draggable?: boolean | undefined;
-            defaultExpandAll?: boolean | undefined;
-            indent?: number | undefined;
-            renderAfterExpand?: boolean | undefined;
-            showCheckbox?: boolean | undefined;
-            expandOnClickNode?: boolean | undefined;
-            checkOnClickNode?: boolean | undefined;
-            checkDescendants?: boolean | undefined;
-            autoExpandParent?: boolean | undefined;
-            highlightCurrent?: boolean | undefined;
-            style?: unknown;
-            class?: unknown;
+        $props: Partial<{
+            props: import("element-plus/es/components/tree/src/tree.type").TreeOptionProps;
+            data: unknown[];
+            checkStrictly: boolean;
+            lazy: boolean;
+            accordion: boolean;
+            draggable: boolean;
+            defaultExpandAll: boolean;
+            indent: number;
+            renderAfterExpand: boolean;
+            showCheckbox: boolean;
+            expandOnClickNode: boolean;
+            checkOnClickNode: boolean;
+            checkDescendants: boolean;
+            autoExpandParent: boolean;
+            highlightCurrent: boolean;
+        }> & Omit<{
+            readonly props: import("element-plus/es/components/tree/src/tree.type").TreeOptionProps;
+            readonly data: unknown[];
+            readonly renderAfterExpand: boolean;
+            readonly checkStrictly: boolean;
+            readonly defaultExpandAll: boolean;
+            readonly expandOnClickNode: boolean;
+            readonly checkOnClickNode: boolean;
+            readonly checkDescendants: boolean;
+            readonly autoExpandParent: boolean;
+            readonly showCheckbox: boolean;
+            readonly draggable: boolean;
+            readonly lazy: boolean;
+            readonly highlightCurrent: boolean;
+            readonly accordion: boolean;
+            readonly indent: number;
             readonly icon?: string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions> | undefined;
-            key?: string | number | symbol | undefined;
-            ref?: import("vue").VNodeRef | undefined;
-            ref_for?: boolean | undefined;
-            ref_key?: string | undefined;
-            onVnodeBeforeMount?: ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void) | ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void)[] | undefined;
-            onVnodeMounted?: ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void) | ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void)[] | undefined;
-            onVnodeBeforeUpdate?: ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>, oldVNode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void) | ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>, oldVNode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void)[] | undefined;
-            onVnodeUpdated?: ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>, oldVNode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void) | ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>, oldVNode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void)[] | undefined;
-            onVnodeBeforeUnmount?: ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void) | ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void)[] | undefined;
-            onVnodeUnmounted?: ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void) | ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void)[] | undefined;
             readonly emptyText?: string | undefined;
             readonly load?: import("element-plus/es/components/tree/src/tree.type").LoadFunction | undefined;
             readonly nodeKey?: string | undefined;
@@ -86,9 +58,88 @@ export declare function useElTreeUtil(treeRef: Ref<InstanceType<typeof ElTree> |
             readonly allowDrag?: Function | undefined;
             readonly allowDrop?: Function | undefined;
             readonly filterNodeMethod?: import("element-plus/es/components/tree/src/tree.type").FilterNodeMethodFunction | undefined;
+            "onCurrent-change"?: ((...args: any[]) => any) | undefined;
+            "onNode-expand"?: ((...args: any[]) => any) | undefined;
             onCheck?: ((...args: any[]) => any) | undefined;
+            "onCheck-change"?: ((...args: any[]) => any) | undefined;
+            "onNode-click"?: ((...args: any[]) => any) | undefined;
+            "onNode-contextmenu"?: ((...args: any[]) => any) | undefined;
+            "onNode-collapse"?: ((...args: any[]) => any) | undefined;
+            "onNode-drag-start"?: ((...args: any[]) => any) | undefined;
+            "onNode-drag-end"?: ((...args: any[]) => any) | undefined;
+            "onNode-drop"?: ((...args: any[]) => any) | undefined;
+            "onNode-drag-leave"?: ((...args: any[]) => any) | undefined;
+            "onNode-drag-enter"?: ((...args: any[]) => any) | undefined;
+            "onNode-drag-over"?: ((...args: any[]) => any) | undefined;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & Readonly<import("vue").ExtractPropTypes<{
+            data: {
+                type: ArrayConstructor;
+                default: () => never[];
+            };
+            emptyText: {
+                type: StringConstructor;
+            };
+            renderAfterExpand: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            nodeKey: StringConstructor;
+            checkStrictly: BooleanConstructor;
+            defaultExpandAll: BooleanConstructor;
+            expandOnClickNode: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            checkOnClickNode: BooleanConstructor;
+            checkDescendants: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            autoExpandParent: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            defaultCheckedKeys: import("vue").PropType<import("element-plus/es/components/tree/src/tree.type").TreeKey[]>;
+            defaultExpandedKeys: import("vue").PropType<import("element-plus/es/components/tree/src/tree.type").TreeKey[]>;
+            currentNodeKey: import("vue").PropType<string | number>;
+            renderContent: FunctionConstructor;
+            showCheckbox: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            draggable: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            allowDrag: FunctionConstructor;
+            allowDrop: FunctionConstructor;
+            props: {
+                type: import("vue").PropType<import("element-plus/es/components/tree/src/tree.type").TreeOptionProps>;
+                default: () => {
+                    children: string;
+                    label: string;
+                    disabled: string;
+                };
+            };
+            lazy: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            highlightCurrent: BooleanConstructor;
+            load: import("vue").PropType<import("element-plus/es/components/tree/src/tree.type").LoadFunction>;
+            filterNodeMethod: import("vue").PropType<import("element-plus/es/components/tree/src/tree.type").FilterNodeMethodFunction>;
+            accordion: BooleanConstructor;
+            indent: {
+                type: NumberConstructor;
+                default: number;
+            };
+            icon: {
+                type: import("vue").PropType<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>;
+            };
+        }>> & {
             "onCurrent-change"?: ((...args: any[]) => any) | undefined;
             "onNode-expand"?: ((...args: any[]) => any) | undefined;
+            onCheck?: ((...args: any[]) => any) | undefined;
             "onCheck-change"?: ((...args: any[]) => any) | undefined;
             "onNode-click"?: ((...args: any[]) => any) | undefined;
             "onNode-contextmenu"?: ((...args: any[]) => any) | undefined;
@@ -99,7 +150,7 @@ export declare function useElTreeUtil(treeRef: Ref<InstanceType<typeof ElTree> |
             "onNode-drag-leave"?: ((...args: any[]) => any) | undefined;
             "onNode-drag-enter"?: ((...args: any[]) => any) | undefined;
             "onNode-drag-over"?: ((...args: any[]) => any) | undefined;
-        };
+        }, "props" | "data" | "renderAfterExpand" | "checkStrictly" | "defaultExpandAll" | "expandOnClickNode" | "checkOnClickNode" | "checkDescendants" | "autoExpandParent" | "showCheckbox" | "draggable" | "lazy" | "highlightCurrent" | "accordion" | "indent">;
         $attrs: {
             [x: string]: unknown;
         };

package/es/control/tree/index.d.ts

@@ -36,67 +36,39 @@ export declare const IBizTreeControl: import("@ibiz-template/vue3-util").TypeWit
     treeRef: import("vue").Ref<({
         $: import("vue").ComponentInternalInstance;
         $data: {};
-        $props: {
-            props?: import("element-plus/es/components/tree/src/tree.type").TreeOptionProps | undefined;
-            data?: unknown[] | undefined;
-            checkStrictly?: boolean | undefined;
-            lazy?: boolean | undefined;
-            accordion?: boolean | undefined;
-            draggable?: boolean | undefined;
-            defaultExpandAll?: boolean | undefined;
-            indent?: number | undefined;
-            renderAfterExpand?: boolean | undefined;
-            showCheckbox?: boolean | undefined;
-            expandOnClickNode?: boolean | undefined;
-            checkOnClickNode?: boolean | undefined;
-            checkDescendants?: boolean | undefined;
-            autoExpandParent?: boolean | undefined;
-            highlightCurrent?: boolean | undefined;
-            style?: unknown;
-            class?: unknown;
+        $props: Partial<{
+            props: import("element-plus/es/components/tree/src/tree.type").TreeOptionProps;
+            data: unknown[];
+            checkStrictly: boolean;
+            lazy: boolean;
+            accordion: boolean;
+            draggable: boolean;
+            defaultExpandAll: boolean;
+            indent: number;
+            renderAfterExpand: boolean;
+            showCheckbox: boolean;
+            expandOnClickNode: boolean;
+            checkOnClickNode: boolean;
+            checkDescendants: boolean;
+            autoExpandParent: boolean;
+            highlightCurrent: boolean;
+        }> & Omit<{
+            readonly props: import("element-plus/es/components/tree/src/tree.type").TreeOptionProps;
+            readonly data: unknown[];
+            readonly renderAfterExpand: boolean;
+            readonly checkStrictly: boolean;
+            readonly defaultExpandAll: boolean;
+            readonly expandOnClickNode: boolean;
+            readonly checkOnClickNode: boolean;
+            readonly checkDescendants: boolean;
+            readonly autoExpandParent: boolean;
+            readonly showCheckbox: boolean;
+            readonly draggable: boolean;
+            readonly lazy: boolean;
+            readonly highlightCurrent: boolean;
+            readonly accordion: boolean;
+            readonly indent: number;
             readonly icon?: string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions> | undefined;
-            key?: string | number | symbol | undefined;
-            ref?: import("vue").VNodeRef | undefined;
-            ref_for?: boolean | undefined;
-            ref_key?: string | undefined;
-            onVnodeBeforeMount?: ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void) | ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void)[] | undefined;
-            onVnodeMounted?: ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void) | ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void)[] | undefined;
-            onVnodeBeforeUpdate?: ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>, oldVNode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void) | ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>, oldVNode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void)[] | undefined;
-            onVnodeUpdated?: ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>, oldVNode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void) | ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>, oldVNode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void)[] | undefined;
-            onVnodeBeforeUnmount?: ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void) | ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void)[] | undefined;
-            onVnodeUnmounted?: ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void) | ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void)[] | undefined;
             readonly emptyText?: string | undefined;
             readonly load?: import("element-plus/es/components/tree/src/tree.type").LoadFunction | undefined;
             readonly nodeKey?: string | undefined;
@@ -107,9 +79,88 @@ export declare const IBizTreeControl: import("@ibiz-template/vue3-util").TypeWit
             readonly allowDrag?: Function | undefined;
             readonly allowDrop?: Function | undefined;
             readonly filterNodeMethod?: import("element-plus/es/components/tree/src/tree.type").FilterNodeMethodFunction | undefined;
+            "onCurrent-change"?: ((...args: any[]) => any) | undefined;
+            "onNode-expand"?: ((...args: any[]) => any) | undefined;
             onCheck?: ((...args: any[]) => any) | undefined;
+            "onCheck-change"?: ((...args: any[]) => any) | undefined;
+            "onNode-click"?: ((...args: any[]) => any) | undefined;
+            "onNode-contextmenu"?: ((...args: any[]) => any) | undefined;
+            "onNode-collapse"?: ((...args: any[]) => any) | undefined;
+            "onNode-drag-start"?: ((...args: any[]) => any) | undefined;
+            "onNode-drag-end"?: ((...args: any[]) => any) | undefined;
+            "onNode-drop"?: ((...args: any[]) => any) | undefined;
+            "onNode-drag-leave"?: ((...args: any[]) => any) | undefined;
+            "onNode-drag-enter"?: ((...args: any[]) => any) | undefined;
+            "onNode-drag-over"?: ((...args: any[]) => any) | undefined;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & Readonly<import("vue").ExtractPropTypes<{
+            data: {
+                type: ArrayConstructor;
+                default: () => never[];
+            };
+            emptyText: {
+                type: StringConstructor;
+            };
+            renderAfterExpand: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            nodeKey: StringConstructor;
+            checkStrictly: BooleanConstructor;
+            defaultExpandAll: BooleanConstructor;
+            expandOnClickNode: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            checkOnClickNode: BooleanConstructor;
+            checkDescendants: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            autoExpandParent: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            defaultCheckedKeys: import("vue").PropType<import("element-plus/es/components/tree/src/tree.type").TreeKey[]>;
+            defaultExpandedKeys: import("vue").PropType<import("element-plus/es/components/tree/src/tree.type").TreeKey[]>;
+            currentNodeKey: import("vue").PropType<string | number>;
+            renderContent: FunctionConstructor;
+            showCheckbox: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            draggable: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            allowDrag: FunctionConstructor;
+            allowDrop: FunctionConstructor;
+            props: {
+                type: import("vue").PropType<import("element-plus/es/components/tree/src/tree.type").TreeOptionProps>;
+                default: () => {
+                    children: string;
+                    label: string;
+                    disabled: string;
+                };
+            };
+            lazy: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            highlightCurrent: BooleanConstructor;
+            load: import("vue").PropType<import("element-plus/es/components/tree/src/tree.type").LoadFunction>;
+            filterNodeMethod: import("vue").PropType<import("element-plus/es/components/tree/src/tree.type").FilterNodeMethodFunction>;
+            accordion: BooleanConstructor;
+            indent: {
+                type: NumberConstructor;
+                default: number;
+            };
+            icon: {
+                type: import("vue").PropType<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>;
+            };
+        }>> & {
             "onCurrent-change"?: ((...args: any[]) => any) | undefined;
             "onNode-expand"?: ((...args: any[]) => any) | undefined;
+            onCheck?: ((...args: any[]) => any) | undefined;
             "onCheck-change"?: ((...args: any[]) => any) | undefined;
             "onNode-click"?: ((...args: any[]) => any) | undefined;
             "onNode-contextmenu"?: ((...args: any[]) => any) | undefined;
@@ -120,7 +171,7 @@ export declare const IBizTreeControl: import("@ibiz-template/vue3-util").TypeWit
             "onNode-drag-leave"?: ((...args: any[]) => any) | undefined;
             "onNode-drag-enter"?: ((...args: any[]) => any) | undefined;
             "onNode-drag-over"?: ((...args: any[]) => any) | undefined;
-        };
+        }, "props" | "data" | "renderAfterExpand" | "checkStrictly" | "defaultExpandAll" | "expandOnClickNode" | "checkOnClickNode" | "checkDescendants" | "autoExpandParent" | "showCheckbox" | "draggable" | "lazy" | "highlightCurrent" | "accordion" | "indent">;
         $attrs: {
             [x: string]: unknown;
         };