用flask+vue实现RBAC权限管理系统后台，创建对应的用户角色权限数据结构，不同角色对页面不同权限的显示控制等

实现一个基于 Flask 和 Vue 的 RBAC 权限管理系统后台，需要设计一个用户角色权限数据结构，用于存储用户信息、角色信息、权限信息以及角色和权限的关联信息。下面给出一个简单的数据结构：

# 用户信息
class User(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    username = db.Column(db.String(64), unique=True)
    password_hash = db.Column(db.String(128))
    role_id = db.Column(db.Integer, db.ForeignKey('role.id'))

# 角色信息
class Role(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    name = db.Column(db.String(64), unique=True)
    description = db.Column(db.String(128))
    permissions = db.relationship('Permission', secondary='role_permission', backref=db.backref('roles', lazy='dynamic'))

# 权限信息
class Permission(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    name = db.Column(db.String(64), unique=True)
    description = db.Column(db.String(128))

# 角色和权限的关联信息
class RolePermission(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    role_id = db.Column(db.Integer, db.ForeignKey('role.id'))
    permission_id = db.Column(db.Integer, db.ForeignKey('permission.id'))

在这个数据结构中，每个用户只能拥有一个角色，每个角色可以包含多个权限。接下来，需要在后台实现权限控制的逻辑。例如：在页面请求时，判断当前用户是否具有访问该页面的权限，如果没有权限，则返回错误信息；如果有权限，则返回页面数据。可以通过 Flask 中的装饰器实现权限控制逻辑：

from functools import wraps
from flask import abort
from flask_login import current_user

def permission_required(permission):
    def decorator(f):
        @wraps(f)
        def decorated_function(*args, **kwargs):
            if not current_user.can(permission):
                abort(403)
            return f(*args, **kwargs)
        return decorated_function
    return decorator

这个装饰器接受一个权限参数，表示需要具有该权限才能访问页面，如果用户没有该权限，就返回 403 错误。

在前端页面中，可以通过 Vue 的路由拦截器实现权限控制的逻辑。例如：在页面请求时，判断当前用户是否具有访问该页面的权限，如果没有权限，则跳转到错误页面；如果有权限，则显示页面内容。可以通过 Vue 中的路由拦截器实现权限控制逻辑：

router.beforeEach((to, from, next) => {
    if (to.meta.permissions && !checkPermission(to.meta.permissions)) {
        next({ path: '/error', replace: true });
    } else {
        next();
    }
})

function checkPermission(permissions) {
    var role = JSON.parse(localStorage.getItem('user')).role;
    var rolePermissions = role.permissions.map(p => p.name);
    return permissions.every(p => rolePermissions.includes(p));
}

这个路由拦截器接受一个权限参数，表示需要具有该权限才能访问页面，如果用户没有该权限，就跳转到错误页面。可以通过在用户登录时，将用户信息存储在本地缓存中，然后在路由拦截器中获取用户信息，判断用户是否具有该权限。