"feat: 1-实现动态层级树形库位管理功能

2 - 首页新增库位设置按钮和树形管理弹窗
     3 - 后端添加 SysWarehouseLocation 模型和 CRUD API
     4 - 树形结构支持无限层级,自动计算 full_path
     5 - 修复 product.vue 中 defaultColumns 未定义 bug
This commit is contained in:
dxc
2026-03-06 14:33:13 +08:00
parent cc26f91b50
commit 359b8a8345
4 changed files with 272 additions and 5 deletions

View File

@ -130,6 +130,19 @@ def create_app():
except ImportError as e: except ImportError as e:
print(f"❌ 错误: Permission 模块导入失败 (请检查 app/api/v1/permission.py 是否存在): {e}") print(f"❌ 错误: Permission 模块导入失败 (请检查 app/api/v1/permission.py 是否存在): {e}")
# -----------------------------------------------------
# 2.8 注册库位管理模块 (Warehouse)
# -----------------------------------------------------
try:
from app.api.v1.warehouse import warehouse_bp
# 标准: /api/v1/warehouse/tree
app.register_blueprint(warehouse_bp, url_prefix='/api/v1/warehouse')
# 兼容: /api/warehouse/tree
app.register_blueprint(warehouse_bp, url_prefix='/api/warehouse', name='warehouse_legacy')
print("✅ Warehouse 模块注册成功")
except ImportError as e:
print(f"❌ 错误: Warehouse 模块导入失败: {e}")
# ========================================================= # =========================================================
# 3. 预加载数据模型 # 3. 预加载数据模型
# ========================================================= # =========================================================
@ -145,7 +158,7 @@ def create_app():
from app.models.outbound import TransOutbound from app.models.outbound import TransOutbound
# 系统与业务模型 (SysRolePermission 等在 models.system 中) # 系统与业务模型 (SysRolePermission 等在 models.system 中)
from app.models.system import SysUser, SysLog, SysMenu, SysElement, SysRolePermission from app.models.system import SysUser, SysLog, SysMenu, SysElement, SysRolePermission, SysWarehouseLocation
# 确保借还模型被加载 # 确保借还模型被加载
from app.models.transaction import TransBorrow, TransRepair, TransScrap from app.models.transaction import TransBorrow, TransRepair, TransScrap

View File

@ -149,3 +149,38 @@ class SysRolePermission(db.Model):
role_code = db.Column(db.String(50), nullable=False) role_code = db.Column(db.String(50), nullable=False)
target_code = db.Column(db.String(100), nullable=False) # menu_code 或 element_code target_code = db.Column(db.String(100), nullable=False) # menu_code 或 element_code
type = db.Column(db.String(20), nullable=False) # 'menu' 或 'element' type = db.Column(db.String(20), nullable=False) # 'menu' 或 'element'
# ==========================================
# 4. 库位管理模型
# ==========================================
class SysWarehouseLocation(db.Model):
"""
库位字典表(支持无限层级树形结构)
对应数据库: sys_warehouse_location
"""
__tablename__ = 'sys_warehouse_location'
id = db.Column(db.Integer, primary_key=True)
parent_id = db.Column(db.Integer, db.ForeignKey('sys_warehouse_location.id'), nullable=True)
name = db.Column(db.String(100), nullable=False)
full_path = db.Column(db.String(500)) # 完整路径,如 "A区/货架1/第3层"
level = db.Column(db.Integer, default=0) # 层级深度顶级为0
is_enabled = db.Column(db.Boolean, default=True)
created_at = db.Column(db.DateTime, default=datetime.now)
updated_at = db.Column(db.DateTime, default=datetime.now, onupdate=datetime.now)
# 自关联
children = db.relationship('SysWarehouseLocation', backref=db.backref('parent', remote_side=[id]), lazy='dynamic')
def to_dict(self):
return {
'id': self.id,
'parent_id': self.parent_id,
'name': self.name,
'full_path': self.full_path,
'level': self.level,
'is_enabled': self.is_enabled,
'created_at': self.created_at.isoformat() if self.created_at else None,
'updated_at': self.updated_at.isoformat() if self.updated_at else None
}

View File

@ -5,6 +5,9 @@
<div class="card-header"> <div class="card-header">
<span class="title">👋 欢迎回来{{ userStore.username }}</span> <span class="title">👋 欢迎回来{{ userStore.username }}</span>
<div style="display: flex; align-items: center; gap: 10px;"> <div style="display: flex; align-items: center; gap: 10px;">
<el-button type="primary" plain size="small" @click="openWarehouseDialog" :icon="Location" class="warehouse-btn">
库位设置
</el-button>
<el-tag type="success">系统运行正常</el-tag> <el-tag type="success">系统运行正常</el-tag>
<el-button type="info" plain size="small" @click="openPrinterDialog" :icon="Setting" class="printer-btn"> <el-button type="info" plain size="small" @click="openPrinterDialog" :icon="Setting" class="printer-btn">
打印设置 打印设置
@ -36,6 +39,7 @@
</div> </div>
</el-card> </el-card>
<!-- 打印机配置弹窗 -->
<el-dialog v-model="printerDialogVisible" title="打印机 IP 配置" width="500px"> <el-dialog v-model="printerDialogVisible" title="打印机 IP 配置" width="500px">
<el-form :model="printerForm" label-width="120px"> <el-form :model="printerForm" label-width="120px">
<el-form-item label="标签打印机 IP"> <el-form-item label="标签打印机 IP">
@ -59,6 +63,63 @@
</template> </template>
</el-dialog> </el-dialog>
<!-- 库位管理弹窗 -->
<el-dialog v-model="warehouseDialogVisible" title="库位管理" width="700px" :close-on-click-modal="false">
<div class="warehouse-dialog">
<div class="warehouse-header">
<el-button type="primary" @click="handleAddTopLevel" :icon="Plus">
新增顶级区域
</el-button>
</div>
<el-scrollbar height="450px">
<el-tree
ref="treeRef"
:data="treeData"
node-key="id"
:props="treeProps"
:expand-on-click-node="false"
:default-expand-all="true"
>
<template #default="{ node, data }">
<div class="tree-node">
<span class="node-label">{{ node.label }}</span>
<span class="node-actions">
<el-button type="primary" link size="small" @click="handleAddChild(data)" :icon="Plus">
新增下级
</el-button>
<el-button type="warning" link size="small" @click="handleEdit(data)" :icon="Edit">
编辑
</el-button>
<el-button type="danger" link size="small" @click="handleDelete(data)" :icon="Delete">
删除
</el-button>
</span>
</div>
</template>
</el-tree>
</el-scrollbar>
</div>
</el-dialog>
<!-- 新增/编辑库位弹窗 -->
<el-dialog v-model="locationFormVisible" :title="locationFormTitle" width="400px">
<el-form :model="locationForm" label-width="80px">
<el-form-item label="上级库位">
<el-input :value="locationForm.parentName" disabled />
</el-form-item>
<el-form-item label="名称" required>
<el-input v-model="locationForm.name" placeholder="请输入库位名称" />
</el-form-item>
<el-form-item label="启用状态">
<el-switch v-model="locationForm.is_enabled" />
</el-form-item>
</el-form>
<template #footer>
<el-button @click="locationFormVisible = false">取消</el-button>
<el-button type="primary" @click="saveLocation" :loading="locationLoading">保存</el-button>
</template>
</el-dialog>
</div> </div>
</template> </template>
@ -68,9 +129,10 @@ import { useRouter } from 'vue-router'
// 1. 引入 User Store // 1. 引入 User Store
import { useUserStore } from '@/stores/user' import { useUserStore } from '@/stores/user'
// 引入需要的图标 // 引入需要的图标
import { Box, TrendCharts, ShoppingCart, Operation, Setting } from '@element-plus/icons-vue' import { Box, TrendCharts, ShoppingCart, Operation, Setting, Location, Plus, Edit, Delete } from '@element-plus/icons-vue'
import { getPrinterConfig, updatePrinterConfig } from '@/api/common/print' import { getPrinterConfig, updatePrinterConfig } from '@/api/common/print'
import { ElMessage } from 'element-plus' import { ElMessage, ElMessageBox } from 'element-plus'
import { getWarehouseTree, createWarehouse, updateWarehouse, deleteWarehouse } from '@/api/common/warehouse'
const router = useRouter() const router = useRouter()
// 2. 实例化 store // 2. 实例化 store
@ -132,6 +194,141 @@ const savePrinterConfig = async () => {
} }
} }
// ==================== 库位管理相关 ====================
const warehouseDialogVisible = ref(false)
const treeRef = ref()
const treeData = ref<any[]>([])
const treeProps = {
label: 'name',
children: 'children'
}
// 库位表单
const locationFormVisible = ref(false)
const locationFormTitle = ref('')
const locationForm = reactive({
id: undefined as number | undefined,
parent_id: null as number | null,
parentName: '无(顶级)',
name: '',
is_enabled: true
})
const locationLoading = ref(false)
// 打开库位管理弹窗
const openWarehouseDialog = async () => {
await loadWarehouseTree()
warehouseDialogVisible.value = true
}
// 加载库位树
const loadWarehouseTree = async () => {
try {
const res = await getWarehouseTree()
if (res.code === 200) {
treeData.value = res.data || []
}
} catch (e) {
console.error(e)
}
}
// 新增顶级区域
const handleAddTopLevel = () => {
locationForm.id = undefined
locationForm.parent_id = null
locationForm.parentName = '无(顶级)'
locationForm.name = ''
locationForm.is_enabled = true
locationFormTitle.value = '新增顶级库位'
locationFormVisible.value = true
}
// 新增下级
const handleAddChild = (data: any) => {
locationForm.id = undefined
locationForm.parent_id = data.id
locationForm.parentName = data.full_path || data.name
locationForm.name = ''
locationForm.is_enabled = true
locationFormTitle.value = `新增下级库位:${data.name}`
locationFormVisible.value = true
}
// 编辑
const handleEdit = (data: any) => {
locationForm.id = data.id
locationForm.parent_id = data.parent_id
locationForm.parentName = data.parent_id ? data.parent_full_path || '无(顶级)' : '无(顶级)'
locationForm.name = data.name
locationForm.is_enabled = data.is_enabled
locationFormTitle.value = `编辑库位:${data.name}`
locationFormVisible.value = true
}
// 删除
const handleDelete = async (data: any) => {
try {
await ElMessageBox.confirm(
`确定要删除库位「${data.name}」吗?${data.children && data.children.length > 0 ? '该操作将同时删除所有子库位。' : ''}`,
'警告',
{ type: 'warning', confirmButtonText: '确定', cancelButtonText: '取消' }
)
const res = await deleteWarehouse(data.id)
if (res.code === 200) {
ElMessage.success('删除成功')
await loadWarehouseTree()
} else {
ElMessage.error(res.msg || '删除失败')
}
} catch (e) {
// 用户取消
}
}
// 保存库位
const saveLocation = async () => {
if (!locationForm.name.trim()) {
ElMessage.warning('请输入库位名称')
return
}
try {
locationLoading.value = true
const payload: any = {
name: locationForm.name.trim(),
is_enabled: locationForm.is_enabled
}
if (locationForm.parent_id) {
payload.parent_id = locationForm.parent_id
}
let res
if (locationForm.id) {
// 编辑
payload.id = locationForm.id
res = await updateWarehouse(payload)
} else {
// 新增
res = await createWarehouse(payload)
}
if (res.code === 200) {
ElMessage.success('保存成功')
locationFormVisible.value = false
await loadWarehouseTree()
} else {
ElMessage.error(res.msg || '保存失败')
}
} catch (e) {
ElMessage.error('请求异常')
} finally {
locationLoading.value = false
}
}
// 统一跳转函数 // 统一跳转函数
const handleNav = (path: string) => { const handleNav = (path: string) => {
router.push(path) router.push(path)
@ -197,4 +394,26 @@ const handleNav = (path: string) => {
transform: translateY(-2px); transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
} }
/* 库位管理弹窗样式 */
.warehouse-dialog {
padding: 10px 0;
}
.warehouse-header {
margin-bottom: 15px;
}
.tree-node {
flex: 1;
display: flex;
align-items: center;
justify-content: space-between;
padding-right: 10px;
}
.node-label {
font-size: 14px;
}
.node-actions {
display: flex;
gap: 5px;
}
</style> </style>

View File

@ -716,7 +716,7 @@ const initColumnPermissions = () => {
} }
// 如果没有保存的配置,使用默认列 // 如果没有保存的配置,使用默认列
visibleColumnProps.value = defaultColumns visibleColumnProps.value = defaultVisibleCols
} }
// 检查列权限(移除权限限制,始终返回 true // 检查列权限(移除权限限制,始终返回 true