@feedmepos/mf-payment 1.10.7 → 1.10.9-dev

package/dist/TerminalSetting-Bl0bfFAS.js

@@ -0,0 +1,2785 @@
+import { defineComponent as h, openBlock as g, createElementBlock as S, Fragment as D, createElementVNode as I, createTextVNode as W, toDisplayString as z, ref as _, resolveComponent as f, createBlock as F, withCtx as O, createVNode as y, unref as N, computed as V, createCommentVNode as U, isRef as ae, resolveDynamicComponent as te, normalizeProps as le, mergeProps as ne, watch as A, onBeforeUnmount as Te, toRef as G, onMounted as q, renderList as L } from "vue";
+import { u as J, p as ve, e as P } from "./index-CHinJgjY.js";
+import { useRouter as Ie } from "vue-router";
+import { t as j } from "./index-abg_ZrfF.js";
+import { t as pe } from "./index-BICW93bZ.js";
+import { _ as Fe } from "./Layout.vue_vue_type_script_setup_true_lang-BKIvkgA_.js";
+import { u as oe } from "./index-D8zuI51D.js";
+import { useDialogChild as ye, useSnackbar as me, useDialog as we } from "@feedmepos/ui-library";
+import { w as xe } from "./Modal-DB8M9o1T.js";
+import { u as Q } from "./error-K1CakhA9.js";
+import { useI18n as re, useCoreStore as ie } from "@feedmepos/mf-common";
+import { z as X, a as Z } from "./validator-CTlVogBQ.js";
+import { o as Ce } from "./index-CFJQ_HmA.js";
+import { c as ke } from "./index-MdV54cWO.js";
+import { e as fe } from "./index-DErywACZ.js";
+import { P as Ne } from "./PaymentCheckout-DmAAyMaB.js";
+const Ve = /* @__PURE__ */ h({
+  __name: "Information",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    }
+  },
+  setup(T) {
+    return (p, a) => (g(), S(D, null, [
+      a[0] || (a[0] = I("b", null, "Name", -1)),
+      W(": " + z(T.terminal.name), 1),
+      a[1] || (a[1] = I("br", null, null, -1)),
+      a[2] || (a[2] = I("b", null, "Status", -1)),
+      W(": " + z(T.terminal.status), 1),
+      a[3] || (a[3] = I("br", null, null, -1)),
+      a[4] || (a[4] = I("b", null, "Device ID", -1)),
+      W(": " + z(T.terminal.deviceId ?? "-"), 1),
+      a[5] || (a[5] = I("br", null, null, -1)),
+      a[6] || (a[6] = I("b", null, "Device Type", -1)),
+      W(": " + z(T.terminal.deviceType ?? "-"), 1),
+      a[7] || (a[7] = I("br", null, null, -1))
+    ], 64));
+  }
+}), Se = { class: "flex items-center gap-8 rounded-md bg-fm-color-neutral-gray-100 px-16 py-12" }, Ue = { class: "fm-typo-en-body-md-400" }, he = { class: "mt-auto pt-24 pb-24" }, Re = /* @__PURE__ */ h({
+  __name: "TerminalSaveTemplateDialog",
+  setup(T) {
+    const p = ye(), { t: a } = re(), b = _(), l = _(""), r = _(""), e = _(!1), d = () => {
+      p.emitData({
+        name: l.value,
+        description: r.value,
+        isDefault: e.value
+      }), p.emitAction("primary");
+    };
+    return (c, v) => {
+      const m = f("FmIcon"), s = f("FmTextField"), t = f("FmSwitch"), o = f("FmButton"), i = f("FmForm");
+      return g(), F(i, {
+        ref_key: "form",
+        ref: b,
+        class: "flex flex-col gap-16 min-h-[240px]",
+        onValidationSuccess: d
+      }, {
+        default: O(() => [
+          I("div", Se, [
+            y(m, {
+              name: "info",
+              class: "shrink-0"
+            }),
+            I("span", Ue, z(N(a)("payment.terminal_template.scope_info")), 1)
+          ]),
+          y(s, {
+            modelValue: l.value,
+            "onUpdate:modelValue": v[0] || (v[0] = (u) => l.value = u),
+            label: "Template Name",
+            "label-mark": "required",
+            rules: N(X)(N(Z).string().min(1, "Template name is required"))
+          }, null, 8, ["modelValue", "rules"]),
+          y(s, {
+            modelValue: r.value,
+            "onUpdate:modelValue": v[1] || (v[1] = (u) => r.value = u),
+            label: "Description",
+            "label-mark": "optional"
+          }, null, 8, ["modelValue"]),
+          y(t, {
+            modelValue: e.value,
+            "onUpdate:modelValue": v[2] || (v[2] = (u) => e.value = u),
+            label: "Set as default",
+            "label-info": "Applied automatically when a new device of this type binds for this business."
+          }, null, 8, ["modelValue"]),
+          I("div", he, [
+            y(o, {
+              class: "w-full",
+              type: "submit",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), Pe = { class: "flex flex-col gap-16 min-h-[240px]" }, Be = { class: "flex items-start gap-8 rounded-md bg-fm-color-neutral-gray-100 px-16 py-12" }, Oe = { class: "fm-typo-en-body-md-400" }, Me = {
+  key: 0,
+  class: "fm-typo-en-body-md-400 text-fm-color-neutral-gray-500"
+}, Ae = {
+  key: 2,
+  class: "mt-auto pt-24 pb-24"
+}, qe = /* @__PURE__ */ h({
+  __name: "TerminalApplyTemplateDialog",
+  props: {
+    templates: {}
+  },
+  setup(T) {
+    const p = T, a = ye(), { t: b } = re(), l = _(""), r = V(
+      () => p.templates.map((d) => ({
+        label: d.isDefault ? `${d.name} (default)` : d.name,
+        value: d._id
+      }))
+    ), e = () => {
+      a.emitData({ templateId: l.value }), a.emitAction("primary");
+    };
+    return (d, c) => {
+      const v = f("FmIcon"), m = f("FmSelect"), s = f("FmButton");
+      return g(), S("div", Pe, [
+        I("div", Be, [
+          y(v, {
+            name: "info",
+            class: "mt-4 shrink-0"
+          }),
+          I("div", Oe, z(N(b)("payment.terminal_template.scope_info")), 1)
+        ]),
+        r.value.length === 0 ? (g(), S("div", Me, " No setting template exists for this business and device type yet. ")) : (g(), F(m, {
+          key: 1,
+          modelValue: l.value,
+          "onUpdate:modelValue": c[0] || (c[0] = (t) => l.value = t),
+          label: "Template",
+          items: r.value
+        }, null, 8, ["modelValue", "items"])),
+        r.value.length > 0 ? (g(), S("div", Ae, [
+          y(s, {
+            class: "w-full",
+            label: "Apply",
+            disabled: !l.value,
+            onClick: e
+          }, null, 8, ["disabled"])
+        ])) : U("", !0)
+      ]);
+    };
+  }
+}), Ge = { key: 0 }, De = { class: "mt-6 space-x-6" }, $e = /* @__PURE__ */ h({
+  __name: "KioskMode",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    }
+  },
+  setup(T) {
+    const { isLoading: p, startAsyncCall: a } = J(!1), b = me(), l = _({
+      enable: !1,
+      password: []
+    }), r = T;
+    function e() {
+      return l.value.enable && l.value.password.filter((d) => !!d).length !== 6 ? b.open({
+        type: "error",
+        message: "Unlock PIN is required when setting up kiosk mode for terminal."
+      }) : a(async () => {
+        const d = { enable: l.value.enable };
+        d.enable && Object.assign(d, {
+          password: l.value.password.join("")
+        });
+        const c = await j.kioskModeRequest(r.terminal._id, d);
+        if (c === "OK")
+          return b.open({ type: "info", message: "Kiosk mode applied successfully." });
+        let v = c;
+        return c === "client_not_connected" && (v = "Terminal not connected to the websocket server."), c.startsWith("terminal: ") && (v = c.replaceAll("terminal: ", "")), b.open({
+          type: "error",
+          message: v
+        });
+      });
+    }
+    return (d, c) => {
+      const v = f("FmSwitch"), m = f("FmPinField"), s = f("FmButton");
+      return g(), S(D, null, [
+        y(v, {
+          modelValue: l.value.enable,
+          "onUpdate:modelValue": c[0] || (c[0] = (t) => l.value.enable = t),
+          label: "Enable Kiosk Mode?"
+        }, null, 8, ["modelValue"]),
+        l.value.enable ? (g(), S("div", Ge, [
+          c[2] || (c[2] = I("p", { class: "mt-6" }, "Unlock PIN: ", -1)),
+          y(m, {
+            modelValue: l.value.password,
+            "onUpdate:modelValue": c[1] || (c[1] = (t) => l.value.password = t)
+          }, null, 8, ["modelValue"])
+        ])) : U("", !0),
+        I("div", De, [
+          y(s, {
+            variant: "primary",
+            label: "Send",
+            icon: "send",
+            loading: N(p),
+            onclick: e
+          }, null, 8, ["loading"])
+        ])
+      ], 64);
+    };
+  }
+}), Ee = /* @__PURE__ */ h({
+  __name: "SettingRequest",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    }
+  },
+  setup(T) {
+    const { settingTab: p } = oe({
+      settingTab: "kiosk_mode"
+    }), a = [
+      {
+        label: "Kiosk Mode",
+        value: "kiosk_mode",
+        render: $e
+      }
+    ], b = T, l = V(() => a.find((r) => r.value === p.value));
+    return (r, e) => {
+      var c;
+      const d = f("FmTabs");
+      return g(), S(D, null, [
+        e[1] || (e[1] = I("p", { className: "mt-1 my-6 text-gray-600" }, [
+          I("b", null, "Note: "),
+          W(" Setting request will perform remotely without caching so make sure terminal is connected to the network also to our websocket as well. ")
+        ], -1)),
+        y(d, {
+          "model-value": N(p),
+          "onUpdate:modelValue": e[0] || (e[0] = (v) => ae(p) ? p.value = v : null),
+          class: "mb-6",
+          items: a
+        }, null, 8, ["model-value"]),
+        N(p) ? (g(), F(te((c = l.value) == null ? void 0 : c.render), le(ne({ key: 0 }, { terminal: b.terminal })), null, 16)) : U("", !0)
+      ], 64);
+    };
+  }
+}), Le = 2e3, Ye = 12e4, je = "Timed out waiting for the Tyro reader to sync. Please try again.";
+function Ke(T) {
+  const { isLoading: p, startLoading: a, stopLoading: b } = J(!1), { t: l } = re(), r = me(), e = _(null), d = V(() => {
+    var k, B;
+    const w = (k = T.value.gateways) == null ? void 0 : k.find(
+      ($) => $.gateway === "Tyro"
+    );
+    return ((B = w == null ? void 0 : w.config) == null ? void 0 : B.uniqueId) || "";
+  }), c = V(() => !!d.value), v = V(() => {
+    var w;
+    return ((w = e.value) == null ? void 0 : w.status) === "ready";
+  }), m = V(() => {
+    var w, k;
+    return v.value && !!((k = (w = e.value) == null ? void 0 : w.fields) != null && k.tyroLocationId) && !!T.value.deviceId && !c.value;
+  }), s = V(() => !v.value && !c.value), t = V(
+    () => l("payment.onboard-submission.tyro.syncDisabledHint")
+  ), o = V(() => c.value ? "Synced" : "Sync");
+  async function i() {
+    if (!T.value.referenceId) {
+      e.value = null;
+      return;
+    }
+    try {
+      const w = await Ce.getByRestaurant(
+        T.value.referenceId
+      );
+      e.value = w.find(
+        (k) => k.type === ve.FdoOnboardType.enum.tyro
+      ) ?? null;
+    } catch (w) {
+      e.value = null, r.open({
+        type: "error",
+        message: Q(w)
+      });
+    }
+  }
+  const u = ke({
+    intervalMs: Le,
+    timeoutMs: Ye,
+    onTick: async ({ isCurrentRun: w, stop: k }) => {
+      var K, H;
+      const B = await j.readById(T.value._id);
+      if (!w())
+        return;
+      const $ = (K = B.gateways) == null ? void 0 : K.find((se) => se.gateway === "Tyro");
+      ($ == null ? void 0 : $.gateway) === "Tyro" && ((H = $ == null ? void 0 : $.config) != null && H.uniqueId) && (k({ invalidate: !1 }), b(), Object.assign(T.value, B), r.open({
+        type: "success",
+        message: "Tyro reader created successfully"
+      }));
+    },
+    onTimeout: () => {
+      b(), r.open({
+        type: "error",
+        message: je
+      });
+    },
+    onError: (w) => {
+      b(), r.open({
+        type: "error",
+        message: Q(w)
+      });
+    }
+  }), C = u.isPolling;
+  function n() {
+    u.stop(), b();
+  }
+  function x() {
+    n(), a(), u.start();
+  }
+  async function E() {
+    if (!m.value) {
+      r.open({
+        type: "error",
+        message: "Tyro reader sync is not available"
+      });
+      return;
+    }
+    try {
+      a(), await j.syncTyroReader(T.value._id), x();
+    } catch (w) {
+      n(), r.open({
+        type: "error",
+        message: Q(w)
+      });
+    }
+  }
+  return A(
+    () => T.value.referenceId,
+    async () => {
+      await i();
+    },
+    { immediate: !0 }
+  ), Te(() => {
+    n();
+  }), {
+    isLoading: p,
+    isPollingTyroReader: C,
+    uniqueId: d,
+    canSyncTyroReader: m,
+    showTyroSyncPopover: s,
+    tyroSyncPopoverMessage: t,
+    tyroSyncButtonLabel: o,
+    syncTyroReader: E
+  };
+}
+const He = {
+  key: 0,
+  class: "text-sm text-gray-500"
+}, ze = { class: "flex mt-6 space-x-6" }, Qe = { class: "flex-1" }, Je = /* @__PURE__ */ h({
+  __name: "SoftposGateway",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(T) {
+    const p = T, a = ie().currentCountry, b = [
+      {
+        label: "Fiuu Malaysia",
+        value: "cc.feedme.payment.rms",
+        region: P.F_COUNTRY.enum.MY,
+        gateway: "Fiuu",
+        isLegacy: !0,
+        isOutdated: !0
+      },
+      {
+        label: "Fiuu Malaysia V2",
+        value: "cc.feedme.payment.fiuu_my",
+        region: P.F_COUNTRY.enum.MY,
+        gateway: "Fiuu",
+        isLegacy: !0
+      },
+      {
+        label: "Fiuu Singapore",
+        value: "cc.feedme.payment.fiuu_sg",
+        region: P.F_COUNTRY.enum.SG,
+        gateway: "Fiuu",
+        isLegacy: !0
+      },
+      {
+        label: "Softspace Malaysia",
+        value: "cc.feedme.payment.softspace_my",
+        gateway: "Softspace",
+        region: P.F_COUNTRY.enum.MY
+      },
+      {
+        label: "Digio Thailand",
+        value: "cc.feedme.payment.digio_th",
+        gateway: "Digio",
+        region: P.F_COUNTRY.enum.TH
+      },
+      {
+        label: "Tyro Australia",
+        value: "cc.feedme.payment.tyro_au",
+        gateway: "Tyro",
+        region: P.F_COUNTRY.enum.AU
+      }
+    ], l = G(() => p.terminal), r = _(), e = _({
+      packageId: "",
+      uniqueId: "",
+      developerId: "",
+      isUat: !1
+    }), d = () => {
+      e.value.uniqueId = "", e.value.packageId = "", e.value.developerId = "", e.value.isUat = !1;
+    }, c = V(() => b.filter((R) => R.region === a.value)), v = V(() => c.value.find(
+      (R) => R.value === e.value.packageId
+    )), m = V(
+      () => {
+        var R;
+        return ((R = v.value) == null ? void 0 : R.gateway) === "Tyro";
+      }
+    ), {
+      isLoading: s,
+      isPollingTyroReader: t,
+      uniqueId: o,
+      canSyncTyroReader: i,
+      showTyroSyncPopover: u,
+      tyroSyncPopoverMessage: C,
+      tyroSyncButtonLabel: n,
+      syncTyroReader: x
+    } = Ke(l), E = V(() => m.value ? "button" : "submit"), w = V(() => m.value ? n.value : "Save"), k = V(() => m.value ? s.value : !1), B = V(() => m.value ? !i.value || t.value : !1), $ = () => {
+      if (!l.value.gateways || l.value.gateways.length === 0)
+        return d();
+      const R = l.value.gateways[0];
+      if (!R.config)
+        return d();
+      if (R.gateway === "Tyro") {
+        e.value = {
+          packageId: R.config.packageId,
+          uniqueId: R.config.uniqueId,
+          developerId: "",
+          isUat: !1
+        };
+        return;
+      }
+      switch (R.gateway) {
+        case "Fiuu":
+          e.value = {
+            packageId: R.config.packageId,
+            uniqueId: R.config.uniqueId,
+            developerId: "",
+            isUat: !1
+          };
+          break;
+        case "Softspace":
+        case "Digio":
+          const M = JSON.parse(R.config.uniqueId);
+          e.value = {
+            packageId: R.config.packageId,
+            uniqueId: M.uniqueId,
+            developerId: M.developerId,
+            isUat: M.isUat
+          };
+          return;
+      }
+    };
+    A(l, $), q($);
+    const K = () => {
+      e.value.uniqueId = "", e.value.developerId = "", e.value.isUat = !1;
+    };
+    async function H() {
+      const R = v.value;
+      if (!R)
+        return;
+      let M = e.value.uniqueId;
+      R.isLegacy || (M = JSON.stringify({
+        uniqueId: e.value.uniqueId,
+        developerId: e.value.developerId,
+        isUat: e.value.isUat
+      }));
+      const ue = {
+        gateway: R.gateway,
+        config: {
+          packageId: R.value,
+          uniqueId: M
+        }
+      };
+      (!l.value.gateways || l.value.gateways.length > 1) && (l.value.gateways = []), l.value.gateways[0] = ue, await p.onUpdate(l.value);
+    }
+    async function se(R) {
+      var M;
+      (M = l.value.gateways) == null || M.splice(R, 1), p.onUpdate(l.value);
+    }
+    function de() {
+      m.value && x();
+    }
+    return (R, M) => {
+      const ue = f("FmSelect"), ee = f("FmTextField"), ge = f("FmCheckbox"), ce = f("FmButton"), be = f("FmTooltip"), _e = f("FmForm");
+      return g(), F(_e, {
+        ref: r.value,
+        class: "flex flex-col gap-16 w-[500px]",
+        onValidationSuccess: H
+      }, {
+        default: O(() => [
+          y(ue, {
+            modelValue: e.value.packageId,
+            "onUpdate:modelValue": [
+              M[0] || (M[0] = (Y) => e.value.packageId = Y),
+              K
+            ],
+            label: "Package ID",
+            items: c.value
+          }, null, 8, ["modelValue", "items"]),
+          v.value ? (g(), S(D, { key: 0 }, [
+            m.value ? (g(), F(ee, {
+              key: 0,
+              "model-value": N(o),
+              label: "Unique ID (Reader ID)",
+              disabled: ""
+            }, null, 8, ["model-value"])) : v.value && v.value.isLegacy ? (g(), S(D, { key: 1 }, [
+              y(ee, {
+                modelValue: e.value.uniqueId,
+                "onUpdate:modelValue": M[1] || (M[1] = (Y) => e.value.uniqueId = Y),
+                label: "Unique ID (TID)"
+              }, null, 8, ["modelValue"]),
+              v.value.isOutdated ? (g(), S("span", He, " Note: For outdated gateway is no longer continued development, please use the new gateway instead. ")) : U("", !0)
+            ], 64)) : (g(), S(D, { key: 2 }, [
+              y(ee, {
+                modelValue: e.value.developerId,
+                "onUpdate:modelValue": M[2] || (M[2] = (Y) => e.value.developerId = Y),
+                label: "Developer ID (MID)"
+              }, null, 8, ["modelValue"]),
+              y(ee, {
+                modelValue: e.value.uniqueId,
+                "onUpdate:modelValue": M[3] || (M[3] = (Y) => e.value.uniqueId = Y),
+                label: "Unique ID (TID)"
+              }, null, 8, ["modelValue"]),
+              y(ge, {
+                modelValue: e.value.isUat,
+                "onUpdate:modelValue": M[4] || (M[4] = (Y) => e.value.isUat = Y),
+                label: "Is UAT (Test)",
+                value: "1"
+              }, null, 8, ["modelValue"])
+            ], 64)),
+            I("div", ze, [
+              l.value.gateways && l.value.gateways.length > 0 ? (g(), F(ce, {
+                key: 0,
+                class: "flex-1",
+                variant: "secondary",
+                label: "Delete",
+                onclick: () => se(0)
+              }, null, 8, ["onclick"])) : U("", !0),
+              m.value && N(u) && B.value ? (g(), F(be, {
+                key: 1,
+                class: "flex-1",
+                variant: "plain",
+                placement: "top",
+                content: N(C)
+              }, {
+                default: O(() => [
+                  I("div", Qe, [
+                    y(ce, {
+                      type: E.value,
+                      class: "w-full",
+                      variant: "primary",
+                      loading: k.value,
+                      disabled: B.value,
+                      label: w.value,
+                      onClick: de
+                    }, null, 8, ["type", "loading", "disabled", "label"])
+                  ])
+                ]),
+                _: 1
+              }, 8, ["content"])) : (g(), F(ce, {
+                key: 2,
+                type: E.value,
+                class: "flex-1",
+                variant: "primary",
+                loading: k.value,
+                disabled: B.value,
+                label: w.value,
+                onClick: de
+              }, null, 8, ["type", "loading", "disabled", "label"]))
+            ])
+          ], 64)) : U("", !0)
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), We = {
+  key: 0,
+  class: "flex items-center justify-center min-h-[80vh]"
+}, Xe = { class: "flex mt-6 space-x-6" }, Ze = /* @__PURE__ */ h({
+  __name: "TerminalGateway",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(T) {
+    const { isLoading: p, startAsyncCall: a } = J(), b = T, l = G(() => b.terminal), r = _(), e = _(), d = _(-1), c = _({
+      terminalId: ""
+    }), v = () => {
+      c.value.terminalId = "", d.value = -1;
+    }, m = () => {
+      if (a(async () => {
+        r.value = await j.getRestaurantTerminals(b.terminal.referenceId);
+      }), !b.terminal.ecrs)
+        return v();
+      const o = b.terminal.ecrs.findIndex((u) => u && u.gateway && u.gateway === "FeedMe");
+      if (o === -1)
+        return v();
+      d.value = o;
+      const i = b.terminal.ecrs.at(o);
+      i.gateway === "FeedMe" && i.config && (c.value = {
+        terminalId: i.config.terminalId
+      });
+    };
+    A(l, m), q(m);
+    const s = V(() => (r.value ?? []).map((o) => ({
+      label: o.name ?? o._id,
+      value: o._id
+    })));
+    async function t(o) {
+      var i;
+      (i = b.terminal.ecrs) == null || i.splice(o, 1), b.onUpdate(b.terminal);
+    }
+    return (o, i) => {
+      const u = f("FmCircularProgress"), C = f("FmSelect"), n = f("FmButton"), x = f("FmForm");
+      return N(p) ? (g(), S("div", We, [
+        y(u, { size: "xxl" })
+      ])) : (g(), F(x, {
+        key: 1,
+        ref: e.value,
+        class: "flex flex-col gap-16 w-[500px]",
+        onValidationSuccess: i[1] || (i[1] = () => {
+          d.value > -1 ? l.value.ecrs[d.value] = { gateway: "FeedMe", config: c.value } : (l.value.ecrs || (l.value.ecrs = []), l.value.ecrs.push({ gateway: "FeedMe", config: c.value })), b.onUpdate(l.value);
+        })
+      }, {
+        default: O(() => [
+          y(C, {
+            modelValue: c.value.terminalId,
+            "onUpdate:modelValue": i[0] || (i[0] = (E) => c.value.terminalId = E),
+            label: "Terminal ID",
+            items: s.value,
+            rules: N(X)(N(Z).string())
+          }, null, 8, ["modelValue", "items", "rules"]),
+          I("div", Xe, [
+            d.value > -1 ? (g(), F(n, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => t(d.value)
+            }, null, 8, ["onclick"])) : U("", !0),
+            y(n, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512));
+    };
+  }
+}), ea = { class: "flex mt-6 space-x-6" }, aa = /* @__PURE__ */ h({
+  __name: "GhlGateway",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(T) {
+    const p = T, a = G(() => p.terminal), b = _(), l = _(-1), r = _({
+      merchantId: "",
+      terminalId: "",
+      privateKey: ""
+    }), e = () => {
+      r.value.merchantId = "", r.value.terminalId = "", r.value.privateKey = "", l.value = -1;
+    }, d = () => {
+      if (!a.value.ecrs)
+        return e();
+      const v = a.value.ecrs.findIndex((s) => s && s.gateway && s.gateway === "Ghl");
+      if (v === -1)
+        return e();
+      l.value = v;
+      const m = a.value.ecrs.at(v);
+      m.gateway === "Ghl" && m.config && (r.value = {
+        merchantId: m.config.merchantId,
+        terminalId: m.config.terminalId,
+        privateKey: m.config.privateKey || ""
+      });
+    };
+    A(a, d), q(d);
+    async function c(v) {
+      var m;
+      (m = a.value.ecrs) == null || m.splice(v, 1), p.onUpdate(a.value);
+    }
+    return (v, m) => {
+      const s = f("FmTextField"), t = f("FmTextarea"), o = f("FmButton"), i = f("FmForm");
+      return g(), F(i, {
+        ref: b.value,
+        class: "flex flex-col gap-16 w-[500px]",
+        onValidationSuccess: m[3] || (m[3] = () => {
+          l.value > -1 ? a.value.ecrs[l.value] = { gateway: "Ghl", config: r.value } : (a.value.ecrs || (a.value.ecrs = []), a.value.ecrs.push({ gateway: "Ghl", config: r.value })), p.onUpdate(a.value);
+        })
+      }, {
+        default: O(() => [
+          y(s, {
+            modelValue: r.value.merchantId,
+            "onUpdate:modelValue": m[0] || (m[0] = (u) => r.value.merchantId = u),
+            label: "Merchant ID"
+          }, null, 8, ["modelValue"]),
+          y(s, {
+            modelValue: r.value.terminalId,
+            "onUpdate:modelValue": m[1] || (m[1] = (u) => r.value.terminalId = u),
+            label: "Terminal ID"
+          }, null, 8, ["modelValue"]),
+          y(t, {
+            modelValue: r.value.privateKey,
+            "onUpdate:modelValue": m[2] || (m[2] = (u) => r.value.privateKey = u),
+            label: "Private Key",
+            "label-mark": "optional",
+            "label-info": "Default will use FeedMe Private Key"
+          }, null, 8, ["modelValue"]),
+          I("div", ea, [
+            l.value > -1 ? (g(), F(o, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => c(l.value)
+            }, null, 8, ["onclick"])) : U("", !0),
+            y(o, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), ta = { class: "flex items-end" }, la = { class: "flex flex-wrap gap-8 items-center mt-4" }, na = { class: "flex mt-6 space-x-6" }, oa = /* @__PURE__ */ h({
+  __name: "MaybankGateway",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(T) {
+    const p = T, a = G(() => p.terminal), b = _(), l = _(-1), r = _(), e = _({
+      ip: "",
+      receiptName: "",
+      cardTypes: []
+    }), d = () => {
+      e.value.ip = "", e.value.receiptName = "", e.value.cardTypes = [], l.value = -1;
+    }, c = () => {
+      var i;
+      if (!a.value.ecrIntegrations)
+        return d();
+      const s = a.value.ecrIntegrations, t = s.findIndex((u) => u && u.gateway && u.gateway === "Maybank");
+      if (t === -1)
+        return d();
+      l.value = t;
+      const o = s.at(t);
+      o.gateway === "Maybank" && o.config && (e.value = {
+        ip: o.config.ip ?? "",
+        receiptName: o.receiptName ?? "",
+        cardTypes: ((i = o.dialogConfig) == null ? void 0 : i.cardTypes) ?? []
+      });
+    };
+    A(a, c), q(c);
+    async function v(s) {
+      var t;
+      (t = a.value.ecrIntegrations) == null || t.splice(s, 1), p.onUpdate(a.value);
+    }
+    async function m() {
+      e.value.cardTypes.push(r.value), r.value = "";
+    }
+    return (s, t) => {
+      const o = f("FmTextField"), i = f("FmButton"), u = f("FmChip"), C = f("FmForm");
+      return g(), F(C, {
+        ref: b.value,
+        class: "flex flex-col gap-16 w-[500px]",
+        onValidationSuccess: t[3] || (t[3] = () => {
+          var n, x;
+          l.value > -1 ? a.value.ecrIntegrations[l.value] = {
+            gateway: "Maybank",
+            config: { ip: e.value.ip },
+            receiptName: e.value.receiptName,
+            dialogConfig: {
+              ...(x = (n = a.value.ecrIntegrations) == null ? void 0 : n[l.value]) == null ? void 0 : x.dialogConfig,
+              cardTypes: e.value.cardTypes
+            }
+          } : (a.value.ecrIntegrations || (a.value.ecrIntegrations = []), a.value.ecrIntegrations.push({
+            gateway: "Maybank",
+            config: { ip: e.value.ip },
+            receiptName: e.value.receiptName,
+            dialogConfig: {
+              cardTypes: e.value.cardTypes
+            }
+          })), p.onUpdate(a.value);
+        })
+      }, {
+        default: O(() => [
+          y(o, {
+            modelValue: e.value.ip,
+            "onUpdate:modelValue": t[0] || (t[0] = (n) => e.value.ip = n),
+            label: "IP Address"
+          }, null, 8, ["modelValue"]),
+          y(o, {
+            modelValue: e.value.receiptName,
+            "onUpdate:modelValue": t[1] || (t[1] = (n) => e.value.receiptName = n),
+            label: "Receipt Payment Name",
+            "label-info": "Default receipt display will be 'TERMINAL_MAYBANK'"
+          }, null, 8, ["modelValue"]),
+          I("div", ta, [
+            y(o, {
+              modelValue: r.value,
+              "onUpdate:modelValue": t[2] || (t[2] = (n) => r.value = n),
+              label: "Fallback Card Types",
+              "label-info": "List of cards when fallback to reconcile dialog. Default VISA, MASTER"
+            }, null, 8, ["modelValue"]),
+            y(i, {
+              class: "ml-4",
+              icon: "add",
+              onClick: m
+            })
+          ]),
+          I("div", la, [
+            (g(!0), S(D, null, L(e.value.cardTypes, (n) => (g(), F(u, {
+              key: n,
+              label: n,
+              removable: !0,
+              onChipClosed: () => e.value.cardTypes.splice(e.value.cardTypes.indexOf(n), 1)
+            }, null, 8, ["label", "onChipClosed"]))), 128))
+          ]),
+          I("div", na, [
+            l.value > -1 ? (g(), F(i, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => v(l.value)
+            }, null, 8, ["onclick"])) : U("", !0),
+            y(i, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), ra = { class: "flex items-end" }, ia = { class: "flex flex-wrap gap-8 items-center mt-4" }, sa = { class: "flex mt-6 space-x-6" }, ua = /* @__PURE__ */ h({
+  __name: "Maybank2Gateway",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(T) {
+    const p = T, a = G(() => p.terminal), b = _(), l = _(-1), r = _(), e = _({
+      ip: "",
+      receiptName: "",
+      cardTypes: []
+    }), d = () => {
+      e.value.ip = "", e.value.receiptName = "", e.value.cardTypes = [], l.value = -1;
+    }, c = () => {
+      var i;
+      if (!a.value.ecrIntegrations)
+        return d();
+      const s = a.value.ecrIntegrations, t = s.findIndex((u) => u && u.gateway && u.gateway === "Maybank2");
+      if (t === -1)
+        return d();
+      l.value = t;
+      const o = s.at(t);
+      o.gateway === "Maybank2" && o.config && (e.value = {
+        ip: o.config.ip ?? "",
+        receiptName: o.receiptName ?? "",
+        cardTypes: ((i = o.dialogConfig) == null ? void 0 : i.cardTypes) ?? []
+      });
+    };
+    A(a, c), q(c);
+    async function v(s) {
+      var t;
+      (t = a.value.ecrIntegrations) == null || t.splice(s, 1), p.onUpdate(a.value);
+    }
+    async function m() {
+      e.value.cardTypes.push(r.value), r.value = "";
+    }
+    return (s, t) => {
+      const o = f("FmTextField"), i = f("FmButton"), u = f("FmChip"), C = f("FmForm");
+      return g(), F(C, {
+        ref: b.value,
+        class: "flex flex-col gap-16 w-[500px]",
+        onValidationSuccess: t[3] || (t[3] = () => {
+          var n, x;
+          l.value > -1 ? a.value.ecrIntegrations[l.value] = {
+            gateway: "Maybank2",
+            config: { ip: e.value.ip },
+            receiptName: e.value.receiptName,
+            dialogConfig: {
+              ...(x = (n = a.value.ecrIntegrations) == null ? void 0 : n[l.value]) == null ? void 0 : x.dialogConfig,
+              cardTypes: e.value.cardTypes
+            }
+          } : (a.value.ecrIntegrations || (a.value.ecrIntegrations = []), a.value.ecrIntegrations.push({
+            gateway: "Maybank2",
+            config: { ip: e.value.ip },
+            receiptName: e.value.receiptName,
+            dialogConfig: {
+              cardTypes: e.value.cardTypes
+            }
+          })), p.onUpdate(a.value);
+        })
+      }, {
+        default: O(() => [
+          y(o, {
+            modelValue: e.value.ip,
+            "onUpdate:modelValue": t[0] || (t[0] = (n) => e.value.ip = n),
+            label: "IP Address"
+          }, null, 8, ["modelValue"]),
+          y(o, {
+            modelValue: e.value.receiptName,
+            "onUpdate:modelValue": t[1] || (t[1] = (n) => e.value.receiptName = n),
+            label: "Receipt Payment Name",
+            "label-info": "Default receipt display will be 'TERMINAL_MAYBANK'"
+          }, null, 8, ["modelValue"]),
+          I("div", ra, [
+            y(o, {
+              modelValue: r.value,
+              "onUpdate:modelValue": t[2] || (t[2] = (n) => r.value = n),
+              label: "Fallback Card Types",
+              "label-info": "List of cards when fallback to reconcile dialog. Default VISA, MASTER"
+            }, null, 8, ["modelValue"]),
+            y(i, {
+              class: "ml-4",
+              icon: "add",
+              onClick: m
+            })
+          ]),
+          I("div", ia, [
+            (g(!0), S(D, null, L(e.value.cardTypes, (n) => (g(), F(u, {
+              key: n,
+              label: n,
+              removable: !0,
+              onChipClosed: () => e.value.cardTypes.splice(e.value.cardTypes.indexOf(n), 1)
+            }, null, 8, ["label", "onChipClosed"]))), 128))
+          ]),
+          I("div", sa, [
+            l.value > -1 ? (g(), F(i, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => v(l.value)
+            }, null, 8, ["onclick"])) : U("", !0),
+            y(i, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), ca = { class: "flex items-end" }, ma = { class: "flex flex-wrap gap-8 items-center mt-4" }, da = { class: "flex mt-6 space-x-6" }, pa = /* @__PURE__ */ h({
+  __name: "Maybank3Gateway",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(T) {
+    const p = T, a = G(() => p.terminal), b = _(), l = _(-1), r = _(), e = _({
+      receiptName: "",
+      config: {},
+      cardTypes: []
+    }), d = () => {
+      e.value.receiptName = "", e.value.cardTypes = [], l.value = -1;
+    }, c = () => {
+      var i;
+      if (!a.value.ecrIntegrations)
+        return d();
+      const s = a.value.ecrIntegrations, t = s.findIndex((u) => u && u.gateway && u.gateway === "Maybank3");
+      if (t === -1)
+        return d();
+      l.value = t;
+      const o = s.at(t);
+      o.gateway === "Maybank3" && o.config && (e.value = {
+        config: o.config,
+        receiptName: o.receiptName ?? "",
+        cardTypes: ((i = o.dialogConfig) == null ? void 0 : i.cardTypes) ?? []
+      });
+    };
+    A(a, c), q(c);
+    async function v(s) {
+      var t;
+      (t = a.value.ecrIntegrations) == null || t.splice(s, 1), p.onUpdate(a.value);
+    }
+    async function m() {
+      e.value.cardTypes.push(r.value), r.value = "";
+    }
+    return (s, t) => {
+      const o = f("FmTextField"), i = f("FmButton"), u = f("FmChip"), C = f("FmForm");
+      return g(), F(C, {
+        ref: b.value,
+        class: "flex flex-col gap-16 w-[500px]",
+        onValidationSuccess: t[2] || (t[2] = () => {
+          var n, x;
+          l.value > -1 ? a.value.ecrIntegrations[l.value] = {
+            gateway: "Maybank3",
+            config: e.value.config,
+            receiptName: e.value.receiptName,
+            dialogConfig: {
+              ...(x = (n = a.value.ecrIntegrations) == null ? void 0 : n[l.value]) == null ? void 0 : x.dialogConfig,
+              cardTypes: e.value.cardTypes
+            }
+          } : (a.value.ecrIntegrations || (a.value.ecrIntegrations = []), a.value.ecrIntegrations.push({
+            gateway: "Maybank3",
+            config: e.value.config,
+            receiptName: e.value.receiptName,
+            dialogConfig: {
+              cardTypes: e.value.cardTypes
+            }
+          })), p.onUpdate(a.value);
+        })
+      }, {
+        default: O(() => [
+          y(o, {
+            modelValue: e.value.receiptName,
+            "onUpdate:modelValue": t[0] || (t[0] = (n) => e.value.receiptName = n),
+            label: "Receipt Payment Name",
+            "label-info": "Default receipt display will be 'TERMINAL_MAYBANK'"
+          }, null, 8, ["modelValue"]),
+          I("div", ca, [
+            y(o, {
+              modelValue: r.value,
+              "onUpdate:modelValue": t[1] || (t[1] = (n) => r.value = n),
+              label: "Fallback Card Types",
+              "label-info": "List of cards when fallback to reconcile dialog. Default VISA, MASTER"
+            }, null, 8, ["modelValue"]),
+            y(i, {
+              class: "ml-4",
+              icon: "add",
+              onClick: m
+            })
+          ]),
+          I("div", ma, [
+            (g(!0), S(D, null, L(e.value.cardTypes, (n) => (g(), F(u, {
+              key: n,
+              label: n,
+              removable: !0,
+              onChipClosed: () => e.value.cardTypes.splice(e.value.cardTypes.indexOf(n), 1)
+            }, null, 8, ["label", "onChipClosed"]))), 128))
+          ]),
+          I("div", da, [
+            l.value > -1 ? (g(), F(i, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => v(l.value)
+            }, null, 8, ["onclick"])) : U("", !0),
+            y(i, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), va = { class: "flex items-end" }, ya = { class: "flex flex-wrap gap-8 items-center mt-4" }, fa = { class: "flex mt-6 space-x-6" }, ga = /* @__PURE__ */ h({
+  __name: "NetsGateway",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(T) {
+    const p = T, a = G(() => p.terminal), b = _(), l = _(-1), r = _(), e = _({
+      ip: "",
+      receiptName: "",
+      cardTypes: []
+    }), d = () => {
+      e.value.ip = "", e.value.receiptName = "", e.value.cardTypes = [], l.value = -1;
+    }, c = () => {
+      var i;
+      if (!a.value.ecrIntegrations)
+        return d();
+      const s = a.value.ecrIntegrations, t = s.findIndex((u) => u && u.gateway && u.gateway === "Nets");
+      if (t === -1)
+        return d();
+      l.value = t;
+      const o = s.at(t);
+      o.gateway === "Nets" && o.config && (e.value = {
+        ip: o.config.ip ?? "",
+        receiptName: o.receiptName ?? "",
+        cardTypes: ((i = o.dialogConfig) == null ? void 0 : i.cardTypes) ?? []
+      });
+    };
+    A(a, c), q(c);
+    async function v(s) {
+      var t;
+      (t = a.value.ecrIntegrations) == null || t.splice(s, 1), p.onUpdate(a.value);
+    }
+    async function m() {
+      e.value.cardTypes.push(r.value), r.value = "";
+    }
+    return (s, t) => {
+      const o = f("FmTextField"), i = f("FmButton"), u = f("FmChip"), C = f("FmForm");
+      return g(), F(C, {
+        ref: b.value,
+        class: "flex flex-col gap-16 w-[500px]",
+        onValidationSuccess: t[3] || (t[3] = () => {
+          var n, x;
+          l.value > -1 ? a.value.ecrIntegrations[l.value] = {
+            gateway: "Nets",
+            config: { ip: e.value.ip },
+            receiptName: e.value.receiptName,
+            dialogConfig: {
+              ...(x = (n = a.value.ecrIntegrations) == null ? void 0 : n[l.value]) == null ? void 0 : x.dialogConfig,
+              cardTypes: e.value.cardTypes
+            }
+          } : (a.value.ecrIntegrations || (a.value.ecrIntegrations = []), a.value.ecrIntegrations.push({
+            gateway: "Nets",
+            config: { ip: e.value.ip },
+            receiptName: e.value.receiptName,
+            dialogConfig: {
+              cardTypes: e.value.cardTypes
+            }
+          })), p.onUpdate(a.value);
+        })
+      }, {
+        default: O(() => [
+          y(o, {
+            modelValue: e.value.ip,
+            "onUpdate:modelValue": t[0] || (t[0] = (n) => e.value.ip = n),
+            label: "IP Address"
+          }, null, 8, ["modelValue"]),
+          y(o, {
+            modelValue: e.value.receiptName,
+            "onUpdate:modelValue": t[1] || (t[1] = (n) => e.value.receiptName = n),
+            label: "Receipt Payment Name",
+            "label-info": "Default receipt display will be 'TERMINAL_NETS'"
+          }, null, 8, ["modelValue"]),
+          I("div", va, [
+            y(o, {
+              modelValue: r.value,
+              "onUpdate:modelValue": t[2] || (t[2] = (n) => r.value = n),
+              label: "Fallback Card Types",
+              "label-info": "List of cards when fallback to reconcile dialog. Default VISA, MASTER"
+            }, null, 8, ["modelValue"]),
+            y(i, {
+              class: "ml-4",
+              icon: "add",
+              onClick: m
+            })
+          ]),
+          I("div", ya, [
+            (g(!0), S(D, null, L(e.value.cardTypes, (n) => (g(), F(u, {
+              key: n,
+              label: n,
+              removable: !0,
+              onChipClosed: () => e.value.cardTypes.splice(e.value.cardTypes.indexOf(n), 1)
+            }, null, 8, ["label", "onChipClosed"]))), 128))
+          ]),
+          I("div", fa, [
+            l.value > -1 ? (g(), F(i, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => v(l.value)
+            }, null, 8, ["onclick"])) : U("", !0),
+            y(i, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), ba = { class: "flex items-end" }, _a = { class: "flex flex-wrap gap-8 items-center mt-4" }, Ta = { class: "flex mt-6 space-x-6" }, Ia = /* @__PURE__ */ h({
+  __name: "KBankGateway",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(T) {
+    const p = T, a = G(() => p.terminal), b = _(), l = _(-1), r = _(), e = _({
+      receiptName: "",
+      cardTypes: []
+    }), d = () => {
+      e.value.receiptName = "", e.value.cardTypes = [], l.value = -1;
+    }, c = () => {
+      var i;
+      if (!a.value.ecrIntegrations)
+        return d();
+      const s = a.value.ecrIntegrations, t = s.findIndex((u) => u && u.gateway && u.gateway === "Kbank");
+      if (t === -1)
+        return d();
+      l.value = t;
+      const o = s.at(t);
+      o.gateway === "Kbank" && o.config && (e.value = {
+        receiptName: o.receiptName ?? "",
+        cardTypes: ((i = o.dialogConfig) == null ? void 0 : i.cardTypes) ?? []
+      });
+    };
+    A(a, c), q(c);
+    async function v(s) {
+      var t;
+      (t = a.value.ecrIntegrations) == null || t.splice(s, 1), p.onUpdate(a.value);
+    }
+    async function m() {
+      e.value.cardTypes.push(r.value), r.value = "";
+    }
+    return (s, t) => {
+      const o = f("FmTextField"), i = f("FmButton"), u = f("FmChip"), C = f("FmForm");
+      return g(), F(C, {
+        ref: b.value,
+        class: "flex flex-col gap-16 w-[500px]",
+        onValidationSuccess: t[2] || (t[2] = () => {
+          var n, x;
+          l.value > -1 ? a.value.ecrIntegrations[l.value] = {
+            gateway: "Kbank",
+            config: {},
+            receiptName: e.value.receiptName,
+            dialogConfig: {
+              ...(x = (n = a.value.ecrIntegrations) == null ? void 0 : n[l.value]) == null ? void 0 : x.dialogConfig,
+              cardTypes: e.value.cardTypes
+            }
+          } : (a.value.ecrIntegrations || (a.value.ecrIntegrations = []), a.value.ecrIntegrations.push({
+            gateway: "Kbank",
+            config: {},
+            receiptName: e.value.receiptName,
+            dialogConfig: {
+              cardTypes: e.value.cardTypes
+            }
+          })), p.onUpdate(a.value);
+        })
+      }, {
+        default: O(() => [
+          y(o, {
+            modelValue: e.value.receiptName,
+            "onUpdate:modelValue": t[0] || (t[0] = (n) => e.value.receiptName = n),
+            label: "Receipt Payment Name",
+            "label-info": "Default receipt display will be 'TERMINAL_KBANK'"
+          }, null, 8, ["modelValue"]),
+          I("div", ba, [
+            y(o, {
+              modelValue: r.value,
+              "onUpdate:modelValue": t[1] || (t[1] = (n) => r.value = n),
+              label: "Fallback Card Types",
+              "label-info": "List of cards when fallback to reconcile dialog. Default VISA, MASTER"
+            }, null, 8, ["modelValue"]),
+            y(i, {
+              class: "ml-4",
+              icon: "add",
+              onClick: m
+            })
+          ]),
+          I("div", _a, [
+            (g(!0), S(D, null, L(e.value.cardTypes, (n) => (g(), F(u, {
+              key: n,
+              label: n,
+              removable: !0,
+              onChipClosed: () => e.value.cardTypes.splice(e.value.cardTypes.indexOf(n), 1)
+            }, null, 8, ["label", "onChipClosed"]))), 128))
+          ]),
+          I("div", Ta, [
+            l.value > -1 ? (g(), F(i, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => v(l.value)
+            }, null, 8, ["onclick"])) : U("", !0),
+            y(i, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), Fa = { class: "flex mt-6 space-x-6" }, wa = /* @__PURE__ */ h({
+  __name: "Ghl2Gateway",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(T) {
+    const p = T, a = G(() => p.terminal), b = _(), l = _(-1), r = _({
+      ip: "",
+      receiptName: ""
+    }), e = () => {
+      r.value.ip = "", r.value.receiptName = "", l.value = -1;
+    }, d = () => {
+      if (!a.value.ecrIntegrations)
+        return e();
+      const v = a.value.ecrIntegrations, m = v.findIndex((t) => t && t.gateway && t.gateway === "Ghl2");
+      if (m === -1)
+        return e();
+      l.value = m;
+      const s = v.at(m);
+      s.gateway === "Ghl2" && s.config && (r.value = {
+        ip: s.config.ip ?? "",
+        receiptName: s.receiptName ?? ""
+      });
+    };
+    A(a, d), q(d);
+    async function c(v) {
+      var m;
+      (m = a.value.ecrIntegrations) == null || m.splice(v, 1), p.onUpdate(a.value);
+    }
+    return (v, m) => {
+      const s = f("FmTextField"), t = f("FmButton"), o = f("FmForm");
+      return g(), F(o, {
+        ref: b.value,
+        class: "flex flex-col gap-16 w-[500px]",
+        onValidationSuccess: m[2] || (m[2] = () => {
+          a.value.ecrIntegrations || (a.value.ecrIntegrations = []), l.value > -1 ? a.value.ecrIntegrations[l.value] = {
+            gateway: "Ghl2",
+            config: { ip: r.value.ip },
+            receiptName: r.value.receiptName
+          } : a.value.ecrIntegrations.push({
+            gateway: "Ghl2",
+            config: { ip: r.value.ip },
+            receiptName: r.value.receiptName
+          }), p.onUpdate(a.value);
+        })
+      }, {
+        default: O(() => [
+          y(s, {
+            modelValue: r.value.ip,
+            "onUpdate:modelValue": m[0] || (m[0] = (i) => r.value.ip = i),
+            label: "IP Address"
+          }, null, 8, ["modelValue"]),
+          y(s, {
+            modelValue: r.value.receiptName,
+            "onUpdate:modelValue": m[1] || (m[1] = (i) => r.value.receiptName = i),
+            label: "Receipt Payment Name",
+            "label-info": "Default receipt display will be 'TERMINAL_GHL_2'"
+          }, null, 8, ["modelValue"]),
+          I("div", Fa, [
+            l.value > -1 ? (g(), F(t, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => c(l.value)
+            }, null, 8, ["onclick"])) : U("", !0),
+            y(t, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), xa = { class: "flex items-end" }, Ca = { class: "flex flex-wrap gap-8 items-center mt-4" }, ka = { class: "flex mt-6 space-x-6" }, Na = /* @__PURE__ */ h({
+  __name: "Ghl3Gateway",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(T) {
+    const p = T, a = G(() => p.terminal), b = _(), l = _(-1), r = _(), e = _({
+      receiptName: "",
+      config: {},
+      cardTypes: []
+    }), d = () => {
+      e.value.receiptName = "", e.value.cardTypes = [], l.value = -1;
+    }, c = () => {
+      var i;
+      if (!a.value.ecrIntegrations)
+        return d();
+      const s = a.value.ecrIntegrations, t = s.findIndex(
+        (u) => u && u.gateway && u.gateway === "Ghl3"
+      );
+      if (t === -1)
+        return d();
+      l.value = t;
+      const o = s.at(t);
+      o.gateway === "Ghl3" && o.config && (e.value = {
+        config: o.config,
+        receiptName: o.receiptName ?? "",
+        cardTypes: ((i = o.dialogConfig) == null ? void 0 : i.cardTypes) ?? []
+      });
+    };
+    A(a, c), q(c);
+    async function v(s) {
+      var t;
+      (t = a.value.ecrIntegrations) == null || t.splice(s, 1), p.onUpdate(a.value);
+    }
+    async function m() {
+      e.value.cardTypes.push(r.value), r.value = "";
+    }
+    return (s, t) => {
+      const o = f("FmTextField"), i = f("FmButton"), u = f("FmChip"), C = f("FmForm");
+      return g(), F(C, {
+        ref: b.value,
+        class: "flex flex-col gap-16 w-[500px]",
+        onValidationSuccess: t[2] || (t[2] = () => {
+          var n, x;
+          l.value > -1 ? a.value.ecrIntegrations[l.value] = {
+            gateway: "Ghl3",
+            config: e.value.config,
+            receiptName: e.value.receiptName,
+            dialogConfig: {
+              ...(x = (n = a.value.ecrIntegrations) == null ? void 0 : n[l.value]) == null ? void 0 : x.dialogConfig,
+              cardTypes: e.value.cardTypes
+            }
+          } : (a.value.ecrIntegrations || (a.value.ecrIntegrations = []), a.value.ecrIntegrations.push({
+            gateway: "Ghl3",
+            config: e.value.config,
+            receiptName: e.value.receiptName,
+            dialogConfig: {
+              cardTypes: e.value.cardTypes
+            }
+          })), p.onUpdate(a.value);
+        })
+      }, {
+        default: O(() => [
+          y(o, {
+            modelValue: e.value.receiptName,
+            "onUpdate:modelValue": t[0] || (t[0] = (n) => e.value.receiptName = n),
+            label: "Receipt Payment Name",
+            "label-info": "Default receipt display will be 'TERMINAL_GHL'"
+          }, null, 8, ["modelValue"]),
+          I("div", xa, [
+            y(o, {
+              modelValue: r.value,
+              "onUpdate:modelValue": t[1] || (t[1] = (n) => r.value = n),
+              label: "Fallback Card Types",
+              "label-info": "List of cards when fallback to reconcile dialog. Default VISA, MASTER"
+            }, null, 8, ["modelValue"]),
+            y(i, {
+              class: "ml-4",
+              icon: "add",
+              onClick: m
+            })
+          ]),
+          I("div", Ca, [
+            (g(!0), S(D, null, L(e.value.cardTypes, (n) => (g(), F(u, {
+              key: n,
+              label: n,
+              removable: !0,
+              onChipClosed: () => e.value.cardTypes.splice(e.value.cardTypes.indexOf(n), 1)
+            }, null, 8, ["label", "onChipClosed"]))), 128))
+          ]),
+          I("div", ka, [
+            l.value > -1 ? (g(), F(i, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => v(l.value)
+            }, null, 8, ["onclick"])) : U("", !0),
+            y(i, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), Va = { class: "flex items-end" }, Sa = { class: "flex flex-wrap gap-8 items-center mt-4" }, Ua = { class: "flex mt-6 space-x-6" }, ha = /* @__PURE__ */ h({
+  __name: "HlbbGateway",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(T) {
+    const p = T, a = G(() => p.terminal), b = _(), l = _(-1), r = _(), e = _({
+      receiptName: "",
+      config: {},
+      cardTypes: []
+    }), d = () => {
+      e.value.receiptName = "", e.value.cardTypes = [], l.value = -1;
+    }, c = () => {
+      var i;
+      if (!a.value.ecrIntegrations)
+        return d();
+      const s = a.value.ecrIntegrations, t = s.findIndex(
+        (u) => u && u.gateway && u.gateway === "Hlbb"
+      );
+      if (t === -1)
+        return d();
+      l.value = t;
+      const o = s.at(t);
+      o.gateway === "Hlbb" && o.config && (e.value = {
+        config: o.config,
+        receiptName: o.receiptName ?? "",
+        cardTypes: ((i = o.dialogConfig) == null ? void 0 : i.cardTypes) ?? []
+      });
+    };
+    A(a, c), q(c);
+    async function v(s) {
+      var t;
+      (t = a.value.ecrIntegrations) == null || t.splice(s, 1), p.onUpdate(a.value);
+    }
+    async function m() {
+      e.value.cardTypes.push(r.value), r.value = "";
+    }
+    return (s, t) => {
+      const o = f("FmTextField"), i = f("FmButton"), u = f("FmChip"), C = f("FmForm");
+      return g(), F(C, {
+        ref: b.value,
+        class: "flex flex-col gap-16 w-[500px]",
+        onValidationSuccess: t[2] || (t[2] = () => {
+          var n, x;
+          l.value > -1 ? a.value.ecrIntegrations[l.value] = {
+            gateway: "Hlbb",
+            config: e.value.config,
+            receiptName: e.value.receiptName,
+            dialogConfig: {
+              ...(x = (n = a.value.ecrIntegrations) == null ? void 0 : n[l.value]) == null ? void 0 : x.dialogConfig,
+              cardTypes: e.value.cardTypes
+            }
+          } : (a.value.ecrIntegrations || (a.value.ecrIntegrations = []), a.value.ecrIntegrations.push({
+            gateway: "Hlbb",
+            config: e.value.config,
+            receiptName: e.value.receiptName,
+            dialogConfig: {
+              cardTypes: e.value.cardTypes
+            }
+          })), p.onUpdate(a.value);
+        })
+      }, {
+        default: O(() => [
+          y(o, {
+            modelValue: e.value.receiptName,
+            "onUpdate:modelValue": t[0] || (t[0] = (n) => e.value.receiptName = n),
+            label: "Receipt Payment Name",
+            "label-info": "Default receipt display will be 'TERMINAL_MAYBANK'"
+          }, null, 8, ["modelValue"]),
+          I("div", Va, [
+            y(o, {
+              modelValue: r.value,
+              "onUpdate:modelValue": t[1] || (t[1] = (n) => r.value = n),
+              label: "Fallback Card Types",
+              "label-info": "List of cards when fallback to reconcile dialog. Default VISA, MASTER"
+            }, null, 8, ["modelValue"]),
+            y(i, {
+              class: "ml-4",
+              icon: "add",
+              onClick: m
+            })
+          ]),
+          I("div", Sa, [
+            (g(!0), S(D, null, L(e.value.cardTypes, (n) => (g(), F(u, {
+              key: n,
+              label: n,
+              removable: !0,
+              onChipClosed: () => e.value.cardTypes.splice(e.value.cardTypes.indexOf(n), 1)
+            }, null, 8, ["label", "onChipClosed"]))), 128))
+          ]),
+          I("div", Ua, [
+            l.value > -1 ? (g(), F(i, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => v(l.value)
+            }, null, 8, ["onclick"])) : U("", !0),
+            y(i, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), Ra = { class: "flex items-end" }, Pa = { class: "flex flex-wrap gap-8 items-center mt-4" }, Ba = { class: "flex mt-6 space-x-6" }, Oa = /* @__PURE__ */ h({
+  __name: "GlobalPaymentsGateway",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(T) {
+    const p = T, a = G(() => p.terminal), b = _(), l = _(-1), r = _(), e = _({
+      ip: "",
+      receiptName: "",
+      cardTypes: []
+    }), d = () => {
+      e.value.ip = "", e.value.receiptName = "", e.value.cardTypes = [], l.value = -1;
+    }, c = () => {
+      var i;
+      if (!a.value.ecrIntegrations)
+        return d();
+      const s = a.value.ecrIntegrations, t = s.findIndex(
+        (u) => u && u.gateway && u.gateway === "GlobalPayments"
+      );
+      if (t === -1)
+        return d();
+      l.value = t;
+      const o = s.at(t);
+      o.gateway === "GlobalPayments" && o.config && (e.value = {
+        ip: o.config.ip ?? "",
+        receiptName: o.receiptName ?? "",
+        cardTypes: ((i = o.dialogConfig) == null ? void 0 : i.cardTypes) ?? []
+      });
+    };
+    A(a, c), q(c);
+    async function v(s) {
+      var t;
+      (t = a.value.ecrIntegrations) == null || t.splice(s, 1), p.onUpdate(a.value);
+    }
+    async function m() {
+      e.value.cardTypes.push(r.value), r.value = "";
+    }
+    return (s, t) => {
+      const o = f("FmTextField"), i = f("FmButton"), u = f("FmChip"), C = f("FmForm");
+      return g(), F(C, {
+        ref: b.value,
+        class: "flex flex-col gap-16 w-[500px]",
+        onValidationSuccess: t[3] || (t[3] = () => {
+          var n, x;
+          l.value > -1 ? a.value.ecrIntegrations[l.value] = {
+            gateway: "GlobalPayments",
+            config: { ip: e.value.ip },
+            receiptName: e.value.receiptName,
+            dialogConfig: {
+              ...(x = (n = a.value.ecrIntegrations) == null ? void 0 : n[l.value]) == null ? void 0 : x.dialogConfig,
+              cardTypes: e.value.cardTypes
+            }
+          } : (a.value.ecrIntegrations || (a.value.ecrIntegrations = []), a.value.ecrIntegrations.push({
+            gateway: "GlobalPayments",
+            config: { ip: e.value.ip },
+            receiptName: e.value.receiptName,
+            dialogConfig: {
+              cardTypes: e.value.cardTypes
+            }
+          })), p.onUpdate(a.value);
+        })
+      }, {
+        default: O(() => [
+          y(o, {
+            modelValue: e.value.ip,
+            "onUpdate:modelValue": t[0] || (t[0] = (n) => e.value.ip = n),
+            label: "IP Address"
+          }, null, 8, ["modelValue"]),
+          y(o, {
+            modelValue: e.value.receiptName,
+            "onUpdate:modelValue": t[1] || (t[1] = (n) => e.value.receiptName = n),
+            label: "Receipt Payment Name",
+            "label-info": "Default receipt display will be 'TERMINAL_GP'"
+          }, null, 8, ["modelValue"]),
+          I("div", Ra, [
+            y(o, {
+              modelValue: r.value,
+              "onUpdate:modelValue": t[2] || (t[2] = (n) => r.value = n),
+              label: "Fallback Card Types",
+              "label-info": "List of cards when fallback to reconcile dialog. Default VISA, MASTER"
+            }, null, 8, ["modelValue"]),
+            y(i, {
+              class: "ml-4",
+              icon: "add",
+              onClick: m
+            })
+          ]),
+          I("div", Pa, [
+            (g(!0), S(D, null, L(e.value.cardTypes, (n) => (g(), F(u, {
+              key: n,
+              label: n,
+              removable: !0,
+              onChipClosed: () => e.value.cardTypes.splice(e.value.cardTypes.indexOf(n), 1)
+            }, null, 8, ["label", "onChipClosed"]))), 128))
+          ]),
+          I("div", Ba, [
+            l.value > -1 ? (g(), F(i, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => v(l.value)
+            }, null, 8, ["onclick"])) : U("", !0),
+            y(i, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), Ma = { class: "flex items-end" }, Aa = { class: "flex flex-wrap gap-8 items-center mt-4" }, qa = { class: "flex mt-6 space-x-6" }, Ga = /* @__PURE__ */ h({
+  __name: "OmaGateway",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(T) {
+    const p = T, a = G(() => p.terminal), b = _(), l = _(-1), r = _(), e = _({
+      receiptName: "",
+      cardTypes: []
+    }), d = () => {
+      e.value.receiptName = "", e.value.cardTypes = [], l.value = -1;
+    }, c = () => {
+      var i;
+      if (!a.value.ecrIntegrations)
+        return d();
+      const s = a.value.ecrIntegrations, t = s.findIndex(
+        (u) => u && u.gateway && u.gateway === "Oma"
+      );
+      if (t === -1)
+        return d();
+      l.value = t;
+      const o = s.at(t);
+      o.gateway === "Oma" && o.config && (e.value = {
+        receiptName: o.receiptName ?? "",
+        cardTypes: ((i = o.dialogConfig) == null ? void 0 : i.cardTypes) ?? []
+      });
+    };
+    A(a, c), q(c);
+    async function v(s) {
+      var t;
+      (t = a.value.ecrIntegrations) == null || t.splice(s, 1), p.onUpdate(a.value);
+    }
+    async function m() {
+      e.value.cardTypes.push(r.value), r.value = "";
+    }
+    return (s, t) => {
+      const o = f("FmTextField"), i = f("FmButton"), u = f("FmChip"), C = f("FmForm");
+      return g(), F(C, {
+        ref: b.value,
+        class: "flex flex-col gap-16 w-[500px]",
+        onValidationSuccess: t[2] || (t[2] = () => {
+          var n, x;
+          l.value > -1 ? a.value.ecrIntegrations[l.value] = {
+            gateway: "Oma",
+            config: {},
+            receiptName: e.value.receiptName,
+            dialogConfig: {
+              ...(x = (n = a.value.ecrIntegrations) == null ? void 0 : n[l.value]) == null ? void 0 : x.dialogConfig,
+              cardTypes: e.value.cardTypes
+            }
+          } : (a.value.ecrIntegrations || (a.value.ecrIntegrations = []), a.value.ecrIntegrations.push({
+            gateway: "Oma",
+            config: {},
+            receiptName: e.value.receiptName,
+            dialogConfig: {
+              cardTypes: e.value.cardTypes
+            }
+          })), p.onUpdate(a.value);
+        })
+      }, {
+        default: O(() => [
+          y(o, {
+            modelValue: e.value.receiptName,
+            "onUpdate:modelValue": t[0] || (t[0] = (n) => e.value.receiptName = n),
+            label: "Receipt Payment Name",
+            "label-info": "Default receipt display will be 'TERMINAL_OMA'"
+          }, null, 8, ["modelValue"]),
+          I("div", Ma, [
+            y(o, {
+              modelValue: r.value,
+              "onUpdate:modelValue": t[1] || (t[1] = (n) => r.value = n),
+              label: "Fallback Card Types",
+              "label-info": "List of cards when fallback to reconcile dialog. Default VISA, MASTER"
+            }, null, 8, ["modelValue"]),
+            y(i, {
+              class: "ml-4",
+              icon: "add",
+              onClick: m
+            })
+          ]),
+          I("div", Aa, [
+            (g(!0), S(D, null, L(e.value.cardTypes, (n) => (g(), F(u, {
+              key: n,
+              label: n,
+              removable: !0,
+              onChipClosed: () => e.value.cardTypes.splice(e.value.cardTypes.indexOf(n), 1)
+            }, null, 8, ["label", "onChipClosed"]))), 128))
+          ]),
+          I("div", qa, [
+            l.value > -1 ? (g(), F(i, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => v(l.value)
+            }, null, 8, ["onclick"])) : U("", !0),
+            y(i, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), Da = { class: "flex items-end" }, $a = { class: "flex flex-wrap gap-8 items-center mt-4" }, Ea = { class: "flex mt-6 space-x-6" }, La = /* @__PURE__ */ h({
+  __name: "RevenueGateway",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(T) {
+    const p = T, a = G(() => p.terminal), b = _(), l = _(-1), r = _(), e = _({
+      receiptName: "",
+      ip: "",
+      cardTypes: []
+    }), d = () => {
+      e.value.receiptName = "", e.value.ip = "", e.value.cardTypes = [], l.value = -1;
+    }, c = () => {
+      var i;
+      if (!a.value.ecrIntegrations)
+        return d();
+      const s = a.value.ecrIntegrations, t = s.findIndex(
+        (u) => u && u.gateway && u.gateway === "Revenue"
+      );
+      if (t === -1)
+        return d();
+      l.value = t;
+      const o = s.at(t);
+      o.gateway === "Revenue" && o.config && (e.value = {
+        receiptName: o.receiptName ?? "",
+        ip: o.config.ip ?? "",
+        cardTypes: ((i = o.dialogConfig) == null ? void 0 : i.cardTypes) ?? []
+      });
+    };
+    A(a, c), q(c);
+    async function v(s) {
+      var t;
+      (t = a.value.ecrIntegrations) == null || t.splice(s, 1), p.onUpdate(a.value);
+    }
+    async function m() {
+      e.value.cardTypes.push(r.value), r.value = "";
+    }
+    return (s, t) => {
+      const o = f("FmTextField"), i = f("FmButton"), u = f("FmChip"), C = f("FmForm");
+      return g(), F(C, {
+        ref: b.value,
+        class: "flex flex-col gap-16 w-[500px]",
+        onValidationSuccess: t[3] || (t[3] = () => {
+          var x, E;
+          const n = {
+            type: "tcp",
+            ip: e.value.ip
+          };
+          l.value > -1 ? a.value.ecrIntegrations[l.value] = {
+            gateway: "Revenue",
+            config: n,
+            receiptName: e.value.receiptName,
+            dialogConfig: {
+              ...(E = (x = a.value.ecrIntegrations) == null ? void 0 : x[l.value]) == null ? void 0 : E.dialogConfig,
+              cardTypes: e.value.cardTypes
+            }
+          } : (a.value.ecrIntegrations || (a.value.ecrIntegrations = []), a.value.ecrIntegrations.push({
+            gateway: "Revenue",
+            config: n,
+            receiptName: e.value.receiptName,
+            dialogConfig: {
+              cardTypes: e.value.cardTypes
+            }
+          })), p.onUpdate(a.value);
+        })
+      }, {
+        default: O(() => [
+          y(o, {
+            modelValue: e.value.ip,
+            "onUpdate:modelValue": t[0] || (t[0] = (n) => e.value.ip = n),
+            label: "Terminal IP Address",
+            "label-info": "Terminal WiFi IP with optional port, e.g. 192.168.1.50:8080 (defaults to port 8080)",
+            rules: N(X)(N(Z).string().min(1))
+          }, null, 8, ["modelValue", "rules"]),
+          y(o, {
+            modelValue: e.value.receiptName,
+            "onUpdate:modelValue": t[1] || (t[1] = (n) => e.value.receiptName = n),
+            label: "Receipt Payment Name",
+            "label-info": "Default receipt display will be 'TERMINAL_REVENUE'"
+          }, null, 8, ["modelValue"]),
+          I("div", Da, [
+            y(o, {
+              modelValue: r.value,
+              "onUpdate:modelValue": t[2] || (t[2] = (n) => r.value = n),
+              label: "Fallback Card Types",
+              "label-info": "List of cards when fallback to reconcile dialog. Default VISA, MASTER"
+            }, null, 8, ["modelValue"]),
+            y(i, {
+              class: "ml-4",
+              icon: "add",
+              onClick: m
+            })
+          ]),
+          I("div", $a, [
+            (g(!0), S(D, null, L(e.value.cardTypes, (n) => (g(), F(u, {
+              key: n,
+              label: n,
+              removable: !0,
+              onChipClosed: () => e.value.cardTypes.splice(e.value.cardTypes.indexOf(n), 1)
+            }, null, 8, ["label", "onChipClosed"]))), 128))
+          ]),
+          I("div", Ea, [
+            l.value > -1 ? (g(), F(i, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => v(l.value)
+            }, null, 8, ["onclick"])) : U("", !0),
+            y(i, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), Ya = {
+  key: 0,
+  class: "flex items-center justify-center min-h-[80vh]"
+}, ja = { class: "flex mt-6 space-x-6" }, Ka = /* @__PURE__ */ h({
+  __name: "BeamGateway",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(T) {
+    const { isLoading: p, startAsyncCall: a } = J(), b = T, l = G(() => b.terminal), r = _(), e = _(), d = _(-1), c = _({
+      externalTerminalId: ""
+    }), v = () => {
+      c.value.externalTerminalId = "", d.value = -1;
+    }, m = () => {
+      if (a(async () => {
+        r.value = await fe.getRestaurantExternalTerminals(
+          b.terminal.referenceId,
+          "BEAM"
+        );
+      }), !b.terminal.ecrs)
+        return v();
+      const o = b.terminal.ecrs.findIndex((u) => u && u.gateway && u.gateway === "Beam");
+      if (o === -1)
+        return v();
+      d.value = o;
+      const i = b.terminal.ecrs.at(o);
+      i.gateway === "Beam" && i.config && (c.value = {
+        externalTerminalId: i.config.externalTerminalId
+      });
+    };
+    A(l, m), q(m);
+    const s = V(() => (r.value ?? []).map((o) => ({
+      label: o.status === "READY" ? o.name : `${o.name} (unpaired)`,
+      value: o._id
+    })));
+    async function t(o) {
+      var i;
+      (i = b.terminal.ecrs) == null || i.splice(o, 1), b.onUpdate(b.terminal);
+    }
+    return (o, i) => {
+      const u = f("FmCircularProgress"), C = f("FmSelect"), n = f("FmButton"), x = f("FmForm");
+      return N(p) ? (g(), S("div", Ya, [
+        y(u, { size: "xxl" })
+      ])) : (g(), F(x, {
+        key: 1,
+        ref: e.value,
+        class: "flex flex-col gap-16 w-[500px]",
+        onValidationSuccess: i[1] || (i[1] = () => {
+          d.value > -1 ? l.value.ecrs[d.value] = { gateway: "Beam", config: c.value } : (l.value.ecrs || (l.value.ecrs = []), l.value.ecrs.push({ gateway: "Beam", config: c.value })), b.onUpdate(l.value);
+        })
+      }, {
+        default: O(() => [
+          y(C, {
+            modelValue: c.value.externalTerminalId,
+            "onUpdate:modelValue": i[0] || (i[0] = (E) => c.value.externalTerminalId = E),
+            label: "External Terminal",
+            items: s.value,
+            rules: N(X)(N(Z).string().min(1, "External terminal is required"))
+          }, null, 8, ["modelValue", "items", "rules"]),
+          I("div", ja, [
+            d.value > -1 ? (g(), F(n, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => t(d.value)
+            }, null, 8, ["onclick"])) : U("", !0),
+            y(n, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512));
+    };
+  }
+}), Ha = {
+  key: 0,
+  class: "flex items-center justify-center min-h-[80vh]"
+}, za = { class: "flex mt-6 space-x-6" }, Qa = /* @__PURE__ */ h({
+  __name: "BriGateway",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(T) {
+    const { isLoading: p, startAsyncCall: a } = J(), b = T, l = G(() => b.terminal), r = _(), e = _(), d = _(-1), c = _({
+      externalTerminalId: ""
+    }), v = () => {
+      c.value.externalTerminalId = "", d.value = -1;
+    }, m = () => {
+      if (a(async () => {
+        r.value = await fe.getRestaurantExternalTerminals(
+          b.terminal.referenceId,
+          "BRI"
+        );
+      }), !b.terminal.ecrs)
+        return v();
+      const i = b.terminal.ecrs.findIndex((C) => C && C.gateway && C.gateway === "Bri");
+      if (i === -1)
+        return v();
+      d.value = i;
+      const u = b.terminal.ecrs.at(i);
+      u.gateway === "Bri" && u.config && (c.value = {
+        externalTerminalId: u.config.externalTerminalId
+      });
+    };
+    A(l, m), q(m);
+    const s = V(() => (r.value ?? []).filter((i) => i.status === "READY").map((i) => ({ label: i.name, value: i._id }))), t = V(() => {
+      if (s.value.length === 0)
+        return "Please pair one BRI terminal under External Terminals before applying here.";
+    });
+    async function o(i) {
+      var u;
+      (u = b.terminal.ecrs) == null || u.splice(i, 1), b.onUpdate(b.terminal);
+    }
+    return (i, u) => {
+      const C = f("FmCircularProgress"), n = f("FmSelect"), x = f("FmButton"), E = f("FmForm");
+      return N(p) ? (g(), S("div", Ha, [
+        y(C, { size: "xxl" })
+      ])) : (g(), F(E, {
+        key: 1,
+        ref: e.value,
+        class: "flex flex-col gap-16 w-[500px]",
+        onValidationSuccess: u[1] || (u[1] = () => {
+          d.value > -1 ? l.value.ecrs[d.value] = { gateway: "Bri", config: c.value } : (l.value.ecrs || (l.value.ecrs = []), l.value.ecrs.push({ gateway: "Bri", config: c.value })), b.onUpdate(l.value);
+        })
+      }, {
+        default: O(() => [
+          y(n, {
+            modelValue: c.value.externalTerminalId,
+            "onUpdate:modelValue": u[0] || (u[0] = (w) => c.value.externalTerminalId = w),
+            label: "External Terminal",
+            items: s.value,
+            "helper-text": t.value,
+            rules: N(X)(N(Z).string().min(1, "External terminal is required"))
+          }, null, 8, ["modelValue", "items", "helper-text", "rules"]),
+          I("div", za, [
+            d.value > -1 ? (g(), F(x, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => o(d.value)
+            }, null, 8, ["onclick"])) : U("", !0),
+            y(x, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512));
+    };
+  }
+}), Ja = { class: "flex items-end" }, Wa = { class: "flex flex-wrap gap-8 items-center mt-4" }, Xa = { class: "flex mt-6 space-x-6" }, Za = /* @__PURE__ */ h({
+  __name: "PbbGateway",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(T) {
+    const p = T, a = G(() => p.terminal), b = _(), l = _(-1), r = _(), e = _({
+      ip: "",
+      receiptName: "",
+      cardTypes: []
+    }), d = () => {
+      e.value.ip = "", e.value.receiptName = "", e.value.cardTypes = [], l.value = -1;
+    }, c = () => {
+      var i;
+      if (!a.value.ecrIntegrations)
+        return d();
+      const s = a.value.ecrIntegrations, t = s.findIndex((u) => u && u.gateway && u.gateway === "Pbb");
+      if (t === -1)
+        return d();
+      l.value = t;
+      const o = s.at(t);
+      o.gateway === "Pbb" && o.config && (e.value = {
+        ip: o.config.ip ?? "",
+        receiptName: o.receiptName ?? "",
+        cardTypes: ((i = o.dialogConfig) == null ? void 0 : i.cardTypes) ?? []
+      });
+    };
+    A(a, c), q(c);
+    async function v(s) {
+      var t;
+      (t = a.value.ecrIntegrations) == null || t.splice(s, 1), p.onUpdate(a.value);
+    }
+    async function m() {
+      e.value.cardTypes.push(r.value), r.value = "";
+    }
+    return (s, t) => {
+      const o = f("FmTextField"), i = f("FmButton"), u = f("FmChip"), C = f("FmForm");
+      return g(), F(C, {
+        ref: b.value,
+        class: "flex flex-col gap-16 w-[500px]",
+        onValidationSuccess: t[3] || (t[3] = () => {
+          var n, x;
+          l.value > -1 ? a.value.ecrIntegrations[l.value] = {
+            gateway: "Pbb",
+            config: { ip: e.value.ip },
+            receiptName: e.value.receiptName,
+            dialogConfig: {
+              ...(x = (n = a.value.ecrIntegrations) == null ? void 0 : n[l.value]) == null ? void 0 : x.dialogConfig,
+              cardTypes: e.value.cardTypes
+            }
+          } : (a.value.ecrIntegrations || (a.value.ecrIntegrations = []), a.value.ecrIntegrations.push({
+            gateway: "Pbb",
+            config: { ip: e.value.ip },
+            receiptName: e.value.receiptName,
+            dialogConfig: {
+              cardTypes: e.value.cardTypes
+            }
+          })), p.onUpdate(a.value);
+        })
+      }, {
+        default: O(() => [
+          y(o, {
+            modelValue: e.value.ip,
+            "onUpdate:modelValue": t[0] || (t[0] = (n) => e.value.ip = n),
+            label: "IP Address"
+          }, null, 8, ["modelValue"]),
+          y(o, {
+            modelValue: e.value.receiptName,
+            "onUpdate:modelValue": t[1] || (t[1] = (n) => e.value.receiptName = n),
+            label: "Receipt Payment Name",
+            "label-info": "Default receipt display will be 'TERMINAL_PBB'"
+          }, null, 8, ["modelValue"]),
+          I("div", Ja, [
+            y(o, {
+              modelValue: r.value,
+              "onUpdate:modelValue": t[2] || (t[2] = (n) => r.value = n),
+              label: "Fallback Card Types",
+              "label-info": "List of cards when fallback to reconcile dialog. Default VISA, MASTER"
+            }, null, 8, ["modelValue"]),
+            y(i, {
+              class: "ml-4",
+              icon: "add",
+              onClick: m
+            })
+          ]),
+          I("div", Wa, [
+            (g(!0), S(D, null, L(e.value.cardTypes, (n) => (g(), F(u, {
+              key: n,
+              label: n,
+              removable: !0,
+              onChipClosed: () => e.value.cardTypes.splice(e.value.cardTypes.indexOf(n), 1)
+            }, null, 8, ["label", "onChipClosed"]))), 128))
+          ]),
+          I("div", Xa, [
+            l.value > -1 ? (g(), F(i, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => v(l.value)
+            }, null, 8, ["onclick"])) : U("", !0),
+            y(i, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), et = { class: "flex items-center" }, at = { class: "w-[260px] self-start" }, tt = { class: "flex-1" }, lt = /* @__PURE__ */ h({
+  __name: "EcrGateway",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(T) {
+    var d;
+    const p = T, a = [
+      {
+        label: "FeedMe Terminal",
+        value: "terminal",
+        render: Ze
+      },
+      {
+        label: "GHL Terminal",
+        value: "ghl",
+        render: aa,
+        region: [P.F_COUNTRY.enum.MY]
+      },
+      {
+        label: "GHL2 Terminal",
+        value: "ghl2",
+        render: wa,
+        region: [P.F_COUNTRY.enum.MY]
+      },
+      {
+        label: "ITB Maybank Terminal",
+        value: "mb-itb",
+        render: oa,
+        region: [P.F_COUNTRY.enum.MY]
+      },
+      {
+        label: "PMA Maybank Terminal",
+        value: "mb-pma",
+        render: ua,
+        region: [P.F_COUNTRY.enum.MY]
+      },
+      {
+        label: "Paysys Maybank Terminal",
+        value: "mb-paysys",
+        render: pa,
+        region: [P.F_COUNTRY.enum.MY]
+      },
+      {
+        label: "Nets Terminal",
+        value: "nets",
+        render: ga,
+        region: [P.F_COUNTRY.enum.SG]
+      },
+      {
+        label: "KBank Terminal",
+        value: "kbank",
+        render: Ia,
+        region: [P.F_COUNTRY.enum.TH]
+      },
+      {
+        label: "GHL Terminal",
+        value: "ghl3",
+        render: Na,
+        region: [P.F_COUNTRY.enum.TH]
+      },
+      {
+        label: "Paysys HLBB Terminal",
+        value: "hlbb",
+        render: ha,
+        region: [P.F_COUNTRY.enum.MY]
+      },
+      {
+        label: "GPAP Terminal",
+        value: "globalpayments",
+        render: Oa,
+        region: [P.F_COUNTRY.enum.SG]
+      },
+      {
+        label: "OMA Terminal",
+        value: "oma",
+        render: Ga,
+        region: [P.F_COUNTRY.enum.PK]
+      },
+      {
+        label: "Revenue PBB Terminal",
+        value: "revenue",
+        render: La,
+        region: [P.F_COUNTRY.enum.MY]
+      },
+      {
+        label: "PBB Terminal",
+        value: "pbb",
+        render: Za,
+        region: [P.F_COUNTRY.enum.MY]
+      },
+      {
+        label: "Beam Terminal",
+        value: "beam",
+        render: Ka,
+        region: [P.F_COUNTRY.enum.TH]
+      },
+      {
+        label: "BRI Terminal",
+        value: "bri",
+        render: Qa,
+        region: [P.F_COUNTRY.enum.ID]
+      }
+    ], b = V(() => a.find((c) => c.value === e.value)), l = ie().currentCountry, r = V(() => a.filter(
+      (c) => !c.region || c.region.includes(l.value ?? P.F_COUNTRY.enum.MY)
+    )), { gatewayTab: e } = oe({
+      gatewayTab: (d = r.value[0]) == null ? void 0 : d.value
+    });
+    return (c, v) => {
+      var s;
+      const m = f("FmTabs");
+      return g(), S("div", et, [
+        I("div", at, [
+          y(m, {
+            "model-value": N(e),
+            "onUpdate:modelValue": v[0] || (v[0] = (t) => ae(e) ? e.value = t : null),
+            class: "mb-6",
+            vertical: !0,
+            items: r.value,
+            "show-more-at": Number.POSITIVE_INFINITY
+          }, null, 8, ["model-value", "items", "show-more-at"])
+        ]),
+        I("div", tt, [
+          N(e) ? (g(), F(te((s = b.value) == null ? void 0 : s.render), le(ne({ key: 0 }, {
+            terminal: p.terminal,
+            onUpdate: p.onUpdate
+          })), null, 16)) : U("", !0)
+        ])
+      ]);
+    };
+  }
+}), nt = { class: "flex mt-6 space-x-6" }, ot = /* @__PURE__ */ h({
+  __name: "PromptPayGateway",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(T) {
+    const p = T, a = G(() => p.terminal), b = _(), l = _(-1), r = _({
+      account: "",
+      receiptName: ""
+    }), e = () => {
+      r.value.account = "", r.value.receiptName = "", l.value = -1;
+    }, d = () => {
+      if (!a.value.qrIntegrations)
+        return e();
+      const v = a.value.qrIntegrations, m = v.findIndex((t) => t && t.gateway && t.gateway === "PROMPTPAY");
+      if (m === -1)
+        return e();
+      l.value = m;
+      const s = v.at(m);
+      s.gateway === "PROMPTPAY" && s.config && (r.value = {
+        account: s.config.account ?? "",
+        receiptName: s.receiptName ?? ""
+      });
+    };
+    A(a, d), q(d);
+    async function c(v) {
+      var m;
+      (m = a.value.qrIntegrations) == null || m.splice(v, 1), p.onUpdate(a.value);
+    }
+    return (v, m) => {
+      const s = f("FmTextField"), t = f("FmButton"), o = f("FmForm");
+      return g(), F(o, {
+        ref: b.value,
+        class: "flex flex-col gap-16 w-[500px]",
+        onValidationSuccess: m[2] || (m[2] = () => {
+          l.value > -1 ? a.value.qrIntegrations[l.value] = { gateway: "PROMPTPAY", config: { account: r.value.account }, receiptName: r.value.receiptName } : (a.value.qrIntegrations || (a.value.qrIntegrations = []), a.value.qrIntegrations.push({ gateway: "PROMPTPAY", config: { account: r.value.account }, receiptName: r.value.receiptName })), p.onUpdate(a.value);
+        })
+      }, {
+        default: O(() => [
+          y(s, {
+            modelValue: r.value.account,
+            "onUpdate:modelValue": m[0] || (m[0] = (i) => r.value.account = i),
+            label: "Thai Phone Number / Thai Naitonal ID",
+            "label-info": "Thai Phone Number can be prefixed with 66 or 0 will be fine both will works well."
+          }, null, 8, ["modelValue"]),
+          y(s, {
+            modelValue: r.value.receiptName,
+            "onUpdate:modelValue": m[1] || (m[1] = (i) => r.value.receiptName = i),
+            label: "Receipt Payment Name",
+            "label-info": "Default receipt display will be 'TERMINAL_MAYBANK'"
+          }, null, 8, ["modelValue"]),
+          I("div", nt, [
+            l.value > -1 ? (g(), F(t, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => c(l.value)
+            }, null, 8, ["onclick"])) : U("", !0),
+            y(t, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), rt = { class: "flex items-center" }, it = { class: "w-[260px] self-start" }, st = { class: "flex-1" }, ut = /* @__PURE__ */ h({
+  __name: "QrGateway",
+  props: {
+    terminal: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(T) {
+    var d;
+    const p = T, a = [
+      {
+        label: "PromptPay",
+        value: "promptpay",
+        render: ot,
+        region: [P.F_COUNTRY.enum.TH]
+      }
+    ], b = V(() => a.find((c) => c.value === e.value)), l = ie().currentCountry, r = V(() => a.filter((c) => !c.region || c.region.includes(l.value ?? P.F_COUNTRY.enum.MY))), { gatewayTab: e } = oe({
+      gatewayTab: (d = r.value[0]) == null ? void 0 : d.value
+    });
+    return (c, v) => {
+      var s;
+      const m = f("FmTabs");
+      return g(), S("div", rt, [
+        I("div", it, [
+          y(m, {
+            "model-value": N(e),
+            "onUpdate:modelValue": v[0] || (v[0] = (t) => ae(e) ? e.value = t : null),
+            class: "mb-6",
+            vertical: !0,
+            items: r.value
+          }, null, 8, ["model-value", "items"])
+        ]),
+        I("div", st, [
+          N(e) ? (g(), F(te((s = b.value) == null ? void 0 : s.render), le(ne({ key: 0 }, {
+            terminal: p.terminal,
+            onUpdate: p.onUpdate
+          })), null, 16)) : U("", !0)
+        ])
+      ]);
+    };
+  }
+}), kt = /* @__PURE__ */ h({
+  __name: "TerminalSetting",
+  props: {
+    terminalId: {
+      type: String,
+      required: !0
+    }
+  },
+  setup(T) {
+    const p = T, { tab: a } = oe({
+      tab: "information"
+    }), { isLoading: b, startAsyncCall: l } = J(!0), r = Ie(), e = me(), d = we(), { t: c } = re(), v = _();
+    async function m(w, k) {
+      l(async () => {
+        try {
+          await j.updateById(p.terminalId, {
+            name: w.name,
+            status: w.status,
+            ecrs: w.ecrs ?? [],
+            gateways: w.gateways ?? [],
+            ecrIntegrations: w.ecrIntegrations ?? [],
+            qrIntegrations: w.qrIntegrations ?? [],
+            ...k ? { paymentCheckouts: k } : {}
+          }), v.value = await j.readById(p.terminalId), e.open({
+            type: "success",
+            message: "Terminal updated successfully"
+          });
+        } catch (B) {
+          e.open({
+            type: "error",
+            title: "Error occurs when update terminal",
+            message: Q(B)
+          });
+        }
+      });
+    }
+    const s = [
+      {
+        label: "Information",
+        value: "information",
+        icon: "overview",
+        render: Ve
+      },
+      {
+        label: "Setting Request",
+        value: "settings",
+        icon: "settings",
+        render: Ee,
+        onlyFor: ["TERMINAL"]
+      },
+      {
+        label: "SoftPos Gateway",
+        value: "softpos",
+        icon: "payment",
+        render: Je
+      },
+      {
+        label: "ECR Gateway",
+        value: "ecr",
+        icon: "point_of_sale",
+        render: lt,
+        onlyFor: ["POS", "KIOSK"]
+      },
+      {
+        label: "QR Gateway",
+        value: "qr",
+        icon: "qr_code",
+        render: ut,
+        onlyFor: ["POS", "KIOSK"]
+      },
+      {
+        label: "Payment Checkout",
+        value: "payment-checkout",
+        icon: "tune",
+        render: Ne,
+        onlyFor: ["KIOSK", "POS"]
+      }
+    ], t = ve.FdoTerminalTemplateDeviceType.options, o = V(
+      () => {
+        var w;
+        return t.includes(((w = v.value) == null ? void 0 : w.deviceType) ?? "");
+      }
+    );
+    function i() {
+      const w = v.value;
+      d.open({
+        title: "Save as Template",
+        closeButton: !0,
+        overlay: !0,
+        contentComponent: Re
+      }).onPrimary(async (k) => {
+        d.close();
+        try {
+          await pe.create({
+            name: k.name,
+            description: k.description,
+            businessId: w.restaurant.businessId,
+            deviceType: w.deviceType,
+            isDefault: k.isDefault,
+            settings: {
+              ecrs: (w.ecrs ?? []).map(({ gateway: B }) => ({ gateway: B })),
+              ecrIntegrations: (w.ecrIntegrations ?? []).map(
+                ({ gateway: B }) => ({ gateway: B })
+              ),
+              paymentCheckouts: w.paymentCheckouts ?? []
+            }
+          }), e.open({
+            type: "success",
+            message: "Setting template created successfully."
+          });
+        } catch (B) {
+          e.open({
+            type: "error",
+            title: "Error occurs when create setting template",
+            message: Q(B)
+          });
+        }
+      });
+    }
+    async function u() {
+      const w = v.value, k = await pe.readByBusiness(
+        w.restaurant.businessId,
+        w.deviceType
+      );
+      d.open({
+        title: "Apply Template",
+        closeButton: !0,
+        overlay: !0,
+        contentComponent: qe,
+        contentComponentProps: { templates: k }
+      }).onPrimary(async (B) => {
+        d.close(), xe(
+          d,
+          "Apply Template",
+          c("payment.terminal_template.scope_info"),
+          async () => {
+            l(async () => {
+              try {
+                await j.applyTemplate(p.terminalId, B.templateId), v.value = await j.readById(p.terminalId), e.open({
+                  type: "success",
+                  message: "Setting template applied successfully."
+                });
+              } catch ($) {
+                e.open({
+                  type: "error",
+                  title: "Error occurs when apply setting template",
+                  message: Q($)
+                });
+              }
+            });
+          }
+        );
+      });
+    }
+    const C = V(
+      () => o.value ? [
+        { label: "Save as Template", fn: i },
+        { label: "Apply Template", fn: u }
+      ] : []
+    );
+    ie().currentCountry;
+    const n = V(() => {
+      var w;
+      return (w = s.find((k) => k.value === a.value)) == null ? void 0 : w.render;
+    });
+    async function x() {
+      l(async () => {
+        v.value = await j.readById(p.terminalId);
+      });
+    }
+    const E = V(() => s.filter(
+      (w) => {
+        var k;
+        return !w.onlyFor || w.onlyFor.includes(((k = v.value) == null ? void 0 : k.deviceType) ?? "");
+      }
+    ));
+    return q(x), (w, k) => {
+      var $, K;
+      const B = f("FmTabs");
+      return g(), F(Fe, {
+        title: `${($ = v.value) == null ? void 0 : $.deviceType} (${(K = v.value) == null ? void 0 : K._id})`,
+        loading: N(b),
+        actions: C.value,
+        onBack: N(r).back
+      }, {
+        default: O(() => [
+          y(B, {
+            "model-value": N(a),
+            "onUpdate:modelValue": k[0] || (k[0] = (H) => ae(a) ? a.value = H : null),
+            class: "mb-6",
+            items: E.value
+          }, null, 8, ["model-value", "items"]),
+          N(a) ? (g(), F(te(n.value), le(ne({ key: 0 }, {
+            terminal: v.value,
+            onUpdate: m
+          })), null, 16)) : U("", !0)
+        ]),
+        _: 1
+      }, 8, ["title", "loading", "actions", "onBack"]);
+    };
+  }
+});
+export {
+  kt as default
+};