基于若依的ruoyi-nbcio流程管理系统一种简单的动态表单模拟测试实现(四)

简介: 基于若依的ruoyi-nbcio流程管理系统一种简单的动态表单模拟测试实现(四)

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

gitee源代码地址

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

演示地址:RuoYi-Nbcio后台管理系统

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

gitee源代码地址

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

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

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

接上一节,今天讲动态更新数据的方法

1、后端动态更新代码如下:

/**
     * 根据主表名,关键字和数据动态更新一条记录
     * @param tableName 主表名称
     */
    @SaCheckPermission("workflow:form:edit")
    @PostMapping(value = "/updateDataById")
    public R<?> updateDataById(@RequestBody FormDataVo formDataVo) {
        return R.ok(formService.updateDataById(formDataVo));
    }
@Override
  public int updateDataById(FormDataVo formDataVo) {
    return baseMapper.updateDataById(formDataVo.getTableName(), formDataVo.getPrimaryKey(),Long.valueOf(formDataVo.getId()),formDataVo.getUpdateMap());
  }
int updateDataById(@Param("tableName") String tableName, @Param("primaryKey") String primaryKey,
                       @Param("id") Long id, @Param("updateMap") Map<String,Object> updateMap); 
<update id="updateDataById">
        UPDATE ${tableName} SET
        <foreach collection="updateMap" item="val" index="key" separator=",">
            ${key} = #{val}
        </foreach>
        WHERE ${primaryKey} = #{id}
    </update>

2、前端代码如下:

/** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          this.buttonLoading = true;
          console.log("submitForm this.form",this.form)
          const id = this.form[this.primaryKey] || this.ids
          const formData = {
            tableName: this.tableName,
            primaryKey: this.primaryKey,
            id: id,
            updateMap: this.form
          }
          console.log("submitForm formData",formData)
          if (id != null) {
            updateDataById(formData).then(response => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            }).finally(() => {
              this.buttonLoading = false;
            });
          } 
        }
      });
    },

3、效果图如下:


相关实践学习
基于Hologres轻量实时的高性能OLAP分析
本教程基于GitHub Archive公开数据集,通过DataWorks将GitHub中的项⽬、行为等20多种事件类型数据实时采集至Hologres进行分析,同时使用DataV内置模板,快速搭建实时可视化数据大屏,从开发者、项⽬、编程语⾔等多个维度了解GitHub实时数据变化情况。
阿里云实时数仓实战 - 用户行为数仓搭建
课程简介 1)学习搭建一个数据仓库的过程,理解数据在整个数仓架构的从采集、存储、计算、输出、展示的整个业务流程。 2)整个数仓体系完全搭建在阿里云架构上,理解并学会运用各个服务组件,了解各个组件之间如何配合联动。 3&nbsp;)前置知识要求:熟练掌握 SQL 语法熟悉 Linux 命令,对 Hadoop 大数据体系有一定的了解 &nbsp; 课程大纲 第一章&nbsp;了解数据仓库概念 初步了解数据仓库是干什么的 第二章&nbsp;按照企业开发的标准去搭建一个数据仓库 数据仓库的需求是什么 架构 怎么选型怎么购买服务器 第三章&nbsp;数据生成模块 用户形成数据的一个准备 按照企业的标准,准备了十一张用户行为表 方便使用 第四章&nbsp;采集模块的搭建 购买阿里云服务器 安装 JDK 安装 Flume 第五章&nbsp;用户行为数据仓库 严格按照企业的标准开发 第六章&nbsp;搭建业务数仓理论基础和对表的分类同步 第七章&nbsp;业务数仓的搭建&nbsp; 业务行为数仓效果图&nbsp;&nbsp;
相关文章
|
安全 前端开发 数据安全/隐私保护
BurpSuite进阶篇--自动化挖掘越权漏洞
BurpSuite进阶篇--自动化挖掘越权漏洞
1551 2
|
测试技术 Apache 开发工具
Apache Cordova开发环境搭建(二)VS Code
原文:Apache Cordova开发环境搭建(二)VS Code 版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u011127019/article/details/56335719 ...
3870 0
|
9月前
|
存储 Android开发 数据安全/隐私保护
安卓手机和苹果手机如何快速完成文件互传?安卓手机文件传到苹果手机方法分享
在日常工作中,跨设备文件传输需求频繁,尤其是Android与iOS之间。本文推荐一款名为LocalSend的工具,支持Android、iOS、Windows、Mac平台,通过局域网实现快速、安全的文件互传,无需互联网连接。操作简便,界面直观,适合多设备用户使用。
3441 1
关于 CentOS8出现“Error: Failed to download metadata for repo ‘AppStream‘: xxxx” 的解决方法
关于 CentOS8出现“Error: Failed to download metadata for repo ‘AppStream‘: xxxx” 的解决方法
11295 0
关于 CentOS8出现“Error: Failed to download metadata for repo ‘AppStream‘: xxxx” 的解决方法
|
机器学习/深度学习 人工智能 自然语言处理
智能化软件测试:AI驱动的自动化测试策略与实践####
本文深入探讨了人工智能(AI)在软件测试领域的创新应用,通过分析AI技术如何优化测试流程、提升测试效率及质量,阐述了智能化软件测试的核心价值。文章首先概述了传统软件测试面临的挑战,随后详细介绍了AI驱动的自动化测试工具与框架,包括自然语言处理(NLP)、机器学习(ML)算法在缺陷预测、测试用例生成及自动化回归测试中的应用实例。最后,文章展望了智能化软件测试的未来发展趋势,强调了持续学习与适应能力对于保持测试策略有效性的重要性。 ####
|
JavaScript 前端开发
vue3教程,如何手动获取后端数据(入门到精通3,新人必学篇)
本文提供了一个Vue 3教程,讲解了如何使用axios库手动从后端获取数据,包括安装axios、配置后端访问地址、编写路由地址、发起HTTP请求以及在组件中读取和打印响应数据的步骤。
2721 0
vue3教程,如何手动获取后端数据(入门到精通3,新人必学篇)
|
JSON 移动开发 前端开发
基于若依的ruoyi-nbcio流程管理系统一种简单的动态表单模拟测试实现(二)
基于若依的ruoyi-nbcio流程管理系统一种简单的动态表单模拟测试实现(二)
296 2
命令行下使用javac编译文件时出现 错误: 编码 GBK 的不可映射字符
命令行下使用javac编译文件时出现 错误: 编码 GBK 的不可映射字符
786 0
|
分布式计算 Java 测试技术
Spark 单元测试报Error:(26, 16) java: 程序包sun.misc不存在
Spark 单元测试报Error:(26, 16) java: 程序包sun.misc不存在
613 0