chore: 更新演示页

README.en-US.md

@@ -141,7 +141,7 @@ After operating the above two commands, open `http://localhost:8080` in the brow
 Of course, you can also operate the `docker` project through the [Docker Desktop](https://www.docker.com/products/docker-desktop/) visual interface, as shown below
 
 <p align="center">
-  <img alt="docker" width="100%" src="https://xiaoxian521.github.io/hyperlink/img/docker-desktop.jpg">
+  <img alt="docker-desktop" width="100%" src="https://xiaoxian521.github.io/hyperlink/img/docker-desktop.jpg">
 </p>
 
 ## Change Log
@@ -198,6 +198,10 @@ Completely free and open source
 
 [MIT © 2020-present, pure-admin](./LICENSE)
 
+## Donate
+
+No donations required, just be kind to yourself
+
 ## `Star`
 
 Many thanks to the kind individuals who leave a star. Your support is much appreciated :heart:

README.md

@@ -141,7 +141,7 @@ docker run -dp 8080:80  --name pure-admin vue-pure-admin
 当然也可以通过 [Docker Desktop](https://www.docker.com/products/docker-desktop/) 可视化界面去操作 `docker` 项目，如下图
 
 <p align="center">
-  <img alt="docker" width="100%" src="https://xiaoxian521.github.io/hyperlink/img/docker-desktop.jpg">
+  <img alt="docker-desktop" width="100%" src="https://xiaoxian521.github.io/hyperlink/img/docker-desktop.jpg">
 </p>
 
 ## 更新日志
@@ -198,6 +198,10 @@ docker run -dp 8080:80  --name pure-admin vue-pure-admin
 
 [MIT © 2020-present, pure-admin](./LICENSE)
 
+## 捐赠
+
+无需任何捐赠，对自己好点
+
 ## `Star`
 
 非常感谢留下星星的好心人，感谢您的支持 :heart:

locales/en.yaml

@@ -29,6 +29,7 @@ menus:
   hssysManagement: System Manage
   hsUser: User Manage
   hsRole: Role Manage
+  hsSystemMenu: Menu Manage
   hsDept: Dept Manage
   hseditor: Editor
   hsabnormal: Abnormal Page

locales/zh-CN.yaml

@@ -29,6 +29,7 @@ menus:
   hssysManagement: 系统管理
   hsUser: 用户管理
   hsRole: 角色管理
+  hsSystemMenu: 菜单管理
   hsDept: 部门管理
   hseditor: 编辑器
   hsabnormal: 异常页面

mock/asyncRoutes.ts

@@ -18,7 +18,7 @@ const systemRouter = {
   children: [
     {
       path: "/system/user/index",
-      name: "User",
+      name: "SystemUser",
       meta: {
         icon: "flUser",
         title: "menus.hsUser",
@@ -27,16 +27,25 @@ const systemRouter = {
     },
     {
       path: "/system/role/index",
-      name: "Role",
+      name: "SystemRole",
       meta: {
         icon: "role",
         title: "menus.hsRole",
         roles: ["admin"]
       }
     },
+    {
+      path: "/system/menu/index",
+      name: "SystemMenu",
+      meta: {
+        icon: "menu",
+        title: "menus.hsSystemMenu",
+        roles: ["admin"]
+      }
+    },
     {
       path: "/system/dept/index",
-      name: "Dept",
+      name: "SystemDept",
       meta: {
         icon: "dept",
         title: "menus.hsDept",

package.json

@@ -175,4 +175,4 @@
       "abab": "*"
     }
   }
-}
+}

src/components/ReAnimateSelector/src/index.vue

@@ -72,11 +72,11 @@ function onMouseleave() {
 
 <template>
   <el-select
-    class="!w-[200px]"
-    :model-value="inputValue"
-    placeholder="请选择动画"
     clearable
     filterable
+    placeholder="请选择动画"
+    popper-class="pure-animate-popper"
+    :model-value="inputValue"
     :filter-method="filterMethod"
     @clear="onClear"
   >
@@ -121,3 +121,9 @@ function onMouseleave() {
     </template>
   </el-select>
 </template>
+
+<style>
+.pure-animate-popper {
+  min-width: 0 !important;
+}
+</style>

src/components/ReIcon/src/Select.vue

@@ -121,7 +121,7 @@ watch(
 </script>
 
 <template>
-  <div class="selector w-[220px]">
+  <div class="selector">
     <el-input v-model="inputValue" disabled>
       <template #append>
         <el-popover

src/views/able/icon-select.vue

@@ -16,6 +16,6 @@ const icon = ref("ep:add-location");
         <span class="font-medium">图标选择器</span>
       </div>
     </template>
-    <IconSelect v-model="icon" />
+    <IconSelect v-model="icon" class="w-[200px]" />
   </el-card>
 </template>

src/views/components/dialog/index.vue

@@ -454,9 +454,10 @@ function onBeforeSureClick() {
           ，采用函数式调用弹框组件（更多操作实例请参考
           <span
             class="cursor-pointer text-primary"
-            @click="router.push({ name: 'Dept' })"
-            >系统管理页面</span
+            @click="router.push({ name: 'SystemDept' })"
           >
+            系统管理页面
+          </span>
           ）
         </span>
       </div>

src/views/system/dept/index.vue

@@ -10,7 +10,7 @@ import Refresh from "@iconify-icons/ep/refresh";
 import AddFill from "@iconify-icons/ri/add-circle-line";
 
 defineOptions({
-  name: "Dept"
+  name: "SystemDept"
 });
 
 const formRef = ref();
@@ -71,7 +71,7 @@ const {
     </el-form>
 
     <PureTableBar
-      title="部门列表（仅演示，操作后不生效）"
+      title="部门管理（仅演示，操作后不生效）"
       :columns="columns"
       :tableRef="tableRef?.getTableRef()"
       @refresh="onSearch"
@@ -106,15 +106,25 @@ const {
           @selection-change="handleSelectionChange"
         >
           <template #operation="{ row }">
+            <el-button
+              class="reset-margin"
+              link
+              type="primary"
+              :size="size"
+              :icon="useRenderIcon(AddFill)"
+              @click="openDialog('新增', { parentId: row.id } as any)"
+            >
+              新增
+            </el-button>
             <el-button
               class="reset-margin"
               link
               type="primary"
               :size="size"
               :icon="useRenderIcon(EditPen)"
-              @click="openDialog('编辑', row)"
+              @click="openDialog('修改', row)"
             >
-              编辑
+              修改
             </el-button>
             <el-popconfirm
               :title="`是否确认删除部门名称为${row.name}的这条数据`"

src/views/system/dept/utils/hook.tsx

@@ -57,7 +57,7 @@ export function useDept() {
     {
       label: "操作",
       fixed: "right",
-      width: 160,
+      width: 210,
       slot: "operation"
     }
   ];
@@ -141,7 +141,7 @@ export function useDept() {
               // 实际开发先调用新增接口，再进行下面操作
               chores();
             } else {
-              // 实际开发先调用编辑接口，再进行下面操作
+              // 实际开发先调用修改接口，再进行下面操作
               chores();
             }
           }
@@ -168,7 +168,7 @@ export function useDept() {
     onSearch,
     /** 重置 */
     resetForm,
-    /** 新增、编辑部门 */
+    /** 新增、修改部门 */
     openDialog,
     /** 删除部门 */
     handleDelete,

src/views/system/menu/index.vue

@@ -0,0 +1,9 @@
+<script setup lang="ts">
+defineOptions({
+  name: "SystemMenu"
+});
+</script>
+
+<template>
+  <div class="main">菜单管理</div>
+</template>

src/views/system/role/index.vue

@@ -13,7 +13,7 @@ import Menu from "@iconify-icons/ep/menu";
 import AddFill from "@iconify-icons/ri/add-circle-line";
 
 defineOptions({
-  name: "Role"
+  name: "SystemRole"
 });
 
 const formRef = ref();
@@ -87,7 +87,7 @@ const {
     </el-form>
 
     <PureTableBar
-      title="角色列表（仅演示，操作后不生效）"
+      title="角色管理（仅演示，操作后不生效）"
       :columns="columns"
       @refresh="onSearch"
     >
@@ -127,7 +127,7 @@ const {
               type="primary"
               :size="size"
               :icon="useRenderIcon(EditPen)"
-              @click="openDialog('编辑', row)"
+              @click="openDialog('修改', row)"
             >
               修改
             </el-button>

src/views/system/role/utils/hook.tsx

@@ -200,7 +200,7 @@ export function useRole() {
               // 实际开发先调用新增接口，再进行下面操作
               chores();
             } else {
-              // 实际开发先调用编辑接口，再进行下面操作
+              // 实际开发先调用修改接口，再进行下面操作
               chores();
             }
           }

src/views/system/user/index.vue

@@ -15,7 +15,7 @@ import Refresh from "@iconify-icons/ep/refresh";
 import AddFill from "@iconify-icons/ri/add-circle-line";
 
 defineOptions({
-  name: "User"
+  name: "SystemUser"
 });
 
 const treeRef = ref();
@@ -173,7 +173,7 @@ const {
                 type="primary"
                 :size="size"
                 :icon="useRenderIcon(EditPen)"
-                @click="openDialog('编辑', row)"
+                @click="openDialog('修改', row)"
               >
                 修改
               </el-button>

src/views/system/user/utils/hook.tsx

@@ -342,7 +342,7 @@ export function useUser(tableRef: Ref, treeRef: Ref) {
               // 实际开发先调用新增接口，再进行下面操作
               chores();
             } else {
-              // 实际开发先调用编辑接口，再进行下面操作
+              // 实际开发先调用修改接口，再进行下面操作
               chores();
             }
           }

types/router.d.ts

@@ -32,7 +32,7 @@ declare global {
     frameSrc?: string;
     /** `iframe`页是否开启首次加载动画（默认`true`）`可选` */
     frameLoading?: boolean;
-    /** 页面加载动画（有两种形式，一种直接采用vue内置的`transitions`动画，另一种是使用`animate.css`写进、离场动画）`可选` */
+    /** 页面加载动画（两种模式，第二种权重更高，第一种直接采用`vue`内置的`transitions`动画，第二种是使用`animate.css`编写进、离场动画，平台更推荐使用第二种模式，已经内置了`animate.css`，直接写对应的动画名即可）`可选` */
     transition?: {
       /**
        * @description 当前路由动画效果

vite.config.ts

@@ -59,4 +59,4 @@ export default ({ mode }: ConfigEnv): UserConfigExport => {
       __APP_INFO__: JSON.stringify(__APP_INFO__)
     }
   };
-};
+};