泛微OA【开发技巧】流程表单HTML扩展开发(推荐：设计器实现设置表单元素的长度)

流程表单HTML扩展开发版本v0.2 仅限阅读请勿传播

当您阅读本方案时，即表示您同意不传播本方案的所有内容

流程表单HTML设计器实现自定义控制表单元素的长度及其他常见需求实现案例

目录

1.说明 (5)

2.准备工作 (6)

3.实现自主设置表单元素的长度 (6)

3.1.支持PC端及手机端HMTL模式流程表单（单个流程） (6)

3.2.HMTL模式流程引入样式文件（一劳永逸） (8)

4.实现隐藏表单元素表单边框的需求 (11)

4.1.代码块 (11)

4.2.实现效果 (11)

5.实现表单未输入内容时悬浮提醒的效果 (12)

5.1.代码块 (12)

5.2.实现效果 (13)

6.实现提交时校验身份证号码的需求 (15)

6.1.代码块 (15)

6.2.实现效果 (17)

7.实现某个check框设置为必填的需求 (18)

7.1.代码块 (18)

8.html打印时解决签字意见多个空格问题 (19)

8.1.代码块 (19)

8.2.实现效果 (20)

9.html同一节点多个签字节点排序。 (21)

9.1.多个签字节点按时间先后正序排序 (21)

9.2.多个签字节点按时间先后倒序排序 (24)

9.3. 实现效果 (26)

10.html签字节点格式调整 (27)

10.1.html签字节点格式调整为“内容居左，署名居右” (27)

10.2.实现效果 (28)

11. html签字按时间排序并调整格式 (29)

11.1 按时间先后顺序排序并调整格式 (29)

11.2. 按时间先后倒序排序并调整格式 (30)

1.说明

难度：★★★☆☆

预计时间：1小时

涉及代码开发：有

目标需求：

此案例适用项目人员通过流程表单HTML设计器实现自定义控制表单元素的长度。当不得不这么做的时候，请参考该方案进行适当调整。

●可以按照客户要求对时间流程表单进行适当改造。

流程表单上面布局、校验、样式等功能

可以jQuery的方式进行适当改造。

知识点：

基本信息：

背景知识：

1、在阅读本教程之前,需具备html和JavaScript基本知识。

2、在阅读本教程之前,需具备jsp页面读写的基本能力。

最终效果：

●通过流程表单HTML设计器实现自定义控制表单元素的长度

●实现隐藏表单原始边框

●实现表单元素未输入内容时悬浮提醒的效果

●html签字节点格式调整（内容在左，署名在右）

●html签字节点按时间排序并调整格式

2.准备工作

1、准备一台和正式环境一致操作系统的服务器。

3.（推荐）实现自主设置表单元素的长度

将附件提供的width.css上传到服务器的/css/width/目录下面。

css文件 .zip

3.1.支持PC端及手机端HMTL模式流程表单（单个流程）

1.在代码块中单个流程引入css样式文件

如（如图1）。

（图1）

2.在需要自主设置长度单元格式设置class 例如图2 里面的class w50 表示设置这个框子里面的input

长度为50px。如果设置为w100 则限制长度为100px，具体效果如图3

（图2）

（图3）

3.2.HMTL模式流程引入样式文件（一劳永逸）

1.新建流程界面流程引入css样式文件

需要修改ecology/workflow/request/AddRequestIframe.jsp文件。如（如图4）。

（图4）

2.查看及处理流程界面流程引入css样式文件

rel=STYLESHEET>需要修改ecology/workflow/request/ManageRequestNoFormIframe.jsp。如（如图4）。

（图5）

3.手机端流程界面流程引入css样式文件

需要修改ecology/mobile/plugin/1/client.jsp。如（如图6）。

（图6）

4.实现隐藏表单元素表单边框的需求4.1.代码块

4.2.实现效果

例：原生页面

（图7）

开发修改后：

5.实现表单未输入内容时悬浮提醒的效果此方法只适用于输入框提示。

5.1.代码块

1.在代码块中插入代码

2.在需要自主设置提示内容的单元格设置class名为holder（如果属性名称class已经存在，需在原有

名称后空格后添加holder），以及设置自定义属性为提示内容data-holder的值，例如图8 里面的class w50 表示设置这个输入框的提示内容为“请输入标题”，如图8。注：class名为holder，自定义属性名为data-holder，不可更改。具体效果如图9

（图8）

5.2.实现效果

例：原生界面

开发修改后：

（图9）

6.实现提交时校验身份证号码的需求

6.1.代码块

6.2.实现效果

7.实现某个check框设置为必填的需求7.1.代码块

jQuery(document).ready(function(){

checkCustomize = function(){

var issubmit=false;

if(jQuery("#field11359").attr("checked")){

window.top.Dialog.alert("提醒：选择框已经选中!");

issubmit=true;

}else{

window.top.Dialog.alert("提醒：选择框未选择!");

}

return issubmit;

}

});

8.h tml打印时解决签字意见多个空格问题8.1.代码块

将以下代码块放在ecology\workflow\request\PrintRequest.jsp文件中，如下图：

8.2.实现效果

例：原生界面

删除空的签字意见和一个换行符

(精选文档)致远OA流程表单制作

表单制作： 需注意的是只可用文本框和重复表。其他控件皆不可用。双击控件，弹出下框： 修改域名称，数据类型一定要是文本。保存。 在流程表单制作里面点击新建，选择要导入的表单（xsn格式）。

修改字段类型 设置计算公式

操作设置，设置自动带入 设这部的原因在于，审批走到某节点时，需要签字，但不允许此节点操作其他字段

在建审批流时，找到对应节点，点击节点属性，将表单绑定修改了，此节点审批时就可以完成签字，但不能操作其他字段。 查询设置： 下方显示的是查询内容的预览情况，可以根据这些去调整输出数据项。自定义查询项用于查询时输入查询条件。 统计设置类似于查询设置。不同处是可以将统计项进行按条件的统计。例如按部门不同，统计出呈送单每个部门发起的数量。根据下方预览，可以去调整统计项、统计分组项。 流程设置： 目前系统最常用的是组、岗位、相对角色。组可以在system里面设置，将组员添加进入某个组之后，流程设置时选择该组。相对角色主要用于设置部门负责人、部门分管领导等特殊的相对角色。

某个节点里面有多个审批人时需要设置执行模式，单人执行为上节点提交审批时，手动选择审批人，审批人限定为此组里面的某个人，且只能为一个人。多人模式是指上节点可以选择此组里面的多个人进行审批。全体执行是指此组里面的所有人都需要审批。竞争模式是指此组里面谁都可以审批，但是只要有一个人审批通过，流程即可以往下走。

节点期限用于统计绩效。设置之后，可以登录system帐号，统计审批超时情况。 上图中节点权限，对应的权限设置为system帐号里面的节点权限设置。 当节点类型设置为某一节点类型时，处于该节点的审批人，即可以完成该节点类型拥有的权限操作。

erp功能流程表单及其流转设计

企业资源规划 大作业一 ERP生产管理系统模块 功能、流程、表单及其流转设计 班级： 姓名： 学号： 2013年11月12日

一．企业简介 1.1企业的基本情况 我本次大作业参考的企业是我国某著名彩电企业，该企业以生产彩电、数字电视机顶盒、手机为主导，跨粤港的大型高科技企业，是中国三大彩电龙头企业之一，位列中国电子百强企业15位，共有员工两万多名。该公司成立于于1988年，经过二十五年的奋斗，该公司已成长为蜚声国际的中国家电巨子，2006年集团年销售额达125.6亿港元，出口额持续9年居全国领先行列，成功挺进世界彩电十大品牌之列，成为中国电子百强名列第16位的优秀企业。作为连续六年深圳市纳税大户，截至2006年度，已累计向国家缴纳各项税金超过30亿余元，累计向社会各界捐助8000多万元，扶持500多家配套企业，解决约10万人就业。 1.2 企业的产品 该企业主要生产各种类型电视机（如液晶电视，等离子电视机等等），以车用电子产品，移动设备，电视机零部件为辅。 1.3 企业的组织结构 图一

上图是该企业总公司的企业组织基本框架图。细化到该企业在内地某城市的电视机装配厂的企业组织结构如下： 1. 该厂设有总经理，以及三个副总经理。副总经理分别负责该厂的企业运营、市场拓展和生产管理等三个方面。 2. 该厂下设销售部门、生产部门、计划采购部、人力管理部门、财务部门。销售部门主要负责销售和订单处理。生产部门主要负责制定生产计划，制定工作任务表。计划采购部主要负责组装原材料的计划与采购。人力管理部门主要负责企业人员的管理。财务部门主要负责企业财务状况的管理。 3. 该厂主要分为五个加工制造车间。每个车间设置车间主任一人。一、二车间负责电子设备的组装。三、四车间负责整体组装。五车间负责调试检验。每个车间设置一名车间主任两名这件副主任，每个车间下面包括数量不一的生产小组，每个小组设置生产小组长一名。 4. 电子装配车间内按电子设备类型分工段，总装车间按装配线分工段。 5. 车间、工段按单班制运转。 1.4 企业的需求响应策略 该厂的生产主要依据是按照市场的订单来安排生产任务，其生产类型为MTO 型，故相应的市场响应策略为为根据客户定货合同组织生产。 二．企业生产管理系统的功能结构 2.1 企业生产管理系统的组织结构及其角色定义

致远OA-流程表单制作

表单制作: 采购申書单 申Ut耳门 j?il -A Hi?tt IH?岂冷*≡?^ *i an王普n-Λ 需注意的是只可用文本框和重复表。其他控件皆不可用。双击控件，弹出下框: 修改域名称，数据类型一定要是文本。保存。在流程表 单制作里面点击新建，选择要导入的表单（XSn格 式）。

修改字段类型 AWiK AnH BHM M l flfllj SL?∣S IUn u±ηfc ~ y???? a Mftt 屯:*OE4W≡≡* 31? 心?? SjU??. . r ft.-M7S?SI* Rilft KMfe ls?8? 1 :?≡∣∣R≡ΛSJiΛ-≡-3? 2 ^Kl?affι:≡M J*3?■ 斗片■汕ti??≡■-T L ■；_ W邑门? J ：￡再t^?r*?.rt?V* m \ 徑1 ι≡?mA3CT∣i■如■ m-*"taβ 工艺路线单 MVΛ1HΦ9∩A制单甘冊UI 生亠亠如单冷码??1 ?w^ 4B 设置计算公式 』√^UK? ' 曰彗章！■七￡.；.常歪「I■惟T?=i?0划t： ??-1审环”

操作设置，设置自动带入 设这部的原因在于，审批走到某节点时，需要签字，但不允许此节点操作其他字段

在建审批流时，找到对应节点，点击节点属性，将表单绑定修改了，此节点审批时就可以完成签字，但不能操作其他字段。 查询设置： 3?.tl MMri 用皿■ ■卑6 hv∣U 華单砖：?*5assa≡ 备1$出I 砂詮■■A 庆Hi IKi■??!7?W E i￡?1 雄: ■ ?σ' SH ?az?￡2KJ l??IMVM JiiM M.??j a?. H V i ≡.? 下方显示的是查询内容的预览情况，可以根据这些去调整输出数据项。自定义查询项用于查 询时输入查询条件。 统计设置类似于查询设置。不同处是可以将统计项进行按条件的统计。例如按部门不同，统计出呈送单每个部门发起的数量。根据下方预览，可以去调整统计项、统计分组项。 m?fl F说n EW?I?τ4βκfe?ιι k∣?Λl " * 5≡t%S 审呂轉衍C $ 內I；≡?W ) SD ? W U 目前系统最常用的是组、岗位、相对角色。组可以在SyStem里面设置，将组员添加进 入某个组之后，流程设置时选择该组。相对角色主要用于设置部门负责人、部门分管领导等 特殊的相对角色。

泛微OA【开发技巧】流程表单HTML扩展开发

仅限阅读请勿传播 当您阅读本方案时，即表示您 同意不传播本方案的所有内容 流程表单HTML设计器 实现自定义控制表单元素的长度及其他常见需求实现案例 版本

目录

1.说明 难度：★★★☆☆ 预计时间：1小时 涉及代码开发：有 目标需求： 此案例适用项目人员通过流程表单HTML设计器实现自定义控制表单元素的长度。当不得不这么做的时候，请参考该方案进行适当调整。 可以按照客户要求对时间流程表单进行适当改造。 流程表单上面布局、校验、样式等功能 可以jQuery的方式进行适当改造。 知识点： 基本信息： 背景知识： 1、在阅读本教程之前,需具备html和JavaScript基本知识。 2、在阅读本教程之前,需具备jsp页面读写的基本能力。

最终效果： ●通过流程表单HTML设计器实现自定义控制表单元素的长度 ●实现隐藏表单原始边框 ●实现表单元素未输入内容时悬浮提醒的效果 ●html签字节点格式调整（内容在左，署名在右） ●html签字节点按时间排序并调整格式 2.准备工作 1、准备一台和正式环境一致操作系统的服务器。 3.（推荐）实现自主设置表单元素的长度 将附件提供的上传到服务器的/css/width/目录下面。 css文件 .zip 3.1.支持PC端及手机端HMTL模式流程表单（单个流程） 1.在代码块中单个流程引入css样式文件 如（如图1）。

（图1） 2.在需要自主设置长度单元格式设置class 例如图2 里面的class w50 表示设置这个框子里面的input 长度为50px。如果设置为w100 则限制长度为100px，具体效果如图3

ecology关于流程表单设计器自定义开发及常见场景方案分享

关于流程表单设计器自定义开发及常见场景方案分享 一、表单设计器模板如何自定义开发 表单设计器可设置自定义属性以及插入代码块，二者相辅结合、灵活运用，可实现多样化客户需求 自定义属性分为：行自定义属性(绑定在table布局tr行标签上)、单元格自定义属性(绑定在table布局td标签子元素div上)、列自定义属性(绑定在明细table此列所有td标签上)；代码块可填写Script代码块、Style样式块及直接对JS/CSS文件的引用； 二、常用开发场景实现 场景1：控制日期字段选择范围，比如费用产生日期只能选择当前日期往前十天至今天，否则不允许流程提交 实现方式: 代码块插入 封装方法：cus_judgeDateRange(fieldid, floorday, upperday) * @param {fieldid} 日期字段ID * @param {floorday} 下限天数(与当前日期比较)，空值代表不限制 * @param {upperday} 上限天数(与当前日期比较)，空值代表不限制 * @return 返回true表示在范围内，false表示超出限定范围或日期置为空 场景2：实时计算两个日期时间字段组合相差小时数，并赋值给另一字段实现方式：代码块插入 jQuery(document).ready(function(){ var bindFun = function(){ var diffhours = cus_CalTimeDiff("field31,field32", "field35,field36", 2); jQuery("[name=field39]").val(diffhours); } jQuery("#field31,#field32,#field35,#field36").bindPropertyChange(bindFun); bindFun(); });

erp功能流程表单及其流转设计

e r p功能流程表单及其 流转设计 IMB standardization office【IMB 5AB- IMBK 08- IMB 2C】

企业资源规划 大作业一 ERP生产管理系统模块 功能、流程、表单及其流转设计 班级： 姓名： 学号： 2013年11月12日 一．企业简介 企业的基本情况 我本次大作业参考的企业是我国某着名彩电企业，该企业以生产彩电、、手机为主导，跨粤港的大型高科技企业，是三大彩电龙头企业之一，位列中国电子百强企业15位，共有员工两万多名。该公司成立于于1988年，经过二十五年的奋斗，该公司已成长为蜚声国际的家电巨子，2006年集团年销售额达亿港元，出口额持续9年居全国领先行列，成功挺进世界彩电十大品牌之列，成为中国电子百强名列第16位的优秀企业。作为连续六年市纳税大户，截至2006，已累计向国家缴纳各项税金超过30亿余元，累计向社会各界捐助8000多万元，扶持500多家配套企业，解决约10万人就业。

企业的产品 该企业主要生产各种类型电视机（如液晶电视，等离子电视机等等），以车用电子产品，移动设备，电视机零部件为辅。 企业的组织结构 图一 上图是该企业总公司的企业组织基本框架图。细化到该企业在内地某城市的电视机装配厂的企业组织结构如下： 1.该厂设有总经理，以及三个副总经理。副总经理分别负责该厂的企业运营、市场拓展和生产管理等三个方面。 2.该厂下设销售部门、生产部门、计划采购部、人力管理部门、财务部门。销售部门主要负责销售和订单处理。生产部门主要负责制定生产计划，制定工作任务表。计划采购部主要负责组装原材料的计划与采购。人力管理部门主要负责企业人员的管理。财务部门主要负责企业财务状况的管理。 3.该厂主要分为五个加工制造车间。每个车间设置车间主任一人。一、二车间负责电子设备的组装。三、四车间负责整体组装。五车间负责调试检验。每个车间设置一名车间主任两名这件副主任，每个车间下面包括数量不一的生产小组，每个小组设置生产小组长一名。 4.电子装配车间内按电子设备类型分工段，总装车间按装配线分工段。 5.车间、工段按单班制运转。 企业的需求响应策略

表单流程管理详细设计

文档编号 版本号 v1.00 文档名称：固定流程管理详细设计 项目名称： 项目负责人： 编写 2002 年 06 月 27 日 校对年月日

审核年月日批准年月日开发单位软件网络（中国）有限公司

目录 详细设计说明书 (3) 1引言 (3) 1.1编写目的 (3) 1.2背景 (3) 1.3定义 (3) 1.4参考资料 (3) 2程序系统的结构 (3) 3程序1/某一类对象1（标识符）设计说明 (3) 3.1程序/某一类对象描述 (3) 3.2物理文件描述 (4) 3.3属性描述（只对应于面向对象方法） (4) 3.3.1属性1 (4) 3.3.2方法1 (4) 4程序2/某一类对象1（标识符）设计说明 (6)

详细设计说明书 1引言 1.1编写目的 说明编写这份详细设计说明书的目的，指出预期的读者。 1.2背景 说明： a.待开发的软件系统的名称； b.本项目的任务提出者、开发者、用户和运行该程序系统的计算中心； 1.3定义 列出本文件中用到的专门术语的定义和外文首字母组词的原词组。 1.4参考资料 列出有关的参考资料，如： a.本项目的经核准的计划任务书或合同、上级机关的批文； b.属于本项目的其他已发表的文件； c.本文件中各处引用到的文件资料，包括所要用到的软件开发标准。 列出这些文件的标题、文件编号、发表日期和出版单位，说明能够取得这些文件的来源。2程序系统的结构

表单管理页面结构图3页面设计 3.1submenu9 3.1.1功能： 同流程管理 3.1.2界面： 3.1.3调用页面 formflow.jsp 3.1.4输入参数： 无 3.1.5输出参数： 无 3.1.6处理说明：