从线下审批到在线审批-表单使用(新)|学习笔记

简介: 快速学习从线下审批到在线审批-表单使用(新)

开发者学堂课程【低代码-从线下审批到在线审批:从线下审批到在线审批-表单使用(新)】学习笔记与课程紧密联系,让用户快速学习知识

课程地址:https://developer.aliyun.com/learning/course/1000/detail/15003


从线下审批到在线审批-表单使用(新)

 

内容介绍:

一、宜搭的在线审批基础

二、请假申请案例实践——表单使用

 

宜搭可以通过线上流程审批,轻松地完成各种复杂业务流程的审批工作,促进团队工作效率的提升。本章将通过从空白开始创建一个请假申请,运用掌握表单流程和数据。数据的基本配置,为后续进阶课程打下良好的基础。

了解了课程的大概情况后,来看一下本章课程的学习目标。了解为什么要实现在线审批,了解在线审批的操作基础,掌握表单基础和表单操作,掌握流程基础和流程操作,掌握数据基础。

 

一、宜搭的在线审批基础

在线审批其实是解决了线下审批填写困难,审批找人难、统计困难、存档困难的问题

image.png

使用在线审批,传统表格能做的宜搭都能做,线下找人签字改成线上审批,不用麻烦地翻找纸质存档了,节省了时间和人力,这是在线审批和线下审批相比的优势。那宜搭在线审批的基础是?基础是哪些呢?在宜搭的应用中,通过表单、流程、表单、报表、自定义页面添加外部链接来配合完成完整的业务场景需求的解决。

image.png

其中,表单流程和报表是宜搭的基础,三要素表单和流程表单都是表单类型,它们有哪些区别,适用于哪些场景呢?普通表单多用于收集数据,适用于匿名投票应用,比如匿名收集哪个国家是最喜爱去旅游的国家,这种应用就可以使用到普通表单去进行收集数据,流程表单,流程的线上化适用于行政管理应用,行政管理应用当中的请假、出差、申请这些都可以使用流程表单进行搭建。

image.png

了解完表单的基础,我们来看一下表单的页面设计。可以看到右侧有一张图片,这里面左侧是组件库,中间是画布右左侧是属性,所以表单的页面设计包括组件库、画布和属性。组件库可以选择组建不同的组件,可以存储不同类型的数据化,不可以布局组件排列顺序等。我们可以将组件库当中的组件拖动到画布上,通过拖拽的方式去布局组件的排列顺序,属性包括单个组件段的属性设置,以及整个表单的属性设置。在流程表单中,没有流程流转审批人配置入口。

image.png

应该在哪里去配置我们流程的设计呢?我们可以点击上方的流程设计。就可以跳转到简易流程。气的页面了。这里的简易流程设计器包含流程、画布、全局设置、测试、保存和发成按钮。这里的流程化不可以配置包括审批人、执行人、抄送人、分支节点和消息通知等节点,全局设置可以配置校验关联规则、自动执行规则等操作。测试配置好测试数据集,发起人后可以选择启动测试即可。在审批流程中查看模拟的流程,就可以不需要发起一个真实的审批,而使用模拟的流程来看,配置是否有错误,来进行及时的更改、保存和发布流程。按钮配置完成后,点击保存并发布流程,后续提交的数据按照此次流程设计进行流转。

image.png

本小节我们介绍了一沓在线审批基础。下一小节,我们将学习请假申请实践之表单使用。

 

二、请假申请案例实践——表单使用

以一个请假申请的实践来学习表单的使用,首先来看传统的请假单是存在一些问题的。填写繁琐,不容易存档,人工传递表单进行审批容易疏漏,并且审批不够及时。表单的数据不宜追综与统计,HR需要人工计算和汇总数据,容易出错。可以看到右边的请假单,这里就是一个纸质的请假单,可以将它分解成三个部分,分别是表单、审批流程和表单附件。分解完成后,就可以去搭建请假申请的应用系统。

image.png

使用宜搭,一般职能人员就可以搭建流程应用系统,HR可以将线下的请假流程转移到线上实现。现代化的请假审批流程左侧还是纸质的请假单,右侧是已经搭建好的请假申请的宜搭应用,搭建一个请假申请表单都需要用到哪些组件?分别对应有哪些作用呢?

image.pngimage.png

在这里面,表单使用有成员单行文本、日期、单选数值,多行文本和图片上传组件,分别对应的是请假所用的申请人,可用成员组建申请人所在部门可以使用到单号文本组件。申请时间请假开始时间结束时间可用到日期组件,请假类型可以使用单选组件。请假的小时或者请假的天数可以使用到数值组建,请假事由可以使用到多行文本。请假所需要的附件可以使用到图片上传组件。

如果不想要手动输入申请人或者申请人所在部门或者申请时间,应该使用到什么样的方式呢?可以使用到宜搭当中组建的公式,在这里面可以使用到人员获取函数user去获取到当前的登录人。文本函数department去获取到指定人员所在的部门时间函数SYSTIEM可以去返回服务器的时间去复制给日期组件,获取到申请的时间。DAYS DATE函数可以去计算两个日期之间的天数,可以用它来获取的请假结束时间和请假开始时间中间间隔的天数,这样就可以不用手动输入,而是自动计算出请假相隔的天数。

image.png

接下来进行搭建演示,首先进入到宜搭的首页。在首页中,选择工作台。进入到工作台之后,选择创建应用,在这里面选择创建空白应用,点击开始创建。这里的应用名称可以输入为请假申请。点击确定。创建完成应用后,选择去创建一个页面,这里面的请假申请是一个流程表单,所以选择新建流程表单。名称起名为请假申请。点击确定。这样一个请假申请的流程表单就创建好了。

image.pngimage.png

接下来,需要在这请假申请的表单设计页面里面拖动一些组件到画布当中去配置它的一些属性。首先请假申请流程表单中需要一个申请人,这里面的申请人使用一个成员组建,拖动一个成员组件。在右侧是组件属性,在属性中可以去更改它的标题,默认值,描述信息等。

在这边将它的标题更改为申请人。这里面想要默认获取到当前登陆人的信息,所以在这边选择默认值去公式编辑去进行获取当前登录人的信息。

image.png

点击编辑公式,在这里面,需要获取到当前登录人的信息,所以使用到的是人员获取函数当中的user,选择user,在函数列表当中可以选择到它,点击,然后点击确定。

image.png

接下来依次来配置一下。申请人所在部门和申请时间,在这里面想要获取到申请人所在的部门,可以使用到一个单号,文本组件用到画布当中,同样去更改它的标题为部门。或者是申请人所在部门。我们要将它的默认值同样的更改成功,是编辑,然后去编辑公式,在这里面去配置公式,自动获取到当前登录人所在的部门,这里可以在函数列表当中去进行一些。寻找也可以直接在上方去进行。模糊搜索。比如department name是获取到指定人的。所在部门名称我们可以直接点击,也可以在这边去搜索。然后回车。这里面中间是需要放入一个人员搜索框的,在这边将我们的成员,也就是申请人放入进去,这样就可以获取到申请人所在的部门了,点击确定,申请人所在部门就已经配置完成了。

image.png

申请日期,选择一个日期组件拖到画布当中去更改它的标题。这里面想要的格式是精确到秒,所以在右侧的属性当中可以配着它的格式为年月日时分秒。同样的,想要自动获取申请日期,就可以在默认值当中去选择公式编辑。去编辑公式,这里面使用到的是获取服务器的日期,并且将时间说填充到日期组件当中,所以在这边使用到的是时间函数system。System是一个日期对象,想要将它更改成一个。时间戳的格式,所以在外面要嵌套一个time said,将它扩在里面,这样就已经配置完成了申请日期我们点击确定。

image.pngimage.png

接下来来配置一下请假类型,请假类型使用到的是一个单选组件,从多的画布当中在这边更改,它的标题为请假类型。这里面的自定义选项,可以在这边单个编辑修改,也可以选择批量编辑,我们在这边批量编辑一些,比如年假,事假,病假点击确定。请假类型就已经配置完成了。

image.png

接下来,来配置一下请假的开始时间和结束时间。拖动两个日期组件,可以选择点击的方式,去更改它的标题为请假开始时间。和请假结束时间。

image.png

找到一个数值组件,去更改标题为时长,同样的,想要默认获取出请假结束时间和请假开始时间中间间隔的天数,所以在默认值当中去配置它,为公式编辑,然后去选择编辑公式,在这里面使用到的是一个时间函数,可以到函数列表当中去找到时间函数,这里面有DAYS的说明,会使用到函数里面,可以看到示例里面有一个使用说明,在这里面我们同样的去进行一个配置,里面是用date包裹的一个请假结束时间。

用逗号相隔去配置请假开始时间。配置完成之后,间隔时间天数就已经配置好了,点击确定。

image.png

接下来来看一下还有哪些组件没有用到,会用到一个多行文本去配置的请假事由还有一个图片上传组件去配置请假附件,。在这里面可以去配置它的一个上传详情的设置,这边向上传类型有点击类型,卡片类型和拖拽类型,选择卡片类型。

image.png

如果大家对这图片上传组件需要一些描述信息的话,也可以在属性当中去配置它的描述信息,比如最大上传九张图片。

image.png

点击确定描述信息就会在下方。进行一个展示,最终配置完成之后点击保存来预览一下效果。在页面预览当中可以看到,申请人、申请人、所在部门和申请日期都已经自动获取出来了。

image.png

接下来来看一下时长是否配置正确,选择请假的开始时间和请假的结束时间。可以看到,它已经自动获取出我们的请假时长是一天。

image.png

本小节了解了请假申请表单搭建的整体流程。通过对请假流程的背景了解和需求分析,确定应用所需要的功能,开始创建一个请假申请表。单请假申请表单的搭建流程如下,首先会创建一个空白的应用,然后去选择新建一个流程表单,会拖动所需要的组件并配置相关的公式,最终保存预览来看一下效果是否配置完成,配置完成之后,表单设计就已经搭建完成了。下一小节,将学习请假申请案例之流程设计。

相关文章
|
JavaScript 前端开发 搜索推荐
vue -- 单页面应用和多页面应用区别及优缺点
vue -- 单页面应用和多页面应用区别及优缺点
474 0
|
物联网
IoT物联网设备OTA固件升级开发实践
通过OTA方式,我们可以对分布在全球各地的IoT设备进行设备固件升级,而不必让运维人员各地奔波。
7973 0
|
传感器 网络协议 物联网
华为鸿蒙OS尖刀武器之分布式软总线技术
华为鸿蒙OS尖刀武器之分布式软总线技术
华为鸿蒙OS尖刀武器之分布式软总线技术
|
7月前
|
安全 网络安全 虚拟化
VMware VeloCloud SD-WAN 6.4 - 领先的 SD-WAN 解决方案
VMware VeloCloud SD-WAN 6.4 发布,新增功能概览
136 0
VMware VeloCloud SD-WAN 6.4 - 领先的 SD-WAN 解决方案
|
12月前
|
搜索推荐 算法 数据挖掘
探讨淘宝商品 API 接口:运用及收益
在电商蓬勃发展的今天,淘宝作为国内巨头,拥有海量商品数据和庞大用户群体。淘宝商品API接口为开发者、电商从业者和数据分析师提供了丰富的商品信息,如详情、价格、销量、评价等,助力电商平台搭建、推荐系统优化、市场调研及竞品分析,显著提升业务收益。本文将深入探讨该接口的运用方法与价值,并结合实际代码示例,帮助读者更好地理解和应用。
351 6
|
7月前
|
存储 Windows
内存卡坏了还能修吗?4种常见修复方法
内存卡出现“无法保存”或“存储异常”等问题时,不一定是硬件损坏,可能是系统错误或文件系统异常导致。本文介绍几种亲测有效的修复方法:1) 更换读卡设备排除接触问题;2) 格式化修复文件系统(需先备份数据);3) 使用DiskGenius检测坏道;4) 借助厂商工具深度修复。同时提供日常保养建议,如避免高温环境、养成数据备份习惯,延长内存卡使用寿命。通过这些方法,多数问题可轻松解决,无需更换硬件。
|
人工智能 自然语言处理 测试技术
AI协助开发:未来软件工程的变革
在科技飞速发展的今天,人工智能(AI)已成为软件开发领域的变革力量。AI不仅能自动生成与优化代码、提高开发效率及代码质量,还能实现自动化测试、快速定位错误,确保软件的稳定性与可靠性。通过自然语言处理技术,AI简化了需求分析过程;在项目管理上,AI能优化任务分配,提升团队协作效率。尽管AI的应用带来了诸如数据隐私等新挑战,但随着技术的进步,AI将持续深化参与软件开发的各个环节,为开发人员提供强有力的支持,推动行业向前发展。
|
前端开发 JavaScript 编译器
Vite中预处理器(如less)的配置
【8月更文挑战第2天】Vite中预处理器(如less)的配置
1542 4
|
缓存 NoSQL Redis
[Nestjs] 使用redis的基础配置,以及基本使用的介绍
要在 NestJS 中使用 Redis,需要安装依赖npm install --save redis fastify-redis
826 0
|
SQL 存储 DataWorks
DataWorks产品使用合集之DataWorks中,配置DataHub数据源如何解决
DataWorks作为一站式的数据开发与治理平台,提供了从数据采集、清洗、开发、调度、服务化、质量监控到安全管理的全套解决方案,帮助企业构建高效、规范、安全的大数据处理体系。以下是对DataWorks产品使用合集的概述,涵盖数据处理的各个环节。
487 5