activiti表单设计器_基于Vue,ElementUI开发的一款表单设计器

最新推荐文章于 2020-11-25 04:57:46 发布

weixin_39968266

最新推荐文章于 2020-11-25 04:57:46 发布

阅读量1k

点赞数

文章标签： activiti表单设计器 elementui cdn elementui 加载中 elementui 自定义样式 elementui 获取表格数据 vue elementui 文本编辑器图片上传

介绍

基于Vue,ElementUI开发的一款表单设计器，提高表单开发效率的利器，让开发者从枯燥的表单代码编写中解放出来

工具地址：

http://tools.xiaoyaoji.cn/form

GitHub地址：

https://github.com/GavinZhuLei/vue-form-making

特性

可视化配置页面
提供栅格布局，并采用flex实现对齐
一键预览配置的效果
一键生成配置json数据
一键生成代码，立即可运行
提供自定义组件满足用户自定义需求
提供远端数据接口，方便用户需要异步获取数据加载
提供功能强大的高级组件
支持表单验证
快速获取表单数据

CDN

安装

npm install form-making -S

效果截图

使用拖拽的方式可以就可以使用左边的组件设计表单页面

点击选中组件，右边可自定义配置组件，样式，验证等

设计完页面后，可点击预览图实时查看表单效果

设计完可生成完整的可运行的HTML文件，或是Vue组件，可放进Vue项目中引用

问题交流

QQ群：902048874

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

weixin_39968266

关注关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
activiti表单设计器_基于Vue,ElementUI开发的一款表单设计器

介绍基于Vue,ElementUI开发的一款表单设计器，提高表单开发效率的利器，让开发者从枯燥的表单代码编写中解放出来工具地址：http://tools.xiaoyaoji.cn/formGitHub地址：https://github.com/GavinZhuLei/vue-form-making特性可视化配置页面提供栅格布局，并采用flex实现对齐一键预览配置的效果一键生成配置json数据一键生...
复制链接

扫一扫

探索Form Generator Antdv：自动化表单构建利器

gitblog_00091的博客

04-03

569

探索Form Generator Antdv：自动化表单构建利器项目地址:https://gitcode.com/fuzui/form-generator-antdv Form Generator Antdv 是一个基于Ant Design Vue（Antdv）的动态表单生成器，它旨在简化前端开发者在构建可配置、可扩展的表单时的工作流程。此项目利用了最新的Web技术和最佳实践，为用户提供了一种高...

vue-bpmn-element:bpmn.js流程设计器组件，基于vue-elementui美化属性面板，满足90％以上的业务需求

03-20

bpmn.js流程设计器组件 1、调整设计器UI布局，基于vue-elementui美化属性面板 2、支持设置任务变量、表达式、分支条件等，满足90%以上的业务需求 3、支持flowable和activiti 组件常用方法 1，配置支持flowable（激活） < vue xss=removed></ vue> 2，组件还在完善中，如果有需要扩展需求，可以参考以下三个事件： // 监听选择事件，改变属性栏表单的显示与隐藏 this.modeler.on("selection.changed", e => { // TODO }) // 监听内容变化事件，改变属性栏的值 this.modeler.on("element.changed", e => { // TODO }) // 监听点击事件 this.modeler.on("el

参与评论您还未登录，请先登录后发表或查看评论

基于 vue 和 element-ui 实现的可视化表单设计器

04-19

基于Vue的可视化表单设计器，让表单开发简单而高效；高级版本目前已支持 Vue3。MakingForm 表单设计器（基于可视化操作快速设计出表单页面）。GenerateForm 表单生成器（根据设计器中获取的配置 json 数据，快速渲染出表单页面

Antd Vue 表单生成快速开发指南，内附强大的表单设计器

GavinZhulei的博客

02-24

8406

之前发布了一款基于Element的表单设计器，可以快速设计和生成表单，设计器地址：http://form.xiaoyaoji.cn/。现在我可以告诉大家，Antd表单支持来了，可以使用设计器设计好表单后，快速生成Antd表单，提供了强大的Api操作。接下来就来看看如何快速生成表单： 1. 引入 Ant Design Vue npm install ant-design-vue -S import...

bootstrap3 表单构建器_牛X Vue+element-ui 可视化表单设计生成器

weixin_39887531的博客

11-20

1394

基于Vue,ElementUI开发的一款表单设计器

weixin_34184561的博客

09-28

486

介绍基于Vue,ElementUI开发的一款表单设计器，提高表单开发效率的利器，让开发者从枯燥的表单代码编写中解放出来工具地址：tools.xiaoyaoji.cn/form GitHub地址：github.com/GavinZhuLei… 特性可视化配置页面提供栅格布局，并采用flex实现对齐一键预览配置的效果一键生成配置json数据一键生成代码，立即可运行提供自定义组件满足...

基于 ElementUI 的表单设计器

08-26

综上所述，"基于ElementUI的表单设计器"——f-render为开发者提供了一个高效、便捷的表单开发解决方案，涵盖了Vue.js、ElementUI、动态表单设计、数据验证等多个重要知识点。掌握这些技能，不仅可以提高开发速度，还...

Vue+Bpmnjs整合设计器和查看器，支持高度自定义，基于github上的项目进行了深度优化

02-28

一个基于 `bpmn.js`，`Vue 2.x` 和 `ElementUI` 开发的流程设计器。本项目从原项目衍生出来，升级了最新版本的bpmnjs，并升级到了vue2.7，支持新特性。您可以使用它在浏览器上查看和编辑符合 `BPMN 2.0` 规范的...

基于Vue的entfrm-boot无代码开发平台设计源码

最新发布

05-24

本项目是基于Vue的entfrm-boot无代码开发平台设计源码，包含546个文件，其中包括190个Java文件、87个Vue文件、63个JavaScript文件、36个XML文件、88个SVG文件、32个PNG文件、10个VM文件、9个SCSS文件、5个YAML文件和...

基于Bpmn.js、Vue 2.x 和ElementUI的流程编辑器（前端部分），支持监听器，扩展属性，表单等配置，可自由扩展

06-26

一个基于 bpmn.js，Vue 2.x 和 ElementUI 开发的 BPMN 2.0 流程设计器（网页版），您可以使用它在浏览器上查看和编辑符合 BPMN 2.0 规范的流程文件。支持监听器，扩展属性，表单等配置，可自由扩展。项目内置 ...

FormDesigner基于AntDesign和jQueryUI的表单设计器

08-10

Form Designer 基于Ant Design 和 jQuery UI 的表单设计器

vue_form_design:基于Vue3.0的表单设计器

03-16

vue_form_design:基于Vue3.0的表单设计器

k-form-design:基于vue Ant-Design 的表单设计器，快速开发

05-10

表单设计器 k-form-design 简介设计器布局参考form-generator项目，基于vue和ant-design-vue实现的表单设计器，样式使用less作为开发语言，主要功能是能通过简单操作来生成配置表单，生成可保存的JSON数据，并能将JSON还原成表单，使表单开发更简单更快速注：该项目不兼容vue3.0项目，暂无后续兼容vue3.0的计划特性可视化配置页面提供栅格、表格等布局布局嵌套使用提供预览、保存、生成json、生成可执行代码等操作支持表单验证快速获取表单数据 自定义组件插入 自定义主题色组件 KFormDesign 表单设计器（基于可视化操作快速设计出表单页面，生成配置json或页面） KFormBuild 表单构建器（根据设计器中获取的配置json数据，快速构建出表单页面）安装 # 使用yarn yarn add k-form-design

Activiti表单研究

10-15

结合例子简单介绍了Activiti的内置表单和外置表单

activiti表单设计器_可拖拽布局的表单设计器新版发布，支持 Ant Design Vue

weixin_39856269的博客

11-25

1931

基于 Vue, ElementUI 开发的一款表单设计器，目前开源版本在 Github 获得星标 2.4k，在2020年开工之际，我们加入了对 Ant Design Vue 的支持，让使用Ant Design Vue 的项目也能够快速进行表单的开发，废话不多说，接下来我们来看看如何快速开发 Ant Design Vue 表单。主界面预览界面设计表单在表单设计官网平台上设计好表单，在表单属性 ...

简单实现antd的表单设计

呐呐呐

06-02

1665

这里用到的antd v3 版本的antd 从antd的使用入手： class NormalLoginForm extends React.Component { handleSubmit = e => { e.preventDefault(); this.props.form.validateFields((err, values) => { if (!err) { console.lo.

vue+element实现动态创建form表单的方法

weixin_46974834的博客

10-15

2178

啥也不多说直接上代码 //主要是set方法 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"> <scrip

vue3+vite 集成activiti前端设计器

09-02

Vue3 Vite 是一个用于构建Web界面的渐进式JavaScript框架，而 Activiti 是一个流程引擎和业务流程管理(BPM)解决方案。要将 Activiti 前端设计器集成到 Vue3 Vite 中，需要进行一些步骤。首先，需要下载并安装 Activiti 前端设计器的相关文件。可以从 Activiti 官方网站下载设计器的压缩包，然后将其解压到项目的特定目录中。然后，在 Vue3 Vite 项目中创建一个新的组件，用于加载 Activiti 前端设计器。可以使用 Vue 的 `import` 来引入设计器的相关文件，然后在组件中使用 `import` 或者 `require` 来引入设计器的样式和脚本文件。接下来，可以在 Vue3 Vite 项目的路由配置中添加一个新的路由，用于展示 Activiti 前端设计器的页面。可以将这个路由配置为一个独立的路由路径，比如 `/activiti-designer`。在创建的路由页面中，可以使用设计器的接口或者组件来渲染设计器的界面。可以通过本地或者远程的方式加载设计器的配置文件，并将设计器的相关属性和方法绑定到 Vue 组件的数据和方法中。最后，可以通过修改 Vue3 Vite 项目的打包配置，将 Activiti 前端设计器的相关文件打包到最终的项目中。可以使用 Vite 的插件或者配置项来实现这个功能。总的来说，要将 Activiti 前端设计器集成到 Vue3 Vite 中，需要下载和解压设计器的文件，创建一个新的组件用于加载设计器，配置一个新的路由来展示设计器的界面，并通过数据绑定和方法绑定将设计器的功能集成到 Vue3 Vite 项目中。最后，调整打包配置，将设计器文件打包到最终项目中。这样就可以在 Vue3 Vite 中使用 Activiti 前端设计器来设计和管理业务流程。