金蝶云星辰典型页面-详情页原创
金蝶云社区-李秉宸
李秉宸
1人赞赏了该文章 218次浏览 未经作者许可,禁止转载编辑于2023年04月10日 14:16:16

定义

详情页是用于向用户展示一个对象(组织、人、事、物等)完整信息的载体,也可以认为是表单录入的结果呈现。主要用于信息浏览,可进行审批、打印、导出等简单操作。

允许用户对对象进行部分编辑或创建子对象,进入全局编辑的模式。


根据详情页应用场景分为以下2类:

image.pngimage.png


设计目标

提高信息浏览和搜寻效率,便捷执行操作。


设计原则

突出关键,在众多信息中选择用户在当前场景下更关注的信息,进行汇总展示。

聚合信息,在特定场景中,将对象的关联信息集合展示,提升用户获取信息的效率。


布局结构

详情是基于动态页面的平面布局。除了应用导航、全局页签外,动态页面还包含以下区域:

1、工具栏操作区域:

用于放置操作按钮,常见的有保存 、审核、打印、选源单、翻页等操作。按钮根据重要程度及操作频次从左到右排序,视觉样式上仅有一个突出的主按钮,其他均为次级按钮样式。


2、关键信息概览区域:(按需配置)

提供对象的关键信息概览,便于快速了解大致信息,快速决策。符合人们了解事物由总到分的心智。


3、内容区域:

显示对象的详细信息

可以是一个内容卡片容器呈现,也可以是多个内容卡片呈现。

可以是对象的单一数据录入来源的呈现,也可以是对象相关的多数据录入来源的呈现。


image.png


分类及用法

基础详情

1、当用户需要查看对象的详细信息时

2、当信息仅需单层级呈现时


特点:

1、录入信息的最直接呈现,与录入差异最小。

2、可将不同类型的信息用折叠面板分开呈现。


image.png
image.pngimage.pngimage.pngimage.pngimage.png


横向页签详情

1、当进行单据上下游联查时,显示关联单据或列表


特点:

1、当同一类型单据有多张时,显示列表;当同一类型单据只有一张时,直接显示单据详情



image.png


image.pngimage.png


内容区域信息展示与录入状态的转换关系

联动控制内容

通过单选/复选/开关的联动控制的内容,且不可再编辑时,仅显示已选项对应的内容,其余选项及操作按钮隐藏不显示


image.png

image.png





赞 1