新增用户页面更新以及调整

This commit is contained in:
dxc
2026-02-04 15:16:14 +08:00
parent c1e08062f2
commit ea17413bc1
5 changed files with 281 additions and 72 deletions

View File

@ -19,12 +19,6 @@ def login():
# 调用 Service 层逻辑
result = AuthService.login(data)
# [关键修复]
# 前端 store 代码写的是: token.value = res.data.access_token
# 所以我们这里不能把 access_token 包裹在 data 字段里,
# 而是应该直接合并返回,或者让前端去 data.data 里面取。
# 为了不改前端,我们这里做解构返回:
response_data = {
'msg': '登录成功',
'access_token': result.get('access_token'),
@ -34,34 +28,51 @@ def login():
return jsonify(response_data), 200
except ValueError as ve:
# 捕获已知的业务错误(如密码错误、用户不存在)
return jsonify({'msg': str(ve)}), 401
except Exception as e:
# [关键修复] 打印详细报错到控制台,方便排查 500 错误
# (例如数据库连接失败、表不存在等)
current_app.logger.error(f"Login Failed Error: {str(e)}")
# 生产环境不建议直接把 error 返回给前端,但调试阶段很有用
return jsonify({'msg': f'服务器内部错误: {str(e)}'}), 500
# 新增:创建用户 (替代了原来的注册)
@auth_bp.route('/user/create', methods=['POST'])
@jwt_required() # 必须携带 Token
@jwt_required()
def create_user():
try:
data = request.get_json()
# 从 Token 中获取当前操作人的角色
claims = get_jwt()
operator_role = claims.get('role')
# 增加一个简单的权限判断(可选)
if operator_role not in ['super_admin', 'supervisor']:
return jsonify({'msg': '权限不足,无法创建用户'}), 403
result = AuthService.create_user(data, operator_role)
return jsonify({'msg': '用户创建成功', 'data': result}), 201
except Exception as e:
current_app.logger.error(f"User Create Failed: {str(e)}")
return jsonify({'msg': str(e)}), 400
# [新增] 获取用户列表
@auth_bp.route('/users', methods=['GET'])
@jwt_required()
def get_users():
try:
# 这里可以添加分页逻辑,目前先返回所有
users = AuthService.get_all_users()
return jsonify({'msg': '获取成功', 'data': users}), 200
except Exception as e:
current_app.logger.error(f"Get Users Failed: {str(e)}")
return jsonify({'msg': '获取用户列表失败'}), 500
# [新增] 删除用户
@auth_bp.route('/user/<int:user_id>', methods=['DELETE'])
@jwt_required()
def delete_user(user_id):
try:
claims = get_jwt()
operator_role = claims.get('role')
AuthService.delete_user(user_id, operator_role)
return jsonify({'msg': '删除成功'}), 200
except Exception as e:
current_app.logger.error(f"Delete User Failed: {str(e)}")
return jsonify({'msg': str(e)}), 400

View File

@ -8,11 +8,13 @@ class SysUser(db.Model):
id = db.Column(db.Integer, primary_key=True)
username = db.Column(db.String(100), nullable=False)
# 注意:如果允许邮箱为空,建议去掉 unique=True 或者在数据库层面处理空字符串
email = db.Column(db.String(100), unique=True)
department = db.Column(db.String(100))
role = db.Column(db.String(50))
status = db.Column(db.String(20), default='active')
password_hash = db.Column(db.Text)
created_at = db.Column(db.DateTime, default=datetime.now) # 新增创建时间
def set_password(self, password):
"""生成加密密码"""
@ -30,7 +32,8 @@ class SysUser(db.Model):
'email': self.email,
'department': self.department,
'role': self.role,
'status': self.status
'status': self.status,
'created_at': self.created_at.strftime('%Y-%m-%d %H:%M:%S') if self.created_at else ''
}
class SysLog(db.Model):

View File

@ -1,8 +1,7 @@
# app/services/auth_service.py
from app.models.system import SysUser
from app.extensions import db
from flask_jwt_extended import create_access_token, get_jwt_identity, get_jwt
from werkzeug.security import check_password_hash
from flask_jwt_extended import create_access_token
from app.utils.constants import UserRole
@ -46,8 +45,7 @@ class AuthService:
user_id = user.id
user_info = user.to_dict()
# 3. 生成 Token,将角色写入 claims (关键步骤:用于后期权限控制)
# identity 存 IDadditional_claims 存角色
# 3. 生成 Token
access_token = create_access_token(
identity=user_id,
additional_claims={'role': user_role, 'username': username}
@ -62,8 +60,6 @@ class AuthService:
def create_user(data, operator_role):
"""
创建新用户 (仅限管理员使用)
:param data: 新用户数据
:param operator_role: 当前操作人的角色 (从 Token 获取)
"""
# 简单权限控制:只有超级管理员或主管可以创建用户
if operator_role not in [UserRole.SUPER_ADMIN, UserRole.SUPERVISOR]:
@ -75,14 +71,18 @@ class AuthService:
# 默认角色处理
role = data.get('role')
# 验证角色是否合法
valid_roles = [v for k, v in UserRole.__dict__.items() if not k.startswith('__')]
if role not in valid_roles:
raise Exception(f"角色无效,可选角色: {valid_roles}")
# 处理 Email 为空的情况,避免违反 Unique 约束 (视数据库设置而定,这里简单处理为空串)
email = data.get('email', '')
if email and SysUser.query.filter_by(email=email).first():
raise Exception("邮箱已被使用")
new_user = SysUser(
username=data.get('username'),
email=data.get('email', ''), # 允许为空
email=email,
department=data.get('department', ''),
role=role,
status='active'
@ -92,4 +92,24 @@ class AuthService:
db.session.add(new_user)
db.session.commit()
return new_user.to_dict()
return new_user.to_dict()
@staticmethod
def get_all_users():
"""获取所有系统用户"""
users = SysUser.query.order_by(SysUser.id.desc()).all()
return [user.to_dict() for user in users]
@staticmethod
def delete_user(user_id, operator_role):
"""删除用户"""
if operator_role not in [UserRole.SUPER_ADMIN, UserRole.SUPERVISOR]:
raise Exception("权限不足")
user = SysUser.query.get(user_id)
if not user:
raise Exception("用户不存在")
db.session.delete(user)
db.session.commit()
return True

View File

@ -1,31 +1,43 @@
import request from '@/utils/request'
// 登录 (兼容 IRIS 超级管理员和普通用户)
// 登录
export function login(data: any) {
return request({
// 【修改】去掉开头的 /api因为 request.ts 的 baseURL 已经包含了 /api
// 最终请求地址会自动拼接为:/api/v1/auth/login
url: '/v1/auth/login',
method: 'post',
data
})
}
// 创建用户 (管理员专用接口)
// 创建用户 (管理员专用)
export function createUser(data: any) {
return request({
// 【修改】去掉开头的 /api
url: '/v1/auth/user/create',
method: 'post',
data
})
}
// 获取用户信息 (用于页面刷新后拉取最新权限)
// 获取当前登录用户信息
export function getUserInfo() {
return request({
// 【修改】去掉开头的 /api
url: '/v1/auth/me',
method: 'get'
})
}
// [新增] 获取所有用户列表
export function getUserList() {
return request({
url: '/v1/auth/users',
method: 'get'
})
}
// [新增] 删除用户
export function deleteUser(id: number) {
return request({
url: `/v1/auth/user/${id}`,
method: 'delete'
})
}

View File

@ -3,67 +3,139 @@
<el-card>
<template #header>
<div class="card-header">
<span>新增员工账号</span>
<span style="font-weight: bold;">员工账号管理</span>
<el-button type="primary" @click="handleCreate">
+ 新增员工
</el-button>
</div>
</template>
<el-table
v-loading="tableLoading"
:data="tableData"
border
style="width: 100%"
>
<el-table-column prop="username" label="用户名" width="150" />
<el-table-column prop="department" label="所属部门" width="150">
<template #default="scope">
<el-tag>{{ scope.row.department }}</el-tag>
</template>
</el-table-column>
<el-table-column prop="role" label="系统角色" width="180">
<template #default="scope">
{{ formatRole(scope.row.role) }}
</template>
</el-table-column>
<el-table-column prop="email" label="邮箱" min-width="200" />
<el-table-column prop="created_at" label="创建时间" width="180">
<template #default="scope">
{{ formatDate(scope.row.created_at) }}
</template>
</el-table-column>
<el-table-column label="操作" width="150" fixed="right">
<template #default="scope">
<el-popconfirm
title="确定要删除该用户吗?此操作无法撤销。"
@confirm="handleDelete(scope.row)"
>
<template #reference>
<el-button link type="danger" size="small">删除</el-button>
</template>
</el-popconfirm>
</template>
</el-table-column>
</el-table>
</el-card>
<el-dialog
v-model="dialogVisible"
title="新增员工账号"
width="500px"
@close="resetForm"
>
<el-form
ref="formRef"
:model="form"
:rules="rules"
label-width="100px"
style="max-width: 600px"
>
<el-form-item label="用户名" prop="username">
<el-input v-model="form.username" placeholder="登录账号 (英文)" />
</el-form-item>
<el-form-item label="初始密码" prop="password">
<el-input v-model="form.password" type="password" show-password placeholder="设置初始密码" />
<el-input
v-model="form.password"
type="password"
show-password
placeholder="设置初始密码"
/>
</el-form-item>
<el-form-item label="所属部门" prop="department">
<el-select v-model="form.department" placeholder="请选择部门" style="width: 100%">
<el-option label="总经办" value="Management" />
<el-option label="财务部" value="Finance" />
<el-option label="仓储部" value="Warehouse" />
<el-option label="采购部" value="Procurement" />
<el-option label="销售部" value="Sales" />
<el-select
v-model="form.department"
placeholder="请输入或选择部门"
style="width: 100%"
filterable
allow-create
default-first-option
>
<el-option
v-for="item in departmentOptions"
:key="item"
:label="item"
:value="item"
/>
</el-select>
</el-form-item>
<el-form-item label="系统角色" prop="role">
<el-select v-model="form.role" placeholder="授予权限" style="width: 100%">
<el-option label="主管 (Supervisor)" value="supervisor" />
<el-option label="财务 (Finance)" value="finance" />
<el-option label="库管 (Warehouse Mgr)" value="warehouse_manager" />
<el-option label="入库员 (Inbound)" value="inbound" />
<el-option label="出库员 (Outbound)" value="outbound" />
<el-option label="采购员 (Purchaser)" value="purchaser" />
<el-option label="销售 (Sales)" value="sales" />
<el-option label="主管" value="supervisor" />
<el-option label="财务" value="finance" />
<el-option label="库管" value="warehouse_manager" />
<el-option label="入库员" value="inbound" />
<el-option label="出库员" value="outbound" />
<el-option label="采购员" value="purchaser" />
<el-option label="销售" value="sales" />
</el-select>
<div class="form-tip">注意超级管理员无法通过此界面创建请联系开发人员</div>
</el-form-item>
<el-form-item label="邮箱" prop="email">
<el-input v-model="form.email" placeholder="可选填" />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit" :loading="loading">创建账号</el-button>
<el-button @click="resetForm">重置</el-button>
</el-form-item>
</el-form>
</el-card>
<template #footer>
<div class="dialog-footer">
<el-button @click="dialogVisible = false">取消</el-button>
<el-button type="primary" @click="onSubmit" :loading="submitLoading">
确认创建
</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup lang="ts">
import { reactive, ref } from 'vue'
import { createUser } from '@/api/auth'
import { reactive, ref, onMounted } from 'vue'
import { createUser, getUserList, deleteUser } from '@/api/auth'
import { ElMessage } from 'element-plus'
const loading = ref(false)
// --- 状态定义 ---
const tableLoading = ref(false)
const submitLoading = ref(false)
const dialogVisible = ref(false)
const tableData = ref<any[]>([])
const departmentOptions = ref<string[]>([]) // 部门下拉选项
const formRef = ref()
const form = reactive({
@ -76,43 +148,134 @@ const form = reactive({
const rules = {
username: [{ required: true, message: '请输入用户名', trigger: 'blur' }],
password: [{ required: true, message: '请输入密码', trigger: 'blur' }, { min: 6, message: '密码至少6位', trigger: 'blur' }],
password: [
{ required: true, message: '请输入密码', trigger: 'blur' },
{ min: 6, message: '密码至少6位', trigger: 'blur' }
],
role: [{ required: true, message: '请选择角色', trigger: 'change' }],
department: [{ required: true, message: '请选择部门', trigger: 'change' }]
department: [{ required: true, message: '请输入或选择部门', trigger: ['blur', 'change'] }]
}
// --- 逻辑方法 ---
// 1. 获取用户列表
const getList = async () => {
tableLoading.value = true
try {
const res = await getUserList()
tableData.value = res.data || []
// 获取数据后,提取已有的部门作为选项
extractDepartments(tableData.value)
} catch (error) {
console.error('Fetch users failed:', error)
} finally {
tableLoading.value = false
}
}
// 【关键修改】提取部门:没有任何预设值,完全依赖数据库
const extractDepartments = (data: any[]) => {
// 1. 创建一个空的 Set不放任何默认值
const deptSet = new Set<string>()
// 2. 遍历数据库返回的数据,收集已有的部门
if (data && data.length > 0) {
data.forEach(user => {
// 只有当部门字段不为空时才添加
if (user.department && user.department.trim() !== '') {
deptSet.add(user.department)
}
})
}
// 3. 转为数组供下拉框使用
departmentOptions.value = Array.from(deptSet)
}
// 2. 打开新增弹窗
const handleCreate = () => {
dialogVisible.value = true
}
// 3. 提交创建
const onSubmit = async () => {
if (!formRef.value) return
await formRef.value.validate(async (valid: boolean) => {
if (valid) {
loading.value = true
submitLoading.value = true
try {
await createUser(form)
ElMessage.success(`用户 ${form.username} 创建成功!`)
resetForm()
dialogVisible.value = false // 关闭弹窗
getList() // 刷新列表,如果你刚才输入了新部门,刷新后它就会出现在下拉框里
} catch (error) {
// 错误已被拦截器处理
// 错误已处理
} finally {
loading.value = false
submitLoading.value = false
}
}
})
}
// 4. 重置表单
const resetForm = () => {
if (!formRef.value) return
formRef.value.resetFields()
}
// 5. 删除用户
const handleDelete = async (row: any) => {
try {
await deleteUser(row.id)
ElMessage.success('删除成功')
getList()
} catch (error) {
// 错误处理
}
}
// --- 辅助显示方法 ---
const formatDate = (dateStr: string) => {
if (!dateStr) return '-'
return dateStr.replace('T', ' ').substring(0, 19)
}
// 角色保留翻译(因为后端通常存英文代码 code
const formatRole = (val: string) => {
const map: Record<string, string> = {
'supervisor': '主管',
'finance': '财务',
'warehouse_manager': '库管',
'inbound': '入库员',
'outbound': '出库员',
'purchaser': '采购员',
'sales': '销售',
'super_admin': '超级管理员'
}
return map[val] || val
}
// --- 初始化 ---
onMounted(() => {
getList()
})
</script>
<style scoped>
.app-container {
padding: 20px;
}
.form-tip {
font-size: 12px;
color: #e6a23c;
line-height: 1.5;
margin-top: 5px;
.card-header {
display: flex;
justify-content: space-between;
align-items: center;
}
.dialog-footer {
text-align: right;
margin-top: 20px;
}
</style>