编程技术

　　新创建的表单界面，系统默认使用栅格化(一行两列)布局,控件的宽度会随外部容器自动按相同比例弹性伸缩填满整行，非常适用于弹出窗口形式的表单界面使用．当然您也可以修改目标控件的布局样式，以达到您满意的效果，如将控件都设置成"栅格化(占1/3行)"，就可以一行放置三个输入控件了，如图所示：

特别注意：一般情况下，我们建议您1行最多放2个控件(即栅格化1/2行,或者整行显示), 因为大多数情况下，表单界面的调用，是由列表界面中某（添加／修改）按钮点击，并以弹窗方式打开显示的，弹窗界面宽度不宜设置太大，能更好适应不同用户电脑屏幕分辩率，此时若一行上面放置太多控件，会导致控件长度比例变小影响用户输入。另外，部分极少数输入控件，不支持与其它控件同行（只能独行显示），例如ueditor富文本编辑器等，这类控件本身需要占用较大空间，因此JDiy不对这些控件提供栅格化配置属性选项。

　　选中某个控件，右侧属性栏中的控件类型选input 单行文本框；然后选择其下方的输入类型。可以设置目标控件的内容格式类型。我们把以下类型的输入，都归纳为单行文本，实际上这些输入控件在html代码中本身就是一个<input ..>控件。只不过我们对它进行了相关的数据格式有效性验证。

提示：有效性验证仅针对非空输入，未输入内容的控件不执行格式验证。如果要限制非空输入，请将控件的是否必填开关打开。

• 普通文本框 普通的文本输入,这个没有什么好说明的
  

• 密码框 可以设置加密方式（明码; md5, md5加盐），产生业务数据后，请不要随意更改加密方式。
  

• 密码确认 系统会根据绑定的字段名，匹配表单中的其它同名密码框控件验证两次密码输入的正确性。
  

• 整数 程序将在表单提交时，自动验证输入是否为整数
  

• 整数或小数 程序将在表单提交时，自动验证输入是否为整数或小数
  

• 日期和时间 用户点击此输入框时会自动弹出日期时间选择，数据格式为yyyy-MM-dd HH:mm:ss
  

• 日期 用户点击此输入框时会自动弹出日期选择，数据格式为yyyy-MM-dd
  

• 时间 用户点击此输入框时会自动弹出时间选择，数据格式为HH:mm:ss

• 手机号 程序将在表单提交时，自动验证输入是否为手机号码格式
  

• 邮件地址 程序将在表单提交时，自动验证输入是否为邮件地址格式

• 网址 程序将在表单提交时，自动验证输入是否为网址格式

• 身份证号 程序将在表单提交时，自动验证输入是否为一个身份证号码(会使用身份证号码校验规则)

• 外键反查 这是一个特殊的输入控件，与下拉菜单或者查找带回控件有一定的相似之处。例如当前表单为工单输入，在录入工单信息的时候，要为此工单分配一个业务员（当前数据表中一个外键字段记录业务员的ID），我们可以用下拉菜单来选择业务员，也可以直接定义一个外键反查的输入框，让用户输入业务员姓名，由系统自动根据姓名去业务员表中匹配业务员ID, 并将目标业务员ID存入当前表的外键字段。此种配置方式，当前控件绑定的字段为业务员ID外键字段名,配置外键表为业务员表，查询字段为业务员姓名字段。
   
  

特别注意：
　　请尽可能的配置目标控件与所绑定的字段类型一致。不一致的数据类型保存可能会导致程序SQL异常。例如控件绑定的目标字段是一个datetime（日期时间）类型的，而您用一个普通文本框让用户随便输入，这样在表单提交时就会导致用户输入的内容不是一个有效的datetime格式而报错。

开关控件适用于逻辑值(true|false)或者bit(1|0)等等只表示开/关，是/否，启用/停用等两种状态的字段。

选中目标控件，将控件类型设置为swithch开关。

开关文字：设置要显示给用户看到的文字，用竖线分隔，分别表示开和关两个状态下，控件上显示的文字内容。
 开关值：设置表单提交时存入绑定字段的数据值，同样，开和关的值用竖线分隔，见上图。通常mysql的bit(1)类型，用1|0表示。

下拉菜单，单选框，复选框三种控件，都是提供一些可选的条目供用户选择。各控件的使用场景建议如下：

单选框：适用于少量静态选择项（2~3个）,例如性别选择（男|女）；又如审核状态（待审核|通过|不通过）。因为过多的条目可能会导致显示区域被撑大影响布局体验）。

复选框：适用需要多选，但条目又不是太多的情况。通常情况下，在数据库设计层面，当前表单绑定的主表与选项条目数据的来源表是一种一对多或多对多的映射关联关系。

下拉菜单：一般情况下均适用，但当条目项非常之多时，建议改用查找带回控件。

树型下拉菜单需要您先创建并配置树形界面，然后才能在右侧属性栏的数据来源中选择目标树型。

我们以所在地区为例（它是一个省/市/地区的三级树状结构）。树形下拉菜单的配置参考下图：

显示样式：用于定义选中节点后，控件呈现的节点层级文字；

叶子限制： 当开启（只能选择叶子节点）时，用户只能选择没有子级的最末层节点；否则用户可以选择任意层级。

配置好后最终的表单中控件点开显示效果如下：

查找带回控件，在页面上显示为一个带选择按钮的框，点击按钮后弹出一个新的列表界面，让用户选择一个或多个目标项，然后将选中项带回到当前表单界面，表单提交时将带回的条目id值存入当前控件绑定字段。

它是下拉菜单/单选框/多选框之类的控件的一个替代，适用于当选择条目项非常多的时候使用。
它在表单中的显示效果：

查找带回控件的属性配置参考如下图：

（见上图右侧属性栏）其中的查找界面里面会列出已有的分页列表界面，若无，需要您预先配置列表管理界面，同一个列表管理界面既可以用于数据的列表管理，又可以用于表单的查找带回。也就是说系统会自动判断该列表界面是用于数据管理，还是查找带回（若是后者，系统会去除列表界面中多余的数据管理按钮，以便它用适于查找带回选择），当然，您也可以单独配置专门用于查找带回使用的列表界面。

查找带回的多选模式：

当配置为可多选时，需要您配置多选的关联更新方式，它与复选框的“关联更新”配置是一样的，此处不再赘述。

　　常规的表单文件/图片等附件的上传相对来说比较麻烦，特别是在多图/多文件的处理上。以及有些时候，上传文件的保存，除直接保存到服务器的文件系统上外，也可能是存于其它位置，如七牛(Kodo), 阿里(OSS)对象存储等，JDiy简化了这类附件上传保存与读取处理。我们抽象了一个统一的Store类，目前它支持将附件存储于以上三种方式之一，而无论附件存于何地，对开发者读写访问都是统一（无差别）的调用方式。您只需要修改application.yml文件，预先配置附件的存储方式即可。

　　文件上传在JDiy系统中都被定义为“文件字段”，文件字段无需在当前数据表中分配实际的字段来存储它。一个文件字段，支持单文件上传和多文件上传两种方式。

• 单文件上传：如产品列表页缩略图，一个产品一个图片

• 多文件上传：如产品内页的多角度图片展示，它可以是一些图片的集合，这些图片共存于同一个文件字段。

富文本编辑器用于文章类的正文内容编辑，我们使用常用的百度UEditor作为富文本编辑器，如下图所示，右侧属性栏“控件类型”选择“ueditor 富文本编辑器” 。

富文本编辑器占用位置较大，它在表单界面中需独行显示（它没有布局样式更改选项）。

　　主键生成策略只针对添加表单，用于指定数据添加时，主键id的生成方式，大多数情况下，我们都是使用的自增主键，但您仍可以适当配置它，比如相应的业务单据，以自己的业务规则生成特定的单号作为数据的主键。若您配置的表单界面仅用于数据修改，则可以随意选择一项配置（修改表单，此项配置无意义）。系统目前支持的主键生成策略有如下几种：

• 数据库自增主键 使用情况最多的一种主键生成方式，一般在数据库中定义id字段为int 或bigint的auto_increment自动递增,它能保证单表唯一。
  

• JDiy10位字符串定长 由JDiy生成，保证整库唯一且长度固定为10个字符(由字母和数字组成)，可定义id字段为 char(10)类型。

• 不重复毫秒值 将当前毫秒值作为主键，我们将毫秒值的获取放在同步延时方法中，并保证同一台服务器上每次获取的值都不会重复,主键字段建议定义为bigint或者varchar(20)。

• YYYYmmddHHmmss+3位数字 即取当前的年月日时分秒后面加3位随机数字。
  

• YYYYmmdd+顺序号 取当前年月日后面跟顺序号，可配置顺序号的长度（0-6）,0表示不限长度，从1开始编号（顺序号长度不固定），若设置长度为3,则每日可产生999个号(001-999),根据业务场景需要设置。
  

• 自定义前缀+顺序号 可自定义前缀加上顺序号，前缀支持EL/FTL表达式。
  

• 32位UUID 直接生成32位UUID作为主键值。

当然，若还有更复杂的主键生成方式，您也可以直接在表单界面增强器中自行处理。

隐藏更新与字段默认值，用于处理那些不需要在页面上让用户输入，却又需要在表单提交时做初始值写入，或者更新的字段。隐藏更新字段不会出现在表单前台html代码中，它由JDiy在服务端直接更新。

填写格式：
name:value　或者：　@name:value
name为字段名，value为字段值
当name前面加一个@符号时，表示强制更新，即无论是添加还是修改数据都更新字段的值；否则，仅在数据添加(insert)时更新。

其中value值内容支持FTL表达式，常用的表达式变量如下：

1. user 表示当前登录用户.如获取当前用户id:  ${user.id}  又如取登录帐号： ${user.uid}

2. qo 表示当前表单界面打开时的URL地址入参.如: ${qo.foobar} 就类似于java中的 request.getParameter("foobar")

3. date 表示当前日期（返回yyyy-MM-dd格式的字符串）:  如：　${date}

4. datetime 表示当前日期时间（返回yyyy-MM-dd HH:mm:ss格式的字符串）:  如：　${datetime}

5. ctx 表示当前应用程序上下文根路径.

配置示例：

createTime:${datetime}
@updateTime:${datetime}
createUser_id:${user.id}
state:0
shop_id:${qo.shopId}

此配置示例，将在表单提交（添加和修改）时都更新updateTime为当前时间； 在信息添加时设置createTime为当前时间，设置createUser_id字段的值为当前登录用户的id，设置状态字段state=0, 设置shop_id字段为当前表单界面的URL入参shopId值。

　　表单增强器作为在线开发的功能补充，用于处理低代码配置无法满足业务需要时的功能扩展。让开发者以编程的方式对表单界面进行拦截干预处理。如在数据保存的同时，做一些其它的业务逻辑操作。 有关表单增强器的使用，请见本文档后续章节：使用JDiy各类界面增强器

　　配置列的常规显示，就是将该列字段直接显示出来（如下图，显示方式选直接显示），适用于普通文本直接显示；同时还可以显示为日期时间；保留两位小数等用格式（此处不再赘述）

　　若表格列数较多，在实际显示的时候，可能部分列显示不全，若我们需要微调目标列的列宽，让其宽度显示分配更加合理，可以指定目标列的“列宽”，建议您只对一部分列的宽度进行设置（如状态列，时间列），而让另外一些列由系统自动分配宽度（特别是那些内容长度未知的，比如文章标题），反而能达到更好的显示效果。

　　对齐方式默认为居中显示，适用于大多数情况；我们可以配置列的内容在单元格中的对齐方式，例如文章管理列表界面，文章标题可以考虑居左，又如价格金额，可以考虑居右，根据业务情况适当调整。

　　若允许用户点击目标列的标题行，按该列排序，可以将可排序开关打开，打开后列的标题文字右边会出现上下箭头（如下图），点击列标题，可以对该列进行升序/降序/取消列排序 三种方式切换。注意目标列绑定的字段名必须是数据库中存在的字段，且有排序意义（如：审核状态，发布时间，姓名等）才建议开启它；比如目标列是一个图片附件显示，没有排序意义，不建议开启。

　　此配置方式，将列字段的值以“K/V键值对”的方式进行转换后显示，如商品管理中，我们用一个saleFlag字段记录商品的上架状态，saleFlag字段被定义为tinyint(1)类型, 我们用0表示未上架，用1表示已上架，用２表示已下架，此时数据表中saleFlag字段存储的是0，1，2这样的数字值，但在列表管理中我们要将数字值转换为文字显示，此时我们就需要将数值转换成对应的文字了。

其中”键值:键名列表“属性配置框，我们将要转换的条目配置进去，一行一个条目，格式为：  键值:键名[:颜色]
其中颜色为可选配置项（不指定颜色则默认为黑色）；
颜色可以使用颜色名称，也可以使用颜色值，如：  1:已上架:red 和 1:已上架:#ff0000是等效的。

数据字典转换显示与K/V类似，只不过我们把条目项放到了字典中，这样可以让后台管理员动态添加字典条目。有关数据字典的配置，请参见系统字典与用户字典

提示：若字典中无匹配条目项，将以该字段的原值直接显示。

（多对一）外联字段显示： 
这是最常用的一种外联表显示方式。示例业务场景：

我们有一个产品表(sc_goods), 里面存放产品基本信息；还有一个产品分类表（sc_goods_type）存储产品类别；每一种产品都归属到某一个类别下，在数据库设计中，我们是在sc_goods这个产品表中定义一个goodsType_id的外键，记录此产品所属分类ID。

现在我们要做一个产品列表管理界面，里面要显示该产品的所属分类名称，此时我们需要将sc_goods表的goodsType_id值，转换为类别名称显示。

（一对多）外联字段显示：

还是以上面的场景为例，数据表的结构保持不变，我们反过来，假设现在要做一个产品分类管理的列表界面，在列出分类的同时，还想直接显示此分类下相关的产品，此时我们就可以使用一对多的显示方式。多个产品名称之间，以分号隔开。

（多对多）外联字段显示：

我们还是以“表单界面”-“复选框关联更新”里的例子进行说明。假设现在有一个老师表，一个班级表。一个老师可以带多个班级，一个班级也会有多个老师来任教，那么这种多对多的关系，我们引入第三张表，专门来记录他们的关系，表结构主要字段就像下面这个样子：

create table b_teacher
(
    id   int auto_increment comment '老师ID' primary key,
    name varchar(50) null comment '老师名称'
    -- 其它字段略
) comment '老师表（演示多对多）';

create table b_banji
(
    id         int auto_increment comment '班级ID' primary key,
    name       varchar(50) null comment '班级名称'
    -- 其它字段略
) comment '班级表（演示多对多）';

create table ref_teacher_banji
(
       teacher_id int not null,
       banji_id int not null,
       constraint banji___fk foreign key (banji_id) references b_banji (id),
       constraint teacher_fk foreign key (teacher_id) references b_teacher (id)
) comment '老师与班级的多对多中间关系表';

现在我们要做一个老师管理的列表界面，列表里除了显示常规的老师名称等字段外，还要显示此老师带课的班级（多个班级逗号分隔），那么这个列配置如下：

此教程内容正在完善中......

显示为缩图：

例如我们要做一个产品管理的列表界面，需要在列表中显示产品的图片，此时我们需要配置“附件（缩略图显示）。

需要注意的是，若我们在表单界面配置的是Store附件存储（您可以参考表单界面的文件上传控件中的JDiy Store统一附件存储说明，以及表单界面配置中的配置上传控件），此时绑定字段需与表单配置中填写的文件字段名一致。

显示为附件链接：

我们将显示方式配置为附件（文件名链接），则列表中显示已上传的文件附件链接，如下图：