菜单逻辑自测bug修复

src/mock/index.js

@@ -1,24 +1,6 @@
 import Mock from 'mockjs';
 
 const menusList = [
-  // {
-  //   id: 4,
-  //   title: '用户管理',
-  //   parentId: -1,
-  //   url: '/userManage',
-  //   sort: 2,
-  //   icon: null,
-  //   name: 'UserManage',
-  // },
-  // {
-  //   id: 5,
-  //   title: '考试管理',
-  //   parentId: -1,
-  //   url: '/examManage',
-  //   sort: 2,
-  //   icon: null,
-  //   name: 'ExamManage',
-  // },
   {
     id: 1,
     title: '服务单元管理',
@@ -43,6 +25,22 @@ const menusList = [
     sort: 1,
     name: 'DispatchManage',
   },
+  {
+    id: 4,
+    title: '服务单元管理',
+    parentId: 1,
+    url: '/service-unit-manage/service-unit',
+    sort: 2,
+    name: 'ServiceUnit',
+  },
+  {
+    id: 5,
+    title: '服务单元管理',
+    parentId: 4,
+    url: '/service-unit-manage/service-unit/unit-manage',
+    sort: 1,
+    name: 'UnitManage',
+  },
 ];
 
 export const menusApi = Mock.mock('/api/getMenus', 'get', () => {

src/router/asyncRoutes.js

@@ -1,10 +1,3 @@
-import userManage from './modules/userManage';
-import examManage from './modules/examManage';
-//以上两页面作为demo
 import serviceUnitManage from './modules/serviceUnitManage';
 
-export default [
-  // ...userManage,
-  // ...examManage,
-  serviceUnitManage,
-];
+export default [serviceUnitManage];

src/router/modules/examManage.js

@@ -1,12 +0,0 @@
-export default [
-  {
-    name: 'ExamManage',
-    path: '/examManage',
-    component: () => import('@/views/examManage/index.vue'),
-    meta: {
-      title: '考试管理',
-      sort: 2,
-      icon: 'bulletpoint',
-    },
-  },
-];

src/router/modules/serviceUnitManage.js

@@ -33,5 +33,30 @@ export default {
         },
       ],
     },
+    {
+      name: 'ServiceUnit',
+      path: '/service-unit-manage/service-unit',
+      redirect: '/service-unit-manage/service-unit/unit-manage',
+      meta: {
+        title: '服务单元管理',
+        sort: 2,
+        icon: 'bulletpoint',
+      },
+      children: [
+        {
+          name: 'UnitManage',
+          path: '/service-unit-manage/service-unit/unit-manage',
+          component: () =>
+            import(
+              '@/views/service-unit-manage/service-unit/unit-manage/index.vue'
+            ),
+          meta: {
+            title: '服务单元管理',
+            sort: 1,
+            icon: 'bulletpoint',
+          },
+        },
+      ],
+    },
   ],
 };

src/router/modules/userManage.js

@@ -1,12 +0,0 @@
-export default [
-  {
-    name: 'UserManage',
-    path: '/userManage',
-    component: () => import('@/views/userManage/index.vue'),
-    meta: {
-      title: '用户管理',
-      sort: 1,
-      icon: 'user',
-    },
-  },
-];

src/store/modules/user.js

@@ -34,16 +34,21 @@ const flatAsyncRoutes = (routes, breadcrumb = []) => {
 const views = import.meta.glob('../../views/**/**.vue');
 const empty = import.meta.glob('../../layout/empty.vue');
 const findRouterItemByName = (name, arr = asyncRoutes) => {
+  let find = null;
   for (let i = 0; i < arr.length; i++) {
     const item = arr[i];
     if (item.name === name) {
-      return item;
+      find = item;
+      break;
     }
     if (item.children) {
-      return findRouterItemByName(name, item.children);
+      find = findRouterItemByName(name, item.children);
+    }
+    if (find) {
+      break;
     }
   }
-  return null;
+  return find;
 };
 // 菜单转换路由
 const filterAsyncRouter = (routerMap) => {
@@ -114,8 +119,10 @@ const useUserStore = defineStore('user', {
     },
     setMenu(data) {
       const menus = filterAsyncRouter(getTreeList(data));
+      console.log('menus', menus);
       this.menus = menus;
       const routers = flatAsyncRoutes(cloneDeep(menus));
+      console.log('routers', routers);
       this.routers = routers;
       routers.map((item) => router.addRoute('Layout', item));
       if (menus.length) {

src/views/examManage/addExamDialog.vue

@@ -1,51 +0,0 @@
-<template>
-  <my-dialog
-    :visible="visible"
-    @close="emit('update:visible', false)"
-    :header="title"
-    :width="700"
-    :closeOnOverlayClick="false"
-  >
-    <t-form ref="formRef" :model="formData" labelWidth="160px">
-      <t-form-item label="考试名称">
-        <t-input v-model="formData.a"></t-input>
-      </t-form-item>
-      <t-form-item label="类型">
-        <t-input v-model="formData.b"></t-input>
-      </t-form-item>
-      <t-form-item label="考试日期">
-        <t-date-picker
-          mode="date"
-          v-model="formData.c"
-          clearable
-          :presets="presets"
-        />
-      </t-form-item>
-    </t-form>
-    <template #foot>
-      <t-button theme="default" @click="emit('update:visible', false)"
-        >取消</t-button
-      >
-      <t-button theme="primary" @click="handleSave">保存</t-button>
-    </template>
-  </my-dialog>
-</template>
-<script setup name="AddExamDialog">
-import { ref } from 'vue';
-import dayjs from 'dayjs';
-const emit = defineEmits(['update:visible']);
-const formRef = ref(null);
-const presets = ref({
-  今天: dayjs(),
-});
-const props = defineProps({
-  visible: Boolean,
-  title: String,
-  type: String,
-  handleSave: Function,
-  formData: Object,
-});
-defineExpose({
-  formRef,
-});
-</script>

src/views/examManage/index.vue

@@ -1,137 +0,0 @@
-<template>
-  <div class="exam-manage flex flex-col">
-    <SearchForm :fields="searchColumns" :params="params"></SearchForm>
-    <div class="flex-1 page-wrap">
-      <t-table
-        size="small"
-        row-key="id"
-        :columns="columns"
-        :data="tableData"
-        bordered
-      >
-      </t-table>
-    </div>
-    <AddExamDialog
-      v-model:visible="showAddExamDialog"
-      :title="title"
-      :type="type"
-      :handleSave="handleSave"
-      :formData="formData"
-      ref="formDialogRef"
-    ></AddExamDialog>
-  </div>
-</template>
-<script setup lang="jsx" name="ExamManage">
-import { ref, reactive } from 'vue';
-import useTableCrud from '@/hooks/useTableCrud';
-import AddExamDialog from './addExamDialog.vue';
-const formDialogRef = ref();
-const tableData = ref([
-  { a: '222', b: '222', c: '222', d: '222', e: '222', f: '222' },
-]);
-const add = async () => {
-  await 1;
-  alert(1);
-};
-const update = async () => {};
-const refresh = async () => {};
-
-const {
-  visible: showAddExamDialog,
-  type,
-  title,
-  loading,
-  handleAdd,
-  handleEdit,
-  handleSave,
-  formData,
-  formRef,
-} = useTableCrud(
-  {
-    name: '用户',
-    doCreate: add,
-    doUpdate: update,
-    refresh: refresh,
-  },
-  formDialogRef
-);
-const columns = [
-  { colKey: 'a', title: 'ID' },
-  { colKey: 'b', title: '名称' },
-  { colKey: 'c', title: '类型' },
-  { colKey: 'd', title: '考试时间' },
-  { colKey: 'e', title: '强制标记' },
-  { colKey: 'f', title: '状态' },
-  {
-    title: '操作',
-    colKey: 'operate',
-    width: 150,
-    cell: (h, { row }) => {
-      return (
-        <div class="table-operations">
-          <t-link theme="primary" hover="color">
-            详情
-          </t-link>
-          <t-link
-            theme="primary"
-            class="m-l-15px"
-            hover="color"
-            onClick={(e) => {
-              e.stopPropagation();
-              handleEdit(row);
-            }}
-          >
-            编辑
-          </t-link>
-        </div>
-      );
-    },
-  },
-];
-const searchColumns = ref([
-  {
-    prop: 'a',
-    label: '名称',
-    labelWidth: '60px',
-    colSpan: 4,
-  },
-  {
-    prop: 'b',
-    label: '状态',
-    labelWidth: '60px',
-    type: 'select',
-    colSpan: 4,
-  },
-  {
-    prop: 'c',
-    label: '类型',
-    labelWidth: '60px',
-    type: 'select',
-    colSpan: 4,
-  },
-  {
-    type: 'button',
-    text: '查询',
-    attrs: {
-      class: 'm-l-10px',
-    },
-  },
-  {
-    type: 'button',
-    text: '创建考试',
-    position: 'right',
-    attrs: {
-      theme: 'success',
-    },
-    onClick: () => {
-      handleAdd();
-    },
-  },
-]);
-const params = reactive({
-  a: '',
-  b: '',
-  c: '',
-});
-</script>
-<style lang="less" scoped></style>

src/views/service-unit-manage/service-unit/unit-manage/index.vue

@@ -0,0 +1,65 @@
+<template>
+  <div class="unit-manage flex flex-col">
+    <SearchForm :fields="fields" :params="params"></SearchForm>
+    <div class="flex-1 page-wrap"> </div>
+  </div>
+</template>
+
+<script setup lang="jsx" name="UnitManage">
+import { ref, reactive } from 'vue';
+const fields = ref([
+  {
+    prop: 'a',
+    label: '业务类型',
+    type: 'select',
+    labelWidth: '80px',
+    colSpan: 4,
+  },
+  {
+    prop: 'b',
+    label: '负责人',
+    type: 'select',
+    labelWidth: '80px',
+    colSpan: 4,
+  },
+  {
+    prop: 'c',
+    label: '当前状态',
+    type: 'select',
+    labelWidth: '80px',
+    colSpan: 4,
+  },
+  {
+    prop: 'd',
+    label: '创建时间',
+    type: 'select',
+    labelWidth: '80px',
+    colSpan: 4,
+  },
+  {
+    type: 'buttons',
+    colSpan: 3,
+    children: [
+      {
+        type: 'button',
+        text: '查询',
+      },
+    ],
+  },
+  {
+    prop: 'e',
+    label: '创建时间',
+    labelWidth: '100px',
+    colSpan: 4,
+  },
+]);
+const params = reactive({
+  a: '',
+  b: '',
+  c: '',
+  d: '',
+  e: [],
+});
+</script>
+
+<style></style>

src/views/userManage/add-user-dialog.vue

@@ -1,54 +0,0 @@
-<template>
-  <my-dialog
-    :visible="visible"
-    @close="emit('update:visible', false)"
-    :header="title"
-    :width="450"
-    :closeOnOverlayClick="false"
-  >
-    <t-form ref="formRef" :model="formData" labelWidth="80px">
-      <t-form-item label="登录名">
-        <t-input v-model="formData.a"></t-input>
-      </t-form-item>
-      <t-form-item label="名称">
-        <t-input v-model="formData.b"></t-input>
-      </t-form-item>
-      <t-form-item label="工号">
-        <t-input v-model="formData.c"></t-input>
-      </t-form-item>
-      <t-form-item label="密码">
-        <t-input v-model="formData.d" type="password"></t-input>
-      </t-form-item>
-      <t-form-item label="状态">
-        <t-select v-model="formData.e">
-          <t-option>启用</t-option>
-          <t-option>禁用</t-option>
-        </t-select>
-      </t-form-item>
-      <t-form-item label="角色">
-        <t-select v-model="formData.f"> </t-select>
-      </t-form-item>
-    </t-form>
-    <template #foot>
-      <t-button theme="default" @click="emit('update:visible', false)"
-        >取消</t-button
-      >
-      <t-button theme="primary" @click="handleSave">保存</t-button>
-    </template>
-  </my-dialog>
-</template>
-<script setup name="AddUserDialog">
-import { ref } from 'vue';
-const emit = defineEmits(['update:visible']);
-const formRef = ref(null);
-const props = defineProps({
-  visible: Boolean,
-  title: String,
-  type: String,
-  handleSave: Function,
-  formData: Object,
-});
-defineExpose({
-  formRef,
-});
-</script>

src/views/userManage/import-file-dialog.vue

@@ -1,55 +0,0 @@
-<template>
-  <my-dialog
-    :visible="visible"
-    @close="emit('update:visible', false)"
-    :header="`导入${title}`"
-    :width="450"
-    :closeOnOverlayClick="false"
-  >
-    <t-upload
-      ref="uploadRef"
-      v-model="files"
-      :request-method="requestMethod"
-      placeholder="导入文件不能超过5M，仅允许导入“xls”或“xlsx”格式文件！"
-      :size-limit="{ size: 5, unit: 'MB' }"
-      :on-fail="handleRequestFail"
-      accept=".xls,.xlsx"
-    ></t-upload>
-    <template #foot>
-      <t-button>导入</t-button>
-      <t-link theme="primary" class="m-l-5px">下载模板</t-link>
-    </template>
-  </my-dialog>
-</template>
-<script setup name="UserImportFile">
-import { ref } from 'vue';
-import { MessagePlugin } from 'tdesign-vue-next';
-const emit = defineEmits(['update:visible']);
-const props = defineProps({
-  visible: Boolean,
-  title: String,
-  importType: String,
-});
-
-const files = ref([]);
-const requestMethod = (file) => {
-  return new Promise((resolve) => {
-    // file.percent 用于控制上传进度，如果不希望显示上传进度，则不对 file.percent 设置值即可。
-    // 如果代码规范不能设置 file.percent，也可以设置 files
-    file.percent = 0;
-    const timer = setTimeout(() => {
-      // resolve 参数为关键代码
-      resolve({
-        status: 'success',
-        response: { url: 'https://tdesign.gtimg.com/site/avatar.jpg' },
-      });
-      file.percent = 100;
-      clearTimeout(timer);
-    }, 10000);
-  });
-};
-const handleRequestFail = (e) => {
-  MessagePlugin.error('上传失败');
-};
-</script>
-<style lang="less" scoped></style>

src/views/userManage/index.vue

@@ -1,282 +0,0 @@
-<template>
-  <div class="user-manage flex flex-col">
-    <SearchForm :fields="searchColumns" :params="params"></SearchForm>
-
-    <div class="flex-1 page-wrap">
-      <t-table
-        bordered
-        size="small"
-        row-key="id"
-        :columns="columns"
-        :data="tableData"
-        :selected-row-keys="selectedRowKeys"
-        select-on-row-click
-        @select-change="rehandleSelectChange"
-      >
-      </t-table>
-    </div>
-
-    <AddUserDialog
-      v-model:visible="showAddUserDialog"
-      :title="title"
-      :type="type"
-      :handleSave="handleSave"
-      :formData="formData"
-      ref="formDialogRef"
-    ></AddUserDialog>
-
-    <ImportFileDialog
-      v-model:visible="showImportFileDialog"
-      :importType="importType"
-      :title="importTitle"
-    >
-    </ImportFileDialog>
-    <MultAddUserDialog
-      v-model:visible="showMultAddUserDialog"
-    ></MultAddUserDialog>
-  </div>
-</template>
-<script lang="jsx" setup name="UserManage">
-import useTableCrud from '@/hooks/useTableCrud';
-import { ref, reactive } from 'vue';
-import AddUserDialog from './add-user-dialog.vue';
-import ImportFileDialog from './import-file-dialog.vue';
-import MultAddUserDialog from './mult-add-dialog.vue';
-
-const formDialogRef = ref(null);
-const showMultAddUserDialog = ref(false);
-const showImportFileDialog = ref(false);
-const importType = ref('');
-const importTitle = ref('');
-
-const selectedRowKeys = ref([]);
-const rehandleSelectChange = (value, { selectedRowData }) => {
-  selectedRowKeys.value = value;
-};
-const columns = [
-  {
-    colKey: 'row-select',
-    type: 'multiple',
-    width: 50,
-  },
-  { colKey: 'a', title: '登录名' },
-  { colKey: 'b', title: '名称' },
-  { colKey: 'c', title: '来源' },
-  { colKey: 'd', title: '角色' },
-  { colKey: 'e', title: '状态' },
-  { colKey: 'f', title: '关联账号' },
-  {
-    title: '操作',
-    colKey: 'operate',
-    width: 150,
-    cell: (h, { row }) => {
-      return (
-        <div class="table-operations">
-          <t-link
-            theme="primary"
-            hover="color"
-            data-id={row.id}
-            onClick={(e) => {
-              e.stopPropagation();
-              handleEdit(row);
-            }}
-          >
-            编辑
-          </t-link>
-        </div>
-      );
-    },
-  },
-];
-const tableData = [
-  { id: 'a', a: '111', b: '111', c: '111', d: '111', e: '111', f: '111' },
-  { id: 'b', a: '111', b: '111', c: '111', d: '111', e: '111', f: '111' },
-  { id: 'c', a: '111', b: '111', c: '111', d: '111', e: '111', f: '111' },
-  { id: 'd', a: '111', b: '111', c: '111', d: '111', e: '111', f: '111' },
-  { id: 'e', a: '111', b: '111', c: '111', d: '111', e: '111', f: '111' },
-  { id: 'f', a: '111', b: '111', c: '111', d: '111', e: '111', f: '111' },
-  { id: 'g', a: '111', b: '111', c: '111', d: '111', e: '111', f: '111' },
-];
-const add = async () => {
-  await 1;
-  alert(1);
-};
-const update = async () => {};
-const refresh = async () => {};
-
-const {
-  visible: showAddUserDialog,
-  type,
-  title,
-  loading,
-  handleAdd,
-  handleEdit,
-  handleSave,
-  formData,
-  formRef,
-} = useTableCrud(
-  {
-    name: '用户',
-    doCreate: add,
-    doUpdate: update,
-    refresh: refresh,
-  },
-  formDialogRef
-);
-const searchColumns = ref([
-  {
-    prop: 'a',
-    label: '登录名',
-    labelWidth: '60px',
-    colSpan: 3.6,
-  },
-  {
-    prop: 'b',
-    label: '姓名',
-    labelWidth: '60px',
-    colSpan: 3.6,
-  },
-  {
-    prop: 'c',
-    label: '来源',
-    type: 'select',
-    labelWidth: '60px',
-    colSpan: 3.6,
-  },
-  {
-    prop: 'd',
-    label: '角色',
-    type: 'select',
-    labelWidth: '60px',
-    colSpan: 3.6,
-  },
-  {
-    prop: 'e',
-    label: '状态',
-    type: 'select',
-    labelWidth: '60px',
-    colSpan: 3.6,
-  },
-  {
-    type: 'buttons',
-    colSpan: 6,
-    children: [
-      {
-        type: 'button',
-        text: '查询',
-        attrs: {
-          theme: 'primary',
-        },
-        onClick: () => {
-          alert(1);
-        },
-      },
-      {
-        type: 'button',
-        text: '新建',
-        attrs: {
-          theme: 'default',
-          // variant: 'outline',
-        },
-        onClick: handleAdd,
-      },
-      {
-        type: 'dropdown',
-        text: '导入',
-        attrs: {
-          options: [
-            { content: '科组长', value: 1 },
-            { content: '复核员', value: 2 },
-          ],
-        },
-        buttonAttrs: {
-          theme: 'default',
-        },
-        onClick: (data) => {
-          showImportFileDialog.value = true;
-          importTitle.value = data.content;
-        },
-      },
-    ],
-  },
-  {
-    type: 'buttons',
-    colSpan: 24,
-    children: [
-      {
-        type: 'button',
-        text: '导入评卷员班级',
-        attrs: {
-          theme: 'default',
-        },
-        onClick: () => {
-          alert(1);
-        },
-      },
-      {
-        type: 'dropdown',
-        text: '导出',
-        attrs: {
-          options: [
-            { content: '导出', value: 1 },
-            { content: '按考试导出', value: 2 },
-          ],
-        },
-        buttonAttrs: {
-          theme: 'default',
-        },
-        onClick: (data) => {
-          alert(data.content);
-        },
-      },
-      {
-        type: 'button',
-        text: '批量创建',
-        attrs: {
-          theme: 'default',
-        },
-        onClick: () => {
-          alert(1);
-        },
-      },
-      {
-        type: 'button',
-        text: '启用',
-        attrs: {
-          theme: 'default',
-        },
-        onClick: () => {
-          alert(1);
-        },
-      },
-      {
-        type: 'button',
-        text: '禁用',
-        attrs: {
-          theme: 'default',
-        },
-        onClick: () => {
-          alert(1);
-        },
-      },
-      {
-        type: 'button',
-        text: '重置密码',
-        attrs: {
-          theme: 'default',
-        },
-        onClick: () => {
-          alert(1);
-        },
-      },
-    ],
-  },
-]);
-const params = reactive({
-  a: '',
-  b: '',
-  c: '',
-  d: '',
-  e: '',
-});
-</script>

src/views/userManage/mult-add-dialog.vue

@@ -1,120 +0,0 @@
-<template>
-  <my-dialog
-    :visible="visible"
-    @close="emit('update:visible', false)"
-    header="批量创建账号"
-    :width="550"
-    :closeOnOverlayClick="false"
-  >
-    <t-form ref="form" :model="formData" labelWidth="130px">
-      <t-form-item label="考试名称："> XXXXXXX考试！</t-form-item>
-      <t-form-item label="角色：">
-        <t-select v-model="formData.a"></t-select>
-      </t-form-item>
-      <t-form-item label="命名规则：">机构ID+科目代码+流水号</t-form-item>
-      <t-form-item label="每分组账号数：">
-        <t-input-number
-          v-model="formData.b"
-          theme="column"
-          :decimalPlaces="0"
-          align="center"
-          :max="100"
-          :min="1"
-          style="width: 150px"
-          :status="numStatus"
-          :tips="numTips"
-        ></t-input-number>
-      </t-form-item>
-      <t-form-item label="随机密码：">
-        <t-checkbox v-model="formData.c"> </t-checkbox>
-      </t-form-item>
-      <t-form-item label="密码：">
-        <t-input v-model="formData.d"></t-input>
-      </t-form-item>
-      <t-form-item label="选择科目：">
-        <t-link theme="primary" underline @click="chooseSubject">设置</t-link>
-      </t-form-item>
-    </t-form>
-  </my-dialog>
-  <my-dialog
-    v-model:visible="showSubjectDialog"
-    :width="700"
-    header="选择科目"
-    :on-confirm="onConfirm"
-  >
-    <t-table
-      bordered
-      size="small"
-      row-key="id"
-      :columns="columns"
-      :data="tableData"
-      :selected-row-keys="selectedRowKeys"
-      select-on-row-click
-      @select-change="rehandleSelectChange"
-    >
-    </t-table>
-  </my-dialog>
-</template>
-
-<script setup name="MultAddUserDialog">
-import { reactive, computed, ref } from 'vue';
-const emit = defineEmits(['update:visible']);
-const props = defineProps({
-  visible: Boolean,
-});
-const showSubjectDialog = ref(false);
-
-const chooseSubject = () => {
-  showSubjectDialog.value = true;
-};
-const numStatus = computed(() => {
-  if (
-    (formData.b > 0 && formData.b <= 100) ||
-    formData.b === '' ||
-    formData.b === undefined
-  ) {
-    return '';
-  } else {
-    return 'error';
-  }
-});
-const numTips = computed(() => {
-  if (
-    (formData.b > 0 && formData.b <= 100) ||
-    formData.b === '' ||
-    formData.b === undefined
-  ) {
-    return '';
-  } else {
-    return '只能填1~100的整数';
-  }
-});
-const formData = reactive({
-  a: '',
-  b: '',
-  c: true,
-  d: '',
-});
-
-const tableData = ref([{ a: '哈哈哈', b: 0, c: 1, d: 2, e: '正常' }]);
-const selectedRowKeys = ref([]);
-const rehandleSelectChange = (value, { selectedRowData }) => {
-  selectedRowKeys.value = value;
-};
-const columns = [
-  {
-    colKey: 'row-select',
-    type: 'multiple',
-    width: 50,
-  },
-  { colKey: 'a', title: '科目名称' },
-  { colKey: 'b', title: '客观总分' },
-  { colKey: 'c', title: '主观总分' },
-  { colKey: 'd', title: '试卷总分' },
-  { colKey: 'e', title: '状态' },
-];
-const onConfirm = () => {
-  alert(1);
-  showSubjectDialog.value = false;
-};
-</script>