@feedmepos/mf-hrm-portal 2.0.25 → 2.1.0-dev

package/dist/RoleList-tSC8RJHe.js

@@ -0,0 +1,674 @@
+import { computed as R, defineComponent as we, ref as $, watch as oe, onMounted as ke, resolveComponent as F, createBlock as L, openBlock as u, unref as o, withCtx as C, createElementVNode as c, createVNode as i, createElementBlock as x, Fragment as E, createCommentVNode as re, renderList as Q, toDisplayString as j, normalizeClass as ze, h as B, createTextVNode as ye, resolveDynamicComponent as xe, withModifiers as Ke, nextTick as Ce } from "vue";
+import { u as ve, e as D } from "./iteration-LEYoQKiI.js";
+import { useI18n as Ve } from "@feedmepos/mf-common";
+import { useSnackbar as Se, components as fe, useDialog as Ne, useBreakpoints as Oe, FmButtonColorThemeVariant as Je } from "@feedmepos/ui-library";
+import { k as qe, A as We, S as Ge, _ as He } from "./app-DRnSocX8.js";
+import { u as Qe, _ as Fe } from "./useDiscardConfirm-DPhEV6v0.js";
+import { _ as Xe } from "./index.vue_vue_type_script_setup_true_lang-Vc5ARO29.js";
+import { e as Ye, r as q, h as Ue, f as Ze, g as Re, a as es, b as ne } from "./rule-CJC6Cq6S.js";
+import { u as Ee } from "./useAppStore-BGsfYWAR.js";
+import { u as Le } from "./useReportPermissions-nlQ_BBL2.js";
+import { l as ie } from "./lodash-Bq6_eZZ0.js";
+import { u as ss, _ as ts, a as as } from "./ConditionFormHost.vue_vue_type_script_setup_true_lang-tiuei7CA.js";
+import { _ as pe } from "./FormSection.vue_vue_type_script_setup_true_lang-DknXTYiK.js";
+import { u as ls } from "./useLoading-BUM5R2qV.js";
+function os() {
+  const X = ve();
+  return R(() => {
+    const t = {};
+    return X.restaurants.value.forEach((V) => {
+      t[V._id] = V;
+    }), t;
+  });
+}
+const rs = { class: "flex w-full items-center justify-between" }, ns = { class: "fm-typo-en-title-md-600" }, is = { class: "space-y-40" }, us = {
+  key: 0,
+  class: "flex justify-center py-16"
+}, cs = { class: "space-y-8" }, ms = { class: "fm-typo-en-title-sm-600" }, ds = { class: "mt-16 space-y-8" }, ps = { class: "flex items-center" }, fs = { class: "h-[24px] w-[24px] flex items-center justify-center" }, vs = { class: "flex flex-col gap-12 p-16 w-[320px]" }, hs = { class: "fm-typo-en-title-sm-600" }, _s = {
+  key: 0,
+  class: "h-px w-full bg-fm-color-neutral-gray-200"
+}, gs = { class: "flex justify-end pt-8" }, bs = {
+  key: 0,
+  class: "ml-20 mt-8 flex max-w-[320px] flex-row items-start gap-8"
+}, ys = { class: "mt-8 whitespace-nowrap" }, xs = { class: "flex gap-8 items-center justify-start" }, Cs = /* @__PURE__ */ we({
+  __name: "RoleForm",
+  props: {
+    id: {
+      type: String,
+      default: void 0
+    }
+  },
+  setup(X, { expose: Y }) {
+    const { t } = Ve(), V = ve(), A = $(""), M = R(() => V.restaurants.value.filter(({ profile: e }) => {
+      const s = `${e.code ? e.code + "-" : ""}${e.legalName}`;
+      return !A.value || s.toLowerCase().includes(A.value.toLowerCase());
+    })), W = $(V.restaurants.value.length === 0);
+    oe(
+      () => V.restaurants.value.length,
+      (e) => {
+        e > 0 && (W.value = !1);
+      }
+    );
+    const z = Ee(), Z = Se(), ee = ls(Z), { fetchReportPermissions: se, allReportPermissions: ue, availableReportKeys: K } = Le(), S = X, U = $(!1), ce = () => {
+      U.value = !U.value, U.value && h();
+    }, G = R(() => S.id ? t("hr.role.form.update") : t("hr.role.form.add")), te = R(() => S.id ? t("common.update") : t("common.add")), O = R(() => {
+      const e = Ye.filter(
+        (r) => r.subject !== D.F_RULE_SUBJECT.enum.report
+      ).map((r) => q(r)), s = ue.value.map((r) => q(r));
+      return [...e, ...s];
+    }), v = R(() => z.roles.value.find((e) => e._id == S.id)), P = () => ({
+      name: "",
+      restaurantIds: [],
+      permissions: [],
+      maxDiscountPercentage: 100
+    }), a = $(P()), b = $(/* @__PURE__ */ new Map()), w = ss(b), ae = qe("report");
+    function me(e) {
+      const s = b.value.get(e);
+      return !!s && Object.keys(s).length > 0;
+    }
+    function l(e, s) {
+      const r = w.getDraft({ subject: e, builderKey: s.builderKey });
+      return r ? r.formValue : s.fromCondition(
+        We(b.value.get(e), s)
+      );
+    }
+    function n(e, s, r) {
+      w.setDraft({ subject: e, builderKey: s.builderKey }, { formValue: r });
+    }
+    function f(e) {
+      if (w.getDraftsForSubject(e).size === 0) return;
+      const r = [];
+      for (const I of ae) {
+        const J = w.getDraft({ subject: e, builderKey: I.builderKey });
+        J && r.push({ builder: I, form: J.formValue });
+      }
+      if (r.length === 0) return;
+      const k = b.value.get(e), T = Ge(
+        k,
+        r.map(({ builder: I, form: J }) => ({ builder: I, formValue: J }))
+      ), H = new Map(b.value);
+      Object.keys(T).length === 0 ? H.delete(e) : H.set(e, T), b.value = H, w.clearDraftsForSubject(e);
+    }
+    function p(e) {
+      return w.hasDraftsForSubject(e);
+    }
+    const y = R(() => [
+      {
+        title: t("hr.role.labels.operation"),
+        filter: (e) => e.isOrderOperation
+      },
+      {
+        title: t("hr.role.labels.report"),
+        filter: (e) => e.isReportPermission
+      },
+      {
+        title: t("hr.role.labels.other"),
+        filter: (e) => !e.isOrderOperation && !e.isReportPermission
+      }
+    ].map((e) => ({
+      title: e.title,
+      options: O.value.filter(e.filter).map(({ label: s, value: r }) => ({
+        label: t(`hr.role.form.permissionLabels.${r}`, s),
+        value: r
+      }))
+    }))), m = R(() => {
+      var e;
+      return Ue(((e = v.value) == null ? void 0 : e.permissions) || []);
+    });
+    function h() {
+      var e;
+      if (a.value = P(), b.value = /* @__PURE__ */ new Map(), a.value.name = ((e = v.value) == null ? void 0 : e.name) ?? "", m.value)
+        a.value.restaurantIds = M.value.map((s) => s._id), a.value.permissions = O.value.map((s) => s.value);
+      else if (v.value) {
+        a.value.restaurantIds = v.value.restaurants.map((s) => s.id), a.value.permissions = v.value.permissions.map((s) => q(s).value).filter((s) => s.startsWith("report:") ? K.value.has(s.split(":")[1]) : !0), a.value.maxDiscountPercentage = Re(
+          v.value.permissions
+        );
+        for (const s of v.value.permissions) {
+          const r = q(s), k = es(s);
+          k && b.value.set(r.value, k);
+        }
+      }
+    }
+    ke(async () => {
+      await V.readRestaurants(), await se(), h();
+    }), oe(U, async (e) => {
+      e && await se();
+    }), oe(K, () => {
+      if (U.value && v.value && !m.value) {
+        a.value.permissions = a.value.permissions.filter((s) => s.startsWith("report:") ? K.value.has(s.split(":")[1]) : !0);
+        const e = new Map(b.value);
+        for (const s of e.keys())
+          s.startsWith("report:") && !a.value.permissions.includes(s) && e.delete(s);
+        b.value = e;
+      }
+    });
+    const N = $(""), le = R(() => ({
+      restaurantIds: a.value.restaurantIds,
+      role: {
+        name: a.value.name,
+        permissions: Ze(
+          a.value.permissions,
+          a.value.maxDiscountPercentage,
+          b.value
+        )
+      }
+    })), Ie = async () => {
+      const e = le.value;
+      await ee.minor(
+        async () => {
+          v.value ? await z.updateRole(v.value._id, e) : await z.createRole(e);
+        },
+        {
+          successMessage: v.value ? t("hr.role.update.successMessage", { name: e.role.name }) : t("hr.role.add.successMessage", { name: e.role.name })
+        }
+      ), U.value = !1;
+    }, he = R(
+      () => a.value.restaurantIds.filter((e) => M.value.some((s) => s._id === e))
+    ), _e = R(() => M.value.length > 0 && M.value.length === he.value.length), De = () => {
+      const e = a.value.restaurantIds.filter((s) => !he.value.includes(s));
+      _e.value === !0 ? a.value.restaurantIds = e : a.value.restaurantIds = M.value.map((s) => s._id);
+    }, ge = (e) => e.map((r) => r.value).every((r) => a.value.permissions.includes(r)), $e = (e) => {
+      const s = a.value.permissions.filter(
+        (r) => !e.map((k) => k.value).includes(r)
+      );
+      ge(e) === !0 ? a.value.permissions = s : a.value.permissions = [...s, ...e.map((r) => r.value)];
+    };
+    oe(
+      () => a.value.restaurantIds,
+      (e) => {
+        e.length > 0 && (N.value = "");
+      }
+    );
+    const de = Qe(
+      () => {
+        var e, s, r, k;
+        return !ie.isEqual(a.value.name, ((e = v.value) == null ? void 0 : e.name) || P().name) || !ie.isEqual(
+          a.value.restaurantIds,
+          ((s = v.value) == null ? void 0 : s.restaurants.map((T) => T.id)) || P().restaurantIds
+        ) || !ie.isEqual(
+          a.value.permissions,
+          ((r = v.value) == null ? void 0 : r.permissions.map((T) => q(T).value)) || P().permissions
+        ) || !ie.isEqual(
+          a.value.maxDiscountPercentage,
+          v.value ? Re((k = v.value) == null ? void 0 : k.permissions) : P().maxDiscountPercentage
+        );
+      },
+      () => {
+        U.value = !1;
+      }
+    );
+    return Y({
+      show: U,
+      trigger: ce
+    }), (e, s) => {
+      const r = F("FmIcon"), k = F("FmTextField"), T = F("FmCircularProgress"), H = F("FmSearch"), I = F("FmCheckbox"), J = F("FmFormGroup"), Me = F("FmButton"), Pe = F("FmMenu"), Te = F("FmCard"), be = F("fm-button"), Be = F("fm-side-sheet");
+      return u(), L(Be, {
+        id: "unit-form",
+        "model-value": U.value,
+        "is-container": o(fe).FmForm,
+        "is-container-props": {
+          onValidationSuccess: Ie,
+          blameFormChildOnValidationFailed: !0
+        },
+        "max-width": 960,
+        "close-button": !1,
+        "onOn:clickedAway": o(de)
+      }, {
+        "side-sheet-header": C(() => [
+          c("div", rs, [
+            c("p", ns, j(G.value), 1),
+            i(r, {
+              name: "close",
+              size: "md",
+              class: "cursor-pointer",
+              onClick: o(de)
+            }, null, 8, ["onClick"])
+          ])
+        ]),
+        "side-sheet-footer": C(() => [
+          c("div", xs, [
+            i(be, {
+              label: te.value,
+              size: "lg",
+              type: "submit",
+              variant: "primary",
+              disabled: m.value
+            }, null, 8, ["label", "disabled"]),
+            i(be, {
+              label: o(t)("common.cancel"),
+              size: "lg",
+              variant: "tertiary",
+              onClick: o(de)
+            }, null, 8, ["label", "onClick"])
+          ])
+        ]),
+        default: C(() => [
+          c("div", is, [
+            i(pe, {
+              title: o(t)("hr.role.form.roleDetail")
+            }, {
+              default: C(() => [
+                i(k, {
+                  modelValue: a.value.name,
+                  "onUpdate:modelValue": s[0] || (s[0] = (d) => a.value.name = d),
+                  autofocus: "",
+                  rules: [(d) => !!d || o(t)("hr.role.form.required")],
+                  label: o(t)("hr.role.form.name"),
+                  disabled: m.value
+                }, null, 8, ["modelValue", "rules", "label", "disabled"])
+              ]),
+              _: 1
+            }, 8, ["title"]),
+            i(pe, {
+              title: o(t)("hr.role.form.restaurant")
+            }, {
+              default: C(() => [
+                W.value ? (u(), x("div", us, [
+                  i(T)
+                ])) : (u(), x(E, { key: 1 }, [
+                  i(H, {
+                    modelValue: A.value,
+                    "onUpdate:modelValue": s[1] || (s[1] = (d) => A.value = d),
+                    placeholder: o(t)("hr.restaurant.search.placeholder")
+                  }, null, 8, ["modelValue", "placeholder"]),
+                  i(J, {
+                    modelValue: a.value.restaurantIds,
+                    "onUpdate:modelValue": s[3] || (s[3] = (d) => a.value.restaurantIds = d),
+                    rules: [(d) => d.length > 0 || o(t)("hr.role.form.atLeastOneRestaurant")]
+                  }, {
+                    default: C(() => [
+                      c("div", cs, [
+                        A.value ? re("", !0) : (u(), x(E, { key: 0 }, [
+                          i(I, {
+                            "model-value": _e.value,
+                            label: o(t)("hr.role.form.all"),
+                            value: "1",
+                            disabled: m.value,
+                            "onUpdate:modelValue": De
+                          }, null, 8, ["model-value", "label", "disabled"]),
+                          s[6] || (s[6] = c("div", { class: "h-px w-full bg-fm-color-neutral-gray-200" }, null, -1))
+                        ], 64)),
+                        (u(!0), x(E, null, Q(M.value, (d) => (u(), x("div", {
+                          key: d._id
+                        }, [
+                          i(I, {
+                            modelValue: a.value.restaurantIds,
+                            "onUpdate:modelValue": s[2] || (s[2] = (_) => a.value.restaurantIds = _),
+                            label: `${d.profile.code ? d.profile.code + "-" : ""}${d.profile.name}`,
+                            value: d._id,
+                            disabled: m.value
+                          }, null, 8, ["modelValue", "label", "value", "disabled"])
+                        ]))), 128))
+                      ])
+                    ]),
+                    _: 1
+                  }, 8, ["modelValue", "rules"])
+                ], 64))
+              ]),
+              _: 1
+            }, 8, ["title"]),
+            i(pe, {
+              title: o(t)("hr.role.form.permissions")
+            }, {
+              default: C(() => [
+                (u(!0), x(E, null, Q(y.value, (d) => (u(), L(Te, {
+                  key: d.title,
+                  variant: "outlined",
+                  class: "p-16"
+                }, {
+                  default: C(() => [
+                    i(ts, null, {
+                      title: C(() => [
+                        c("p", ms, j(d.title), 1)
+                      ]),
+                      default: C(() => [
+                        c("div", ds, [
+                          i(I, {
+                            "model-value": ge(d.options),
+                            label: o(t)("hr.role.form.all"),
+                            value: "1",
+                            disabled: m.value,
+                            "onUpdate:modelValue": (_) => $e(d.options)
+                          }, null, 8, ["model-value", "label", "disabled", "onUpdate:modelValue"]),
+                          s[7] || (s[7] = c("div", { class: "h-px w-full bg-fm-color-neutral-gray-200" }, null, -1)),
+                          (u(!0), x(E, null, Q(d.options, (_) => (u(), x("div", {
+                            key: _.value
+                          }, [
+                            c("div", ps, [
+                              i(I, {
+                                modelValue: a.value.permissions,
+                                "onUpdate:modelValue": s[4] || (s[4] = (g) => a.value.permissions = g),
+                                label: _.label,
+                                value: _.value,
+                                disabled: m.value,
+                                class: "flex-1"
+                              }, null, 8, ["modelValue", "label", "value", "disabled"]),
+                              _.value.startsWith("report:") ? (u(), x(E, { key: 0 }, [
+                                a.value.permissions.includes(_.value) ? (u(), L(Pe, {
+                                  key: 0,
+                                  "close-on-click": !1,
+                                  disabled: m.value,
+                                  class: "h-5 flex items-center",
+                                  onClose: () => o(w).clearDraftsForSubject(_.value)
+                                }, {
+                                  "menu-button": C(() => [
+                                    c("div", fs, [
+                                      i(r, {
+                                        name: "settings",
+                                        size: "sm",
+                                        class: ze([
+                                          "cursor-pointer transition-colors",
+                                          me(_.value) ? "text-fm-color-primary-main" : "text-fm-color-neutral-gray-400 hover:text-fm-color-neutral-gray-600"
+                                        ])
+                                      }, null, 8, ["class"])
+                                    ])
+                                  ]),
+                                  default: C(() => [
+                                    c("div", vs, [
+                                      c("p", hs, j(_.label), 1),
+                                      (u(!0), x(E, null, Q(o(ae), (g, je) => (u(), x(E, {
+                                        key: g.builderKey
+                                      }, [
+                                        je > 0 ? (u(), x("div", _s)) : re("", !0),
+                                        i(as, {
+                                          builder: g,
+                                          "model-value": l(_.value, g),
+                                          disable: m.value,
+                                          "onUpdate:modelValue": (Ae) => n(_.value, g, Ae)
+                                        }, null, 8, ["builder", "model-value", "disable", "onUpdate:modelValue"])
+                                      ], 64))), 128)),
+                                      c("div", gs, [
+                                        i(Me, {
+                                          label: o(t)("team.memberForm.permissions.conditionApply"),
+                                          size: "md",
+                                          variant: "primary",
+                                          disabled: m.value || !p(_.value),
+                                          onClick: (g) => f(_.value)
+                                        }, null, 8, ["label", "disabled", "onClick"])
+                                      ])
+                                    ])
+                                  ]),
+                                  _: 2
+                                }, 1032, ["disabled", "onClose"])) : (u(), L(r, {
+                                  key: 1,
+                                  name: "settings",
+                                  size: "sm",
+                                  class: "invisible"
+                                }))
+                              ], 64)) : re("", !0)
+                            ]),
+                            _.value === "order:discount" && a.value.permissions.includes(_.value) ? (u(), x("div", bs, [
+                              c("div", ys, j(o(t)("hr.role.form.maxDiscountPercentage")), 1),
+                              i(k, {
+                                modelValue: a.value.maxDiscountPercentage,
+                                "onUpdate:modelValue": s[5] || (s[5] = (g) => a.value.maxDiscountPercentage = g),
+                                rules: [
+                                  (g) => !!g || o(t)("hr.role.form.required"),
+                                  (g) => !isNaN(g) || o(t)("hr.role.form.onlyContainsNumber"),
+                                  (g) => g <= 100 || o(t)("hr.role.form.maxValueIs", { max: 100 }),
+                                  (g) => g >= 0 || o(t)("hr.role.form.minValueIs", { min: 0 })
+                                ],
+                                "append-text": "%",
+                                disabled: m.value
+                              }, null, 8, ["modelValue", "rules", "disabled"])
+                            ])) : re("", !0)
+                          ]))), 128))
+                        ])
+                      ]),
+                      _: 2
+                    }, 1024)
+                  ]),
+                  _: 2
+                }, 1024))), 128))
+              ]),
+              _: 1
+            }, 8, ["title"])
+          ])
+        ]),
+        _: 1
+      }, 8, ["model-value", "is-container", "is-container-props", "onOn:clickedAway"]);
+    };
+  }
+}), Fs = {
+  class: "space-y-8"
+}, Rs = {
+  class: "flex justify-end xs:px-16"
+}, ws = {
+  class: "pb-64 sm:hidden md:hidden lg:hidden"
+}, ks = {
+  class: "space-y-4"
+}, Vs = {
+  class: "fm-typo-en-body-lg-600"
+}, Ss = {
+  class: "text-fm-color-typo-secondary"
+}, Us = {
+  class: "flex"
+}, Es = {
+  class: "flex"
+}, Js = /* @__PURE__ */ we({
+  __name: "RoleList",
+  setup(X, {
+    expose: Y
+  }) {
+    const {
+      t
+    } = Ve(), {
+      allReportPermissions: V
+    } = Le(), A = ve(), M = R(() => A.restaurants.value), W = R(() => M.value.map((l) => l._id));
+    function z(l, n) {
+      const f = n === D.F_RULE_SUBJECT.enum.report ? V.value : void 0, p = ne(l, n, f);
+      return ["-", "All"].includes(p) ? () => null : () => B(fe.FmTooltip, {
+        "z-index": "999",
+        placement: "top",
+        class: "ml-2"
+      }, {
+        content: () => B("div", [t("hr.role.tooltip.labels.permission"), ...l.filter((y) => y.subject === n).map((y) => B("div", ["- ", q(y).label]))]),
+        default: () => B(fe.FmIcon, {
+          name: "info",
+          color: Je.NeutralGray400
+        })
+      });
+    }
+    function Z(l, n) {
+      const f = n === D.F_RULE_SUBJECT.enum.report ? V.value : void 0, p = ne(l, n, f);
+      return () => p === "All" ? p : B("div", {
+        class: "flex items-center"
+      }, [p, z(l, n)()]);
+    }
+    function ee(l) {
+      return [{
+        label: t("hr.role.form.update"),
+        onClick: () => K(l)
+      }, {
+        label: t("hr.role.remove.title"),
+        onClick: () => P(l),
+        itemClass: "text-fm-color-typo-error",
+        disabled: Ue(l.permissions)
+      }];
+    }
+    const se = ({
+      role: l,
+      className: n = ""
+    }) => i("div", {
+      class: n,
+      onClick: (f) => {
+        f.stopPropagation();
+      }
+    }, [i(Fe, {
+      items: ee(l)
+    }, null)]), ue = [{
+      accessorKey: "name",
+      header: () => t("hr.role.columns.name"),
+      enableSorting: !1
+    }, {
+      accessorKey: "operation",
+      header: () => t("hr.role.columns.operation"),
+      cell: (l) => B(Z(l.row.original.permissions, D.F_RULE_SUBJECT.enum.order)),
+      enableSorting: !1
+    }, {
+      accessorKey: "report",
+      header: () => t("hr.role.columns.report"),
+      cell: (l) => B(Z(l.row.original.permissions, D.F_RULE_SUBJECT.enum.report)),
+      enableSorting: !1
+    }, {
+      accessorKey: "restaurants",
+      header: () => t("hr.role.columns.restaurants"),
+      cell: (l) => l.row.original.restaurants.map((n, f) => {
+        const p = n.code, y = `${p ? p + " - " : ""}${n.name}`;
+        return B("div", (f ? `
+ ` : "") + y);
+      }),
+      enableSorting: !1
+    }, {
+      id: "action",
+      size: 52,
+      meta: {
+        cellClass: "pl-16",
+        headerContentClass: "-mx-16"
+      },
+      cell: (l) => se({
+        role: l.row.original,
+        className: "flex w-full items-center justify-end"
+      })
+    }], K = async (l) => {
+      var n;
+      w.value = l._id, await Ce(), (n = b.value) == null || n.trigger();
+    }, S = Ee(), U = os(), ce = R(() => {
+      const l = S.roles.value || [];
+      return (W.value.length === 0 ? l : l.filter((f) => f.restaurants.some((p) => W.value.includes(p.id)))).map((f) => {
+        const p = f.restaurants.map((y) => {
+          const m = U.value[y.id];
+          return {
+            ...y,
+            // Prefer live data from restaurantMap so names populate reactively
+            // even when restaurants loaded after roles.
+            name: (m == null ? void 0 : m.profile.name) || y.name,
+            code: m == null ? void 0 : m.profile.code
+          };
+        });
+        return {
+          ...f,
+          restaurants: p
+        };
+      });
+    }), G = R(() => {
+      var n;
+      return (n = ce.value) == null ? void 0 : n.filter((f) => {
+        const p = a.value.toLowerCase(), y = f.name.toLowerCase().includes(p), h = (f.restaurants || []).some((N) => {
+          var le;
+          return N.name.toLowerCase().includes(p) || ((le = N.code) == null ? void 0 : le.toLowerCase().includes(p));
+        });
+        return y || h;
+      });
+    }), te = Ne(), O = Se(), {
+      breakpoints: v
+    } = Oe(), P = (l) => {
+      te.open({
+        title: t("hr.role.remove.title"),
+        message: t("hr.role.remove.message", {
+          name: l.name
+        }),
+        minWidth: v.value.lg ? 588 : 0,
+        primaryActions: {
+          text: t("common.remove"),
+          close: !1,
+          variant: "destructive"
+        },
+        secondaryActions: {
+          text: t("common.cancel"),
+          close: !0
+        }
+      }).onPrimary(async () => {
+        await S.deleteRole(l).then(() => O.open({
+          message: t("hr.role.remove.successMessage", {
+            name: l.name
+          }),
+          type: "success"
+        })).catch((n) => O.open({
+          message: n,
+          type: "error"
+        })), te.close();
+      });
+    }, a = $(""), b = $(), w = $(void 0);
+    async function ae() {
+      var l;
+      w.value = void 0, await Ce(), (l = b.value) == null || l.trigger();
+    }
+    async function me() {
+      if (S.roles.value.length === 0)
+        try {
+          await S.readRoles();
+        } catch (l) {
+          console.error("Failed to load roles:", l), O.open({
+            message: l instanceof Error ? l.message : String(l),
+            type: "error"
+          });
+        }
+    }
+    return ke(() => {
+      me();
+    }), Y({
+      create: ae
+    }), (l, n) => {
+      const f = F("FmSearch"), p = F("FmTable"), y = F("FmListItem"), m = F("FmList");
+      return u(), x(E, null, [(u(), L(Cs, {
+        id: w.value,
+        key: w.value,
+        ref_key: "roleFormRef",
+        ref: b
+      }, null, 8, ["id"])), c("div", Fs, [c("div", Rs, [i(f, {
+        modelValue: a.value,
+        "onUpdate:modelValue": n[0] || (n[0] = (h) => a.value = h),
+        class: "w-[320px] xs:w-full",
+        autofocus: "",
+        placeholder: o(t)("hr.role.search.placeholder") + " / " + o(t)("hr.restaurant.search.placeholder")
+      }, null, 8, ["modelValue", "placeholder"])]), o(S).roles.value.length > 0 || o(S).isLoading.value ? (u(), L(He, {
+        key: 0,
+        class: "overflow-auto"
+      }, {
+        default: C(() => [i(p, {
+          class: "xs:hidden",
+          "column-defs": ue,
+          "row-data": G.value,
+          "page-size": G.value.length,
+          loading: o(S).isLoading.value,
+          "pin-header-row": "",
+          "hide-footer": "",
+          "shrink-at": !1,
+          onRowClick: n[1] || (n[1] = (h) => K(h.original))
+        }, null, 8, ["row-data", "page-size", "loading"]), c("div", ws, [i(m, {
+          separator: ""
+        }, {
+          default: C(() => [(u(!0), x(E, null, Q(G.value, (h) => (u(), L(y, {
+            key: h._id,
+            class: "py-12 px-16 items-center justify-between",
+            onClick: (N) => K(h)
+          }, {
+            default: C(() => [c("div", ks, [c("p", Vs, j(h.name), 1), c("div", Ss, [c("p", null, j(o(t)("hr.role.labels.restaurantList", {
+              items: h.restaurants.map((N) => N.name).join(", ")
+            })), 1), c("p", Us, [ye(j(o(t)("hr.role.labels.operationList", {
+              items: o(ne)(h.permissions, o(D.F_RULE_SUBJECT).enum.order)
+            })) + " ", 1), (u(), L(xe(z(h.permissions, o(D.F_RULE_SUBJECT).enum.order))))]), c("p", Es, [ye(j(o(t)("hr.role.labels.reportList", {
+              items: o(ne)(h.permissions, o(D.F_RULE_SUBJECT).enum.report, o(V))
+            })) + " ", 1), (u(), L(xe(z(h.permissions, o(D.F_RULE_SUBJECT).enum.report))))])])]), c("div", {
+              onClick: n[2] || (n[2] = Ke(() => {
+              }, ["stop"]))
+            }, [i(Fe, {
+              items: ee(h)
+            }, null, 8, ["items"])])]),
+            _: 2
+          }, 1032, ["onClick"]))), 128))]),
+          _: 1
+        })])]),
+        _: 1
+      })) : (u(), L(o(Xe), {
+        key: 1,
+        title: o(t)("hr.role.noData.title"),
+        subtitle: o(t)("hr.role.noData.subtitle")
+      }, null, 8, ["title", "subtitle"]))])], 64);
+    };
+  }
+});
+export {
+  Js as default
+};