Prechádzať zdrojové kódy

重构用户路由功能,更新相关函数命名及注释,新增获取用户路由列表功能,添加权限控制,优化路由配置结构,删除旧路由文件。

张涛 1 rok pred
rodič
commit
7feace55bf

+ 2 - 1
src/apis/login.js

@@ -30,8 +30,9 @@ export function QueyrUserInfo() {
     method: 'get'
   });
 }
+
 // 获取用户路由
-export function generateRoutes() {
+export function QueyrRoutesList() {
   return request({
     url: '/api/user/user_routers',
     method: 'get'

+ 2 - 1
src/base/storage.js

@@ -13,7 +13,8 @@ export const localST_Locale = new MyLocalStorage('locale'); // 多语言
 export const localST_RecentAgent = new MyLocalStorage('recent_agent'); // 近期使用的agent
 export const localST_AllAgent = new MyLocalStorage('full_agent'); // 所有可用的agent
 
-export const localST_UserInfo = new MyLocalStorage('user_info'); // 所有可用的agent
+export const localST_UserInfo = new MyLocalStorage('user_info'); // 用户信息
+export const localST_RoutesList = new MyLocalStorage('routes_list'); // 用户身份token
 
 /**
  * session storage定义

+ 12 - 2
src/base/store/use-current-user.js

@@ -1,6 +1,6 @@
 import { defineStore } from 'pinia';
-import { login, QueyrUserInfo } from '../../apis/login';
-import { kuky_Authorization, localST_UserInfo } from '../storage';
+import { login, QueyrUserInfo, QueyrRoutesList } from '../../apis/login';
+import { kuky_Authorization, localST_UserInfo, localST_RoutesList } from '../storage';
 
 /**
  * 当前登录的用户信息
@@ -61,6 +61,16 @@ export const useCurrentUserStore = defineStore('current_user', {
       });
     },
 
+    // 获取并且存储用户路由列表
+    async getRoutesList() {
+      const {
+        code,
+        data: { routers }
+      } = await QueyrRoutesList();
+      if (code === 200) {
+        localST_RoutesList.setItem(JSON.stringify(routers));
+      }
+    },
     // 获取并且存储用户信息
     async getUserInfo() {
       const {

+ 2 - 0
src/modules/login/FormItem.vue

@@ -79,6 +79,8 @@ const handleSubmit = (data) => {
       .then((res) => {
         $message.success(res);
 
+        // 登录成功后,获取路由列表
+        userStore.getRoutesList()
         // 登录成功后,获取用户权限
         userStore.getUserInfo()
 

+ 5 - 1
src/modules/permission/TreeParts.vue

@@ -34,6 +34,10 @@ const props = defineProps({
     type: Array,
     default: () => [],
   },
+  permission: {
+    type: Object,
+    default: () => { },
+  },
   fieldNames: {
     type: Object,
     default: () => ({ label: 'label', key: 'id', children: 'children' }),
@@ -41,7 +45,7 @@ const props = defineProps({
 });
 
 const { treeData, title } = toRefs(props);
-
+const { permission: { add_permission, edit_permission, delete_permission } } = props;
 const emit = defineEmits(['nodeClick', 'onAddBtnClick', 'onDrop', 'onDeleteBtnClick']);
 const treeRef = ref(null);
 let is_lock = ref(false);

+ 5 - 3
src/modules/permission/group/index.vue

@@ -14,7 +14,7 @@
         <a-button v-hasPermi="'system:group:permissionConfig'" type="text"
           @click="handlePermissionConfig(record, true)">权限管理</a-button>
         <a-popconfirm content="确定删除该条数据吗?" type="warning" @ok="handleDelete(record.groupId)">
-          <a-button type="text" status="warning">删除</a-button>
+          <a-button v-hasPermi="'system:group:delete'" type="text" status="warning">删除</a-button>
         </a-popconfirm>
       </template>
     </DataTable>
@@ -47,7 +47,7 @@ import Modal from '../Modal.vue';
 import GroupForm from './GroupForm.vue';
 import MembertConfigModal from './MembertConfigModal.vue';
 import PermissionConfigModal from './PermissionConfigModal.vue';
-
+import { hasPermission } from '../../../utils/permission';
 import { QueryGroupList, QueryGroupUsers, SaveGroupUsers, ConfigGroupResource, GroupStatusSwitch, DeleteGroup, CreateGroup, UpdateGroup } from '../../../apis/permission/gruop';
 // TODO接口 模型tabs接口还没有
 import { QueryAllKnowledgeList, QueryAllDialogList } from '../../../apis/permission/common';
@@ -297,7 +297,9 @@ const getConfigList = async (tabsKey) => {
 }
 
 onMounted(() => {
-  getGroupList()
+  if (hasPermission('system:group:list')) {
+    getGroupList()
+  }
 })
 </script>
 

+ 11 - 5
src/modules/permission/org/index.vue

@@ -5,13 +5,14 @@
         key: 'deptId',
         title: 'deptName',
         children: 'children',
-      }" @nodeClick="onNodeClick" @addBtnClick="onAddBtnClick" @deleteBtnClick="onDeleteBtnClick" @drop="onNodeDrop" />
+      }" :permission="tree_permission_list" @nodeClick="onNodeClick" @addBtnClick="onAddBtnClick"
+        @deleteBtnClick="onDeleteBtnClick" @drop="onNodeDrop" />
     </div>
     <div class="right">
       <a-card title="详情" style="height: 100%">
         <OrgForm :org_form="org_form" @save="orgFromSave" @reset="orgFromReset">
           <template #actions>
-            <a-button @click="orgFromSave">保存</a-button>
+            <a-button v-hasPerm="'system:dept:edit'" @click="orgFromSave">保存</a-button>
             <a-button @click="orgFromReset">重置</a-button>
           </template>
         </OrgForm>
@@ -30,14 +31,17 @@ import { Message } from '@arco-design/web-vue';
 import TreeParts from '../TreeParts.vue';
 import OrgForm from './OrgForm.vue';
 import Modal from '../Modal.vue';
-
+import { hasPermission } from '../../../utils/permission';
 import { QueryDeptDetail, UpdateDept, UpdateDeptParent, CreateDept, DeleteDept } from '../../../apis/permission/org';
-
 import { QueryDeptTree } from '../../../apis/permission/common';
 
 const org_visible = ref(false);
 const is_edit_mode = ref(true);
 const org_tree_data = ref([]);
+const tree_permission_list = {
+  add_permission: 'system:dept:add',
+  delete_permission: 'system:dept:delete',
+}
 
 const org_form = reactive({
   parentName: '',
@@ -173,7 +177,9 @@ const onNodeDrop = async ({ dropNode, dragNode, dropPosition }) => {
   }
 };
 onMounted(() => {
-  getDeptTree();
+  if (hasPermission('system:dept:list')) {
+    getDeptTree();
+  }
 });
 </script>
 

+ 1 - 1
src/modules/permission/resource/ResourceForm.vue

@@ -70,7 +70,7 @@ const props = defineProps({
 const options = [
   {
     value: '3',
-    label: '目录',
+    label: '页面',
   },
   {
     value: '0',

+ 12 - 4
src/modules/permission/resource/index.vue

@@ -5,14 +5,15 @@
         key: 'menuId',
         title: 'menuName',
         children: 'children',
-      }" @nodeClick="onNodeClick" @addBtnClick="onAddBtnClick" @deleteBtnClick="onDeleteBtnClick" />
+      }" :permission="tree_permission_list" @nodeClick="onNodeClick" @addBtnClick="onAddBtnClick"
+        @deleteBtnClick="onDeleteBtnClick" />
     </div>
 
     <div class="right">
       <a-card title="详情" style="height: 100%;">
         <ResourceForm :resource_form="resource_form" @save="orgFromSave" @reset="orgFromReset">
           <template #actions>
-            <a-button @click="orgFromSave">保存</a-button>
+            <a-button v-hasPerm="'system:resource:edit'" @click="orgFromSave">保存</a-button>
             <a-button @click="orgFromReset">重置</a-button>
           </template>
         </ResourceForm>
@@ -31,7 +32,7 @@ import { Message } from '@arco-design/web-vue';
 import TreeParts from '../TreeParts.vue';
 import ResourceForm from './ResourceForm.vue';
 import Modal from '../Modal.vue';
-
+import { hasPermission } from '../../../utils/permission';
 import {
   QueryResourceTree, QueryResourceDetail, UpdateResource, CreateResource, DeleteResource
 } from '../../../apis/permission/resource';
@@ -39,6 +40,11 @@ import {
 const resourcevisible = ref(false);
 const is_edit_mode = ref(true);
 const resourcetree_data = ref([]);
+const tree_permission_list = {
+  add_permission: 'system:resource:add',
+  delete_permission: 'system:resource:delete',
+}
+
 
 const resource_form = reactive({
   parentName: '',
@@ -149,7 +155,9 @@ const orgFromCancel = () => {
   resourcevisible.value = false;
 }
 onMounted(() => {
-  getResourceTree();
+  if (hasPermission('system:resource:list')) {
+    getResourceTree();
+  }
 })
 </script>
 

+ 4 - 1
src/router.js

@@ -1,6 +1,9 @@
 import { createWebHashHistory, createRouter } from 'vue-router';
+import { localST_RoutesList } from './base/storage';
 
-import routes from './views/routes';
+import routes from './router/index.js';
+
+console.log('router', JSON.parse(localST_RoutesList.getItem()));
 
 /**
  * 配置路由方案

+ 53 - 0
src/router/index.js

@@ -0,0 +1,53 @@
+import Home from '../views/Home.vue';
+
+/**
+ * 路由表配置
+ */
+const routes = [
+  { path: '/', component: Home, redirect: '/chat/qa' },
+
+  // 登录与注册
+  { path: '/login', component: () => import('../views/Login.vue') },
+  { path: '/reg', component: () => import('../views/Register.vue') },
+
+  // 会话
+  { path: '/chat', component: () => import('../views/Conversation.vue') },
+  { path: '/chat/qa', component: () => import('../views/ConversationQA.vue') },
+  { path: '/chat/history', component: () => import('../views/ConversationHistory.vue') },
+  { path: '/chat/board', component: () => import('../views/ConversationBoard.vue') },
+
+  // 知识库
+  { path: '/knowledge', component: () => import('../views/Knowledge.vue') },
+  { path: '/knowledge/detail', component: () => import('../views/KnowledgeDetail.vue') },
+  // 模型
+  { path: '/model', component: () => import('../views/Model.vue') },
+  // Agent
+  { path: '/agent', component: () => import('../views/Agent.vue') },
+  // 智能体
+  { path: '/intelligent', component: () => import('../views/Intelligent.vue') },
+  // dify智能体详情
+  { path: '/intelligent/detail', component: () => import('../views/difyDetail.vue') },
+
+  // 权限管理
+  {
+    path: '/permission',
+    component: () => import('../views/layout/LayoutPermission.vue'),
+    children: [
+      { path: '/permission/account', component: () => import('../views/PermissionAccount.vue') },
+      { path: '/permission/org', component: () => import('../views/PermissionOrganization.vue') },
+      { path: '/permission/resource', component: () => import('../views/PermissionResource.vue') },
+      { path: '/permission/role', component: () => import('../views/PermissionRole.vue') },
+      { path: '/permission/group', component: () => import('../views/PermissionGroup.vue') }
+    ]
+  },
+
+  // 个人中心
+  { path: '/profile', component: () => import('../views/Profiles.vue') },
+  { path: '/setting', component: () => import('../views/Settings.vue') },
+
+  { path: '/xiaoshu', component: () => import('../views/Xiaoshu.vue') },
+
+  { path: '/about', component: () => import('../views/About.vue') }
+];
+
+export default routes;

+ 0 - 53
src/views/routes.js

@@ -1,53 +0,0 @@
-import Home from './Home.vue';
-
-/**
- * 路由表配置
- */
-const routes = [
-  { path: '/', component: Home, redirect: '/chat/qa' },
-
-  // 登录与注册
-  { path: '/login', component: () => import('./Login.vue') },
-  { path: '/reg', component: () => import('./Register.vue') },
-
-  // 会话
-  { path: '/chat', component: () => import('./Conversation.vue') },
-  { path: '/chat/qa', component: () => import('./ConversationQA.vue') },
-  { path: '/chat/history', component: () => import('./ConversationHistory.vue') },
-  { path: '/chat/board', component: () => import('./ConversationBoard.vue') },
-
-  // 知识库
-  { path: '/knowledge', component: () => import('./Knowledge.vue') },
-  { path: '/knowledge/detail', component: () => import('./KnowledgeDetail.vue') },
-  // 模型
-  { path: '/model', component: () => import('./Model.vue') },
-  // Agent
-  { path: '/agent', component: () => import('./Agent.vue') },
-  // 智能体
-  { path: '/intelligent', component: () => import('./Intelligent.vue') },
-  // dify智能体详情
-  { path: '/intelligent/detail', component: () => import('./difyDetail.vue') },
-
-  // 权限管理
-  {
-    path: '/permission',
-    component: () => import('./layout/LayoutPermission.vue'),
-    children: [
-      { path: '/permission/account', component: () => import('./PermissionAccount.vue') },
-      { path: '/permission/org', component: () => import('./PermissionOrganization.vue') },
-      { path: '/permission/resource', component: () => import('./PermissionResource.vue') },
-      { path: '/permission/role', component: () => import('./PermissionRole.vue') },
-      { path: '/permission/group', component: () => import('./PermissionGroup.vue') }
-    ]
-  },
-
-  // 个人中心
-  { path: '/profile', component: () => import('./Profiles.vue') },
-  { path: '/setting', component: () => import('./Settings.vue') },
-
-  { path: '/xiaoshu', component: () => import('./Xiaoshu.vue') },
-
-  { path: '/about', component: () => import('./About.vue') }
-];
-
-export default routes;