ruoyi-nbcio-plus基于vue3的flowable收回任务后重新进行提交表单的处理

更多ruoyi-nbcio功能请看演示系统

gitee源代码地址

前后端代码: https://gitee.com/nbacheng/ruoyi-nbcio

演示地址:RuoYi-Nbcio后台管理系统 http://122.227.135.243:9666/

更多nbcio-boot功能请看演示系统 

gitee源代码地址

后端代码: https://gitee.com/nbacheng/nbcio-boot

前端代码:https://gitee.com/nbacheng/nbcio-vue.git

在线演示(包括H5) : http://122.227.135.243:9888

1、后端的处理

      因为这个收回审批的提交跟原先的VForm表单提交不一样了,如下界面,这个是可以表单信息里进行修改了,修改后要能提交保存起来,因为原先肯定没有考虑这些

       因为原先提交的时候保存起来,在变量里面,所以用下面的formConf.setFormData(variables);就可以了,但这个variables需求前端进行重新设置修改后的值。

FormConf formConf = new FormConf();Map<String, Object> formModel = JsonUtils.parseObject(formInfo.getContent(), Map.class);if (null != formModel && !formModel.isEmpty()) {formConf.setTitle(title);formConf.setDisabled(true);formConf.setFormBtns(false);formConf.setFormModel(formModel);formConf.setFormData(variables);procFormList.add(formConf);}

2、前端的处理

判断是否是退回到第一个节点

taskFormVisible.value = data.existTaskForm;if (taskFormVisible.value) {taskFormData.value = data.taskFormData;}if(data.startUserNode) {startUserForm.value.isStartUserNode = true;}formVisible.value = true;nextTick(() => {processFormList.value.forEach((item: any, index: any) => {if (item.disabled && !startUserForm.value.isStartUserNode) {vFormRenderRef.value[index].disableForm();}})})

是的话,不要disable了,可以进行编辑,

同时通过任务修改如下:

/** 通过任务 */const handleComplete = () => {const isExistTaskForm = taskFormRef !== undefined;// 校验表单taskFormRef.value?.validate(async (valid: boolean) => {if (valid) {if (isExistTaskForm) {const data = await vFormRenderRef.value[0]?.getFormData();const Widgetlist = await vFormRenderRef.value[0]?.getFieldWidgets();//替换文件上传成功后的文件名称与url,以便后面回显用let fileUpload = Widgetlist?.filter(item => item.type === "file-upload");fileUpload?.forEach((fileitem) => {data[`${fileitem.name}`]?.forEach((dataitem,index) => {data[`${fileitem.name}`][index].name = data[`${fileitem.name}`][index].response.data?.newFileName;data[`${fileitem.name}`][index].url = data[`${fileitem.name}`][index].response.data?.url;})})//替换图片上传成功后的文件名称与url,以便后面回显用let picUpload = Widgetlist?.filter(item => item.type === "picture-upload");picUpload?.forEach((picitem) => {data[`${picitem.name}`]?.forEach((dataitem,index) => {data[`${picitem.name}`][index].name = data[`${picitem.name}`][index].response.data?.newFileName;data[`${picitem.name}`][index].url = data[`${picitem.name}`][index].response.data?.url;})})const variables = data;taskFormData.formValue = data;variables.variables = taskFormData;taskForm.variables = variables;}console.log("handleComplete taskForm",taskForm)const res = await complete(taskForm)proxy?.$modal.msgSuccess(res.msg);goBack();}});}

3、效果图如下:

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/644398.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Linux加强篇-Shell命令脚本

目录 ⛳️推荐 编写Shell脚本 编写简单的脚本 接收用户的参数 判断用户的参数 ⛳️推荐 前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。点击跳转到网站 编写Shell脚本 Shell脚本命令的工作方式有下面…

sql server 恢复数据库、单表数据的方法

1、查看备份文件在哪个路径、一般文件夹名都是叫&#xff1a;Backup 2、下面开始还原&#xff08;恢复&#xff09;数据库&#xff0c;对着【数据库】右键--【新建数据库】--然后随便命名&#xff0c;如下图 3、你要是想改路径的话就拉过来&#xff0c;2行都要改、不想多事就直…

电力厂推土车倾斜角度预警系统的设计与应用

引言 在电力厂等工业生产现场&#xff0c;推土车作为一种重要的运输设备&#xff0c;广泛应用于各种材料和物品的搬运工作。然而&#xff0c;推土车在行驶过程中&#xff0c;特别是在不平坦的地面上&#xff0c;容易发生侧倾甚至翻车的危险情况。为了有效预防这类安全事故的发…

安捷伦Agilent N5230A 300KHZ至20G矢量网络分析仪

安捷伦Agilent N5230A 300KHZ至20G矢量网络分析仪 N5230A主要参数 2端口300KHz—6、13.5GHz 2端口300KHz—20、40、50GHz 4端口300KHz—20GHz&#xff0c;具有混模S参数和高级夹具校正功能 测量S参数和增益压缩的频率和功率扫描 基本混频器/转换器测量 低至2μs脉冲宽度…

大模型的实践应用22-谷歌Gemma AI大模型的架构原理,以及Gemma模型的部署安装本地教程

大家好,我是微学AI,今天给大家介绍一下大模型的实践应用22-谷歌Gemma AI大模型的架构原理,以及Gemma模型的部署安装本地教程。谷歌Gemma AI大模型是由Google AI团队开发并开源。Gemma模型采用Transformer编码器-解码器架构,并加入了一些改进,例如使用稀疏注意力机制来提高推…

水平越权,垂直越权

水平越权和垂直越权 水平越权 首先自己创建一个账号 然后在自己的修改密码&#xff0c;抓包&#xff0c;修改用户名等 但一般都会固定&#xff0c;它会固定当前用户名 垂直越权 不用登录就可以删除 当我们复制管理员的删除地址&#xff0c;然后访问它 它会跳出登录地址&#…

javaWeb项目-社区医院管理服务系统功能介绍

项目关键技术 开发工具&#xff1a;IDEA 、Eclipse 编程语言: Java 数据库: MySQL5.7 框架&#xff1a;ssm、Springboot 前端&#xff1a;Vue、ElementUI 关键技术&#xff1a;springboot、SSM、vue、MYSQL、MAVEN 数据库工具&#xff1a;Navicat、SQLyog 1、Java技术 Java语…

【软件基础】反编译工具dnSpy反编译程序步骤

文章目录 一、dnSpy介绍二、使用版本三、使用步骤 一、dnSpy介绍 dnSpy是一款开源的.NET程序集反编译工具&#xff0c;它允许用户查看和编辑.NET程序集的源代码。dnSpy支持反编译.NET程序集、查看IL代码、编辑IL代码、调试.NET程序集等功能。用户可以使用dnSpy来分析和理解.NE…

Android SDK Manager安装Google Play Intel x86 Atom_64 System Image依赖问题

Package Google Play Intel x86 Atom_64 System Image,Android API R, revision 2 depends on SDK Platform Android R Preview, revision 2 问题 一开始以为网络还有依赖包没有勾选&#xff0c;尝试了很多次&#xff0c;勾选这边报错对应的license即可。此时点击一下其他licen…

数据库轻松切换:解读Spring中的AbstractRoutingDataSource

欢迎来到我的博客&#xff0c;代码的世界里&#xff0c;每一行都是一个故事 数据库轻松切换&#xff1a;解读Spring中的AbstractRoutingDataSource 前言AbstractRoutingDataSource介绍作用和优势&#xff1a;作用&#xff1a;优势&#xff1a; 使用 AbstractRoutingDataSource …

【Bugku-web】my-first-sqli

1.打开场景&#xff0c;用户名输入1 or 1 1 -- -&#xff0c;密码随便输。 2.得到flag值

Linux——NFS网络文件系统

在生产环境中共享宿主目录可以用于集中管理账户 一、存储设备 DAS 是直连存储相当于移动硬盘 NAS 是网络文件系统&#xff0c;挂载后可以直接访问 SAN 存储区域网络 IPSAN 网线连接 共享的是设备&#xff0c;需要挂载后分区使用 FCSAN 光纤连接 二、服务的管理 1、安…