@fewangsit/wangsvue 1.5.219-alpha.0 → 1.5.219-alpha.2

package/customcolumn/index.es.js

@@ -1,21 +1,25 @@
-import { defineComponent as B, onMounted as L, ref as y, shallowRef as E, computed as w, createElementBlock as N, openBlock as v, Fragment as h, createBlock as V, createCommentVNode as k, unref as T, withCtx as M, createVNode as _, mergeProps as x } from "vue";
-import { u as H } from "../plugins/WangsVue.es.js";
-import { u as U, s as z, _ as D } from "../columnlist/index.es.js";
-import { s as F } from "../vendor/primevue/menu/menu.esm.es.js";
-import { _ as P } from "../button/index.es.js";
-import { c as R } from "../vendor/lodash-es/cloneDeep.es.js";
-async function S(f, u) {
-  const { config: p } = await U(), l = p[f];
-  return l ? l.map((a) => {
-    const n = u.find((o) => o.field === a.field);
-    if (!(!n || n.visible === !1))
+import { defineComponent, onMounted, ref, shallowRef, computed, createElementBlock, openBlock, Fragment, createBlock, createCommentVNode, unref, withCtx, createVNode, mergeProps } from "vue";
+import { u as useWangsVueConfig } from "../plugins/WangsVue.es.js";
+import { u as useDataTableStore, s as setVisibilityByMaxColumn, _ as _sfc_main$1 } from "../columnlist/index.es.js";
+import { s as script } from "../vendor/primevue/menu/menu.esm.es.js";
+import { _ as _sfc_main$2 } from "../button/index.es.js";
+import { c as cloneDeep } from "../vendor/lodash-es/cloneDeep.es.js";
+async function readConfig(tableId, defaultColumns) {
+  const { config } = await useDataTableStore();
+  const tableConfig = config[tableId];
+  if (tableConfig) {
+    return tableConfig.map((conf) => {
+      const foundCol = defaultColumns.find((col) => col.field === conf.field);
+      if (!foundCol || foundCol.visible === false) return void 0;
       return {
-        ...n,
-        ...a
+        ...foundCol,
+        ...conf
       };
-  }).filter((a) => !!a) : u;
+    }).filter((col) => !!col);
+  }
+  return defaultColumns;
 }
-const K = /* @__PURE__ */ B({
+const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "CustomColumn",
   props: {
     tableId: {},
@@ -25,114 +29,127 @@ const K = /* @__PURE__ */ B({
     type: { default: "menu" }
   },
   emits: ["update:visibleColumns"],
-  setup(f, { expose: u, emit: p }) {
-    const l = f, a = p;
-    L(() => b());
-    const { locale: n } = H("CustomColumn"), o = y(), r = y(), m = E([]), I = w(
-      () => "column-visibility-menu-" + l.tableId
-    ), i = w({
-      get: () => l.visibleColumns,
-      set: (e) => {
-        a(
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    onMounted(() => loadConfig());
+    const { locale } = useWangsVueConfig("CustomColumn");
+    const columnList = ref();
+    const visibilityMenu = ref();
+    const savedColumns = shallowRef([]);
+    const visibilityMenuId = computed(
+      () => "column-visibility-menu-" + props.tableId
+    );
+    const columnVisibilityModel = computed({
+      get: () => props.visibleColumns,
+      set: (cols) => {
+        emit(
           "update:visibleColumns",
-          e.filter((t) => t.visible != !1)
+          cols.filter((col) => col.visible != false)
         );
       }
-    }), $ = async (e) => {
-      if (await b(), r.value && "toggle" in r.value) {
-        const t = e.currentTarget ?? e.target, c = t.tagName.toLowerCase() === "th" ? t : t.parentElement, d = {
-          ...e,
-          currentTarget: c
+    });
+    const toggleMenu = async (event) => {
+      await loadConfig();
+      if (visibilityMenu.value && "toggle" in visibilityMenu.value) {
+        const eventTarget = event.currentTarget ?? event.target;
+        const currentTarget = eventTarget.tagName.toLowerCase() === "th" ? eventTarget : eventTarget.parentElement;
+        const toggleEvent = {
+          ...event,
+          currentTarget
         };
-        r.value.toggle(d);
+        visibilityMenu.value.toggle(toggleEvent);
       }
-    }, b = async () => {
-      const e = await S(
-        l.tableId,
-        R(l.defaultColumns)
+    };
+    const loadConfig = async () => {
+      const columns = await readConfig(
+        props.tableId,
+        cloneDeep(props.defaultColumns)
+      );
+      savedColumns.value = setVisibilityByMaxColumn(
+        columns,
+        props.maxColumn,
+        columns.filter((col) => col.visible !== false).length
       );
-      m.value = z(
-        e,
-        l.maxColumn,
-        e.filter((t) => t.visible !== !1).length
-      ), i.value = m.value.filter(
-        (t) => t.visible !== !1
+      columnVisibilityModel.value = savedColumns.value.filter(
+        (col) => col.visible !== false
       );
     };
-    return u({
-      toggleMenu: $,
+    __expose({
+      toggleMenu,
       resetToDefault: () => {
-        var e;
-        (e = o.value) == null || e.resetToDefault();
+        var _a;
+        (_a = columnList.value) == null ? void 0 : _a.resetToDefault();
       }
-    }), (e, t) => {
-      var c, d, g, C;
-      return v(), N(h, null, [
-        l.type === "menu" ? (v(), V(T(F), {
+    });
+    return (_ctx, _cache) => {
+      var _a, _b, _c, _d;
+      return openBlock(), createElementBlock(Fragment, null, [
+        props.type === "menu" ? (openBlock(), createBlock(unref(script), {
           key: 0,
-          id: I.value,
+          id: visibilityMenuId.value,
           ref_key: "visibilityMenu",
-          ref: r,
-          "data-table-id": e.tableId,
+          ref: visibilityMenu,
+          "data-table-id": _ctx.tableId,
           pt: {
             root: {
-              class: [...(c = e.$preset.menu) == null ? void 0 : c.root.class, "shadow-panel"]
+              class: [...(_a = _ctx.$preset.menu) == null ? void 0 : _a.root.class, "shadow-panel"]
             },
             start: {
               class: [
-                ...(d = e.$preset.menu) == null ? void 0 : d.start.class,
-                (g = e.$preset.customcolumn) == null ? void 0 : g.menustart.class
+                ...(_b = _ctx.$preset.menu) == null ? void 0 : _b.start.class,
+                (_c = _ctx.$preset.customcolumn) == null ? void 0 : _c.menustart.class
               ]
             }
           },
-          onHide: (C = o.value) == null ? void 0 : C.setColumnVisibilityConfig,
+          onHide: (_d = columnList.value) == null ? void 0 : _d.setColumnVisibilityConfig,
           "append-to": "body",
           "auto-z-index": "",
           "data-wv-name": "column-visibility",
           "data-wv-section": "menu",
           popup: ""
         }, {
-          start: M(() => {
-            var s;
+          start: withCtx(() => {
+            var _a2;
             return [
-              _(P, {
-                label: T(n).resetDefaultText,
-                onClick: (s = o.value) == null ? void 0 : s.resetToDefault,
+              createVNode(_sfc_main$2, {
+                label: unref(locale).resetDefaultText,
+                onClick: (_a2 = columnList.value) == null ? void 0 : _a2.resetToDefault,
                 "data-wv-section": "button-reset-default",
                 text: ""
               }, null, 8, ["label", "onClick"])
             ];
           }),
-          end: M(() => [
-            _(D, x({
+          end: withCtx(() => [
+            createVNode(_sfc_main$1, mergeProps({
               ref_key: "columnList",
-              ref: o,
-              modelValue: i.value,
-              "onUpdate:modelValue": t[0] || (t[0] = (s) => i.value = s)
-            }, l, {
-              "saved-columns": m.value,
+              ref: columnList,
+              modelValue: columnVisibilityModel.value,
+              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => columnVisibilityModel.value = $event)
+            }, props, {
+              "saved-columns": savedColumns.value,
               "data-wv-section": "custom-column-list"
             }), null, 16, ["modelValue", "saved-columns"])
           ]),
           _: 1
-        }, 8, ["id", "data-table-id", "pt", "onHide"])) : k("", !0),
-        e.type === "flat" ? (v(), V(D, x({
+        }, 8, ["id", "data-table-id", "pt", "onHide"])) : createCommentVNode("", true),
+        _ctx.type === "flat" ? (openBlock(), createBlock(_sfc_main$1, mergeProps({
           key: 1,
           ref_key: "columnList",
-          ref: o,
-          modelValue: i.value,
-          "onUpdate:modelValue": t[1] || (t[1] = (s) => i.value = s)
-        }, l, {
+          ref: columnList,
+          modelValue: columnVisibilityModel.value,
+          "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => columnVisibilityModel.value = $event)
+        }, props, {
           class: [
-            { "grid grid-rows-4 grid-flow-col-dense w-max gap-x-4": e.type === "flat" }
+            { "grid grid-rows-4 grid-flow-col-dense w-max gap-x-4": _ctx.type === "flat" }
           ],
-          "saved-columns": m.value,
+          "saved-columns": savedColumns.value,
           "data-wv-section": "custom-column-flat-list"
-        }), null, 16, ["modelValue", "class", "saved-columns"])) : k("", !0)
+        }), null, 16, ["modelValue", "class", "saved-columns"])) : createCommentVNode("", true)
       ], 64);
     };
   }
 });
 export {
-  K as _
+  _sfc_main as _
 };