@feedmepos/mf-inventory-portal 0.0.22-dev.5 → 0.0.22-dev.50

package/dist/IngredientGroupView-C0hPeD41.js

@@ -0,0 +1,608 @@
+import { ref as C, computed as I, defineComponent as Y, resolveComponent as S, openBlock as M, createBlock as O, withCtx as R, createElementVNode as x, createVNode as g, unref as l, createElementBlock as ee, toDisplayString as H, createTextVNode as te, watch as ue, isRef as ce, normalizeClass as de, normalizeStyle as me, createSlots as pe, Teleport as fe, normalizeProps as ve, guardReactiveProps as ge } from "vue";
+import { u as J, c as B, R as ye, A as be, j as oe, e as ne, i as _e } from "./app-B4pi48sM.js";
+import { useDialog as le, useSnackbar as Z, useProxiedModel as xe, useBreakpoints as ke } from "@feedmepos/ui-library";
+import { F as h, D as se, R as Q } from "./row-action.enum-PMKMRrZR.js";
+import { useI18n as W } from "@feedmepos/mf-common";
+import { defineStore as ie, storeToRefs as ae } from "pinia";
+import "vue-router";
+import { c as he, _ as we, F as re } from "./TableActionableRow.vue_vue_type_script_setup_true_lang-DlNJ6kRg.js";
+import { u as Se, _ as Fe, a as Ie } from "./FmInventoryTableToolbar.vue_vue_type_script_setup_true_lang-BpzreBHD.js";
+import { d as Ce } from "./defineDeepModel-BXP1vLGf.js";
+const X = ie(
+  "ingredientGroupactions",
+  function() {
+    const c = le(), w = Z(), o = J(), { t: r } = W(), i = C();
+    function p() {
+      const d = {
+        modelValue: {},
+        mode: h.CREATE,
+        show: !0,
+        "onUpdate:show"(a) {
+          i.value.show = a;
+        }
+      };
+      i.value = d;
+    }
+    async function v(d) {
+      const a = {
+        modelValue: B(d),
+        mode: h.UPDATE,
+        show: !0,
+        "onUpdate:show"(s) {
+          i.value.show = s;
+        }
+      };
+      i.value = a;
+    }
+    async function f(d, a, s) {
+      a.value = !0;
+      try {
+        await o.deleteSkuGroup(d), w.open({
+          title: "Success",
+          message: `Deleted ${d.name}`,
+          type: "success"
+        });
+      } catch (n) {
+        w.open({
+          title: `Cannot delete ${d.name}`,
+          message: "Please try again.",
+          type: "error"
+        }), console.error("failed to delete ingredient", n);
+      } finally {
+        a.value = !1, s();
+      }
+    }
+    function y(d, a, s) {
+      c.open({
+        title: r("inventory.ingredient.delete.title", [(d == null ? void 0 : d.name) ?? ""]),
+        closeButton: !1,
+        message: r("inventory.ingredient.delete.message"),
+        primaryActions: {
+          text: r("common.delete"),
+          close: !0,
+          variant: "destructive"
+        },
+        secondaryActions: {
+          text: r("common.cancel"),
+          close: !0
+        }
+      }).onPrimary(() => f(d, a, s));
+    }
+    function A() {
+    }
+    function b() {
+    }
+    return {
+      createIngredientGroup: p,
+      updateIngredientGroup: v,
+      deleteIngredientGroup: y,
+      importIngredientGroups: A,
+      exportIngredientGroups: b,
+      ingredientGroupDialogProps: i
+    };
+  }
+), Ae = ie(
+  "ingredientGroupTable",
+  function() {
+    const c = C(!1), w = Z(), o = J(), r = X();
+    async function i() {
+      c.value = !0;
+      try {
+        await o.readInventory();
+      } catch (f) {
+        console.error("error on reading inventory", f), w.open({
+          title: "Error",
+          message: "Something went wrong, please try again.",
+          type: "error"
+        });
+      } finally {
+        c.value = !1;
+      }
+    }
+    function p(f, y) {
+      switch (y = B(y), f) {
+        case Q.Edit:
+          return r.updateIngredientGroup(y);
+        case Q.Delete:
+          return r.deleteIngredientGroup(
+            y,
+            c,
+            () => i()
+          );
+      }
+    }
+    const v = I(() => [
+      {
+        accessorKey: "name",
+        header: () => "Name"
+      },
+      {
+        accessorKey: "skus.length",
+        header: () => "No. of items"
+      },
+      {
+        accessorKey: "ref",
+        header: () => "Reference"
+      },
+      {
+        id: "action",
+        header: "",
+        cell(f) {
+          return he(
+            [se[Q.Edit], se[Q.Delete]],
+            (y) => {
+              p(y, f.row.original);
+            }
+          );
+        },
+        enableSorting: !1,
+        size: 40,
+        meta: {
+          cellClass: "",
+          headerClass: ""
+        }
+      }
+    ]);
+    return {
+      fetchIngredientGroups: i,
+      loading: c,
+      columnDefs: v
+    };
+  }
+), De = { class: "flex flex-col gap-16" }, Ge = { class: "flex flex-col gap-8 cursor-pointer" }, Ve = {
+  key: 0,
+  class: "text-fm-color-typo-primary fm-typo-en-body-lg-400 line-clamp-1 break-all"
+}, Ee = { class: "text-fm-color-typo-secondary" }, Re = {
+  key: 1,
+  class: "text-fm-color-typo-secondary fm-typo-en-body-lg-400 line-clamp-1 break-all"
+}, Te = { class: "text-fm-color-typo-secondary fm-typo-en-body-sm-400 flex flex-col gap-4" }, $e = { class: "flex flex-col gap-16" }, Pe = { class: "flex items-center" }, Me = /* @__PURE__ */ Y({
+  __name: "IngredientGroupForm",
+  props: {
+    mode: {},
+    disabled: { type: Boolean },
+    modelValue: {}
+  },
+  emits: ["validation-success"],
+  setup(U, { expose: c, emit: w }) {
+    const o = Ce("modelValue"), r = w, i = J(), p = le(), { t: v } = W(), f = C();
+    c({
+      validateInputs: () => {
+        var a;
+        return (a = f.value) == null ? void 0 : a.validateInputs();
+      },
+      resetInputsValidation: () => {
+        var a;
+        return (a = f.value) == null ? void 0 : a.resetInputsValidation();
+      },
+      resetInputs: () => {
+        var a;
+        return (a = f.value) == null ? void 0 : a.resetInputs();
+      }
+    });
+    const y = I(() => i.skus.groupBy((a) => a.unit._id));
+    function A() {
+      var s;
+      const a = i.skus.filter((n) => {
+        var t;
+        return (((t = y.value.get(n.unit._id)) == null ? void 0 : t.length) ?? 0) > 1;
+      }).map((n) => ({
+        label: n.name,
+        sublabel: n.code,
+        value: n
+      })).sort((n, t) => {
+        var e, u, _, m;
+        return (m = (e = n.value) == null ? void 0 : e.unit) == null ? void 0 : m.abbrev.localeCompare((_ = (u = t.value) == null ? void 0 : u.unit) == null ? void 0 : _.abbrev);
+      });
+      p.open({
+        title: v("inventory.closing.form.items.selectItem"),
+        closeButton: !0,
+        contentComponent: oe,
+        contentComponentProps: {
+          modelValue: [(s = o.skus) == null ? void 0 : s[0]],
+          items: a,
+          singleSelect: !0,
+          virtualScroll: !0
+        },
+        primaryActions: {
+          text: v("common.confirm"),
+          close: !0
+        },
+        secondaryActions: {
+          text: v("common.close"),
+          close: !0,
+          variant: "tertiary"
+        }
+      }).onPrimary((n) => {
+        var t;
+        o.skus = n.map((e) => B(e)), o.unit = ((t = n[0]) == null ? void 0 : t.unit) ?? o.unit;
+      });
+    }
+    function b() {
+      const a = i.skus.filter((n) => {
+        var t, e, u;
+        return n.unit._id === ((t = o == null ? void 0 : o.unit) == null ? void 0 : t._id) && n._id !== ((u = (e = o.skus) == null ? void 0 : e[0]) == null ? void 0 : u._id);
+      }).map((n) => ({
+        label: n.name,
+        sublabel: n.code,
+        value: n
+      })).sort((n, t) => {
+        var e, u, _, m;
+        return (m = (e = n.value) == null ? void 0 : e.unit) == null ? void 0 : m.abbrev.localeCompare((_ = (u = t.value) == null ? void 0 : u.unit) == null ? void 0 : _.abbrev);
+      }), s = a.filter((n) => {
+        var t;
+        return (t = o.skus) == null ? void 0 : t.find((e) => (e == null ? void 0 : e._id) === n.value._id);
+      }).map((n) => n.value);
+      p.open({
+        title: v("inventory.closing.form.items.selectItem"),
+        closeButton: !0,
+        contentComponent: oe,
+        contentComponentProps: {
+          modelValue: s,
+          items: a,
+          virtualScroll: !0
+        },
+        primaryActions: {
+          text: v("common.confirm"),
+          close: !0
+        },
+        secondaryActions: {
+          text: v("common.close"),
+          close: !0,
+          variant: "tertiary"
+        }
+      }).onPrimary((n) => {
+        var u, _;
+        const t = ((u = o.skus) == null ? void 0 : u.slice(1)) ?? [], e = n.map((m) => {
+          const D = t.find((G) => (G == null ? void 0 : G._id) === m._id);
+          return D || B(m, ["unit"]);
+        });
+        o.skus = [(_ = o.skus) == null ? void 0 : _[0], ...e];
+      });
+    }
+    const d = [
+      {
+        accessorKey: "code",
+        header: () => "Code",
+        enableSorting: !1
+      },
+      {
+        accessorKey: "name",
+        header: () => "Name",
+        enableSorting: !1
+      }
+    ];
+    return (a, s) => {
+      const n = S("FmTextField"), t = S("FmLabel"), e = S("FmField"), u = S("FmFormGroup"), _ = S("FmButton"), m = S("FmTable"), D = S("FmForm");
+      return M(), O(D, {
+        onValidationSuccess: s[5] || (s[5] = (F) => r("validation-success")),
+        ref_key: "formRef",
+        ref: f,
+        class: "flex flex-col gap-32"
+      }, {
+        default: R(() => {
+          var F, G, V, T, L;
+          return [
+            x("div", De, [
+              g(n, {
+                label: "Name",
+                "label-mark": "required",
+                rules: [l(ye)()],
+                modelValue: l(o).name,
+                "onUpdate:modelValue": s[0] || (s[0] = (k) => l(o).name = k)
+              }, null, 8, ["rules", "modelValue"]),
+              g(n, {
+                label: "Reference",
+                "label-mark": "optional",
+                modelValue: l(o).ref,
+                "onUpdate:modelValue": s[1] || (s[1] = (k) => l(o).ref = k)
+              }, null, 8, ["modelValue"]),
+              x("div", Ge, [
+                g(t, {
+                  label: "Main ingredient",
+                  required: ""
+                }),
+                g(e, {
+                  onClick: s[2] || (s[2] = (k) => A())
+                }, {
+                  default: R(() => {
+                    var k, E, $, z, N, K, q, P, j;
+                    return [
+                      ($ = (E = (k = l(o)) == null ? void 0 : k.skus) == null ? void 0 : E[0]) != null && $.name ? (M(), ee("span", Ve, [
+                        x("span", Ee, "[" + H((K = (N = (z = l(o)) == null ? void 0 : z.skus) == null ? void 0 : N[0]) == null ? void 0 : K.code) + "]", 1),
+                        te(" " + H((j = (P = (q = l(o)) == null ? void 0 : q.skus) == null ? void 0 : P[0]) == null ? void 0 : j.name), 1)
+                      ])) : (M(), ee("span", Re, H("Click to select main item")))
+                    ];
+                  }),
+                  _: 1
+                }),
+                x("div", Te, [
+                  s[6] || (s[6] = te(H("Select a main item to filter out substitutable items with same unit.") + " ")),
+                  g(u, {
+                    "model-value": ((F = l(o)) == null ? void 0 : F.skus) ?? [],
+                    rules: [l(be)(1, "Required")]
+                  }, null, 8, ["model-value", "rules"])
+                ])
+              ])
+            ]),
+            x("div", $e, [
+              x("div", Pe, [
+                s[7] || (s[7] = x("div", { class: "flex-1 fm-typo-en-title-sm-600" }, "Substitutables", -1)),
+                x("div", null, [
+                  g(_, {
+                    label: "Add items",
+                    disabled: (((V = (G = l(o)) == null ? void 0 : G.skus) == null ? void 0 : V.length) ?? 0) < 1,
+                    onClick: s[3] || (s[3] = (k) => b()),
+                    "prepend-icon": "add",
+                    variant: "secondary",
+                    "text-color": "primary",
+                    "bg-color": "transparent",
+                    "border-color": "primary"
+                  }, null, 8, ["disabled"])
+                ])
+              ]),
+              g(m, {
+                "shrink-at": 9999,
+                "column-defs": d,
+                "row-data": (T = l(o).skus) == null ? void 0 : T.slice(1),
+                onDndChanged: s[4] || (s[4] = (k) => {
+                  var E;
+                  return l(o).skus = [(E = l(o).skus) == null ? void 0 : E[0], ...k];
+                }),
+                draggable: "",
+                "hide-footer": "",
+                "page-size": ((L = l(o).skus) == null ? void 0 : L.length) ?? 0
+              }, null, 8, ["row-data", "page-size"])
+            ])
+          ];
+        }),
+        _: 1
+      }, 512);
+    };
+  }
+}), Be = { class: "flex gap-4" }, Ue = /* @__PURE__ */ Y({
+  __name: "IngredientGroupDialog",
+  props: {
+    show: { type: Boolean },
+    mode: { default: h.READ },
+    modelValue: {}
+  },
+  emits: ["update:show"],
+  setup(U) {
+    const c = U, w = J(), o = Z(), { t: r } = W(), i = xe(c, "show"), p = C({}), v = C(`${Math.random()}`);
+    ue(
+      () => c.show,
+      (t) => {
+        t && (Object.keys(p.value).forEach((e) => {
+          delete p.value[e];
+        }), Object.keys(c.modelValue ?? {}).forEach((e) => {
+          var u;
+          p.value[e] = (u = c.modelValue) == null ? void 0 : u[e];
+        }), v.value = `${Math.random()}`);
+      }
+    );
+    const f = I(() => {
+      switch (c.mode) {
+        case h.READ:
+          return "";
+        case h.UPDATE:
+          return r("inventory.ingredient.update.title");
+        case h.CREATE:
+          return r("inventory.ingredient.create.title");
+      }
+      return "";
+    }), y = I(() => {
+      switch (c.mode) {
+        case h.READ:
+          return "";
+        case h.UPDATE:
+          return r("common.save");
+        case h.CREATE:
+          return r("common.add");
+      }
+      return "";
+    }), A = C(), b = C(!1);
+    async function d() {
+      b.value = !0;
+      const t = B(p.value);
+      try {
+        await w.createSkuGroup(t), i.value = !1, o.open({
+          title: r("inventory.common.success"),
+          message: r("inventory.ingredient.create.success", { name: t.name }),
+          type: "success"
+        });
+      } catch (e) {
+        e instanceof ne || o.open({
+          title: r("inventory.ingredient.create.error.title"),
+          message: r("inventory.ingredient.create.error.message"),
+          type: "error"
+        });
+      } finally {
+        b.value = !1;
+      }
+    }
+    async function a() {
+      b.value = !0;
+      const t = B(p.value);
+      try {
+        await w.updateSkuGroup(t), b.value = !1, i.value = !1, o.open({
+          title: r("inventory.common.success"),
+          message: r("inventory.ingredient.update.success", { name: t.name }),
+          type: "success"
+        });
+      } catch (e) {
+        e instanceof ne || o.open({
+          title: r("inventory.ingredient.update.error.title"),
+          message: r("inventory.ingredient.update.error.message"),
+          type: "error"
+        });
+      } finally {
+        b.value = !1;
+      }
+    }
+    function s() {
+      var t, e;
+      (e = (t = A.value) == null ? void 0 : t.validateInputs) == null || e.call(t);
+    }
+    function n() {
+      switch (c.mode) {
+        case h.READ:
+          return;
+        case h.UPDATE:
+          return a();
+        case h.CREATE:
+          return d();
+      }
+    }
+    return (t, e) => {
+      const u = S("FmButton"), _ = S("FmSideSheet");
+      return M(), O(_, {
+        "model-value": l(i),
+        "onUpdate:modelValue": e[3] || (e[3] = (m) => ce(i) ? i.value = m : null),
+        header: f.value,
+        "close-button": "",
+        "dismiss-away": "",
+        "max-width": 500
+      }, {
+        "side-sheet-footer": R(() => [
+          x("div", Be, [
+            g(u, {
+              loading: b.value,
+              label: y.value,
+              onClick: s
+            }, null, 8, ["loading", "label"]),
+            g(u, {
+              disabled: b.value,
+              label: l(r)("common.close"),
+              variant: "tertiary",
+              onClick: e[2] || (e[2] = (m) => i.value = !1)
+            }, null, 8, ["disabled", "label"])
+          ])
+        ]),
+        default: R(() => [
+          (M(), O(Me, {
+            class: "w-full",
+            ref_key: "hasValidationExpose",
+            ref: A,
+            key: v.value,
+            "model-value": p.value,
+            "onUpdate:modelValue": e[0] || (e[0] = (m) => p.value = m),
+            mode: t.mode,
+            disabled: b.value,
+            onValidationSuccess: e[1] || (e[1] = (m) => n())
+          }, null, 8, ["model-value", "mode", "disabled"]))
+        ]),
+        _: 1
+      }, 8, ["model-value", "header"]);
+    };
+  }
+}), Le = { class: "flex flex-col py-8" }, ze = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, Ne = { class: "fm-typo-en-body-lg-600 text-fm-color-typo-primary" }, Ze = /* @__PURE__ */ Y({
+  __name: "IngredientGroupView",
+  setup(U) {
+    const c = J(), w = I(() => c.skuGroups), o = _e(), { t: r } = W(), {
+      createIngredientGroup: i,
+      updateIngredientGroup: p,
+      importIngredientGroups: v,
+      exportIngredientGroups: f
+    } = X(), { columnDefs: y, loading: A } = ae(Ae()), { ingredientGroupDialogProps: b } = ae(X());
+    function d(D) {
+      switch (D) {
+        case "add":
+          return i();
+        case "import":
+          return v();
+        case "export":
+          return f();
+      }
+    }
+    const a = C(""), s = C(!1), n = I(() => s.value || A.value), { breakpoints: t } = ke(), e = I(() => t.value.xs || t.value.sm), u = I(() => e.value ? 10 : 20), _ = Se(), m = I(() => [
+      {
+        label: r("inventory.ingredient.create.title"),
+        value: "add",
+        isPrimary: !0,
+        prependIcon: "add"
+      },
+      { label: r("common.import"), value: "import" },
+      { label: r("common.export"), value: "export" }
+    ]);
+    return (D, F) => {
+      const G = S("FmTable");
+      return M(), O(Fe, {
+        title: l(r)("inventory.ingredientGroup.title"),
+        actions: m.value,
+        "onClick:action": d
+      }, {
+        default: R(() => [
+          x("div", {
+            class: de([
+              "flex flex-col gap-8 max-h-full",
+              {
+                "p-0": e.value,
+                "px-24 ": !e.value
+              }
+            ])
+          }, [
+            g(Ie, {
+              searchable: "",
+              search: a.value,
+              "onUpdate:search": F[0] || (F[0] = (V) => a.value = V)
+            }, null, 8, ["search"]),
+            g(G, {
+              style: me(l(_).tableHeight),
+              "column-defs": l(y),
+              "row-data": w.value,
+              "search-value": a.value,
+              loading: !l(o)._currentLocation || n.value,
+              "loading-text": "Loading",
+              onRowClick: F[1] || (F[1] = (V) => l(p)(V.original)),
+              "page-size": u.value
+            }, {
+              "list-row": R((V) => [
+                g(we, {
+                  row: V,
+                  onRowClick: l(p)
+                }, pe({
+                  default: R((T) => {
+                    var L, k, E, $, z, N, K, q, P, j;
+                    return [
+                      x("div", Le, [
+                        x("div", ze, [
+                          g(l(re), {
+                            render: (E = (k = (L = T.code) == null ? void 0 : L.column) == null ? void 0 : k.columnDef) == null ? void 0 : E.cell,
+                            props: (z = ($ = T.code) == null ? void 0 : $.getContext) == null ? void 0 : z.call($)
+                          }, null, 8, ["render", "props"])
+                        ]),
+                        x("div", Ne, [
+                          g(l(re), {
+                            render: (q = (K = (N = T.name) == null ? void 0 : N.column) == null ? void 0 : K.columnDef) == null ? void 0 : q.cell,
+                            props: (j = (P = T.name) == null ? void 0 : P.getContext) == null ? void 0 : j.call(P)
+                          }, null, 8, ["render", "props"])
+                        ])
+                      ])
+                    ];
+                  }),
+                  _: 2
+                }, [
+                  s.value ? {
+                    name: "loading-text",
+                    fn: R(() => [
+                      x("div", null, H(l(r)("inventory.ingredient.table.importing")), 1)
+                    ]),
+                    key: "0"
+                  } : void 0
+                ]), 1032, ["row", "onRowClick"])
+              ]),
+              _: 1
+            }, 8, ["style", "column-defs", "row-data", "search-value", "loading", "page-size"])
+          ], 2),
+          (M(), O(fe, { to: "body" }, [
+            g(Ue, ve(ge(l(b))), null, 16)
+          ]))
+        ]),
+        _: 1
+      }, 8, ["title", "actions"]);
+    };
+  }
+});
+export {
+  Ze as default
+};