diff --git a/src/constants/annotations.ts b/src/constants/annotations.ts
new file mode 100644
index 00000000..7a530f24
--- /dev/null
+++ b/src/constants/annotations.ts
@@ -0,0 +1,12 @@
+// plugin
+export enum pluginAnnotations {
+  DISPLAY_NAME = "plugin.halo.run/display-name",
+}
+
+// rbac
+export enum rbacAnnotations {
+  MODULE = "rbac.authorization.halo.run/module",
+  ROLE_NAMES = "rbac.authorization.halo.run/role-names",
+  DISPLAY_NAME = "rbac.authorization.halo.run/display-name",
+  DEPENDENCIES = "rbac.authorization.halo.run/dependencies",
+}
diff --git a/src/constants/labels.ts b/src/constants/labels.ts
new file mode 100644
index 00000000..e8844916
--- /dev/null
+++ b/src/constants/labels.ts
@@ -0,0 +1,9 @@
+// plugin
+export enum pluginLabels {
+  NAME = "plugin.halo.run/plugin-name",
+}
+
+// role
+export enum roleLabels {
+  TEMPLATE = "halo.run/role-template",
+}
diff --git a/src/modules/interface/themes/ThemeDetail.vue b/src/modules/interface/themes/ThemeDetail.vue
index 3aaec347..f1e90f5c 100644
--- a/src/modules/interface/themes/ThemeDetail.vue
+++ b/src/modules/interface/themes/ThemeDetail.vue
@@ -354,16 +354,18 @@ onMounted(handleFetchThemes);
         </div>
       </div>
 
-      <div v-if="themeActiveId === 'settings'">
-        <FormKit id="theme-setting-form" :actions="false" type="form">
-          <FormKit label="侧边栏宽度" type="text"></FormKit>
-          <FormKit label="侧边栏背景图" type="text"></FormKit>
-          <FormKit label="右上角图标" type="text"></FormKit>
-          <FormKit label="文章代码高亮语言" type="text"></FormKit>
-        </FormKit>
+      <div v-if="themeActiveId === 'settings'" class="p-4 sm:px-6">
+        <div class="w-1/3">
+          <FormKit id="theme-setting-form" :actions="false" type="form">
+            <FormKit label="侧边栏宽度" type="text"></FormKit>
+            <FormKit label="侧边栏背景图" type="text"></FormKit>
+            <FormKit label="右上角图标" type="text"></FormKit>
+            <FormKit label="文章代码高亮语言" type="text"></FormKit>
+          </FormKit>
+        </div>
 
         <div class="pt-5">
-          <div class="flex justify-start p-4">
+          <div class="flex justify-start">
             <VButton type="secondary"> 保存</VButton>
           </div>
         </div>
diff --git a/src/modules/system/plugins/PluginDetail.vue b/src/modules/system/plugins/PluginDetail.vue
index e3a40b6b..7714d974 100644
--- a/src/modules/system/plugins/PluginDetail.vue
+++ b/src/modules/system/plugins/PluginDetail.vue
@@ -12,14 +12,16 @@ import { useRoute } from "vue-router";
 import { computed, onMounted, ref } from "vue";
 import { apiClient } from "@halo-dev/admin-shared";
 import type {
-  Plugin,
   ConfigMap,
+  Plugin,
+  Role,
   Setting,
   SettingSpec,
-  Role,
 } from "@halo-dev/api-client";
 import cloneDeep from "lodash.clonedeep";
 import type { FormKitSchemaCondition, FormKitSchemaNode } from "@formkit/core";
+import { pluginLabels } from "@/constants/labels";
+import { rbacAnnotations } from "@/constants/annotations";
 
 interface FormKitSettingSpec extends Omit<SettingSpec, "formSchema"> {
   formSchema: FormKitSchemaCondition | FormKitSchemaNode[];
@@ -195,8 +197,7 @@ const handleFetchRoles = async () => {
 const pluginRoleTemplates = computed(() => {
   return roles.value.filter((item) => {
     return (
-      item.metadata.labels?.["plugin.halo.run/plugin-name"] ===
-      plugin.value.metadata.name
+      item.metadata.labels?.[pluginLabels.NAME] === plugin.value.metadata.name
     );
   });
 });
@@ -206,15 +207,13 @@ const pluginRoleTemplateGroups = computed<RoleTemplateGroup[]>(() => {
   pluginRoleTemplates.value.forEach((role) => {
     const group = groups.find(
       (group) =>
-        group.module ===
-        role.metadata.annotations?.["rbac.authorization.halo.run/module"]
+        group.module === role.metadata.annotations?.[rbacAnnotations.MODULE]
     );
     if (group) {
       group.roles.push(role);
     } else {
       groups.push({
-        module:
-          role.metadata.annotations?.["rbac.authorization.halo.run/module"],
+        module: role.metadata.annotations?.[rbacAnnotations.MODULE],
         roles: [role],
       });
     }
@@ -370,14 +369,14 @@ onMounted(() => {
                               <span class="font-medium text-gray-900">
                                 {{
                                   role.metadata.annotations?.[
-                                    "rbac.authorization.halo.run/display-name"
+                                    rbacAnnotations.DISPLAY_NAME
                                   ]
                                 }}
                               </span>
                               <span
                                 v-if="
                                   role.metadata.annotations?.[
-                                    'rbac.authorization.halo.run/dependencies'
+                                    rbacAnnotations.DEPENDENCIES
                                   ]
                                 "
                                 class="text-xs text-gray-400"
@@ -386,7 +385,7 @@ onMounted(() => {
                                 {{
                                   JSON.parse(
                                     role.metadata.annotations?.[
-                                      "rbac.authorization.halo.run/dependencies"
+                                      rbacAnnotations.DEPENDENCIES
                                     ]
                                   ).join(", ")
                                 }}
diff --git a/src/modules/system/roles/RoleDetail.vue b/src/modules/system/roles/RoleDetail.vue
index 585c3b34..694c18d5 100644
--- a/src/modules/system/roles/RoleDetail.vue
+++ b/src/modules/system/roles/RoleDetail.vue
@@ -13,6 +13,8 @@ import { useRoute, useRouter } from "vue-router";
 import { computed, onMounted, ref } from "vue";
 import { apiClient } from "@halo-dev/admin-shared";
 import type { Role, User } from "@halo-dev/api-client";
+import { pluginLabels, roleLabels } from "@/constants/labels";
+import { rbacAnnotations } from "@/constants/annotations";
 
 interface RoleTemplateGroup {
   module: string | null | undefined;
@@ -38,8 +40,8 @@ const formState = ref<FormState>({
       name: "",
       labels: {},
       annotations: {
-        "rbac.authorization.halo.run/dependencies": "",
-        "rbac.authorization.halo.run/display-name": "",
+        [rbacAnnotations.DEPENDENCIES]: "",
+        [rbacAnnotations.DISPLAY_NAME]: "",
       },
     },
     rules: [],
@@ -51,7 +53,7 @@ const formState = ref<FormState>({
 const roleTemplates = computed<Role[]>(() => {
   return roles.value.filter(
     (role) =>
-      role.metadata.labels?.["halo.run/role-template"] === "true" &&
+      role.metadata.labels?.[roleLabels.TEMPLATE] === "true" &&
       role.metadata.labels?.["halo.run/hidden"] !== "true"
   );
 });
@@ -61,15 +63,13 @@ const roleTemplateGroups = computed<RoleTemplateGroup[]>(() => {
   roleTemplates.value.forEach((role) => {
     const group = groups.find(
       (group) =>
-        group.module ===
-        role.metadata.annotations?.["rbac.authorization.halo.run/module"]
+        group.module === role.metadata.annotations?.[rbacAnnotations.MODULE]
     );
     if (group) {
       group.roles.push(role);
     } else {
       groups.push({
-        module:
-          role.metadata.annotations?.["rbac.authorization.halo.run/module"],
+        module: role.metadata.annotations?.[rbacAnnotations.MODULE],
         roles: [role],
       });
     }
@@ -84,9 +84,7 @@ const handleFetchRole = async () => {
     );
     formState.value.role = response.data;
     formState.value.selectedRoleTemplates = JSON.parse(
-      response.data.metadata.annotations?.[
-        "rbac.authorization.halo.run/dependencies"
-      ] || "[]"
+      response.data.metadata.annotations?.[rbacAnnotations.DEPENDENCIES] || "[]"
     );
   } catch (error) {
     console.error(error);
@@ -115,9 +113,8 @@ const handleUpdateRole = async () => {
   try {
     formState.value.saving = true;
     if (formState.value.role.metadata.annotations) {
-      formState.value.role.metadata.annotations[
-        "rbac.authorization.halo.run/dependencies"
-      ] = JSON.stringify(formState.value.selectedRoleTemplates);
+      formState.value.role.metadata.annotations[rbacAnnotations.DEPENDENCIES] =
+        JSON.stringify(formState.value.selectedRoleTemplates);
     }
     await apiClient.extension.role.updatev1alpha1Role(
       route.params.name as string,
@@ -146,7 +143,7 @@ onMounted(() => {
 <template>
   <VPageHeader
     :title="`角色：${
-      formState.role?.metadata?.annotations?.['plugin.halo.run/display-name'] ||
+      formState.role?.metadata?.annotations?.[rbacAnnotations.DISPLAY_NAME] ||
       formState.role?.metadata?.name
     }`"
   >
@@ -193,7 +190,7 @@ onMounted(() => {
               <dd class="mt-1 text-sm text-gray-900 sm:col-span-2 sm:mt-0">
                 {{
                   formState.role?.metadata?.annotations?.[
-                    "plugin.halo.run/display-name"
+                    rbacAnnotations.DISPLAY_NAME
                   ] || formState.role?.metadata?.name
                 }}
               </dd>
@@ -299,7 +296,31 @@ onMounted(() => {
               class="bg-white px-4 py-5 hover:bg-gray-50 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6"
             >
               <dt class="text-sm font-medium text-gray-900">
-                {{ group.module }}
+                <div>
+                  {{ group.module }}
+                </div>
+                <div
+                  v-if="
+                    group.roles.length &&
+                    group.roles[0].metadata.labels?.[pluginLabels.NAME]
+                  "
+                  class="mt-3 text-xs text-gray-500"
+                >
+                  由
+                  <RouterLink
+                    :to="{
+                      name: 'PluginDetail',
+                      params: {
+                        pluginName:
+                          group.roles[0].metadata.labels?.[pluginLabels.NAME],
+                      },
+                    }"
+                    class="hover:text-blue-600"
+                  >
+                    {{ group.roles[0].metadata.labels?.[pluginLabels.NAME] }}
+                  </RouterLink>
+                  插件提供
+                </div>
               </dt>
               <dd class="mt-1 text-sm text-gray-900 sm:col-span-2 sm:mt-0">
                 <ul class="space-y-2">
@@ -317,14 +338,14 @@ onMounted(() => {
                         <span class="font-medium text-gray-900">
                           {{
                             role.metadata.annotations?.[
-                              "rbac.authorization.halo.run/display-name"
+                              rbacAnnotations.DISPLAY_NAME
                             ]
                           }}
                         </span>
                         <span
                           v-if="
                             role.metadata.annotations?.[
-                              'rbac.authorization.halo.run/dependencies'
+                              rbacAnnotations.DEPENDENCIES
                             ]
                           "
                           class="text-xs text-gray-400"
@@ -333,7 +354,7 @@ onMounted(() => {
                           {{
                             JSON.parse(
                               role.metadata.annotations?.[
-                                "rbac.authorization.halo.run/dependencies"
+                                rbacAnnotations.DEPENDENCIES
                               ]
                             ).join(", ")
                           }}
diff --git a/src/modules/system/roles/RoleList.vue b/src/modules/system/roles/RoleList.vue
index 7c42052f..5e80ff71 100644
--- a/src/modules/system/roles/RoleList.vue
+++ b/src/modules/system/roles/RoleList.vue
@@ -16,13 +16,15 @@ import { useRouter } from "vue-router";
 import { computed, onMounted, ref } from "vue";
 import type { Role } from "@halo-dev/api-client";
 import { apiClient } from "@halo-dev/admin-shared";
+import { roleLabels } from "@/constants/labels";
+import { pluginAnnotations } from "@/constants/annotations";
 
 const createVisible = ref(false);
 const roles = ref<Role[]>([]);
 
 const basicRoles = computed(() => {
   return roles.value.filter(
-    (role) => role.metadata?.labels?.["halo.run/role-template"] !== "true"
+    (role) => role.metadata?.labels?.[roleLabels.TEMPLATE] !== "true"
   );
 });
 
@@ -179,7 +181,7 @@ onMounted(() => {
                   <span class="mr-2 truncate text-sm font-medium text-gray-900">
                     {{
                       role.metadata.annotations?.[
-                        "plugin.halo.run/display-name"
+                        pluginAnnotations.DISPLAY_NAME
                       ] || role.metadata.name
                     }}
                   </span>
diff --git a/src/modules/system/roles/components/RoleCreationModal.vue b/src/modules/system/roles/components/RoleCreationModal.vue
index 1d627762..bfbc79a8 100644
--- a/src/modules/system/roles/components/RoleCreationModal.vue
+++ b/src/modules/system/roles/components/RoleCreationModal.vue
@@ -3,6 +3,8 @@ import { VButton, VModal, VTabItem, VTabs } from "@halo-dev/components";
 import { computed, ref, watch } from "vue";
 import { apiClient } from "@halo-dev/admin-shared";
 import type { Role } from "@halo-dev/api-client";
+import { rbacAnnotations } from "@/constants/annotations";
+import { roleLabels } from "@/constants/labels";
 
 interface RoleTemplateGroup {
   module: string | null | undefined;
@@ -34,8 +36,8 @@ const creationFormState = ref<CreationFormState>({
       name: "",
       labels: {},
       annotations: {
-        "rbac.authorization.halo.run/dependencies": "",
-        "rbac.authorization.halo.run/display-name": "",
+        [rbacAnnotations.DEPENDENCIES]: "",
+        [rbacAnnotations.DISPLAY_NAME]: "",
       }!,
     },
     rules: [],
@@ -47,7 +49,7 @@ const creationFormState = ref<CreationFormState>({
 const roleTemplates = computed<Role[]>(() => {
   return roles.value.filter(
     (role) =>
-      role.metadata.labels?.["halo.run/role-template"] === "true" &&
+      role.metadata.labels?.[roleLabels.TEMPLATE] === "true" &&
       role.metadata.labels?.["halo.run/hidden"] !== "true"
   );
 });
@@ -57,15 +59,13 @@ const roleTemplateGroups = computed<RoleTemplateGroup[]>(() => {
   roleTemplates.value.forEach((role) => {
     const group = groups.find(
       (group) =>
-        group.module ===
-        role.metadata.annotations?.["rbac.authorization.halo.run/module"]
+        group.module === role.metadata.annotations?.[rbacAnnotations.MODULE]
     );
     if (group) {
       group.roles.push(role);
     } else {
       groups.push({
-        module:
-          role.metadata.annotations?.["rbac.authorization.halo.run/module"],
+        module: role.metadata.annotations?.[rbacAnnotations.MODULE],
         roles: [role],
       });
     }
@@ -87,7 +87,7 @@ const handleCreateRole = async () => {
     creationFormState.value.saving = true;
     if (creationFormState.value.role.metadata.annotations) {
       creationFormState.value.role.metadata.annotations[
-        "rbac.authorization.halo.run/dependencies"
+        rbacAnnotations.DEPENDENCIES
       ] = JSON.stringify(creationFormState.value.selectedRoleTemplates);
     }
     await apiClient.extension.role.createv1alpha1Role(
@@ -136,7 +136,7 @@ watch(
           <FormKit
             v-model="
               creationFormState.role.metadata.annotations[
-                'rbac.authorization.halo.run/display-name'
+                rbacAnnotations.DISPLAY_NAME
               ]
             "
             label="名称"
@@ -178,14 +178,14 @@ watch(
                         <span class="font-medium text-gray-900">
                           {{
                             role.metadata.annotations?.[
-                              "rbac.authorization.halo.run/display-name"
+                              rbacAnnotations.DISPLAY_NAME
                             ]
                           }}
                         </span>
                         <span
                           v-if="
                             role.metadata.annotations?.[
-                              'rbac.authorization.halo.run/dependencies'
+                              rbacAnnotations.DEPENDENCIES
                             ]
                           "
                           class="text-xs text-gray-400"
@@ -194,7 +194,7 @@ watch(
                           {{
                             JSON.parse(
                               role.metadata.annotations?.[
-                                "rbac.authorization.halo.run/dependencies"
+                                rbacAnnotations.DEPENDENCIES
                               ]
                             ).join(", ")
                           }}
diff --git a/src/modules/system/users/UserDetail.vue b/src/modules/system/users/UserDetail.vue
index 1be55afb..a9d913cb 100644
--- a/src/modules/system/users/UserDetail.vue
+++ b/src/modules/system/users/UserDetail.vue
@@ -4,14 +4,13 @@ import type { Ref } from "vue";
 import { computed, inject } from "vue";
 import { useRouter } from "vue-router";
 import type { User } from "@halo-dev/api-client";
+import { rbacAnnotations } from "@/constants/annotations";
 
 const user = inject<Ref<User>>("user");
 
 const roles = computed(() => {
   return JSON.parse(
-    user?.value?.metadata?.annotations?.[
-      "rbac.authorization.halo.run/role-names"
-    ] || "[]"
+    user?.value?.metadata?.annotations?.[rbacAnnotations.ROLE_NAMES] || "[]"
   );
 });
 
diff --git a/src/modules/system/users/UserList.vue b/src/modules/system/users/UserList.vue
index de3d7f6d..319c12dd 100644
--- a/src/modules/system/users/UserList.vue
+++ b/src/modules/system/users/UserList.vue
@@ -16,8 +16,8 @@ import UserEditingModal from "./components/UserEditingModal.vue";
 import UserPasswordChangeModal from "./components/UserPasswordChangeModal.vue";
 import { onMounted, ref } from "vue";
 import { apiClient } from "@halo-dev/admin-shared";
-import type { User } from "@halo-dev/api-client";
-import type { UserList } from "@halo-dev/api-client";
+import type { User, UserList } from "@halo-dev/api-client";
+import { rbacAnnotations } from "@/constants/annotations";
 
 const checkAll = ref(false);
 const editingModal = ref<boolean>(false);
@@ -72,8 +72,7 @@ const handleOpenPasswordChangeModal = (user: User) => {
 
 const getRoles = (user: User) => {
   return JSON.parse(
-    user.metadata.annotations?.["rbac.authorization.halo.run/role-names"] ||
-      "[]"
+    user.metadata.annotations?.[rbacAnnotations.ROLE_NAMES] || "[]"
   );
 };
 
diff --git a/src/modules/system/users/components/UserEditingModal.vue b/src/modules/system/users/components/UserEditingModal.vue
index 6fdec97a..ce5497a5 100644
--- a/src/modules/system/users/components/UserEditingModal.vue
+++ b/src/modules/system/users/components/UserEditingModal.vue
@@ -5,6 +5,8 @@ import { apiClient } from "@halo-dev/admin-shared";
 import type { Role, User } from "@halo-dev/api-client";
 import { IconSave, VButton, VModal } from "@halo-dev/components";
 import { v4 as uuid } from "uuid";
+import { roleLabels } from "@/constants/labels";
+import { rbacAnnotations } from "@/constants/annotations";
 
 const props = defineProps({
   visible: {
@@ -57,7 +59,7 @@ const creationModalTitle = computed(() => {
 
 const basicRoles = computed(() => {
   return roles.value.filter(
-    (role) => role.metadata?.labels?.["halo.run/role-template"] !== "true"
+    (role) => role.metadata?.labels?.[roleLabels.TEMPLATE] !== "true"
   );
 });
 
@@ -150,7 +152,7 @@ onMounted(handleFetchRoles);
         :options="
           basicRoles.map((role:Role) => {
             return {
-              label: role.metadata?.annotations?.['plugin.halo.run/display-name'] || role.metadata.name,
+              label: role.metadata?.annotations?.[rbacAnnotations.DISPLAY_NAME] || role.metadata.name,
               value: role.metadata?.name,
             };
           })