O2OA使用手册
第1章 功能简介及概述
第6章 平台部署与配置
  • 6.1 安装部署-在Windows系统中部署O2OA开发平台
  • 6.2 安装部署-在Linux系统中部署O2OA开发平台
  • 6.3 安装部署-在宝塔/PHPStudy中部署O2OA开发平台
  • 6.4 安装部署-O2OA开发平台之HTTP端口规划
  • 6.5 安装部署-平台服务器版本升级操作说明
  • 6.6 安装部署-私有化部署服务器架构推荐
  • 6.7 安装部署-O2OA开发平台集群部署配置及操作说明
  • 6.8 安装部署-在线部署自定义应用的WAR包和JAR包
  • 6.9 服务器配置与管理-​O2OA主要配置文件说明
  • 6.10 服务器配置与管理-服务器端口冲突和端口修改
  • 6.11 服务器配置与管理-如何修改服务器内存占用率?
  • 6.12 服务器配置与管理-如何访问和操作H2内置数据库
  • 6.13 服务器配置与管理-​如何在O2OA中使用MySQL数据库?
  • 6.14 服务器配置与管理-如何修改平台支持的数据库驱动包
  • 6.15 服务器配置与管理-O2OA使用openGauss(华为高斯数据库)配置
  • 6.16 服务器配置与管理-O2OA开发平台平台数据库配置信息样例
  • 6.17 服务器配置与管理-配置O2OA服务器连接O2云
  • 6.18 服务器配置与管理-O2OA实现服务器随操作系统自动启动
  • 6.19 服务器配置与管理-文件存储服务器配置
  • 6.20 服务器配置与管理-工作日节假日配置
  • 6.21 服务器配置与管理-为平台增加全文检索功能
  • 6.22 服务器配置与管理-消息提醒配置说明
  • 6.23 服务器配置与管理-自定义消息提醒
  • 6.24 服务器配置与管理-定制消息通知的内容
  • 6.25 服务器配置与管理-消息通知过滤
  • 6.26 服务器配置与管理-为待办创建配置邮件通知
  • 6.27 服务器配置与管理-待办待阅数据的查询操作和管理
  • 6.28 服务器配置与管理-​自动执行平台数据的备份与恢复
  • 6.29 服务器配置与管理-数据导出导入与系统数据备份
  • 6.30 ​服务器配置与管理-定期自动执行数据备份与恢复
  • 6.31 系统安全-O2OA作为认证中心实现基于OAUTH2单点认证
  • 6.32 系统安全-O2OA基于Nginx的SSL跳转、转发配置
  • 6.33 系统安全-访问日志相关配置
  • 6.34 系统安全-审计日志相关配置
  • 6.35 系统安全-平台日志文件说明
  • 6.36 系统安全-O2OA日志输出设置log4j2.xml
  • 6.37 系统安全-用户密码初始化规则的设定
  • 6.38 系统安全-启用HTTPS(百度云版)
  • 6.39 系统安全-启用HTTPS(腾讯云版)
  • 6.40 系统安全-自签名SSL证书验证HTTPS功能
  • 6.41 系统安全-登录密码RSA加密
  • 6.42 系统安全-用户登录IP限制
  • 6.43 系统安全-在用户登录过程中启用图形验证码
  • 6.44 系统安全-平台部署之使用非root用户运行服务
  • 6.45 系统安全-O2Server启用国密加密设置
  • 6.46 系统安全-日志应用使用说明
  • 6.47 系统安全-用户重置密码操作
  • 6.48 系统安全-超级管理员(xadmin)密码修改
  • 6.49 系统安全-使用Web端运行服务器管理命令
  • 6.50 系统安全-o2server无法正常显示验证码解决办法
  • 第16章 开发知识及常见问题
  • 16.1 如何替换登录页面二维码中默认的logo图标
  • 16.2 O2OA(翱途)流程引擎中如何修改,定制流程的流转记录
  • 16.3 mysql数据库备份
  • 16.4 domain不正确的时候如何强制设置成正确的
  • 16.5 配置文件中使用密文存储密码
  • 16.6 常见问题-连接MySQL出现 Public Key Retrieval is not allowed 的错误
  • 16.7 常见问题-查看表结构
  • 16.8 常见问题-7.2及以上版本开启web代理后请求中没有正确使用web端口问题解决方式
  • 16.9 linux环境libreoffice安装及使用
  • 16.10 在O2OA中使用网络会议(二):Openmeetings与O2OA认证配置
  • 16.11 在O2OA中使用网络会议(一):Openmeetings-5.1.0亲手安装整理 Step-By-Step
  • 16.12 藕粉社区问答系列1
  • 16.13 藕粉社区问答系列2
  • 16.14 藕粉社区问答系列3
  • 16.15 快速入门-平台相关资料汇总
  • 16.16 快速入门-服务器总体介绍汇总
  • 16.17 快速入门-流程表单载入基础数据
  • 16.18 快速入门-常用表单脚本样例汇总
  • 16.19 快速入门-自定义表数据分页样例
  • 16.20 OEM白标-如何修改平台中的Logo图标和文字
  • 16.21 云服务器-阿里云ECS服务器的端口启用
  • 16.22 开发知识-React篇:在O2OA平台框架中使用React
  • 16.23 开发知识-React篇:在O2OA门户页面中使用React
  • 16.24 开发知识-Vue篇:在Vue应用中集成O2OA
  • 16.25 开发知识-Vue篇:使用Vue-CLI开发O2应用
  • 16.26 开发知识-Vue篇:在O2门户页面中使用Vue
  • 16.27 平台中使用Druid数据库连接及监控
  • 16.28 开发知识-在PAAS平台上部署O2OA开发平台
  • 16.29 开发知识-如何使用Tomcat架设webdav服务器
  • 16.30 开发知识-单个端口模式的Nginx和系统配置
  • 16.31 开发知识-Linux非root用户如何使用80端口启动O2OA
  • 16.32 开发知识-O2OA平台启用Eruda进行移动端调试
  • 16.33 开发知识-神通数据库安装
  • 16.34 开发知识-人大金仓数据安装
  • 16.35 开发知识-中标麒麟安装达梦数据库(DM8)
  • 16.36 开发知识-中标麒麟安装人大金仓详细步骤
  • 16.37 开发知识-使用VNC连接中标麒麟V7操作系统
  • 16.38 开发知识-鲲鹏(ARM)麒麟操作系统如何替换yum源?
  • 16.39 开发知识-数据优化知识点
  • 16.40 水印安全-附件水印|加密|文档格式转换图片|PDF
  • 16.41 消息队列-配置activeMQ、kafka消息队列
  • 16.42 常见问题-数据导出或者导入时发生OOM异常
  • 16.43 常见问题-如何让用户在首次登录时,必须对初始密码进行修改
  • 16.44 常见问题-如何在模块部署中控制模块的访问权限
  • 16.45 常见问题-如何在平台中开发Ftp文件上传文件的服务?
  • 16.46 常见问题-如何使用服务管理调用WebService
  • 16.47 常见问题-如何使用脚本调用外部服务
  • 16.48 常见问题-如何使用脚本控制流程自动流转
  • 16.49 常见问题-如何通过脚本调用系统内服务
  • 16.50 常见问题-接口代码疑惑解答汇总
  • 16.51 常见问题:Maven编译o2server错误: Java Heap Space
  • 16.52 常见问题-集群配置后启动报错:NullPointerException
  • 16.53 常见问题-服务器错误:can not decrypt token
  • 16.54 常见问题-IOS移动办公无法收到验证码
  • 16.55 常见问题-服务器和日志时间相差12小时的问题
  • 16.56 常见问题-为什么127.0.0.1可以访问但其他IP无法访问
  • 16.57 藕粉社区问答系列4
  • 16.58 开发知识-React篇:在React应用中集成O2OA

  • 流程设计-表单的创建与设计

    时间:2023-05-04   

    本文主要介绍如何在O2OA中进行审批流程表单或者工作流表单设计,O2OA主要采用拖拽可视化开发的方式完成流程表单的设计和配置,不需要过多的代码编写,业务人员可以直接进行修改操作。

    一、创建表单

      按照流程设计流程的一般过程,我们可以先来创建表单。

      在应用设计界面选中“表单”导航,在点击新建按钮,可新建一个表单,如下图:

      WX20230504-134315@2x.png

      点击新建表单后,会弹出模板选择,您可以根据您要创建的流程,选择一个相对符合您的业务的表单模板。如下图:

      WX20230504-134401@2x.png

      一般情况下,我们可以选择“通用表单模板”,点击后打开表单设计界面,如下图:

    WX20230504-134428@2x.png

    二、表单设计器介绍

    • 表单元素区:存放表单设计元素的区域,通过拖拽,可以将设计元素添加到表单设计区。

    • 表单工具栏:保存表单、预览表单等操作按钮。

    • 表单设计区:表单的可视化编辑区域。

    • 表单元素列表:表单中所有的设计元素在列表中按层次结构列出。当此区域中的元素被选中时,表单设计区中的相应元素也被选中,反之亦然。

    • 表单属性区:表单和设计元素的属性可以在此编辑。当在表单设计区中选中设计元素时,此区域显示所选设计元素的属性;当表单设计区中未选择任何设计元素时,此区域显示当前表单的属性。

    接下来,是对表单的编辑,可以按以下步骤进行:

    1.      设置表单名称  在表单属性区中,找到“名称”,填写您要给表单起的名字(同一个应用中,表单名称不同重名)。

    2.      编辑表单内容  您可以将元素区的设计元素拖动到表单的指定位置。当某个元素被选中是时,状态如图:,三个操作按钮分别是:移动、复制和删除。

    3.      保存表单。

    三、表单设计基本操作

    1、创建表单元素

    要创建表单元素,只需要将元素区的表单组件拖动到表单设计区的合适位置即可。

    WX20230504-134452@2x.png

    拖动元素时,将鼠标移动到非容器组件(如文本、输入框、编辑器等)时,会在鼠标移动到的组件前面插入新创建的组件。将鼠标移动到容器组件(如容器、单元格等)时,会在鼠标移动到的组件前面,或者容器内底部新创建的组件。您也可以在释放鼠标左键时按住Ctrl键,出现创建组件定位按钮,选择要创建新组件的位置。

    WX20230504-134522@2x.png

    2、移动、复制和删除表单元素

    在表单设计区选择要操作的表单元素,出现元素操作条:

    WX20230504-134557@2x.png

    鼠标拖动“移动元素”按钮,来移动元素;

    鼠标拖动“复制元素”按钮,复制一个新元素;

    鼠标左键点击“删除元素”按钮,来删除元素;

    3、工具栏

    WX20230504-134621@2x.png

    介绍一下以下几个按钮:

    保存为模板:将当前表单保存为一个模板,在下次新建表单时,可在模板列表中选择到。

    格式刷:先选中调整好样式的元素,点击“格式刷”按钮,再点击要调整的元素,即可复制样式。再次点击“格式刷”按钮,取消格式刷。

    导出:点击“导出”按钮展现表单json数据,您可以将json数据拷贝出来,在别的表单中导入。

    导入:可以通过“O2数据导入”(就是导出的json数据)以及html和word文件导入。

    表单历史版本:表单每次保存都会创建一个历史版本,点击“表单历史版本”按钮弹出表单历史版本列表,您可以选择将表单设计恢复到某个以前的版本。

    WX20230504-134644@2x.png

    清除无效格式:在一些意外的情况下,表单数据出现损坏,导致表单无法展现,您可以点击“清除无效格式”按钮进行修复。

    4、表单元素区

    WX20230504-134709@2x.png

    四、表单属性

      创建一个表单时,默认会在属性区显示当前表单的属性。如果您已经选中了其它的设计元素,在表单空白处点击鼠标左键,会选中当前表单;或在表单元素列表中选中表单。如图:

    WX20230504-134733@2x.png

    属性区显示如下图:

    WX20230504-134757@2x.png

    表单属性包括五个标签:基本、提交、事件、HTML和JSON。

    基本:表单的基本属性配置,名称、样式、描述等。

    提交:完成流程待办处理是的提交模式配置,包括提交的界面、表单的校验以及手写签批等配置

    事件:配置表单的事件,可以编写事件脚本。

    HTML:可以在此处查看表单的HTML内容。

    JSON:表单和设计元素都是通过json数据格式来描述的,这里可以查看表单的json数据。

    1、“基本”属性

    表单基本属性如下表:

    属性

    描述

    备注

    标识

    表单的唯一标识

    自动生成

    名称

    表单的名称

    必填,同一个应用内不可重名

    描述

    表单的描述


    分类

    表单的分类

    可在表单列表页面分类查看

    是否只读

    设置表单是否只读

    设置为“是”表单上的所有元素都不可编辑

    表单样式

    内置的表单样式

    可选值:

    传统样式

    蓝色简洁

    红色简洁

    手机样式(用于手机表单)

    图标

    可以为表单设置一个图标


    打印表单

    当当前表单执行打印操作时,可以使用另一个表单来展现当前的业务数据,可在此处指定打印时要使用的表单。如不指定,就为当前表单

    可选本应用内的任意表单

    预加载脚本

    表单加载时运行的脚本

    可以选择任何平台、任何应用中的脚本库,可选择多个脚本库。这里的脚本在所有表单事件之前运行,当然要注意:当你选择多个预加载脚本时,它们是按你的选择顺序运行的。

    样式

    可以为表单定制CSS样式

    表单可以是看作是一个容器,它对应HTML的一个DIV对象,您可以为这个DIV对象设置CSS样式和HTML属性。

    属性

    可以为表单设置HTML属性


    CSS

    表单要使用的CSS内容


    语言包

    表单使用的语言包

    您可以使用数据字典或叫脚本库作为表单的语言包,(按照 "lp-"+o2.language 的命名方式,如“lp-zh-cn”或“lp-en”);也可以通过脚本,返回一个json格式的对象作为语言包。然后在表单其他设计元素中,可以使用{{$.lp.xxx}}方式使用语言包。

    参考:https://www.yuque.com/o2oa/cfst8l/be5azkb0u0h7ss1z

    校验意见

    可以在此编写校验脚本,在表单流转提交时执行

    在意见和决策窗口确定后执行。如果校验成功返回true;如校验失败,返回失败信息,系统会在相应的位置,提示校验失败信息

    校验路由

    可以在此编写校验脚本,在表单流转提交时执行


    流转校验                                              

    可以在此编写校验脚本,在表单流转提交时执行

    在点击“继续流转”按钮时,填写意见和选择决策窗口未弹出时执行。脚本返回布尔型:返回true时继续执行流转;返回false时中断执行。

    2、“提交”属性

    表单提交属性如下表:

    属性

    描述

    备注

    提交界面

    完成待办处理,点击“继续流转”按钮后使用的提交窗口界面

    可以使用“系统默认”或使用子表单。(在新建表单的模板窗口,有提交表单的模板)

    参考:https://www.yuque.com/o2oa/cfst8l/woeo9s

    手写意见设置

    手写

    是否允许在填写流程意见时进行手写签批


    手写板宽度

    设置手写板宽度,单位px

    仅PC端有效,移动端横向全屏

    手写板高度

    设置手写板高度,单位px

    仅PC端有效,移动端横向全屏

    操作条

    定义手写板操作条

    仅PC端有效

    流转后提示框 (仅在浏览器新窗口中打开时有效)

    流转后提示框

    选择是否在流转成功后显示提示框

    提示框位置

    选择提示框出现的位置


    关闭时间

    设置提示窗口自动关闭的时间


    流转后

    配置流转结束后进行的操作:关闭窗口或重定向

    如果选择“重定向”可在重定向脚本中返回一个URL,窗口将重定向到此RUL。

    校验

    校验意见

    可以在此编写校验脚本,在表单流转提交时执行

    在意见和决策窗口确定后执行。如果校验成功返回true;如校验失败,返回失败信息,系统会在相应的位置,提示校验失败信息

    校验路由

    可以在此编写校验脚本,在表单流转提交时执行

    流转校验                                              

    可以在此编写校验脚本,在表单流转提交时执行

    在点击“继续流转”按钮时,填写意见和选择决策窗口未弹出时执行。脚本返回布尔型:返回true

    3、表单事件

    表单的事件包含两种:一种是表单容器对应的DIV对象的DOM事件,一种是表单系统事件。

    表单系统事件如下表:

    事件名

    描述

    beforeLoad              

    表单被载入之前执行。

    afterLoad

    load

    postLoad

    表单被完全载入之后执行

    beforeSave

    在用户点击“保存”按钮,或执行this.form.save方法,而数据没有真正被保存之前。在表单执行流转的过程中,会先对表单数据进行保存,所以也会触发beforeSave事件。

    afterSave

    在用户点击“保存”按钮,或执行this.form.save方法,数据被保存成功之后。在表单执行流转的过程中,会先对表单数据进行保存,所以也会触发afterSave事件。

    beforeClose

    表单窗口被关闭之前。

    submit

    beforeProcess

    在表单继续流转之前执行(已经填写意见和选择决策)。点击“继续流转”按钮,或执行this.from.process方法,都会触发此事件。

    beforeProcessWork

    在表单继续流转之前执行,与submitbeforeProcess不同的是,beforeProcessWork是在填写意见和选择决策窗口弹出之前执行的。

    afterLoadProcessor

    加载弹出的提交界面以后执行

    afterProcess

    在表单执行流转成功之后执行。

    beforeReset

    在执行重置处理人操作之前执行。

    afterReset

    在执行重置处理人操作之后执行。

    beforeRetract

    在执行撤回操作之前执行。

    afterRetract

    在执行撤回操作之后执行。

    beforeReroute

    在执行调度操作之前执行。

    afterReroute

    在执行调度操作之后执行。

    beforeModulesLoad

    在表单已载入,但表单中的元素未载入之时执行。

    afterModulesLoad

    在表单中的所有元素载入之后执行。实际执行时间与afterLoadloadpostLoad相同。

    beforeDelete

    在执行删除操作之前执行。

    详细的表单事件请可参考:API文档

    表单容器的DOM事件请参考相关HTML规范。可参考:MDN: HTMLDivElement



    logo_all@1.5x.png

    本章节我们详细介绍了表单的设计,以及每个设计元素,下一章我们将详细介绍流程的设计。