init

vue-frontend/src/utils/auth.js

@@ -0,0 +1,70 @@
+import { getRoleIdFromToken, isTokenValid } from './jwt'
+
+/**
+ * 权限工具类
+ */
+
+/**
+ * 获取当前用户的token
+ * @returns {string|null} token
+ */
+export function getToken() {
+  return localStorage.getItem('token')
+}
+
+/**
+ * 获取当前用户的角色ID
+ * @returns {number|null} 角色ID
+ */
+export function getCurrentUserRoleId() {
+  const token = getToken()
+  if (!token || !isTokenValid(token)) {
+    return null
+  }
+  return getRoleIdFromToken(token)
+}
+
+/**
+ * 判断当前用户是否是管理员
+ * @returns {boolean} 是否是管理员
+ */
+export function isAdmin() {
+  const roleId = getCurrentUserRoleId()
+  return roleId === 0
+}
+
+/**
+ * 判断当前用户是否有指定角色
+ * @param {number} targetRoleId 目标角色ID
+ * @returns {boolean} 是否有指定角色
+ */
+export function hasRole(targetRoleId) {
+  const roleId = getCurrentUserRoleId()
+  return roleId === targetRoleId
+}
+
+/**
+ * 判断当前用户是否已登录且token有效
+ * @returns {boolean} 是否已登录
+ */
+export function isLoggedIn() {
+  const token = getToken()
+  return token && isTokenValid(token)
+}
+
+/**
+ * 权限检查装饰器函数
+ * @param {Function} fn 要执行的函数
+ * @param {string} errorMsg 权限不足时的错误提示
+ * @returns {Function} 包装后的函数
+ */
+export function requireAdmin(fn, errorMsg = '权限不足，仅管理员可操作') {
+  return function(...args) {
+    if (!isAdmin()) {
+      // 可以在这里集成消息提示组件
+      console.warn(errorMsg)
+      return false
+    }
+    return fn.apply(this, args)
+  }
+} 

vue-frontend/src/utils/jwt.js

@@ -0,0 +1,105 @@
+/**
+ * JWT工具类 - 前端版本
+ */
+
+/**
+ * 从JWT Token中获取payload
+ * @param {string} token JWT Token
+ * @returns {object|null} payload数据
+ */
+function getPayloadFromToken(token) {
+  try {
+    if (!token) return null;
+    
+    const parts = token.split('.');
+    if (parts.length !== 3) return null;
+    
+    const encodedPayload = parts[1];
+    const decodedPayload = atob(encodedPayload);
+    return JSON.parse(decodedPayload);
+  } catch (error) {
+    return null;
+  }
+}
+
+/**
+ * 从JWT Token中获取用户ID
+ * @param {string} token JWT Token
+ * @returns {number|null} 用户ID
+ */
+export function getUserIdFromToken(token) {
+  const payload = getPayloadFromToken(token);
+  return payload ? parseInt(payload.sub) : null;
+}
+
+/**
+ * 从JWT Token中获取用户角色ID
+ * @param {string} token JWT Token
+ * @returns {number|null} 角色ID
+ */
+export function getRoleIdFromToken(token) {
+  const payload = getPayloadFromToken(token);
+  return payload ? payload.role_id : null;
+}
+
+/**
+ * 从JWT Token中获取用户名
+ * @param {string} token JWT Token
+ * @returns {string|null} 用户名
+ */
+export function getUsernameFromToken(token) {
+  const payload = getPayloadFromToken(token);
+  return payload ? payload.user : null;
+}
+
+/**
+ * 验证token是否过期
+ * @param {string} token JWT Token
+ * @returns {boolean} 是否有效
+ */
+export function isTokenValid(token) {
+  const payload = getPayloadFromToken(token);
+  if (!payload) return false;
+  
+  const now = Math.floor(Date.now() / 1000);
+  return payload.exp > now;
+}
+
+// JwtUtil对象，提供便捷的静态方法调用
+export const JwtUtil = {
+  /**
+   * 从localStorage获取token并解析用户ID
+   * @returns {number|null} 用户ID
+   */
+  getUserIdFromToken() {
+    const token = localStorage.getItem('token');
+    return getUserIdFromToken(token);
+  },
+  
+  /**
+   * 从localStorage获取token并解析角色ID
+   * @returns {number|null} 角色ID
+   */
+  getRoleIdFromToken() {
+    const token = localStorage.getItem('token');
+    return getRoleIdFromToken(token);
+  },
+  
+  /**
+   * 从localStorage获取token并解析用户名
+   * @returns {string|null} 用户名
+   */
+  getUsernameFromToken() {
+    const token = localStorage.getItem('token');
+    return getUsernameFromToken(token);
+  },
+  
+  /**
+   * 验证localStorage中的token是否有效
+   * @returns {boolean} 是否有效
+   */
+  isTokenValid() {
+    const token = localStorage.getItem('token');
+    return isTokenValid(token);
+  }
+};