1. 新增角色功能的表单基本交互
1.1 给新增角色按钮绑定点击事件 展示弹框
1.2 点击确定按钮前 进行表单验证
1.3 通过表单验证后 调用添加功能的函数
- 重新加载数据
- 关闭弹框
1.4 点击取消按钮 关闭弹框 清空表单内容
添加数据后 查询页面需要跳转到最后一页
- 如果最后一页是满的 通过子传父 通知父组件页码数+1
2. 编辑角色
2.1 点击编辑按钮
- 给编辑按钮绑定点击事件
- 显示弹框
- 把当前数据赋给表单 实现数据回填
由于this.roleForm和row指向同一个对象 在编辑时 表格中的数据也会跟着变 通过展开运算符解决浅拷贝问题
2.2 点击确定保存数据 (编辑和新增共用一个弹窗 需要通过一个数据项来区分)
- 设置数据项 通过isEdit的值判断是否是编辑
- 通过兜底校验 选择调用编辑还是新增功能的函数
- 调用更新接口实现