FormMaking表单设计器V3.8发布,数据表格上线,支持多选、多级表头、列模板自定义、操作列、分页等设置

介绍

FormMaking 是基于Vue的可视化表单设计器,赋能企业实现可视化低代码开发模式;帮助开发者从传统枯燥的表单代码中解放出来,更多关注业务,快速提高效率,节省研发成本。 目前已经在OA系统、考试系统、报表系统、流程管理等众多项目中得到了广泛使用。

FormMaking 采用 VueElement 进行页面构建,内置 i18n 国际化解决方案,支持二次扩展开发,支持自定义组件扩展,目前支持渲染 ElementAntd 组件库。

直观的拖拽操作

FormMaking 通过可视化拖拽来创建表单,方便易用。

在这里插入图片描述

丰富的表单字段

FormMaking 提供了各种类型的表单字段,包括布局、容器、文本、选择框、对话框、数据表格、自定义等,基本可以满足各种场景下的复杂表单创建。

在这里插入图片描述
FormMaking 除了可以使用内置的字段,还支持将自己的组件引入到设计器中进行配置使用。

在这里插入图片描述

响应式设计

FormMaking 的表单是全响应式的,可以在任何设备上,如桌面,平板电脑或者智能手机上很好的适配。

在这里插入图片描述

数据源管理

FormMaking 可以对表单使用的数据进行管理,方便进行前后的数据交互。

在这里插入图片描述

表单事件交互

FormMaking 可以通过事件配置,完成表单复杂的业务逻辑操作。

在这里插入图片描述

可扩展性

FormMaking 还具有易用性和可扩展性,可以根据自己的需求,轻松地扩展您的表单功能。提供了全面的API文档,帮助您快速接入您的系统,从而更好地满足您的业务需求。

在这里插入图片描述

数据表格

新版本迎来了数据表格,为表单提供了更好的数据列表的处理能力,支持多选、多级表头、列模板自定义、操作列、分页等设置;接下来一起看看数据表格的功能。

表格列设置

字段属性 - 列设置中进行表格列设置。

在这里插入图片描述

多级表头

在列设置中添加多级表头。

在这里插入图片描述

自定义列

在列设置中点击每项前方的编辑按钮,即可弹出详细的编辑区域,对表格列进行更加详细的设置,包括列宽、对齐方式、列模板等。

在这里插入图片描述

添加操作列

操作列设置中打开显示操作列,配置操作按钮,点击编辑图标可对事件进行编辑。

在这里插入图片描述
方法中可以通过 arguments[0] 获取到当前行数据进行操作:

function () {const {row // 点击当前行的操作按钮,获取当前行的数据。} = arguments[0]
}

分页

数据结构配置

启用分页后,数据需要按照配置的数据结构进行返回,不然分页会不起作用。

在这里插入图片描述
需要的返回数据结构如下:

{"records": [...],"total": 100,"currentPage": 1,"pageSize": 10
}
分页事件配置

在动作设置中配置 onPageChange 事件,在当前页或者每页数量修改时会触发该事件,并且传递页面分页参数:

function () {const {pageSize, // 数据结构中配置的每页数量参数currentPage // 数据结构中配置的当前页参数} = arguments[0]
}

在这里插入图片描述

数据 CRUD

通过数据表格可以简单快速的完成数据CRUD操作,可以来看下效果:

在这里插入图片描述
更多的功能可以前往官网进行体验。

FormMaking 官网地址:https://form.making.link

如需本地部署测试版本可联系:https://form.making.link/contact

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

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

相关文章

MyBatis-plus这么好用,不允许还有人不会

你好呀,我是 javapub. 做 Java 的同学都会用到的三件套,Spring、SpringMV、MyBatis。但是由于使用起来配置较多,依赖冲突频发。所有,各路大佬又在这上边做了包装,像我们常用的 SpringBoot、MyBatisPlus。 基于当前要…

C语言的数据结构:图的操作

🛺图的遍历: 注意:在遍历的过程中,可能会出现 回路 ( 已经访问过的节点还要重新访问一次 ) \color{orange}回路(已经访问过的节点还要重新访问一次) 回路(已经访问过的节点还要重新访问一次). 当从A开始访问时,先访问…

heic格式转化jpg,手把手教你将heic转换成jpg【办公必备】

一、什么是heic heic格式是一种高效的图片格式,它可以在较小的文件大小下提供高质量的图片。 二、如何打开heic 然而,这种图片因其格式的特殊性,在实际应用中仍存在一些问题:压缩效果可能不够理想,一些老旧的软件和设…

stm32学习笔记---USART串口外设(理论部分)

目录 USART简介 USART的框图 串口的引脚 USART的基本结构 数据帧 起始位侦测 数据采样 波特率发生器 USD转串口模块的原理图 声明:本专栏是本人跟着B站江科大的视频的学习过程中记录下来的笔记,我之所以记录下来是为了方便自己日后复习。如果你…

TypeScript 中 const enum 和 enum 的核心区别在哪?日常开发应该使用哪个?

编译结果 enum 会生成一个对象,引用的地方保持对其引用 const enum 会擦除 enum 定义的代码,引用的地方会生成 inline code 使用enum: 使用const enum: PS:编译选项 preserveConstEnums 可以使 const enum 不去擦除 …

WPDRRC信息安全体系架构模型

构建信息安全保障体系框架应包括技术体系、组织机构体系和管理体系等三部分,也就是说:人、管理和技术手段是信息安全架构设计的三大要素,而构成动态的信息与网络安全保障体系框架是实现系统的安全保障。 1.WPDRRC信息安全模型的定义 WPDRRC…

Vue3快速上手--3小时掌握

1. Vue3简介 2020年9月18日,Vue.js发布版3.0版本,代号:One Piece(n经历了:4800次提交、40个RFC、600次PR、300贡献者官方发版地址:Release v3.0.0 One Piece vuejs/core截止2023年10月,最新的…

llama-factory训练RLHF-PPO模型

理论上RLHF(强化学习)效果比sft好,也更难训练。ppo有采用阶段,步骤比较多,训练速度很慢. 记录下工作中使用llama-factory调试rlhf-ppo算法流程及参数配置,希望对大家有所帮助. llama-factory版本: 0.8.2 一 rlhf流程 ppo训练流程图如下, 会…

【Kubernetes】加入节点Node及问题

命令 分别再node节点机器上,执行如下命令: kubeadm join [master机器ip:端口] --token [master机器初始化生成的token] --discovery-token-ca-cent-hash [master机器初始化生成的hash]问题 由于清屏没有记住token和hash的时候: 1&#xff…

Log4j日志框架讲解(全面,详细)

Log4j概述 Log4j是Apache下的一款开源的日志框架,通过在项目中使用 Log4J,我们可以控制日志信息输出到控制台、文件、甚至是数据库中。我们可以控制每一条日志的输出格式,通过定义日志的输出级别,可以 更灵活的控制日志的输出过程…

如何指定Microsoft Print To PDF的输出路径

在上一篇文章中,介绍了三种将文件转换为PDF的方式。默认情况下,在Microsoft Print To PDF的首选项里,是看不到输出路径的设置的。 需要一点小小的手段。 运行输入 control 打开控制面板,选择硬件和声音下的查看设备和打印机 找到…

【ubuntu18.04】 局域网唤醒 wakeonlan

ai服务器经常因为断电,无法重启,当然可以设置bios 来电启动。 这里使用局域网唤醒配置。 自动开关机设置 工具:ethtool 端口 : enp4s0 Wake-on: d 表示禁用Wake-on: g 激活 ,例如:ethtool -s eth0 wol g 配置/etc/rc.local ,这个文件不存在,自己创建工具下载 tengxun W…

【前端vue3】TypeScrip-类型推论和类型别名

类型推论 TypeScript里,在有些没有明确指出类型的地方,类型推论会帮助提供类型。 例如: 变量xiaoc被推断类型为string 如重新给xiaoc赋值数字会报错 let xiaoc "xiaoc"xiaoc 1111111111111如没有给变量指定类型和赋值&#xf…

专题七:Spring源码之BeanDefinition

上一篇我们通过refresh方法中的第二个核心方法obtainBeanFactory,通过createBeanFacotry创建容Spring的初级容器,并定义了容器的两个核心参数是否允许循环引用和覆盖。现在容器有了,我们来看看容器里的第一个重要成员BeanDefinition。 进入lo…

从需求是如何最终抽象成最基本的传参入参

第一层:出参和入参 用通俗的话讲,就是给客户提供服务的一种方式,需要包含入参和出参 。入口参数就是程序执行时会调用的参数,出口参数就是程序执行完会返回的参数。入参的值是被调函数需要, 出参的值是主调函数需要的…

【Linux系统】CUDA的安装与graspnet环境配置遇到的问题

今天在安装环境时遇到报错: The detected CUDA version (10.1) mismatches the version that was used to compile PyTorch (11.8). Please make sure to use the same CUDA versions. 报错原因:安装的cuda版本不对应,我需要安装cuda的版本…

windows远程连接无法复制文件

windows远程桌面无法复制文件 解决方案 打开任务管理器管理器,在详细信息界面,找到rdpclip.exe进程,选中并点击结束任务,杀死该进程。 快捷键 win r 打开运行界面,输入 rdpclip.exe ,点击确定运行。即可解决无法复制文件问题。…

产品设计的8大步骤

产品设计,通俗来说就是将创新想法或概念转化为落地实体的过程。一般来说,一个成功的产品应当具有创新性、美观性、实用性、可持续性以及经济效益,从而满足用户的使用需求以及市场的发展需求。产品设计也并不是一件简单的事情,产品…

经典的卷积神经网络模型 - AlexNet

经典的卷积神经网络模型 - AlexNet flyfish AlexNet 是由 Alex Krizhevsky、Ilya Sutskever 和 Geoffrey Hinton 在 2012 年提出的一个深度卷积神经网络模型,在 ILSVRC-2012(ImageNet Large Scale Visual Recognition Challenge 2012)竞赛中…

python学习-list

List(列表的定义语法) [元素1, 元素2, 元素3, ......] 什么是元素? 数据容器内的每一份数据,都称之为元素 元素的类型有限制吗? 元素的数据类型没有任何限制,甚至元素也可以是列表,这样就定义了嵌套列表 但是打印…