@feedmepos/mf-order-setting 0.0.21-beta.3 → 0.0.23

package/dist/KioskView-DPU-oQ1H.js

@@ -0,0 +1,426 @@
+import { defineComponent as I, computed as b, openBlock as c, createElementBlock as y, normalizeClass as X, toDisplayString as m, unref as d, createCommentVNode as _, createElementVNode as o, Fragment as Z, renderList as ee, ref as T, defineAsyncComponent as te, watch as ae, resolveComponent as O, createVNode as k, withCtx as ne, withDirectives as se, vShow as oe, createBlock as R } from "vue";
+import { u as re, _ as le } from "./KioskDevicesView.vue_vue_type_script_setup_true_lang-DUPfN7ti.js";
+import { useI18n as A, useCoreStore as de } from "@feedmepos/mf-common";
+import { F as V, a as ie, b as ce } from "./queue.do-CIyIpp22.js";
+import { useDialog as ue, useSnackbar as pe, useBreakpoints as me } from "@feedmepos/ui-library";
+import { defineStore as ye } from "pinia";
+import { O as B, c as E } from "./index-B7GFhkAE.js";
+const fe = {
+  key: 0,
+  class: "fm-typo-en-title-sm-600"
+}, ve = {
+  key: 1,
+  class: "my-[0.25rem]"
+}, _e = { class: "flex flex-col gap-1" }, be = { class: "flex flex-col gap-1" }, he = { class: "fm-typo-en-body-lg-400 text-fm-color-typo-secondary" }, ge = { class: "fm-typo-en-body-lg-600" }, ke = { key: 0 }, Se = { key: 1 }, Pe = { key: 0 }, Oe = { class: "fm-typo-en-body-lg-400 text-fm-color-typo-secondary" }, Te = { class: "fm-typo-en-body-lg-600 block" }, we = { key: 1 }, Ce = { class: "fm-typo-en-body-lg-400 text-fm-color-typo-secondary" }, xe = { class: "fm-typo-en-body-lg-600 block" }, Ie = { key: 2 }, Ae = { class: "fm-typo-en-body-lg-400 text-fm-color-typo-secondary" }, Ke = { class: "fm-typo-en-body-lg-600 block" }, Ue = { key: 3 }, $e = { class: "fm-typo-en-body-lg-400 text-fm-color-typo-secondary" }, Fe = { class: "fm-typo-en-body-lg-600 block" }, qe = { key: 0 }, N = /* @__PURE__ */ I({
+  __name: "KioskSummary",
+  props: {
+    restaurantId: {},
+    devices: {},
+    kioskOrderSetting: {},
+    dialogType: { type: Boolean }
+  },
+  setup(t) {
+    const { t: e } = A(), r = t, l = b(() => {
+      var a;
+      return (a = r.kioskOrderSetting) != null && a.dineIn.enabled ? e("order.activated") : e("order.deactivated");
+    }), n = b(() => {
+      var a;
+      return (a = r.kioskOrderSetting) != null && a.takeaway.enabled ? e("order.activated") : e("order.deactivated");
+    }), s = b(() => {
+      var a, p;
+      return (a = r.kioskOrderSetting) != null && a.dineIn.displayStand ? e("order.tableService") : (p = r.kioskOrderSetting) != null && p.dineIn && !r.kioskOrderSetting.dineIn.displayStand ? e("order.pickAtCounter") : e("order.unknown");
+    }), u = b(() => {
+      var a;
+      return ((a = r.kioskOrderSetting) == null ? void 0 : a.paymentSetting.paymentTypes.includes(V.enum.cash)) ?? !1;
+    }), i = b(() => {
+      var p, v;
+      const a = [];
+      if ((p = r.kioskOrderSetting) == null || p.paymentSetting.paymentTypes.forEach((h) => {
+        h === V.enum.ePayment && a.push(e("order.ePayment"));
+      }), a.length > 0 && Object.keys(r.kioskOrderSetting.paymentSetting.ePaymentTypes).length !== 0) {
+        const h = (v = r.kioskOrderSetting) == null ? void 0 : v.paymentSetting.ePaymentTypes;
+        (h.card.terminal || h.card.nfc) && a.push(e("order.bankCard")), (h.eWallet.scanPay || h.eWallet.qrPay) && a.push(e("order.eWallet"));
+      }
+      return a.join(", ");
+    });
+    return (a, p) => (c(), y("div", {
+      class: X(a.dialogType ? "" : ["p-[1.5rem] border fm-corner-radius-lg flex flex-col gap-5 fixed ml-40 w-[320px]"])
+    }, [
+      a.dialogType ? _("", !0) : (c(), y("span", fe, m(d(e)("order.kioskSummary")), 1)),
+      a.dialogType ? _("", !0) : (c(), y("hr", ve)),
+      o("div", _e, [
+        o("div", be, [
+          o("span", he, m(d(e)("order.kioskDisplay")), 1),
+          o("div", ge, [
+            a.devices.length > 0 ? (c(), y("div", ke, [
+              (c(!0), y(Z, null, ee(a.devices, (v) => (c(), y("li", {
+                class: "block",
+                key: v.machineId
+              }, m(v.name), 1))), 128))
+            ])) : (c(), y("div", Se, "-"))
+          ]),
+          l.value === d(e)("order.activated") ? (c(), y("div", Pe, [
+            o("span", Oe, m(d(e)("order.dineIn")), 1),
+            o("div", Te, [
+              o("div", null, m(l.value), 1)
+            ])
+          ])) : _("", !0),
+          l.value === d(e)("order.activated") && s.value !== d(e)("order.unknown") ? (c(), y("div", we, [
+            o("span", Ce, m(d(e)("order.dineInType")), 1),
+            o("div", xe, [
+              o("div", null, m(s.value), 1)
+            ])
+          ])) : _("", !0),
+          n.value === d(e)("order.activated") ? (c(), y("div", Ie, [
+            o("span", Ae, m(d(e)("order.takeaway")), 1),
+            o("div", Ke, [
+              o("div", null, m(n.value), 1)
+            ])
+          ])) : _("", !0),
+          i.value || u.value ? (c(), y("div", Ue, [
+            o("span", $e, m(d(e)("order.acceptedPayment")), 1),
+            o("div", Fe, [
+              u.value ? (c(), y("div", qe, m(d(e)("order.offlinePayment")), 1)) : _("", !0),
+              o("div", null, m(i.value), 1)
+            ])
+          ])) : _("", !0)
+        ])
+      ])
+    ], 2));
+  }
+}), Re = { class: "flex flex-col gap-5 pb-6" }, Ve = { class: "fm-typo-en-body-md-400 block" }, Be = { class: "fm-typo-en-title-md-600" }, Ee = /* @__PURE__ */ I({
+  __name: "KioskOtpDialog",
+  props: {
+    otp: {}
+  },
+  setup(t) {
+    const { t: e } = A();
+    return (r, l) => (c(), y("div", Re, [
+      o("span", Ve, m(d(e)("order.bindDeviceMessage")), 1),
+      o("div", Be, m(r.otp), 1)
+    ]));
+  }
+}), D = {
+  enabled: !1,
+  prefix: null,
+  padDigit: 0,
+  standSlotRange: {
+    min: 1,
+    max: 10
+  },
+  submitOrderInstruction: {
+    payAtCounter: null,
+    paid: null
+  }
+}, W = {
+  enabled: !1,
+  submitOrderInstruction: {
+    payAtCounter: null,
+    paid: null
+  }
+}, Ne = {
+  dineIn: {
+    enabled: !1,
+    pickUp: W,
+    sequenceNumber: ie.parse({}),
+    displayStand: D
+  },
+  takeaway: {
+    enabled: !1,
+    submitOrderInstruction: {
+      payAtCounter: null,
+      paid: null
+    }
+  },
+  paymentSetting: {
+    paymentTypes: [],
+    offlinePaymentTypes: [],
+    ePaymentTypes: {
+      card: {
+        terminal: !1,
+        nfc: !1
+      },
+      eWallet: {
+        qrPay: !1,
+        scanPay: !1
+      }
+    }
+  },
+  menuItem: {
+    showAllOnly: !1
+  }
+}, x = {
+  payAtCounter: null,
+  paid: null
+}, Me = (t) => {
+  var e;
+  return {
+    kiosk: De(t.kioskSettings, (e = t.sequenceSettings) == null ? void 0 : e.kioskDineIn)
+  };
+}, De = (t, e) => {
+  var r, l, n, s, u, i, a, p, v;
+  return {
+    dineIn: We(e ?? {
+      current: 0,
+      prefix: "#K"
+    }, t.dineIn ?? void 0),
+    takeaway: {
+      enabled: (t == null ? void 0 : t.canTakeaway) ?? !1,
+      submitOrderInstruction: (r = t == null ? void 0 : t.takeaway) != null && r.submitOrderInstruction ? {
+        payAtCounter: ((n = (l = t.takeaway.submitOrderInstruction) == null ? void 0 : l.payAtCounter) == null ? void 0 : n.en) ?? null,
+        paid: ((u = (s = t.takeaway.submitOrderInstruction) == null ? void 0 : s.paid) == null ? void 0 : u.en) ?? null
+      } : x
+    },
+    paymentSetting: {
+      paymentTypes: ((i = t == null ? void 0 : t.paymentSetting) == null ? void 0 : i.paymentTypes) ?? [],
+      offlinePaymentTypes: ((a = t == null ? void 0 : t.paymentSetting) == null ? void 0 : a.offlinePaymentTypes) ?? [],
+      ePaymentTypes: ((p = t == null ? void 0 : t.paymentSetting) == null ? void 0 : p.ePaymentTypes) ?? ce.parse({
+        card: {
+          terminal: !1,
+          nfc: !1
+        },
+        eWallet: {
+          qrPay: !1,
+          scanPay: !1
+        }
+      })
+    },
+    menuItem: {
+      showAllOnly: ((v = t.menuItem) == null ? void 0 : v.showAllOnly) ?? !1
+    }
+  };
+}, We = (t, e) => {
+  var r, l, n, s, u, i, a, p;
+  return {
+    enabled: !!e,
+    sequenceNumber: t,
+    pickUp: e != null && e.pickUp ? {
+      ...e.pickUp,
+      submitOrderInstruction: e.pickUp.submitOrderInstruction ? {
+        payAtCounter: ((l = (r = e.pickUp.submitOrderInstruction) == null ? void 0 : r.payAtCounter) == null ? void 0 : l.en) ?? null,
+        paid: ((s = (n = e.pickUp.submitOrderInstruction) == null ? void 0 : n.paid) == null ? void 0 : s.en) ?? null
+      } : x
+    } : W,
+    displayStand: e != null && e.displayStand ? {
+      enabled: e.displayStand.enabled,
+      standSlotRange: e.displayStand.standSlotRange,
+      prefix: e.displayStand.prefix,
+      padDigit: e.displayStand.padDigit,
+      submitOrderInstruction: e.displayStand.submitOrderInstruction ? {
+        payAtCounter: ((i = (u = e.displayStand.submitOrderInstruction) == null ? void 0 : u.payAtCounter) == null ? void 0 : i.en) ?? null,
+        paid: ((p = (a = e.displayStand.submitOrderInstruction) == null ? void 0 : a.paid) == null ? void 0 : p.en) ?? null
+      } : x
+    } : D
+  };
+}, je = (t) => {
+  const e = (n) => {
+    var s, u, i, a;
+    return {
+      requiredSlot: !!n.displayStand,
+      displayStand: {
+        ...n.displayStand,
+        submitOrderInstruction: {
+          payAtCounter: (s = n.displayStand.submitOrderInstruction) != null && s.payAtCounter ? {
+            en: n.displayStand.submitOrderInstruction.payAtCounter
+          } : null,
+          paid: (u = n.displayStand.submitOrderInstruction) != null && u.paid ? {
+            en: n.displayStand.submitOrderInstruction.paid
+          } : null
+        }
+      },
+      pickUp: {
+        ...n.pickUp,
+        submitOrderInstruction: {
+          payAtCounter: (i = n.pickUp.submitOrderInstruction) != null && i.payAtCounter ? {
+            en: n.pickUp.submitOrderInstruction.payAtCounter
+          } : null,
+          paid: (a = n.pickUp.submitOrderInstruction) != null && a.paid ? {
+            en: n.pickUp.submitOrderInstruction.paid
+          } : null
+        }
+      }
+    };
+  }, r = (n) => ({
+    canTakeaway: t.takeaway.enabled,
+    dineIn: n,
+    menuItem: t.menuItem,
+    paymentSetting: l(t.paymentSetting)
+  }), l = (n) => ({
+    paymentTypes: n.paymentTypes,
+    offlinePaymentTypes: n.offlinePaymentTypes,
+    ePaymentTypes: n.ePaymentTypes
+  });
+  return t.dineIn.enabled ? {
+    kioskSettings: r(e(t.dineIn)),
+    kioskDineIn: t.dineIn.sequenceNumber
+  } : {
+    kioskSettings: r()
+  };
+}, M = {
+  convertOrderSettingDto: Me,
+  toOrderKioskSettingsDto: je
+}, He = ye("orderSetting", () => {
+  const t = T({});
+  async function e() {
+    const s = await B.getOrderSetting();
+    l(s);
+  }
+  async function r() {
+    if (t.value.orderSetting && t.value.kiosk) {
+      const { _id: s, ...u } = t.value.orderSetting, i = M.toOrderKioskSettingsDto(t.value.kiosk), a = {
+        ...u,
+        kioskSettings: i.kioskSettings
+      }, p = await B.updateOrderSetting(a);
+      l(p);
+    }
+  }
+  function l(s) {
+    t.value.orderSetting = s, t.value.kiosk = M.convertOrderSettingDto(s).kiosk;
+  }
+  function n(s) {
+    t.value.kiosk = s;
+  }
+  return {
+    state: t,
+    getSetting: e,
+    updateKioskSetting: r,
+    setKioskOrderSetting: n
+  };
+}), Le = { class: "py-[1.5rem]" }, Ye = { class: "flex px-[1.5rem]" }, ze = { class: "flex-[2_2_0%]" }, Ge = { class: "pt-[1.5rem]" }, Je = { class: "flex flex-col gap-10" }, Qe = { class: "flex flex-col gap-2" }, Xe = { class: "fm-typo-en-title-sm-600" }, Ze = { class: "fm-typo-en-title-sm-400" }, et = {
+  key: 0,
+  class: "flex-[1_1_0%]"
+}, dt = /* @__PURE__ */ I({
+  __name: "KioskView",
+  setup(t) {
+    var F, q;
+    const { t: e } = A(), r = te(
+      () => import("./KioskSettingView-BChhriPk.js")
+    ), l = T("device"), n = re(), s = He(), u = ue(), { currentRestaurant: i, restaurants: a, changeRestaurant: p } = de(), v = pe(), h = me(), K = b(() => h.breakpoints.value.xs), S = T(((F = i.value) == null ? void 0 : F._id) ?? void 0), j = b(() => a.value.map((f) => ({
+      label: f.profile.name,
+      value: f._id
+    }))), P = T(((q = i.value) == null ? void 0 : q._id) ?? "");
+    function H() {
+      var f;
+      u.open({
+        title: E(e("order.kioskSummary")),
+        contentComponent: N,
+        contentComponentProps: {
+          restaurantId: (f = i.value) == null ? void 0 : f._id,
+          devices: n.state.devices,
+          kioskOrderSetting: s.state.kiosk,
+          dialogType: !0
+        }
+      });
+    }
+    async function U(f) {
+      const g = a.value.find((w) => w._id == f);
+      await p(g), await s.getSetting(), await n.getDevices(), S.value = f, P.value = f;
+    }
+    const L = b(() => [
+      {
+        label: e("order.deviceBinding"),
+        value: "device"
+      },
+      {
+        label: e("order.settings"),
+        value: "setting"
+      }
+    ]), $ = b(() => n.state.devices);
+    async function Y() {
+      await n.requestOtp(), u.open({
+        title: E(e("order.bindDevice")),
+        contentComponent: Ee,
+        contentComponentProps: {
+          otp: n.state.otp
+        }
+      });
+    }
+    async function z(f) {
+      try {
+        s.setKioskOrderSetting(f), await s.updateKioskSetting(), v.open({
+          title: e("order.kioskSettingSuccess"),
+          type: "success"
+        });
+      } catch {
+        v.open({
+          title: e("order.kioskSettingFailed"),
+          type: "error"
+        });
+      }
+    }
+    return ae(
+      () => a.value.length,
+      async (f) => {
+        S.value === void 0 && a.value.length > 0 && await U(a.value[0]._id);
+      },
+      { immediate: !0 }
+    ), (f, g) => {
+      const w = O("FmButton"), G = O("FmPageHead"), J = O("FmTabs"), Q = O("FmSelect");
+      return c(), y("div", Le, [
+        k(G, {
+          title: d(e)("order.kiosk")
+        }, {
+          append: ne(() => [
+            se(k(w, {
+              icon: "info",
+              variant: "tertiary",
+              onClick: H
+            }, null, 512), [
+              [oe, K.value]
+            ])
+          ]),
+          _: 1
+        }, 8, ["title"]),
+        o("div", Ye, [
+          o("div", ze, [
+            k(J, {
+              "model-value": l.value,
+              "onUpdate:modelValue": g[0] || (g[0] = (C) => l.value = C),
+              items: L.value
+            }, null, 8, ["model-value", "items"]),
+            o("div", Ge, [
+              o("div", Je, [
+                o("div", Qe, [
+                  o("span", Xe, m(d(e)("order.activateLocation")), 1),
+                  o("span", Ze, m(d(e)("order.selectRestaurant")) + ": ", 1),
+                  k(Q, {
+                    class: "w-1/2",
+                    modelValue: S.value,
+                    "onUpdate:modelValue": [
+                      g[1] || (g[1] = (C) => S.value = C),
+                      U
+                    ],
+                    items: j.value,
+                    placeholder: d(e)("order.selectItem")
+                  }, null, 8, ["modelValue", "items", "placeholder"])
+                ]),
+                l.value == "device" ? (c(), R(le, {
+                  key: 0,
+                  devices: $.value,
+                  "request-otp": Y
+                }, null, 8, ["devices"])) : _("", !0),
+                l.value == "setting" ? (c(), R(d(r), {
+                  key: `KioskSettingView-${P.value}`,
+                  "restaurant-id": P.value,
+                  onUpdateKioskOrderSetting: z,
+                  form: d(s).state.kiosk ?? d(Ne)
+                }, null, 8, ["restaurant-id", "form"])) : _("", !0)
+              ])
+            ])
+          ]),
+          K.value ? _("", !0) : (c(), y("div", et, [
+            k(N, {
+              "restaurant-id": P.value,
+              devices: $.value,
+              "kiosk-order-setting": d(s).state.kiosk,
+              dialogType: !1
+            }, null, 8, ["restaurant-id", "devices", "kiosk-order-setting"])
+          ]))
+        ])
+      ]);
+    };
+  }
+});
+export {
+  dt as default
+};