lkt-item-crud 1.1.19 → 1.1.21

package/dist/build.js

@@ -1,4 +1,4 @@
-import { defineComponent as ie, useSlots as ce, ref as s, computed as n, watch as _, nextTick as ve, resolveComponent as E, openBlock as v, createElementBlock as D, createElementVNode as J, toDisplayString as K, renderSlot as V, createCommentVNode as g, withDirectives as I, createBlock as N, withCtx as X, unref as Y, vShow as L, createVNode as Z } from "vue";
+import { defineComponent as ie, useSlots as ce, ref as s, computed as n, watch as B, nextTick as ve, resolveComponent as E, openBlock as v, createElementBlock as M, createElementVNode as J, toDisplayString as K, renderSlot as V, createCommentVNode as U, withDirectives as I, createBlock as N, withCtx as X, unref as Y, vShow as L, createVNode as Z } from "vue";
 import { httpCall as fe } from "lkt-http-client";
 import { DataState as pe } from "lkt-data-state";
 import { execModal as me, refreshModal as he, closeModal as ke, openModal as Ce, reOpenModal as be } from "lkt-modal";
@@ -12,19 +12,19 @@ const r = (...l) => {
   O.debugEnabled = l;
 }, j = (l) => {
   r("runModalCallback -> init", l);
-  let f = l.modalKey ? l.modalKey : "_", C = l.args ? l.args : {};
+  let f = l.modalKey ? l.modalKey : "_", D = l.args ? l.args : {};
   switch (l.action) {
     case "reOpen":
-      return be(l.modalName, f, C);
+      return be(l.modalName, f, D);
     case "open":
-      return Ce(l.modalName, f, C);
+      return Ce(l.modalName, f, D);
     case "close":
       return ke(l.modalName, f);
     case "refresh":
-      return he(l.modalName, f, C);
+      return he(l.modalName, f, D);
     case "exec":
       let e = l.method;
-      return e ? me(l.modalName, f, e, C) : void 0;
+      return e ? me(l.modalName, f, e, D) : void 0;
   }
 }, De = { class: "lkt-item-crud" }, Se = {
   key: 0,
@@ -75,10 +75,10 @@ const r = (...l) => {
     onDropModalCallbacks: { default: () => [] }
   },
   emits: ["update:modelValue", "update:isCreate", "read", "create", "update", "drop", "perms", "error", "modified-data"],
-  setup(l, { expose: f, emit: C }) {
-    const e = l, T = ce(), i = C;
+  setup(l, { expose: f, emit: D }) {
+    const e = l, T = ce(), i = D;
     let ee = [];
-    const d = s(!0), u = s(e.modelValue), S = s(ee), p = s(!1), m = s(!1), h = s(!1), c = s(200), B = s(null), U = s(null), y = s(new pe(u.value, e.dataStateConfig)), o = s(e.isCreate), $ = s(!1), ae = n(() => o.value ? e.createConfirm : e.updateConfirm), te = n(() => o.value ? e.createConfirmData : e.updateConfirmData), H = n(() => o.value ? e.createResource : e.updateResource), le = n(() => o.value ? { ...e.createData, ...JSON.parse(JSON.stringify(u.value)) } : { ...e.updateData, ...JSON.parse(JSON.stringify(u.value)) }), oe = n(() => o.value ? e.createDisabled : e.updateDisabled), w = n(() => !o.value && S.value.includes("update")), R = n(() => !o.value && S.value.includes("drop")), F = async () => {
+    const d = s(!0), u = s(e.modelValue), _ = s(ee), p = s(!1), m = s(!1), h = s(!1), c = s(200), w = s(null), R = s(null), S = s(new pe(u.value, e.dataStateConfig)), o = s(e.isCreate), $ = s(!1), ae = n(() => o.value ? e.createConfirm : e.updateConfirm), te = n(() => o.value ? e.createConfirmData : e.updateConfirmData), H = n(() => o.value ? e.createResource : e.updateResource), le = n(() => o.value ? { ...e.createData, ...JSON.parse(JSON.stringify(u.value)) } : { ...e.updateData, ...JSON.parse(JSON.stringify(u.value)) }), oe = n(() => o.value ? e.createDisabled : e.updateDisabled), k = n(() => !o.value && _.value.includes("update")), C = n(() => !o.value && _.value.includes("drop")), F = async () => {
       r("fetchItem"), d.value = !0, c.value = -1, h.value = !1;
       try {
         const a = await fe(e.readResource, e.readData);
@@ -86,31 +86,31 @@ const r = (...l) => {
           m.value = !1, c.value = a.httpStatus, i("error", a.httpStatus);
           return;
         }
-        m.value = !0, u.value = a.data, S.value = a.perms, y.value.increment(u.value).turnStoredIntoOriginal(), i("read", a);
+        m.value = !0, u.value = a.data, _.value = a.perms, S.value.increment(u.value).turnStoredIntoOriginal(), i("read", a);
       } catch {
         d.value = !1, m.value = !1, c.value = 404, i("error", 404);
         return;
       }
     }, ue = n(() => d.value ? !1 : e.title || !!T["post-title"]);
-    _(() => e.modelValue, (a) => {
-      u.value = a, y.value.increment(a);
-    }, { deep: !0 }), _(u, (a) => {
+    B(() => e.modelValue, (a) => {
+      u.value = a, S.value.increment(a);
+    }, { deep: !0 }), B(u, (a) => {
       if ($.value = !0, r("item updated ->", u.value), typeof e.beforeEmitUpdate == "function") {
         r("item updated -> has beforeEmitUpdate");
         let t = e.beforeEmitUpdate(u.value);
         r("item updated -> override with: ", t), typeof t == "object" && (u.value = t);
       }
-      i("update:modelValue", u.value), r("item updated -> update dataState"), y.value.increment(a), ve(() => $.value = !1);
-    }, { deep: !0 }), _(S, () => i("perms", S.value));
-    const P = n(() => oe.value || !o.value && !w.value || typeof e.saveValidator == "function" && !e.saveValidator(u.value) ? !1 : y.value.changed());
-    _(P, (a) => i("modified-data", a)), _(o, (a) => i("update:isCreate", a)), e.readResource && !o.value ? F() : o.value && (m.value = !0, p.value = !0, d.value = !1);
+      i("update:modelValue", u.value), r("item updated -> update dataState"), S.value.increment(a), ve(() => $.value = !1);
+    }, { deep: !0 }), B(_, () => i("perms", _.value));
+    const P = n(() => oe.value || !o.value && !k.value || typeof e.saveValidator == "function" && !e.saveValidator(u.value) ? !1 : S.value.changed());
+    B(P, (a) => i("modified-data", a)), B(o, (a) => i("update:isCreate", a)), e.readResource && !o.value ? F() : o.value && (m.value = !0, p.value = !0, d.value = !1);
     const de = (a, t) => {
       if (d.value = !1, c.value = t.httpStatus, !t.success) {
         h.value = !0, i("error", t.httpStatus);
         return;
       }
-      h.value = !0, e.onDropModalCallbacks.length > 0 && (r("onDrop -> has onDropModalCallbacks"), e.onDropModalCallbacks.forEach((k) => {
-        j(k);
+      h.value = !0, e.onDropModalCallbacks.length > 0 && (r("onDrop -> has onDropModalCallbacks"), e.onDropModalCallbacks.forEach((b) => {
+        j(b);
       })), i("drop", t);
     }, re = (a, t) => {
       if (r("onSave -> received response:", t), H.value) {
@@ -120,12 +120,12 @@ const r = (...l) => {
         }
         h.value = !0;
       }
-      let k = o.value ? "create" : "update";
-      o.value || (r("onSave -> turn stored data into original"), y.value.turnStoredIntoOriginal()), k === "create" ? typeof e.onCreate == "function" && (r("onSave -> trigger onCreate callback"), e.onCreate(t), e.onCreateModalCallbacks.length > 0 && (r("onSave -> has onCreateModalCallbacks"), e.onCreateModalCallbacks.forEach((M) => {
-        j(M);
-      }))) : typeof e.onUpdate == "function" && (r("onSave -> trigger onUpdate callback"), e.onUpdate(t), e.onUpdateModalCallbacks.length > 0 && (r("onSave -> has onUpdateModalCallbacks"), e.onUpdateModalCallbacks.forEach((M) => {
-        j(M);
-      }))), !e.insideModal && t.autoReloadId && (r("onSave -> autoReloadId detected: ", t.autoReloadId), e.readData.id = t.autoReloadId, r("onSave -> turning off create mode"), o.value = !1, F()), i(k, t);
+      let b = o.value ? "create" : "update";
+      o.value || (r("onSave -> turn stored data into original"), S.value.turnStoredIntoOriginal()), b === "create" ? typeof e.onCreate == "function" && (r("onSave -> trigger onCreate callback"), e.onCreate(t), e.onCreateModalCallbacks.length > 0 && (r("onSave -> has onCreateModalCallbacks"), e.onCreateModalCallbacks.forEach((g) => {
+        j(g);
+      }))) : typeof e.onUpdate == "function" && (r("onSave -> trigger onUpdate callback"), e.onUpdate(t), e.onUpdateModalCallbacks.length > 0 && (r("onSave -> has onUpdateModalCallbacks"), e.onUpdateModalCallbacks.forEach((g) => {
+        j(g);
+      }))), !e.insideModal && t.autoReloadId && (r("onSave -> autoReloadId detected: ", t.autoReloadId), e.readData.id = t.autoReloadId, r("onSave -> turning off create mode"), o.value = !1, F()), i(b, t);
     }, x = () => {
       d.value = !0, c.value = -1;
     }, z = () => {
@@ -133,18 +133,18 @@ const r = (...l) => {
     };
     f({
       doDrop: () => {
-        U.value && typeof U.value.click == "function" && U.value.click();
+        R.value && typeof R.value.click == "function" && R.value.click();
       },
       doRefresh: F,
       doSave: () => {
-        B.value && typeof B.value.click == "function" && B.value.click();
+        w.value && typeof w.value.click == "function" && w.value.click();
       }
     });
-    const A = n(() => !e.hiddenDrop && !d.value && p.value && m.value), G = n(() => d.value ? !1 : o.value ? !0 : !e.hiddenSave && p.value && m.value), Q = n(() => !d.value && !o.value && m.value && !(e.dropDisabled && e.updateDisabled)), ne = n(() => !e.hiddenButtons && (G.value || A.value || Q.value));
+    const A = n(() => !k.value && C.value ? !0 : !e.hiddenDrop && !d.value && p.value && m.value), G = n(() => S.value.changed() ? !0 : d.value ? !1 : o.value ? !0 : !e.hiddenSave && p.value && m.value), Q = n(() => !k.value && !C.value || !k.value && C.value ? !1 : !d.value && !o.value && m.value && !(e.dropDisabled && e.updateDisabled)), ne = n(() => !e.hiddenButtons && (G.value || A.value || Q.value));
     return n(() => u), (a, t) => {
-      const k = E("lkt-button"), M = E("lkt-field-switch"), W = E("lkt-http-info"), se = E("lkt-loader");
-      return v(), D("article", De, [
-        ue.value ? (v(), D("header", Se, [
+      const b = E("lkt-button"), g = E("lkt-field-switch"), W = E("lkt-http-info"), se = E("lkt-loader");
+      return v(), M("article", De, [
+        ue.value ? (v(), M("header", Se, [
           J("h1", ye, K(a.title), 1),
           J("div", Me, [
             V(a.$slots, "post-title", {
@@ -152,13 +152,13 @@ const r = (...l) => {
               loading: d.value
             })
           ])
-        ])) : g("", !0),
+        ])) : U("", !0),
         I(J("div", _e, [
-          o.value ? g("", !0) : I((v(), N(k, {
+          o.value ? U("", !0) : I((v(), N(b, {
             key: 0,
-            ref: (b) => U.value = b,
+            ref: (y) => R.value = y,
             palette: "danger",
-            disabled: a.dropDisabled || !R.value,
+            disabled: a.dropDisabled || !C.value,
             "confirm-modal": a.dropConfirm,
             "confirm-data": a.dropConfirmData,
             resource: a.dropResource,
@@ -173,16 +173,16 @@ const r = (...l) => {
                 item: u.value,
                 editMode: p.value,
                 isCreate: o.value,
-                canUpdate: w.value,
-                canDrop: R.value
-              }) : (v(), D("span", ge, K(a.dropText), 1))
+                canUpdate: k.value,
+                canDrop: C.value
+              }) : (v(), M("span", ge, K(a.dropText), 1))
             ]),
             _: 3
           }, 8, ["disabled", "confirm-modal", "confirm-data", "resource", "resource-data"])), [
             [L, A.value]
           ]),
-          I(Z(k, {
-            ref: (b) => B.value = b,
+          I(Z(b, {
+            ref: (y) => w.value = y,
             palette: "success",
             disabled: !P.value,
             "confirm-modal": ae.value,
@@ -199,17 +199,17 @@ const r = (...l) => {
                 item: u.value,
                 editMode: p.value,
                 isCreate: o.value,
-                canUpdate: w.value,
-                canDrop: R.value
-              }) : (v(), D("span", Be, K(a.saveText), 1))
+                canUpdate: k.value,
+                canDrop: C.value
+              }) : (v(), M("span", Be, K(a.saveText), 1))
             ]),
             _: 3
           }, 8, ["disabled", "confirm-modal", "confirm-data", "resource", "resource-data"]), [
             [L, G.value]
           ]),
-          I(Z(M, {
+          I(Z(g, {
             modelValue: p.value,
-            "onUpdate:modelValue": t[0] || (t[0] = (b) => p.value = b),
+            "onUpdate:modelValue": t[0] || (t[0] = (y) => p.value = y),
             label: a.editModeText
           }, null, 8, ["modelValue", "label"]), [
             [L, Q.value]
@@ -217,23 +217,23 @@ const r = (...l) => {
         ], 512), [
           [L, ne.value]
         ]),
-        d.value ? g("", !0) : (v(), D("div", Ue, [
-          m.value ? (v(), D("div", we, [
+        d.value ? U("", !0) : (v(), M("div", Ue, [
+          m.value ? (v(), M("div", we, [
             h.value ? (v(), N(W, {
               key: 0,
               code: c.value,
               quick: "",
               palette: c.value === 200 ? "success" : "danger",
               "can-close": "",
-              onClose: t[1] || (t[1] = (b) => h.value = !1)
-            }, null, 8, ["code", "palette"])) : g("", !0),
+              onClose: t[1] || (t[1] = (y) => h.value = !1)
+            }, null, 8, ["code", "palette"])) : U("", !0),
             V(a.$slots, "item", {
               item: u.value,
               loading: d.value,
               editMode: p.value,
               isCreate: o.value,
-              canUpdate: w.value,
-              canDrop: R.value,
+              canUpdate: k.value,
+              canDrop: C.value,
               itemBeingEdited: $.value
             })
           ])) : (v(), N(W, {
@@ -241,7 +241,7 @@ const r = (...l) => {
             code: c.value
           }, null, 8, ["code"]))
         ])),
-        d.value ? (v(), N(se, { key: 2 })) : g("", !0)
+        d.value ? (v(), N(se, { key: 2 })) : U("", !0)
       ]);
     };
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lkt-item-crud",
-  "version": "1.1.19",
+  "version": "1.1.21",
   "description": "",
   "type": "module",
   "module": "./dist/build.js",

package/src/lib-components/LktItemCrud.vue

@@ -297,12 +297,16 @@ defineExpose({
 });
 
 const showDropButton = computed(() => {
+        if (!canUpdate.value && canDrop.value) return true;
+
         return !props.hiddenDrop
             && !isLoading.value
             && editMode.value
             && httpSuccessRead.value;
     }),
     showSaveButton = computed(() => {
+
+        if (dataState.value.changed()) return true;
         if (isLoading.value) return false;
 
         if (createMode.value) return true;
@@ -312,6 +316,9 @@ const showDropButton = computed(() => {
             && httpSuccessRead.value;
     }),
     showSwitchButton = computed(() => {
+        if (!canUpdate.value && !canDrop.value) return false;
+        if (!canUpdate.value && canDrop.value) return false;
+
         return !isLoading.value
             && !createMode.value
             && httpSuccessRead.value
@@ -319,9 +326,6 @@ const showDropButton = computed(() => {
     }),
     showButtons = computed(() => {
         return !props.hiddenButtons && (showSaveButton.value || showDropButton.value || showSwitchButton.value);
-    }),
-    computedItem = computed(() => {
-        return item;
     });
 </script>