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

本文涉及的产品
可视分析地图(DataV-Atlas),3 个项目,100M 存储空间
简介: 基于若依的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轻松玩转一站式实时仓库
本场景介绍如何利用阿里云MaxCompute、实时计算Flink和交互式分析服务Hologres开发离线、实时数据融合分析的数据大屏应用。
阿里云实时数仓实战 - 项目介绍及架构设计
课程简介 1)学习搭建一个数据仓库的过程,理解数据在整个数仓架构的从采集、存储、计算、输出、展示的整个业务流程。 2)整个数仓体系完全搭建在阿里云架构上,理解并学会运用各个服务组件,了解各个组件之间如何配合联动。 3&nbsp;)前置知识要求 &nbsp; 课程大纲 第一章&nbsp;了解数据仓库概念 初步了解数据仓库是干什么的 第二章&nbsp;按照企业开发的标准去搭建一个数据仓库 数据仓库的需求是什么 架构 怎么选型怎么购买服务器 第三章&nbsp;数据生成模块 用户形成数据的一个准备 按照企业的标准,准备了十一张用户行为表 方便使用 第四章&nbsp;采集模块的搭建 购买阿里云服务器 安装 JDK 安装 Flume 第五章&nbsp;用户行为数据仓库 严格按照企业的标准开发 第六章&nbsp;搭建业务数仓理论基础和对表的分类同步 第七章&nbsp;业务数仓的搭建&nbsp; 业务行为数仓效果图&nbsp;&nbsp;
相关文章
|
2月前
基于若依的ruoyi-nbcio流程管理系统增加仿钉钉流程设计(七)
基于若依的ruoyi-nbcio流程管理系统增加仿钉钉流程设计(七)
26 1
基于若依的ruoyi-nbcio流程管理系统增加仿钉钉流程设计(七)
|
2月前
|
移动开发 前端开发
基于若依的ruoyi-nbcio流程管理系统自定义业务流程出现多个时相应的流程选择问题(二)
基于若依的ruoyi-nbcio流程管理系统自定义业务流程出现多个时相应的流程选择问题(二)
30 3
|
2月前
|
XML JSON 数据格式
基于若依的ruoyi-nbcio流程管理系统增加仿钉钉流程设计(五)
基于若依的ruoyi-nbcio流程管理系统增加仿钉钉流程设计(五)
29 2
|
2月前
基于若依的ruoyi-nbcio流程管理系统增加仿钉钉流程设计(二)
基于若依的ruoyi-nbcio流程管理系统增加仿钉钉流程设计(二)
25 1
|
2月前
基于若依的ruoyi-nbcio流程管理系统增加仿钉钉流程设计(三)
基于若依的ruoyi-nbcio流程管理系统增加仿钉钉流程设计(三)
24 0
|
2月前
|
JSON 移动开发 前端开发
基于若依的ruoyi-nbcio流程管理系统一种简单的动态表单模拟测试实现(二)
基于若依的ruoyi-nbcio流程管理系统一种简单的动态表单模拟测试实现(二)
30 2
|
2月前
|
移动开发 前端开发
基于若依的ruoyi-nbcio流程管理系统一种简单的动态表单模拟测试实现(三)
基于若依的ruoyi-nbcio流程管理系统一种简单的动态表单模拟测试实现(三)
21 2
|
2月前
|
移动开发 前端开发 数据库
基于若依的ruoyi-nbcio流程管理系统一种简单的动态表单模拟测试实现(一)
基于若依的ruoyi-nbcio流程管理系统一种简单的动态表单模拟测试实现(一)
33 1
|
2月前
|
前端开发 数据库
基于若依的ruoyi-nbcio流程管理系统增加流程节点配置(二)
基于若依的ruoyi-nbcio流程管理系统增加流程节点配置(二)
32 1
|
2月前
|
移动开发 前端开发
基于若依的ruoyi-nbcio流程管理系统自定义业务实现一种简单的动态任务标题需求
基于若依的ruoyi-nbcio流程管理系统自定义业务实现一种简单的动态任务标题需求
35 1

热门文章

最新文章

  • 1
    流量控制系统,用正则表达式提取汉字
    25
  • 2
    Redis09-----List类型,有序,元素可以重复,插入和删除快,查询速度一般,一般保存一些有顺序的数据,如朋友圈点赞列表,评论列表等,LPUSH user 1 2 3可以一个一个推
    26
  • 3
    Redis08命令-Hash类型,也叫散列,其中value是一个无序字典,类似于java的HashMap结构,Hash结构可以将对象中的每个字段独立存储,可以针对每字段做CRUD
    26
  • 4
    Redis07命令-String类型字符串,不管是哪种格式,底层都是字节数组形式存储的,最大空间不超过512m,SET添加,MSET批量添加,INCRBY age 2可以,MSET,INCRSETEX
    27
  • 5
    S外部函数可以访问函数内部的变量的闭包-闭包最简单的用不了,闭包是内层函数+外层函数的变量,简称为函数套函数,外部函数可以访问函数内部的变量,存在函数套函数
    24
  • 6
    Redis06-Redis常用的命令,模糊的搜索查询往往会对服务器产生很大的压力,MSET k1 v1 k2 v2 k3 v3 添加,DEL是删除的意思,EXISTS age 可以用来查询是否有存在1
    30
  • 7
    Redis05数据结构介绍,数据结构介绍,官方网站中看到
    22
  • 8
    JS字符串数据类型转换,字符串如何转成变量,+号只要有一个是字符串,就会把另外一个转成字符串,- * / 都会把数据转成数字类型,数字型控制台是蓝色,字符型控制台是黑色,
    20
  • 9
    JS数组操作---删除,arr.pop()方法从数组中删除最后一个元素,并返回该元素的值,arr.shift() 删除第一个值,arr.splice()方法,删除指定元素,arr.splice,从第一
    20
  • 10
    定义好变量,${age}模版字符串,对象可以放null,检验数据类型console.log(typeof str)
    19