人机交互系统实验二 图形用户界面的设计

• 实验目的和要求

1) 熟悉图形用户界面的设计原则

2) 利用一种设计工具完成图形化的用户界面设计

• 实验环境

Windows10 Vite Vue Html Css JavaScript Java SpringBoot axios Mysql

• 实验内容与过程

利用常用的设计工具(VC/VB/Delphi/PB 等)完成一个通用图形用户界面设计，要遵循界面

设计的一般原则(一致性、快捷方式、提供错误处理)，注意颜色的使用，学会使用图标、按钮、

屏幕布局、菜单和对话框的设计。

1．设计多个对话框，完成填表输入界面的设计，合理使用图标、按钮、颜色；

2．设计不同形式的菜单，完成对不同对话框的调用；

3．提供简单的错误处理、联机帮助

下面是使用Vue实现的云医院界面

(1)病例首页

1. 门诊医生点击导航栏的“病历首页”，对”患者查看“页面选择的患者病例进行填写。页面顶部会显示医生选择的患者基本信息。

2.门诊医生根据询问患者，在病历首页中填写：主诉、现病史、现病治疗情况、既往史、过敏史、体格检查；

3. 门诊医生进行初步诊断，选择患者疾病；

4.门诊医生填写检查\检验建议；

5.门诊医生填写完成后，点击保存完成患者病例首页的填写；

(2)挂号页面

1. 挂号收费员点击“窗口挂号”菜单；

2. 系统进入现场挂号页面，自动生成“病历号”；

3. 系统默认显示“看诊日期”为当前日期，午别为当前午别，该信息不可修改；

4. 挂号收费员询问患者挂号级别、挂号科室；

5. 挂号收费员根据患者要求，选择对应的“挂号级别”、“挂号科室”；

6. 系统根据挂号级别显示挂号费；

7. 系统根据挂号级别、挂号科室，读取相应科室、相应挂号级别、当前日期、当前午别的出诊医生；

8. 挂号收费员询问患者是否选择挂号医生；

9. 挂号收费员根据患者要求，选择对应的“医生”；

10. 挂号收费员录入患者基本信息，包括：患者姓名、性别、出生日期、年龄、结算类别、身份证号、家庭住址、是否要病历本；

11. 挂号收费员在录入信息完毕后，单击“挂号”按钮，完成患者挂号；

(3)检查申请

1. 门诊医生点击“检查申请”

2. 系统进入检查申请页面，在病历首页页面部分，显示该患者基本信息；

3. 门诊医生点击新增项目；

4. 系统弹出新增检查项目页面列表，页面包括检查编码、检查名称、检查规格、单价，门诊医生可以按检查编码和检查名称执行查询；

5. 门诊医生在查询结果中，选中要新增的检查项目前面的复选框，所有项目选中之后，点击“添加”按钮；

6. 系统在检查申请页面，填入医生已经选择的项目；

7. 门诊医生输入检查目的要求、检查部位、备注等；

8. 门诊医生点击“申请提交”；