文档可视化+表单引擎,让数据交互更流畅!

hello,大家好,我是徐小夕。之前和大家分享了很多可视化零代码前端工程化的最佳实践,今天继续分享一下最近开发的文档引擎 Nocode/WEP 的最新更新。

278676258c033dc1bed83c848adb2977.png
往期精彩
  • 零代码+AI的阶段性复盘

  • 文档引擎+AI可视化打造下一代文档编辑器

  • 爆肝1000小时, Dooring零代码搭建平台3.5正式上线

  • 从零打造一款基于Nextjs+antd5.0的中后台管理系统

先和大家同步一下更新内容:

1. AI内容生成格式化优化

2.文档内嵌表单组引擎, 可以配置自定义表单

3. 新增表单数据查看页面

接下来我会和大家一一介绍更新的功能点。

  • 演示地址: http://wep.turntip.cn

  • 文档案例: http://wep.turntip.cn/design/doc?id=d1713369951622&uid=wep_251711700015023

AI内容生成格式化优化

a8065233c46fb5c48944a1c40735ea1b.png

之前有用户在留言区评论说AI生成的内容保存后格式没了,我最近修复了一下,目前可以完美保留AI生成的内容格式,帮助大家快速创作内容:

27eb0d929d0aa4231acadd997a9809fa.png

上面是让AI帮助我们生成一个前端学习大纲的需求,大家可以看到生成的效果,如果觉得不满意,还可以重新生成:

34a55a526782e97e4332b90b17df60b8.png

我们保存之后, 目前可以和文档完美融合,并且保留了AI的格式:

90979a700721fd42ad149a87bf8ddc58.png

文档内嵌表单组引擎, 可以配置自定义表单

这个功能也是之前网友提的一个比较实用的建议, 最近也花了点实现,实现了一个表单引擎,方便用户可以在文档里轻松制作表单,并进行数据收集:

f2458e42ca042b5ddf4f125198a5c613.png

上图我们可以看到,我们可以在文档中轻松制作表单,而且一个文档可以制作多个表单,非常有价值。

目前表单引擎我使用的是原生js实现,由于dom操作,难免性能上会超过传统框架诸如reactvue等,所以大家可以参考学习一下,后面我也会做一些技术分享。

整个引擎代码大概不到400行:

fd8607323e2aa630bea6248c1d76ebb9.png

我们来看看表单制作好之后保存的效果:

c48f56bb163e095a33d581f63708b621.png

新增表单数据查看页面

文档和表单都有了, 我们当然要能查看数据啦,文档的创作者可以在文档表单右上角直接点击查看数据,来观察表单的收集情况。

f00a40f559f2246b1af7be27ca8404c3.png

我们来看看表单数据页面:

7c330a26b8068f2779dd756d50fe946e.png

这样整个链路就打通了,这样我们的文档就越来越有价值了,当然还有很多需要优化迭代的方向,如果你有好的建议,也欢迎随时在评论区反馈交流~

  • 演示地址: http://wep.turntip.cn

  • 文档案例: http://wep.turntip.cn/design/doc?id=d1713369951622&uid=wep_251711700015023

583bb16ab7e28b25275e92e0a201fb73.png

更多推荐

  • 零代码+AI的阶段性复盘

  • 文档引擎+AI可视化打造下一代文档编辑器

  • 爆肝1000小时, Dooring零代码搭建平台3.5正式上线

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

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

相关文章

用docker命令行操作远程的Dockerd daemon服务

本地安装 Dockerd 服务太耗本机磁盘空间了,共用已有的Dockerd服务能够节省一部分空间 修改 Dockerd 服务启动文件,增加TCP监听方式 Dockerd 服务默认监听方式为 Unix Domain Socket ,只允许本机连接,想要能够远程连接&#xff0…

selenium发展史

Selenium Core 2004 年,Thoughtworks 的工程师 Jason Huggins 正在负责一个 Web 应用的测试工作,由于这个项目需要频繁回归,这导致他不得不每天做着重复且低效的工作。为了解决这个困境,Jason 开发了一个运行在 JavaScript 沙箱中…

43k Star!推荐一款功能强大的开源笔记软件!

程序员的公众号:源1024,获取更多资料,无加密无套路! 最近整理了一份大厂面试资料《史上最全大厂面试题》,Springboot、微服务、算法、数据结构、Zookeeper、Mybatis、Dubbo、linux、Kafka、Elasticsearch、数据库等等 …

2024软件测试必问的常见面试题1000问!

01、您所熟悉的测试用例设计方法都有哪些?请分别以具体的例子来说明这些方法在测试用例设计工作中的应用。 答:有黑盒和白盒两种测试种类,黑盒有等价类划分法,边界分析法,因果图法和错误猜测法。白盒有逻辑覆盖法&…

每天Get一个小技巧:用DolphinScheduler实现隔几天调度

转载自tuoluzhe8521 这篇小短文将教会你如何使用Apache DolphinScheduler实现隔几天调度,有此需求的小伙伴学起来! 1 场景分析 DolphinScheduler定时器模块-定时调度时每3秒|每3分钟|每3天这种定时,不能够跨分钟,跨小时&#x…

Unity | Spine动画动态加载

一、准备工作 Spine插件及基本知识可查看这篇文章:Unity | Spine动画记录-CSDN博客 二、Spine资源动态加载 1.官方说明 官方文档指出不建议这种操作。但spine-unity API允许在运行时从SkeletonDataAsset或甚至直接从三个导出的资产实例化SkeletonAnimation和Skel…

第189题|幂级数的展开的常规方法(二)|武忠祥老师每日一题

解题思路:将函数展开成幂级数有两种方法:一种是直接法(这种一般比较麻烦),一种是拆解成现有展开式展开(这种的特征一般是能因式分解)。 第一步: 这里看到 ln(1-x-2x^2) 将里面的式…

使用Selenium破解滑动验证码的原理及解决思路

1、获取页面元素信息: 使用Selenium打开目标网页,并通过相关方法获取滑块、背景图等元素的位置和属性信息。可以使用Selenium提供的定位方法(如xpath、CSS选择器等)来找到这些元素。 可以使用find_element_by_xpath或find_elemen…

ctfshow SSRF 351-358

做题前,需要先学习关于ssrf漏洞的相关知识 小注意: 当使用 file_get_contents() 函数访问远程 URL 时,它会尝试获取该 URL 指向的资源的内容,并将内容以字符串的形式返回。 如果 b.php 文件是一个 PHP 文件,它包含的内容取决于该 PHP 文件…

【LInux】<基础IO> 文件操作 | 文件描述符 | 重定向

👦个人主页:Weraphael ✍🏻作者简介:目前正在学习c和算法 ✈️专栏:Linux 🐋 希望大家多多支持,咱一起进步!😁 如果文章有啥瑕疵,希望大佬指点一二 如果文章对…

【环境安装】nodejs 国内源下载与安装以及 npm 国内源配置

前言 Node.js 是一个基于 Chrome V8 引擎构建的 JavaScript 运行时环境,它能够使 JavaScript 在服务器端运行。它拥有强大的包管理器 npm,使开发者能够轻松管理和共享 JavaScript 代码包。 在中国,由于众所周知的原因,我们可能会…

如何实现Linux双网卡同时连接内网和外网的配置?

博主猫头虎的技术世界 🌟 欢迎来到猫头虎的博客 — 探索技术的无限可能! 专栏链接: 🔗 精选专栏: 《面试题大全》 — 面试准备的宝典!《IDEA开发秘籍》 — 提升你的IDEA技能!《100天精通鸿蒙》 …