@fewangsit/wangsvue-fats 1.0.1-alpha.8 → 1.0.1-rc.0

package/tree/index.es.js

@@ -0,0 +1,261 @@
+import { defineComponent as _, useSlots as ee, computed as M, onMounted as te, onBeforeUnmount as se, ref as i, shallowRef as le, nextTick as E, watch as D, createBlock as oe, openBlock as ne, mergeProps as ae, createSlots as de, withCtx as ie, renderSlot as re } from "vue";
+import { e as b } from "../buttonbulkaction/ButtonBulkAction.es.js";
+import { u as ce } from "../animation/Animation.es.js";
+import { m as ue } from "../utils/mergePropsWithDefaults.util.es.js";
+import { f as pe, a as fe } from "../assetinfo/AssetInfo.es.js";
+import ye from "../basetree/index.es.js";
+const Se = /* @__PURE__ */ _({
+  __name: "Tree",
+  props: {
+    filter: {},
+    type: {},
+    fetchTree: {},
+    params: {},
+    selectedKeys: { default: void 0 },
+    selectedTreeNodes: {},
+    selectionMode: { default: "checkbox" },
+    useOption: { type: Boolean, default: !1 },
+    listLabelsNoOption: {},
+    treeNodeMenus: {},
+    autoSelectAll: { type: Boolean, default: !1 },
+    selectLastNode: { type: Boolean, default: !1 },
+    disableNodeAll: { type: Boolean, default: !1 },
+    includeNodeAllKey: { type: Boolean, default: !1 },
+    disableKeys: {},
+    exactDisableKeys: {},
+    readonly: { type: Boolean },
+    selectDisposableOnly: { type: Boolean },
+    flattenDisposableNode: { type: Boolean },
+    excludedKeys: {},
+    shouldEmitEventOnChange: { type: Boolean, default: !1 },
+    level: {},
+    value: {},
+    propagateSelection: { type: Boolean, default: !0 },
+    expandedKeys: {},
+    selectionKeys: {},
+    metaKeySelection: { type: Boolean },
+    loading: { type: Boolean },
+    showDisposableGroups: { type: Boolean },
+    loadingIcon: {},
+    loadingMode: {},
+    filterText: {},
+    filterBy: {},
+    filterMode: {},
+    filterPlaceholder: {},
+    filterLocale: {},
+    highlightOnSelect: { type: Boolean },
+    scrollHeight: {},
+    ariaLabel: {},
+    ariaLabelledby: {},
+    pt: {},
+    ptOptions: {},
+    unstyled: { type: Boolean },
+    disableNodeWhen: {},
+    exactDisableNodeWhen: {},
+    nodeSelectedWhen: {}
+  },
+  emits: ["update:selectedKeys", "update:selectedTreeNodes", "nodeSelect", "nodeUnselect", "toggleMenu"],
+  setup(I, { expose: J, emit: W }) {
+    const s = I, $ = ee(), { defaultProps: U } = ce("Tree"), P = M(() => ue(s, U)), c = W;
+    te(() => {
+      b.on("tree:update-tree-nodes", K), x(s.filter), N();
+    }), se(() => {
+      b.off("tree:update-tree-nodes", K);
+    });
+    const m = i(!0), G = i((/* @__PURE__ */ new Date()).getTime().toString()), j = i(), p = i([]), f = i([]), g = i({}), v = i(!1), d = i({ "-1": !0 }), S = i(!1), y = M({
+      get: () => s.selectedKeys ?? {},
+      set: (e) => {
+        c("update:selectedKeys", e);
+      }
+    }), r = le({}), F = (e) => {
+      if (s.selectionMode === "checkbox") {
+        const t = (l, o) => {
+          l.forEach((n) => {
+            var h;
+            const u = JSON.stringify(n.key), a = !!(e != null && e.includes(Number(n.key)));
+            r.value[u] = { checked: a }, (h = n.children) != null && h.length && t(n.children, u), o && R(o);
+          });
+        };
+        t(p.value);
+      } else {
+        const t = e == null ? void 0 : e[0];
+        t && (r.value = { [t]: !0 });
+      }
+    }, H = (e) => Array.isArray(e) && e.every((t) => typeof t == "number"), R = (e) => {
+      const t = V(e), l = r.value[e].checked || t, o = !t && z(e);
+      r.value[e] = {
+        // It should be checked when not partial checked, when it partially checked, the checked value should be false
+        checked: !o && l,
+        partialChecked: o
+      };
+    }, V = (e) => {
+      var t;
+      return (t = g.value[e]) == null ? void 0 : t.every((l) => {
+        var n;
+        const o = JSON.stringify(l);
+        return (n = r.value[o]) == null ? void 0 : n.checked;
+      });
+    }, z = (e) => {
+      var t;
+      return (t = g.value[e]) == null ? void 0 : t.some((l) => {
+        var n, u;
+        const o = JSON.stringify(l);
+        return ((n = r.value[o]) == null ? void 0 : n.checked) || ((u = r.value[o]) == null ? void 0 : u.partialChecked);
+      });
+    }, k = (e) => e.map((t) => {
+      var l;
+      return (l = t.children) != null && l.length && (g.value = {
+        ...g.value,
+        [t.key.toString()]: t.children.map((o) => Number(o.key))
+      }, t.children = k(t.children)), s.disableNodeWhen && (t.selectable = !s.disableNodeWhen(t)), t;
+    }), K = () => {
+      (async () => (c("update:selectedKeys", {}), await N(!1), A()))();
+    }, N = async (e = !0) => {
+      try {
+        m.value = !0;
+        const { data: t } = await P.value.fetchTree(s.type, s.params);
+        if (t) {
+          const l = k(t);
+          f.value = pe(t), p.value = l, sessionStorage.setItem(`${s.type}Tree`, JSON.stringify(l)), sessionStorage.setItem(
+            `flatten${s.type}nodes`,
+            JSON.stringify(f.value)
+          );
+        }
+        s.selectLastNode && s.selectionMode === "single" && await E(Q), s.autoSelectAll && s.selectionMode === "checkbox" && await E(Y);
+      } finally {
+        H(s.selectedKeys) && (F(s.selectedKeys), y.value = r.value), e || b.emit("tree:tree-updated"), m.value = !1;
+      }
+    }, Q = async () => {
+      var h, T;
+      const e = sessionStorage.getItem(
+        `${s.type.toLowerCase()}Node`
+      ), t = (h = p.value) == null ? void 0 : h[0], l = (T = t == null ? void 0 : t.children) == null ? void 0 : T[0], o = e ? JSON.parse(e) : null, n = (o == null ? void 0 : o.key) == -1, u = s.disableNodeAll ? l : t, a = n && s.disableNodeAll ? (
+        // When last node is All, and disableNodeExist, it should select the firstChild of all
+        l
+      ) : o ?? u;
+      if ((a == null ? void 0 : a.key) != null && X(a == null ? void 0 : a.key)) {
+        y.value = { [a == null ? void 0 : a.key]: !0 };
+        const L = sessionStorage.getItem(
+          `${s.type.toLowerCase()}NodeExpandedKeys`
+        );
+        L && (d.value = JSON.parse(L)), C(a);
+      }
+    }, X = (e) => f.value.some((t) => t.key === e), C = (e) => {
+      c("nodeSelect", e), s.shouldEmitEventOnChange && (sessionStorage.setItem(
+        `${s.type.toLowerCase()}Node`,
+        JSON.stringify(e)
+      ), sessionStorage.setItem(
+        `${s.type.toLowerCase()}NodeExpandedKeys`,
+        JSON.stringify(d.value)
+      ));
+    }, Y = () => {
+      const e = {};
+      f.value.forEach((t) => {
+        e[t.key] = {
+          checked: !0,
+          partialChecked: !1
+        };
+      }), y.value = e;
+    }, w = () => {
+      v.value = !0;
+      for (const e of p.value)
+        O(e);
+      d.value = { ...d.value };
+    }, O = (e) => {
+      var t;
+      if ((t = e.children) != null && t.length) {
+        d.value[e.key ?? ""] = !0;
+        for (const l of e.children)
+          O(l);
+      }
+    }, Z = () => {
+      d.value = { "-1": !0 }, v.value = !1;
+    }, A = () => {
+      if (s.selectedKeys) {
+        const e = Array.isArray(s.selectedKeys) ? s.selectedKeys : Object.keys(
+          fe(s.selectedKeys, s.includeNodeAllKey)
+        ).map(Number), t = f.value.filter(
+          (l) => e.includes(l.key)
+        );
+        s.shouldEmitEventOnChange && (sessionStorage.setItem(
+          `${s.type.toLowerCase()}Keys`,
+          JSON.stringify(e)
+        ), b.emit("tree:selection-changed", {
+          keys: JSON.stringify(e)
+        })), c("update:selectedTreeNodes", t);
+      }
+    }, x = (e) => {
+      e != null && e.length ? w() : B();
+    }, q = (e) => {
+      s.readonly || C(e);
+    }, B = () => {
+      d.value = { "-1": !0 };
+    };
+    return D(
+      () => s.filter,
+      (e) => {
+        x(e);
+      }
+    ), D(
+      () => [s.selectedKeys, s.type],
+      async (e, t) => {
+        e[1] !== t[1] && (c("update:selectedKeys", {}), await N()), A();
+      }
+    ), J({
+      treeNodes: p,
+      flatNodes: f,
+      isLoading: m,
+      showDisposableGroups: S,
+      isExpandedAll: v,
+      collapseAll: Z,
+      expandAll: w,
+      expandNodeAll: B,
+      fetchTreeList: N
+    }), (e, t) => (ne(), oe(ye, ae({
+      id: G.value,
+      ref_key: "tree",
+      ref: j
+    }, e.$attrs, {
+      "expanded-keys": d.value,
+      "onUpdate:expandedKeys": t[0] || (t[0] = (l) => d.value = l),
+      "selection-keys": y.value,
+      "onUpdate:selectionKeys": t[1] || (t[1] = (l) => y.value = l),
+      class: { readonly: s.readonly },
+      "disable-keys": e.disableKeys,
+      "disable-node-all": s.disableNodeAll,
+      "disable-node-when": e.disableNodeWhen,
+      "exact-disable-keys": e.exactDisableKeys,
+      "exact-disable-node-when": e.exactDisableNodeWhen,
+      "filter-text": e.filter,
+      "list-labels-no-option": e.listLabelsNoOption,
+      loading: m.value,
+      "node-selected-when": e.nodeSelectedWhen,
+      "propagate-selection": e.propagateSelection,
+      "selection-mode": s.selectionMode,
+      "show-disposable-groups": S.value,
+      "tree-node-menus": e.treeNodeMenus,
+      "use-option": e.useOption,
+      value: p.value,
+      onNodeCollapse: t[2] || (t[2] = (l) => v.value = !1),
+      onNodeSelect: q,
+      onNodeUnselect: t[3] || (t[3] = (l) => c("nodeUnselect", l)),
+      onToggleMenu: t[4] || (t[4] = (l) => c("toggleMenu", l)),
+      "filter-by": "name"
+    }), de({ _: 2 }, [
+      $.default ? {
+        name: "default",
+        fn: ie(({ node: l, checked: o, disabled: n }) => [
+          re(e.$slots, "default", {
+            checked: o,
+            disabled: n,
+            node: l
+          })
+        ]),
+        key: "0"
+      } : void 0
+    ]), 1040, ["id", "expanded-keys", "selection-keys", "class", "disable-keys", "disable-node-all", "disable-node-when", "exact-disable-keys", "exact-disable-node-when", "filter-text", "list-labels-no-option", "loading", "node-selected-when", "propagate-selection", "selection-mode", "show-disposable-groups", "tree-node-menus", "use-option", "value"]));
+  }
+});
+export {
+  Se as default
+};

package/tree/package.json

@@ -0,0 +1,4 @@
+{
+  "module": "./index.es.js",
+  "types": "./index.d.ts"
+}