diff --git a/frontend/.env b/frontend/.env
index edcf512..cbc4b2d 100644
--- a/frontend/.env
+++ b/frontend/.env
@@ -1,11 +1,11 @@
 VITE_APP_PORT=5173
 VITE_SOURCE_MAP=true
 # mock
-#ITE_ENABLE_MOCK=true
-#VITE_BASE_URL=http://localhost:5173
+VITE_ENABLE_MOCK=true
+VITE_BASE_URL=http://localhost:5173
 # local
-VITE_ENABLE_MOCK=false
-VITE_BASE_URL=http://localhost:8080
+#VITE_ENABLE_MOCK=false
+#VITE_BASE_URL=http://localhost:8080
 # dev
 #VITE_ENABLE_MOCK=false
 #VITE_BASE_URL=https://localhost/api
diff --git a/frontend/src/api/mocks/departmentHandlers.ts b/frontend/src/api/mocks/departmentHandlers.ts
index 674f99a..1fd7e48 100644
--- a/frontend/src/api/mocks/departmentHandlers.ts
+++ b/frontend/src/api/mocks/departmentHandlers.ts
@@ -16,7 +16,7 @@ export default [
 		};
 		return HttpResponse.json(mockData);
 	}),
-	http.get("/department/query", () => {
+	http.get("/department/query-available", () => {
 		const generateDepartment = () => ({
 			id: faker.number.int({ min: 1, max: 30 }),
 			name: faker.company.name(),
diff --git a/frontend/src/components/Breadcrumbs.vue b/frontend/src/components/Breadcrumbs.vue
index 7cb9c5e..532eb65 100644
--- a/frontend/src/components/Breadcrumbs.vue
+++ b/frontend/src/components/Breadcrumbs.vue
@@ -3,7 +3,7 @@
     <ol class="inline-flex items-center space-x-1 text-sm font-medium md:space-x-2">
       <li class="inline-flex items-center">
         <RouterLink :to="{name: RouteName.USERVIEW}"
-          class="inline-flex items-center text-gray-700 hover:text-primary-600 dark:text-gray-300 dark:hover:text-white">
+          class="inline-flex items-center text-gray-700 hover:text-primary-600  ">
           <svg class="w-5 h-5 mr-2.5" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
             <path
               d="M10.707 2.293a1 1 0 00-1.414 0l-7 7a1 1 0 001.414 1.414L4 10.414V17a1 1 0 001 1h2a1 1 0 001-1v-2a1 1 0 011-1h2a1 1 0 011 1v2a1 1 0 001 1h2a1 1 0 001-1v-6.586l.293.293a1 1 0 001.414-1.414l-7-7z">
@@ -19,7 +19,7 @@
               d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z"
               clip-rule="evenodd"></path>
           </svg>
-          <span class="ml-1 text-gray-400 hover:text-primary-600 md:ml-2 dark:text-gray-500 dark:hover:text-white">{{
+          <span class="ml-1 text-gray-400 hover:text-primary-600 md:ml-2  ">{{
             name }}</span>
         </div>
       </li>
diff --git a/frontend/src/components/DepartmentUpsertModal.vue b/frontend/src/components/DepartmentUpsertModal.vue
index 0af8188..ab937e2 100644
--- a/frontend/src/components/DepartmentUpsertModal.vue
+++ b/frontend/src/components/DepartmentUpsertModal.vue
@@ -2,18 +2,17 @@
 
   <!-- Main modal -->
   <div id="user-upsert-modal" tabindex="-1" aria-hidden="true"
-    class="bg-gray-900/50 dark:bg-gray-900/80 hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full">
+    class="bg-gray-900/50 /80 hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full">
     <div class="relative p-4 w-full max-w-md max-h-full">
       <!-- Modal content -->
-      <div class="relative bg-white rounded-lg shadow-sm dark:bg-gray-700">
+      <div class="relative bg-white rounded-lg shadow-sm ">
         <!-- Modal header -->
-        <div
-          class="flex items-center justify-between p-4 md:p-5 border-b rounded-t dark:border-gray-600 border-gray-200">
-          <h3 class="text-lg font-semibold text-gray-900 dark:text-white">
+        <div class="flex items-center justify-between p-4 md:p-5 border-b rounded-t  border-gray-200">
+          <h3 class="text-lg font-semibold text-gray-900 ">
             部门管理
           </h3>
           <button type="button" @click="closeModal"
-            class="text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm w-8 h-8 ms-auto inline-flex justify-center items-center dark:hover:bg-gray-600 dark:hover:text-white">
+            class="text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm w-8 h-8 ms-auto inline-flex justify-center items-center  ">
             <svg class="w-3 h-3" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 14">
               <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                 d="m1 1 6 6m0 0 6 6M7 7l6-6M7 7l-6 6" />
@@ -25,15 +24,15 @@
         <div class="p-4 md:p-5">
           <div class="grid gap-4 mb-4 grid-cols-2">
             <div class="col-span-2">
-              <label for="name" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">部门名称</label>
+              <label for="name" class="block mb-2 text-sm font-medium text-gray-900 ">部门名称</label>
               <input type="text" id="name" v-model="formData.name"
-                class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+                class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5      "
                 required />
             </div>
             <div class="col-span-2">
-              <label for="category" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">上级部门</label>
+              <label for="category" class="block mb-2 text-sm font-medium text-gray-900 ">上级部门</label>
               <select id="category" v-model="formData.parentId"
-                class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500">
+                class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5      ">
                 <option v-for="department in availableDepartments" :key="department.id" :value="department.id"
                   :selected="department.id === formData.parentId">{{
                   department.name
@@ -42,7 +41,7 @@
             </div>
           </div>
           <button type="submit" @click="handleSubmit"
-            class="text-white flex items-center bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800 self-start mt-5">
+            class="text-white flex items-center bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center    self-start mt-5">
             保存
           </button>
         </div>
diff --git a/frontend/src/components/Headbar.vue b/frontend/src/components/Headbar.vue
index 62263f7..253ef83 100644
--- a/frontend/src/components/Headbar.vue
+++ b/frontend/src/components/Headbar.vue
@@ -1,11 +1,11 @@
 <template>
-  <nav class="fixed top-0 z-40 w-full bg-white border-b border-gray-200 dark:bg-gray-800 dark:border-gray-700">
+  <nav class="fixed top-0 z-40 w-full bg-white border-b border-gray-200  ">
     <div class="px-3 py-3 lg:px-5 lg:pl-3">
       <div class="flex items-center justify-between">
         <div class="flex items-center justify-start rtl:justify-end">
           <button data-drawer-target="logo-sidebar" data-drawer-toggle="logo-sidebar" aria-controls="logo-sidebar"
             type="button"
-            class="inline-flex items-center p-2 text-sm text-gray-500 rounded-lg sm:hidden hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-gray-200 dark:text-gray-400 dark:hover:bg-gray-700 dark:focus:ring-gray-600">
+            class="inline-flex items-center p-2 text-sm text-gray-500 rounded-lg sm:hidden hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-gray-200   ">
             <span class="sr-only">Open sidebar</span>
             <svg class="w-6 h-6" aria-hidden="true" fill="currentColor" viewBox="0 0 20 20"
               xmlns="http://www.w3.org/2000/svg">
@@ -15,16 +15,15 @@
             </svg>
           </button>
           <a href="https://github.com/ccmjga/zhilu-admin" target="_blank" class="flex ms-2 md:me-24">
-            <span class="self-center text-xl font-semibold sm:text-2xl whitespace-nowrap dark:text-white">知路后台管理</span>
+            <span class="self-center text-xl font-semibold sm:text-2xl whitespace-nowrap ">知路后台管理</span>
           </a>
         </div>
         <div class="flex items-center space-x-3">
           <a href="https://github.com/ccmjga/zhilu-admin" target="_blank"
             class="flex items-center border rounded-sm border-gray-300">
             <span class=" bg-gray-200 rounded-r-none border-r border-r-gray-300">
-              <svg class="me-0.5 inline pl-1.5 pb-1 w-6 h-6 text-gray-800 dark:text-white bg-gray-200 "
-                aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"
-                viewBox="0 0 24 24">
+              <svg class="me-0.5 inline pl-1.5 pb-1 w-6 h-6 text-gray-800  bg-gray-200 " aria-hidden="true"
+                xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
                 <path stroke="currentColor" stroke-width="2"
                   d="M11.083 5.104c.35-.8 1.485-.8 1.834 0l1.752 4.022a1 1 0 0 0 .84.597l4.463.342c.9.069 1.255 1.2.556 1.771l-3.33 2.723a1 1 0 0 0-.337 1.016l1.03 4.119c.214.858-.71 1.552-1.474 1.106l-3.913-2.281a1 1 0 0 0-1.008 0L7.583 20.8c-.764.446-1.688-.248-1.474-1.106l1.03-4.119A1 1 0 0 0 6.8 14.56l-3.33-2.723c-.698-.571-.342-1.702.557-1.771l4.462-.342a1 1 0 0 0 .84-.597l1.753-4.022Z" />
               </svg>
@@ -50,17 +49,16 @@
           <div class="flex items-center ms-3">
             <div>
               <button type="button" id="dropdown-button"
-                class="flex text-sm bg-gray-800 rounded-full focus:ring-4 focus:ring-gray-300 dark:focus:ring-gray-600"
-                aria-expanded="false" data-dropdown-toggle="dropdown-user">
+                class="flex text-sm bg-gray-800 rounded-full focus:ring-4 focus:ring-gray-300 " aria-expanded="false"
+                data-dropdown-toggle="dropdown-user">
                 <span class="sr-only">Open user menu</span>
                 <img class="w-8 h-8 rounded-full" src="/public/trump.jpg" alt="user photo">
               </button>
             </div>
-            <div
-              class="z-50 hidden my-4 text-base list-none bg-white divide-y divide-gray-100 rounded-sm shadow-sm dark:bg-gray-700 dark:divide-gray-600"
+            <div class="z-50 hidden my-4 text-base list-none bg-white divide-y divide-gray-100 rounded-sm shadow-sm  "
               id="dropdown-user">
               <div class="px-4 py-3" role="none">
-                <p class="text-sm font-medium text-gray-900 truncate dark:text-gray-300" role="none">
+                <p class="text-sm font-medium text-gray-900 truncate " role="none">
                   {{ user.username }}
                 </p>
               </div>
@@ -69,21 +67,19 @@
                   <button @click="() => {
                     userDropDownMenu?.toggle()
                     router.push(RouteName.SETTINGS)
-                  }"
-                    class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-600 dark:hover:text-white"
+                  }" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100   "
                     role="menuitem">Settings</button>
                 </li>
                 <li>
                   <button @click="() => {
                     userDropDownMenu?.toggle()
                     router.push(RouteName.USERVIEW)
-                  }"
-                    class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-600 dark:hover:text-white"
+                  }" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100   "
                     role="menuitem">Dashboard</button>
                 </li>
                 <li>
                   <button @click="handleLogoutClick"
-                    class="flex items-center space-x-1 block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-600 dark:hover:text-white"
+                    class="flex items-center space-x-1 block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100   "
                     role="menuitem">
                     <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor"
                       stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
diff --git a/frontend/src/components/PermissionUpsertModal.vue b/frontend/src/components/PermissionUpsertModal.vue
index effa53f..f468a5c 100644
--- a/frontend/src/components/PermissionUpsertModal.vue
+++ b/frontend/src/components/PermissionUpsertModal.vue
@@ -1,11 +1,10 @@
 <template>
   <div :id tabindex="-1" aria-hidden="true"
-    class="bg-gray-900/50 dark:bg-gray-900/80 hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full">
+    class="bg-gray-900/50 /80 hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full">
     <div class="relative p-4 w-full max-w-md max-h-full">
-      <div class="relative bg-white rounded-lg shadow-sm dark:bg-gray-700">
-        <div
-          class="flex items-center justify-between p-4 md:p-5 border-b rounded-t dark:border-gray-600 border-gray-200">
-          <h3 class="text-lg font-semibold text-gray-900 dark:text-white">
+      <div class="relative bg-white rounded-lg shadow-sm ">
+        <div class="flex items-center justify-between p-4 md:p-5 border-b rounded-t  border-gray-200">
+          <h3 class="text-lg font-semibold text-gray-900 ">
             权限管理
           </h3>
           <button type="button" @click="closeModal"
@@ -20,13 +19,13 @@
         <div class="p-4 md:p-5">
           <div class="grid gap-4 mb-4 grid-cols-2">
             <div class="col-span-2">
-              <label for="name" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">权限名称</label>
+              <label for="name" class="block mb-2 text-sm font-medium text-gray-900 ">权限名称</label>
               <input type="text" name="权限名称" id="name" v-model="formData.name"
                 class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5"
                 required="true">
             </div>
             <div class="col-span-2">
-              <label for="code" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">权限编码</label>
+              <label for="code" class="block mb-2 text-sm font-medium text-gray-900 ">权限编码</label>
               <input type="text" id="code" v-model="formData.code"
                 class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5"
                 required />
diff --git a/frontend/src/components/PopupModal.vue b/frontend/src/components/PopupModal.vue
index a1da435..53be8ac 100644
--- a/frontend/src/components/PopupModal.vue
+++ b/frontend/src/components/PopupModal.vue
@@ -1,10 +1,10 @@
 <template>
   <div :id tabindex="-1"
-    class="bg-gray-900/50 dark:bg-gray-900/80 hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full">
+    class="bg-gray-900/50 /80 hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full">
     <div class="relative p-4 w-full max-w-md max-h-full">
-      <div class="relative bg-white rounded-lg shadow-sm dark:bg-gray-700">
+      <div class="relative bg-white rounded-lg shadow-sm ">
         <button type="button" @click="closeModal"
-          class="absolute top-3 end-2.5 text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm w-8 h-8 ms-auto inline-flex justify-center items-center dark:hover:bg-gray-600 dark:hover:text-white">
+          class="absolute top-3 end-2.5 text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm w-8 h-8 ms-auto inline-flex justify-center items-center  ">
           <svg class="w-3 h-3" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 14">
             <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
               d="m1 1 6 6m0 0 6 6M7 7l6-6M7 7l-6 6" />
@@ -12,21 +12,21 @@
           <span class="sr-only">Close modal</span>
         </button>
         <div class="p-4 md:p-5 text-center flex flex-col items-center gap-y-3">
-          <svg class="mx-auto mb-4 text-gray-400 w-12 h-12 dark:text-gray-200" aria-hidden="true"
-            xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20">
+          <svg class="mx-auto mb-4 text-gray-400 w-12 h-12 " aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
+            fill="none" viewBox="0 0 20 20">
             <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
               d="M10 11V6m0 8h.01M19 10a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
           </svg>
-          <h3 class="mb-5 text-lg font-normal text-gray-500 dark:text-gray-400">
+          <h3 class="mb-5 text-lg font-normal text-gray-500 ">
             {{ title }}
           </h3>
           <span>
             <button type="button" @click="onSubmit"
-              class="text-white bg-red-600 hover:bg-red-800 focus:ring-4 focus:outline-none focus:ring-red-300 dark:focus:ring-red-800 font-medium rounded-lg text-sm inline-flex items-center px-5 py-2.5 text-center">
+              class="text-white bg-red-600 hover:bg-red-800 focus:ring-4 focus:outline-none focus:ring-red-300  font-medium rounded-lg text-sm inline-flex items-center px-5 py-2.5 text-center">
               是
             </button>
             <button type="button" @click="closeModal"
-              class="py-2.5 px-5 ms-3 text-sm font-medium text-gray-900 focus:outline-none bg-white rounded-lg border border-gray-200 hover:bg-gray-100 hover:text-blue-700 focus:z-10 focus:ring-4 focus:ring-gray-100 dark:focus:ring-gray-700 dark:bg-gray-800 dark:text-gray-400 dark:border-gray-600 dark:hover:text-white dark:hover:bg-gray-700">否</button>
+              class="py-2.5 px-5 ms-3 text-sm font-medium text-gray-900 focus:outline-none bg-white rounded-lg border border-gray-200 hover:bg-gray-100 hover:text-blue-700 focus:z-10 focus:ring-4 focus:ring-gray-100      ">否</button>
           </span>
         </div>
       </div>
diff --git a/frontend/src/components/PositionUpsertModal.vue b/frontend/src/components/PositionUpsertModal.vue
index b87ba92..9df1b04 100644
--- a/frontend/src/components/PositionUpsertModal.vue
+++ b/frontend/src/components/PositionUpsertModal.vue
@@ -1,18 +1,17 @@
 <template>
   <!-- Main modal -->
   <div :id tabindex="-1" aria-hidden="true"
-    class="bg-gray-900/50 dark:bg-gray-900/80 hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full">
+    class="bg-gray-900/50 /80 hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full">
     <div class="relative p-4 w-full max-w-md max-h-full">
       <!-- Modal content -->
-      <div class="relative bg-white rounded-lg shadow-sm dark:bg-gray-700">
+      <div class="relative bg-white rounded-lg shadow-sm ">
         <!-- Modal header -->
-        <div
-          class="flex items-center justify-between p-4 md:p-5 border-b rounded-t dark:border-gray-600 border-gray-200">
-          <h3 class="text-lg font-semibold text-gray-900 dark:text-white">
+        <div class="flex items-center justify-between p-4 md:p-5 border-b rounded-t  border-gray-200">
+          <h3 class="text-lg font-semibold text-gray-900 ">
             岗位管理
           </h3>
           <button type="button" @click="closeModal"
-            class="text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm w-8 h-8 ms-auto inline-flex justify-center items-center dark:hover:bg-gray-600 dark:hover:text-white">
+            class="text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm w-8 h-8 ms-auto inline-flex justify-center items-center  ">
             <svg class="w-3 h-3" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 14">
               <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                 d="m1 1 6 6m0 0 6 6M7 7l6-6M7 7l-6 6" />
@@ -24,15 +23,15 @@
         <div class="p-4 md:p-5">
           <div class="grid gap-4 mb-4 grid-cols-2">
             <div class="col-span-2">
-              <label for="name" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">岗位名称</label>
+              <label for="name" class="block mb-2 text-sm font-medium text-gray-900 ">岗位名称</label>
               <input type="text" id="name" v-model="formData.name"
-                class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+                class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5      "
                 required />
             </div>
 
           </div>
           <button type="submit" @click="handleSubmit"
-            class="text-white flex items-center bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800 self-start mt-5">
+            class="text-white flex items-center bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center    self-start mt-5">
             保存
           </button>
         </div>
diff --git a/frontend/src/components/RoleUpsertModal.vue b/frontend/src/components/RoleUpsertModal.vue
index 308df96..7f1a493 100644
--- a/frontend/src/components/RoleUpsertModal.vue
+++ b/frontend/src/components/RoleUpsertModal.vue
@@ -1,11 +1,10 @@
 <template>
   <div id="role-upsert-modal" tabindex="-1" aria-hidden="true"
-    class="bg-gray-900/50 dark:bg-gray-900/80 hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full">
+    class="bg-gray-900/50 /80 hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full">
     <div class="relative p-4 w-full max-w-md max-h-full">
-      <div class="relative bg-white rounded-lg shadow-sm dark:bg-gray-700">
-        <div
-          class="flex items-center justify-between p-4 md:p-5 border-b rounded-t dark:border-gray-600 border-gray-200">
-          <h3 class="text-lg font-semibold text-gray-900 dark:text-white">
+      <div class="relative bg-white rounded-lg shadow-sm ">
+        <div class="flex items-center justify-between p-4 md:p-5 border-b rounded-t  border-gray-200">
+          <h3 class="text-lg font-semibold text-gray-900 ">
             角色管理
           </h3>
           <button type="button" @click="closeModal"
@@ -20,13 +19,13 @@
         <div class="p-4 md:p-5">
           <div class="grid gap-4 mb-4 grid-cols-2">
             <div class="col-span-2">
-              <label for="name" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">角色名称</label>
+              <label for="name" class="block mb-2 text-sm font-medium text-gray-900 ">角色名称</label>
               <input type="text" name="角色名称" id="name" v-model="formData.name"
                 class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5"
                 required="true">
             </div>
             <div class="col-span-2">
-              <label for="code" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">角色代码</label>
+              <label for="code" class="block mb-2 text-sm font-medium text-gray-900 ">角色代码</label>
               <input type="text" id="code" v-model="formData.code"
                 class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5"
                 required />
diff --git a/frontend/src/components/SchedulerUpdateModal.vue b/frontend/src/components/SchedulerUpdateModal.vue
index 71a1111..07130f4 100644
--- a/frontend/src/components/SchedulerUpdateModal.vue
+++ b/frontend/src/components/SchedulerUpdateModal.vue
@@ -1,15 +1,14 @@
 <template>
   <div :id tabindex="-1" aria-hidden="true"
-    class="bg-gray-900/50 dark:bg-gray-900/80 hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full">
+    class="bg-gray-900/50 /80 hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full">
     <div class="relative p-4 w-full max-w-md max-h-full">
-      <div class="relative bg-white rounded-lg shadow dark:bg-gray-700">
-        <div
-          class="flex items-center justify-between p-4 md:p-5 border-b rounded-t dark:border-gray-600 border-gray-200">
-          <h3 class="text-lg font-semibold text-gray-900 dark:text-white">
+      <div class="relative bg-white rounded-lg shadow ">
+        <div class="flex items-center justify-between p-4 md:p-5 border-b rounded-t  border-gray-200">
+          <h3 class="text-lg font-semibold text-gray-900 ">
             {{ '更新表达式' }}
           </h3>
           <button @click="closeModal" type="button"
-            class="text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm w-8 h-8 ms-auto inline-flex justify-center items-center dark:hover:bg-gray-600 dark:hover:text-white">
+            class="text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm w-8 h-8 ms-auto inline-flex justify-center items-center  ">
             <svg class="w-3 h-3" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 14">
               <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                 d="m1 1 6 6m0 0 6 6M7 7l6-6M7 7l-6 6" />
@@ -19,7 +18,7 @@
         <form @submit.prevent="handleSubmit" class="p-4 md:p-5">
           <div class="grid gap-4 mb-4">
             <div>
-              <label for="name" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Cron 表达式</label>
+              <label for="name" class="block mb-2 text-sm font-medium text-gray-900 ">Cron 表达式</label>
               <input type="text" v-model="formData.cronExpression" name="name" id="name"
                 class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5">
             </div>
diff --git a/frontend/src/components/Sidebar.vue b/frontend/src/components/Sidebar.vue
index 1b5f292..b74df7d 100644
--- a/frontend/src/components/Sidebar.vue
+++ b/frontend/src/components/Sidebar.vue
@@ -1,21 +1,21 @@
 <template>
-  <aside id="logo-sidebar"
-    class="fixed top-0 left-0 z-30 w-64 min-h-screen overflow-y-auto pt-20 transition-transform -translate-x-full bg-white border-r border-gray-200 sm:translate-x-0 dark:bg-gray-800 dark:border-gray-700"
-    aria-label="Sidebar">
-    <div class="h-full px-3 pb-4 overflow-y-auto bg-white dark:bg-gray-800">
-      <ul class="space-y-2 font-medium">
-        <li v-for="item in menuItems" :key="item.path">
-          <RouterLink :to="item.path"
-            class="flex items-center p-2 gap-x-2 text-gray-900 rounded-lg dark:text-white hover:bg-gray-100 dark:hover:bg-gray-700 group"
-            :class="{ 'bg-gray-100 dark:bg-gray-700': isActive(item.path) }">
-            <component :is="item.icon"
-              class="shrink-0 text-gray-700 transition duration-75 dark:text-gray-400 group-hover:text-gray-900 dark:group-hover:text-white" />
-            <span>{{ item.title }}</span>
-          </RouterLink>
-        </li>
-      </ul>
-    </div>
-  </aside>
+	<aside id="logo-sidebar"
+		class="fixed top-0 left-0 z-30 w-64 min-h-screen overflow-y-auto pt-20 transition-transform -translate-x-full bg-white border-r border-gray-200 sm:translate-x-0  "
+		aria-label="Sidebar">
+		<div class="h-full px-3 pb-4 overflow-y-auto bg-white ">
+			<ul class="space-y-2 font-medium">
+				<li v-for="item in menuItems" :key="item.path">
+					<RouterLink :to="item.path"
+						class="flex items-center p-2 gap-x-2 text-gray-900 rounded-lg  hover:bg-gray-100  group"
+						:class="{ 'bg-gray-100 ': isActive(item.path) }">
+						<component :is="item.icon"
+							class="shrink-0 text-gray-700 transition duration-75  group-hover:text-gray-900 " />
+						<span>{{ item.title }}</span>
+					</RouterLink>
+				</li>
+			</ul>
+		</div>
+	</aside>
 </template>
 
 <script setup lang="ts">
diff --git a/frontend/src/components/TablePagination.vue b/frontend/src/components/TablePagination.vue
index d568e39..ea25b25 100644
--- a/frontend/src/components/TablePagination.vue
+++ b/frontend/src/components/TablePagination.vue
@@ -1,33 +1,33 @@
 <template>
   <nav class="flex items-center flex-column flex-wrap md:flex-row justify-between pt-4 px-5 pb-5"
     aria-label="Table navigation">
-    <span class="text-sm font-normal text-gray-500 dark:text-gray-400 mb-4 md:mb-0 block w-full md:inline md:w-auto">
+    <span class="text-sm font-normal text-gray-500  mb-4 md:mb-0 block w-full md:inline md:w-auto">
       显示
-      <span class="font-semibold text-gray-900 dark:text-white">
+      <span class="font-semibold text-gray-900 ">
         {{ displayRange.start }}-{{ displayRange.end }}
       </span>
       共
-      <span class="font-semibold text-gray-900 dark:text-white">{{ total }}</span> 条
+      <span class="font-semibold text-gray-900 ">{{ total }}</span> 条
     </span>
     <ul class="inline-flex -space-x-px rtl:space-x-reverse text-sm h-8">
       <li>
         <a href="#" @click.prevent="handlePageChangeClick(currentPage - 1)" :class="[
-              'flex items-center justify-center px-3 h-8 ms-0 leading-tight text-gray-500 bg-white border border-gray-300 rounded-s-lg hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white',
+              'flex items-center justify-center px-3 h-8 ms-0 leading-tight text-gray-500 bg-white border border-gray-300 rounded-s-lg hover:bg-gray-100 hover:text-gray-700     ',
               { 'opacity-50 cursor-not-allowed': isFirstPage }
             ]">上一页</a>
       </li>
       <li v-for="page in pageNumbers" :key="page">
         <button @click.prevent="handlePageChangeClick(page)" :class="[
-              'flex items-center justify-center px-3 h-8 leading-tight border border-gray-300 hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:hover:bg-gray-700 dark:hover:text-white',
+              'flex items-center justify-center px-3 h-8 leading-tight border border-gray-300 hover:bg-gray-100 hover:text-gray-700    ',
               currentPage === page 
-                ? 'text-blue-600 bg-blue-50 hover:bg-blue-100 hover:text-blue-700 dark:border-gray-700 dark:bg-gray-700 dark:text-white'
-                : 'text-gray-500 bg-white dark:text-gray-400'
+                ? 'text-blue-600 bg-blue-50 hover:bg-blue-100 hover:text-blue-700   '
+                : 'text-gray-500 bg-white '
             ]">{{ page }}</button>
       </li>
 
       <li>
         <button @click.prevent="handlePageChangeClick(currentPage + 1)" :class="[
-              'flex items-center justify-center px-3 h-8 leading-tight text-gray-500 bg-white border border-gray-300 rounded-e-lg hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white',
+              'flex items-center justify-center px-3 h-8 leading-tight text-gray-500 bg-white border border-gray-300 rounded-e-lg hover:bg-gray-100 hover:text-gray-700     ',
               { 'opacity-50 cursor-not-allowed': isLastPage }
             ]">下一页</button>
       </li>
diff --git a/frontend/src/components/UserUpsertModal.vue b/frontend/src/components/UserUpsertModal.vue
index 025f448..2f58dc0 100644
--- a/frontend/src/components/UserUpsertModal.vue
+++ b/frontend/src/components/UserUpsertModal.vue
@@ -1,18 +1,17 @@
 <template>
 	<!-- Main modal -->
 	<div id="user-upsert-modal" tabindex="-1" aria-hidden="true"
-		class="bg-gray-900/50 dark:bg-gray-900/80 hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full">
+		class="bg-gray-900/50 /80 hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full">
 		<div class="relative p-4 w-full max-w-md max-h-full">
 			<!-- Modal content -->
-			<div class="relative bg-white rounded-lg shadow-sm dark:bg-gray-700">
+			<div class="relative bg-white rounded-lg shadow-sm ">
 				<!-- Modal header -->
-				<div
-					class="flex items-center justify-between p-4 md:p-5 border-b rounded-t dark:border-gray-600 border-gray-200">
-					<h3 class="text-lg font-semibold text-gray-900 dark:text-white">
+				<div class="flex items-center justify-between p-4 md:p-5 border-b rounded-t  border-gray-200">
+					<h3 class="text-lg font-semibold text-gray-900 ">
 						用户管理
 					</h3>
 					<button type="button" @click="closeModal"
-						class="text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm w-8 h-8 ms-auto inline-flex justify-center items-center dark:hover:bg-gray-600 dark:hover:text-white">
+						class="text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm w-8 h-8 ms-auto inline-flex justify-center items-center  ">
 						<svg class="w-3 h-3" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 14">
 							<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
 								d="m1 1 6 6m0 0 6 6M7 7l6-6M7 7l-6 6" />
@@ -24,37 +23,35 @@
 				<form class="p-4 md:p-5">
 					<div class="grid gap-4 mb-4 grid-cols-2">
 						<div class="col-span-2">
-							<label for="name" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">用户名</label>
+							<label for="name" class="block mb-2 text-sm font-medium text-gray-900 ">用户名</label>
 							<input type="text" name="用户名" id="name" v-model="formData.username"
-								class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-600 dark:border-gray-500 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
+								class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5      "
 								required="true">
 						</div>
 						<div class="col-span-2">
-							<label for="password"
-								class="block mb-2 text-sm font-medium autocompletetext-gray-900 dark:text-white">密码</label>
+							<label for="password" class="block mb-2 text-sm font-medium autocompletetext-gray-900 ">密码</label>
 							<input type="password" id="password" autocomplete="new-password" v-model="formData.password"
-								class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+								class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5      "
 								placeholder="编辑时非必填" required />
 						</div>
 						<div class="col-span-2">
-							<label for="confirm_password"
-								class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">确认密码</label>
+							<label for="confirm_password" class="block mb-2 text-sm font-medium text-gray-900 ">确认密码</label>
 							<input type="password" id="confirm_password" autocomplete="new-password"
 								v-model="formData.confirmPassword"
-								class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+								class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5      "
 								required placeholder="编辑时非必填" />
 						</div>
 						<div class="col-span-2 sm:col-span-1">
-							<label for="category" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">状态</label>
+							<label for="category" class="block mb-2 text-sm font-medium text-gray-900 ">状态</label>
 							<select id="category" v-model="formData.enable"
-								class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-500 focus:border-primary-500 block w-full p-2.5 dark:bg-gray-600 dark:border-gray-500 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500">
+								class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-500 focus:border-primary-500 block w-full p-2.5      ">
 								<option :value=true>启用</option>
 								<option :value=false>禁用</option>
 							</select>
 						</div>
 					</div>
 					<button type="submit" @click.prevent="handleSubmit"
-						class="text-white flex items-center bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800 self-start mt-5">
+						class="text-white flex items-center bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center    self-start mt-5">
 						保存
 					</button>
 				</form>
diff --git a/frontend/src/components/icons/DepartmentIcon.vue b/frontend/src/components/icons/DepartmentIcon.vue
index d0f8b29..c952d1a 100644
--- a/frontend/src/components/icons/DepartmentIcon.vue
+++ b/frontend/src/components/icons/DepartmentIcon.vue
@@ -1,6 +1,6 @@
 <template>
-  <svg class="text-gray-800 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24"
-    height="24" fill="none" viewBox="0 0 24 24">
+  <svg class="text-gray-800 " aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"
+    viewBox="0 0 24 24">
     <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
       d="M3 15v3c0 .5523.44772 1 1 1h4v-4m-5 0v-4m0 4h5m-5-4V6c0-.55228.44772-1 1-1h16c.5523 0 1 .44772 1 1v1.98935M3 11h5v4m9.4708 4.1718-.8696-1.4388-2.8164-.235-2.573-4.2573 1.4873-2.8362 1.4441 2.3893c.3865.6396 1.2183.8447 1.8579.4582.6396-.3866.8447-1.2184.4582-1.858l-1.444-2.38925h3.1353l2.6101 4.27715-1.0713 2.5847.8695 1.4388" />
   </svg>
diff --git a/frontend/src/components/icons/PositionIcon.vue b/frontend/src/components/icons/PositionIcon.vue
index 18fa085..33833cc 100644
--- a/frontend/src/components/icons/PositionIcon.vue
+++ b/frontend/src/components/icons/PositionIcon.vue
@@ -1,6 +1,6 @@
 <template>
-  <svg class="w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24"
-    height="24" fill="none" viewBox="0 0 24 24">
+  <svg class="w-6 h-6 text-gray-800 " aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24"
+    fill="none" viewBox="0 0 24 24">
     <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
       d="M14.6144 7.19994c.3479.48981.5999 1.15357.5999 1.80006 0 1.6569-1.3432 3-3 3-1.6569 0-3.00004-1.3431-3.00004-3 0-.67539.22319-1.29865.59983-1.80006M6.21426 6v4m0-4 6.00004-3 6 3-6 2-2.40021-.80006M6.21426 6l3.59983 1.19994M6.21426 19.8013v-2.1525c0-1.6825 1.27251-3.3075 2.95093-3.6488l3.04911 2.9345 3-2.9441c1.7026.3193 3 1.9596 3 3.6584v2.1525c0 .6312-.5373 1.1429-1.2 1.1429H7.41426c-.66274 0-1.2-.5117-1.2-1.1429Z" />
   </svg>
diff --git a/frontend/src/components/icons/SchedulerIcon.vue b/frontend/src/components/icons/SchedulerIcon.vue
index 5c03236..b990cb9 100644
--- a/frontend/src/components/icons/SchedulerIcon.vue
+++ b/frontend/src/components/icons/SchedulerIcon.vue
@@ -1,6 +1,6 @@
 <template>
-  <svg class="w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24"
-    height="24" fill="none" viewBox="0 0 24 24">
+  <svg class="w-6 h-6 text-gray-800 " aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24"
+    fill="none" viewBox="0 0 24 24">
     <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
       d="M12 8v4l3 3m6-3a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
   </svg>
diff --git a/frontend/src/composables/store/useAlertStore.ts b/frontend/src/composables/store/useAlertStore.ts
index 1ffd1d3..37186c6 100644
--- a/frontend/src/composables/store/useAlertStore.ts
+++ b/frontend/src/composables/store/useAlertStore.ts
@@ -38,12 +38,10 @@ const useAlertStore = defineStore("alertStore", () => {
 			return;
 		}
 		return {
-			info: "text-blue-800 bg-blue-50 dark:bg-gray-800 dark:text-blue-400 ",
-			success:
-				"text-green-800  bg-green-50 dark:bg-gray-800 dark:text-green-400",
-			warning:
-				"text-yellow-800  bg-yellow-50 dark:bg-gray-800 dark:text-yellow-300",
-			error: "text-red-800  bg-red-50 dark:bg-gray-800 dark:text-red-400",
+			info: "text-blue-800 bg-blue-50   ",
+			success: "text-green-800  bg-green-50  ",
+			warning: "text-yellow-800  bg-yellow-50  ",
+			error: "text-red-800  bg-red-50  ",
 		}[alertStorage.value.level];
 	});
 
diff --git a/frontend/src/router/constants.ts b/frontend/src/router/constants.ts
index 602d064..08df856 100644
--- a/frontend/src/router/constants.ts
+++ b/frontend/src/router/constants.ts
@@ -51,18 +51,18 @@ export enum RouteName {
 }
 
 export enum ERole {
-		ADMIN = "ADMIN",
-		USER = "GENERAL",
-	}
+	ADMIN = "ADMIN",
+	USER = "GENERAL",
+}
 
 export enum EPermission {
-		READ_POSITION_PERMISSION = "READ_POSITION_PERMISSION",
-		WRITE_POSITION_PERMISSION = "WRITE_POSITION_PERMISSION",
-		READ_DEPARTMENT_PERMISSION = "READ_DEPARTMENT_PERMISSION",
-		WRITE_DEPARTMENT_PERMISSION = "WRITE_DEPARTMENT_PERMISSION",
-		READ_SCHEDULER_PERMISSION = "READ_SCHEDULER_PERMISSION",
-		WRITE_SCHEDULER_PERMISSION = "WRITE_SCHEDULER_PERMISSION",
-		WRITE_USER_ROLE_PERMISSION = "WRITE_USER_ROLE_PERMISSION",
-		DELETE_USER_ROLE_PERMISSION = "DELETE_USER_ROLE_PERMISSION",
-		READ_USER_ROLE_PERMISSION = "READ_USER_ROLE_PERMISSION",
-	}
+	READ_POSITION_PERMISSION = "READ_POSITION_PERMISSION",
+	WRITE_POSITION_PERMISSION = "WRITE_POSITION_PERMISSION",
+	READ_DEPARTMENT_PERMISSION = "READ_DEPARTMENT_PERMISSION",
+	WRITE_DEPARTMENT_PERMISSION = "WRITE_DEPARTMENT_PERMISSION",
+	READ_SCHEDULER_PERMISSION = "READ_SCHEDULER_PERMISSION",
+	WRITE_SCHEDULER_PERMISSION = "WRITE_SCHEDULER_PERMISSION",
+	WRITE_USER_ROLE_PERMISSION = "WRITE_USER_ROLE_PERMISSION",
+	DELETE_USER_ROLE_PERMISSION = "DELETE_USER_ROLE_PERMISSION",
+	READ_USER_ROLE_PERMISSION = "READ_USER_ROLE_PERMISSION",
+}
diff --git a/frontend/src/router/guards.ts b/frontend/src/router/guards.ts
index 596a508..9cc9f2e 100644
--- a/frontend/src/router/guards.ts
+++ b/frontend/src/router/guards.ts
@@ -24,6 +24,7 @@ export const permissionGuard: NavigationGuard = (to) => {
 			routeMeta.hasPermission,
 		);
 		if (!hasPermission) {
+			console.error(`您没有请求页面的相关权限：${to.path}`);
 			return false;
 		}
 	}
@@ -35,6 +36,7 @@ export const roleGuard: NavigationGuard = (to) => {
 	if (routeMeta.hasRole) {
 		const hasRole = userStore.roleCodes?.includes(routeMeta.hasRole);
 		if (!hasRole) {
+			console.error(`您没有请求页面的相关角色：${to.path}`);
 			return false;
 		}
 	}
diff --git a/frontend/src/router/index.ts b/frontend/src/router/index.ts
index b05041e..998b4ad 100644
--- a/frontend/src/router/index.ts
+++ b/frontend/src/router/index.ts
@@ -23,6 +23,10 @@ router.onError((err) => {
 	router.push(RouteName.USERVIEW);
 	return false;
 });
-setupGuards(router);
+
+const isMockEnabled = import.meta.env.VITE_ENABLE_MOCK === "true";
+if (!isMockEnabled) {
+	setupGuards(router);
+}
 
 export default router;
diff --git a/frontend/src/router/modules/user.ts b/frontend/src/router/modules/user.ts
index b594527..5d8ede0 100644
--- a/frontend/src/router/modules/user.ts
+++ b/frontend/src/router/modules/user.ts
@@ -1,5 +1,5 @@
 import type { RouteRecordRaw } from "vue-router";
-import { EPermission, ERole, RouteName, RoutePath } from "../constants";
+import { EPermission, RouteName, RoutePath } from "../constants";
 
 const userManagementRoutes: RouteRecordRaw[] = [
 	{
diff --git a/frontend/src/views/BindDepartmentView.vue b/frontend/src/views/BindDepartmentView.vue
index 5fcfbb6..d1f51c8 100644
--- a/frontend/src/views/BindDepartmentView.vue
+++ b/frontend/src/views/BindDepartmentView.vue
@@ -2,34 +2,33 @@
   <div class="relative overflow-x-auto px-4 pt-6 xl:grid-cols-3 xl:gap-4 sm:rounded-lg">
     <div class="mb-4 col-span-full">
       <Breadcrumbs :names="['部门分配']" />
-      <h1 class="text-xl mb-2 font-semibold text-gray-900 sm:text-2xl dark:text-white">部门分配</h1>
+      <h1 class="text-xl mb-2 font-semibold text-gray-900 sm:text-2xl ">部门分配</h1>
     </div>
     <div class="relative">
       <form class="max-w-sm mb-4 grid grid-cols-5 gap-y-4">
         <div class="col-span-3">
-          <label for="default-search"
-            class="mb-2 text-sm font-medium text-gray-900 sr-only dark:text-white">Search</label>
+          <label for="default-search" class="mb-2 text-sm font-medium text-gray-900 sr-only ">Search</label>
           <div class="relative">
             <div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none">
-              <svg class="w-4 h-4 text-gray-500 dark:text-gray-400" aria-hidden="true"
-                xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20">
+              <svg class="w-4 h-4 text-gray-500 " aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
+                viewBox="0 0 20 20">
                 <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                   d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z" />
               </svg>
             </div>
             <input type="search" id="default-search" v-model="departmentName"
-              class="block p-3 ps-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+              class="block p-3 ps-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500      "
               placeholder="部门名称" required />
           </div>
         </div>
         <select id="countries" v-model="bindState"
-          class="col-span-2 block bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500">
+          class="col-span-2 block bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500      ">
           <option value="BIND">已绑定</option>
           <option value="UNBIND">未绑定</option>
           <option value="ALL">全部</option>
         </select>
         <button type="submit"
-          class="text-white  bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
+          class="text-white  bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2   "
           @click.prevent="handleSearch">搜索</button>
       </form>
       <div class="flex items-center justify-end gap-2 absolute right-5 bottom-2">
@@ -64,13 +63,13 @@
       </div>
     </div>
 
-    <table class="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400">
-      <thead class="text-xs uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
+    <table class="w-full text-sm text-left rtl:text-right text-gray-500 ">
+      <thead class="text-xs uppercase bg-gray-50  ">
         <tr>
           <th scope="col" class="p-4">
             <div class="flex items-center">
               <input id="checkbox-all-search" type="checkbox" v-model="allChecked"
-                class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+                class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500    focus:ring-2  ">
               <label for="checkbox-all-search" class="sr-only">checkbox</label>
             </div>
           </th>
@@ -81,19 +80,19 @@
       </thead>
       <tbody>
         <tr v-for="department in departments" :key="department.id"
-          class="bg-white border-b dark:bg-gray-800 dark:border-gray-700 border-gray-200 hover:bg-gray-50 dark:hover:bg-gray-600">
+          class="bg-white border-b   border-gray-200 hover:bg-gray-50 ">
           <td class="w-4 p-4">
             <div class="flex items-center">
               <input :id="'checkbox-table-search-' + department.id" :value="department.id" type="checkbox"
                 v-model="checkedDepartmentIds"
-                class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+                class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500    focus:ring-2  ">
               <label :for="'checkbox-table-search-' + department.id" class="sr-only">checkbox</label>
             </div>
           </td>
-          <td scope="row" class="px-6 py-4whitespace-nowrap dark:text-white">
+          <td scope="row" class="px-6 py-4whitespace-nowrap ">
             {{ !department.parentName ? '无' : department.parentName }}
           </td>
-          <td scope="row" class="px-6 py-4whitespace-nowrap font-medium text-gray-900  dark:text-white">
+          <td scope="row" class="px-6 py-4whitespace-nowrap font-medium text-gray-900  ">
             {{ department.name }}
           </td>
           <td class="px-6 py-4 max-w-sm overflow-hidden text-ellipsis">
diff --git a/frontend/src/views/BindPermissionView.vue b/frontend/src/views/BindPermissionView.vue
index 126ae4b..2426beb 100644
--- a/frontend/src/views/BindPermissionView.vue
+++ b/frontend/src/views/BindPermissionView.vue
@@ -2,35 +2,34 @@
   <div class="relative overflow-x-auto px-4 pt-6 xl:grid-cols-3 xl:gap-4 sm:rounded-lg">
     <div class="mb-4 col-span-full">
       <Breadcrumbs :names="['绑定权限']" />
-      <h1 class="text-xl mb-2 font-semibold text-gray-900 sm:text-2xl dark:text-white">
+      <h1 class="text-xl mb-2 font-semibold text-gray-900 sm:text-2xl ">
         绑定权限</h1>
     </div>
     <div class="relative">
       <form class="max-w-sm mb-4 grid grid-cols-5 gap-y-4">
         <div class="col-span-3">
-          <label for="default-search"
-            class="mb-2 text-sm font-medium text-gray-900 sr-only dark:text-white">Search</label>
+          <label for="default-search" class="mb-2 text-sm font-medium text-gray-900 sr-only ">Search</label>
           <div class="relative">
             <div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none">
-              <svg class="w-4 h-4 text-gray-500 dark:text-gray-400" aria-hidden="true"
-                xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20">
+              <svg class="w-4 h-4 text-gray-500 " aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
+                viewBox="0 0 20 20">
                 <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                   d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z" />
               </svg>
             </div>
             <input type="search" id="default-search" v-model="permissionName"
-              class="block p-3 ps-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+              class="block p-3 ps-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500      "
               placeholder="权限名" required />
           </div>
         </div>
         <select id="countries" v-model="bindState"
-          class="col-span-2 block bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500">
+          class="col-span-2 block bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500      ">
           <option value="BIND">已绑定</option>
           <option value="UNBIND">未绑定</option>
           <option value="ALL">全部</option>
         </select>
         <button type="submit"
-          class="text-white  bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
+          class="text-white  bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2   "
           @click.prevent="handleSearch">搜索</button>
       </form>
       <div class="flex items-center justify-end gap-2 absolute right-5 bottom-2">
@@ -65,13 +64,13 @@
       </div>
     </div>
 
-    <table class="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400">
-      <thead class="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
+    <table class="w-full text-sm text-left rtl:text-right text-gray-500 ">
+      <thead class="text-xs text-gray-700 uppercase bg-gray-50  ">
         <tr>
           <th scope="col" class="p-4">
             <div class="flex items-center">
               <input id="checkbox-all-search" type="checkbox" v-model="allChecked"
-                class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+                class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500    focus:ring-2  ">
               <label for="checkbox-all-search" class="sr-only">checkbox</label>
             </div>
           </th>
@@ -82,19 +81,19 @@
       </thead>
       <tbody>
         <tr v-for="permission in permissions" :key="permission.id"
-          class="bg-white border-b dark:bg-gray-800 dark:border-gray-700 border-gray-200 hover:bg-gray-50 dark:hover:bg-gray-600">
+          class="bg-white border-b   border-gray-200 hover:bg-gray-50 ">
           <td class="w-4 p-4">
             <div class="flex items-center">
               <input :id="'checkbox-table-search-' + permission.id" :value="permission.id" type="checkbox"
                 v-model="checkedPermissionIds"
-                class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+                class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500    focus:ring-2  ">
               <label :for="'checkbox-table-search-' + permission.id" class="sr-only">checkbox</label>
             </div>
           </td>
-          <td scope="row" class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white">
+          <td scope="row" class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap ">
             {{ permission.code }}
           </td>
-          <td scope="row" class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white">
+          <td scope="row" class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap ">
             {{ permission.name }}
           </td>
           <td class="px-6 py-4 max-w-sm overflow-hidden text-ellipsis">
@@ -155,7 +154,7 @@ const handleBindPermissionSubmit = async () => {
 		level: "success",
 	});
 	clearCheckedRoleIds();
-  allChecked.value = false;
+	allChecked.value = false;
 	await fetchPermissionsWith({
 		name: permissionName.value,
 		roleId: Number($route.params.roleId),
@@ -174,7 +173,7 @@ const handleUnbindPermissionSubmit = async () => {
 		level: "success",
 	});
 	clearCheckedRoleIds();
-  allChecked.value = false;
+	allChecked.value = false;
 	await fetchPermissionsWith({
 		name: permissionName.value,
 		roleId: Number($route.params.roleId),
diff --git a/frontend/src/views/BindPositionView.vue b/frontend/src/views/BindPositionView.vue
index ecbe34a..4fc206a 100644
--- a/frontend/src/views/BindPositionView.vue
+++ b/frontend/src/views/BindPositionView.vue
@@ -2,34 +2,33 @@
   <div class="relative overflow-x-auto px-4 pt-6 xl:grid-cols-3 xl:gap-4 sm:rounded-lg">
     <div class="mb-4 col-span-full">
       <Breadcrumbs :names="['岗位分配']" />
-      <h1 class="text-xl mb-2 font-semibold text-gray-900 sm:text-2xl dark:text-white">岗位分配</h1>
+      <h1 class="text-xl mb-2 font-semibold text-gray-900 sm:text-2xl ">岗位分配</h1>
     </div>
     <div class="relative">
       <form class="max-w-sm mb-4 grid grid-cols-5 gap-y-4">
         <div class="col-span-3">
-          <label for="default-search"
-            class="mb-2 text-sm font-medium text-gray-900 sr-only dark:text-white">Search</label>
+          <label for="default-search" class="mb-2 text-sm font-medium text-gray-900 sr-only ">Search</label>
           <div class="relative">
             <div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none">
-              <svg class="w-4 h-4 text-gray-500 dark:text-gray-400" aria-hidden="true"
-                xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20">
+              <svg class="w-4 h-4 text-gray-500 " aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
+                viewBox="0 0 20 20">
                 <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                   d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z" />
               </svg>
             </div>
             <input type="search" id="default-search" v-model="positionName"
-              class="block p-3 ps-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+              class="block p-3 ps-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500      "
               placeholder="岗位名称" required />
           </div>
         </div>
         <select id="countries" v-model="bindState"
-          class="col-span-2 block bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500">
+          class="col-span-2 block bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500      ">
           <option value="BIND">已绑定</option>
           <option value="UNBIND">未绑定</option>
           <option value="ALL">全部</option>
         </select>
         <button type="submit"
-          class="text-white  bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
+          class="text-white  bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2   "
           @click.prevent="handleSearch">搜索</button>
       </form>
       <div class="flex items-center justify-end gap-2 absolute right-5 bottom-2">
@@ -64,13 +63,13 @@
       </div>
     </div>
 
-    <table class="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400">
-      <thead class="text-xs uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
+    <table class="w-full text-sm text-left rtl:text-right text-gray-500 ">
+      <thead class="text-xs uppercase bg-gray-50  ">
         <tr>
           <th scope="col" class="p-4">
             <div class="flex items-center">
               <input id="checkbox-all-search" type="checkbox" v-model="allChecked"
-                class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+                class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500    focus:ring-2  ">
               <label for="checkbox-all-search" class="sr-only">checkbox</label>
             </div>
           </th>
@@ -80,17 +79,17 @@
       </thead>
       <tbody>
         <tr v-for="position in positions" :key="position.id"
-          class="bg-white border-b dark:bg-gray-800 dark:border-gray-700 border-gray-200 hover:bg-gray-50 dark:hover:bg-gray-600">
+          class="bg-white border-b   border-gray-200 hover:bg-gray-50 ">
           <td class="w-4 p-4">
             <div class="flex items-center">
               <input :id="'checkbox-table-search-' + position.id" :value="position.id" type="checkbox"
                 v-model="checkedPositionIds"
-                class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+                class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500    focus:ring-2  ">
               <label :for="'checkbox-table-search-' + position.id" class="sr-only">checkbox</label>
             </div>
           </td>
 
-          <td scope="row" class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white">
+          <td scope="row" class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap ">
             {{ position.name }}
           </td>
           <td class="px-6 py-4 max-w-sm overflow-hidden text-ellipsis">
diff --git a/frontend/src/views/BindRoleView.vue b/frontend/src/views/BindRoleView.vue
index 96d1f18..ed5ed04 100644
--- a/frontend/src/views/BindRoleView.vue
+++ b/frontend/src/views/BindRoleView.vue
@@ -2,34 +2,33 @@
   <div class="relative overflow-x-auto px-4 pt-6 xl:grid-cols-3 xl:gap-4 sm:rounded-lg">
     <div class="mb-4 col-span-full">
       <Breadcrumbs :names="['角色分配']" />
-      <h1 class="text-xl mb-2 font-semibold text-gray-900 sm:text-2xl dark:text-white">角色分配</h1>
+      <h1 class="text-xl mb-2 font-semibold text-gray-900 sm:text-2xl ">角色分配</h1>
     </div>
     <div class="relative">
       <form class="max-w-sm mb-4 grid grid-cols-5 gap-y-4">
         <div class="col-span-3">
-          <label for="default-search"
-            class="mb-2 text-sm font-medium text-gray-900 sr-only dark:text-white">Search</label>
+          <label for="default-search" class="mb-2 text-sm font-medium text-gray-900 sr-only ">Search</label>
           <div class="relative">
             <div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none">
-              <svg class="w-4 h-4 text-gray-500 dark:text-gray-400" aria-hidden="true"
-                xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20">
+              <svg class="w-4 h-4 text-gray-500 " aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
+                viewBox="0 0 20 20">
                 <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                   d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z" />
               </svg>
             </div>
             <input type="search" id="default-search" v-model="roleName"
-              class="block p-3 ps-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+              class="block p-3 ps-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500      "
               placeholder="角色名" required />
           </div>
         </div>
         <select id="countries" v-model="bindState"
-          class="col-span-2 block bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500">
+          class="col-span-2 block bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500      ">
           <option value="BIND">已绑定</option>
           <option value="UNBIND">未绑定</option>
           <option value="ALL">全部</option>
         </select>
         <button type="submit"
-          class="text-white  bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
+          class="text-white  bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2   "
           @click.prevent="handleSearch">搜索</button>
       </form>
       <div class="flex items-center justify-end gap-2 absolute right-5 bottom-2">
@@ -64,13 +63,13 @@
       </div>
     </div>
 
-    <table class="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400">
-      <thead class="text-xs uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
+    <table class="w-full text-sm text-left rtl:text-right text-gray-500 ">
+      <thead class="text-xs uppercase bg-gray-50  ">
         <tr>
           <th scope="col" class="p-4">
             <div class="flex items-center">
               <input id="checkbox-all-search" type="checkbox" v-model="allChecked"
-                class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+                class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500    focus:ring-2  ">
               <label for="checkbox-all-search" class="sr-only">checkbox</label>
             </div>
           </th>
@@ -80,19 +79,18 @@
         </tr>
       </thead>
       <tbody>
-        <tr v-for="role in roles" :key="role.id"
-          class="bg-white border-b dark:bg-gray-800 dark:border-gray-700 border-gray-200 hover:bg-gray-50 dark:hover:bg-gray-600">
+        <tr v-for="role in roles" :key="role.id" class="bg-white border-b   border-gray-200 hover:bg-gray-50 ">
           <td class="w-4 p-4">
             <div class="flex items-center">
               <input :id="'checkbox-table-search-' + role.id" :value="role.id" type="checkbox" v-model="checkedRoleIds"
-                class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+                class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500    focus:ring-2  ">
               <label :for="'checkbox-table-search-' + role.id" class="sr-only">checkbox</label>
             </div>
           </td>
-          <td scope="row" class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white">
+          <td scope="row" class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap ">
             {{ role.code }}
           </td>
-          <td scope="row" class="px-6 py-4  whitespace-nowrap dark:text-white">
+          <td scope="row" class="px-6 py-4  whitespace-nowrap ">
             {{ role.name }}
           </td>
           <td class="px-6 py-4 max-w-sm overflow-hidden text-ellipsis">
diff --git a/frontend/src/views/DepartmentView.vue b/frontend/src/views/DepartmentView.vue
index 285b0a0..d8768dd 100644
--- a/frontend/src/views/DepartmentView.vue
+++ b/frontend/src/views/DepartmentView.vue
@@ -2,43 +2,42 @@
   <div class="px-4 pt-6 xl:grid-cols-3 xl:gap-4 sm:rounded-lg">
     <div class="mb-4 col-span-full">
       <Breadcrumbs :names="['部门管理']" />
-      <h1 class="text-xl font-semibold text-gray-900 sm:text-2xl dark:text-white">部门管理</h1>
+      <h1 class="text-xl font-semibold text-gray-900 sm:text-2xl ">部门管理</h1>
     </div>
     <div class="relative">
       <form class="max-w-sm mb-4">
-        <label for="default-search"
-          class="mb-2 text-sm font-medium text-gray-900 sr-only dark:text-white">Search</label>
+        <label for="default-search" class="mb-2 text-sm font-medium text-gray-900 sr-only ">Search</label>
         <div class="relative">
           <div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none">
-            <svg class="w-4 h-4 text-gray-500 dark:text-gray-400" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
-              fill="none" viewBox="0 0 20 20">
+            <svg class="w-4 h-4 text-gray-500 " aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 20 20">
               <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                 d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z" />
             </svg>
           </div>
           <input type="search" id="default-search" v-model="name"
-            class="block  w-full p-4 ps-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+            class="block  w-full p-4 ps-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500      "
             placeholder="部门名称" required />
           <button type="submit"
-            class="text-white absolute end-2.5 bottom-2.5 bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
+            class="text-white absolute end-2.5 bottom-2.5 bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2   "
             @click.prevent="handleSearch">搜索</button>
         </div>
       </form>
       <!-- Create Modal toggle -->
       <button @click="handleUpsertDepartmentClick()"
-        class="flex items-center block text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800 absolute right-5 bottom-2"
+        class="flex items-center block text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center    absolute right-5 bottom-2"
         type="button">
         新增部门
       </button>
     </div>
     <div class="relative overflow-x-auto">
-      <table class="w-full text-sm text-left rtl:text-right shadow-lg rounded-lg text-gray-500 dark:text-gray-400">
-        <thead class="text-xs uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
+      <table class="w-full text-sm text-left rtl:text-right shadow-lg rounded-lg text-gray-500 ">
+        <thead class="text-xs uppercase bg-gray-50  ">
           <tr>
             <th scope="col" class="p-4">
               <div class="flex items-center">
                 <input id="checkbox-all-search" disabled type="checkbox"
-                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500    focus:ring-2  ">
                 <label for="checkbox-all-search" class="sr-only">checkbox</label>
               </div>
             </th>
@@ -49,11 +48,11 @@
         </thead>
         <tbody>
           <tr v-for="department in departments" :key="department.id"
-            class="bg-white border-b dark:bg-gray-800 dark:border-gray-700 border-gray-200 hover:bg-gray-50 dark:hover:bg-gray-600">
+            class="bg-white border-b   border-gray-200 hover:bg-gray-50 ">
             <td class="w-4 p-4">
               <div class="flex items-center">
                 <input :id="'checkbox-table-search-' + department.id" type="checkbox" disabled
-                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500    focus:ring-2  ">
                 <label :for="'checkbox-table-search-' + department.id" class="sr-only">checkbox</label>
               </div>
             </td>
@@ -66,7 +65,7 @@
             <td class="px-6 py-4 max-w-sm overflow-hidden text-ellipsis">
               <div class="flex items-center gap-x-2">
                 <button @click="handleUpsertDepartmentClick(department)"
-                  class="flex items-center justify-center min-w-25 gap-x-1  text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5   dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800 "
+                  class="flex items-center justify-center min-w-25 gap-x-1  text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5      "
                   type="button">
                   <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                     <path d="M17.414 2.586a2 2 0 00-2.828 0L7 10.172V13h2.828l7.586-7.586a2 2 0 000-2.828z"></path>
@@ -78,7 +77,7 @@
                 </button>
                 <button
                   class="flex items-center justify-center min-w-25 gap-x-1
-              bg-red-700 hover:bg-red-800  dark:bg-red-600 dark:hover:bg-red-700
+              bg-red-700 hover:bg-red-800   
               focus:ring-red-500  text-white focus:ring-4 focus:outline-none font-medium rounded-lg text-sm px-5 py-2.5"
                   @click="handleDeleteDepartmentClick(department)" type="button">
                   <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
diff --git a/frontend/src/views/LoginView.vue b/frontend/src/views/LoginView.vue
index 907c620..d35996e 100644
--- a/frontend/src/views/LoginView.vue
+++ b/frontend/src/views/LoginView.vue
@@ -1,23 +1,22 @@
 <template>
-	<div class="flex flex-col items-center justify-center h-screen bg-gray-100 dark:bg-gray-900">
-		<div
-			class="w-full max-w-sm p-4 bg-white border border-gray-200 rounded-lg shadow-sm sm:p-6 md:p-8 dark:bg-gray-800 dark:border-gray-700">
+	<div class="flex flex-col items-center justify-center h-screen bg-gray-100 ">
+		<div class="w-full max-w-sm p-4 bg-white border border-gray-200 rounded-lg shadow-sm sm:p-6 md:p-8  ">
 			<form class="flex flex-col gap-y-4" action="#">
-				<h5 class="text-xl font-medium text-gray-900 dark:text-white">知路管理后台</h5>
+				<h5 class="text-xl font-medium text-gray-900 ">知路管理后台</h5>
 				<div>
-					<label for="username" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">用户名</label>
+					<label for="username" class="block mb-2 text-sm font-medium text-gray-900 ">用户名</label>
 					<input type="text" name="email" id="username" v-model="username"
-						class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-600 dark:border-gray-500 dark:placeholder-gray-400 dark:text-white"
+						class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5    "
 						placeholder="输入任意值" required />
 				</div>
 				<div>
-					<label for="password" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">密码</label>
+					<label for="password" class="block mb-2 text-sm font-medium text-gray-900 ">密码</label>
 					<input type="password" name="password" id="password" v-model="password" placeholder="••••••••"
-						class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-600 dark:border-gray-500 dark:placeholder-gray-400 dark:text-white"
+						class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5    "
 						required />
 				</div>
 				<button type="submit"
-					class="w-full text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
+					class="w-full text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center   "
 					@click.prevent="handleLogin">登录</button>
 			</form>
 		</div>
diff --git a/frontend/src/views/NotFound.vue b/frontend/src/views/NotFound.vue
index daf476f..df289a7 100644
--- a/frontend/src/views/NotFound.vue
+++ b/frontend/src/views/NotFound.vue
@@ -9,7 +9,9 @@ import { RoutePath } from "../router/constants";
       <h1 class="mt-4 text-5xl font-semibold tracking-tight text-balance text-gray-900 sm:text-7xl">Page not found</h1>
       <p class="mt-6 text-lg font-medium text-pretty text-gray-500 sm:text-xl/8">您访问的资源未找到，请点击浏览器后退按钮返回</p>
       <div class="mt-10 flex items-center justify-center gap-x-6">
-        <RouterLink :to="`${RoutePath.DASHBOARD}/${RoutePath.OVERVIEW}`" class="rounded-md  px-3.5 py-2.5 text-sm font-semibold bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800 text-white shadow-xs focus-visible:outline-2 focus-visible:outline-offset-2">回到主页</RouterLink>
+        <RouterLink :to="`${RoutePath.DASHBOARD}/${RoutePath.OVERVIEW}`"
+          class="rounded-md  px-3.5 py-2.5 text-sm font-semibold bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300    text-white shadow-xs focus-visible:outline-2 focus-visible:outline-offset-2">
+          回到主页</RouterLink>
         <a href="#" class="text-sm font-semibold text-gray-900">联系我们<span aria-hidden="true">&rarr;</span></a>
       </div>
     </div>
diff --git a/frontend/src/views/OverView.vue b/frontend/src/views/OverView.vue
index 0ffcb43..394d590 100644
--- a/frontend/src/views/OverView.vue
+++ b/frontend/src/views/OverView.vue
@@ -1,10 +1,10 @@
 <template>
   <div class="grid grid-cols-5 gap-4 p-4">
-    <div class="col-span-3 bg-white rounded-lg shadow-sm dark:bg-gray-800 p-4 md:p-6">
-      <div class="flex justify-between pb-4 mb-4 border-b border-gray-200 dark:border-gray-700">
+    <div class="col-span-3 bg-white rounded-lg shadow-sm  p-4 md:p-6">
+      <div class="flex justify-between pb-4 mb-4 border-b border-gray-200 ">
         <div class="flex items-center">
-          <div class="w-12 h-12 rounded-lg bg-gray-100 dark:bg-gray-700 flex items-center justify-center me-3">
-            <svg class="w-6 h-6 text-gray-500 dark:text-gray-400" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
+          <div class="w-12 h-12 rounded-lg bg-gray-100  flex items-center justify-center me-3">
+            <svg class="w-6 h-6 text-gray-500 " aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
               fill="currentColor" viewBox="0 0 20 19">
               <path
                 d="M14.5 0A3.987 3.987 0 0 0 11 2.1a4.977 4.977 0 0 1 3.9 5.858A3.989 3.989 0 0 0 14.5 0ZM9 13h2a4 4 0 0 1 4 4v2H5v-2a4 4 0 0 1 4-4Z" />
@@ -13,13 +13,13 @@
             </svg>
           </div>
           <div>
-            <h5 class="leading-none text-2xl font-bold text-gray-900 dark:text-white pb-1">3.4k</h5>
-            <p class="text-sm font-normal text-gray-500 dark:text-gray-400">Leads generated per week</p>
+            <h5 class="leading-none text-2xl font-bold text-gray-900  pb-1">3.4k</h5>
+            <p class="text-sm font-normal text-gray-500 ">Leads generated per week</p>
           </div>
         </div>
         <div>
           <span
-            class="bg-green-100 text-green-800 text-xs font-medium inline-flex items-center px-2.5 py-1 rounded-md dark:bg-green-900 dark:text-green-300">
+            class="bg-green-100 text-green-800 text-xs font-medium inline-flex items-center px-2.5 py-1 rounded-md  ">
             <svg class="w-2.5 h-2.5 me-1.5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
               viewBox="0 0 10 14">
               <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
@@ -32,21 +32,21 @@
 
       <div class="grid grid-cols-2">
         <dl class="flex items-center">
-          <dt class="text-gray-500 dark:text-gray-400 text-sm font-normal me-1">Money spent:</dt>
-          <dd class="text-gray-900 text-sm dark:text-white font-semibold">$3,232</dd>
+          <dt class="text-gray-500  text-sm font-normal me-1">Money spent:</dt>
+          <dd class="text-gray-900 text-sm  font-semibold">$3,232</dd>
         </dl>
         <dl class="flex items-center justify-end">
-          <dt class="text-gray-500 dark:text-gray-400 text-sm font-normal me-1">Conversion rate:</dt>
-          <dd class="text-gray-900 text-sm dark:text-white font-semibold">1.2%</dd>
+          <dt class="text-gray-500  text-sm font-normal me-1">Conversion rate:</dt>
+          <dd class="text-gray-900 text-sm  font-semibold">1.2%</dd>
         </dl>
       </div>
 
       <div id="column-chart"></div>
-      <div class="grid grid-cols-1 items-center border-gray-200 border-t dark:border-gray-700 justify-between">
+      <div class="grid grid-cols-1 items-center border-gray-200 border-t  justify-between">
         <div class="flex justify-between items-center pt-5">
           <!-- Button -->
           <button id="dropdownDefaultButton" data-dropdown-toggle="lastDaysdropdown" data-dropdown-placement="bottom"
-            class="text-sm font-medium text-gray-500 dark:text-gray-400 hover:text-gray-900 text-center inline-flex items-center dark:hover:text-white"
+            class="text-sm font-medium text-gray-500  hover:text-gray-900 text-center inline-flex items-center "
             type="button">
             Last 7 days
             <svg class="w-2.5 m-2.5 ms-1.5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
@@ -56,33 +56,30 @@
             </svg>
           </button>
           <!-- Dropdown menu -->
-          <div id="lastDaysdropdown"
-            class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow-sm w-44 dark:bg-gray-700">
-            <ul class="py-2 text-sm text-gray-700 dark:text-gray-200" aria-labelledby="dropdownDefaultButton">
+          <div id="lastDaysdropdown" class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow-sm w-44 ">
+            <ul class="py-2 text-sm text-gray-700 " aria-labelledby="dropdownDefaultButton">
               <li>
-                <a href="#"
-                  class="block px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">Yesterday</a>
+                <a href="#" class="block px-4 py-2 hover:bg-gray-100  ">Yesterday</a>
               </li>
               <li>
-                <a href="#"
-                  class="block px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">Today</a>
+                <a href="#" class="block px-4 py-2 hover:bg-gray-100  ">Today</a>
               </li>
               <li>
-                <a href="#" class="block px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">Last
+                <a href="#" class="block px-4 py-2 hover:bg-gray-100  ">Last
                   7 days</a>
               </li>
               <li>
-                <a href="#" class="block px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">Last
+                <a href="#" class="block px-4 py-2 hover:bg-gray-100  ">Last
                   30 days</a>
               </li>
               <li>
-                <a href="#" class="block px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">Last
+                <a href="#" class="block px-4 py-2 hover:bg-gray-100  ">Last
                   90 days</a>
               </li>
             </ul>
           </div>
           <a href="#"
-            class="uppercase text-sm font-semibold inline-flex items-center rounded-lg text-blue-600 hover:text-blue-700 dark:hover:text-blue-500  hover:bg-gray-100 dark:hover:bg-gray-700 dark:focus:ring-gray-700 dark:border-gray-700 px-3 py-2">
+            class="uppercase text-sm font-semibold inline-flex items-center rounded-lg text-blue-600 hover:text-blue-700   hover:bg-gray-100    px-3 py-2">
             Leads Report
             <svg class="w-2.5 h-2.5 ms-1.5 rtl:rotate-180" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
               fill="none" viewBox="0 0 6 10">
@@ -93,29 +90,28 @@
         </div>
       </div>
     </div>
-    <div
-      class="col-span-1 bg-white border border-gray-200 rounded-lg shadow-sm sm:p-8 dark:bg-gray-800 dark:border-gray-700">
+    <div class="col-span-1 bg-white border border-gray-200 rounded-lg shadow-sm sm:p-8  ">
       <div class="flex items-center justify-between mb-4">
-        <h5 class="text-xl font-bold leading-none text-gray-900 dark:text-white">Latest Customers</h5>
-        <a href="#" class="text-sm font-medium text-blue-600 hover:underline dark:text-blue-500">
+        <h5 class="text-xl font-bold leading-none text-gray-900 ">Latest Customers</h5>
+        <a href="#" class="text-sm font-medium text-blue-600 hover:underline ">
           View all
         </a>
       </div>
       <div class="flow-root">
-        <ul role="list" class="divide-y divide-gray-200 dark:divide-gray-700">
+        <ul role="list" class="divide-y divide-gray-200 ">
           <li class="py-3 sm:py-4">
             <div class="flex items-center">
               <div class="shrink-0">
                 <img src="/trump.jpg" class="w-8 h-8 rounded-full" </div>
                 <div class="flex-1 min-w-0 ms-4">
-                  <p class="text-sm font-medium text-gray-900 truncate dark:text-white">
+                  <p class="text-sm font-medium text-gray-900 truncate ">
                     Neil Sims
                   </p>
-                  <p class="text-sm text-gray-500 truncate dark:text-gray-400">
+                  <p class="text-sm text-gray-500 truncate ">
                     email@windster.com
                   </p>
                 </div>
-                <div class="inline-flex items-center text-base font-semibold text-gray-900 dark:text-white">
+                <div class="inline-flex items-center text-base font-semibold text-gray-900 ">
                   $320
                 </div>
               </div>
@@ -125,14 +121,14 @@
               <div class="shrink-0">
                 <img src="/trump.jpg" class="w-8 h-8 rounded-full" </div>
                 <div class="flex-1 min-w-0 ms-4">
-                  <p class="text-sm font-medium text-gray-900 truncate dark:text-white">
+                  <p class="text-sm font-medium text-gray-900 truncate ">
                     Bonnie Green
                   </p>
-                  <p class="text-sm text-gray-500 truncate dark:text-gray-400">
+                  <p class="text-sm text-gray-500 truncate ">
                     email@windster.com
                   </p>
                 </div>
-                <div class="inline-flex items-center text-base font-semibold text-gray-900 dark:text-white">
+                <div class="inline-flex items-center text-base font-semibold text-gray-900 ">
                   $3467
                 </div>
               </div>
@@ -142,14 +138,14 @@
               <div class="shrink-0">
                 <img src="/trump.jpg" class="w-8 h-8 rounded-full" </div>
                 <div class="flex-1 min-w-0 ms-4">
-                  <p class="text-sm font-medium text-gray-900 truncate dark:text-white">
+                  <p class="text-sm font-medium text-gray-900 truncate ">
                     Michael Gough
                   </p>
-                  <p class="text-sm text-gray-500 truncate dark:text-gray-400">
+                  <p class="text-sm text-gray-500 truncate ">
                     email@windster.com
                   </p>
                 </div>
-                <div class="inline-flex items-center text-base font-semibold text-gray-900 dark:text-white">
+                <div class="inline-flex items-center text-base font-semibold text-gray-900 ">
                   $67
                 </div>
               </div>
@@ -159,14 +155,14 @@
               <div class="shrink-0">
                 <img src="/trump.jpg" class="w-8 h-8 rounded-full" </div>
                 <div class="flex-1 min-w-0 ms-4">
-                  <p class="text-sm font-medium text-gray-900 truncate dark:text-white">
+                  <p class="text-sm font-medium text-gray-900 truncate ">
                     Lana Byrd
                   </p>
-                  <p class="text-sm text-gray-500 truncate dark:text-gray-400">
+                  <p class="text-sm text-gray-500 truncate ">
                     email@windster.com
                   </p>
                 </div>
-                <div class="inline-flex items-center text-base font-semibold text-gray-900 dark:text-white">
+                <div class="inline-flex items-center text-base font-semibold text-gray-900 ">
                   $367
                 </div>
               </div>
@@ -176,14 +172,14 @@
               <div class="shrink-0">
                 <img src="/trump.jpg" class="w-8 h-8 rounded-full" </div>
                 <div class="flex-1 min-w-0 ms-4">
-                  <p class="text-sm font-medium text-gray-900 truncate dark:text-white">
+                  <p class="text-sm font-medium text-gray-900 truncate ">
                     Thomes Lean
                   </p>
-                  <p class="text-sm text-gray-500 truncate dark:text-gray-400">
+                  <p class="text-sm text-gray-500 truncate ">
                     email@windster.com
                   </p>
                 </div>
-                <div class="inline-flex items-center text-base font-semibold text-gray-900 dark:text-white">
+                <div class="inline-flex items-center text-base font-semibold text-gray-900 ">
                   $2367
                 </div>
               </div>
@@ -191,30 +187,30 @@
         </ul>
       </div>
     </div>
-    <div class="col-span-2 max-w-sm w-full bg-white rounded-lg shadow-sm dark:bg-gray-800 p-4 md:p-6">
+    <div class="col-span-2 max-w-sm w-full bg-white rounded-lg shadow-sm  p-4 md:p-6">
 
       <div class="flex justify-between items-start w-full">
         <div class="flex-col items-center">
           <div class="flex items-center mb-1">
-            <h5 class="text-xl font-bold leading-none text-gray-900 dark:text-white me-1">Website traffic</h5>
+            <h5 class="text-xl font-bold leading-none text-gray-900  me-1">Website traffic</h5>
             <svg data-popover-target="chart-info" data-popover-placement="bottom"
-              class="w-3.5 h-3.5 text-gray-500 dark:text-gray-400 hover:text-gray-900 dark:hover:text-white cursor-pointer ms-1"
-              aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 20 20">
+              class="w-3.5 h-3.5 text-gray-500  hover:text-gray-900  cursor-pointer ms-1" aria-hidden="true"
+              xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 20 20">
               <path
                 d="M10 .5a9.5 9.5 0 1 0 9.5 9.5A9.51 9.51 0 0 0 10 .5Zm0 16a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3Zm1-5.034V12a1 1 0 0 1-2 0v-1.418a1 1 0 0 1 1.038-.999 1.436 1.436 0 0 0 1.488-1.441 1.501 1.501 0 1 0-3-.116.986.986 0 0 1-1.037.961 1 1 0 0 1-.96-1.037A3.5 3.5 0 1 1 11 11.466Z" />
             </svg>
             <div data-popover id="chart-info" role="tooltip"
-              class="absolute z-10 invisible inline-block text-sm text-gray-500 transition-opacity duration-300 bg-white border border-gray-200 rounded-lg shadow-xs opacity-0 w-72 dark:bg-gray-800 dark:border-gray-600 dark:text-gray-400">
+              class="absolute z-10 invisible inline-block text-sm text-gray-500 transition-opacity duration-300 bg-white border border-gray-200 rounded-lg shadow-xs opacity-0 w-72   ">
               <div class="p-3 space-y-2">
-                <h3 class="font-semibold text-gray-900 dark:text-white">Activity growth - Incremental</h3>
+                <h3 class="font-semibold text-gray-900 ">Activity growth - Incremental</h3>
                 <p>Report helps navigate cumulative growth of community activities. Ideally, the chart should have a
                   growing trend, as stagnating chart signifies a significant decrease of community activity.</p>
-                <h3 class="font-semibold text-gray-900 dark:text-white">Calculation</h3>
+                <h3 class="font-semibold text-gray-900 ">Calculation</h3>
                 <p>For each date bucket, the all-time volume of activities is calculated. This means that activities in
                   period n contain all activities up to period n, plus the activities generated by your community in
                   period.</p>
                 <a href="#"
-                  class="flex items-center font-medium text-blue-600 dark:text-blue-500 dark:hover:text-blue-600 hover:text-blue-700 hover:underline">Read
+                  class="flex items-center font-medium text-blue-600   hover:text-blue-700 hover:underline">Read
                   more <svg class="w-2 h-2 ms-1.5 rtl:rotate-180" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
                     fill="none" viewBox="0 0 6 10">
                     <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
@@ -226,7 +222,7 @@
           </div>
           <button id="dateRangeButton" data-dropdown-toggle="dateRangeDropdown"
             data-dropdown-ignore-click-outside-class="datepicker" type="button"
-            class="inline-flex items-center text-blue-700 dark:text-blue-600 font-medium hover:underline">31 Nov - 31
+            class="inline-flex items-center text-blue-700  font-medium hover:underline">31 Nov - 31
             Dev <svg class="w-3 h-3 ms-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
               viewBox="0 0 10 6">
               <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
@@ -234,32 +230,32 @@
             </svg>
           </button>
           <div id="dateRangeDropdown"
-            class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow-sm w-80 lg:w-96 dark:bg-gray-700 dark:divide-gray-600">
+            class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow-sm w-80 lg:w-96  ">
             <div class="p-3" aria-labelledby="dateRangeButton">
               <div date-rangepicker datepicker-autohide class="flex items-center">
                 <div class="relative">
                   <div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none">
-                    <svg class="w-4 h-4 text-gray-500 dark:text-gray-400" aria-hidden="true"
-                      xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 20 20">
+                    <svg class="w-4 h-4 text-gray-500 " aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
+                      fill="currentColor" viewBox="0 0 20 20">
                       <path
                         d="M20 4a2 2 0 0 0-2-2h-2V1a1 1 0 0 0-2 0v1h-3V1a1 1 0 0 0-2 0v1H6V1a1 1 0 0 0-2 0v1H2a2 2 0 0 0-2 2v2h20V4ZM0 18a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V8H0v10Zm5-8h10a1 1 0 0 1 0 2H5a1 1 0 0 1 0-2Z" />
                     </svg>
                   </div>
                   <input name="start" type="text"
-                    class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full ps-10 p-2.5  dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+                    class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full ps-10 p-2.5       "
                     placeholder="Start date">
                 </div>
-                <span class="mx-2 text-gray-500 dark:text-gray-400">to</span>
+                <span class="mx-2 text-gray-500 ">to</span>
                 <div class="relative">
                   <div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none">
-                    <svg class="w-4 h-4 text-gray-500 dark:text-gray-400" aria-hidden="true"
-                      xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 20 20">
+                    <svg class="w-4 h-4 text-gray-500 " aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
+                      fill="currentColor" viewBox="0 0 20 20">
                       <path
                         d="M20 4a2 2 0 0 0-2-2h-2V1a1 1 0 0 0-2 0v1h-3V1a1 1 0 0 0-2 0v1H6V1a1 1 0 0 0-2 0v1H2a2 2 0 0 0-2 2v2h20V4ZM0 18a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V8H0v10Zm5-8h10a1 1 0 0 1 0 2H5a1 1 0 0 1 0-2Z" />
                     </svg>
                   </div>
                   <input name="end" type="text"
-                    class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full ps-10 p-2.5  dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+                    class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full ps-10 p-2.5       "
                     placeholder="End date">
                 </div>
               </div>
@@ -269,31 +265,26 @@
         <div class="flex justify-end items-center">
           <button id="widgetDropdownButton" data-dropdown-toggle="widgetDropdown" data-dropdown-placement="bottom"
             type="button"
-            class="inline-flex items-center justify-center text-gray-500 w-8 h-8 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 rounded-lg text-sm"><svg
-              class="w-3.5 h-3.5 text-gray-800 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
+            class="inline-flex items-center justify-center text-gray-500 w-8 h-8  hover:bg-gray-100  focus:outline-none focus:ring-4 focus:ring-gray-200  rounded-lg text-sm"><svg
+              class="w-3.5 h-3.5 text-gray-800 " aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
               fill="currentColor" viewBox="0 0 16 3">
               <path
                 d="M2 0a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3Zm6.041 0a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3ZM14 0a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3Z" />
             </svg><span class="sr-only">Open dropdown</span>
           </button>
-          <div id="widgetDropdown"
-            class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow-sm w-44 dark:bg-gray-700">
-            <ul class="py-2 text-sm text-gray-700 dark:text-gray-200" aria-labelledby="widgetDropdownButton">
+          <div id="widgetDropdown" class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow-sm w-44 ">
+            <ul class="py-2 text-sm text-gray-700 " aria-labelledby="widgetDropdownButton">
               <li>
-                <a href="#"
-                  class="flex items-center px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white"><svg
-                    class="w-3 h-3 me-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
-                    viewBox="0 0 21 21">
+                <a href="#" class="flex items-center px-4 py-2 hover:bg-gray-100  "><svg class="w-3 h-3 me-2"
+                    aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 21 21">
                     <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                       d="M7.418 17.861 1 20l2.139-6.418m4.279 4.279 10.7-10.7a3.027 3.027 0 0 0-2.14-5.165c-.802 0-1.571.319-2.139.886l-10.7 10.7m4.279 4.279-4.279-4.279m2.139 2.14 7.844-7.844m-1.426-2.853 4.279 4.279" />
                   </svg>Edit widget
                 </a>
               </li>
               <li>
-                <a href="#"
-                  class="flex items-center px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white"><svg
-                    class="w-3 h-3 me-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor"
-                    viewBox="0 0 20 20">
+                <a href="#" class="flex items-center px-4 py-2 hover:bg-gray-100  "><svg class="w-3 h-3 me-2"
+                    aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 20 20">
                     <path
                       d="M14.707 7.793a1 1 0 0 0-1.414 0L11 10.086V1.5a1 1 0 0 0-2 0v8.586L6.707 7.793a1 1 0 1 0-1.414 1.414l4 4a1 1 0 0 0 1.416 0l4-4a1 1 0 0 0-.002-1.414Z" />
                     <path
@@ -302,20 +293,16 @@
                 </a>
               </li>
               <li>
-                <a href="#"
-                  class="flex items-center px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white"><svg
-                    class="w-3 h-3 me-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
-                    viewBox="0 0 18 18">
+                <a href="#" class="flex items-center px-4 py-2 hover:bg-gray-100  "><svg class="w-3 h-3 me-2"
+                    aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 18 18">
                     <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                       d="m5.953 7.467 6.094-2.612m.096 8.114L5.857 9.676m.305-1.192a2.581 2.581 0 1 1-5.162 0 2.581 2.581 0 0 1 5.162 0ZM17 3.84a2.581 2.581 0 1 1-5.162 0 2.581 2.581 0 0 1 5.162 0Zm0 10.322a2.581 2.581 0 1 1-5.162 0 2.581 2.581 0 0 1 5.162 0Z" />
                   </svg>Add to repository
                 </a>
               </li>
               <li>
-                <a href="#"
-                  class="flex items-center px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white"><svg
-                    class="w-3 h-3 me-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor"
-                    viewBox="0 0 18 20">
+                <a href="#" class="flex items-center px-4 py-2 hover:bg-gray-100  "><svg class="w-3 h-3 me-2"
+                    aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 18 20">
                     <path
                       d="M17 4h-4V2a2 2 0 0 0-2-2H7a2 2 0 0 0-2 2v2H1a1 1 0 0 0 0 2h1v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V6h1a1 1 0 1 0 0-2ZM7 2h4v2H7V2Zm1 14a1 1 0 1 1-2 0V8a1 1 0 0 1 2 0v8Zm4 0a1 1 0 0 1-2 0V8a1 1 0 0 1 2 0v8Z" />
                   </svg>Delete widget
@@ -329,11 +316,11 @@
       <!-- Line Chart -->
       <div class="py-6" id="pie-chart"></div>
 
-      <div class="grid grid-cols-1 items-center border-gray-200 border-t dark:border-gray-700 justify-between">
+      <div class="grid grid-cols-1 items-center border-gray-200 border-t  justify-between">
         <div class="flex justify-between items-center pt-5">
           <!-- Button -->
           <button id="dropdownDefaultButton" data-dropdown-toggle="lastDaysdropdown" data-dropdown-placement="bottom"
-            class="text-sm font-medium text-gray-500 dark:text-gray-400 hover:text-gray-900 text-center inline-flex items-center dark:hover:text-white"
+            class="text-sm font-medium text-gray-500  hover:text-gray-900 text-center inline-flex items-center "
             type="button">
             Last 7 days
             <svg class="w-2.5 m-2.5 ms-1.5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
@@ -342,33 +329,30 @@
                 d="m1 1 4 4 4-4" />
             </svg>
           </button>
-          <div id="lastDaysdropdown"
-            class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow-sm w-44 dark:bg-gray-700">
-            <ul class="py-2 text-sm text-gray-700 dark:text-gray-200" aria-labelledby="dropdownDefaultButton">
+          <div id="lastDaysdropdown" class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow-sm w-44 ">
+            <ul class="py-2 text-sm text-gray-700 " aria-labelledby="dropdownDefaultButton">
               <li>
-                <a href="#"
-                  class="block px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">Yesterday</a>
+                <a href="#" class="block px-4 py-2 hover:bg-gray-100  ">Yesterday</a>
               </li>
               <li>
-                <a href="#"
-                  class="block px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">Today</a>
+                <a href="#" class="block px-4 py-2 hover:bg-gray-100  ">Today</a>
               </li>
               <li>
-                <a href="#" class="block px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">Last
+                <a href="#" class="block px-4 py-2 hover:bg-gray-100  ">Last
                   7 days</a>
               </li>
               <li>
-                <a href="#" class="block px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">Last
+                <a href="#" class="block px-4 py-2 hover:bg-gray-100  ">Last
                   30 days</a>
               </li>
               <li>
-                <a href="#" class="block px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">Last
+                <a href="#" class="block px-4 py-2 hover:bg-gray-100  ">Last
                   90 days</a>
               </li>
             </ul>
           </div>
           <a href="#"
-            class="uppercase text-sm font-semibold inline-flex items-center rounded-lg text-blue-600 hover:text-blue-700 dark:hover:text-blue-500  hover:bg-gray-100 dark:hover:bg-gray-700 dark:focus:ring-gray-700 dark:border-gray-700 px-3 py-2">
+            class="uppercase text-sm font-semibold inline-flex items-center rounded-lg text-blue-600 hover:text-blue-700   hover:bg-gray-100    px-3 py-2">
             Traffic analysis
             <svg class="w-2.5 h-2.5 ms-1.5 rtl:rotate-180" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
               fill="none" viewBox="0 0 6 10">
@@ -474,7 +458,7 @@ onMounted(() => {
 				show: true,
 				style: {
 					fontFamily: "Inter, sans-serif",
-					cssClass: "text-xs font-normal fill-gray-500 dark:fill-gray-400",
+					cssClass: "text-xs font-normal fill-gray-500 ",
 				},
 			},
 			axisBorder: {
diff --git a/frontend/src/views/PermissionView.vue b/frontend/src/views/PermissionView.vue
index 6fa33cd..37e93df 100644
--- a/frontend/src/views/PermissionView.vue
+++ b/frontend/src/views/PermissionView.vue
@@ -2,43 +2,42 @@
   <div class="px-4 pt-6 xl:grid-cols-3 xl:gap-4 sm:rounded-lg">
     <div class="mb-4 col-span-full">
       <Breadcrumbs :names="['权限管理']" />
-      <h1 class="text-xl font-semibold text-gray-900 sm:text-2xl dark:text-white">权限管理</h1>
+      <h1 class="text-xl font-semibold text-gray-900 sm:text-2xl ">权限管理</h1>
     </div>
     <div class="relative">
       <form class="max-w-sm mb-4">
-        <label for="default-search"
-          class="mb-2 text-sm font-medium text-gray-900 sr-only dark:text-white">Search</label>
+        <label for="default-search" class="mb-2 text-sm font-medium text-gray-900 sr-only ">Search</label>
         <div class="relative">
           <div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none">
-            <svg class="w-4 h-4 text-gray-500 dark:text-gray-400" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
-              fill="none" viewBox="0 0 20 20">
+            <svg class="w-4 h-4 text-gray-500 " aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 20 20">
               <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                 d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z" />
             </svg>
           </div>
           <input type="search" id="default-search" v-model="permissionName"
-            class="block w-full p-4 ps-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+            class="block w-full p-4 ps-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500      "
             placeholder="权限名" required />
           <button type="submit"
-            class="text-white absolute end-2.5 bottom-2.5 bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
+            class="text-white absolute end-2.5 bottom-2.5 bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2   "
             @click.prevent="handleSearch">搜索</button>
         </div>
       </form>
       <!-- Create Modal toggle -->
       <button @click="handleUpsertPermissionClick(undefined)"
-        class="flex items-center block gap-x-1 text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800 absolute right-5 bottom-2"
+        class="flex items-center block gap-x-1 text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center    absolute right-5 bottom-2"
         type="button">
         新增权限
       </button>
     </div>
     <div class="relative overflow-x-auto">
-      <table class="w-full text-sm text-left rtl:text-right shadow-lg rounded-lg text-gray-500 dark:text-gray-400">
-        <thead class="text-xs  uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
+      <table class="w-full text-sm text-left rtl:text-right shadow-lg rounded-lg text-gray-500 ">
+        <thead class="text-xs  uppercase bg-gray-50  ">
           <tr>
             <th scope="col" class="p-4">
               <div class="flex items-center">
                 <input id="checkbox-all-search" disabled type="checkbox"
-                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500    focus:ring-2  ">
                 <label for="checkbox-all-search" class="sr-only">checkbox</label>
               </div>
             </th>
@@ -49,22 +48,22 @@
         </thead>
         <tbody>
           <tr v-for="permission in permissions" :key="permission.id"
-            class="bg-white border-b dark:bg-gray-800 dark:border-gray-700 border-gray-200 hover:bg-gray-50 dark:hover:bg-gray-600">
+            class="bg-white border-b   border-gray-200 hover:bg-gray-50 ">
             <td class="w-4 p-4">
               <div class="flex items-center">
                 <input :id="'checkbox-table-search-' + permission.id" type="checkbox" disabled
-                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500    focus:ring-2  ">
                 <label :for="'checkbox-table-search-' + permission.id" class="sr-only">checkbox</label>
               </div>
             </td>
-            <td scope="row" class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white">
+            <td scope="row" class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap ">
               {{ permission.name }}
             </td>
             <td class="px-6 py-4 max-w-sm overflow-hidden text-ellipsis">{{ permission.code }}</td>
             <td class="px-6 py-4 max-w-sm overflow-hidden text-ellipsis">
               <div class="flex items-center gap-x-2">
                 <button @click="handleUpsertPermissionClick(permission)"
-                  class="flex items-center justify-center min-w-25 gap-x-1  text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5   dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800 "
+                  class="flex items-center justify-center min-w-25 gap-x-1  text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5      "
                   type="button">
                   <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                     <path d="M17.414 2.586a2 2 0 00-2.828 0L7 10.172V13h2.828l7.586-7.586a2 2 0 000-2.828z"></path>
@@ -76,7 +75,7 @@
                 </button>
                 <button
                   class="flex items-center justify-center min-w-25  gap-x-1
-              bg-red-700 hover:bg-red-800 focus:outline-none dark:bg-red-600 dark:hover:bg-red-700
+              bg-red-700 hover:bg-red-800 focus:outline-none  
               focus:ring-red-500  text-white focus:ring-4 focus:outline-none font-medium rounded-lg text-sm px-5 py-2.5 "
                   @click="handleDeletePermissionClick(permission)" type="button">
                   <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
@@ -184,7 +183,7 @@ const handleDeleteModalSubmit = async () => {
 		content: "删除成功",
 		level: "success",
 	});
-  await fetchPermissionsWith({
+	await fetchPermissionsWith({
 		name: permissionName.value,
 	});
 };
diff --git a/frontend/src/views/PositionView.vue b/frontend/src/views/PositionView.vue
index 006c29a..26e39f5 100644
--- a/frontend/src/views/PositionView.vue
+++ b/frontend/src/views/PositionView.vue
@@ -2,44 +2,43 @@
   <div class="px-4 pt-6 xl:grid-cols-3 xl:gap-4 sm:rounded-lg">
     <div class="mb-4 col-span-full">
       <Breadcrumbs :names="['岗位管理']" />
-      <h1 class="text-xl font-semibold text-gray-900 sm:text-2xl dark:text-white">岗位管理</h1>
+      <h1 class="text-xl font-semibold text-gray-900 sm:text-2xl ">岗位管理</h1>
     </div>
     <div class="relative">
       <form class="max-w-sm mb-4 ">
-        <label for="default-search"
-          class="mb-2 text-sm font-medium text-gray-900 sr-only dark:text-white">Search</label>
+        <label for="default-search" class="mb-2 text-sm font-medium text-gray-900 sr-only ">Search</label>
         <div class="relative">
           <div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none">
-            <svg class="w-4 h-4 text-gray-500 dark:text-gray-400" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
-              fill="none" viewBox="0 0 20 20">
+            <svg class="w-4 h-4 text-gray-500 " aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 20 20">
               <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                 d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z" />
             </svg>
           </div>
           <input type="search" id="default-search" v-model="name"
-            class="block w-full p-4 ps-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+            class="block w-full p-4 ps-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500      "
             placeholder="岗位名称" required />
           <button type="submit"
-            class="text-white absolute end-2.5 bottom-2.5 bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
+            class="text-white absolute end-2.5 bottom-2.5 bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2   "
             @click.prevent="handleSearch">搜索</button>
         </div>
       </form>
       <!-- Create Modal toggle -->
       <button @click="handleUpsertPositionClick()"
-        class="flex items-center block text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800 absolute right-5 bottom-2"
+        class="flex items-center block text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center    absolute right-5 bottom-2"
         type="button">
         新增岗位
       </button>
     </div>
 
     <div class="relative overflow-x-auto">
-      <table class="w-full text-sm text-left rtl:text-right shadow-lg rounded-lg text-gray-500 dark:text-gray-400">
-        <thead class="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
+      <table class="w-full text-sm text-left rtl:text-right shadow-lg rounded-lg text-gray-500 ">
+        <thead class="text-xs text-gray-700 uppercase bg-gray-50  ">
           <tr>
             <th scope="col" class="p-4">
               <div class="flex items-center">
                 <input id="checkbox-all-search" disabled type="checkbox"
-                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500    focus:ring-2  ">
                 <label for="checkbox-all-search" class="sr-only">checkbox</label>
               </div>
             </th>
@@ -49,11 +48,11 @@
         </thead>
         <tbody>
           <tr v-for="position in positions" :key="position.id"
-            class="bg-white border-b dark:bg-gray-800 dark:border-gray-700 border-gray-200 hover:bg-gray-50 dark:hover:bg-gray-600">
+            class="bg-white border-b   border-gray-200 hover:bg-gray-50 ">
             <td class="w-4 p-4">
               <div class="flex items-center">
                 <input :id="'checkbox-table-search-' + position.id" type="checkbox" disabled
-                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500    focus:ring-2  ">
                 <label :for="'checkbox-table-search-' + position.id" class="sr-only">checkbox</label>
               </div>
             </td>
@@ -63,7 +62,7 @@
             <td class="px-6 py-4 max-w-sm overflow-hidden text-ellipsis">
               <div class="flex items-center gap-x-2">
                 <button @click="handleUpsertPositionClick(position)"
-                  class="flex items-center justify-center min-w-25 gap-x-1  text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5   dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800 "
+                  class="flex items-center justify-center min-w-25 gap-x-1  text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5      "
                   type="button">
                   <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                     <path d="M17.414 2.586a2 2 0 00-2.828 0L7 10.172V13h2.828l7.586-7.586a2 2 0 000-2.828z"></path>
@@ -75,7 +74,7 @@
                 </button>
                 <button
                   class="flex items-center justify-center min-w-25 gap-x-1
-              bg-red-700 hover:bg-red-800  dark:bg-red-600 dark:hover:bg-red-700
+              bg-red-700 hover:bg-red-800   
               focus:ring-red-500  text-white focus:ring-4 focus:outline-none font-medium rounded-lg text-sm px-5 py-2.5 text-center"
                   @click="handleDeletePositionClick(position)" type="button">
                   <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
diff --git a/frontend/src/views/RoleView.vue b/frontend/src/views/RoleView.vue
index 9d4be2f..33848c5 100644
--- a/frontend/src/views/RoleView.vue
+++ b/frontend/src/views/RoleView.vue
@@ -2,43 +2,42 @@
   <div class="px-4 pt-6 xl:grid-cols-3 xl:gap-4 sm:rounded-lg">
     <div class="mb-4 col-span-full">
       <Breadcrumbs :names="['角色管理']" />
-      <h1 class="text-xl font-semibold text-gray-900 sm:text-2xl dark:text-white">角色管理</h1>
+      <h1 class="text-xl font-semibold text-gray-900 sm:text-2xl ">角色管理</h1>
     </div>
     <div class="relative">
       <form class="max-w-sm mb-4">
-        <label for="default-search"
-          class="mb-2 text-sm font-medium text-gray-900 sr-only dark:text-white">Search</label>
+        <label for="default-search" class="mb-2 text-sm font-medium text-gray-900 sr-only ">Search</label>
         <div class="relative">
           <div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none">
-            <svg class="w-4 h-4 text-gray-500 dark:text-gray-400" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
-              fill="none" viewBox="0 0 20 20">
+            <svg class="w-4 h-4 text-gray-500 " aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 20 20">
               <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                 d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z" />
             </svg>
           </div>
           <input type="search" id="default-search" v-model="roleName"
-            class="block w-full p-4 ps-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+            class="block w-full p-4 ps-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500      "
             placeholder="角色名" required />
           <button type="submit"
-            class="text-white absolute end-2.5 bottom-2.5 bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
+            class="text-white absolute end-2.5 bottom-2.5 bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2   "
             @click.prevent="handleSearch">搜索</button>
         </div>
       </form>
       <!-- Create Modal toggle -->
       <button @click="handleUpsertRoleClick(undefined)"
-        class="flex items-center block gap-x-1 text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800 absolute right-5 bottom-2"
+        class="flex items-center block gap-x-1 text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center    absolute right-5 bottom-2"
         type="button">
         新增角色
       </button>
     </div>
     <div class="relative overflow-x-auto ">
-      <table class="w-full text-sm text-left rtl:text-right shadow-lg rounded-lg text-gray-500 dark:text-gray-400">
-        <thead class="text-xs uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
+      <table class="w-full text-sm text-left rtl:text-right shadow-lg rounded-lg text-gray-500 ">
+        <thead class="text-xs uppercase bg-gray-50  ">
           <tr>
             <th scope="col" class="p-4">
               <div class="flex items-center">
                 <input id="checkbox-all-search" disabled type="checkbox"
-                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500    focus:ring-2  ">
                 <label for="checkbox-all-search" class="sr-only">checkbox</label>
               </div>
             </th>
@@ -49,23 +48,22 @@
           </tr>
         </thead>
         <tbody>
-          <tr v-for="role in roles" :key="role.id"
-            class="bg-white border-b dark:bg-gray-800 dark:border-gray-700 border-gray-200 hover:bg-gray-50 dark:hover:bg-gray-600">
+          <tr v-for="role in roles" :key="role.id" class="bg-white border-b   border-gray-200 hover:bg-gray-50 ">
             <td class="w-4 p-4">
               <div class="flex items-center">
                 <input :id="'checkbox-table-search-' + role.id" type="checkbox" disabled
-                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500    focus:ring-2  ">
                 <label :for="'checkbox-table-search-' + role.id" class="sr-only">checkbox</label>
               </div>
             </td>
-            <td scope="row" class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white">
+            <td scope="row" class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap ">
               {{ role.name }}
             </td>
             <td class="px-6 py-4 max-w-sm overflow-hidden text-ellipsis">{{ role.code }}</td>
             <td class="px-6 py-4 max-w-sm overflow-hidden text-ellipsis">
               <div>
                 <button
-                  class="flex itmes-center justify-center min-w-min text-gray-900 bg-white border border-gray-300 focus:outline-none hover:bg-gray-100 focus:ring-4 focus:ring-gray-100 font-medium rounded-lg text-sm px-4 py-2.5  dark:bg-gray-800 dark:text-white dark:border-gray-600 dark:hover:bg-gray-700 dark:hover:border-gray-600 dark:focus:ring-gray-700"
+                  class="flex itmes-center justify-center min-w-min text-gray-900 bg-white border border-gray-300 focus:outline-none hover:bg-gray-100 focus:ring-4 focus:ring-gray-100 font-medium rounded-lg text-sm px-4 py-2.5       "
                   @click="handleBindPermissionClick(role)" type="button">
                   <span>分配权限</span>
                 </button>
@@ -74,7 +72,7 @@
             <td class="px-6 py-4 max-w-sm overflow-hidden text-ellipsis">
               <div class="flex items-center gap-x-2">
                 <button @click="handleUpsertRoleClick(role)"
-                  class="flex items-center justify-center min-w-25  gap-x-1  text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800 "
+                  class="flex items-center justify-center min-w-25  gap-x-1  text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5    "
                   type="button">
                   <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                     <path d="M17.414 2.586a2 2 0 00-2.828 0L7 10.172V13h2.828l7.586-7.586a2 2 0 000-2.828z"></path>
@@ -86,7 +84,7 @@
                 </button>
                 <button
                   class="flex items-center justify-center min-w-25 block gap-x-1
-              bg-red-700 hover:bg-red-800 focus:outline-none dark:bg-red-600 dark:hover:bg-red-700
+              bg-red-700 hover:bg-red-800 focus:outline-none  
               focus:ring-red-500 block text-white focus:ring-4 focus:outline-none font-medium rounded-lg text-sm px-5 py-2.5"
                   @click="handleDeleteRoleClick(role)" type="button">
                   <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
diff --git a/frontend/src/views/SchedulerView.vue b/frontend/src/views/SchedulerView.vue
index 1411077..7a6392d 100644
--- a/frontend/src/views/SchedulerView.vue
+++ b/frontend/src/views/SchedulerView.vue
@@ -2,25 +2,24 @@
   <div class="px-4 pt-6 xl:grid-cols-3 xl:gap-4 sm:rounded-lg">
     <div class="mb-4 col-span-full">
       <Breadcrumbs :names="['任务管理']" />
-      <h1 class="text-xl font-semibold text-gray-900 sm:text-2xl dark:text-white">任务管理</h1>
+      <h1 class="text-xl font-semibold text-gray-900 sm:text-2xl ">任务管理</h1>
     </div>
     <div class="relative">
       <form class="max-w-sm mb-4 ">
-        <label for="default-search"
-          class="mb-2 text-sm font-medium text-gray-900 sr-only dark:text-white">Search</label>
+        <label for="default-search" class="mb-2 text-sm font-medium text-gray-900 sr-only ">Search</label>
         <div class="relative">
           <div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none">
-            <svg class="w-4 h-4 text-gray-500 dark:text-gray-400" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
-              fill="none" viewBox="0 0 20 20">
+            <svg class="w-4 h-4 text-gray-500 " aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 20 20">
               <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                 d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z" />
             </svg>
           </div>
           <input type="search" id="default-search" v-model="jobName"
-            class="block w-full p-4 ps-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+            class="block w-full p-4 ps-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500      "
             placeholder="任务名称" required />
           <button type="submit"
-            class="text-white absolute end-2.5 bottom-2.5 bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
+            class="text-white absolute end-2.5 bottom-2.5 bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2   "
             @click.prevent="handleSearch">搜索</button>
         </div>
       </form>
@@ -28,14 +27,13 @@
     </div>
 
     <div class="relative overflow-x-auto">
-      <table
-        class="w-full text-sm text-left rtl:text-right shadow-lg rounded-lg text-gray-500 dark:text-gray-400 overflow-x-auto">
-        <thead class="text-xs uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
+      <table class="w-full text-sm text-left rtl:text-right shadow-lg rounded-lg text-gray-500  overflow-x-auto">
+        <thead class="text-xs uppercase bg-gray-50  ">
           <tr>
             <th scope="col" class="p-4">
               <div class="flex items-center">
                 <input id="checkbox-all-search" disabled type="checkbox"
-                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500    focus:ring-2  ">
                 <label for="checkbox-all-search" class="sr-only">checkbox</label>
               </div>
             </th>
@@ -53,16 +51,15 @@
           </tr>
         </thead>
         <tbody>
-          <tr v-for="job in jobs" :key="job.triggerName"
-            class="bg-white border-b dark:bg-gray-800 dark:border-gray-700 border-gray-200 hover:bg-gray-50 dark:hover:bg-gray-600">
+          <tr v-for="job in jobs" :key="job.triggerName" class="bg-white border-b   border-gray-200 hover:bg-gray-50 ">
             <td class="w-4 p-4">
               <div class="flex items-center">
                 <input :id="'checkbox-table-search-' + job.triggerName" type="checkbox" disabled
-                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500    focus:ring-2  ">
                 <label :for="'checkbox-table-search-' + job.triggerName" class="sr-only">checkbox</label>
               </div>
             </td>
-            <td class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white">{{
+            <td class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap ">{{
               `${job.name}:${job.group}` }}</td>
             <td class="px-6 py-4 max-w-sm overflow-hidden text-ellipsis">{{
               `${job.triggerName}:${job.triggerGroup}` }}
@@ -87,7 +84,7 @@
             <td class="px-6 py-4 whitespace-nowrap">
               <div class="flex items-center gap-x-2">
                 <button @click="handleCronUpdateClick(job)" :disabled="job.schedulerType !== 'CRON'"
-                  :class="['flex items-center justify-center gap-x-1  text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5  dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800' , { 'opacity-50 cursor-not-allowed': job.schedulerType !== 'CRON' }]"
+                  :class="['flex items-center justify-center gap-x-1  text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5    ' , { 'opacity-50 cursor-not-allowed': job.schedulerType !== 'CRON' }]"
                   type="button">
                   <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                     <path d="M17.414 2.586a2 2 0 00-2.828 0L7 10.172V13h2.828l7.586-7.586a2 2 0 000-2.828z"></path>
@@ -102,12 +99,12 @@
             <td class="px-6 py-4 whitespace-nowrap">
               <div class="flex items-center justify-center gap-x-2">
                 <button
-                  :class="['text-white bg-green-700 hover:bg-green-800 focus:ring-green-300 dark:bg-green-600 dark:hover:bg-green-700 dark:focus:ring-green-900  focus:ring-4 focus:outline-none font-medium rounded-lg text-sm px-5 py-2.5 text-center']"
+                  :class="['text-white bg-green-700 hover:bg-green-800 focus:ring-green-300     focus:ring-4 focus:outline-none font-medium rounded-lg text-sm px-5 py-2.5 text-center']"
                   @click="handleResumeJobClick(job)" type="button">
                   <span>恢复</span>
                 </button>
                 <button
-                  :class="['bg-red-700 hover:bg-red-800 focus:ring-red-300 dark:bg-red-600 dark:hover:bg-red-700 dark:focus:ring-red-900 text-white focus:ring-4 focus:outline-none font-medium rounded-lg text-sm px-5 py-2.5 text-center']"
+                  :class="['bg-red-700 hover:bg-red-800 focus:ring-red-300    text-white focus:ring-4 focus:outline-none font-medium rounded-lg text-sm px-5 py-2.5 text-center']"
                   @click="handlePauseJobClick(job)" type="button">
                   <span>暂停</span>
                 </button>
diff --git a/frontend/src/views/SettingsView.vue b/frontend/src/views/SettingsView.vue
index 2de561a..47777be 100644
--- a/frontend/src/views/SettingsView.vue
+++ b/frontend/src/views/SettingsView.vue
@@ -1,50 +1,46 @@
 <template>
-  <div class="grid grid-cols-1 px-4 pt-6 xl:grid-cols-3 xl:gap-4 dark:bg-gray-900 ">
+  <div class="grid grid-cols-1 px-4 pt-6 xl:grid-cols-3 xl:gap-4  ">
     <div class="mb-4 col-span-full xl:mb-2">
       <Breadcrumbs :names="['用户设置']" />
-      <h1 class="text-xl font-semibold text-gray-900 sm:text-2xl dark:text-white">用户设置</h1>
+      <h1 class="text-xl font-semibold text-gray-900 sm:text-2xl ">用户设置</h1>
     </div>
     <!-- Right Content -->
     <div class="col-span-full xl:col-auto">
     </div>
     <div class="col-span-1 row-start-3">
-      <div
-        class="p-4 mb-4 bg-white border border-gray-200 rounded-lg shadow-sm 2xl:col-span-2 dark:border-gray-700 sm:p-6 dark:bg-gray-800">
-        <h3 class="mb-4 text-xl font-semibold dark:text-white">个人信息</h3>
+      <div class="p-4 mb-4 bg-white border border-gray-200 rounded-lg shadow-sm 2xl:col-span-2  sm:p-6 ">
+        <h3 class="mb-4 text-xl font-semibold ">个人信息</h3>
         <form action="#">
           <div class="grid grid-cols-6 gap-6">
             <div class="col-span-6 ">
-              <label for="current-username"
-                class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">用户名</label>
+              <label for="current-username" class="block mb-2 text-sm font-medium text-gray-900 ">用户名</label>
               <input type="text" name="current-username" id="current-username" v-model="userForm.username"
-                class="shadow-sm bg-gray-50 border border-gray-300 text-gray-900 sm:text-sm rounded-lg focus:ring-primary-500 focus:border-primary-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
+                class="shadow-sm bg-gray-50 border border-gray-300 text-gray-900 sm:text-sm rounded-lg focus:ring-primary-500 focus:border-primary-500 block w-full p-2.5      "
                 required>
             </div>
             <div class="col-span-6 ">
-              <label for="current-password"
-                class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">密码</label>
+              <label for="current-password" class="block mb-2 text-sm font-medium text-gray-900 ">密码</label>
               <input type="password" name="current-password" id="current-password" v-model="userForm.password"
-                class="shadow-sm bg-gray-50 border border-gray-300 text-gray-900 sm:text-sm rounded-lg focus:ring-primary-500 focus:border-primary-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
+                class="shadow-sm bg-gray-50 border border-gray-300 text-gray-900 sm:text-sm rounded-lg focus:ring-primary-500 focus:border-primary-500 block w-full p-2.5      "
                 placeholder="非必填" required>
             </div>
             <div class="col-span-6 ">
-              <label for="password" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">确认密码</label>
+              <label for="password" class="block mb-2 text-sm font-medium text-gray-900 ">确认密码</label>
               <input type="password" id="password" v-model="userForm.confirmPassword"
-                class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+                class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5      "
                 placeholder="非必填" required>
             </div>
             <div class="col-span-6 ">
-              <label for="category" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">状态</label>
-              <select id="category" disabled v-model="userForm.enable"
-                class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-500 focus:border-primary-500 block w-full p-2.5 
-                opacity-50 cursor-not-allowed dark:bg-gray-600 dark:border-gray-500 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500">
+              <label for="category" class="block mb-2 text-sm font-medium text-gray-900 ">状态</label>
+              <select id="category" disabled v-model="userForm.enable" class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-500 focus:border-primary-500 block w-full p-2.5 
+                opacity-50 cursor-not-allowed      ">
                 <option :value=true>启用</option>
                 <option :value=false>禁用</option>
               </select>
             </div>
             <div class="col-span-6 sm:col-full">
               <button
-                class="text-white bg-primary-700 hover:bg-primary-800 focus:ring-4 focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800"
+                class="text-white bg-primary-700 hover:bg-primary-800 focus:ring-4 focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center   "
                 @click.prevent="handleUpdateClick" type="submit">保存</button>
             </div>
           </div>
diff --git a/frontend/src/views/UserView.vue b/frontend/src/views/UserView.vue
index 3312894..b89493b 100644
--- a/frontend/src/views/UserView.vue
+++ b/frontend/src/views/UserView.vue
@@ -2,43 +2,42 @@
   <div class="px-4 pt-6 xl:grid-cols-3 xl:gap-4 sm:rounded-lg">
     <div class="mb-4 col-span-full">
       <Breadcrumbs :names="['用户管理']" />
-      <h1 class="text-xl font-semibold text-gray-900 sm:text-2xl dark:text-white">用户管理</h1>
+      <h1 class="text-xl font-semibold text-gray-900 sm:text-2xl ">用户管理</h1>
     </div>
     <div class="relative">
       <form class="max-w-sm mb-4 ">
-        <label for="default-search"
-          class="mb-2 text-sm font-medium text-gray-900 sr-only dark:text-white">Search</label>
+        <label for="default-search" class="mb-2 text-sm font-medium text-gray-900 sr-only ">Search</label>
         <div class="relative">
           <div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none">
-            <svg class="w-4 h-4 text-gray-500 dark:text-gray-400" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
-              fill="none" viewBox="0 0 20 20">
+            <svg class="w-4 h-4 text-gray-500 " aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 20 20">
               <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                 d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z" />
             </svg>
           </div>
           <input type="search" id="default-search" v-model="username"
-            class="block w-full p-4 ps-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+            class="block w-full p-4 ps-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500      "
             placeholder="用户名" required />
           <button type="submit"
-            class="text-white absolute end-2.5 bottom-2.5 bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
+            class="text-white absolute end-2.5 bottom-2.5 bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2   "
             @click.prevent="handleSearch">搜索</button>
         </div>
       </form>
       <!-- Create Modal toggle -->
       <button @click="handleUpsertUserClick(undefined)"
-        class="flex items-center block text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800 absolute right-5 bottom-2"
+        class="flex items-center block text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center    absolute right-5 bottom-2"
         type="button">
         新增用户
       </button>
     </div>
     <div class="relative overflow-x-auto">
-      <table class="w-full text-sm text-left rtl:text-right shadow-lg rounded-lg   text-gray-500 dark:text-gray-400">
-        <thead class="text-xs uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
+      <table class="w-full text-sm text-left rtl:text-right shadow-lg rounded-lg   text-gray-500 ">
+        <thead class="text-xs uppercase bg-gray-50  ">
           <tr>
             <th scope="col" class="p-4">
               <div class="flex items-center">
                 <input id="checkbox-all-search" disabled type="checkbox"
-                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500    focus:ring-2  ">
                 <label for="checkbox-all-search" class="sr-only">checkbox</label>
               </div>
             </th>
@@ -50,17 +49,16 @@
           </tr>
         </thead>
         <tbody>
-          <tr v-for="user in users" :key="user.id"
-            class="bg-white border-b dark:bg-gray-800 dark:border-gray-700 border-gray-200 hover:bg-gray-50 dark:hover:bg-gray-600">
+          <tr v-for="user in users" :key="user.id" class="bg-white border-b   border-gray-200 hover:bg-gray-50 ">
             <td class="w-4 p-4">
               <div class="flex items-center">
                 <input :id="'checkbox-table-search-' + user.id" type="checkbox" disabled
-                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+                  class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded-sm focus:ring-blue-500    focus:ring-2  ">
                 <label :for="'checkbox-table-search-' + user.id" class="sr-only">checkbox</label>
               </div>
             </td>
             <td scope="row"
-              class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white max-w-sm overflow-hidden text-ellipsis">
+              class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap  max-w-sm overflow-hidden text-ellipsis">
               {{ user.username }}
             </td>
             <td class="px-6 py-4 max-w-sm overflow-hidden text-ellipsis">
@@ -75,17 +73,17 @@
             <td class="px-6 py-4 max-w-sm overflow-hidden text-ellipsis">
               <div class="flex items-center gap-x-2">
                 <button
-                  class="text-gray-900 bg-white border min-w-25 border-gray-300 focus:outline-none hover:bg-gray-100 focus:ring-4 focus:ring-gray-100 font-medium rounded-lg text-sm px-4 py-2.5  dark:bg-gray-800 dark:text-white dark:border-gray-600 dark:hover:bg-gray-700 dark:hover:border-gray-600 dark:focus:ring-gray-700"
+                  class="text-gray-900 bg-white border min-w-25 border-gray-300 focus:outline-none hover:bg-gray-100 focus:ring-4 focus:ring-gray-100 font-medium rounded-lg text-sm px-4 py-2.5       "
                   @click="handleBindRoleClick(user)" type="button">
                   分配角色
                 </button>
                 <button
-                  class="text-gray-900 bg-white border min-w-25 border-gray-300 focus:outline-none hover:bg-gray-100 focus:ring-4 focus:ring-gray-100 font-medium rounded-lg text-sm px-4 py-2.5  dark:bg-gray-800 dark:text-white dark:border-gray-600 dark:hover:bg-gray-700 dark:hover:border-gray-600 dark:focus:ring-gray-700"
+                  class="text-gray-900 bg-white border min-w-25 border-gray-300 focus:outline-none hover:bg-gray-100 focus:ring-4 focus:ring-gray-100 font-medium rounded-lg text-sm px-4 py-2.5       "
                   @click="handleBindPositionClick(user)" type="button">
                   分配岗位
                 </button>
                 <button
-                  class="text-gray-900 bg-white border min-w-25 border-gray-300 focus:outline-none hover:bg-gray-100 focus:ring-4 focus:ring-gray-100 font-medium rounded-lg text-sm px-4 py-2.5  dark:bg-gray-800 dark:text-white dark:border-gray-600 dark:hover:bg-gray-700 dark:hover:border-gray-600 dark:focus:ring-gray-700"
+                  class="text-gray-900 bg-white border min-w-25 border-gray-300 focus:outline-none hover:bg-gray-100 focus:ring-4 focus:ring-gray-100 font-medium rounded-lg text-sm px-4 py-2.5       "
                   @click="handleBindDepartmentClick(user)" type="button">
                   分配部门
                 </button>
@@ -95,7 +93,7 @@
               <!-- Edit Modal toggle -->
               <div class="flex items-center gap-x-2">
                 <button @click="handleUpsertUserClick(user)"
-                  class="flex items-center justify-center min-w-25 gap-x-1 text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2.5 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
+                  class="flex items-center justify-center min-w-25 gap-x-1 text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2.5   "
                   type="button">
                   <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                     <path d="M17.414 2.586a2 2 0 00-2.828 0L7 10.172V13h2.828l7.586-7.586a2 2 0 000-2.828z"></path>
@@ -105,10 +103,9 @@
                   </svg>
                   <span>编辑</span>
                 </button>
-                <button
-                  class="flex items-center justify-center min-w-25 gap-x-1
-              bg-red-700 hover:bg-red-800 focus:outline-none focus:ring-red-300 dark:bg-red-600 dark:hover:bg-red-700
-              dark:focus:ring-red-900  text-white focus:ring-4 focus:outline-nonefont-medium rounded-lg text-sm px-4 py-2.5"
+                <button class="flex items-center justify-center min-w-25 gap-x-1
+              bg-red-700 hover:bg-red-800 focus:outline-none focus:ring-red-300  
+                text-white focus:ring-4 focus:outline-nonefont-medium rounded-lg text-sm px-4 py-2.5"
                   @click="handleDeleteUserClick(user)" type="button">
                   <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                     <path fill-rule="evenodd"