feat: 添加登录功能与文章编辑功能

refactor: 重构API服务与全局状态管理

style: 优化UI样式与布局

fix: 修复文章列表与详情页的显示问题

docs: 更新类型定义与注释

chore: 更新依赖包与配置文件

src/services/apiService.js

@@ -1,46 +1,75 @@
-// 基础 API 服务配置
+// 基础API服务
 import axios from 'axios'
+import { ElMessage } from 'element-plus'
 
-// 创建 axios 实例
-const apiService = axios.create({
-  baseURL: 'http://localhost:8080/api', // api的base_url
-  timeout: 10000, // 请求超时时间
-  headers: {
-    'Content-Type': 'application/json'
-  }
+// 创建axios实例
+const api = axios.create({
+  baseURL:'http://localhost:8080/api', // API基础URL
+  timeout: 10000 // 请求超时时间
 })
 
-// 请求拦截器 - 添加认证token
-apiService.interceptors.request.use(
+// 请求拦截器
+api.interceptors.request.use(
   config => {
+    // 从localStorage获取token
     const token = localStorage.getItem('token')
     if (token) {
-      config.headers.Authorization = `Bearer ${token}`
+      // 设置Authorization头
+      config.headers['Authorization'] = `Bearer ${token}`
     }
     return config
   },
   error => {
+    // 请求错误处理
+    console.error('请求错误:', error)
     return Promise.reject(error)
   }
 )
 
-// 响应拦截器 - 统一处理响应
-apiService.interceptors.response.use(
+// 响应拦截器
+api.interceptors.response.use(
   response => {
-    // 检查响应是否成功
-    if (response.data && response.data.success) {
-      return response.data
-    } else {
-      // 处理业务错误
-      return Promise.reject(new Error(response.data?.message || '请求失败'))
-    }
+    // 直接返回响应数据
+    return response.data
   },
   error => {
-    // 处理HTTP错误
-    console.error('API请求错误:', error)
-    // 可以在这里添加全局错误处理，如显示错误提示
+    // 错误处理
+    console.error('响应错误:', error)
+    
+    let message = '请求失败'
+    
+    if (error.response) {
+      // 服务器响应了但状态码不是2xx
+      switch (error.response.status) {
+        case 401:
+          message = '未授权，请重新登录'
+          // 可以在这里处理登出逻辑
+          localStorage.removeItem('token')
+          // 跳转到登录页
+          window.location.href = '/login'
+          break
+        case 403:
+          message = '拒绝访问'
+          break
+        case 404:
+          message = '请求资源不存在'
+          break
+        case 500:
+          message = '服务器错误'
+          break
+        default:
+          message = error.response.data?.message || message
+      }
+    } else if (error.request) {
+      // 请求已发出但没有收到响应
+      message = '网络错误，请检查网络连接'
+    }
+    
+    // 使用Element Plus的消息组件显示错误信息
+    ElMessage.error(message)
+    
     return Promise.reject(error)
   }
 )
 
-export default apiService
+export default api