Sfoglia il codice sorgente

feat: 新增基础菜单权限控制

cuiyalong 10 mesi fa
parent
commit
3da51c21b0
4 ha cambiato i file con 77 aggiunte e 36 eliminazioni
  1. 29 18
      frontend/src/App.vue
  2. 1 0
      frontend/src/data/index.js
  3. 13 0
      frontend/src/data/user.js
  4. 34 18
      frontend/src/store/index.js

+ 29 - 18
frontend/src/App.vue

@@ -1,6 +1,6 @@
 <template>
   <el-container style="height: 100vh;">
-    <el-aside :width="sidebarWidth" style="background-color: #333;overflow: hidden;  ">
+    <el-aside :width="sidebarWidth" style="background-color: #333;overflow: hidden;">
       <div class="sidebar-header" @click="toggleSidebar">
         <el-icon :size="20" color="#fff">
           <Fold v-if="!isCollapse" />
@@ -15,28 +15,26 @@
         text-color="#fff"
         router
         active-text-color="#ffd04b">
-        <el-menu-item index="/code/list">
-          <el-icon><Guide /></el-icon>
-          <span slot="title">爬虫列表</span>
-        </el-menu-item>
-        <el-menu-item index="/audit/list">
-          <el-icon><Setting /></el-icon>
-          <span slot="title">审核列表</span> 
-        </el-menu-item>
-        <el-menu-item index="/setting">
-          <el-icon><Setting /></el-icon>
-          <span slot="title">系统设置</span> 
-        </el-menu-item>
-        <el-menu-item index="/logout">
-          <el-icon><SwitchButton /></el-icon>
-          <span slot="title">退出</span> 
+        <el-menu-item v-for="menu in menuList" :key="menu.path" :index="menu.path" :default-active="activeIndex">
+          <el-icon><component :is="menu.icon" style="width:20px;height:20px;" /></el-icon>
+          <span slot="title">{{ menu.title }}</span>
         </el-menu-item>
       </el-menu>
     </el-aside>
     
     <el-container>
       <el-header class="header-container">
-        <h3 class="header-content"><el-icon class="header-icon"><Guide /></el-icon>剑鱼可视化爬虫开发平台 v1.0</h3>
+        <el-row>
+          <el-col :span="14">
+            <h3 class="header-content"><el-icon class="header-icon"><Guide /></el-icon>剑鱼可视化爬虫开发平台 v1.0</h3>
+          </el-col>
+          <el-col :span="10" style="padding:15px;text-align: right;" v-if="showLogoutModule">
+            <span>当前用户: {{ userName }} / {{ userRole }} &nbsp;</span>
+            <el-button type="danger" @click="doLogout"><el-icon>
+              <SwitchButton />
+            </el-icon></el-button>
+          </el-col>
+        </el-row>
       </el-header>
       <el-main>
         <router-view></router-view>
@@ -46,7 +44,12 @@
 </template>
 
 <script setup>
-import { ref } from 'vue';
+import { computed, ref } from 'vue';
+import { useStore } from 'vuex';
+import { useRouter } from 'vue-router';
+
+const store = useStore()
+const router = useRouter()
 
 const isCollapse = ref(false);
 const activeIndex = ref('/');
@@ -57,6 +60,14 @@ function toggleSidebar() {
   sidebarWidth.value = isCollapse.value ? '70px' : '160px';
 }
 toggleSidebar()
+
+const menuList = computed(() => store.getters.getCurrentMenu)
+const userName = computed(() => store.state.userInfo.s_name)
+const userRole = computed(() => store.getters.userRole)
+const showLogoutModule = computed(() => store.state.isAuthenticated)
+const doLogout = () => {
+  router.replace({ name: 'logout' })
+}
 </script>
 
 <style>

+ 1 - 0
frontend/src/data/index.js

@@ -0,0 +1 @@
+export * from './user'

+ 13 - 0
frontend/src/data/user.js

@@ -0,0 +1,13 @@
+// 管理员
+export const USER_ROLE_ADMIN = 'admin'
+// 开发
+export const USER_ROLE_DEVELOPER = 'developer'
+// 审核人员
+export const USER_ROLE_REVIEWER = 'reviewer'
+
+// 角色身份,1开发,2审核,3管理
+export const USER_ROLE_AUTH_MAP = {
+    1: USER_ROLE_DEVELOPER,
+    2: USER_ROLE_REVIEWER,
+    3: USER_ROLE_ADMIN,
+}

+ 34 - 18
frontend/src/store/index.js

@@ -1,33 +1,43 @@
 // src/store/index.js
 import { createStore } from 'vuex';
-import { House, Setting, Help } from '@element-plus/icons-vue';
 import { ServerActionUserLogin, ServerActionCheckLogin, ServerActionUserLogout } from '../../wailsjs/go/main/App'
 import rulesList from './modules/rulesList'
-
-const iconComponents = {
-  house: House,
-  setting: Setting,
-  help: Help,
-};
+import { USER_ROLE_AUTH_MAP, USER_ROLE_REVIEWER, USER_ROLE_DEVELOPER, USER_ROLE_ADMIN } from '../data/index'
 
 export default createStore({
     state: {
         isAuthenticated: false,
-        userInfo: {},
+        userInfo: {
+            // i_auth: 1, // 角色身份,1开发,2审核,3管理
+            // i_identity: 1,
+            // i_scope: -1,
+            // ids: null,
+            // s_email: 'liuyifan@topnet.net.cn',
+            // s_fullname: '刘一帆',
+            // s_name: 'lyf',
+            // _id: '5cbd57e9a9c3320223906553',
+        },
         profile: {
             nickname: '',
         },
         menuConfig: {
-            admin: [
-                { title: '首页', icon: iconComponents.house, path: '/' },
-                { title: '设置', icon: iconComponents.setting, path: '/setting' },
-                { title: '帮助', icon: iconComponents.help, path: '/help' },
-                // 更多管理员菜单项
+            // 管理员菜单
+            [USER_ROLE_ADMIN]: [
+                { title: '爬虫列表', icon: 'Guide', path: '/code/list' },
+                { title: '审核列表', icon: 'Setting', path: '/audit/list' },
+                { title: '系统设置', icon: 'Help', path: '/setting' },
+            ],
+            // 开发者菜单
+            [USER_ROLE_DEVELOPER]: [
+                { title: '爬虫列表', icon: 'Guide', path: '/code/list' },
+                { title: '审核列表', icon: 'Setting', path: '/audit/list' },
+                { title: '系统设置', icon: 'Help', path: '/setting' },
             ],
-            user: [
-                { title: '首页', icon: iconComponents.house, path: '/' },
-                { title: '帮助', icon: iconComponents.help, path: '/help' },
-                // 更多普通用户菜单项
+            // 审核人员菜单
+            [USER_ROLE_REVIEWER]: [
+                { title: '爬虫列表', icon: 'Guide', path: '/code/list' },
+                { title: '审核列表', icon: 'Setting', path: '/audit/list' },
+                { title: '系统设置', icon: 'Help', path: '/setting' },
             ],
         },
     },
@@ -35,7 +45,7 @@ export default createStore({
         SET_AUTHENTICATED(state, payload) {
             state.isAuthenticated = payload;
         },
-        SET_USER_INFO(state, payload) {
+        SET_USER_INFO(state, payload = {}) {
             state.userInfo = payload;
         },
     },
@@ -85,12 +95,18 @@ export default createStore({
         async logout({ commit }) {
             await ServerActionUserLogout()
             commit('SET_AUTHENTICATED', false);
+            commit('SET_USER_INFO', {});
             return true
         },
     },
     getters: {
         // 定义一个 Getter 来获取当前登录用户的信息
         getCurrentUser: (state) => state.userInfo,
+        // 角色身份,1开发,2审核,3管理
+        userRole: (state) => USER_ROLE_AUTH_MAP[state.userInfo?.i_auth],
+        getCurrentMenu: (state, getters) => {
+            return state.menuConfig[getters.userRole] || []
+        } 
     },
     modules: {
         rulesList