phoben 发表于 2024-4-11 23:31:10

【免费插件】逆天优化EL表格插件,每个功能都戳中痒点,已在商业项目大量使用!

本帖最后由 phoben 于 2024-6-2 11:03 编辑

因为EL系列插件的美观性,我一直在项目中使用它,尤其是"EL-表格"插件,在项目中的出镜率是非常高的。

但是在使用过程中,我们也遇到很需求它无法满足,基于“自己动手,丰衣足食”的理念,我按照我的需求,对EL-表格进行了一些优化和改动。
如果你恰好也和超哥一样,喜欢EL表格,但有一些需求没办法满足,不妨试试看这款插件。

因为插件是基于官方EL插件(9.0.103.0版本)升级,无法上架应用市场,就在帖子里共享了
下载安装后会覆盖官方插件,下面是插件更新的介绍:

新增功能:

[*][新功能] EL表格:按钮可动态显示/隐藏,通过表达式来控制;
[*][新功能] EL表格:表格任意列支持隐藏;
[*][新功能] EL表格:支持运行时命令-获取表格数据源;
[*][新功能] EL表格:增加固定列在左侧/右侧功能;
[*][新功能] EL表格:增加自动合并列功能;
[*][新功能] EL表格:列管理逻辑变更,不再影响列数;
[*][新功能] EL标签头:增加吸附功能;
[*][新功能] EL表格:增加单元格点击事件;
[*][新功能] EL表格:增加列类型功能(图片、标签);
[*][新功能] EL表格:表格按钮可以设置权限了(可见性、可用性);
[*][新功能] EL输入框:可以添加前缀、后缀文字(好用!)


优化若干官方版本缺陷:

[*]修复在切换数据源时,自定义列内容不更新的问题;
[*]优化列默认对齐方式,现在列头与单元格对齐方式一致了;
[*]优化列数据的格式类型,支持更多预设类型;
[*]修复部分场景下“重载表格”不生效问题;
[*]修复列排序,在JSON数据源模式下失效问题;

数据填充逻辑优化:
1. “配置表格列”内配置的字段,不再会影响表格显示列数;
2. “配置表格列”可只对想要配置的部分列做配置,没配置的列,不会因此不显示;
3.   可以通过新增的“隐藏列”功能实现可以获取数据,但实际不显示的效果;

我们来看看它的实际使用效果:

按钮的动态隐藏
可以根据行数据自行编写规则来决定按钮显不显示

效果预览



配置方法
通过写一个简短的js语句,来决定按钮显示与否,理论上支持任何js语法,你甚至可以使用更复杂的对比逻辑,例如:"||"、"&&"等对比符号,最终返回true则显示按钮。



隐藏某一列
可以提前设置某一列的展示与否,包括JSON数据源或数据表数据源,即使隐藏该列,从命令里仍然还是可以读取它。

效果预览
数据源中是有ID字段的。




配置方法
设计器中预览也会与配置同步



默认对齐方式
官方插件的列头是中对齐,表格内部是左对齐,看起来会显得不太规整,使用插件后,默认都会使用中对齐,无需任何设置。



使用后效果


全局增加更多数据类型
官方插件中只有日期的格式选择,这里提供了更多数据格式,例如:百分比、货币、2位数值、大写数字等,你仍然可以修改它



增加“获取表格数据源”命令
现在你可以使用“操作单元格命令”选择EL表格后,可以使用“获取表格数据源”来获取一个JSON数组格式的数据源。
你可以用来判断当前你的表格内有多少条数据,或者通过插件、JS来摆弄表格数据了。



使用方法
可获取表格内所有数据,JSON数组


增加“合并列”功能
你可以通过列配置,让某些列自动合并,让现实效果更佳简洁直观;



设置方法


新增“固定列”功能
你可以通过列配置,让某些列固定在左边或右边,非常实用


设置方法


表格列管理逻辑的变更
官方插件的逻辑是,“配置表格列”里配置了几个字段,最终就显示几个字段。
但其实这样我认为是不合理的,因为如果我不想要这个字段显示在表格,我可以从数据源里不要选择就是,更何况更新后的插件可以自主隐藏列并保留数据。
所以我重构了这里的逻辑,“配置表格列”里你愿意定义几个列就定义几个,其他列还是会显示。
如果你不想某列显示,那么你就勾选隐藏列,这样你还是能取到行数据;
如果你想彻底排除某列,你直接数据源里就不提供,这样既不显示,也获取不到行数据;

官方版



新版



最后再啰嗦一句,为什么要用这个逻辑。
假设你用JSON数据源来动态填充数据,常见的就是从N张表里取不同数据,根据条件来填充其中一张表的数据到EL表格,这时候如果你需要将“日期”字段改为日期类型,“金额”字段改为货币格式,“税率”字段改为百分比,假设几张表里都有这几个字段,放在官方的版本你需要怎么做呢?
没错!其实你实现不了,因为每个表的字段不一样,你无法在开发期间来提前设计好它们的格式,有了这个插件,我们只需要将日期、金额、税率三个字段设置一下类型格式,其他字段完全不用设置就行。

EL标签头自动吸附
可以使标签头自动吸附在顶部,当页面滚动到标签头位置,它会自动停留吸附在顶部。
在设计器里,可以看到,增加了几个选项,用于控制吸附效果


动态效果演示:


功能介绍就到这里,如果你有什么更好的想法,欢迎在下面评论!

EL表格单元格点击事件
现在你可以捕获表格内某个单元格被单击的事件。
在点击触发命令里,你可以获得几个参数:行数据、列名、单元格值




EL表格列类型
除了显示文字,现在列还可以显示图片和标签,设置非常简单。
只需要在列配置里,选择对应的类型和样式即可。
小提示:不同表格高度,标签和图片大小会自动调整,标签类型会自动将逗号分割的文本渲染成多个标签~

标签设置


图片设置


效果展示


EL表格 支持按钮权限
上个版本,我们给按钮加了动态的显示和隐藏,这次我们加上了活字格原生权限支持
权限可以控制一整列按钮对哪些角色可见、可用,而条件设置可以控制每一行,完美!



EL表格 输入框支持前后缀
这个话不多说,直接上图


设置方法非常简单,留空则不显示前后缀



附件中可下载9.0.102以上可用插件,最新的10.0.3版本插件还在修改,可以加私信付费获取。



小崽子来也 发表于 2024-4-12 10:49:53

超哥给力!

CainduranceTX 发表于 2024-4-12 14:14:53

在哪儿下载啊

phoben 发表于 2024-4-12 14:18:58

CainduranceTX 发表于 2024-4-12 14:14
在哪儿下载啊

帖子下面有附件

CainduranceTX 发表于 2024-4-12 14:25:10

phoben 发表于 2024-4-12 14:18
帖子下面有附件

哎?我咋看不到。。。

王海鸥 发表于 2024-4-12 17:31:54

EL表现在能导出excel了吗?

phoben 发表于 2024-4-12 17:48:39

王海鸥 发表于 2024-4-12 17:31
EL表现在能导出excel了吗?

用这个插件可以导出JSON

CainduranceTX 发表于 2024-4-12 20:52:45

el表格,首次加载的时候,很慢,这个有解决办法么

phoben 发表于 2024-4-12 21:00:54

CainduranceTX 发表于 2024-4-12 20:52
el表格,首次加载的时候,很慢,这个有解决办法么

可能数据太多,可以分个页,我没觉得第一次很慢呢

CainduranceTX 发表于 2024-4-12 21:11:35

phoben 发表于 2024-4-12 21:00
可能数据太多,可以分个页,我没觉得第一次很慢呢

我做了查询,没有分页,也就不到一万条数据,页面首次加载大概需要5秒。
另外,el表格不能把当前行的一个值传给另一个页面。。。
页: [1] 2 3
查看完整版本: 【免费插件】逆天优化EL表格插件,每个功能都戳中痒点,已在商业项目大量使用!