只记录自己不熟的,不适合他人查阅!!
使用组件化和选项卡tabs标签页实现基础信息设置

在页面布局的时候 <template>标签下先放一个<div> 之后再在此<div>标签中进行页面的绘制 一定要先写一个<div>标签 ,这样好构图
职位管理 PosMana.vue
查询 在mounted() 中调用查询
键盘中Enter事件 @keydown.enter.native = "addPosition" 回车键按下时候调用addPosition
添加完职位后 再调用查询接口刷新页面,同时要清空输入框中的内容
编辑职位 Dialog对话框 :visible.sync = "dialogVisible" 类型为Boolean
批量删除 @selection-change = "handleSelectionChange" 当checkbooks没有任何一个被选中时,批量删除按钮为禁用状态
职称管理 Job'L'e'velManager.vue
职称等级使用select选择器
是否启用 使用自定义模板<template> 模板里面用<el-tag>
CRUD都和职位管理类似
在编辑的弹框中用到<table> 和 <el-switch>
权限组
后端用的Spring Security 角色必须是 Rule_ 开头 所以前端的input要做处理
使用在class中使用 css中 display:flex 就会使元素变成一行
Collapse折叠面板 构建页面 <el-collapse>
Card卡片 <el-card>
Tree树形控件 <el-tree> 默认选中 :default-checked-keys setCheckedKeys属性
部门管理
使用树形控件 <el-tree> :expand-on-click-node 控制点击位置 当为false时,只有点击三角箭头才能展开 默认为true
添加或删除节点后,注意父节点的变化;添加时 子节点下添加了子节点 则子节的变成父节点了;删除时 父节点下的父节点都被删除了 父节点变成子节点;这时要注意 添加和删除节点都没有重新调用接口,即数据中的属性要在前端去修改一下,才不会有bug;如果重新调用了一下接口,则树形控件就会被收起来
操作员管理
使用了Card卡片 在每个卡片中查看管理员具有的权限时,用到Popover弹出框
|