@tager/admin-administrators 0.2.5 → 1.0.0

package/dist/index.mjs

@@ -0,0 +1,875 @@
+import { i18n, request, useI18n, useResourceDelete, createId, useToast, useResource, navigateBack, convertRequestErrorToMap } from "@tager/admin-services";
+import { defineComponent, onMounted, resolveComponent, openBlock, createBlock, withCtx, createVNode, createElementVNode, createElementBlock, Fragment, renderList, toDisplayString, createCommentVNode, computed, ref, watch, withModifiers } from "vue";
+import { DataTable, BaseButton, DeleteIcon, EditIcon, useDataTable, FormFooter, FormField, FormFieldMultiSelect } from "@tager/admin-ui";
+import { compile } from "path-to-regexp";
+import { Page } from "@tager/admin-layout";
+import { useRoute, useRouter } from "vue-router";
+const EN = {
+  home: "Home",
+  administrators: "Administrators",
+  role: "Role",
+  roles: "Roles",
+  admin: "Admin",
+  admins: "Admins",
+  createRole: "Create role",
+  createAdmin: "Create admin",
+  createAdministrator: "Create administrator",
+  edit: "Edit",
+  delete: "Delete",
+  email: "Email",
+  actions: "Actions",
+  updateRole: "Update role",
+  updateAdmin: "Update admin",
+  password: "Password",
+  newPassword: "New password",
+  name: "Name",
+  success: "Success",
+  adminSuccessfullyCreated: "Admin successfully created",
+  adminSuccessfullyUpdated: "Admin successfully updated",
+  error: "Error",
+  adminCreationError: "Admin creation error",
+  adminUpdateError: "Admin update error",
+  listOfRoles: "List of roles",
+  addRole: "Add role",
+  noPrivileges: "No privileges",
+  privileges: "Privileges",
+  all: "All",
+  roleSuccessfullyCreated: "Role successfully created",
+  roleSuccessfullyUpdate: "Role successfully update",
+  roleCreationError: "Role creation error",
+  roleUpdateError: "Role update error",
+  adminList: "Admin List",
+  adminForm: "Admin form",
+  roleList: "Role List",
+  roleForm: "Role form",
+  andMorePrivilege: "and more {{count}} privilege..."
+};
+const RU = {
+  home: "\u0413\u043B\u0430\u0432\u043D\u0430\u044F",
+  administrators: "\u0410\u0434\u043C\u0438\u043D\u0438\u0441\u0442\u0440\u0430\u0442\u043E\u0440\u044B",
+  role: "\u0420\u043E\u043B\u044C",
+  roles: "\u0420\u043E\u043B\u0438",
+  admin: "\u0410\u0434\u043C\u0438\u043D",
+  admins: "\u0410\u0434\u043C\u0438\u043D\u044B",
+  createRole: "\u0421\u043E\u0437\u0434\u0430\u0442\u044C \u0440\u043E\u043B\u044C",
+  createAdmin: "\u0421\u043E\u0437\u0434\u0430\u0442\u044C \u0430\u0434\u043C\u0438\u043D\u0430",
+  createAdministrator: "\u0421\u043E\u0437\u0434\u0430\u0442\u044C \u0430\u0434\u043C\u0438\u043D\u0438\u0441\u0442\u0440\u0430\u0442\u043E\u0440\u0430",
+  edit: "\u0420\u0435\u0434\u0430\u043A\u0442\u0438\u0440\u043E\u0432\u0430\u0442\u044C",
+  delete: "\u0423\u0434\u0430\u043B\u0438\u0442\u044C",
+  email: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430",
+  actions: "\u0414\u0435\u0439\u0441\u0442\u0432\u0438\u044F",
+  updateRole: "\u041E\u0431\u043D\u043E\u0432\u0438\u0442\u044C \u0440\u043E\u043B\u044C",
+  updateAdmin: "\u041E\u0431\u043D\u043E\u0432\u0438\u0442\u044C \u0430\u0434\u043C\u0438\u043D\u0438\u0441\u0442\u0440\u0430\u0442\u043E\u0440\u0430",
+  password: "\u041F\u0430\u0440\u043E\u043B\u044C",
+  newPassword: "\u041D\u043E\u0432\u044B\u0439 \u043F\u0430\u0440\u043E\u043B\u044C",
+  name: "\u0418\u043C\u044F",
+  success: "\u0423\u0441\u043F\u0435\u0445",
+  adminSuccessfullyCreated: "\u0410\u0434\u043C\u0438\u043D \u0443\u0441\u043F\u0435\u0448\u043D\u043E \u0441\u043E\u0437\u0434\u0430\u043D",
+  adminSuccessfullyUpdated: "\u0410\u0434\u043C\u0438\u043D \u0443\u0441\u043F\u0435\u0448\u043D\u043E \u043E\u0431\u043D\u043E\u0432\u043B\u0435\u043D",
+  error: "\u041E\u0448\u0438\u0431\u043A\u0430",
+  adminCreationError: "\u041E\u0448\u0438\u0431\u043A\u0430 \u0441\u043E\u0437\u0434\u0430\u043D\u0438\u044F \u0430\u0434\u043C\u0438\u043D\u0438\u0441\u0442\u0440\u0430\u0442\u043E\u0440\u0430",
+  adminUpdateError: "\u041E\u0448\u0438\u0431\u043A\u0430 \u043E\u0431\u043D\u043E\u0432\u043B\u0435\u043D\u0438\u044F \u0430\u0434\u043C\u0438\u043D\u0438\u0441\u0442\u0440\u0430\u0442\u043E\u0440\u0430",
+  listOfRoles: "\u0421\u043F\u0438\u0441\u043E\u043A \u0440\u043E\u043B\u0435\u0439",
+  addRole: "\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C \u0440\u043E\u043B\u044C",
+  noPrivileges: "\u0411\u0435\u0437 \u043F\u0440\u0438\u0432\u0438\u043B\u0435\u0433\u0438\u0439",
+  privileges: "\u041F\u0440\u0438\u0432\u0438\u043B\u0435\u0433\u0438\u0438",
+  all: "\u0412\u0441\u0435",
+  roleSuccessfullyCreated: "\u0420\u043E\u043B\u044C \u0443\u0441\u043F\u0435\u0448\u043D\u043E \u0441\u043E\u0437\u0434\u0430\u043D\u0430",
+  roleSuccessfullyUpdate: "\u0420\u043E\u043B\u044C \u0443\u0441\u043F\u0435\u0448\u043D\u043E \u043E\u0431\u043D\u043E\u0432\u043B\u0435\u043D\u0430",
+  roleCreationError: "\u041E\u0448\u0438\u0431\u043A\u0430 \u0441\u043E\u0437\u0434\u0430\u043D\u0438\u044F \u0440\u043E\u043B\u0438",
+  roleUpdateError: "\u041E\u0448\u0438\u0431\u043A\u0430 \u043E\u0431\u043D\u043E\u0432\u043B\u0435\u043D\u0438\u044F \u0440\u043E\u043B\u0438",
+  adminList: "\u0421\u043F\u0438\u0441\u043E\u043A \u0430\u0434\u043C\u0438\u043D\u0438\u0441\u0442\u0440\u0430\u0442\u043E\u0440\u043E\u0432",
+  adminForm: "\u0424\u043E\u0440\u043C\u0430 \u0430\u0434\u043C\u0438\u043D\u0438\u0441\u0442\u0440\u0430\u0442\u043E\u0440\u0430",
+  roleList: "\u0421\u043F\u0438\u0441\u043E\u043A \u0440\u043E\u043B\u0435\u0439",
+  roleForm: "\u0424\u043E\u0440\u043C\u0430 \u0440\u043E\u043B\u0438",
+  andMorePrivilege: "\u0438 \u0435\u0449\u0435 {{count}} \u043F\u0440\u0438\u0432\u0438\u043B\u0435\u0433\u0438\u0439..."
+};
+function applyTranslations() {
+  i18n.addTranslations("en", "administrators", EN);
+  i18n.addTranslations("ru", "administrators", RU);
+}
+function getRoleList() {
+  return request.get({ path: "/admin/rbac/roles" });
+}
+function getRole(roleId) {
+  return request.get({ path: `/admin/rbac/roles/${roleId}` });
+}
+function createRole(payload) {
+  return request.post({ path: "/admin/rbac/roles", body: payload });
+}
+function updateRole(roleId, payload) {
+  return request.put({ path: `/admin/rbac/roles/${roleId}`, body: payload });
+}
+function deleteRole(roleId) {
+  return request.delete({ path: `/admin/rbac/roles/${roleId}` });
+}
+function getScopes() {
+  return request.get({ path: "/admin/rbac/scopes" });
+}
+function getAdminList() {
+  return request.get({ path: "/admin/admins" });
+}
+function getAdmin(adminId) {
+  return request.get({ path: `/admin/admins/${adminId}` });
+}
+function createAdmin(payload) {
+  return request.post({ path: "/admin/admins", body: payload });
+}
+function updateAdmin(adminId, payload) {
+  return request.put({ path: `/admin/admins/${adminId}`, body: payload });
+}
+function deleteAdmin(adminId) {
+  return request.delete({ path: `/admin/admins/${adminId}` });
+}
+const ADMINISTRATOR_ROUTE_PATHS = {
+  ROLE_LIST: "/roles",
+  ROLE_FORM: "/roles/:roleId",
+  ADMIN_LIST: "/admins",
+  ADMIN_FORM: "/admins/:adminId"
+};
+function getRoleListUrl() {
+  return ADMINISTRATOR_ROUTE_PATHS.ROLE_LIST;
+}
+function getRoleFormUrl(params) {
+  return compile(ADMINISTRATOR_ROUTE_PATHS.ROLE_FORM)(params);
+}
+function getAdminListUrl() {
+  return ADMINISTRATOR_ROUTE_PATHS.ADMIN_LIST;
+}
+function getAdminFormUrl(params) {
+  return compile(ADMINISTRATOR_ROUTE_PATHS.ADMIN_FORM)(params);
+}
+var _export_sfc = (sfc, props) => {
+  const target = sfc.__vccOpts || sfc;
+  for (const [key, val] of props) {
+    target[key] = val;
+  }
+  return target;
+};
+const _sfc_main$3 = defineComponent({
+  name: "AdminList",
+  components: {
+    Page,
+    DataTable,
+    BaseButton,
+    DeleteIcon,
+    EditIcon
+  },
+  setup() {
+    const { t } = useI18n();
+    const {
+      fetchEntityList: fetchAdminList,
+      isLoading: isAdminListLoading,
+      rowData: adminList,
+      errorMessage: error
+    } = useDataTable({
+      fetchEntityList: () => getAdminList(),
+      initialValue: [],
+      resourceName: "Admin list",
+      pageSize: 100
+    });
+    onMounted(() => {
+      fetchAdminList();
+    });
+    const {
+      handleResourceDelete: handleAdminDelete,
+      isDeleting
+    } = useResourceDelete({
+      deleteResource: deleteAdmin,
+      resourceName: "Admin",
+      onSuccess: fetchAdminList
+    });
+    function isBusy(adminId) {
+      return isDeleting(adminId) || isAdminListLoading.value;
+    }
+    const columnDefs = [
+      {
+        id: 1,
+        name: t("administrators:admin"),
+        field: "name"
+      },
+      {
+        id: 2,
+        name: t("administrators:email"),
+        field: "email"
+      },
+      {
+        id: 3,
+        name: t("administrators:roles"),
+        field: "roles"
+      },
+      {
+        id: 4,
+        name: t("administrators:actions"),
+        field: "actions",
+        style: { width: "180px", textAlign: "center", whiteSpace: "nowrap" },
+        headStyle: { width: "180px", textAlign: "center" }
+      }
+    ];
+    return {
+      t,
+      columnDefs,
+      rowData: adminList,
+      isRowDataLoading: isAdminListLoading,
+      errorMessage: error,
+      isBusy,
+      handleAdminDelete,
+      getAdminFormUrl
+    };
+  }
+});
+function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_EditIcon = resolveComponent("EditIcon");
+  const _component_BaseButton = resolveComponent("BaseButton");
+  const _component_DeleteIcon = resolveComponent("DeleteIcon");
+  const _component_DataTable = resolveComponent("DataTable");
+  const _component_Page = resolveComponent("Page");
+  return openBlock(), createBlock(_component_Page, {
+    title: _ctx.$i18n.t("administrators:administrators"),
+    "header-buttons": [
+      {
+        text: _ctx.$i18n.t("administrators:createAdministrator"),
+        href: _ctx.getAdminFormUrl({ adminId: "create" })
+      }
+    ]
+  }, {
+    default: withCtx(() => [
+      createVNode(_component_DataTable, {
+        "column-defs": _ctx.columnDefs,
+        "row-data": _ctx.rowData,
+        loading: _ctx.isRowDataLoading,
+        "error-message": _ctx.errorMessage
+      }, {
+        "cell(roles)": withCtx(({ row }) => [
+          createElementVNode("ul", null, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(row.roles, (role) => {
+              return openBlock(), createElementBlock("li", {
+                key: role.id
+              }, toDisplayString(role.name), 1);
+            }), 128))
+          ])
+        ]),
+        "cell(actions)": withCtx(({ row }) => [
+          !row.isSelf ? (openBlock(), createBlock(_component_BaseButton, {
+            key: 0,
+            variant: "icon",
+            title: _ctx.$i18n.t("administrators:edit"),
+            disabled: _ctx.isBusy(row.id),
+            href: _ctx.getAdminFormUrl({ adminId: row.id })
+          }, {
+            default: withCtx(() => [
+              createVNode(_component_EditIcon)
+            ]),
+            _: 2
+          }, 1032, ["title", "disabled", "href"])) : createCommentVNode("", true),
+          !row.isSuperAdmin || !row.isSelf ? (openBlock(), createBlock(_component_BaseButton, {
+            key: 1,
+            variant: "icon",
+            title: _ctx.$i18n.t("administrators:delete"),
+            disabled: _ctx.isBusy(row.id),
+            onClick: ($event) => _ctx.handleAdminDelete(row.id)
+          }, {
+            default: withCtx(() => [
+              createVNode(_component_DeleteIcon)
+            ]),
+            _: 2
+          }, 1032, ["title", "disabled", "onClick"])) : createCommentVNode("", true)
+        ]),
+        _: 1
+      }, 8, ["column-defs", "row-data", "loading", "error-message"])
+    ]),
+    _: 1
+  }, 8, ["title", "header-buttons"]);
+}
+var AdminList = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render$3]]);
+function convertAdminToFormValues(admin, roleOptionList) {
+  if (!admin) {
+    return {
+      name: "",
+      email: "",
+      password: createId(),
+      roles: []
+    };
+  }
+  const currentRoleOptionList = roleOptionList.filter((role) => admin.roles.some((roles) => roles.id === role.value));
+  return {
+    name: admin.name,
+    email: admin.email,
+    password: "",
+    roles: currentRoleOptionList
+  };
+}
+function convertFormValuesToAdminUpdatePayload(values) {
+  return {
+    name: values.name,
+    email: values.email,
+    roles: values.roles.map((role) => role.value),
+    password: values.password
+  };
+}
+function convertFormValuesToAdminCreationPayload(values) {
+  return {
+    ...convertFormValuesToAdminUpdatePayload(values)
+  };
+}
+function convertRoleListToOptions(roleList) {
+  return roleList.map((role) => ({
+    value: role.id,
+    label: role.name
+  }));
+}
+const _sfc_main$2 = defineComponent({
+  name: "AdminForm",
+  components: { Page, FormFooter, FormField, FormFieldMultiSelect },
+  setup() {
+    const { t } = useI18n();
+    const route = useRoute();
+    const router = useRouter();
+    const toast = useToast();
+    const adminId = computed(() => route.params.adminId);
+    const isCreation = computed(() => adminId.value === "create");
+    const [fetchAdmin, { data: admin, loading: isAdminLoading }] = useResource({
+      fetchResource: () => getAdmin(adminId.value),
+      initialValue: null,
+      resourceName: "Admin"
+    });
+    const [
+      fetchRoleList,
+      { data: roleList, loading: isRoleListLoading }
+    ] = useResource({
+      fetchResource: getRoleList,
+      initialValue: [],
+      resourceName: "Role list"
+    });
+    onMounted(() => {
+      fetchRoleList();
+      if (isCreation.value)
+        return;
+      fetchAdmin();
+    });
+    const roleOptionList = computed(() => convertRoleListToOptions(roleList.value));
+    const values = ref(convertAdminToFormValues(admin.value, roleOptionList.value));
+    const errors = ref({});
+    const isSubmitting = ref(false);
+    watch([admin, roleOptionList], () => {
+      values.value = convertAdminToFormValues(admin.value, roleOptionList.value);
+    });
+    function submitForm(event) {
+      if (admin.value && admin.value.isSelf)
+        return;
+      const creationBody = convertFormValuesToAdminCreationPayload(values.value);
+      const updateBody = convertFormValuesToAdminUpdatePayload(values.value);
+      const requestPromise = isCreation.value ? createAdmin(creationBody) : updateAdmin(adminId.value, updateBody);
+      requestPromise.then(({ data }) => {
+        errors.value = {};
+        if (event.type === "create") {
+          router.push(getAdminFormUrl({ adminId: data.id }));
+        }
+        if (event.type === "create_exit" || event.type === "save_exit") {
+          navigateBack(router, getAdminListUrl());
+        }
+        if (event.type === "create_create-another") {
+          values.value = convertAdminToFormValues(null, roleOptionList.value);
+        }
+        toast.show({
+          variant: "success",
+          title: t("administrators:success"),
+          body: isCreation.value ? t("administrators:adminSuccessfullyCreated") : t("administrators:adminSuccessfullyUpdated")
+        });
+      }).catch((error) => {
+        console.error(error);
+        errors.value = convertRequestErrorToMap(error);
+        toast.show({
+          variant: "danger",
+          title: t("administrators:error"),
+          body: isCreation.value ? t("administrators:adminCreationError") : t("administrators:adminUpdateError")
+        });
+      }).finally(() => {
+        isSubmitting.value = false;
+      });
+    }
+    const pageTitle = computed(() => {
+      return isCreation.value ? t("administrators:createAdmin") : `${t("administrators:updateAdmin")} "${values.value.name}"`;
+    });
+    const isContentLoading = computed(() => isAdminLoading.value || isRoleListLoading.value);
+    return {
+      t,
+      backButtonUrl: getAdminListUrl(),
+      values,
+      errors,
+      isSubmitting,
+      submitForm,
+      isContentLoading,
+      admin,
+      pageTitle,
+      isCreation,
+      roleOptionList
+    };
+  }
+});
+function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_FormField = resolveComponent("FormField");
+  const _component_FormFieldMultiSelect = resolveComponent("FormFieldMultiSelect");
+  const _component_FormFooter = resolveComponent("FormFooter");
+  const _component_Page = resolveComponent("Page");
+  return openBlock(), createBlock(_component_Page, {
+    title: _ctx.pageTitle,
+    "is-content-loading": _ctx.isContentLoading
+  }, {
+    footer: withCtx(() => [
+      createVNode(_component_FormFooter, {
+        "back-href": _ctx.backButtonUrl,
+        onSubmit: _ctx.submitForm,
+        "is-submitting": _ctx.isSubmitting,
+        "is-creation": _ctx.isCreation,
+        "can-create-another": _ctx.isCreation
+      }, null, 8, ["back-href", "onSubmit", "is-submitting", "is-creation", "can-create-another"])
+    ]),
+    default: withCtx(() => [
+      createElementVNode("form", {
+        novalidate: "",
+        onSubmit: _cache[4] || (_cache[4] = withModifiers(() => {
+        }, ["prevent"]))
+      }, [
+        createVNode(_component_FormField, {
+          value: _ctx.values.name,
+          "onUpdate:value": _cache[0] || (_cache[0] = ($event) => _ctx.values.name = $event),
+          name: "name",
+          error: _ctx.errors.name,
+          label: _ctx.$i18n.t("administrators:name")
+        }, null, 8, ["value", "error", "label"]),
+        createVNode(_component_FormField, {
+          value: _ctx.values.email,
+          "onUpdate:value": _cache[1] || (_cache[1] = ($event) => _ctx.values.email = $event),
+          name: "email",
+          error: _ctx.errors.email,
+          label: _ctx.$i18n.t("administrators:email")
+        }, null, 8, ["value", "error", "label"]),
+        createVNode(_component_FormFieldMultiSelect, {
+          "selected-options": _ctx.values.roles,
+          "onUpdate:selected-options": _cache[2] || (_cache[2] = ($event) => _ctx.values.roles = $event),
+          name: "roles",
+          label: _ctx.$i18n.t("administrators:roles"),
+          options: _ctx.roleOptionList,
+          error: _ctx.errors.roles
+        }, null, 8, ["selected-options", "label", "options", "error"]),
+        createVNode(_component_FormField, {
+          value: _ctx.values.password,
+          "onUpdate:value": _cache[3] || (_cache[3] = ($event) => _ctx.values.password = $event),
+          name: "password",
+          error: _ctx.errors.password,
+          label: _ctx.isCreation ? _ctx.$i18n.t("administrators:password") : _ctx.$i18n.t("administrators:newPassword")
+        }, null, 8, ["value", "error", "label"])
+      ], 32)
+    ]),
+    _: 1
+  }, 8, ["title", "is-content-loading"]);
+}
+var AdminForm = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["render", _sfc_render$2]]);
+var RoleList_vue_vue_type_style_index_0_lang = "";
+const _sfc_main$1 = defineComponent({
+  name: "RoleList",
+  components: {
+    Page,
+    DeleteIcon,
+    EditIcon,
+    DataTable,
+    BaseButton
+  },
+  setup() {
+    const { t } = useI18n();
+    const {
+      fetchEntityList: fetchRoleList,
+      isLoading: isRoleListLoading,
+      rowData: roleList,
+      errorMessage: error
+    } = useDataTable({
+      fetchEntityList: (params) => getRoleList(),
+      initialValue: [],
+      resourceName: "Role list",
+      pageSize: 100
+    });
+    onMounted(() => {
+      fetchRoleList();
+    });
+    const {
+      handleResourceDelete: handleRoleDelete,
+      isDeleting
+    } = useResourceDelete({
+      deleteResource: deleteRole,
+      resourceName: "Role",
+      onSuccess: fetchRoleList
+    });
+    function isBusy(roleId) {
+      return isDeleting(roleId) || isRoleListLoading.value;
+    }
+    function getScopeGroupList(scopes) {
+      const map = /* @__PURE__ */ new Map();
+      scopes.forEach((scope) => {
+        var _a;
+        const key = scope.module;
+        const value = (_a = map.get(key)) != null ? _a : [];
+        value.push(scope);
+        map.set(key, value);
+      });
+      return Array.from(map.entries()).map(([key, value]) => ({
+        module: key,
+        scopes: value
+      }));
+    }
+    function getRestScopesText(restPrivilegesCount) {
+      if (restPrivilegesCount === 1) {
+        return t("administrators:andMorePrivilege", { count: 1 });
+      }
+      if (restPrivilegesCount > 1) {
+        return t("administrators:andMorePrivilege", {
+          count: restPrivilegesCount
+        });
+      }
+      return "";
+    }
+    const columnDefs = [
+      {
+        id: 1,
+        name: t("administrators:role"),
+        field: "name"
+      },
+      {
+        id: 2,
+        name: t("administrators:privileges"),
+        field: "scope"
+      },
+      {
+        id: 3,
+        name: t("administrators:actions"),
+        field: "actions",
+        style: { width: "180px", textAlign: "center", whiteSpace: "nowrap" },
+        headStyle: { width: "180px", textAlign: "center" }
+      }
+    ];
+    return {
+      columnDefs,
+      rowData: roleList,
+      isRowDataLoading: isRoleListLoading,
+      errorMessage: error,
+      isBusy,
+      handleRoleDelete,
+      getRoleFormUrl,
+      getScopeGroupList,
+      getRestScopesText,
+      scopesPerModuleCount: 3
+    };
+  }
+});
+const _hoisted_1 = {
+  key: 0,
+  class: "no-scopes"
+};
+const _hoisted_2 = { key: 1 };
+const _hoisted_3 = { class: "module-name" };
+const _hoisted_4 = { class: "scope-list" };
+const _hoisted_5 = {
+  key: 0,
+  class: "rest-scopes-text"
+};
+function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_EditIcon = resolveComponent("EditIcon");
+  const _component_BaseButton = resolveComponent("BaseButton");
+  const _component_DeleteIcon = resolveComponent("DeleteIcon");
+  const _component_DataTable = resolveComponent("DataTable");
+  const _component_Page = resolveComponent("Page");
+  return openBlock(), createBlock(_component_Page, {
+    title: _ctx.$i18n.t("administrators:listOfRoles"),
+    "header-buttons": [
+      {
+        text: _ctx.$i18n.t("administrators:addRole"),
+        href: _ctx.getRoleFormUrl({ roleId: "create" })
+      }
+    ]
+  }, {
+    default: withCtx(() => [
+      createVNode(_component_DataTable, {
+        "column-defs": _ctx.columnDefs,
+        "row-data": _ctx.rowData,
+        loading: _ctx.isRowDataLoading,
+        "error-message": _ctx.errorMessage
+      }, {
+        "cell(scope)": withCtx(({ row }) => [
+          row.scopes.length === 0 ? (openBlock(), createElementBlock("span", _hoisted_1, toDisplayString(_ctx.$i18n.t("administrators:noPrivileges")), 1)) : createCommentVNode("", true),
+          row.isSuperAdmin ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(_ctx.$i18n.t("administrators:all")), 1)) : (openBlock(true), createElementBlock(Fragment, { key: 2 }, renderList(_ctx.getScopeGroupList(row.scopes), (scopeGroup) => {
+            return openBlock(), createElementBlock("div", {
+              key: scopeGroup.module,
+              class: "scope-group"
+            }, [
+              createElementVNode("span", _hoisted_3, toDisplayString(scopeGroup.module), 1),
+              createElementVNode("ul", _hoisted_4, [
+                (openBlock(true), createElementBlock(Fragment, null, renderList(scopeGroup.scopes.slice(0, _ctx.scopesPerModuleCount), (scope) => {
+                  return openBlock(), createElementBlock("li", {
+                    key: scope.value
+                  }, [
+                    createElementVNode("span", null, "\u2014 " + toDisplayString(scope.label), 1)
+                  ]);
+                }), 128))
+              ]),
+              scopeGroup.scopes.length > _ctx.scopesPerModuleCount ? (openBlock(), createElementBlock("span", _hoisted_5, toDisplayString(_ctx.getRestScopesText(scopeGroup.scopes.length - _ctx.scopesPerModuleCount)), 1)) : createCommentVNode("", true)
+            ]);
+          }), 128))
+        ]),
+        "cell(actions)": withCtx(({ row }) => [
+          createVNode(_component_BaseButton, {
+            variant: "icon",
+            title: _ctx.$i18n.t("administrators:edit"),
+            disabled: _ctx.isBusy(row.id),
+            href: _ctx.getRoleFormUrl({ roleId: row.id })
+          }, {
+            default: withCtx(() => [
+              createVNode(_component_EditIcon)
+            ]),
+            _: 2
+          }, 1032, ["title", "disabled", "href"]),
+          !row.isSuperAdmin ? (openBlock(), createBlock(_component_BaseButton, {
+            key: 0,
+            variant: "icon",
+            title: _ctx.$i18n.t("administrators:delete"),
+            disabled: _ctx.isBusy(row.id),
+            onClick: ($event) => _ctx.handleRoleDelete(row.id)
+          }, {
+            default: withCtx(() => [
+              createVNode(_component_DeleteIcon)
+            ]),
+            _: 2
+          }, 1032, ["title", "disabled", "onClick"])) : createCommentVNode("", true)
+        ]),
+        _: 1
+      }, 8, ["column-defs", "row-data", "loading", "error-message"])
+    ]),
+    _: 1
+  }, 8, ["title", "header-buttons"]);
+}
+var RoleList = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1]]);
+function convertRoleToFormValues(role) {
+  if (!role) {
+    return {
+      name: "",
+      scopes: [],
+      isSuperAdmin: false
+    };
+  }
+  return {
+    name: role.name,
+    scopes: role.scopes,
+    isSuperAdmin: role.isSuperAdmin
+  };
+}
+function convertFormValuesToRoleCreationPayload(values) {
+  return {
+    name: values.name,
+    scopes: values.scopes.map((scope) => scope.value)
+  };
+}
+function convertFormValuesToRoleUpdatePayload(values) {
+  return {
+    ...convertFormValuesToRoleCreationPayload(values)
+  };
+}
+function convertScopeDataToOptions(scopeData) {
+  if (!scopeData)
+    return [];
+  return scopeData.groups.map((group) => group.scopes.map((scope) => ({
+    value: scope.value,
+    label: `${group.name}: ${scope.label}`
+  }))).flat();
+}
+var RoleForm_vue_vue_type_style_index_0_scoped_true_lang = "";
+const _sfc_main = defineComponent({
+  name: "RoleForm",
+  components: { Page, FormFooter, FormField, FormFieldMultiSelect },
+  setup() {
+    const { t } = useI18n();
+    const route = useRoute();
+    const router = useRouter();
+    const toast = useToast();
+    const roleId = computed(() => route.params.roleId);
+    const isCreation = computed(() => roleId.value === "create");
+    const [fetchRole, { data: role, loading: isRoleLoading }] = useResource({
+      fetchResource: () => getRole(roleId.value),
+      initialValue: null,
+      resourceName: "Role"
+    });
+    const [
+      fetchScopeData,
+      { data: scopeData, loading: isScopeDataLoading }
+    ] = useResource({
+      fetchResource: getScopes,
+      initialValue: null,
+      resourceName: "Scope list"
+    });
+    onMounted(() => {
+      fetchScopeData();
+      if (isCreation.value)
+        return;
+      fetchRole();
+    });
+    const scopeOptionList = computed(() => convertScopeDataToOptions(scopeData.value));
+    const values = ref(convertRoleToFormValues(role.value));
+    const errors = ref({});
+    const isSubmitting = ref(false);
+    watch(role, () => {
+      values.value = convertRoleToFormValues(role.value);
+    });
+    function submitForm(event) {
+      const creationBody = convertFormValuesToRoleCreationPayload(values.value);
+      const updateBody = convertFormValuesToRoleUpdatePayload(values.value);
+      const requestPromise = isCreation.value ? createRole(creationBody) : updateRole(roleId.value, updateBody);
+      requestPromise.then(({ data }) => {
+        errors.value = {};
+        if (event.type === "create") {
+          router.push(getRoleFormUrl({ roleId: data.id }));
+        }
+        if (event.type === "create_exit" || event.type === "save_exit") {
+          navigateBack(router, getRoleListUrl());
+        }
+        if (event.type === "create_create-another") {
+          values.value = convertRoleToFormValues(null);
+        }
+        toast.show({
+          variant: "success",
+          title: t("administrators:success"),
+          body: isCreation.value ? t("administrators:roleSuccessfullyCreated") : t("administrators:roleSuccessfullyUpdate")
+        });
+      }).catch((error) => {
+        console.error(error);
+        errors.value = convertRequestErrorToMap(error);
+        toast.show({
+          variant: "danger",
+          title: t("administrators:error"),
+          body: isCreation.value ? t("administrators:roleCreationError") : t("administrators:roleUpdateError")
+        });
+      }).finally(() => {
+        isSubmitting.value = false;
+      });
+    }
+    const pageTitle = computed(() => {
+      return isCreation.value ? t("administrators:createRole") : `${t("administrators:updateRole")} "${values.value.name}"`;
+    });
+    const isContentLoading = computed(() => isRoleLoading.value || isScopeDataLoading.value);
+    return {
+      backButtonUrl: getRoleListUrl(),
+      values,
+      errors,
+      isSubmitting,
+      submitForm,
+      isContentLoading,
+      role,
+      pageTitle,
+      isCreation,
+      scopeOptionList
+    };
+  }
+});
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_FormField = resolveComponent("FormField");
+  const _component_FormFieldMultiSelect = resolveComponent("FormFieldMultiSelect");
+  const _component_FormFooter = resolveComponent("FormFooter");
+  const _component_Page = resolveComponent("Page");
+  return openBlock(), createBlock(_component_Page, {
+    title: _ctx.pageTitle,
+    "is-content-loading": _ctx.isContentLoading
+  }, {
+    footer: withCtx(() => [
+      createVNode(_component_FormFooter, {
+        "back-href": _ctx.backButtonUrl,
+        onSubmit: _ctx.submitForm,
+        "is-submitting": _ctx.isSubmitting,
+        "is-creation": _ctx.isCreation,
+        "can-create-another": _ctx.isCreation
+      }, null, 8, ["back-href", "onSubmit", "is-submitting", "is-creation", "can-create-another"])
+    ]),
+    default: withCtx(() => [
+      createElementVNode("form", {
+        novalidate: "",
+        onSubmit: _cache[2] || (_cache[2] = withModifiers(() => {
+        }, ["prevent"]))
+      }, [
+        createVNode(_component_FormField, {
+          value: _ctx.values.name,
+          "onUpdate:value": _cache[0] || (_cache[0] = ($event) => _ctx.values.name = $event),
+          name: "name",
+          error: _ctx.errors.name,
+          label: _ctx.$i18n.t("administrators:name")
+        }, null, 8, ["value", "error", "label"]),
+        !_ctx.values.isSuperAdmin ? (openBlock(), createBlock(_component_FormFieldMultiSelect, {
+          key: 0,
+          "selected-options": _ctx.values.scopes,
+          "onUpdate:selected-options": _cache[1] || (_cache[1] = ($event) => _ctx.values.scopes = $event),
+          name: "scopes",
+          label: _ctx.$i18n.t("administrators:privileges"),
+          options: _ctx.scopeOptionList,
+          error: _ctx.errors.scopes
+        }, null, 8, ["selected-options", "label", "options", "error"])) : createCommentVNode("", true)
+      ], 32)
+    ]),
+    _: 1
+  }, 8, ["title", "is-content-loading"]);
+}
+var RoleForm = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-501ddc14"]]);
+const ADMIN_LIST_ROUTE = {
+  path: ADMINISTRATOR_ROUTE_PATHS.ADMIN_LIST,
+  component: AdminList,
+  name: "AdminList",
+  meta: {
+    getBreadcrumbs: (route, i18n2) => [
+      { url: "/", text: i18n2.t("administrators:home") },
+      {
+        url: ADMINISTRATOR_ROUTE_PATHS.ADMIN_LIST,
+        text: i18n2.t("administrators:adminList")
+      }
+    ]
+  }
+};
+const ADMIN_FORM_ROUTE = {
+  path: ADMINISTRATOR_ROUTE_PATHS.ADMIN_FORM,
+  component: AdminForm,
+  name: "AdminForm",
+  meta: {
+    getBreadcrumbs: (route, i18n2) => [
+      { url: "/", text: i18n2.t("administrators:home") },
+      {
+        url: ADMINISTRATOR_ROUTE_PATHS.ADMIN_LIST,
+        text: i18n2.t("administrators:adminList")
+      },
+      { url: route.path, text: i18n2.t("administrators:adminForm") }
+    ]
+  }
+};
+const ROLE_LIST_ROUTE = {
+  path: ADMINISTRATOR_ROUTE_PATHS.ROLE_LIST,
+  component: RoleList,
+  name: "RoleList",
+  meta: {
+    getBreadcrumbs: (route, i18n2) => [
+      { url: "/", text: i18n2.t("administrators:home") },
+      {
+        url: ADMINISTRATOR_ROUTE_PATHS.ROLE_LIST,
+        text: i18n2.t("administrators:roleList")
+      }
+    ]
+  }
+};
+const ROLE_FORM_ROUTE = {
+  path: ADMINISTRATOR_ROUTE_PATHS.ROLE_FORM,
+  component: RoleForm,
+  name: "RoleForm",
+  meta: {
+    getBreadcrumbs: (route, i18n2) => [
+      { url: "/", text: i18n2.t("administrators:home") },
+      {
+        url: ADMINISTRATOR_ROUTE_PATHS.ROLE_LIST,
+        text: i18n2.t("administrators:roleList")
+      },
+      { url: route.path, text: i18n2.t("administrators:roleForm") }
+    ]
+  }
+};
+applyTranslations();
+export { ADMIN_FORM_ROUTE, ADMIN_LIST_ROUTE, ROLE_FORM_ROUTE, ROLE_LIST_ROUTE, createAdmin, createRole, deleteAdmin, deleteRole, getAdmin, getAdminFormUrl, getAdminList, getAdminListUrl, getRole, getRoleFormUrl, getRoleList, getRoleListUrl, getScopes, updateAdmin, updateRole };