接口权限配置

src/services/axios.ts

@@ -1,4 +1,6 @@
 import axios from 'axios'
+import { ElNotification } from 'element-plus'
+import router from '@/router/index'
 
 const API_BASE_URL = '/api'
 
@@ -13,11 +15,73 @@ const apiClient = axios.create({
 
 // Response interceptor to handle errors
 apiClient.interceptors.response.use(
-  (response) => response.data,
+  (response) => {
+    const config = response.config
+    const { code, message } = response.data
+    if (code === 200 || config.responseType === 'blob') {
+      return response.data
+    }
+    if (code != 0 && !code) {
+      return response.data
+    }
+    if (code === 401) {
+      Notification_error({
+        title: '未登录',
+        message: message,
+      })
+      router.push({
+        path: '/login',
+      })
+      return Promise.reject(response.data)
+    }
+    if (code === 402 || code === 201) {
+      Notification_error({
+        title: '权限不足',
+        message: message,
+      })
+      return Promise.reject(response.data)
+    }
+    if (code == 806) {
+      Notification_error({
+        title: '账号未启用',
+        message: message,
+      })
+      return Promise.reject(response.data)
+    }
+    Notification_error({
+      title: '请求错误',
+      message: message,
+    })
+    return Promise.reject(response.data)
+  },
   (error) => {
     console.error('API Error:', error)
+    if (error.response.status == 404) {
+      Notification_error({
+        title: '接口不存在',
+        message: error.response.data.message,
+      })
+    } else {
+      Notification_error({
+        title: '系统错误',
+        message: error.response.data.message,
+      })
+    }
     return Promise.reject(error)
   },
 )
 
+const Notification_error = (obj: any) => {
+  const title = obj.title
+  let message = obj.message
+  if (!message || message.length > 35) {
+    message = '系统错误'
+  }
+  ElNotification({
+    title: title,
+    message: message,
+    type: 'error',
+  })
+}
+
 export default apiClient

src/services/permission.ts

@@ -53,4 +53,17 @@ export const permissionApi = {
       throw error
     }
   },
+  /**
+   * 退出登录
+   */
+  adminLogout: async (): Promise<unknown> => {
+    try {
+      const url = `/permission/api/admin/logout`
+      const response = await apiClient.post<unknown>(url)
+      return response
+    } catch (error) {
+      console.error('退出登录失败:', error)
+      throw error
+    }
+  },
 }

src/utils/permissions.ts

@@ -8,7 +8,6 @@ export default {
       return true
     }
     const permissionList = [...permissionStore.permissionList]
-    console.log(permissionList, sign)
     if (!permissionList) {
       return false
     }

src/views/index/index.vue

@@ -8,7 +8,6 @@ import { useRouter } from 'vue-router'
 const router = useRouter()
 
 onMounted(() => {
-  console.log(1)
   router.push({
     name: 'Login',
   })

src/views/layout/index.vue

@@ -4,6 +4,18 @@
       <el-header>
         <div class="header-content">
           <h1>资讯管理系统</h1>
+          <el-dropdown class="user panel-item" trigger="click" @command="handleCommand">
+            <div class="user-avatar">
+              <el-avatar :size="30" :src="avatar_img"></el-avatar>
+              <label>{{ userinfo.name }}</label>
+              <el-icon class="el-icon--right"><arrow-down /></el-icon>
+            </div>
+            <template #dropdown>
+              <el-dropdown-menu>
+                <el-dropdown-item command="doLogout">退出登录</el-dropdown-item>
+              </el-dropdown-menu>
+            </template>
+          </el-dropdown>
         </div>
       </el-header>
 
@@ -22,9 +34,37 @@
 
 <script setup lang="ts">
 import { ref } from 'vue'
+import { ElMessage } from 'element-plus'
+import { ArrowDown } from '@element-plus/icons-vue'
+import cookie from 'js-cookie'
+import { permissionApi } from '@/services/permission'
 import Sidebar from '@/components/Sidebar.vue'
+import { storeToRefs } from 'pinia'
+import { userPermission } from '@/stores/permission'
+const permission = userPermission()
+const { userinfo } = storeToRefs(permission)
 
 const isCollapse = ref(false)
+
+import avatar_image from '@/assets/user-avatar.jpeg'
+const avatar_img = avatar_image
+
+import { useRouter } from 'vue-router'
+const router = useRouter()
+
+const handleCommand = async (command: string | number | object) => {
+  switch (command) {
+    case 'doLogout':
+      const response = await permissionApi.adminLogout()
+      if (response.code == 200) {
+        cookie.remove('token')
+        router.push({ path: '/login' })
+      } else {
+        ElMessage.error('退出失败')
+      }
+      break
+  }
+}
 </script>
 
 <style scoped>
@@ -49,6 +89,7 @@ const isCollapse = ref(false)
 .header-content {
   display: flex;
   align-items: center;
+  justify-content: space-between;
   height: 100%;
   padding: 0 20px;
 }
@@ -58,6 +99,23 @@ const isCollapse = ref(false)
   font-size: 20px;
   font-weight: 600;
 }
+.header-content .user label {
+  color: #fff;
+}
+
+.user-avatar {
+  height: 49px;
+  display: flex;
+  align-items: center;
+}
+
+.user-avatar label {
+  display: inline-block;
+  margin-left: 5px;
+  font-size: 12px;
+  cursor: pointer;
+  color: #383838;
+}
 
 .el-aside {
   background-color: #ffffff;

vite.config.ts

@@ -13,18 +13,28 @@ export default defineConfig({
     },
   },
   server: {
+    host: '192.168.2.114',
+    port: 3000,
     proxy: {
-      '/fileManager': {
+      '/api/fileManager': {
         target: 'http://192.168.2.24:8803',
         ws: true,
         changeOrigin: true,
         rewrite: (path) => path.replace(/^\/api/, ''),
       },
-      '/api': {
+      '/api/xiaoshi/ppa': {
         target: 'http://192.168.2.107:8099',
         changeOrigin: true,
         // rewrite: (path) => path.replace(/^\/api/, ''),
       },
+      '/api/permission': {
+        target: 'http://192.168.2.24:8871',
+        // target: 'http://192.168.2.109:8880',
+        // target: 'http://47.116.194.135:8880',
+        ws: true,
+        changeOrigin: true,
+        rewrite: (path) => path.replace(/^\/api/, ''),
+      },
     },
   },
 })