HiMind 工业互联网平台

Appearance

开发规范（UI/UE） ​

应用规范 ​

List模式画面 ​

意图：多记录显示、操作需求。

应用场景：

1． 通用的操作画面，有简单的查询条件，列表（Grid）中显示查询结果。

2． PopForm弹出对话框。

  • 画面样例一（上下型）：

画面分层三个区域：查询条件区、多记录区、功能按钮区

基本功能要求：

  • 查询：根据条件，多记录查询，在List区中列出查询结果；

  • 删除：表格中提供“选择”栏，对选择的信息项做删除操作。

  • 新增、修改：需要批量输入数据，根据不同应用要求，提供不同的操作模式，规定如下，

1.当信息项少于10项，或内容不复杂时，可直接在Grid（表格）中进行数据的输入、修改；

2.当信息项少于10项，多条记录一次性新增时，使用Grid右键菜单或左下角新增（+）按钮，新增记录行，并输入数据；

3.当信息项多于10项，Grid操作繁琐（类型复杂）时，增加输入区、对话框（PopForm）或跳转 到Detail模式画面（参见4.2节），使用不同类型控件，进行数据的输入、修改。其中，数据项少于20个，使用输入区；数据项少于50个，使用对话框；数据项多于50个且输入复杂时，使用跳转到Detail模式画面，在该画面中新增、修改操作。

建议：以PopForm进行新增时，提供“是否继续新增”功能。

扩展功能：

  • 其他：主要指业务功能，如：计划下达、收池等，类似删除功能，对选择的记录做后台逻辑处理，不需要在Grid中输入或修改大量数据项，使用本风格模式。

  • 画面样例二（左右型）：

功能要求及规范同样例一。

Detail模式画面 ​

意图：单记录显示、信息维护需求。

应用场景：

1． 针对一条记录的信息明细，使用多种控件显示、输入、更新。

2． 不使用List（列表）模式的画面，有简单的查询条件，列出查询明细。

3． 信息项有类别区分。

如：实绩查询

  • 画面样例一

画面分层三个区域：条件区、信息展示区、功能按钮区

基本功能要求：

  1. 查询：单记录查询，查询；

  2. 删除：根据条件区，删除主键记录；

  3. 修改：除主键外，所有的信息项都可修改；

  4. 新增：主键是必输项，其他数据项可根据业务要求，做新增校验；

该模式画面的强项是对数据信息的维护（CURD）。

Master-Detail模式画面 ​

意图：对于信息结构复杂（有父子关系，信息级联，或信息量大），画面需要展示父子（Master-Detail）关系信息结构，便于清晰理解信息和内容。

应用场景：

  1. 具有父子信息结构，且关心指定的主体信息，附带相关子信息项。有简单的查询条件。

  2. 具有信息级联关系，有明确的Master，从其他表中带出相关明细（Detail），如统计、状态等。

  3. 对同一级信息量大，展现主要信息后，在明细区展示其他信息，结构化划分区域。如：炉次实绩关联工序、作业、成分等其他明细信息。

如： 合同跟踪，出厂计划

  • 画面样例一：

基本功能要求：

1．查询：不设置查询条件，以弹出PopForm的查询画面，进行主记录的选择，将主记录主键信息调出。

2．其他：例如审核、提交等，需要对该信息内容进行全部了解确认后，再做相应功能操作。

3．新增：该功能对信息结构较为复杂的应用最适合，一般分2处输入：

Step1，直接在Master区录入数据；

Step2，提供PopForm子画面，录入Detail信息，暂存在客户端数据结构中，按确定后，写入数据库。对于多笔明细录入，提供“是否继续新增”功能进行操作。

4．修改：除主键外，所有的信息项都可修改。

List-Detail模式画面 ​

意图：相对Master-Detail关系结构中，只能查看一条主信息模式，List-Detail是能列举多笔主记录（List Master）信息，通过选择不同的主记录，在Detail中显示相应的明细信息（Detail）。便于快速查询多条信息和内容。

应用场景：

对Master进行有条件的范围搜索，列出多笔符合条件的Master信息。在List中列出；选择某一Mast 信息，再列出其明细信息。

如：实绩查询

  • 画面样例一：

基本功能要求：

1．查询：List-Detail模式的画面，适合于一览查询；通过条件项设置，查询相关信息。

2．其他：例如审核、提交、删除等，需要对多笔信息内容进行了解，批量做相应功能操作。

扩展功能：

  1. 翻页查询：涉及List模式，必然有记录数量范围的需求，通过Grid的翻页功能，控制查询数量，保证系统的性能。具体翻页功能参看；

建议：

该模式画面适用于查询、选择操作，不使用于新增、修改操作。对于新增、修改请转入使用Detail、Master-Detail模式画面。

List-List模式画面 ​

意图：与List-Detail模式相似，但区别在于List-List中，针对特定应用只允许显示父子信息中的部分，而不是全部，其到检索和快速信息掌握要求。

应用场景：

如同命令查询、材料命令形成等功能画面，关心特定部分信息，不关心明细信息。Master区和Detail 区内的List只列出用户关心的信息项。List的列不易过多。选择某一Master信息，子List中列出其明细信息。

  • 画面样例一：

基本功能要求：

1．查询：List-List模式的画面，适合于一览查询；通过条件项设置，查询相关信息。Master区有分页查询功能。

2．其他：例如审核、提交、删除等，需要对多笔信息内容进行了解，批量做相应功能操作。

扩展功能：

  1. 翻页查询：涉及List模式，必然有记录数量范围的需求，通过Grid的翻页功能，控制查询数量，保证系统的性能。具体翻页功能参看（4.1节）；

操作规范 ​

表格中的记录选择 ​

表格控件（Grid）中，如对某信息项进行明确的选择时，Grid中提供“选择”栏供选择操作。如果对表格中的记录只进行查询、顺序调整、统计汇总等非明确选择要求的，可以不提供“选择”栏。

注：Grid中的选择能提供批量选择和取消（即全选、全不选）；分组选择。

单步操作与两步操作 ​

单步操作，是指画面功能按钮，点击一次完成功能的操作模式。如：查询，简单的新增、修改、删除等。

两步操作，是指重要功能按钮，需要有确认、取消步的操作模式。具体的例如：合同计划下达，点击 “下达”按钮后，并没用真正计划下达，点击“确定”按钮才正式下达，点击“取消”按钮撤销下达。

对两步操作，使用单步操作定义，弹出确认对话框，进行“确定”操作。

注：

  • 两步操作中，有Pre_Do的准备工作，该方法内只允许对Grid的可编辑功能属性等进行操作，不允许对画面信息做修改操作。

翻页查询操作 ​

DevExpress中提供了分页查询的操作按钮（Grid的左下角功能Bar），在3.0版的画面功能中，都使用Grid的分页操作，不允许在功能按钮（Fn）中定义Grid的上翻、下翻操作。

Grid的分页信息，按如下标准提示方式显示：

“第m/M页，共n条记录”（m-是当前第几页，从1计数；M-总页数；n是表中的总记录数）

对画面中非List方式显示信息，有上一条记录、下一条记录的操作要求，则定义在Fn功能按钮中，或 其它操作方式。

画面跳转操作 ​

跳转时，使用双击方式，禁止使用单击；最好有按钮功能列出。

每次都新打开一个画面，会存在重复打开画面

A->B；或重复A->B

C->B；

需求不一样，允许打开多次，但要在打开源头控制。

子画面弹出 ​

PopForm默认大小：600 * 350；

表格功能 ​

  • 新增、修改行风格设定

设置gridview的RowStyle事件 ，调用EFFormED模板中提供的GridView辅助方法：

SetGridViewRowStyle(GridView gridView, DevExpress.XtraGrid.Views.Grid.RowStyleEventArgs e)

示例：

csharp
private void gridView1_RowStyle(object sender, DevExpress.XtraGrid.Views.Grid.RowStyleEventArgs e)
{
base.SetGridViewRowStyle(gridView1, e);
}
  • 可编辑列风格设定

（编制中……）

  • 表格行删除

  1. 查询的上翻、下翻操作：（）

  2. 查询条件较复杂的，用PopForm；小代码（信息内容20个内）用下拉。

  • 拖拽移动（顺序调整）

多次拖拽，所有行顺序调整完毕后，必须点击“确定”或顺序保存之类的按钮，统一提交至数据库。

注：Grid能提供单记录、多记录拖拽；分Grid内和不同Grid间拖拽功能。

  • 表格右键功能

（编制中……）

  • 表格公用模板

  1. 新增、修改操作后，记录的高亮显示（底色变色）。

  2. “选择”列作为默认项，显示并操作。 并提供单选、多选的控制。

选择数量的判断：使用DataSet 功能。

  1. 固定列（冻结）的选择功能。

  2. 对大字体需求：画面字体的大小可以修改。

  • Master-Detail

  1. 导出：master-Detail

  2. 导入：禁止使用

  • List-Detail

  1. 翻页功能，有条件使用（数据量多，一览、查询画面下使用）

  2. 分组、过滤功能：

  3. 导出功能

  4. 自定义显示列，及恢复。

布局规范 ​

  • 此处Layout指Dev控件下的LayoutControl。

  • 每个画面需要有一个LAYOUT控件，LAYOUT控件必须拖拉后与FORM底部的按钮条一起充满整个FORM。然后LAYOUT控件需进行四面锚定。LAYOUT控件不能将DOCK设置为FILL。

  • 在LAYOUT中进行画面的分区。每个分区必须有一个PANEL控件，并设置EFPANEL属性为FILL。每个分区应提供收放按钮。（有相关属性进行设定）

  • 除PANEL外，其他控件一律放在PANEL控件中。

  • 如需在运行时候进行分区大小拖动的，必须放入LAYOUT控件中的Splitter进行控制

设计规范 ​

界面功能显示 ​

画面中有不同的功能区域，尤其使用GroupControl控件时必须有明确的说明，如：查询条件，基本信息、 计划信息、材料信息等。不允许GroupControl中没有提示信息。

画面中任何一个操作动作，都应有相应的反应，包括：数据更新、记录变化、功能处理结果（成功或 错误），错误信息等。其中最重要的是，画面能够提供哪些功能，尤其是业务功能，必须有对应的明确的功 能按钮。严禁对必要的功能做隐藏、合并。如：EPESOBJ画面按钮注册维护画面，只提供“F3维护模式”，

所有的画面、按钮的增删改操作，都集中在该按钮下，该模式在MES业务画面中必须禁止。

操作信息提示 ​

  • 报错信息显示

报错信息，主要是指后台Service返回信息与画面的校验后提示信息。

在Service中返回报错信息是通过抛出异常的方式，代码如下（C#）：

csharp
throw new Exception(ErrorInfo);
  • MsgBox提示信息

保证系统提示信息准确、清晰、醒目，重要信息采用MsgBox来提示。

MsgBox的标题（caption）统一采用 MsgBoxInfo，提示信息分为以下4类。

a） 警告类

csharp
MsgBox.Show("确认要删除订单 XXXXXX 吗？", MsgBoxInfo,

MessageBoxButtons.OKCancel, MessageBoxIcon.Warning);

图1

b） 问题类

csharp
MsgBox.Show("是否要保存更改？", MsgBoxInfo,

MessageBoxButtons.YesNo, MessageBoxIcon.Question);

图2

c） 提示类

csharp
MsgBox.Show("新增成功。", MsgBoxInfo, MessageBoxButtons.OK,MessageBoxIcon.Information);

重要业务，例如评审及审核等，成功后都要有如上提示！

d） 错误类

csharp
MsgBox.Show("具体的出错信息", MsgBoxInfo, MessageBoxButtons.OK,MessageBoxIcon.Error);

画面排版规范 ​

画面的布局必须整齐、工整。有操作区域定义的，如GroupControl、Tab、Grid，必须撑满画面，不能留有较大的空白区。

控件的Margin属性设置规范

  • 单记录排列

标题：右对齐；

值：字符左对齐，数字右对齐。

  • 多记录排列

标题：居中；

值：字符左对齐，数字右对齐。

  • 查询条件区

需加GroupControl，而且GroupControl要与下面的Tab区对齐。

  • 功能键名称

维护功能键统一命名为查询、新增、修改、删除、存盘。

  • 弹出画面

采用框架提供的弹出画面模板，画面上的按钮大小统一按模板（74*23），位置靠右，依次为“查询”、“确认”、“取消”。

输入数据项的标识 ​

新增或修改需输入的数据项（包括通过双击弹出子画面的数据项），其标题左侧统一加标注半角的“*”，

例如：“*品名”，而不采用变换颜色的方式。

多记录区中的关键字可复制 ​

多记录区（Grid）中的关键字（如订单号、材料号、计划号）不能编辑时，应采用ReadOnly属性，而不是AllowEdit属性，以便该数据可复制。

HiMind 工业互联网平台 技术文档

© 2026 版权所有 红河谷 && 红谷软件