概述
在以往的系统开发过程中,多对多的界面展示有多种形式,且风格各异。本文将按照自己的理解,对多对多的界面展示给予记录。希望能对日后系统有一些参考。
正文
以常用的学生和课程为例子。数据库表以及主要字段展示如下:
- 学生信息。主要属性:姓名、住址、联系电话等。
- 课程信息。主要属性:课程名称、出版社、是否必修等。
- 学生-课程中间表。主要属性:学生id、课程id等。
界面
学生信息列表界面
学生和课程是多对多(m:n)的关系。即,一位学生可以选多门课程,一门课程可以被多位学生选中。学生界面如下:
常用的增加、更改、删除不做太多解释。重点解释批量绑定课程。“批量绑定课程”,选左侧按钮选中一位或者多位学生,批量给这些学生绑定多门课程,最终的数据保存在“学生-课程中间表”中。示意图如下:
课程信息列表界面
课程界面如下:
重点解释批量绑定学生。“批量绑定学生”,选中左侧按钮,勾选一门或者多门课程,给这些课程批量绑定学生,最终的数据保存在“学生-课程中间表”中。示意图如下:
结语
这样的“双向绑定”模式,不仅增加了界面的操作的便捷性和直观性,更符合软件工程中描述的“易用性”要求。
当然,这里描述的比较简单,主要是针对m:n的界面优化展示的思想。在实际项目中,还需要更加完善的代码和界面展示。其他多对多的情况也可参照,比如权限设计的多对多,文件权限的多对多绑定等,可以推而广之。
下面这个前辈,给出了代码层面的相关建议和展示。
推荐阅读
【2022年9月】