开发者学堂课程【宜搭低代码开发平台及认证教程 :宜搭认证课程-掌握表单设计(二)】学习笔记,与课程紧密联系,让用户快速学习知识。
课程地址:https://developer.aliyun.com/learning/course/738/detail/13111
宜搭认证课程-掌握表单设计(二)
三、案列详解
利用T恤尺码收集介绍整体的表单搭建的过程。
1、新建单据页面,页面名称 T 恤尺码收集。
2、最终要生成以下效果,两个组件,分组组件,基本信息和尺码信息。第一个分组里面有人员,性别,衣服尺码三个组件排在第一行,第二行有所在团队。在分栏设置里面有人员组件,有性别,衣服尺码。
3、拖入两个分组,第一个分组填写基本信息,第二个分组填写尺码信息。第一行使用分栏组件,将三个组件进行分栏排列,拖入分栏组件,点击布局里面的三栏,比例为6:6:12。
4、人员拖入单行输入框,性别拖入单选,衣服尺码拖入单选,单行输入框标题为人员,默认状态为只读,不允许修改,默认获取到当前登陆用户,默认值选择公式编辑,选择其他函数中 LOGINUSER,获取当前用户的姓名点击确定。
5、单选组件标题为性别,有两个选项,男,女。
6、性别左上角有个小红点,说明是必填的,校验勾选必填,错误提示请选择性别。
7、单选组件标题为衣服尺码,勾选必填,8个选项,如果一个一个填写会有些困难,可以使用关联其它表单数据。新建单据页面,从 excel 导入,上传T恤尺码统计员工数据,第一个表单是人员信息,第二个表单是所在部门,第三个表单是衣服尺码,第四个表单是女款,第五个表单是男款。
8、需要导入尺码信息,选择衣服尺码,点击下一步,点击导入。
9、名称修改为衣服尺码。
10、查看数据管理页,全选,可以看到衣服尺码都已经被导入进来。
11、切换到T恤尺码收集设计器,通过关联其它表单数据,衣服尺码,点击保存。
12、预览,衣服尺码已经被联动出来,人员也被自动获取。
13、所在团队也是拖入单选组件,可以看到它没有在分栏里面,可以通过大纲树操作进行矫正,把它拖入分栏中即可,如果拖动组件不好操作,就可以在大纲树进行调试。
14、所在团队的数据也可以通过关联表单联动过来,勾选必填,错误提示请选择团队。
15、新建单据页面,从 excel 导入,T恤尺码统计员工数据,选择所在部门,点击下一步,完成,名字修改成所在部门。数据管理页,设置显示字段,点击所在部门,点击确定,可以看到部门全部导入进来。
16、回到尺码收集页面,点击选项,关联其他表单数据,所在部门,保存,预览,可以看到所在部门全部关联过来。
17、设置所在团队的宽度,最大宽度100%,保存,预览。
18、衣服尺码有男款和女款,当选择性别时衣服尺码照片会进行联动显示,当选择男时,图片是男款图片,当选择女时,图片是女款图片。在设计器中,点击尺码信息分组,拖入一个容器,因为容器是一个载体,里面可以拖入其他的组件,把图片拖入大纲树容器中,把容器再复制粘贴一个,给第一个容器命名为男性尺码,给第二个容器命名为女性尺码,点击第一个图片,上传图片地址,男款,切到大纲树,点击第二个图片,上传女款图片地址。
19、点击性别,选项,关联选项设置,当选择不同选项时,自定义一些规则,让组件进行显示隐藏,点击关联选项规则,当选项为男时,显示男性尺码,当选项为女时,选择女性尺码,点击确定,保存。
20、预览,选择男,出现男的图片,选择女,出现女的图片。
21、性别选项,默认选择男,保存。
22、切换到T恤尺码收集,点击数据管理,点击新增,选择基础运维部,男L,点击提交。查看详情,可以看到提交的信息。
23、应用成功后,要进行上线和下线,点击设置,提交规则,勾选同一个账号只能提交一次。
24、点击分享设置,输入 t-shirts,点击免登提交,免费访问位置输入 t-shirts,保存。
25、其他同事就可以进入短链提交表单,用于搜集他的信息。