@feedmepos/mf-inventory-portal 0.0.22-dev.4 → 0.0.22-dev.41

package/dist/FmInventoryTableToolbar.vue_vue_type_script_setup_true_lang-CM93v-jp.js

@@ -0,0 +1,359 @@
+import { reactive as E, onUnmounted as W, defineComponent as T, computed as y, resolveComponent as _, openBlock as a, createElementBlock as f, Fragment as L, createElementVNode as m, unref as c, normalizeClass as D, toDisplayString as R, createCommentVNode as g, renderList as I, createBlock as h, createVNode as x, renderSlot as q, Teleport as G, ref as P, withCtx as N, watch as J, mergeModels as K, useModel as U } from "vue";
+import { FmButtonVariant as X, useBreakpoints as O } from "@feedmepos/ui-library";
+import { i as A, V as H } from "./app-TB3IWuaU.js";
+import { useCoreStore as Z, useI18n as Y } from "@feedmepos/mf-common";
+const S = E({});
+function j() {
+  const r = `${Math.random()}`, t = new ResizeObserver((o) => {
+    const l = o.map((n) => n.target.scrollHeight).reduce((n, s) => n + s);
+    S[r] = l;
+  }), d = (o) => {
+    const l = o.el;
+    l && t.observe(l);
+  }, u = (o) => {
+    const l = o.el;
+    l && t.unobserve(l);
+  };
+  return W(() => {
+    t.disconnect(), delete S[r];
+  }), {
+    get tableHeight() {
+      return {
+        height: `calc(100dvh - ${Object.values(S).reduce((n, s) => n + s, 0) + 64}px)`
+      };
+    },
+    onMounted: d,
+    onUnmounted: u
+  };
+}
+const ee = { class: "flex flex-col w-full bg-white h-full" }, ne = {
+  key: 0,
+  class: /* @__PURE__ */ D(["text-fm-color-typo-secondary fm-typo-en-body-sm-400"])
+}, te = { key: 0 }, oe = { key: 1 }, le = { class: "bg-white flex-1" }, ae = { class: "fixed bottom-96 right-16" }, we = /* @__PURE__ */ T({
+  __name: "SingleColumnLayout",
+  props: {
+    actions: { default: () => [] },
+    title: { default: "Title" },
+    description: {},
+    showBackButton: { type: Boolean },
+    defaultPadding: { type: Boolean },
+    breadcrumbs: { default: () => [] },
+    usingBusinessHelperText: {}
+  },
+  emits: ["click:action"],
+  setup(r, { emit: t }) {
+    const d = r, u = t, o = y(() => d.actions.find((e) => e.isPrimary)), l = y(
+      () => d.actions.filter((e) => !e.isPrimary).map((e) => ({ ...e, variant: e.variant ?? X.Tertiary }))
+    ), { breakpoints: n } = O(), s = y(() => n.value.xs || n.value.sm), v = A(), k = y(() => v.businessLevel), w = j();
+    return (e, p) => {
+      const B = _("FmButton");
+      return a(), f(L, null, [
+        m("div", ee, [
+          m("div", {
+            onVnodeMounted: p[1] || (p[1] = //@ts-ignore
+            (...b) => c(w).onMounted && c(w).onMounted(...b)),
+            class: D([
+              "flex gap-4",
+              {
+                "p-12": s.value,
+                "px-24 py-16": !s.value
+              }
+            ])
+          }, [
+            m("div", {
+              class: D([
+                "flex-1 flex flex-col gap-4 fm-typo-en-title-md-600 bg-white",
+                {
+                  "py-12": s.value
+                }
+              ])
+            }, [
+              m("div", null, R(e.title), 1),
+              e.usingBusinessHelperText && k.value ? (a(), f("div", ne, R(e.usingBusinessHelperText), 1)) : g("", !0)
+            ], 2),
+            l.value.length ? (a(), f("div", te, [
+              (a(!0), f(L, null, I(l.value, (b) => (a(), h(B, {
+                key: b.value,
+                label: b.label,
+                "prepend-icon": b.prependIcon,
+                variant: b.variant,
+                onClick: (M) => u("click:action", b.value)
+              }, null, 8, ["label", "prepend-icon", "variant", "onClick"]))), 128))
+            ])) : g("", !0),
+            o.value && (c(n).lg || c(n).md) ? (a(), f("div", oe, [
+              x(B, {
+                label: o.value.label,
+                "prepend-icon": o.value.prependIcon,
+                onClick: p[0] || (p[0] = (b) => u("click:action", o.value.value))
+              }, null, 8, ["label", "prepend-icon"])
+            ])) : g("", !0)
+          ], 2),
+          m("div", le, [
+            q(e.$slots, "default")
+          ])
+        ]),
+        o.value && s.value ? (a(), h(G, {
+          key: 0,
+          to: "body"
+        }, [
+          m("div", ae, [
+            x(B, {
+              label: o.value.label,
+              "prepend-icon": o.value.prependIcon,
+              onClick: p[2] || (p[2] = (b) => u("click:action", o.value.value)),
+              variant: "fab"
+            }, null, 8, ["label", "prepend-icon"])
+          ])
+        ])) : g("", !0)
+      ], 64);
+    };
+  }
+}), se = { class: "inline-flex" }, ue = { class: "inline-flex rounded-md items-center gap-4 justify-center h-[30px] px-8 py-4 bg-fm-color-neutral-gray-100 cursor-pointer text-fm-color-neutral-gray-400" }, re = { class: "fm-typo-en-body-md-600 select-none text-ellipsis overflow-hidden whitespace-nowrap" }, ie = { class: "relative" }, ce = { class: "sticky top-0 py-8 bg-white translate-y-[-12px]" }, de = /* @__PURE__ */ T({
+  __name: "ChangeLocationComponent",
+  props: {
+    showBusiness: { type: Boolean }
+  },
+  setup(r) {
+    const t = A(), d = Z(), u = y(() => {
+      var e;
+      return (e = d.currentBusiness.value) == null ? void 0 : e.name;
+    }), { t: o } = Y(), l = P(""), n = y({
+      get() {
+        return t.businessLevel;
+      },
+      set(e) {
+        t.businessLevel = e;
+      }
+    }), s = y(
+      () => t.locations.map((e) => ({ label: e.name, value: e.dbName, type: e.type })).filter(
+        (e) => l.value ? e.label.toLocaleLowerCase().includes(l.value.toLocaleLowerCase()) : !0
+      )
+    ), v = y(
+      () => s.value.filter((e) => e.type === "restaurant")
+    ), k = y(
+      () => s.value.filter((e) => e.type === "warehouse")
+    );
+    function w({ value: e }) {
+      n.value = !1, t.selectLocation(t.locations.find((p) => p.dbName === e));
+    }
+    return (e, p) => {
+      const B = _("FmIcon"), b = _("FmSearch"), M = _("FmMenuItem"), Q = _("FmMenu");
+      return a(), f("div", se, [
+        x(Q, { "close-on-click": !0 }, {
+          "menu-button": N(() => {
+            var i;
+            return [
+              m("div", ue, [
+                x(B, {
+                  name: e.showBusiness && n.value ? "store" : "storefront",
+                  size: "sm"
+                }, null, 8, ["name"]),
+                m("div", re, R(e.showBusiness && n.value ? u.value : ((i = c(t)._currentLocation) == null ? void 0 : i.name) ?? c(o)("inventory.common.noLocationSelected")), 1),
+                x(B, {
+                  name: "expand_more",
+                  size: "sm"
+                })
+              ])
+            ];
+          }),
+          default: N(() => [
+            m("div", ie, [
+              m("div", ce, [
+                x(b, {
+                  "model-value": l.value,
+                  "onUpdate:modelValue": p[0] || (p[0] = (i) => l.value = i),
+                  placeholder: c(o)("inventory.common.table.toolbar.filterItems")
+                }, null, 8, ["model-value", "placeholder"])
+              ]),
+              m("div", null, [
+                e.showBusiness ? (a(), h(M, {
+                  key: 0,
+                  "model-value": n.value,
+                  label: u.value,
+                  sublabel: "Business",
+                  onClick: p[1] || (p[1] = (i) => n.value = !0)
+                }, null, 8, ["model-value", "label"])) : g("", !0),
+                (a(!0), f(L, null, I(v.value, (i) => {
+                  var $;
+                  return a(), h(M, {
+                    key: i.value,
+                    "model-value": !n.value && (($ = c(t)._currentLocation) == null ? void 0 : $.dbName) === i.value,
+                    label: i.label,
+                    sublabel: "Restaurant",
+                    onClick: (F) => w(i),
+                    onVnodeMounted: (F) => {
+                      var V, C;
+                      return !n.value && ((V = c(t)._currentLocation) == null ? void 0 : V.dbName) === i.value && ((C = F.el) == null || C.scrollIntoView({ behavior: "smooth", block: "center" })), void 0;
+                    }
+                  }, null, 8, ["model-value", "label", "onClick", "onVnodeMounted"]);
+                }), 128)),
+                (a(!0), f(L, null, I(k.value, (i) => {
+                  var $;
+                  return a(), h(M, {
+                    key: i.value,
+                    "model-value": !n.value && (($ = c(t)._currentLocation) == null ? void 0 : $.dbName) === i.value,
+                    label: i.label,
+                    sublabel: "Warehouse",
+                    onClick: (F) => w(i),
+                    onVnodeMounted: (F) => {
+                      var V, C;
+                      return !n.value && ((V = c(t)._currentLocation) == null ? void 0 : V.dbName) === i.value && ((C = F.el) == null || C.scrollIntoView({ behavior: "smooth", block: "center" })), void 0;
+                    }
+                  }, null, 8, ["model-value", "label", "onClick", "onVnodeMounted"]);
+                }), 128)),
+                !e.showBusiness && !v.value.length && !k.value.length ? (a(), h(M, {
+                  key: 1,
+                  disabled: "",
+                  label: c(o)("inventory.common.noResultFound")
+                }, null, 8, ["label"])) : g("", !0)
+              ])
+            ])
+          ]),
+          _: 1
+        })
+      ]);
+    };
+  }
+});
+function xe() {
+  const r = /* @__PURE__ */ new Date();
+  return r.setDate(r.getDate() - 15), {
+    start: r,
+    end: /* @__PURE__ */ new Date()
+  };
+}
+function z(r = 15) {
+  const t = /* @__PURE__ */ new Date();
+  t.setDate(t.getDate() - r);
+  const d = t, u = /* @__PURE__ */ new Date();
+  return {
+    startDate: `${H(d)}`,
+    endDate: `${H(u)}`
+  };
+}
+const me = { class: "inline-flex rounded-md items-center gap-4 justify-center h-[30px] px-8 py-4 bg-fm-color-neutral-gray-100 cursor-pointer text-fm-color-neutral-gray-400" }, ve = { class: "fm-typo-en-body-md-600 select-none text-ellipsis overflow-hidden whitespace-nowrap" }, pe = /* @__PURE__ */ T({
+  __name: "FmDateRangePickerChip",
+  props: {
+    modelValue: { default: (r) => r.modelValue ?? z() }
+  },
+  emits: ["update:modelValue"],
+  setup(r, { emit: t }) {
+    const d = t, u = P(z());
+    J(u, (l) => {
+      d("update:modelValue", l);
+    });
+    const o = y(() => {
+      const { startDate: l, endDate: n } = u.value;
+      return !l && !n ? "" : `${l} - ${n}`;
+    });
+    return (l, n) => {
+      const s = _("FmIcon"), v = _("FmDateRangePicker");
+      return a(), h(v, {
+        "show-predefined-range": "",
+        modelValue: u.value,
+        "onUpdate:modelValue": n[0] || (n[0] = (k) => u.value = k),
+        "start-label": "",
+        "end-label": ""
+      }, {
+        "trigger-button": N(() => [
+          m("div", me, [
+            x(s, {
+              name: "calendar_month",
+              size: "sm"
+            }),
+            m("div", ve, R(o.value), 1)
+          ])
+        ]),
+        _: 1
+      }, 8, ["modelValue"]);
+    };
+  }
+}), fe = { class: "flex-1 w-full flex items-center gap-4" }, be = {
+  key: 0,
+  class: "flex-1"
+}, ye = { class: "w-full max-w-[343px] xs:max-w-[unset] sm:max-w-[unset]" }, Be = /* @__PURE__ */ T({
+  __name: "FmInventoryTableToolbar",
+  props: /* @__PURE__ */ K({
+    dateRangeQuery: { type: Boolean },
+    changeLocation: { type: Boolean },
+    searchable: { type: Boolean },
+    actions: {},
+    usingBusinessHelperText: {},
+    showBusiness: { type: Boolean }
+  }, {
+    search: {},
+    searchModifiers: {},
+    dateRange: {},
+    dateRangeModifiers: {}
+  }),
+  emits: ["update:search", "update:dateRange"],
+  setup(r) {
+    const { breakpoints: t } = O(), d = y(() => t.value.xs || t.value.sm), u = U(r, "search"), o = U(r, "dateRange"), { t: l } = Y(), n = j();
+    return (s, v) => {
+      const k = _("FmTextField"), w = _("FmButton");
+      return a(), f("div", {
+        class: "flex flex-col gap-8",
+        onVnodeMounted: v[2] || (v[2] = //@ts-ignore
+        (...e) => c(n).onMounted && c(n).onMounted(...e)),
+        onVnodeUnmounted: v[3] || (v[3] = //@ts-ignore
+        (...e) => c(n).onUnmounted && c(n).onUnmounted(...e))
+      }, [
+        m("div", {
+          class: D([
+            "flex gap-8 items-center",
+            {
+              "px-8 flex-col-reverse h-[unset]": d.value,
+              "h-48": !d.value
+            }
+          ])
+        }, [
+          s.changeLocation || s.dateRangeQuery ? (a(), f("div", {
+            key: 0,
+            class: D([
+              "flex gap-8 items-center",
+              {
+                "w-full overflow-x-auto": d.value
+              }
+            ])
+          }, [
+            s.changeLocation ? (a(), h(de, {
+              key: 0,
+              "show-business": s.showBusiness
+            }, null, 8, ["show-business"])) : g("", !0),
+            s.dateRangeQuery ? (a(), h(pe, {
+              key: 1,
+              "model-value": o.value,
+              "onUpdate:modelValue": v[0] || (v[0] = (e) => o.value = e)
+            }, null, 8, ["model-value"])) : g("", !0)
+          ], 2)) : g("", !0),
+          m("div", fe, [
+            d.value ? g("", !0) : (a(), f("div", be)),
+            m("div", ye, [
+              s.searchable ? (a(), h(k, {
+                key: 0,
+                "model-value": u.value,
+                "onUpdate:modelValue": v[1] || (v[1] = (e) => u.value = e),
+                "prepend-icon": "search",
+                placeholder: c(l)("inventory.common.table.toolbar.filterItems"),
+                class: "w-full"
+              }, null, 8, ["model-value", "placeholder"])) : g("", !0)
+            ]),
+            (a(!0), f(L, null, I(s.actions, (e, p) => (a(), h(w, {
+              key: p,
+              variant: "tertiary",
+              "prepend-icon": e.icon,
+              onClick: e.onClick
+            }, null, 8, ["prepend-icon", "onClick"]))), 128))
+          ])
+        ], 2)
+      ], 512);
+    };
+  }
+});
+export {
+  we as _,
+  Be as a,
+  xe as b,
+  z as i,
+  j as u
+};

package/dist/IngredientBindedItem.vue_vue_type_script_setup_true_lang-SNp8etCc.js

@@ -0,0 +1,51 @@
+import { defineComponent as p, openBlock as s, createElementBlock as n, createElementVNode as r, toDisplayString as o, unref as l, Fragment as d, renderList as x } from "vue";
+import { a, k as y } from "./app-TB3IWuaU.js";
+import { useI18n as _ } from "@feedmepos/mf-common";
+const v = { class: "flex flex-col" }, g = { class: "flex flex-row fm-typo-en-body-md-600 bg-fm-color-neutral-gray-100 text-fm-color-typo-secondary h-48 items-center" }, h = { class: "flex-1 py-8 px-16" }, b = {
+  class: "flex-0 py-8 px-16",
+  style: { "flex-basis": "120px" }
+}, k = { class: "flex-1 py-8 px-16" }, B = {
+  key: 0,
+  class: "flex-0 py-8 px-16",
+  style: { "flex-basis": "120px" }
+}, I = {
+  key: 1,
+  class: "flex-0 py-8 px-16",
+  style: { "flex-basis": "120px" }
+}, A = /* @__PURE__ */ p({
+  __name: "IngredientBindedItem",
+  props: {
+    name: {},
+    bindings: {}
+  },
+  setup($) {
+    const { t: m } = _();
+    function c(e, i) {
+      var t;
+      if (e.measurement) {
+        const u = y(e.amount, e.measurement.conversion);
+        return `${a(u, !1)} ${(t = e.measurement) == null ? void 0 : t.abbrev}`;
+      }
+      return `${a(e.amount, !1)} ${i.abbrev}`;
+    }
+    function f(e) {
+      return e.unit !== void 0;
+    }
+    return (e, i) => (s(), n("div", v, [
+      r("div", g, [
+        r("div", h, o(e.name), 1),
+        r("div", b, o(l(m)("inventory.ingredient.bindedItems.amount")), 1)
+      ]),
+      (s(!0), n(d, null, x(e.bindings, (t) => (s(), n("div", {
+        key: t.id,
+        class: "flex flex-row fm-typo-en-body-md-400 h-48 items-center border-b border-b-fm-color-neutral-gray-100"
+      }, [
+        r("div", k, o(t.name), 1),
+        f(t) ? (s(), n("div", B, o(c(t, t.unit)), 1)) : (s(), n("div", I, o(l(a)(t.amount, !1)), 1))
+      ]))), 128))
+    ]));
+  }
+});
+export {
+  A as _
+};