diff --git a/mock/system.ts b/mock/system.ts
index e9c595288..c4ec3213b 100644
--- a/mock/system.ts
+++ b/mock/system.ts
@@ -1,9 +1,9 @@
 import { MockMethod } from "vite-plugin-mock";
 
 export default [
-  // 角色
+  // 用户
   {
-    url: "/role",
+    url: "/user",
     method: "post",
     response: () => {
       return {
@@ -11,58 +11,114 @@ export default [
         data: {
           list: [
             {
-              createTime: 1605456000000,
-              updateTime: 1645477701000,
-              creator: "admin",
-              updater: "",
-              deleted: false,
-              tenantId: 1,
+              username: "admin",
+              nickname: "admin",
+              remark: "管理员",
+              deptId: 103,
+              postIds: [1],
+              mobile: "15888888888",
+              sex: 0,
               id: 1,
-              name: "超级管理员",
-              code: "super_admin",
-              sort: 1,
               status: 0,
-              type: 1,
-              remark: "超级管理员",
-              dataScope: 1,
-              dataScopeDeptIds: null
+              createTime: 1605456000000,
+              dept: {
+                id: 103,
+                name: "研发部门"
+              }
             },
             {
+              username: "pure",
+              nickname: "pure",
+              remark: "不要吓我",
+              deptId: 104,
+              postIds: [1],
+              mobile: "15888888888",
+              sex: 0,
+              id: 100,
+              status: 1,
               createTime: 1605456000000,
-              updateTime: 1645477700000,
-              creator: "admin",
-              updater: "",
-              deleted: false,
-              tenantId: 1,
-              id: 2,
-              name: "普通角色",
-              code: "common",
-              sort: 2,
-              status: 0,
-              type: 1,
-              remark: "普通角色",
-              dataScope: 2,
-              dataScopeDeptIds: null
+              dept: {
+                id: 104,
+                name: "市场部门"
+              }
             },
             {
+              username: "小姐姐",
+              nickname: "girl",
+              remark: null,
+              deptId: 106,
+              postIds: null,
+              mobile: "15888888888",
+              sex: 1,
+              id: 103,
+              status: 1,
               createTime: 1605456000000,
-              updateTime: 1647698441000,
-              creator: "",
-              updater: "1",
-              deleted: false,
-              tenantId: 1,
-              id: 101,
-              name: "测试账号",
-              code: "test",
-              sort: 0,
+              dept: {
+                id: 106,
+                name: "财务部门"
+              }
+            },
+            {
+              username: "小哥哥",
+              nickname: "boy",
+              remark: null,
+              deptId: 107,
+              postIds: [],
+              mobile: "15888888888",
+              sex: 0,
+              id: 104,
               status: 0,
-              type: 2,
-              remark: "132",
-              dataScope: 1,
-              dataScopeDeptIds: []
+              createTime: 1605456000000,
+              dept: {
+                id: 107,
+                name: "运维部门"
+              }
             }
           ],
-          total: 3
+          total: 4
+        }
+      };
+    }
+  },
+  // 角色
+  {
+    url: "/role",
+    method: "post",
+    response: ({ body }) => {
+      let list = [
+        {
+          createTime: 1605456000000, // 时间戳（毫秒ms）
+          updateTime: 1684512000000,
+          creator: "admin",
+          id: 1,
+          name: "超级管理员",
+          code: "admin",
+          status: 1, // 状态 1 启用 0 停用
+          remark: "超级管理员拥有最高权限"
+        },
+        {
+          createTime: 1605456000000,
+          updateTime: 1684512000000,
+          creator: "admin",
+          id: 2,
+          name: "普通角色",
+          code: "common",
+          status: 1,
+          remark: "普通角色拥有部分权限"
+        }
+      ];
+      list = list.filter(item => item.name.includes(body?.name));
+      list = list.filter(item =>
+        String(item.status).includes(String(body?.status))
+      );
+      if (body.code) list = list.filter(item => item.code === body.code);
+      return {
+        success: true,
+        data: {
+          list,
+          total: list.length, // 总条目数
+          pageSize: 10, // 每页显示条目个数
+          currentPage: 1 // 当前页数
         }
       };
     }
@@ -83,7 +139,7 @@ export default [
             phone: "15888888888",
             principal: "@cname()",
             email: "@email",
-            status: 1,
+            status: 1, // 状态 1 启用 0 停用
             type: 1, // 1 公司 2 分公司 3 部门
             createTime: 1605456000000,
             remark: "@cparagraph(1, 3)"
@@ -208,84 +264,5 @@ export default [
         ]
       };
     }
-  },
-  // 用户
-  {
-    url: "/user",
-    method: "post",
-    response: () => {
-      return {
-        success: true,
-        data: {
-          list: [
-            {
-              username: "admin",
-              nickname: "admin",
-              remark: "管理员",
-              deptId: 103,
-              postIds: [1],
-              mobile: "15888888888",
-              sex: 0,
-              id: 1,
-              status: 0,
-              createTime: 1605456000000,
-              dept: {
-                id: 103,
-                name: "研发部门"
-              }
-            },
-            {
-              username: "pure",
-              nickname: "pure",
-              remark: "不要吓我",
-              deptId: 104,
-              postIds: [1],
-              mobile: "15888888888",
-              sex: 0,
-              id: 100,
-              status: 1,
-              createTime: 1605456000000,
-              dept: {
-                id: 104,
-                name: "市场部门"
-              }
-            },
-            {
-              username: "小姐姐",
-              nickname: "girl",
-              remark: null,
-              deptId: 106,
-              postIds: null,
-              mobile: "15888888888",
-              sex: 1,
-              id: 103,
-              status: 1,
-              createTime: 1605456000000,
-              dept: {
-                id: 106,
-                name: "财务部门"
-              }
-            },
-            {
-              username: "小哥哥",
-              nickname: "boy",
-              remark: null,
-              deptId: 107,
-              postIds: [],
-              mobile: "15888888888",
-              sex: 0,
-              id: 104,
-              status: 0,
-              createTime: 1605456000000,
-              dept: {
-                id: 107,
-                name: "运维部门"
-              }
-            }
-          ],
-          total: 4
-        }
-      };
-    }
   }
 ] as MockMethod[];
diff --git a/package.json b/package.json
index 484ab32a5..8c97b4324 100644
--- a/package.json
+++ b/package.json
@@ -70,7 +70,7 @@
     "vue-json-pretty": "^2.2.4",
     "vue-pdf-embed": "^1.1.6",
     "vue-router": "^4.2.0",
-    "vue-types": "^5.0.2",
+    "vue-types": "^5.0.3",
     "vue-virtual-scroller": "2.0.0-beta.7",
     "vue-waterfall-plugin-next": "^2.2.1",
     "vue3-danmaku": "1.4.0-beta.1",
@@ -95,8 +95,8 @@
     "@types/qrcode": "^1.5.0",
     "@types/qs": "^6.9.7",
     "@types/sortablejs": "^1.15.1",
-    "@typescript-eslint/eslint-plugin": "^5.59.5",
-    "@typescript-eslint/parser": "^5.59.5",
+    "@typescript-eslint/eslint-plugin": "^5.59.6",
+    "@typescript-eslint/parser": "^5.59.6",
     "@vitejs/plugin-vue": "^4.2.3",
     "@vitejs/plugin-vue-jsx": "^3.0.1",
     "@vue/eslint-config-prettier": "^7.1.0",
@@ -106,7 +106,7 @@
     "cssnano": "^6.0.1",
     "eslint": "^8.40.0",
     "eslint-plugin-prettier": "^4.2.1",
-    "eslint-plugin-vue": "^9.12.0",
+    "eslint-plugin-vue": "^9.13.0",
     "husky": "^8.0.3",
     "lint-staged": "^13.2.2",
     "picocolors": "^1.0.0",
@@ -133,9 +133,9 @@
     "stylelint-scss": "^5.0.0",
     "svgo": "^3.0.2",
     "tailwindcss": "^3.3.2",
-    "terser": "^5.17.3",
+    "terser": "^5.17.4",
     "typescript": "^5.0.4",
-    "vite": "^4.3.5",
+    "vite": "^4.3.7",
     "vite-plugin-cdn-import": "^0.3.5",
     "vite-plugin-compression": "^0.5.1",
     "vite-plugin-mock": "^2.9.6",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 1d695a0bd..4c37fb0b1 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -24,8 +24,8 @@ specifiers:
   "@types/qrcode": ^1.5.0
   "@types/qs": ^6.9.7
   "@types/sortablejs": ^1.15.1
-  "@typescript-eslint/eslint-plugin": ^5.59.5
-  "@typescript-eslint/parser": ^5.59.5
+  "@typescript-eslint/eslint-plugin": ^5.59.6
+  "@typescript-eslint/parser": ^5.59.6
   "@vitejs/plugin-vue": ^4.2.3
   "@vitejs/plugin-vue-jsx": ^3.0.1
   "@vue/eslint-config-prettier": ^7.1.0
@@ -48,7 +48,7 @@ specifiers:
   element-resize-detector: ^1.2.4
   eslint: ^8.40.0
   eslint-plugin-prettier: ^4.2.1
-  eslint-plugin-vue: ^9.12.0
+  eslint-plugin-vue: ^9.13.0
   husky: ^8.0.3
   intro.js: ^7.0.1
   js-cookie: ^3.0.5
@@ -89,11 +89,11 @@ specifiers:
   svgo: ^3.0.2
   swiper: ^9.3.1
   tailwindcss: ^3.3.2
-  terser: ^5.17.3
+  terser: ^5.17.4
   typeit: ^8.7.1
   typescript: ^5.0.4
   v-contextmenu: 3.0.0
-  vite: ^4.3.5
+  vite: ^4.3.7
   vite-plugin-cdn-import: ^0.3.5
   vite-plugin-compression: ^0.5.1
   vite-plugin-mock: ^2.9.6
@@ -106,7 +106,7 @@ specifiers:
   vue-pdf-embed: ^1.1.6
   vue-router: ^4.2.0
   vue-tsc: ^1.6.5
-  vue-types: ^5.0.2
+  vue-types: ^5.0.3
   vue-virtual-scroller: 2.0.0-beta.7
   vue-waterfall-plugin-next: ^2.2.1
   vue3-danmaku: 1.4.0-beta.1
@@ -156,7 +156,7 @@ dependencies:
   vue-json-pretty: 2.2.4_vue@3.3.2
   vue-pdf-embed: 1.1.6_vue@3.3.2
   vue-router: 4.2.0_vue@3.3.2
-  vue-types: 5.0.2_vue@3.3.2
+  vue-types: 5.0.3_vue@3.3.2
   vue-virtual-scroller: 2.0.0-beta.7_vue@3.3.2
   vue-waterfall-plugin-next: 2.2.1_vue@3.3.2
   vue3-danmaku: 1.4.0-beta.1_vue@3.3.2
@@ -181,18 +181,18 @@ devDependencies:
   "@types/qrcode": 1.5.0
   "@types/qs": 6.9.7
   "@types/sortablejs": 1.15.1
-  "@typescript-eslint/eslint-plugin": 5.59.5_zaj6dsh3leplki3sfxgbx2w2za
-  "@typescript-eslint/parser": 5.59.5_3qfatcekpgbllh6uk5ivyhkbxq
-  "@vitejs/plugin-vue": 4.2.3_vite@4.3.5+vue@3.3.2
-  "@vitejs/plugin-vue-jsx": 3.0.1_vite@4.3.5+vue@3.3.2
+  "@typescript-eslint/eslint-plugin": 5.59.6_hrzo544y7ygaq2nap7kmpxcgnm
+  "@typescript-eslint/parser": 5.59.6_3qfatcekpgbllh6uk5ivyhkbxq
+  "@vitejs/plugin-vue": 4.2.3_vite@4.3.7+vue@3.3.2
+  "@vitejs/plugin-vue-jsx": 3.0.1_vite@4.3.7+vue@3.3.2
   "@vue/eslint-config-prettier": 7.1.0_aq37wtubambsjkbuajxtwljxa4
-  "@vue/eslint-config-typescript": 11.0.3_nhvncizgwdwdw3lhirpwnri2za
+  "@vue/eslint-config-typescript": 11.0.3_2scluc6ttmuw6bnoknuoazerjy
   autoprefixer: 10.4.14_postcss@8.4.23
   cloc: 2.11.0
   cssnano: 6.0.1_postcss@8.4.23
   eslint: 8.40.0
   eslint-plugin-prettier: 4.2.1_aq37wtubambsjkbuajxtwljxa4
-  eslint-plugin-vue: 9.12.0_eslint@8.40.0
+  eslint-plugin-vue: 9.13.0_eslint@8.40.0
   husky: 8.0.3
   lint-staged: 13.2.2
   picocolors: 1.0.0
@@ -219,12 +219,12 @@ devDependencies:
   stylelint-scss: 5.0.0_stylelint@15.6.1
   svgo: 3.0.2
   tailwindcss: 3.3.2
-  terser: 5.17.3
+  terser: 5.17.4
   typescript: 5.0.4
-  vite: 4.3.5_wshwf6lyytunybtggckvwapi7u
+  vite: 4.3.7_tal7gj4owy4f6uovip3nh65ye4
   vite-plugin-cdn-import: 0.3.5
-  vite-plugin-compression: 0.5.1_vite@4.3.5
-  vite-plugin-mock: 2.9.8_mockjs@1.1.0+vite@4.3.5
+  vite-plugin-compression: 0.5.1_vite@4.3.7
+  vite-plugin-mock: 2.9.8_mockjs@1.1.0+vite@4.3.7
   vite-plugin-remove-console: 2.1.1
   vite-svg-loader: 4.0.0
   vue-eslint-parser: 9.3.0_eslint@8.40.0
@@ -1079,10 +1079,10 @@ packages:
       vue: 3.3.2
     dev: false
 
-  /@esbuild/android-arm/0.17.18:
+  /@esbuild/android-arm/0.17.19:
     resolution:
       {
-        integrity: sha512-EmwL+vUBZJ7mhFCs5lA4ZimpUH3WMAoqvOIYhVQwdIgSpHC8ImHdsRyhHAVxpDYUSm0lWvd63z0XH1IlImS2Qw==
+        integrity: sha512-rIKddzqhmav7MSmoFCmDIb6e2W57geRsM94gV2l38fzhXMwq7hZoClug9USI2pFRGL06f4IOPHHpFNOkWieR8A==
       }
     engines: { node: ">=12" }
     cpu: [arm]
@@ -1091,10 +1091,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/android-arm64/0.17.18:
+  /@esbuild/android-arm64/0.17.19:
     resolution:
       {
-        integrity: sha512-/iq0aK0eeHgSC3z55ucMAHO05OIqmQehiGay8eP5l/5l+iEr4EIbh4/MI8xD9qRFjqzgkc0JkX0LculNC9mXBw==
+        integrity: sha512-KBMWvEZooR7+kzY0BtbTQn0OAYY7CsiydT63pVEaPtVYF0hXbUaOyZog37DKxK7NF3XacBJOpYT4adIJh+avxA==
       }
     engines: { node: ">=12" }
     cpu: [arm64]
@@ -1103,10 +1103,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/android-x64/0.17.18:
+  /@esbuild/android-x64/0.17.19:
     resolution:
       {
-        integrity: sha512-x+0efYNBF3NPW2Xc5bFOSFW7tTXdAcpfEg2nXmxegm4mJuVeS+i109m/7HMiOQ6M12aVGGFlqJX3RhNdYM2lWg==
+        integrity: sha512-uUTTc4xGNDT7YSArp/zbtmbhO0uEEK9/ETW29Wk1thYUJBz3IVnvgEiEwEa9IeLyvnpKrWK64Utw2bgUmDveww==
       }
     engines: { node: ">=12" }
     cpu: [x64]
@@ -1115,10 +1115,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/darwin-arm64/0.17.18:
+  /@esbuild/darwin-arm64/0.17.19:
     resolution:
       {
-        integrity: sha512-6tY+djEAdF48M1ONWnQb1C+6LiXrKjmqjzPNPWXhu/GzOHTHX2nh8Mo2ZAmBFg0kIodHhciEgUBtcYCAIjGbjQ==
+        integrity: sha512-80wEoCfF/hFKM6WE1FyBHc9SfUblloAWx6FJkFWTWiCoht9Mc0ARGEM47e67W9rI09YoUxJL68WHfDRYEAvOhg==
       }
     engines: { node: ">=12" }
     cpu: [arm64]
@@ -1127,10 +1127,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/darwin-x64/0.17.18:
+  /@esbuild/darwin-x64/0.17.19:
     resolution:
       {
-        integrity: sha512-Qq84ykvLvya3dO49wVC9FFCNUfSrQJLbxhoQk/TE1r6MjHo3sFF2tlJCwMjhkBVq3/ahUisj7+EpRSz0/+8+9A==
+        integrity: sha512-IJM4JJsLhRYr9xdtLytPLSH9k/oxR3boaUIYiHkAawtwNOXKE8KoU8tMvryogdcT8AU+Bflmh81Xn6Q0vTZbQw==
       }
     engines: { node: ">=12" }
     cpu: [x64]
@@ -1139,10 +1139,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/freebsd-arm64/0.17.18:
+  /@esbuild/freebsd-arm64/0.17.19:
     resolution:
       {
-        integrity: sha512-fw/ZfxfAzuHfaQeMDhbzxp9mc+mHn1Y94VDHFHjGvt2Uxl10mT4CDavHm+/L9KG441t1QdABqkVYwakMUeyLRA==
+        integrity: sha512-pBwbc7DufluUeGdjSU5Si+P3SoMF5DQ/F/UmTSb8HXO80ZEAJmrykPyzo1IfNbAoaqw48YRpv8shwd1NoI0jcQ==
       }
     engines: { node: ">=12" }
     cpu: [arm64]
@@ -1151,10 +1151,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/freebsd-x64/0.17.18:
+  /@esbuild/freebsd-x64/0.17.19:
     resolution:
       {
-        integrity: sha512-FQFbRtTaEi8ZBi/A6kxOC0V0E9B/97vPdYjY9NdawyLd4Qk5VD5g2pbWN2VR1c0xhzcJm74HWpObPszWC+qTew==
+        integrity: sha512-4lu+n8Wk0XlajEhbEffdy2xy53dpR06SlzvhGByyg36qJw6Kpfk7cp45DR/62aPH9mtJRmIyrXAS5UWBrJT6TQ==
       }
     engines: { node: ">=12" }
     cpu: [x64]
@@ -1163,10 +1163,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/linux-arm/0.17.18:
+  /@esbuild/linux-arm/0.17.19:
     resolution:
       {
-        integrity: sha512-jW+UCM40LzHcouIaqv3e/oRs0JM76JfhHjCavPxMUti7VAPh8CaGSlS7cmyrdpzSk7A+8f0hiedHqr/LMnfijg==
+        integrity: sha512-cdmT3KxjlOQ/gZ2cjfrQOtmhG4HJs6hhvm3mWSRDPtZ/lP5oe8FWceS10JaSJC13GBd4eH/haHnqf7hhGNLerA==
       }
     engines: { node: ">=12" }
     cpu: [arm]
@@ -1175,10 +1175,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/linux-arm64/0.17.18:
+  /@esbuild/linux-arm64/0.17.19:
     resolution:
       {
-        integrity: sha512-R7pZvQZFOY2sxUG8P6A21eq6q+eBv7JPQYIybHVf1XkQYC+lT7nDBdC7wWKTrbvMXKRaGudp/dzZCwL/863mZQ==
+        integrity: sha512-ct1Tg3WGwd3P+oZYqic+YZF4snNl2bsnMKRkb3ozHmnM0dGWuxcPTTntAF6bOP0Sp4x0PjSF+4uHQ1xvxfRKqg==
       }
     engines: { node: ">=12" }
     cpu: [arm64]
@@ -1187,10 +1187,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/linux-ia32/0.17.18:
+  /@esbuild/linux-ia32/0.17.19:
     resolution:
       {
-        integrity: sha512-ygIMc3I7wxgXIxk6j3V00VlABIjq260i967Cp9BNAk5pOOpIXmd1RFQJQX9Io7KRsthDrQYrtcx7QCof4o3ZoQ==
+        integrity: sha512-w4IRhSy1VbsNxHRQpeGCHEmibqdTUx61Vc38APcsRbuVgK0OPEnQ0YD39Brymn96mOx48Y2laBQGqgZ0j9w6SQ==
       }
     engines: { node: ">=12" }
     cpu: [ia32]
@@ -1211,10 +1211,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/linux-loong64/0.17.18:
+  /@esbuild/linux-loong64/0.17.19:
     resolution:
       {
-        integrity: sha512-bvPG+MyFs5ZlwYclCG1D744oHk1Pv7j8psF5TfYx7otCVmcJsEXgFEhQkbhNW8otDHL1a2KDINW20cfCgnzgMQ==
+        integrity: sha512-2iAngUbBPMq439a+z//gE+9WBldoMp1s5GWsUSgqHLzLJ9WoZLZhpwWuym0u0u/4XmZ3gpHmzV84PonE+9IIdQ==
       }
     engines: { node: ">=12" }
     cpu: [loong64]
@@ -1223,10 +1223,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/linux-mips64el/0.17.18:
+  /@esbuild/linux-mips64el/0.17.19:
     resolution:
       {
-        integrity: sha512-oVqckATOAGuiUOa6wr8TXaVPSa+6IwVJrGidmNZS1cZVx0HqkTMkqFGD2HIx9H1RvOwFeWYdaYbdY6B89KUMxA==
+        integrity: sha512-LKJltc4LVdMKHsrFe4MGNPp0hqDFA1Wpt3jE1gEyM3nKUvOiO//9PheZZHfYRfYl6AwdTH4aTcXSqBerX0ml4A==
       }
     engines: { node: ">=12" }
     cpu: [mips64el]
@@ -1235,10 +1235,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/linux-ppc64/0.17.18:
+  /@esbuild/linux-ppc64/0.17.19:
     resolution:
       {
-        integrity: sha512-3dLlQO+b/LnQNxgH4l9rqa2/IwRJVN9u/bK63FhOPB4xqiRqlQAU0qDU3JJuf0BmaH0yytTBdoSBHrb2jqc5qQ==
+        integrity: sha512-/c/DGybs95WXNS8y3Ti/ytqETiW7EU44MEKuCAcpPto3YjQbyK3IQVKfF6nbghD7EcLUGl0NbiL5Rt5DMhn5tg==
       }
     engines: { node: ">=12" }
     cpu: [ppc64]
@@ -1247,10 +1247,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/linux-riscv64/0.17.18:
+  /@esbuild/linux-riscv64/0.17.19:
     resolution:
       {
-        integrity: sha512-/x7leOyDPjZV3TcsdfrSI107zItVnsX1q2nho7hbbQoKnmoeUWjs+08rKKt4AUXju7+3aRZSsKrJtaRmsdL1xA==
+        integrity: sha512-FC3nUAWhvFoutlhAkgHf8f5HwFWUL6bYdvLc/TTuxKlvLi3+pPzdZiFKSWz/PF30TB1K19SuCxDTI5KcqASJqA==
       }
     engines: { node: ">=12" }
     cpu: [riscv64]
@@ -1259,10 +1259,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/linux-s390x/0.17.18:
+  /@esbuild/linux-s390x/0.17.19:
     resolution:
       {
-        integrity: sha512-cX0I8Q9xQkL/6F5zWdYmVf5JSQt+ZfZD2bJudZrWD+4mnUvoZ3TDDXtDX2mUaq6upMFv9FlfIh4Gfun0tbGzuw==
+        integrity: sha512-IbFsFbxMWLuKEbH+7sTkKzL6NJmG2vRyy6K7JJo55w+8xDk7RElYn6xvXtDW8HCfoKBFK69f3pgBJSUSQPr+4Q==
       }
     engines: { node: ">=12" }
     cpu: [s390x]
@@ -1271,10 +1271,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/linux-x64/0.17.18:
+  /@esbuild/linux-x64/0.17.19:
     resolution:
       {
-        integrity: sha512-66RmRsPlYy4jFl0vG80GcNRdirx4nVWAzJmXkevgphP1qf4dsLQCpSKGM3DUQCojwU1hnepI63gNZdrr02wHUA==
+        integrity: sha512-68ngA9lg2H6zkZcyp22tsVt38mlhWde8l3eJLWkyLrp4HwMUr3c1s/M2t7+kHIhvMjglIBrFpncX1SzMckomGw==
       }
     engines: { node: ">=12" }
     cpu: [x64]
@@ -1283,10 +1283,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/netbsd-x64/0.17.18:
+  /@esbuild/netbsd-x64/0.17.19:
     resolution:
       {
-        integrity: sha512-95IRY7mI2yrkLlTLb1gpDxdC5WLC5mZDi+kA9dmM5XAGxCME0F8i4bYH4jZreaJ6lIZ0B8hTrweqG1fUyW7jbg==
+        integrity: sha512-CwFq42rXCR8TYIjIfpXCbRX0rp1jo6cPIUPSaWwzbVI4aOfX96OXY8M6KNmtPcg7QjYeDmN+DD0Wp3LaBOLf4Q==
       }
     engines: { node: ">=12" }
     cpu: [x64]
@@ -1295,10 +1295,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/openbsd-x64/0.17.18:
+  /@esbuild/openbsd-x64/0.17.19:
     resolution:
       {
-        integrity: sha512-WevVOgcng+8hSZ4Q3BKL3n1xTv5H6Nb53cBrtzzEjDbbnOmucEVcZeGCsCOi9bAOcDYEeBZbD2SJNBxlfP3qiA==
+        integrity: sha512-cnq5brJYrSZ2CF6c35eCmviIN3k3RczmHz8eYaVlNasVqsNY+JKohZU5MKmaOI+KkllCdzOKKdPs762VCPC20g==
       }
     engines: { node: ">=12" }
     cpu: [x64]
@@ -1307,10 +1307,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/sunos-x64/0.17.18:
+  /@esbuild/sunos-x64/0.17.19:
     resolution:
       {
-        integrity: sha512-Rzf4QfQagnwhQXVBS3BYUlxmEbcV7MY+BH5vfDZekU5eYpcffHSyjU8T0xucKVuOcdCsMo+Ur5wmgQJH2GfNrg==
+        integrity: sha512-vCRT7yP3zX+bKWFeP/zdS6SqdWB8OIpaRq/mbXQxTGHnIxspRtigpkUcDMlSCOejlHowLqII7K2JKevwyRP2rg==
       }
     engines: { node: ">=12" }
     cpu: [x64]
@@ -1319,10 +1319,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/win32-arm64/0.17.18:
+  /@esbuild/win32-arm64/0.17.19:
     resolution:
       {
-        integrity: sha512-Kb3Ko/KKaWhjeAm2YoT/cNZaHaD1Yk/pa3FTsmqo9uFh1D1Rfco7BBLIPdDOozrObj2sahslFuAQGvWbgWldAg==
+        integrity: sha512-yYx+8jwowUstVdorcMdNlzklLYhPxjniHWFKgRqH7IFlUEa0Umu3KuYplf1HUZZ422e3NU9F4LGb+4O0Kdcaag==
       }
     engines: { node: ">=12" }
     cpu: [arm64]
@@ -1331,10 +1331,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/win32-ia32/0.17.18:
+  /@esbuild/win32-ia32/0.17.19:
     resolution:
       {
-        integrity: sha512-0/xUMIdkVHwkvxfbd5+lfG7mHOf2FRrxNbPiKWg9C4fFrB8H0guClmaM3BFiRUYrznVoyxTIyC/Ou2B7QQSwmw==
+        integrity: sha512-eggDKanJszUtCdlVs0RB+h35wNlb5v4TWEkq4vZcmVt5u/HiDZrTXe2bWFQUez3RgNHwx/x4sk5++4NSSicKkw==
       }
     engines: { node: ">=12" }
     cpu: [ia32]
@@ -1343,10 +1343,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/win32-x64/0.17.18:
+  /@esbuild/win32-x64/0.17.19:
     resolution:
       {
-        integrity: sha512-qU25Ma1I3NqTSHJUOKi9sAH1/Mzuvlke0ioMJRthLXKm7JiSKVwFghlGbDLOO2sARECGhja4xYfRAZNPAkooYg==
+        integrity: sha512-lAhycmKnVOuRYNtRtatQR1LPQf2oYCkRGkSFnseDAKPl8lu5SOsK/e1sXe5a0Pc5kHIHe6P2I/ilntNv2xf3cA==
       }
     engines: { node: ">=12" }
     cpu: [x64]
@@ -2454,10 +2454,10 @@ packages:
       "@types/yargs-parser": 21.0.0
     dev: false
 
-  /@typescript-eslint/eslint-plugin/5.59.5_zaj6dsh3leplki3sfxgbx2w2za:
+  /@typescript-eslint/eslint-plugin/5.59.6_hrzo544y7ygaq2nap7kmpxcgnm:
     resolution:
       {
-        integrity: sha512-feA9xbVRWJZor+AnLNAr7A8JRWeZqHUf4T9tlP+TN04b05pFVhO5eN7/O93Y/1OUlLMHKbnJisgDURs/qvtqdg==
+        integrity: sha512-sXtOgJNEuRU5RLwPUb1jxtToZbgvq3M6FPpY4QENxoOggK+UpTxUBpj6tD8+Qh2g46Pi9We87E+eHnUw8YcGsw==
       }
     engines: { node: ^12.22.0 || ^14.17.0 || >=16.0.0 }
     peerDependencies:
@@ -2469,10 +2469,10 @@ packages:
         optional: true
     dependencies:
       "@eslint-community/regexpp": 4.5.1
-      "@typescript-eslint/parser": 5.59.5_3qfatcekpgbllh6uk5ivyhkbxq
-      "@typescript-eslint/scope-manager": 5.59.5
-      "@typescript-eslint/type-utils": 5.59.5_3qfatcekpgbllh6uk5ivyhkbxq
-      "@typescript-eslint/utils": 5.59.5_3qfatcekpgbllh6uk5ivyhkbxq
+      "@typescript-eslint/parser": 5.59.6_3qfatcekpgbllh6uk5ivyhkbxq
+      "@typescript-eslint/scope-manager": 5.59.6
+      "@typescript-eslint/type-utils": 5.59.6_3qfatcekpgbllh6uk5ivyhkbxq
+      "@typescript-eslint/utils": 5.59.6_3qfatcekpgbllh6uk5ivyhkbxq
       debug: 4.3.4
       eslint: 8.40.0
       grapheme-splitter: 1.0.4
@@ -2485,10 +2485,10 @@ packages:
       - supports-color
     dev: true
 
-  /@typescript-eslint/parser/5.59.5_3qfatcekpgbllh6uk5ivyhkbxq:
+  /@typescript-eslint/parser/5.59.6_3qfatcekpgbllh6uk5ivyhkbxq:
     resolution:
       {
-        integrity: sha512-NJXQC4MRnF9N9yWqQE2/KLRSOLvrrlZb48NGVfBa+RuPMN6B7ZcK5jZOvhuygv4D64fRKnZI4L4p8+M+rfeQuw==
+        integrity: sha512-7pCa6al03Pv1yf/dUg/s1pXz/yGMUBAw5EeWqNTFiSueKvRNonze3hma3lhdsOrQcaOXhbk5gKu2Fludiho9VA==
       }
     engines: { node: ^12.22.0 || ^14.17.0 || >=16.0.0 }
     peerDependencies:
@@ -2498,9 +2498,9 @@ packages:
       typescript:
         optional: true
     dependencies:
-      "@typescript-eslint/scope-manager": 5.59.5
-      "@typescript-eslint/types": 5.59.5
-      "@typescript-eslint/typescript-estree": 5.59.5_typescript@5.0.4
+      "@typescript-eslint/scope-manager": 5.59.6
+      "@typescript-eslint/types": 5.59.6
+      "@typescript-eslint/typescript-estree": 5.59.6_typescript@5.0.4
       debug: 4.3.4
       eslint: 8.40.0
       typescript: 5.0.4
@@ -2508,21 +2508,21 @@ packages:
       - supports-color
     dev: true
 
-  /@typescript-eslint/scope-manager/5.59.5:
+  /@typescript-eslint/scope-manager/5.59.6:
     resolution:
       {
-        integrity: sha512-jVecWwnkX6ZgutF+DovbBJirZcAxgxC0EOHYt/niMROf8p4PwxxG32Qdhj/iIQQIuOflLjNkxoXyArkcIP7C3A==
+        integrity: sha512-gLbY3Le9Dxcb8KdpF0+SJr6EQ+hFGYFl6tVY8VxLPFDfUZC7BHFw+Vq7bM5lE9DwWPfx4vMWWTLGXgpc0mAYyQ==
       }
     engines: { node: ^12.22.0 || ^14.17.0 || >=16.0.0 }
     dependencies:
-      "@typescript-eslint/types": 5.59.5
-      "@typescript-eslint/visitor-keys": 5.59.5
+      "@typescript-eslint/types": 5.59.6
+      "@typescript-eslint/visitor-keys": 5.59.6
     dev: true
 
-  /@typescript-eslint/type-utils/5.59.5_3qfatcekpgbllh6uk5ivyhkbxq:
+  /@typescript-eslint/type-utils/5.59.6_3qfatcekpgbllh6uk5ivyhkbxq:
     resolution:
       {
-        integrity: sha512-4eyhS7oGym67/pSxA2mmNq7X164oqDYNnZCUayBwJZIRVvKpBCMBzFnFxjeoDeShjtO6RQBHBuwybuX3POnDqg==
+        integrity: sha512-A4tms2Mp5yNvLDlySF+kAThV9VTBPCvGf0Rp8nl/eoDX9Okun8byTKoj3fJ52IJitjWOk0fKPNQhXEB++eNozQ==
       }
     engines: { node: ^12.22.0 || ^14.17.0 || >=16.0.0 }
     peerDependencies:
@@ -2532,8 +2532,8 @@ packages:
       typescript:
         optional: true
     dependencies:
-      "@typescript-eslint/typescript-estree": 5.59.5_typescript@5.0.4
-      "@typescript-eslint/utils": 5.59.5_3qfatcekpgbllh6uk5ivyhkbxq
+      "@typescript-eslint/typescript-estree": 5.59.6_typescript@5.0.4
+      "@typescript-eslint/utils": 5.59.6_3qfatcekpgbllh6uk5ivyhkbxq
       debug: 4.3.4
       eslint: 8.40.0
       tsutils: 3.21.0_typescript@5.0.4
@@ -2542,18 +2542,18 @@ packages:
       - supports-color
     dev: true
 
-  /@typescript-eslint/types/5.59.5:
+  /@typescript-eslint/types/5.59.6:
     resolution:
       {
-        integrity: sha512-xkfRPHbqSH4Ggx4eHRIO/eGL8XL4Ysb4woL8c87YuAo8Md7AUjyWKa9YMwTL519SyDPrfEgKdewjkxNCVeJW7w==
+        integrity: sha512-tH5lBXZI7T2MOUgOWFdVNUILsI02shyQvfzG9EJkoONWugCG77NDDa1EeDGw7oJ5IvsTAAGVV8I3Tk2PNu9QfA==
       }
     engines: { node: ^12.22.0 || ^14.17.0 || >=16.0.0 }
     dev: true
 
-  /@typescript-eslint/typescript-estree/5.59.5_typescript@5.0.4:
+  /@typescript-eslint/typescript-estree/5.59.6_typescript@5.0.4:
     resolution:
       {
-        integrity: sha512-+XXdLN2CZLZcD/mO7mQtJMvCkzRfmODbeSKuMY/yXbGkzvA9rJyDY5qDYNoiz2kP/dmyAxXquL2BvLQLJFPQIg==
+        integrity: sha512-vW6JP3lMAs/Tq4KjdI/RiHaaJSO7IUsbkz17it/Rl9Q+WkQ77EOuOnlbaU8kKfVIOJxMhnRiBG+olE7f3M16DA==
       }
     engines: { node: ^12.22.0 || ^14.17.0 || >=16.0.0 }
     peerDependencies:
@@ -2562,8 +2562,8 @@ packages:
       typescript:
         optional: true
     dependencies:
-      "@typescript-eslint/types": 5.59.5
-      "@typescript-eslint/visitor-keys": 5.59.5
+      "@typescript-eslint/types": 5.59.6
+      "@typescript-eslint/visitor-keys": 5.59.6
       debug: 4.3.4
       globby: 11.1.0
       is-glob: 4.0.3
@@ -2574,10 +2574,10 @@ packages:
       - supports-color
     dev: true
 
-  /@typescript-eslint/utils/5.59.5_3qfatcekpgbllh6uk5ivyhkbxq:
+  /@typescript-eslint/utils/5.59.6_3qfatcekpgbllh6uk5ivyhkbxq:
     resolution:
       {
-        integrity: sha512-sCEHOiw+RbyTii9c3/qN74hYDPNORb8yWCoPLmB7BIflhplJ65u2PBpdRla12e3SSTJ2erRkPjz7ngLHhUegxA==
+        integrity: sha512-vzaaD6EXbTS29cVH0JjXBdzMt6VBlv+hE31XktDRMX1j3462wZCJa7VzO2AxXEXcIl8GQqZPcOPuW/Z1tZVogg==
       }
     engines: { node: ^12.22.0 || ^14.17.0 || >=16.0.0 }
     peerDependencies:
@@ -2586,9 +2586,9 @@ packages:
       "@eslint-community/eslint-utils": 4.4.0_eslint@8.40.0
       "@types/json-schema": 7.0.11
       "@types/semver": 7.5.0
-      "@typescript-eslint/scope-manager": 5.59.5
-      "@typescript-eslint/types": 5.59.5
-      "@typescript-eslint/typescript-estree": 5.59.5_typescript@5.0.4
+      "@typescript-eslint/scope-manager": 5.59.6
+      "@typescript-eslint/types": 5.59.6
+      "@typescript-eslint/typescript-estree": 5.59.6_typescript@5.0.4
       eslint: 8.40.0
       eslint-scope: 5.1.1
       semver: 7.5.0
@@ -2597,14 +2597,14 @@ packages:
       - typescript
     dev: true
 
-  /@typescript-eslint/visitor-keys/5.59.5:
+  /@typescript-eslint/visitor-keys/5.59.6:
     resolution:
       {
-        integrity: sha512-qL+Oz+dbeBRTeyJTIy0eniD3uvqU7x+y1QceBismZ41hd4aBSRh8UAw4pZP0+XzLuPZmx4raNMq/I+59W2lXKA==
+        integrity: sha512-zEfbFLzB9ETcEJ4HZEEsCR9HHeNku5/Qw1jSS5McYJv5BR+ftYXwFFAH5Al+xkGaZEqowMwl7uoJjQb1YSPF8Q==
       }
     engines: { node: ^12.22.0 || ^14.17.0 || >=16.0.0 }
     dependencies:
-      "@typescript-eslint/types": 5.59.5
+      "@typescript-eslint/types": 5.59.6
       eslint-visitor-keys: 3.4.1
     dev: true
 
@@ -2664,7 +2664,7 @@ packages:
       nanoid: 3.3.6
     dev: false
 
-  /@vitejs/plugin-vue-jsx/3.0.1_vite@4.3.5+vue@3.3.2:
+  /@vitejs/plugin-vue-jsx/3.0.1_vite@4.3.7+vue@3.3.2:
     resolution:
       {
         integrity: sha512-+Jb7ggL48FSPS1uhPnJbJwWa9Sr90vQ+d0InW+AhBM22n+cfuYqJZDckBc+W3QSHe1WDvewMZfa4wZOtk5pRgw==
@@ -2677,13 +2677,13 @@ packages:
       "@babel/core": 7.21.8
       "@babel/plugin-transform-typescript": 7.21.3_@babel+core@7.21.8
       "@vue/babel-plugin-jsx": 1.1.1_@babel+core@7.21.8
-      vite: 4.3.5_wshwf6lyytunybtggckvwapi7u
+      vite: 4.3.7_tal7gj4owy4f6uovip3nh65ye4
       vue: 3.3.2
     transitivePeerDependencies:
       - supports-color
     dev: true
 
-  /@vitejs/plugin-vue/4.2.3_vite@4.3.5+vue@3.3.2:
+  /@vitejs/plugin-vue/4.2.3_vite@4.3.7+vue@3.3.2:
     resolution:
       {
         integrity: sha512-R6JDUfiZbJA9cMiguQ7jxALsgiprjBeHL5ikpXfJCH62pPHtI+JdJ5xWj6Ev73yXSlYl86+blXn1kZHQ7uElxw==
@@ -2693,7 +2693,7 @@ packages:
       vite: ^4.0.0
       vue: ^3.2.25
     dependencies:
-      vite: 4.3.5_wshwf6lyytunybtggckvwapi7u
+      vite: 4.3.7_tal7gj4owy4f6uovip3nh65ye4
       vue: 3.3.2
     dev: true
 
@@ -2901,7 +2901,7 @@ packages:
       prettier: 2.8.8
     dev: true
 
-  /@vue/eslint-config-typescript/11.0.3_nhvncizgwdwdw3lhirpwnri2za:
+  /@vue/eslint-config-typescript/11.0.3_2scluc6ttmuw6bnoknuoazerjy:
     resolution:
       {
         integrity: sha512-dkt6W0PX6H/4Xuxg/BlFj5xHvksjpSlVjtkQCpaYJBIEuKj2hOVU7r+TIe+ysCwRYFz/lGqvklntRkCAibsbPw==
@@ -2915,10 +2915,10 @@ packages:
       typescript:
         optional: true
     dependencies:
-      "@typescript-eslint/eslint-plugin": 5.59.5_zaj6dsh3leplki3sfxgbx2w2za
-      "@typescript-eslint/parser": 5.59.5_3qfatcekpgbllh6uk5ivyhkbxq
+      "@typescript-eslint/eslint-plugin": 5.59.6_hrzo544y7ygaq2nap7kmpxcgnm
+      "@typescript-eslint/parser": 5.59.6_3qfatcekpgbllh6uk5ivyhkbxq
       eslint: 8.40.0
-      eslint-plugin-vue: 9.12.0_eslint@8.40.0
+      eslint-plugin-vue: 9.13.0_eslint@8.40.0
       typescript: 5.0.4
       vue-eslint-parser: 9.3.0_eslint@8.40.0
     transitivePeerDependencies:
@@ -5509,37 +5509,37 @@ packages:
       esbuild-windows-arm64: 0.14.54
     dev: true
 
-  /esbuild/0.17.18:
+  /esbuild/0.17.19:
     resolution:
       {
-        integrity: sha512-z1lix43jBs6UKjcZVKOw2xx69ffE2aG0PygLL5qJ9OS/gy0Ewd1gW/PUQIOIQGXBHWNywSc0floSKoMFF8aK2w==
+        integrity: sha512-XQ0jAPFkK/u3LcVRcvVHQcTIqD6E2H1fvZMA5dQPSOWb3suUbWbfbRf94pjc0bNzRYLfIrDRQXr7X+LHIm5oHw==
       }
     engines: { node: ">=12" }
     hasBin: true
     requiresBuild: true
     optionalDependencies:
-      "@esbuild/android-arm": 0.17.18
-      "@esbuild/android-arm64": 0.17.18
-      "@esbuild/android-x64": 0.17.18
-      "@esbuild/darwin-arm64": 0.17.18
-      "@esbuild/darwin-x64": 0.17.18
-      "@esbuild/freebsd-arm64": 0.17.18
-      "@esbuild/freebsd-x64": 0.17.18
-      "@esbuild/linux-arm": 0.17.18
-      "@esbuild/linux-arm64": 0.17.18
-      "@esbuild/linux-ia32": 0.17.18
-      "@esbuild/linux-loong64": 0.17.18
-      "@esbuild/linux-mips64el": 0.17.18
-      "@esbuild/linux-ppc64": 0.17.18
-      "@esbuild/linux-riscv64": 0.17.18
-      "@esbuild/linux-s390x": 0.17.18
-      "@esbuild/linux-x64": 0.17.18
-      "@esbuild/netbsd-x64": 0.17.18
-      "@esbuild/openbsd-x64": 0.17.18
-      "@esbuild/sunos-x64": 0.17.18
-      "@esbuild/win32-arm64": 0.17.18
-      "@esbuild/win32-ia32": 0.17.18
-      "@esbuild/win32-x64": 0.17.18
+      "@esbuild/android-arm": 0.17.19
+      "@esbuild/android-arm64": 0.17.19
+      "@esbuild/android-x64": 0.17.19
+      "@esbuild/darwin-arm64": 0.17.19
+      "@esbuild/darwin-x64": 0.17.19
+      "@esbuild/freebsd-arm64": 0.17.19
+      "@esbuild/freebsd-x64": 0.17.19
+      "@esbuild/linux-arm": 0.17.19
+      "@esbuild/linux-arm64": 0.17.19
+      "@esbuild/linux-ia32": 0.17.19
+      "@esbuild/linux-loong64": 0.17.19
+      "@esbuild/linux-mips64el": 0.17.19
+      "@esbuild/linux-ppc64": 0.17.19
+      "@esbuild/linux-riscv64": 0.17.19
+      "@esbuild/linux-s390x": 0.17.19
+      "@esbuild/linux-x64": 0.17.19
+      "@esbuild/netbsd-x64": 0.17.19
+      "@esbuild/openbsd-x64": 0.17.19
+      "@esbuild/sunos-x64": 0.17.19
+      "@esbuild/win32-arm64": 0.17.19
+      "@esbuild/win32-ia32": 0.17.19
+      "@esbuild/win32-x64": 0.17.19
     dev: true
 
   /escalade/3.1.1:
@@ -5644,10 +5644,10 @@ packages:
       prettier-linter-helpers: 1.0.0
     dev: true
 
-  /eslint-plugin-vue/9.12.0_eslint@8.40.0:
+  /eslint-plugin-vue/9.13.0_eslint@8.40.0:
     resolution:
       {
-        integrity: sha512-xH8PgpDW2WwmFSmRfs/3iWogef1CJzQqX264I65zz77jDuxF2yLy7+GA2diUM8ZNATuSl1+UehMQkb5YEyau5w==
+        integrity: sha512-aBz9A8WB4wmpnVv0pYUt86cmH9EkcwWzgEwecBxMoRNhQjTL5i4sqadnwShv/hOdr8Hbl8XANGV7dtX9UQIAyA==
       }
     engines: { node: ^14.17.0 || >=16.0.0 }
     peerDependencies:
@@ -10232,10 +10232,10 @@ packages:
       yargs: 17.7.2
     dev: true
 
-  /rollup/3.21.6:
+  /rollup/3.21.8:
     resolution:
       {
-        integrity: sha512-SXIICxvxQxR3D4dp/3LDHZIJPC8a4anKMHd4E3Jiz2/JnY+2bEjqrOokAauc5ShGVNFHlEFjBXAXlaxkJqIqSg==
+        integrity: sha512-SSFV2T2fWtQ/vvBip85u2Nr0GNKireabH9d7nXswBg+XSH+jbVDSYptRAEbCEsquhs503rpPA9POYAp0/Jhasw==
       }
     engines: { node: ">=14.18.0", npm: ">=8.0.0" }
     hasBin: true
@@ -11218,10 +11218,10 @@ packages:
       supports-hyperlinks: 2.3.0
     dev: false
 
-  /terser/5.17.3:
+  /terser/5.17.4:
     resolution:
       {
-        integrity: sha512-AudpAZKmZHkG9jueayypz4duuCFJMMNGRMwaPvQKWfxKedh8Z2x3OCoDqIIi1xx5+iwx1u6Au8XQcc9Lke65Yg==
+        integrity: sha512-jcEKZw6UPrgugz/0Tuk/PVyLAPfMBJf5clnGueo45wTweoV8yh7Q7PEkhkJ5uuUbC7zAxEcG3tqNr1bstkQ8nw==
       }
     engines: { node: ">=10" }
     hasBin: true
@@ -11707,7 +11707,7 @@ packages:
       - rollup
     dev: true
 
-  /vite-plugin-compression/0.5.1_vite@4.3.5:
+  /vite-plugin-compression/0.5.1_vite@4.3.7:
     resolution:
       {
         integrity: sha512-5QJKBDc+gNYVqL/skgFAP81Yuzo9R+EAf19d+EtsMF/i8kFUpNi3J/H01QD3Oo8zBQn+NzoCIFkpPLynoOzaJg==
@@ -11718,12 +11718,12 @@ packages:
       chalk: 4.1.2
       debug: 4.3.4
       fs-extra: 10.1.0
-      vite: 4.3.5_wshwf6lyytunybtggckvwapi7u
+      vite: 4.3.7_tal7gj4owy4f6uovip3nh65ye4
     transitivePeerDependencies:
       - supports-color
     dev: true
 
-  /vite-plugin-mock/2.9.8_mockjs@1.1.0+vite@4.3.5:
+  /vite-plugin-mock/2.9.8_mockjs@1.1.0+vite@4.3.7:
     resolution:
       {
         integrity: sha512-YTQM5Sn7t+/DNOwTkr+W26QGTCk1PrDkhGHslTJ90lIPJhJtDTwuSkEYMAuLP9TcVQ/qExTFx/x/GE3kxJ05sw==
@@ -11742,7 +11742,7 @@ packages:
       fast-glob: 3.2.12
       mockjs: 1.1.0
       path-to-regexp: 6.2.1
-      vite: 4.3.5_wshwf6lyytunybtggckvwapi7u
+      vite: 4.3.7_tal7gj4owy4f6uovip3nh65ye4
     transitivePeerDependencies:
       - supports-color
     dev: true
@@ -11764,10 +11764,10 @@ packages:
       svgo: 3.0.2
     dev: true
 
-  /vite/4.3.5_wshwf6lyytunybtggckvwapi7u:
+  /vite/4.3.7_tal7gj4owy4f6uovip3nh65ye4:
     resolution:
       {
-        integrity: sha512-0gEnL9wiRFxgz40o/i/eTBwm+NEbpUeTWhzKrZDSdKm6nplj+z4lKz8ANDgildxHm47Vg8EUia0aicKbawUVVA==
+        integrity: sha512-MTIFpbIm9v7Hh5b0wSBgkcWzSBz7SAa6K/cBTwS4kUiQJfQLFlZZRJRQgqunCVzhTPCk674tW+0Qaqh3Q00dBg==
       }
     engines: { node: ^14.18.0 || >=16.0.0 }
     hasBin: true
@@ -11793,11 +11793,11 @@ packages:
         optional: true
     dependencies:
       "@types/node": 18.16.8
-      esbuild: 0.17.18
+      esbuild: 0.17.19
       postcss: 8.4.23
-      rollup: 3.21.6
+      rollup: 3.21.8
       sass: 1.62.1
-      terser: 5.17.3
+      terser: 5.17.4
     optionalDependencies:
       fsevents: 2.3.2
     dev: true
@@ -11938,10 +11938,10 @@ packages:
       typescript: 5.0.4
     dev: true
 
-  /vue-types/5.0.2_vue@3.3.2:
+  /vue-types/5.0.3_vue@3.3.2:
     resolution:
       {
-        integrity: sha512-+/5hnQ65XOYqPs+tEUF8GGTJX95UFVH0wPQo71IJJYh5TKMfik2tGKTLkZ42JqAczANA9hGu5FrZmPgxn20nnA==
+        integrity: sha512-7+yOUXlRrpkJ4mtgmB6nIfDYLdLmxHQ/IMZR3hsEziYnHK4Y/Rf+rlCIg1rwNnlbyTiDf4v/vz1LEumo3RgwrQ==
       }
     engines: { node: ">=14.0.0" }
     peerDependencies:
diff --git a/src/api/system.ts b/src/api/system.ts
index 041e5bf6f..169d79cca 100644
--- a/src/api/system.ts
+++ b/src/api/system.ts
@@ -5,8 +5,12 @@ type Result = {
   data?: {
     /** 列表数据 */
     list: Array<any>;
-    /** 总数 */
+    /** 总条目数 */
     total?: number;
+    /** 每页显示条目个数 */
+    pageSize?: number;
+    /** 当前页数 */
+    currentPage?: number;
   };
 };
 
diff --git a/src/components/ReIcon/src/Select.vue b/src/components/ReIcon/src/Select.vue
index 1851cbd96..845726694 100644
--- a/src/components/ReIcon/src/Select.vue
+++ b/src/components/ReIcon/src/Select.vue
@@ -228,7 +228,7 @@ watch(
 :deep(.el-tabs__nav-wrap) {
   position: static;
   margin: 0;
-  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.06);
+  box-shadow: 0 2px 5px rgb(0 0 0 / 6%);
 }
 
 :deep(.el-tabs__content) {
diff --git a/src/router/modules/components.ts b/src/router/modules/components.ts
index b637524fc..44a068a91 100644
--- a/src/router/modules/components.ts
+++ b/src/router/modules/components.ts
@@ -12,7 +12,7 @@ export default {
   children: [
     {
       path: "/components/dialog",
-      name: "Dialog",
+      name: "DialogPage",
       component: () => import("@/views/components/dialog/index.vue"),
       meta: {
         title: $t("menus.hsdialog"),
@@ -51,7 +51,7 @@ export default {
     },
     {
       path: "/components/video",
-      name: "Video",
+      name: "VideoPage",
       component: () => import("@/views/components/video/index.vue"),
       meta: {
         title: $t("menus.hsvideo")
@@ -59,7 +59,7 @@ export default {
     },
     {
       path: "/components/map",
-      name: "Map",
+      name: "MapPage",
       component: () => import("@/views/components/map/index.vue"),
       meta: {
         title: $t("menus.hsmap"),
@@ -91,7 +91,7 @@ export default {
     },
     {
       path: "/components/button",
-      name: "Button",
+      name: "ButtonPage",
       component: () => import("@/views/components/button/index.vue"),
       meta: {
         title: $t("menus.hsbutton")
diff --git a/src/views/components/button/index.vue b/src/views/components/button/index.vue
index 17893137f..7b05e5057 100644
--- a/src/views/components/button/index.vue
+++ b/src/views/components/button/index.vue
@@ -2,7 +2,7 @@
 import { ref } from "vue";
 
 defineOptions({
-  name: "Button"
+  name: "ButtonPage"
 });
 
 const { VITE_PUBLIC_PATH } = import.meta.env;
diff --git a/src/views/components/dialog/index.vue b/src/views/components/dialog/index.vue
index 7ca94dd56..3a2f9839f 100644
--- a/src/views/components/dialog/index.vue
+++ b/src/views/components/dialog/index.vue
@@ -7,7 +7,7 @@ import forms, { type FormProps } from "./form.vue";
 import { addDialog, closeDialog, closeAllDialog } from "@/components/ReDialog";
 
 defineOptions({
-  name: "Dialog"
+  name: "DialogPage"
 });
 
 const router = useRouter();
diff --git a/src/views/components/map/index.vue b/src/views/components/map/index.vue
index ae5b9d869..a528eb626 100644
--- a/src/views/components/map/index.vue
+++ b/src/views/components/map/index.vue
@@ -2,7 +2,7 @@
 import { Amap } from "@/components/ReMap";
 
 defineOptions({
-  name: "Map"
+  name: "MapPage"
 });
 </script>
 
diff --git a/src/views/components/video/index.vue b/src/views/components/video/index.vue
index 98c4cfa1a..698271ccf 100644
--- a/src/views/components/video/index.vue
+++ b/src/views/components/video/index.vue
@@ -8,7 +8,7 @@ import Player from "xgplayer";
 import "xgplayer/dist/index.min.css";
 
 defineOptions({
-  name: "Video"
+  name: "VideoPage"
 });
 
 onMounted(() => {
diff --git a/src/views/system/dept/form.vue b/src/views/system/dept/form.vue
index 292541707..39f4bd901 100644
--- a/src/views/system/dept/form.vue
+++ b/src/views/system/dept/form.vue
@@ -1,8 +1,8 @@
 <script setup lang="ts">
 import { ref } from "vue";
-import { formRules } from "./rule";
-import { FormProps } from "./types";
 import ReCol from "@/components/ReCol";
+import { formRules } from "./utils/rule";
+import { FormProps } from "./utils/types";
 import { usePublicHooks } from "../hooks";
 
 const props = withDefaults(defineProps<FormProps>(), {
diff --git a/src/views/system/dept/index.vue b/src/views/system/dept/index.vue
index c691c720c..79bc7335e 100644
--- a/src/views/system/dept/index.vue
+++ b/src/views/system/dept/index.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { ref } from "vue";
-import { useDept } from "./hook";
+import { useDept } from "./utils/hook";
 import { PureTableBar } from "@/components/RePureTableBar";
 import { useRenderIcon } from "@/components/ReIcon/src/hooks";
 
diff --git a/src/views/system/dept/hook.tsx b/src/views/system/dept/utils/hook.tsx
similarity index 97%
rename from src/views/system/dept/hook.tsx
rename to src/views/system/dept/utils/hook.tsx
index e78f0f9f0..d7c4966db 100644
--- a/src/views/system/dept/hook.tsx
+++ b/src/views/system/dept/utils/hook.tsx
@@ -1,12 +1,12 @@
 import dayjs from "dayjs";
-import editForm from "./form.vue";
+import editForm from "../form.vue";
 import { handleTree } from "@/utils/tree";
-import { usePublicHooks } from "../hooks";
 import { message } from "@/utils/message";
 import { getDeptList } from "@/api/system";
-import { type FormItemProps } from "./types";
+import { usePublicHooks } from "../../hooks";
 import { addDialog } from "@/components/ReDialog";
 import { reactive, ref, onMounted, h } from "vue";
+import { type FormItemProps } from "../utils/types";
 import { cloneDeep, isAllEmpty } from "@pureadmin/utils";
 
 export function useDept() {
diff --git a/src/views/system/dept/rule.ts b/src/views/system/dept/utils/rule.ts
similarity index 100%
rename from src/views/system/dept/rule.ts
rename to src/views/system/dept/utils/rule.ts
diff --git a/src/views/system/dept/types.ts b/src/views/system/dept/utils/types.ts
similarity index 100%
rename from src/views/system/dept/types.ts
rename to src/views/system/dept/utils/types.ts
diff --git a/src/views/system/role/form.vue b/src/views/system/role/form.vue
new file mode 100644
index 000000000..65d4ef003
--- /dev/null
+++ b/src/views/system/role/form.vue
@@ -0,0 +1,55 @@
+<script setup lang="ts">
+import { ref } from "vue";
+import { formRules } from "./utils/rule";
+import { FormProps } from "./utils/types";
+
+const props = withDefaults(defineProps<FormProps>(), {
+  formInline: () => ({
+    name: "",
+    code: "",
+    remark: ""
+  })
+});
+
+const ruleFormRef = ref();
+const newFormInline = ref(props.formInline);
+
+function getRef() {
+  return ruleFormRef.value;
+}
+
+defineExpose({ getRef });
+</script>
+
+<template>
+  <el-form
+    ref="ruleFormRef"
+    :model="newFormInline"
+    :rules="formRules"
+    label-width="82px"
+  >
+    <el-form-item label="角色名称" prop="name">
+      <el-input
+        v-model="newFormInline.name"
+        clearable
+        placeholder="请输入角色名称"
+      />
+    </el-form-item>
+
+    <el-form-item label="角色标识" prop="code">
+      <el-input
+        v-model="newFormInline.code"
+        clearable
+        placeholder="请输入角色标识"
+      />
+    </el-form-item>
+
+    <el-form-item label="备注">
+      <el-input
+        v-model="newFormInline.remark"
+        placeholder="请输入备注信息"
+        type="textarea"
+      />
+    </el-form-item>
+  </el-form>
+</template>
diff --git a/src/views/system/role/index.vue b/src/views/system/role/index.vue
index 5ecff5a09..777ffb1c0 100644
--- a/src/views/system/role/index.vue
+++ b/src/views/system/role/index.vue
@@ -1,11 +1,11 @@
 <script setup lang="ts">
 import { ref } from "vue";
-import { useRole } from "./hook";
+import { useRole } from "./utils/hook";
 import { PureTableBar } from "@/components/RePureTableBar";
 import { useRenderIcon } from "@/components/ReIcon/src/hooks";
 
-import Database from "@iconify-icons/ri/database-2-line";
-import More from "@iconify-icons/ep/more-filled";
+// import Database from "@iconify-icons/ri/database-2-line";
+// import More from "@iconify-icons/ep/more-filled";
 import Delete from "@iconify-icons/ep/delete";
 import EditPen from "@iconify-icons/ep/edit-pen";
 import Search from "@iconify-icons/ep/search";
@@ -24,11 +24,13 @@ const {
   columns,
   dataList,
   pagination,
-  buttonClass,
+  // buttonClass,
   onSearch,
   resetForm,
-  handleUpdate,
+  openDialog,
+  handleMenu,
   handleDelete,
+  // handleDatabase,
   handleSizeChange,
   handleCurrentChange,
   handleSelectionChange
@@ -66,8 +68,8 @@ const {
           clearable
           class="!w-[180px]"
         >
-          <el-option label="已开启" value="1" />
-          <el-option label="已关闭" value="0" />
+          <el-option label="已启用" value="1" />
+          <el-option label="已停用" value="0" />
         </el-select>
       </el-form-item>
       <el-form-item>
@@ -85,9 +87,17 @@ const {
       </el-form-item>
     </el-form>
 
-    <PureTableBar title="角色列表" :columns="columns" @refresh="onSearch">
+    <PureTableBar
+      title="角色列表（仅演示，操作后不生效）"
+      :columns="columns"
+      @refresh="onSearch"
+    >
       <template #buttons>
-        <el-button type="primary" :icon="useRenderIcon(AddFill)">
+        <el-button
+          type="primary"
+          :icon="useRenderIcon(AddFill)"
+          @click="openDialog()"
+        >
           新增角色
         </el-button>
       </template>
@@ -118,11 +128,24 @@ const {
               type="primary"
               :size="size"
               :icon="useRenderIcon(EditPen)"
-              @click="handleUpdate(row)"
+              @click="openDialog('编辑', row)"
             >
               修改
             </el-button>
-            <el-popconfirm title="是否确认删除?">
+            <el-button
+              class="reset-margin"
+              link
+              type="primary"
+              :size="size"
+              :icon="useRenderIcon(Menu)"
+              @click="handleMenu"
+            >
+              菜单权限
+            </el-button>
+            <el-popconfirm
+              :title="`是否确认删除角色名称为${row.name}的这条数据`"
+              @confirm="handleDelete(row)"
+            >
               <template #reference>
                 <el-button
                   class="reset-margin"
@@ -130,20 +153,18 @@ const {
                   type="primary"
                   :size="size"
                   :icon="useRenderIcon(Delete)"
-                  @click="handleDelete(row)"
                 >
                   删除
                 </el-button>
               </template>
             </el-popconfirm>
-            <el-dropdown>
+            <!-- <el-dropdown>
               <el-button
                 class="ml-3 mt-[2px]"
                 link
                 type="primary"
                 :size="size"
                 :icon="useRenderIcon(More)"
-                @click="handleUpdate(row)"
               />
               <template #dropdown>
                 <el-dropdown-menu>
@@ -154,6 +175,7 @@ const {
                       type="primary"
                       :size="size"
                       :icon="useRenderIcon(Menu)"
+                      @click="handleMenu"
                     >
                       菜单权限
                     </el-button>
@@ -165,13 +187,14 @@ const {
                       type="primary"
                       :size="size"
                       :icon="useRenderIcon(Database)"
+                      @click="handleDatabase"
                     >
                       数据权限
                     </el-button>
                   </el-dropdown-item>
                 </el-dropdown-menu>
               </template>
-            </el-dropdown>
+            </el-dropdown> -->
           </template>
         </pure-table>
       </template>
diff --git a/src/views/system/role/hook.tsx b/src/views/system/role/utils/hook.tsx
similarity index 56%
rename from src/views/system/role/hook.tsx
rename to src/views/system/role/utils/hook.tsx
index 9fbe19fdd..073aa69e7 100644
--- a/src/views/system/role/hook.tsx
+++ b/src/views/system/role/utils/hook.tsx
@@ -1,9 +1,13 @@
 import dayjs from "dayjs";
+import editForm from "../form.vue";
 import { message } from "@/utils/message";
 import { getRoleList } from "@/api/system";
 import { ElMessageBox } from "element-plus";
+import { usePublicHooks } from "../../hooks";
+import { addDialog } from "@/components/ReDialog";
+import { type FormItemProps } from "../utils/types";
 import { type PaginationProps } from "@pureadmin/table";
-import { reactive, ref, computed, onMounted } from "vue";
+import { reactive, ref, onMounted, h, toRaw } from "vue";
 
 export function useRole() {
   const form = reactive({
@@ -11,9 +15,11 @@ export function useRole() {
     code: "",
     status: ""
   });
+  const formRef = ref();
   const dataList = ref([]);
   const loading = ref(true);
   const switchLoadMap = ref({});
+  const { switchStyle } = usePublicHooks();
   const pagination = reactive<PaginationProps>({
     total: 0,
     pageSize: 10,
@@ -21,19 +27,6 @@ export function useRole() {
     background: true
   });
   const columns: TableColumnList = [
-    // {
-    //   label: "勾选列", // 如果需要表格多选，此处label必须设置
-    //   type: "selection",
-    //   width: 55,
-    //   align: "left",
-    //   fixed: "left"
-    // },
-    {
-      label: "序号",
-      type: "index",
-      width: 70,
-      fixed: "left"
-    },
     {
       label: "角色编号",
       prop: "id",
@@ -49,25 +42,6 @@ export function useRole() {
       prop: "code",
       minWidth: 150
     },
-    {
-      label: "角色类型",
-      prop: "type",
-      minWidth: 150,
-      cellRenderer: ({ row, props }) => (
-        <el-tag
-          size={props.size}
-          type={row.type === 1 ? "danger" : ""}
-          effect="plain"
-        >
-          {row.type === 1 ? "内置" : "自定义"}
-        </el-tag>
-      )
-    },
-    {
-      label: "显示顺序",
-      prop: "sort",
-      minWidth: 100
-    },
     {
       label: "状态",
       minWidth: 130,
@@ -78,13 +52,19 @@ export function useRole() {
           v-model={scope.row.status}
           active-value={1}
           inactive-value={0}
-          active-text="已开启"
-          inactive-text="已关闭"
+          active-text="已启用"
+          inactive-text="已停用"
           inline-prompt
+          style={switchStyle.value}
           onChange={() => onChange(scope as any)}
         />
       )
     },
+    {
+      label: "备注",
+      prop: "remark",
+      minWidth: 150
+    },
     {
       label: "创建时间",
       minWidth: 180,
@@ -95,19 +75,19 @@ export function useRole() {
     {
       label: "操作",
       fixed: "right",
-      width: 180,
+      width: 240,
       slot: "operation"
     }
   ];
-  const buttonClass = computed(() => {
-    return [
-      "!h-[20px]",
-      "reset-margin",
-      "!text-gray-500",
-      "dark:!text-white",
-      "dark:hover:!text-primary"
-    ];
-  });
+  // const buttonClass = computed(() => {
+  //   return [
+  //     "!h-[20px]",
+  //     "reset-margin",
+  //     "!text-gray-500",
+  //     "dark:!text-white",
+  //     "dark:hover:!text-primary"
+  //   ];
+  // });
 
   function onChange({ row, index }) {
     ElMessageBox.confirm(
@@ -115,7 +95,7 @@ export function useRole() {
         row.status === 0 ? "停用" : "启用"
       }</strong><strong style='color:var(--el-color-primary)'>${
         row.name
-      }</strong>角色吗?`,
+      }</strong>吗?`,
       "系统提示",
       {
         confirmButtonText: "确定",
@@ -141,7 +121,7 @@ export function useRole() {
               loading: false
             }
           );
-          message("已成功修改角色状态", {
+          message(`已${row.status === 0 ? "停用" : "启用"}${row.name}`, {
             type: "success"
           });
         }, 300);
@@ -151,12 +131,9 @@ export function useRole() {
       });
   }
 
-  function handleUpdate(row) {
-    console.log(row);
-  }
-
   function handleDelete(row) {
-    console.log(row);
+    message(`您删除了角色名称为${row.name}的这条数据`, { type: "success" });
+    onSearch();
   }
 
   function handleSizeChange(val: number) {
@@ -173,9 +150,12 @@ export function useRole() {
 
   async function onSearch() {
     loading.value = true;
-    const { data } = await getRoleList();
+    const { data } = await getRoleList(toRaw(form));
     dataList.value = data.list;
     pagination.total = data.total;
+    pagination.pageSize = data.pageSize;
+    pagination.currentPage = data.currentPage;
+
     setTimeout(() => {
       loading.value = false;
     }, 500);
@@ -187,6 +167,56 @@ export function useRole() {
     onSearch();
   };
 
+  function openDialog(title = "新增", row?: FormItemProps) {
+    addDialog({
+      title: `${title}角色`,
+      props: {
+        formInline: {
+          name: row?.name ?? "",
+          code: row?.code ?? "",
+          remark: row?.remark ?? ""
+        }
+      },
+      width: "40%",
+      draggable: true,
+      fullscreenIcon: true,
+      closeOnClickModal: false,
+      contentRenderer: () => h(editForm, { ref: formRef }),
+      beforeSure: (done, { options }) => {
+        const FormRef = formRef.value.getRef();
+        const curData = options.props.formInline as FormItemProps;
+        function chores() {
+          message(`您${title}了角色名称为${curData.name}的这条数据`, {
+            type: "success"
+          });
+          done(); // 关闭弹框
+          onSearch(); // 刷新表格数据
+        }
+        FormRef.validate(valid => {
+          if (valid) {
+            console.log("curData", curData);
+            // 表单规则校验通过
+            if (title === "新增") {
+              // 实际开发先调用新增接口，再进行下面操作
+              chores();
+            } else {
+              // 实际开发先调用编辑接口，再进行下面操作
+              chores();
+            }
+          }
+        });
+      }
+    });
+  }
+
+  /** 菜单权限 */
+  function handleMenu() {
+    message("等菜单管理页面开发后完善");
+  }
+
+  /** 数据权限 可自行开发 */
+  // function handleDatabase() {}
+
   onMounted(() => {
     onSearch();
   });
@@ -197,11 +227,13 @@ export function useRole() {
     columns,
     dataList,
     pagination,
-    buttonClass,
+    // buttonClass,
     onSearch,
     resetForm,
-    handleUpdate,
+    openDialog,
+    handleMenu,
     handleDelete,
+    // handleDatabase,
     handleSizeChange,
     handleCurrentChange,
     handleSelectionChange
diff --git a/src/views/system/role/utils/rule.ts b/src/views/system/role/utils/rule.ts
new file mode 100644
index 000000000..ea1dd19ab
--- /dev/null
+++ b/src/views/system/role/utils/rule.ts
@@ -0,0 +1,8 @@
+import { reactive } from "vue";
+import type { FormRules } from "element-plus";
+
+/** 自定义表单规则校验 */
+export const formRules = reactive(<FormRules>{
+  name: [{ required: true, message: "角色名称为必填项", trigger: "blur" }],
+  code: [{ required: true, message: "角色标识为必填项", trigger: "blur" }]
+});
diff --git a/src/views/system/role/utils/types.ts b/src/views/system/role/utils/types.ts
new file mode 100644
index 000000000..a17e900d7
--- /dev/null
+++ b/src/views/system/role/utils/types.ts
@@ -0,0 +1,15 @@
+// 虽然字段很少 但是抽离出来 后续有扩展字段需求就很方便了
+
+interface FormItemProps {
+  /** 角色名称 */
+  name: string;
+  /** 角色编号 */
+  code: string;
+  /** 备注 */
+  remark: string;
+}
+interface FormProps {
+  formInline: FormItemProps;
+}
+
+export type { FormItemProps, FormProps };