feat:新增菜单、部门页面

2024-09-02 18:16:07 +08:00
parent b648f09f16
commit bc83362b35
6 changed files with 46 additions and 46 deletions
--- a/Yi.Pure.Vue3/src/api/system/menu.ts
+++ b/Yi.Pure.Vue3/src/api/system/menu.ts
@@ -12,8 +12,8 @@ export const getListMenu = query => {
 };

 /** 查询菜单详细 */
-export const getMenu = menuId => {
-  return http.request<Result>("get", `/menu/${menuId}`, {});
+export const getMenu = id => {
+  return http.request<Result>("get", `/menu/${id}`, {});
 };

 /** 新增菜单 */
--- a/Yi.Pure.Vue3/src/views/system/menu/form.vue
+++ b/Yi.Pure.Vue3/src/views/system/menu/form.vue
@@ -22,24 +22,24 @@ const props = withDefaults(defineProps<FormProps>(), {
    menuType: 0,
    higherMenuOptions: [],
    parentId: 0,
-    title: "",
+    menuName: "",
    name: "",
-    path: "",
+    router: "",
    component: "",
-    rank: 99,
+    orderNum: 99,
    redirect: "",
    icon: "",
    extraIcon: "",
    enterTransition: "",
    leaveTransition: "",
    activePath: "",
-    auths: "",
+    permissionCode: "",
    frameSrc: "",
    frameLoading: true,
    keepAlive: false,
    hiddenTag: false,
    fixedTag: false,
-    showLink: true,
+    isShow: true,
    showParent: false
  })
 });
@@ -88,7 +88,7 @@ defineExpose({ getRef });
            placeholder="请选择上级菜单"
          >
            <template #default="{ node, data }">
-              <span>{{ transformI18n(data.title) }}</span>
+              <span>{{ transformI18n(data.menuName) }}</span>
              <span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
            </template>
          </el-cascader>
@@ -98,7 +98,7 @@ defineExpose({ getRef });
      <re-col :value="12" :xs="24" :sm="24">
        <el-form-item label="菜单名称" prop="title">
          <el-input
-            v-model="newFormInline.title"
+            v-model="newFormInline.menuName"
            clearable
            placeholder="请输入菜单名称"
          />
@@ -115,9 +115,9 @@ defineExpose({ getRef });
      </re-col>

      <re-col v-if="newFormInline.menuType !== 3" :value="12" :xs="24" :sm="24">
-        <el-form-item label="路由路径" prop="path">
+        <el-form-item label="路由路径" prop="router">
          <el-input
-            v-model="newFormInline.path"
+            v-model="newFormInline.router"
            clearable
            placeholder="请输入路由路径"
          />
@@ -222,9 +222,9 @@ defineExpose({ getRef });
      </re-col>
      <re-col v-if="newFormInline.menuType === 3" :value="12" :xs="24" :sm="24">
        <!-- 按钮级别权限设置 -->
-        <el-form-item label="权限标识" prop="auths">
+        <el-form-item label="权限标识" prop="orderNum">
          <el-input
-            v-model="newFormInline.auths"
+            v-model="newFormInline.orderNum"
            clearable
            placeholder="请输入权限标识"
          />
@@ -268,11 +268,11 @@ defineExpose({ getRef });
      >
        <el-form-item label="菜单">
          <Segmented
-            :modelValue="newFormInline.showLink ? 0 : 1"
+            :modelValue="newFormInline.isShow ? false : true"
            :options="showLinkOptions"
            @change="
              ({ option: { value } }) => {
-                newFormInline.showLink = value;
+                newFormInline.isShow = value;
              }
            "
          />
--- a/Yi.Pure.Vue3/src/views/system/menu/index.vue
+++ b/Yi.Pure.Vue3/src/views/system/menu/index.vue
@@ -39,7 +39,7 @@ const {
    >
      <el-form-item label="菜单名称：" prop="title">
        <el-input
-          v-model="form.title"
+          v-model="form.menuName"
          placeholder="请输入菜单名称"
          clearable
          class="!w-[180px]"
--- a/Yi.Pure.Vue3/src/views/system/menu/utils/hook.tsx
+++ b/Yi.Pure.Vue3/src/views/system/menu/utils/hook.tsx
@@ -1,7 +1,7 @@
 import editForm from "../form.vue";
 import { handleTree } from "@/utils/tree";
 import { message } from "@/utils/message";
-import { getMenuList } from "@/api/system";
+import { getListMenu } from "@/api/system/menu";
 import { transformI18n } from "@/plugins/i18n";
 import { addDialog } from "@/components/ReDialog";
 import { reactive, ref, onMounted, h } from "vue";
@@ -11,7 +11,7 @@ import { cloneDeep, isAllEmpty, deviceDetection } from "@pureadmin/utils";

 export function useMenu() {
  const form = reactive({
-    title: ""
+    menuName: ""
  });

  const formRef = ref();
@@ -34,7 +34,7 @@ export function useMenu() {
  const columns: TableColumnList = [
    {
      label: "菜单名称",
-      prop: "title",
+      prop: "menuName",
      align: "left",
      cellRenderer: ({ row }) => (
        <>
@@ -43,7 +43,7 @@ export function useMenu() {
              style: { paddingTop: "1px" }
            })}
          </span>
-          <span>{transformI18n(row.title)}</span>
+          <span>{transformI18n(row.menuName)}</span>
        </>
      )
    },
@@ -63,7 +63,7 @@ export function useMenu() {
    },
    {
      label: "路由路径",
-      prop: "path"
+      prop: "router"
    },
    {
      label: "组件路径",
@@ -73,17 +73,17 @@ export function useMenu() {
    },
    {
      label: "权限标识",
-      prop: "auths"
+      prop: "permissionCode"
    },
    {
      label: "排序",
-      prop: "rank",
+      prop: "orderNum",
      width: 100
    },
    {
-      label: "隐藏",
-      prop: "showLink",
-      formatter: ({ showLink }) => (showLink ? "否" : "是"),
+      label: "显示",
+      prop: "isShow",
+      formatter: ({ isShow }) => (isShow ? "否" : "是"),
      width: 100
    },
    {
@@ -106,18 +106,16 @@ export function useMenu() {

  async function onSearch() {
    loading.value = true;
-    const { data } = await getMenuList(); // 这里是返回一维数组结构，前端自行处理成树结构，返回格式要求：唯一id加父节点parentId，parentId取父节点id
+    const data = (await getListMenu(form)).data.items; // 这里是返回一维数组结构，前端自行处理成树结构，返回格式要求：唯一id加父节点parentId，parentId取父节点id
    let newData = data;
-    if (!isAllEmpty(form.title)) {
+    if (!isAllEmpty(form.menuName)) {
      // 前端搜索菜单名称
      newData = newData.filter(item =>
-        transformI18n(item.title).includes(form.title)
+        transformI18n(item.title).includes(form.menuName)
      );
    }
    dataList.value = handleTree(newData); // 处理成树结构
-    setTimeout(() => {
    loading.value = false;
-    }, 500);
  }

  function formatHigherMenuOptions(treeList) {
@@ -139,24 +137,24 @@ export function useMenu() {
          menuType: row?.menuType ?? 0,
          higherMenuOptions: formatHigherMenuOptions(cloneDeep(dataList.value)),
          parentId: row?.parentId ?? 0,
-          title: row?.title ?? "",
+          title: row?.menuName ?? "",
          name: row?.name ?? "",
-          path: row?.path ?? "",
+          router: row?.router ?? "",
          component: row?.component ?? "",
-          rank: row?.rank ?? 99,
+          orderNum: row?.orderNum ?? 99,
          redirect: row?.redirect ?? "",
          icon: row?.icon ?? "",
          extraIcon: row?.extraIcon ?? "",
          enterTransition: row?.enterTransition ?? "",
          leaveTransition: row?.leaveTransition ?? "",
          activePath: row?.activePath ?? "",
-          auths: row?.auths ?? "",
+          permissionCode: row?.permissionCode ?? "",
          frameSrc: row?.frameSrc ?? "",
          frameLoading: row?.frameLoading ?? true,
          keepAlive: row?.keepAlive ?? false,
          hiddenTag: row?.hiddenTag ?? false,
          fixedTag: row?.fixedTag ?? false,
-          showLink: row?.showLink ?? true,
+          showLink: row?.isShow ?? true,
          showParent: row?.showParent ?? false
        }
      },
@@ -171,7 +169,7 @@ export function useMenu() {
        const curData = options.props.formInline as FormItemProps;
        function chores() {
          message(
-            `您${title}了菜单名称为${transformI18n(curData.title)}的这条数据`,
+            `您${title}了菜单名称为${transformI18n(curData.menuName)}的这条数据`,
            {
              type: "success"
            }
--- a/Yi.Pure.Vue3/src/views/system/menu/utils/rule.ts
+++ b/Yi.Pure.Vue3/src/views/system/menu/utils/rule.ts
@@ -3,8 +3,10 @@ import type { FormRules } from "element-plus";

 /** 自定义表单规则校验 */
 export const formRules = reactive(<FormRules>{
-  title: [{ required: true, message: "菜单名称为必填项", trigger: "blur" }],
+  menuName: [{ required: true, message: "菜单名称为必填项", trigger: "blur" }],
  name: [{ required: true, message: "路由名称为必填项", trigger: "blur" }],
-  path: [{ required: true, message: "路由路径为必填项", trigger: "blur" }],
-  auths: [{ required: true, message: "权限标识为必填项", trigger: "blur" }]
+  router: [{ required: true, message: "路由路径为必填项", trigger: "blur" }],
+  permissionCode: [
+    { required: true, message: "权限标识为必填项", trigger: "blur" }
+  ]
 });
--- a/Yi.Pure.Vue3/src/views/system/menu/utils/types.ts
+++ b/Yi.Pure.Vue3/src/views/system/menu/utils/types.ts
@@ -3,24 +3,24 @@ interface FormItemProps {
  menuType: number;
  higherMenuOptions: Record<string, unknown>[];
  parentId: number;
-  title: string;
+  menuName: string;
  name: string;
-  path: string;
+  router: string;
  component: string;
-  rank: number;
+  orderNum: number;
  redirect: string;
  icon: string;
  extraIcon: string;
  enterTransition: string;
  leaveTransition: string;
  activePath: string;
-  auths: string;
+  permissionCode: string;
  frameSrc: string;
  frameLoading: boolean;
  keepAlive: boolean;
  hiddenTag: boolean;
  fixedTag: boolean;
-  showLink: boolean;
+  isShow: boolean;
  showParent: boolean;
 }
 interface FormProps {