@feedmepos/mf-payment 1.5.80-dev → 1.5.81-dev

package/dist/PayoutAccountSetting-4S54z0zZ.js

@@ -0,0 +1,1814 @@
+import { defineComponent as D, resolveComponent as y, openBlock as g, createElementBlock as O, Fragment as j, createElementVNode as s, createVNode as a, withCtx as k, createTextVNode as P, toDisplayString as M, unref as r, reactive as de, ref as C, createBlock as w, watch as te, computed as Y, isRef as W, createCommentVNode as q, h as H, onMounted as re, resolveDynamicComponent as ne, normalizeProps as ae, mergeProps as oe } from "vue";
+import { p as G } from "./index-DZkJCRc2.js";
+import { u as X, e as $ } from "./index-BP3TUn8a.js";
+import { _ as pe } from "./Layout.vue_vue_type_script_setup_true_lang-BKIvkgA_.js";
+import { useRouter as ye } from "vue-router";
+import { u as ee } from "./index-BzyAnnC6.js";
+import { _ as Z } from "./DocumentViewer.vue_vue_type_script_setup_true_lang-CmWaoyuX.js";
+import { h as be } from "./moment-h96o7c8I.js";
+import { useDialogChild as fe, useDialog as ie, useSnackbar as J, components as ve } from "@feedmepos/ui-library";
+import { P as Q } from "./PDFViewer-CIPPbzWD.js";
+import { u as z } from "./error-K1CakhA9.js";
+import { P as ge } from "./payout-account-Bf74kiQM.js";
+import { d as se } from "./index-B0DzMdAx.js";
+import { s as L, o as Fe, z as A, a as N } from "./validator-CTlVogBQ.js";
+import { _ as xe } from "./TextInputDialog.vue_vue_type_script_setup_true_lang-BvGYVca0.js";
+import { useCoreStore as me } from "@feedmepos/mf-common";
+const ke = { class: "flex gap-16 mb-6" }, Ve = { class: "flex gap-16 mb-6" }, we = /* @__PURE__ */ D({
+  __name: "Information",
+  props: {
+    payoutAccount: {
+      type: Object,
+      required: !0
+    }
+  },
+  setup(n) {
+    return (u, e) => {
+      var m, f;
+      const b = y("FmCardHeader"), l = y("FmCardSection"), t = y("FmCard");
+      return g(), O(j, null, [
+        s("div", ke, [
+          a(t, {
+            horizontal: "",
+            class: "flex-1 p-6",
+            variant: "elevated"
+          }, {
+            default: k(() => [
+              a(l, { class: "flex flex-col gap-16 justify-between" }, {
+                default: k(() => [
+                  a(b, {
+                    class: "p-0",
+                    title: "Account Info",
+                    subtitle: ""
+                  }),
+                  a(l, { class: "p-0" }, {
+                    default: k(() => {
+                      var p, i, d, o, c;
+                      return [
+                        e[0] || (e[0] = s("b", null, "For", -1)),
+                        P(": " + M((i = (p = n.payoutAccount) == null ? void 0 : p.store) == null ? void 0 : i.event) + " ", 1),
+                        e[1] || (e[1] = s("br", null, null, -1)),
+                        e[2] || (e[2] = s("b", null, "Reference", -1)),
+                        P(": " + M((o = (d = n.payoutAccount) == null ? void 0 : d.store) == null ? void 0 : o.id), 1),
+                        e[3] || (e[3] = s("br", null, null, -1)),
+                        e[4] || (e[4] = s("b", null, "Business", -1)),
+                        P(": " + M((c = n.payoutAccount) == null ? void 0 : c.businessId), 1),
+                        e[5] || (e[5] = s("br", null, null, -1))
+                      ];
+                    }),
+                    _: 1
+                  })
+                ]),
+                _: 1
+              })
+            ]),
+            _: 1
+          }),
+          a(t, {
+            horizontal: "",
+            class: "flex-1 p-6",
+            variant: "elevated"
+          }, {
+            default: k(() => [
+              a(l, { class: "flex flex-col gap-16 justify-between" }, {
+                default: k(() => [
+                  a(b, {
+                    class: "p-0",
+                    title: "Key Person",
+                    subtitle: ""
+                  }),
+                  a(l, { class: "p-0" }, {
+                    default: k(() => {
+                      var p, i, d, o, c, v, F, S;
+                      return [
+                        e[6] || (e[6] = s("b", null, "Email", -1)),
+                        P(": " + M((d = (i = (p = n.payoutAccount) == null ? void 0 : p.store) == null ? void 0 : i.keyPerson) == null ? void 0 : d.email) + " ", 1),
+                        e[7] || (e[7] = s("br", null, null, -1)),
+                        e[8] || (e[8] = s("b", null, "Name", -1)),
+                        P(": " + M((v = (c = (o = n.payoutAccount) == null ? void 0 : o.store) == null ? void 0 : c.keyPerson) == null ? void 0 : v.name), 1),
+                        e[9] || (e[9] = s("br", null, null, -1)),
+                        e[10] || (e[10] = s("b", null, "Phone", -1)),
+                        P(": " + M((S = (F = n.payoutAccount) == null ? void 0 : F.store.keyPerson) == null ? void 0 : S.phone), 1),
+                        e[11] || (e[11] = s("br", null, null, -1))
+                      ];
+                    }),
+                    _: 1
+                  })
+                ]),
+                _: 1
+              })
+            ]),
+            _: 1
+          })
+        ]),
+        s("div", Ve, [
+          a(t, {
+            horizontal: "",
+            class: "flex-1 p-6",
+            variant: "elevated"
+          }, {
+            default: k(() => [
+              a(l, { class: "flex flex-col gap-16 justify-between" }, {
+                default: k(() => [
+                  a(b, {
+                    class: "p-0",
+                    title: "Status Info",
+                    subtitle: ""
+                  }),
+                  a(l, { class: "p-0" }, {
+                    default: k(() => {
+                      var p, i, d;
+                      return [
+                        e[12] || (e[12] = s("b", null, "Submission Date", -1)),
+                        P(": " + M((p = n.payoutAccount) != null && p.submissionDate ? r(be)(n.payoutAccount.submissionDate).format(
+                          "YYYY-MM-DD HH:mm:ss"
+                        ) : "—"), 1),
+                        e[13] || (e[13] = s("br", null, null, -1)),
+                        e[14] || (e[14] = s("b", null, "Status By", -1)),
+                        P(": " + M(((i = n.payoutAccount) == null ? void 0 : i.statusBy) ?? "—"), 1),
+                        e[15] || (e[15] = s("br", null, null, -1)),
+                        e[16] || (e[16] = s("b", null, "Status Reason", -1)),
+                        P(": " + M(((d = n.payoutAccount) == null ? void 0 : d.statusReason) ?? "—"), 1),
+                        e[17] || (e[17] = s("br", null, null, -1))
+                      ];
+                    }),
+                    _: 1
+                  })
+                ]),
+                _: 1
+              })
+            ]),
+            _: 1
+          })
+        ]),
+        e[18] || (e[18] = s("p", { class: "fm-typo-en-body-lg-600 mb-6" }, "Exterior Photo", -1)),
+        a(Z, {
+          document: n.payoutAccount.store.exteriorPhoto,
+          "business-id": n.payoutAccount.businessId,
+          "restaurant-id": ((f = (m = n.payoutAccount) == null ? void 0 : m.store) == null ? void 0 : f.event) === "ORDERING" ? n.payoutAccount.store.id : void 0
+        }, null, 8, ["document", "business-id", "restaurant-id"])
+      ], 64);
+    };
+  }
+}), Ae = { class: "flex flex-col gap-8" }, Se = { class: "flex flex-col gap-8" }, Ne = { class: "flex justify-end mb-2" }, Ce = /* @__PURE__ */ D({
+  __name: "SettlementEditDialog",
+  props: {
+    initialValue: {
+      type: Object,
+      required: !0
+    },
+    bankNameOptions: {
+      type: Array,
+      required: !0
+    },
+    businessId: {
+      type: String,
+      required: !0
+    },
+    restaurantId: {
+      type: String,
+      default: void 0
+    }
+  },
+  setup(n) {
+    const u = n, { emitAction: e, emitData: b } = fe(), l = de({
+      companyName: u.initialValue.companyName,
+      regNo: u.initialValue.regNo,
+      bankName: u.initialValue.bankName,
+      bankHolderName: u.initialValue.bankHolderName,
+      bankAccountNumber: u.initialValue.bankAccountNumber,
+      ssm: u.initialValue.ssm,
+      bankStatement: u.initialValue.bankStatement
+    }), t = C(), m = C(), f = C(l.ssm ?? ""), p = C(l.bankStatement ?? ""), i = L().trim().min(1, "Company name is required"), d = L().trim().min(1, "Registration number is required"), o = L().trim().min(1, "Bank name is required"), c = L().trim().min(1, "Bank holder name is required"), v = L().trim().min(1, "Bank account number is required"), F = Fe({
+      companyName: i,
+      regNo: d,
+      bankName: o,
+      bankHolderName: c,
+      bankAccountNumber: v
+    }), S = () => {
+      const V = F.safeParse(l);
+      V.success && (b({
+        ...V.data,
+        ssm: l.ssm,
+        bankStatement: l.bankStatement,
+        newSSM: t.value,
+        newBankStatement: m.value
+      }), e("primary"));
+    };
+    async function U(V) {
+      const x = new FileReader();
+      return new Promise((h) => {
+        x.onload = (K) => {
+          var E;
+          h((E = K.target) == null ? void 0 : E.result);
+        }, x.readAsDataURL(V);
+      });
+    }
+    const I = async (V) => {
+      t.value = V, f.value = V ? await U(V) : "";
+    }, T = async (V) => {
+      m.value = V, p.value = V ? await U(V) : "";
+    }, R = () => {
+      t.value = void 0, f.value = "";
+    }, _ = () => {
+      m.value = void 0, p.value = "";
+    };
+    return (V, x) => {
+      const h = y("FmTextField"), K = y("FmSelect"), E = y("FmButton"), le = y("FmFormGroup"), ue = y("FmDropField"), ce = y("FmForm");
+      return g(), w(ce, {
+        class: "flex flex-col gap-16",
+        onValidationSuccess: S
+      }, {
+        default: k(() => [
+          x[9] || (x[9] = s("div", { class: "flex items-center my-2" }, [
+            s("hr", { class: "w-[80px] border-t border-gray-300" }),
+            s("span", { class: "text-left mx-6 text-gray-500" }, "Account"),
+            s("hr", { class: "flex-grow border-t border-gray-300" })
+          ], -1)),
+          a(h, {
+            modelValue: l.regNo,
+            "onUpdate:modelValue": x[0] || (x[0] = (B) => l.regNo = B),
+            label: "Registration Number",
+            "label-mark": "required",
+            "helper-text": "Registration Number must match uploaded SSM registration number.",
+            rules: r(A)(r(d)),
+            autofocus: ""
+          }, null, 8, ["modelValue", "rules"]),
+          a(h, {
+            modelValue: l.companyName,
+            "onUpdate:modelValue": x[1] || (x[1] = (B) => l.companyName = B),
+            label: "Company Name",
+            "label-mark": "required",
+            "helper-text": "Company Name must match uploaded SSM registration name.",
+            rules: r(A)(r(i))
+          }, null, 8, ["modelValue", "rules"]),
+          x[10] || (x[10] = s("div", { class: "flex items-center my-2" }, [
+            s("hr", { class: "w-[80px] border-t border-gray-300" }),
+            s("span", { class: "text-left mx-6 text-gray-500" }, "Bank"),
+            s("hr", { class: "flex-grow border-t border-gray-300" })
+          ], -1)),
+          a(K, {
+            modelValue: l.bankName,
+            "onUpdate:modelValue": x[2] || (x[2] = (B) => l.bankName = B),
+            label: "Bank",
+            "label-mark": "required",
+            items: u.bankNameOptions,
+            rules: r(A)(r(o))
+          }, null, 8, ["modelValue", "items", "rules"]),
+          a(h, {
+            modelValue: l.bankHolderName,
+            "onUpdate:modelValue": x[3] || (x[3] = (B) => l.bankHolderName = B),
+            label: "Bank Holder",
+            "label-mark": "required",
+            rules: r(A)(r(c))
+          }, null, 8, ["modelValue", "rules"]),
+          a(h, {
+            modelValue: l.bankAccountNumber,
+            "onUpdate:modelValue": x[4] || (x[4] = (B) => l.bankAccountNumber = B),
+            label: "Bank Account Number",
+            "label-mark": "required",
+            type: "number",
+            rules: r(A)(r(v))
+          }, null, 8, ["modelValue", "rules"]),
+          x[11] || (x[11] = s("div", { class: "flex items-center my-2" }, [
+            s("hr", { class: "w-[80px] border-t border-gray-300" }),
+            s("span", { class: "text-left mx-6 text-gray-500" }, "Document"),
+            s("hr", { class: "flex-grow border-t border-gray-300" })
+          ], -1)),
+          s("div", Ae, [
+            x[7] || (x[7] = s("p", { class: "fm-typo-en-body-md-500" }, "SSM (PDF)", -1)),
+            f.value ? (g(), w(le, {
+              key: 0,
+              modelValue: f.value,
+              "onUpdate:modelValue": x[5] || (x[5] = (B) => f.value = B),
+              label: "SSM"
+            }, {
+              default: k(() => [
+                a(Z, {
+                  document: f.value,
+                  "business-id": n.businessId,
+                  "restaurant-id": n.restaurantId
+                }, {
+                  default: k(({ src: B }) => [
+                    a(Q, {
+                      height: 300,
+                      pdf: B,
+                      "disable-text-layer": !0,
+                      "disable-annotation-layer": !0
+                    }, null, 8, ["pdf"])
+                  ]),
+                  _: 1
+                }, 8, ["document", "business-id", "restaurant-id"]),
+                a(E, {
+                  type: "button",
+                  variant: "tertiary",
+                  label: "Remove",
+                  size: "md",
+                  "prepend-icon": "delete",
+                  onClick: R
+                })
+              ]),
+              _: 1
+            }, 8, ["modelValue"])) : (g(), w(ue, {
+              key: 1,
+              accept: ".pdf",
+              onFileUpload: I
+            }))
+          ]),
+          s("div", Se, [
+            x[8] || (x[8] = s("p", { class: "fm-typo-en-body-md-500" }, "Bank Statement (PDF)", -1)),
+            p.value ? (g(), w(le, {
+              key: 0,
+              modelValue: p.value,
+              "onUpdate:modelValue": x[6] || (x[6] = (B) => p.value = B),
+              label: "Bank Statement"
+            }, {
+              default: k(() => [
+                a(Z, {
+                  document: p.value,
+                  "business-id": n.businessId,
+                  "restaurant-id": n.restaurantId
+                }, {
+                  default: k(({ src: B }) => [
+                    a(Q, {
+                      height: 300,
+                      pdf: B,
+                      "disable-text-layer": !0,
+                      "disable-annotation-layer": !0
+                    }, null, 8, ["pdf"])
+                  ]),
+                  _: 1
+                }, 8, ["document", "business-id", "restaurant-id"]),
+                a(E, {
+                  type: "button",
+                  variant: "tertiary",
+                  label: "Remove",
+                  size: "md",
+                  "prepend-icon": "delete",
+                  onClick: _
+                })
+              ]),
+              _: 1
+            }, 8, ["modelValue"])) : (g(), w(ue, {
+              key: 1,
+              accept: ".pdf",
+              onFileUpload: T
+            }))
+          ]),
+          s("div", Ne, [
+            a(E, {
+              type: "submit",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      });
+    };
+  }
+}), Ue = { class: "flex justify-end mb-6" }, Ie = { class: "flex gap-16 mb-6" }, Te = { class: "flex gap-16" }, De = { class: "flex-1" }, Re = { class: "flex-1" }, Pe = /* @__PURE__ */ D({
+  __name: "Settlement",
+  props: {
+    onUpdate: {
+      type: Function,
+      required: !0
+    },
+    payoutAccount: {
+      type: Object,
+      required: !0
+    }
+  },
+  setup(n) {
+    const u = n, e = C(!1), b = ie(), l = J(), t = ge.bankNameOptions(), m = () => {
+      var d, o, c, v, F, S, U, I, T, R;
+      return {
+        companyName: ((d = u.payoutAccount.store) == null ? void 0 : d.companyName) ?? "",
+        regNo: ((o = u.payoutAccount.store) == null ? void 0 : o.regNo) ?? "",
+        bankName: ((v = (c = u.payoutAccount.store) == null ? void 0 : c.bank) == null ? void 0 : v.name) ?? "",
+        bankHolderName: ((S = (F = u.payoutAccount.store) == null ? void 0 : F.bank) == null ? void 0 : S.holderName) ?? "",
+        bankAccountNumber: ((I = (U = u.payoutAccount.store) == null ? void 0 : U.bank) == null ? void 0 : I.accountNumber) ?? "",
+        ssm: ((T = u.payoutAccount.store) == null ? void 0 : T.ssm) ?? "",
+        bankStatement: ((R = u.payoutAccount.store) == null ? void 0 : R.bankStatement) ?? ""
+      };
+    }, f = async (d, o) => {
+      var F;
+      const c = (/* @__PURE__ */ new Date()).toISOString();
+      if (((F = u.payoutAccount.store) == null ? void 0 : F.event) === "ORDERING")
+        return await se.upload(
+          `restaurant/${u.payoutAccount.store.id}/documents/${d}/${c}.pdf`,
+          o,
+          u.payoutAccount.store.id
+        );
+      const v = u.payoutAccount.businessId || u.payoutAccount.store.id;
+      return await se.upload(
+        `business/${v}/documents/${d}/${c}.pdf`,
+        o
+      );
+    }, p = async (d) => {
+      if (!u.payoutAccount.store) return;
+      let o = u.payoutAccount.store.ssm;
+      d.newSSM && (o = await f("ssm", d.newSSM));
+      let c = u.payoutAccount.store.bankStatement;
+      d.newBankStatement && (c = await f(
+        "bankStatement",
+        d.newBankStatement
+      ));
+      const v = {
+        ...u.payoutAccount,
+        store: {
+          ...u.payoutAccount.store,
+          companyName: d.companyName,
+          regNo: d.regNo,
+          bank: {
+            ...u.payoutAccount.store.bank ?? {},
+            name: d.bankName,
+            holderName: d.bankHolderName,
+            accountNumber: d.bankAccountNumber
+          },
+          ssm: o,
+          bankStatement: c
+        }
+      };
+      try {
+        e.value = !0, await u.onUpdate(v), l.open({
+          type: "success",
+          title: "Settlement info updated successfully"
+        }), b.close();
+      } catch (F) {
+        l.open({
+          type: "error",
+          title: "Failed to update settlement info",
+          message: z(F)
+        });
+      } finally {
+        e.value = !1;
+      }
+    }, i = () => {
+      var d;
+      b.close(), b.open({
+        title: "Edit Settlement Info",
+        closeButton: !0,
+        overlay: !0,
+        contentComponent: Ce,
+        contentComponentProps: {
+          initialValue: m(),
+          bankNameOptions: t,
+          businessId: u.payoutAccount.businessId,
+          restaurantId: ((d = u.payoutAccount.store) == null ? void 0 : d.event) === "ORDERING" ? u.payoutAccount.store.id : void 0
+        }
+      }).onPrimary((o) => {
+        p(o);
+      });
+    };
+    return (d, o) => {
+      var U, I, T, R;
+      const c = y("FmButton"), v = y("FmCardHeader"), F = y("FmCardSection"), S = y("FmCard");
+      return g(), O(j, null, [
+        s("div", Ue, [
+          a(c, {
+            variant: "primary",
+            label: "Edit Settlement Info",
+            loading: e.value,
+            onclick: i
+          }, null, 8, ["loading"])
+        ]),
+        s("div", Ie, [
+          a(S, {
+            horizontal: "",
+            class: "flex-1 p-6",
+            variant: "elevated"
+          }, {
+            default: k(() => [
+              a(F, { class: "flex flex-col gap-16 justify-between" }, {
+                default: k(() => [
+                  a(v, {
+                    class: "p-0",
+                    title: "Company Info",
+                    subtitle: ""
+                  }),
+                  a(F, { class: "p-0" }, {
+                    default: k(() => {
+                      var _, V;
+                      return [
+                        o[0] || (o[0] = s("b", null, "Name", -1)),
+                        P(": " + M((_ = n.payoutAccount) == null ? void 0 : _.store.companyName), 1),
+                        o[1] || (o[1] = s("br", null, null, -1)),
+                        o[2] || (o[2] = s("b", null, "Registration Number", -1)),
+                        P(": " + M((V = n.payoutAccount) == null ? void 0 : V.store.regNo), 1),
+                        o[3] || (o[3] = s("br", null, null, -1))
+                      ];
+                    }),
+                    _: 1
+                  })
+                ]),
+                _: 1
+              })
+            ]),
+            _: 1
+          }),
+          a(S, {
+            horizontal: "",
+            class: "flex-1 p-6",
+            variant: "elevated"
+          }, {
+            default: k(() => [
+              a(F, { class: "flex flex-col gap-16 justify-between" }, {
+                default: k(() => [
+                  a(v, {
+                    class: "p-0",
+                    title: "Bank Info",
+                    subtitle: ""
+                  }),
+                  a(F, { class: "p-0" }, {
+                    default: k(() => {
+                      var _, V, x, h, K, E;
+                      return [
+                        o[4] || (o[4] = s("b", null, "Bank", -1)),
+                        P(": " + M((V = (_ = n.payoutAccount) == null ? void 0 : _.store.bank) == null ? void 0 : V.name), 1),
+                        o[5] || (o[5] = s("br", null, null, -1)),
+                        o[6] || (o[6] = s("b", null, "Name", -1)),
+                        P(": " + M((h = (x = n.payoutAccount) == null ? void 0 : x.store.bank) == null ? void 0 : h.holderName), 1),
+                        o[7] || (o[7] = s("br", null, null, -1)),
+                        o[8] || (o[8] = s("b", null, "Number", -1)),
+                        P(": " + M((E = (K = n.payoutAccount) == null ? void 0 : K.store.bank) == null ? void 0 : E.accountNumber), 1)
+                      ];
+                    }),
+                    _: 1
+                  })
+                ]),
+                _: 1
+              })
+            ]),
+            _: 1
+          })
+        ]),
+        s("div", Te, [
+          s("div", De, [
+            o[9] || (o[9] = s("p", { class: "fm-typo-en-body-lg-600 mb-6" }, "SSM", -1)),
+            a(Z, {
+              "business-id": n.payoutAccount.businessId,
+              "restaurant-id": ((I = (U = n.payoutAccount) == null ? void 0 : U.store) == null ? void 0 : I.event) === "ORDERING" ? n.payoutAccount.store.id : void 0,
+              document: n.payoutAccount.store.ssm
+            }, {
+              default: k(({ src: _ }) => [
+                a(Q, {
+                  pdf: _,
+                  "disable-text-layer": !0,
+                  "disable-annotation-layer": !0
+                }, null, 8, ["pdf"])
+              ]),
+              _: 1
+            }, 8, ["business-id", "restaurant-id", "document"])
+          ]),
+          s("div", Re, [
+            o[10] || (o[10] = s("p", { class: "fm-typo-en-body-lg-600 mb-6" }, "Bank Statement", -1)),
+            a(Z, {
+              "business-id": n.payoutAccount.businessId,
+              "restaurant-id": ((R = (T = n.payoutAccount) == null ? void 0 : T.store) == null ? void 0 : R.event) === "ORDERING" ? n.payoutAccount.store.id : void 0,
+              document: n.payoutAccount.store.bankStatement
+            }, {
+              default: k(({ src: _ }) => [
+                a(Q, {
+                  pdf: _,
+                  "disable-text-layer": !0,
+                  "disable-annotation-layer": !0
+                }, null, 8, ["pdf"])
+              ]),
+              _: 1
+            }, 8, ["business-id", "restaurant-id", "document"])
+          ])
+        ])
+      ], 64);
+    };
+  }
+}), _e = /* @__PURE__ */ D({
+  __name: "RateInput",
+  props: {
+    data: {},
+    onChange: { type: Function }
+  },
+  setup(n) {
+    const u = n, e = C(u.data.toString());
+    return te(e, (b) => {
+      u.onChange(parseFloat(b));
+    }), (b, l) => {
+      const t = y("FmTextField");
+      return g(), w(t, {
+        inputmode: "decimal",
+        modelValue: e.value,
+        "onUpdate:modelValue": l[0] || (l[0] = (m) => e.value = m)
+      }, {
+        append: k(() => [...l[1] || (l[1] = [
+          P("%", -1)
+        ])]),
+        _: 1
+      }, 8, ["modelValue"]);
+    };
+  }
+}), Be = /* @__PURE__ */ D({
+  __name: "TPlusInput",
+  props: {
+    data: {},
+    onChange: { type: Function }
+  },
+  setup(n) {
+    const u = n, e = C(u.data.toString());
+    return te(e, (b) => {
+      u.onChange(parseInt(b));
+    }), (b, l) => {
+      const t = y("FmTextField");
+      return g(), w(t, {
+        inputmode: "numeric",
+        modelValue: e.value,
+        "onUpdate:modelValue": l[0] || (l[0] = (m) => e.value = m)
+      }, null, 8, ["modelValue"]);
+    };
+  }
+}), Me = /* @__PURE__ */ D({
+  __name: "MinimumFeeInput",
+  props: {
+    data: {},
+    onChange: { type: Function }
+  },
+  setup(n) {
+    const u = n, e = C(u.data.toString());
+    return te(e, (b) => {
+      u.onChange(parseFloat(b));
+    }), (b, l) => {
+      const t = y("FmTextField");
+      return g(), w(t, {
+        inputmode: "numeric",
+        modelValue: e.value,
+        "onUpdate:modelValue": l[0] || (l[0] = (m) => e.value = m)
+      }, {
+        prepend: k(() => [...l[1] || (l[1] = [
+          P("$", -1)
+        ])]),
+        _: 1
+      }, 8, ["modelValue"]);
+    };
+  }
+}), $e = { class: "flex gap-16 mt-6" }, qe = { class: "flex-1" }, he = { class: "flex-1" }, Ee = { class: "my-6 w-full flex justify-end" }, Oe = { class: "w-[320px]" }, Ge = /* @__PURE__ */ D({
+  __name: "PaymentStatus",
+  props: {
+    onUpdate: {
+      type: Function,
+      required: !0
+    },
+    payoutAccount: {
+      type: Object,
+      required: !0
+    }
+  },
+  setup(n) {
+    const u = n, e = C(!1), b = J(), l = ie(), t = async (o) => {
+      try {
+        e.value = !0, await u.onUpdate(o), b.open({
+          type: "success",
+          title: "Payout account update succesfully"
+        });
+      } catch (c) {
+        b.open({
+          type: "error",
+          title: "Error occurs when updating payout account",
+          message: z(c)
+        });
+      } finally {
+        e.value = !1;
+      }
+    }, m = async () => {
+      l.close(), l.open({
+        title: "Rejection Reason",
+        closeButton: !0,
+        overlay: !0,
+        contentComponent: xe,
+        contentComponentProps: {
+          label: "Reason",
+          placeholder: "Enter reason for rejection..."
+        }
+      }).onPrimary((o) => {
+        u.payoutAccount.enable = !1, u.payoutAccount.status = "REJECTED", u.payoutAccount.statusReason = o, t(u.payoutAccount), l.close();
+      });
+    }, { search: f } = ee({
+      search: ""
+    }), p = Y(() => {
+      const { ssm: o, bank: c, bankStatement: v } = u.payoutAccount.store;
+      return o && c && c.name && c.accountNumber && c.holderName && v;
+    }), i = C(""), d = [
+      {
+        header: () => "Payment Method",
+        accessorKey: "issuer",
+        cell: (o) => `${o.row.original.issuer} (${o.row.original.variant})`
+      },
+      {
+        header: () => "Rate",
+        accessorKey: "rate",
+        cell: ({ row: o }) => {
+          let c = 0;
+          return o.original.rate && (c = o.original.rate.amount / Math.pow(10, o.original.rate.precision)), H(_e, {
+            data: c,
+            onChange: (v) => {
+              const F = u.payoutAccount.methods.at(o.index);
+              F.rate || (F.rate = {
+                amount: 0,
+                precision: 4
+              }), F.rate.amount = v * Math.pow(10, F.rate.precision);
+            }
+          });
+        }
+      },
+      {
+        header: () => "Minimum Fee",
+        accessorKey: "minimumFee",
+        cell: ({ row: o }) => {
+          let c = 0;
+          return o.original.minimumFee && (c = o.original.minimumFee.amount / Math.pow(10, o.original.minimumFee.precision)), H(Me, {
+            data: c,
+            onChange: (v) => {
+              const F = u.payoutAccount.methods.at(o.index);
+              F.minimumFee || (F.minimumFee = {
+                amount: 0,
+                precision: 2
+              }), F.minimumFee.amount = v * Math.pow(10, F.minimumFee.precision);
+            }
+          });
+        }
+      },
+      {
+        header: () => "T plus",
+        accessorKey: "tPlus",
+        cell: ({ row: o }) => H(Be, {
+          data: o.original.tPlus ?? 0,
+          onChange: (c) => {
+            const v = u.payoutAccount.methods.at(o.index);
+            v.tPlus = c;
+          }
+        })
+      }
+    ];
+    return (o, c) => {
+      const v = y("FmRadio"), F = y("FmRadioGroup"), S = y("FmSwitch"), U = y("FmSearch"), I = y("FmTable"), T = y("FmButton");
+      return g(), O(j, null, [
+        s("div", $e, [
+          s("div", qe, [
+            a(F, {
+              modelValue: n.payoutAccount.status,
+              "onUpdate:modelValue": c[0] || (c[0] = (R) => n.payoutAccount.status = R),
+              label: "Account Status"
+            }, {
+              default: k(() => [
+                a(v, {
+                  value: "PENDING",
+                  label: "Pending"
+                }),
+                a(v, {
+                  value: "APPROVED",
+                  label: "Approved"
+                }),
+                a(v, {
+                  value: "REJECTED",
+                  label: "Rejected",
+                  onClick: m
+                })
+              ]),
+              _: 1
+            }, 8, ["modelValue"])
+          ]),
+          s("div", he, [
+            a(S, {
+              modelValue: n.payoutAccount.enable,
+              "onUpdate:modelValue": c[1] || (c[1] = (R) => n.payoutAccount.enable = R),
+              disabled: !p.value,
+              label: "Enabled",
+              sublabel: "Merchant can use online features such as e-payment, settlement"
+            }, null, 8, ["modelValue", "disabled"])
+          ])
+        ]),
+        n.payoutAccount.enable ? (g(), O(j, { key: 0 }, [
+          s("div", Ee, [
+            s("div", Oe, [
+              a(U, {
+                modelValue: r(f),
+                "onUpdate:modelValue": c[2] || (c[2] = (R) => W(f) ? f.value = R : null),
+                placeholder: "Search Method ..."
+              }, null, 8, ["modelValue"])
+            ])
+          ]),
+          a(I, {
+            class: "mt-6",
+            modelValue: i.value,
+            "onUpdate:modelValue": c[3] || (c[3] = (R) => i.value = R),
+            "shrink-at": !1,
+            "search-value": r(f),
+            "row-data": n.payoutAccount.methods,
+            "column-defs": d
+          }, null, 8, ["modelValue", "search-value", "row-data"])
+        ], 64)) : q("", !0),
+        a(T, {
+          class: "w-full mt-6",
+          variant: "primary",
+          label: "Save",
+          loading: e.value,
+          onclick: () => t(n.payoutAccount)
+        }, null, 8, ["loading", "onclick"])
+      ], 64);
+    };
+  }
+}), Ke = { class: "flex" }, je = /* @__PURE__ */ D({
+  __name: "Actions",
+  emits: ["edit", "delete"],
+  setup(n, { emit: u }) {
+    const e = u;
+    return (b, l) => {
+      const t = y("FmButton");
+      return g(), O("div", Ke, [
+        a(t, {
+          variant: "plain",
+          "prepend-icon": "delete",
+          onClick: l[0] || (l[0] = (m) => {
+            m.stopPropagation(), e("delete");
+          })
+        })
+      ]);
+    };
+  }
+}), Ye = { class: "flex justify-end px-6 pb-6" }, He = /* @__PURE__ */ D({
+  __name: "PaymentChannel",
+  props: {
+    payoutAccount: {
+      type: Object,
+      required: !0
+    }
+  },
+  setup(n) {
+    const u = J(), e = n, { isLoading: b, startAsyncCall: l } = X(), t = C([]);
+    function m() {
+      l(async () => {
+        t.value = await G.getChannels(e.payoutAccount._id);
+      });
+    }
+    re(m);
+    function f() {
+      l(async () => {
+        try {
+          await G.updateChannels(e.payoutAccount._id, t.value), u.open({
+            type: "success",
+            title: "Payout account channels update succesfully"
+          });
+        } catch (d) {
+          u.open({
+            type: "error",
+            title: "Error occurs when updating payout account channels",
+            message: z(d)
+          });
+        }
+      });
+    }
+    function p() {
+      l(async () => {
+        try {
+          await G.resetChannels(e.payoutAccount._id), t.value = await G.getChannels(e.payoutAccount._id), u.open({
+            type: "success",
+            title: "Payout account channels reset succesfully"
+          });
+        } catch (d) {
+          u.open({
+            type: "error",
+            title: "Error occurs when reset payout account channels",
+            message: z(d)
+          });
+        }
+      });
+    }
+    const i = [
+      {
+        header: () => "Gateway",
+        accessorKey: "gateway"
+      },
+      {
+        header: () => "Payment Type",
+        accessorKey: "type"
+      },
+      {
+        header: () => "Display",
+        accessorKey: "icon",
+        cell: ({ row: d }) => H("img", { src: d.original.icon, width: 32, height: 32 })
+      },
+      {
+        header: () => "Label",
+        accessorKey: "label",
+        cell: ({ row: d }) => H(ve.FmTextField, {
+          modelValue: d.original.label,
+          "onUpdate:modelValue": (o) => d.original.label = o
+        })
+      },
+      {
+        id: "actions",
+        header: () => "Actions",
+        cell: ({ row: d }) => H(je, {
+          onDelete: () => t.value.splice(d.index, 1)
+        })
+      }
+    ];
+    return (d, o) => {
+      const c = y("FmButton"), v = y("FmTable");
+      return g(), O(j, null, [
+        s("div", Ye, [
+          a(c, {
+            class: "mx-4",
+            variant: "destructive",
+            size: "md",
+            icon: "history",
+            label: "Reset",
+            onClick: p
+          }),
+          a(c, {
+            variant: "primary",
+            size: "md",
+            icon: "save",
+            label: "Save",
+            onClick: f
+          })
+        ]),
+        a(v, {
+          loading: r(b),
+          "row-data": t.value,
+          "column-defs": i,
+          "shrink-at": !1
+        }, null, 8, ["loading", "row-data"])
+      ], 64);
+    };
+  }
+}), ze = { class: "flex mt-6 space-x-6" }, Le = /* @__PURE__ */ D({
+  __name: "FiuuGateway",
+  props: {
+    gateway: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    },
+    onDelete: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(n) {
+    var b;
+    const e = C(((b = n.gateway) == null ? void 0 : b.config) || {
+      merchantId: "",
+      verifyKey: "",
+      secretKey: ""
+    });
+    return (l, t) => {
+      const m = y("FmTextField"), f = y("FmButton"), p = y("FmForm");
+      return g(), w(p, {
+        ref: "form",
+        class: "flex flex-col gap-16",
+        onValidationSuccess: t[3] || (t[3] = () => n.onUpdate(e.value))
+      }, {
+        default: k(() => [
+          a(m, {
+            modelValue: e.value.merchantId,
+            "onUpdate:modelValue": t[0] || (t[0] = (i) => e.value.merchantId = i),
+            label: "Merchant ID",
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"]),
+          a(m, {
+            modelValue: e.value.verifyKey,
+            "onUpdate:modelValue": t[1] || (t[1] = (i) => e.value.verifyKey = i),
+            label: "Verify Key",
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"]),
+          a(m, {
+            modelValue: e.value.secretKey,
+            "onUpdate:modelValue": t[2] || (t[2] = (i) => e.value.secretKey = i),
+            label: "Secret Key",
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"]),
+          s("div", ze, [
+            n.gateway ? (g(), w(f, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => n.onDelete()
+            }, null, 8, ["onclick"])) : q("", !0),
+            a(f, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), Ze = { class: "flex mt-6 space-x-6" }, Je = /* @__PURE__ */ D({
+  __name: "MacauPassGateway",
+  props: {
+    gateway: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    },
+    onDelete: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(n) {
+    var b;
+    const e = C(((b = n.gateway) == null ? void 0 : b.config) || {
+      merchantId: "",
+      merchantName: "",
+      merchantCategoryCode: "",
+      storeID: "",
+      storeName: ""
+    });
+    return (l, t) => {
+      const m = y("FmTextField"), f = y("FmButton"), p = y("FmForm");
+      return g(), w(p, {
+        ref: "form",
+        class: "flex flex-col gap-16",
+        onValidationSuccess: t[5] || (t[5] = () => n.onUpdate(e.value))
+      }, {
+        default: k(() => [
+          a(m, {
+            modelValue: e.value.merchantId,
+            "onUpdate:modelValue": t[0] || (t[0] = (i) => e.value.merchantId = i),
+            label: "Merchant ID",
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"]),
+          a(m, {
+            modelValue: e.value.merchantName,
+            "onUpdate:modelValue": t[1] || (t[1] = (i) => e.value.merchantName = i),
+            label: "Merchant Name",
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"]),
+          a(m, {
+            modelValue: e.value.merchantCategoryCode,
+            "onUpdate:modelValue": t[2] || (t[2] = (i) => e.value.merchantCategoryCode = i),
+            label: "Merchant MCC",
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"]),
+          a(m, {
+            modelValue: e.value.storeID,
+            "onUpdate:modelValue": t[3] || (t[3] = (i) => e.value.storeID = i),
+            label: "Store ID",
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"]),
+          a(m, {
+            modelValue: e.value.storeName,
+            "onUpdate:modelValue": t[4] || (t[4] = (i) => e.value.storeName = i),
+            label: "Store Name",
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"]),
+          s("div", Ze, [
+            n.gateway ? (g(), w(f, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => n.onDelete()
+            }, null, 8, ["onclick"])) : q("", !0),
+            a(f, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), Qe = { class: "flex mt-6 space-x-6" }, We = /* @__PURE__ */ D({
+  __name: "DigioGateway",
+  props: {
+    gateway: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    },
+    onDelete: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(n) {
+    var b;
+    const e = C(((b = n.gateway) == null ? void 0 : b.config) || {
+      merchantId: "",
+      cardMerchantId: ""
+    });
+    return (l, t) => {
+      const m = y("FmTextField"), f = y("FmButton"), p = y("FmForm");
+      return g(), w(p, {
+        ref: "form",
+        class: "flex flex-col gap-16",
+        onValidationSuccess: t[2] || (t[2] = () => n.onUpdate(e.value))
+      }, {
+        default: k(() => [
+          a(m, {
+            modelValue: e.value.merchantId,
+            "onUpdate:modelValue": t[0] || (t[0] = (i) => e.value.merchantId = i),
+            label: "Merchant ID",
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"]),
+          a(m, {
+            modelValue: e.value.cardMerchantId,
+            "onUpdate:modelValue": t[1] || (t[1] = (i) => e.value.cardMerchantId = i),
+            label: "Card Merchant ID",
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"]),
+          s("div", Qe, [
+            n.gateway ? (g(), w(f, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => n.onDelete()
+            }, null, 8, ["onclick"])) : q("", !0),
+            a(f, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), Xe = { class: "flex mt-6 space-x-6" }, et = /* @__PURE__ */ D({
+  __name: "AdyenGateway",
+  props: {
+    gateway: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    },
+    onDelete: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(n) {
+    var b;
+    const e = C(((b = n.gateway) == null ? void 0 : b.config) || {
+      merchantAccount: "",
+      username: "",
+      apiKey: "",
+      clientKey: "",
+      endpoint: "",
+      hmacKey: ""
+    });
+    return (l, t) => {
+      const m = y("FmTextField"), f = y("FmButton"), p = y("FmForm");
+      return g(), w(p, {
+        ref: "form",
+        class: "flex flex-col gap-16",
+        onValidationSuccess: t[6] || (t[6] = () => n.onUpdate(e.value))
+      }, {
+        default: k(() => [
+          a(m, {
+            modelValue: e.value.endpoint,
+            "onUpdate:modelValue": t[0] || (t[0] = (i) => e.value.endpoint = i),
+            label: "Endpoint",
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"]),
+          a(m, {
+            modelValue: e.value.merchantAccount,
+            "onUpdate:modelValue": t[1] || (t[1] = (i) => e.value.merchantAccount = i),
+            label: "Merchant Account",
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"]),
+          a(m, {
+            modelValue: e.value.username,
+            "onUpdate:modelValue": t[2] || (t[2] = (i) => e.value.username = i),
+            label: "Username",
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"]),
+          a(m, {
+            modelValue: e.value.apiKey,
+            "onUpdate:modelValue": t[3] || (t[3] = (i) => e.value.apiKey = i),
+            label: "API Key",
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"]),
+          a(m, {
+            modelValue: e.value.clientKey,
+            "onUpdate:modelValue": t[4] || (t[4] = (i) => e.value.clientKey = i),
+            label: "Client Key",
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"]),
+          a(m, {
+            modelValue: e.value.hmacKey,
+            "onUpdate:modelValue": t[5] || (t[5] = (i) => e.value.hmacKey = i),
+            label: "HMac Key"
+          }, null, 8, ["modelValue"]),
+          s("div", Xe, [
+            n.gateway ? (g(), w(f, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => n.onDelete()
+            }, null, 8, ["onclick"])) : q("", !0),
+            a(f, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), tt = { class: "flex mt-6 space-x-6" }, nt = /* @__PURE__ */ D({
+  __name: "KsherGateway",
+  props: {
+    gateway: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    },
+    onDelete: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(n) {
+    var b;
+    const e = C(((b = n.gateway) == null ? void 0 : b.config) || {
+      appId: "",
+      privateKey: ""
+    });
+    return (l, t) => {
+      const m = y("FmTextField"), f = y("FmTextarea"), p = y("FmButton"), i = y("FmForm");
+      return g(), w(i, {
+        ref: "form",
+        class: "flex flex-col gap-16",
+        onValidationSuccess: t[2] || (t[2] = () => n.onUpdate(e.value))
+      }, {
+        default: k(() => [
+          a(m, {
+            modelValue: e.value.appId,
+            "onUpdate:modelValue": t[0] || (t[0] = (d) => e.value.appId = d),
+            label: "App ID",
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"]),
+          a(f, {
+            modelValue: e.value.privateKey,
+            "onUpdate:modelValue": t[1] || (t[1] = (d) => e.value.privateKey = d),
+            label: "Private Key",
+            placeholder: "Paste your private key including BEGIN and END markers",
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"]),
+          s("div", tt, [
+            n.gateway ? (g(), w(p, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => n.onDelete()
+            }, null, 8, ["onclick"])) : q("", !0),
+            a(p, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), at = /* @__PURE__ */ D({
+  __name: "TyroGateway",
+  props: {
+    gateway: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    },
+    onDelete: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(n) {
+    var b;
+    const e = C(
+      ((b = n.gateway) == null ? void 0 : b.config) || {
+        locationId: ""
+      }
+    );
+    return (l, t) => {
+      const m = y("FmTextField"), f = y("FmForm");
+      return g(), w(f, {
+        ref: "form",
+        class: "flex flex-col gap-16",
+        onValidationSuccess: t[1] || (t[1] = () => n.onUpdate(e.value))
+      }, {
+        default: k(() => [
+          a(m, {
+            modelValue: e.value.locationId,
+            "onUpdate:modelValue": t[0] || (t[0] = (p) => e.value.locationId = p),
+            label: "Location ID",
+            readonly: !0,
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), ot = {
+  key: 0,
+  className: "mt-1 my-6 text-gray-600"
+}, lt = {
+  key: 1,
+  class: "flex items-center justify-center min-h-[80vh]"
+}, ut = /* @__PURE__ */ D({
+  __name: "PaymentGateway",
+  props: {
+    payoutAccount: {
+      type: Object,
+      required: !0
+    }
+  },
+  setup(n) {
+    const u = me().currentCountry, e = u.value, b = J(), { isLoading: l, startAsyncCall: t } = X(), { gatewayTab: m } = ee({
+      gatewayTab: ""
+    }), f = n, p = [
+      {
+        label: "Fiuu",
+        value: "RAZER_MERCHANT_SERVICE",
+        render: Le,
+        region: [$.F_COUNTRY.enum.MY, $.F_COUNTRY.enum.SG]
+      },
+      {
+        label: "Macau Pass",
+        value: "MACAU_PASS",
+        render: Je,
+        region: [$.F_COUNTRY.enum.MO]
+      },
+      {
+        label: "Digio",
+        value: "DIGIO",
+        render: We,
+        region: [$.F_COUNTRY.enum.TH]
+      },
+      {
+        label: "Ksher",
+        value: "KSHER",
+        render: nt,
+        region: [$.F_COUNTRY.enum.TH]
+      },
+      {
+        label: "Adyen",
+        value: "ADYEN",
+        render: et,
+        region: [$.F_COUNTRY.enum.MY, $.F_COUNTRY.enum.SG]
+      },
+      {
+        label: "Tyro",
+        value: "TYRO",
+        render: at,
+        region: [$.F_COUNTRY.enum.AU]
+      }
+    ], i = C(
+      f.payoutAccount.gateways ?? []
+    ), d = Y(() => p.find((S) => S.value === m.value)), o = Y(() => p.filter(
+      (S) => S.region.includes(u.value ?? $.F_COUNTRY.enum.MY)
+    ));
+    async function c(S) {
+      await t(async () => {
+        try {
+          await G.updateGateway(f.payoutAccount._id, S), b.open({
+            type: "success",
+            title: "Payout account gateways update succesfully"
+          }), v.value = S.length === 0;
+        } catch (U) {
+          b.open({
+            type: "error",
+            title: "Error occurs when updating payout account gateways",
+            message: z(U)
+          });
+        }
+      });
+    }
+    const v = C((f.payoutAccount.gateways ?? []).length === 0), F = Y(() => e !== "MY" || !v.value);
+    return (S, U) => {
+      var _;
+      const I = y("FmCircularProgress"), T = y("FmSwitch"), R = y("FmTabs");
+      return g(), O(j, null, [
+        r(e) ? (g(), O("p", ot, [...U[2] || (U[2] = [
+          s("b", null, "Note: ", -1),
+          P(" There's no setup required for Malaysia Payment Gateway, once Payout Account is ready you will able to configure the payment channels. ", -1)
+        ])])) : q("", !0),
+        r(l) ? (g(), O("div", lt, [
+          a(I, { size: "xxl" })
+        ])) : (g(), O(j, { key: 2 }, [
+          r(e) === "MY" ? (g(), w(T, {
+            key: 0,
+            modelValue: v.value,
+            "onUpdate:modelValue": U[0] || (U[0] = (V) => v.value = V),
+            style: { "padding-bottom": "12px" },
+            label: "Use FeedMe's Fiuu Account?"
+          }, null, 8, ["modelValue"])) : q("", !0),
+          F.value ? (g(), w(R, {
+            key: 1,
+            "model-value": r(m),
+            "onUpdate:modelValue": U[1] || (U[1] = (V) => W(m) ? m.value = V : null),
+            class: "mb-6",
+            items: o.value
+          }, null, 8, ["model-value", "items"])) : q("", !0),
+          F.value && r(m) ? (g(), w(ne((_ = d.value) == null ? void 0 : _.render), ae(oe({ key: 2 }, {
+            gateway: i.value.find(
+              (V) => {
+                var x;
+                return V.paymentGateway === ((x = d.value) == null ? void 0 : x.value);
+              }
+            ),
+            onDelete: async () => {
+              i.value = i.value.filter(
+                (V) => {
+                  var x;
+                  return V.paymentGateway !== ((x = d.value) == null ? void 0 : x.value);
+                }
+              ), c(i.value);
+            },
+            onUpdate: (V) => {
+              var h;
+              let x = i.value.find(
+                (K) => {
+                  var E;
+                  return K.paymentGateway === ((E = d.value) == null ? void 0 : E.value);
+                }
+              );
+              x ? x.config = V : i.value.push({
+                paymentGateway: (h = d.value) == null ? void 0 : h.value,
+                config: V
+              }), c(i.value);
+            }
+          })), null, 16)) : q("", !0)
+        ], 64))
+      ], 64);
+    };
+  }
+}), st = { class: "flex mt-6 space-x-6" }, rt = /* @__PURE__ */ D({
+  __name: "GooglePayToken",
+  props: {
+    gateway: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    },
+    onDelete: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(n) {
+    const e = C(
+      n.gateway || {
+        type: "googlePay",
+        gateway: "RAZER_MERCHANT_SERVICE",
+        config: {
+          gateway: "molpay",
+          gatewayMerchantId: "molpay"
+        }
+      }
+    );
+    return (b, l) => {
+      const t = y("FmTextField"), m = y("FmButton"), f = y("FmForm");
+      return g(), w(f, {
+        ref: "form",
+        class: "flex flex-col gap-16",
+        onValidationSuccess: l[3] || (l[3] = () => n.onUpdate(e.value))
+      }, {
+        default: k(() => [
+          a(t, {
+            modelValue: e.value.gateway,
+            "onUpdate:modelValue": l[0] || (l[0] = (p) => e.value.gateway = p),
+            label: "Gateway",
+            disabled: !0,
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"]),
+          a(t, {
+            modelValue: e.value.config.gateway,
+            "onUpdate:modelValue": l[1] || (l[1] = (p) => e.value.config.gateway = p),
+            label: "Gateway ID",
+            disabled: !0,
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"]),
+          a(t, {
+            modelValue: e.value.config.gatewayMerchantId,
+            "onUpdate:modelValue": l[2] || (l[2] = (p) => e.value.config.gatewayMerchantId = p),
+            label: "Gateway Merchant ID",
+            disabled: !0,
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"]),
+          s("div", st, [
+            n.gateway ? (g(), w(m, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => n.onDelete()
+            }, null, 8, ["onclick"])) : q("", !0),
+            a(m, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), it = { class: "flex mt-6 space-x-6" }, mt = /* @__PURE__ */ D({
+  __name: "ApplePayToken",
+  props: {
+    gateway: {
+      type: Object,
+      required: !0
+    },
+    onUpdate: {
+      type: Function,
+      required: !0
+    },
+    onDelete: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(n) {
+    const e = C(
+      n.gateway || {
+        type: "applePay",
+        gateway: "RAZER_MERCHANT_SERVICE",
+        config: {
+          merchantId: "FMfeedme"
+        }
+      }
+    );
+    return (b, l) => {
+      const t = y("FmTextField"), m = y("FmButton"), f = y("FmForm");
+      return g(), w(f, {
+        ref: "form",
+        class: "flex flex-col gap-16",
+        onValidationSuccess: l[2] || (l[2] = () => n.onUpdate(e.value))
+      }, {
+        default: k(() => [
+          a(t, {
+            modelValue: e.value.gateway,
+            "onUpdate:modelValue": l[0] || (l[0] = (p) => e.value.gateway = p),
+            label: "Gateway",
+            disabled: !0,
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"]),
+          a(t, {
+            modelValue: e.value.config.merchantId,
+            "onUpdate:modelValue": l[1] || (l[1] = (p) => e.value.config.merchantId = p),
+            label: "Merchant ID",
+            disabled: !0,
+            rules: r(A)(r(N).string())
+          }, null, 8, ["modelValue", "rules"]),
+          s("div", it, [
+            n.gateway ? (g(), w(m, {
+              key: 0,
+              class: "flex-1",
+              variant: "secondary",
+              label: "Delete",
+              onclick: () => n.onDelete()
+            }, null, 8, ["onclick"])) : q("", !0),
+            a(m, {
+              type: "submit",
+              class: "flex-1",
+              variant: "primary",
+              label: "Save"
+            })
+          ])
+        ]),
+        _: 1
+      }, 512);
+    };
+  }
+}), ct = {
+  key: 0,
+  class: "flex items-center justify-center min-h-[80vh]"
+}, dt = /* @__PURE__ */ D({
+  __name: "TokenGateway",
+  props: {
+    payoutAccount: {
+      type: Object,
+      required: !0
+    }
+  },
+  setup(n) {
+    const u = me().currentCountry, e = J(), { isLoading: b, startAsyncCall: l } = X(), { tokenTab: t } = ee({
+      tokenTab: ""
+    }), m = n, f = [
+      {
+        label: "Google Pay",
+        value: "googlePay",
+        icon: "android",
+        render: rt,
+        region: [$.F_COUNTRY.enum.MY, $.F_COUNTRY.enum.SG]
+      },
+      {
+        label: "Apple Pay",
+        value: "applePay",
+        icon: "iOS",
+        render: mt,
+        region: [$.F_COUNTRY.enum.MY, $.F_COUNTRY.enum.SG]
+      }
+    ], p = C(m.payoutAccount.tokens ?? []), i = Y(() => f.find((c) => c.value === t.value)), d = Y(() => f.filter(
+      (c) => c.region.includes(u.value ?? $.F_COUNTRY.enum.MY)
+    ));
+    async function o(c) {
+      await l(async () => {
+        try {
+          await G.updateTokens(m.payoutAccount._id, c), e.open({
+            type: "success",
+            title: "Payout account tokens gateway update succesfully"
+          });
+        } catch (v) {
+          e.open({
+            type: "error",
+            title: "Error occurs when updating payout account tokens",
+            message: z(v)
+          });
+        }
+      });
+    }
+    return (c, v) => {
+      var U;
+      const F = y("FmCircularProgress"), S = y("FmTabs");
+      return g(), O(j, null, [
+        v[1] || (v[1] = s("p", { className: "mt-1 my-6 text-gray-600" }, [
+          s("b", null, "Note: "),
+          P(" Token gateways appear above other online payment channels to comply with provider branding requirements. Configuration is standardized, so you generally only need to select the provider. "),
+          s("br"),
+          s("br"),
+          s("b", null, ` Token payments are automatically enabled for "Pay-First" merchants. You do not need to adjust settings here unless you're modifying for a non-Pay-First merchant who wishes to manually enable this feature. `),
+          s("br")
+        ], -1)),
+        r(b) ? (g(), O("div", ct, [
+          a(F, { size: "xxl" })
+        ])) : (g(), w(S, {
+          key: 1,
+          "model-value": r(t),
+          "onUpdate:modelValue": v[0] || (v[0] = (I) => W(t) ? t.value = I : null),
+          class: "mb-6 mt-6",
+          items: d.value
+        }, null, 8, ["model-value", "items"])),
+        r(t) ? (g(), w(ne((U = i.value) == null ? void 0 : U.render), ae(oe({ key: 2 }, {
+          gateway: p.value.find((I) => {
+            var T;
+            return I.type === ((T = i.value) == null ? void 0 : T.value);
+          }),
+          onDelete: async () => {
+            p.value = p.value.filter((I) => {
+              var T;
+              return I.type !== ((T = i.value) == null ? void 0 : T.value);
+            }), o(p.value);
+          },
+          onUpdate: (I) => {
+            let T = p.value.find((R) => {
+              var _;
+              return R.type === ((_ = i.value) == null ? void 0 : _.value);
+            });
+            T ? T.config = I : p.value.push(I), o(p.value);
+          }
+        })), null, 16)) : q("", !0)
+      ], 64);
+    };
+  }
+}), It = /* @__PURE__ */ D({
+  __name: "PayoutAccountSetting",
+  props: {
+    accountId: {
+      type: String,
+      required: !0
+    }
+  },
+  setup(n) {
+    const u = n, { tab: e } = ee({
+      tab: "information"
+    }), { isLoading: b, startAsyncCall: l } = X(!0), t = ye(), m = C();
+    async function f(o) {
+      await G.updateById(
+        u.accountId,
+        o
+      ), m.value = await G.readById(u.accountId);
+    }
+    const p = [
+      {
+        label: "Information",
+        value: "information",
+        icon: "overview",
+        render: we
+      },
+      {
+        label: "Settlement",
+        value: "settlement",
+        icon: "payments",
+        render: Pe
+      },
+      {
+        label: "MDR Status",
+        value: "payment",
+        icon: "account_box",
+        render: Ge
+      },
+      {
+        label: "Online Gateways",
+        icon: "assured_workload",
+        value: "gateways",
+        render: ut
+      },
+      {
+        label: "Token Gateways",
+        value: "tokens",
+        icon: "wallet",
+        render: dt
+      },
+      {
+        label: "Online Channels",
+        icon: "shopping_cart",
+        value: "channels",
+        render: He
+      }
+    ];
+    function i() {
+      l(async () => {
+        m.value = await G.readById(u.accountId);
+      });
+    }
+    re(i);
+    const d = Y(() => {
+      const o = p.reduce((c, v) => c || (v.children ? v.children.find((F) => F.value === e.value) || null : v.value === e.value ? v : null), null);
+      return o == null ? void 0 : o.render;
+    });
+    return (o, c) => {
+      var F;
+      const v = y("FmTabs");
+      return g(), w(pe, {
+        title: `Payout Account (${(F = m.value) == null ? void 0 : F._id})`,
+        loading: r(b),
+        onBack: r(t).back
+      }, {
+        default: k(() => [
+          a(v, {
+            "model-value": r(e),
+            "onUpdate:modelValue": c[0] || (c[0] = (S) => W(e) ? e.value = S : null),
+            class: "mb-6",
+            items: p
+          }, null, 8, ["model-value"]),
+          r(e) ? (g(), w(ne(d.value), ae(oe({ key: 0 }, {
+            payoutAccount: m.value,
+            onUpdate: f
+          })), null, 16)) : q("", !0)
+        ]),
+        _: 1
+      }, 8, ["title", "loading", "onBack"]);
+    };
+  }
+});
+export {
+  It as default
+};