V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
Fechin
V2EX  ›  分享创造

一个老后端维护的纯前端项目:表格转换工具

  •  7
     
  •   Fechin ·
    Fechin · 2023-01-12 11:30:26 +08:00 · 7273 次点击
    这是一个创建于 442 天前的主题,其中的信息可能已经有所发展或是发生改变。

    距离上一次在 V 站发的贴子,已过去将近三年,后端成了老后端,开发的纯前端项目 tableconvert.com 还在继续维护,并且新增了一些花里胡哨的功能。

    作为一个后端程序员,有不少处理数据的小需求,比如:

    • 批量给字段添加引号,拼接成 SELECT ... WHERE in (xxx) SQL ;
    • 把运营整理好 Excel 按规则批量生成 UPDATE SQL;
    • 按规则批量创建带内容文件
    • 批量替换文件名 / 文件内容
    • 快速把在 MySQL 命令行里的查询结果转换成 CSV 、Excel 、JSON 或 Markdown 表格等等

    实现这些需求的方式多种多样,可以用命令、脚本或正则替换,程序员肯定不会一条条手敲。我把这些需求塞到了表格转换工具的 Magic 转换器,我几乎每天都会用到它,这也是持续维护它的原因。

    Magic 转换器传送门: https://tableconvert.com/excel-to-magic

    TableConvert Preview

    Magic 转换器是什么?

    TableConvert 表格转换工具一共有 28 种转换器,Magic 转换器是其中之一,也是我最常用的转换器,它内置了像 awk 命令一样的指令,用户可以根据这些指令设计自己期望的规则数据。Magic 转换器支持的语法指令有:

    语法指令描述支持哪些 JS 方法
    {h1} {h2} ...1th, 2th ... field of heading, Aka {hA} {hB} ...String methods
    {$1} {$2} ...1th, 2th ... field of current row, Aka {$A} {$B} ...String methods
    {F,} {F;}Split the current row by the string after F
    {NR} {NR+100}Line Number of current Row from 1 or 100
    {ENR}End line Number of Rows
    {$0}All Fields of current rowArray methods
    {NF}Number of Fields
    {x ...}Execute JavaScript code, eg: {x new Date()}
    {...\}Use backslash \ to output braces {...}

    Magic 转换器能做什么?

    1. 批量给指定列添加双引号( Built-in Magic )

    Row Magic:

    "{$1}"{x if(NR<ENR)", "}
    

    生成效果:

    "Markdown", "Magic", "LaTeX", "SQL", "HTML", "CSV", "Excel", "JSON", "JSONLines", "ASCII", "MediaWiki", "AsciiDoc", "Qlik", "DAX", "Firebase", "YAML", "XML", "Jira", "Textile", "reStructuredText", "PHP", "Ruby", "ASP", "ActionScript", "TracWiki", "BBCode", "PDF", "JPEG"
    

    2. 生成按第一列作为 WHERE 条件修改第二列的 UPDATE SQL ( Built-in Magic )

    Row Magic:

    UPDATE user set name ='{$2}' WHERE id='{$1}';`
    
    

    生成效果:

    UPDATE user set name ='Roberta' WHERE id='1';
    UPDATE user set name ='Oliver' WHERE id='2';
    UPDATE user set name ='Shayna' WHERE id='3';
    ...
    

    3. 批量生成创建相同规则内容的文件命令( Built-in Magic )

    Row Magic:

    echo "title: File {$2} 
    date: {x new Date().getTime()}
    " > docs/{$2}.md
    
    

    生成效果:

    echo "title: File name 
    date: 1673493211739
    " > docs/name.md
    
    echo "title: File Roberta 
    date: 1673493211739
    " > docs/Roberta.md
    ...
    

    4. 批量替换文件名( Built-in Magic )

    Row Magic:

    mv {$2} {$2.replace('e', 'E')}-generator.json`
    
    

    生成效果:

    mv name namE-generator.json
    mv Roberta RobErta-generator.json
    mv Oliver OlivEr-generator.json
    ...
    

    还能玩儿出什么花来?篇幅有限,就不一一列举了。V 友有常用的 Magic 模板,可以在评论区留言,我会它按使用频率整理并添加到 Built-in Magic 中。

    公司要倒闭了,没啥事儿,这次有时间对 Magic 转换区进行升级,分享给大家,各位轻喷,谢谢!

    第 1 条附言  ·  2023-01-16 15:37:25 +08:00
    - 修复了数据源和 Table 生成器重叠的问题
    - 添加了去重复行的按钮
    - 删除重复行和列合并为一个按钮


    贴一个 Table Editor 的使用动画:
    https://tva1.sinaimg.cn/large/008vxvgGgy1ha5iag13vmg30m90acnkw.gif

    一个 Magic 转换器的演示视频:
    https://t.me/tableconvert/23
    第 2 条附言  ·  2023-01-16 15:41:13 +08:00
    gif 太大了导致图床 403 ,Table Editor 演示在这里 https://t.me/tableconvert/25
    第 3 条附言  ·  2023-01-18 10:28:57 +08:00
    感谢各路英雄的喜欢,贴一个批量生成代码的 demo: https://t.me/tableconvert/36 ,有兴趣的可以加入频道一起交流
    61 条回复    2023-04-10 16:13:25 +08:00
    liweiliang
        1
    liweiliang  
       2023-01-12 11:40:33 +08:00
    原来这个是大佬的,之前有用到
    Alexpy
        2
    Alexpy  
       2023-01-12 11:57:26 +08:00
    666
    Raos
        3
    Raos  
       2023-01-12 12:01:51 +08:00
    这个工具我一直在用,期待已久的 MySQL 查询结果转换成其它格式终于有了,赞
    fds
        4
    fds  
       2023-01-12 12:12:37 +08:00
    厉害了。我之前都是写不同 python 脚本处理,没想到要做成工具。
    Alexpy
        5
    Alexpy  
       2023-01-12 12:16:45 +08:00
    @fds 我也是写了一大堆脚本
    Fechin
        6
    Fechin  
    OP
       2023-01-12 13:31:21 +08:00
    @fds 自从用上 Magic 转换器就很少写脚本了,一些简单的需求在 IDE 里用正则替换也很方便
    @Alexpy 工具比写脚本快
    sarices
        7
    sarices  
       2023-01-12 14:14:24 +08:00
    感谢,有在用,以前都以为是外国友人的作品,因为是工具类而且是英文版,没有深究是哪里的。
    wcao
        8
    wcao  
       2023-01-12 14:29:39 +08:00   ❤️ 1
    这 UI 是真的好看
    zqjilove
        9
    zqjilove  
       2023-01-12 14:43:47 +08:00   ❤️ 1
    经常用,必须给大佬点赞一波
    Fechin
        10
    Fechin  
    OP
       2023-01-12 15:07:05 +08:00   ❤️ 1
    @wcao 感谢,作为一个后端开发,这是我的极限了
    with
        11
    with  
       2023-01-12 15:57:22 +08:00
    好工具,赞
    yehai
        12
    yehai  
       2023-01-12 16:10:07 +08:00   ❤️ 1
    经常用,原来作者在 V 站
    Raos
        13
    Raos  
       2023-01-12 16:31:06 +08:00
    我算了一下,9 种数据源,28 种生成格式,妥妥的 200 多个转换器
    xuxuzhaozhao
        14
    xuxuzhaozhao  
       2023-01-12 17:03:31 +08:00
    厉害!
    Rollup
        15
    Rollup  
       2023-01-12 17:06:46 +08:00   ❤️ 1
    用过转 Markdown 功能,希望能支持合并单元格
    qq316107934
        16
    qq316107934  
       2023-01-12 17:11:21 +08:00   ❤️ 1
    好用,收藏了
    另:
    语言选择找了好久发现在右下角,要是放在右上角就好了
    另外我的浏览器设置里 accept-language zh-CN 优先级是最高的,返回的页面还是英文
    kokdemo
        17
    kokdemo  
       2023-01-12 17:21:28 +08:00   ❤️ 1
    牛啊这个,基本上每个月都用
    Fechin
        18
    Fechin  
    OP
       2023-01-12 17:25:11 +08:00
    @Rollup 谢谢反馈,很早就有小伙伴提合并单元格的需求了,整站都得动,我还是太懒
    @qq316107934 谢谢反馈,这里考虑优化一下
    Fechin
        19
    Fechin  
    OP
       2023-01-12 17:28:56 +08:00
    @zqjilove @kokdemo 感谢,我倒是很少用到格式转换,反而 Magic 转换器用的最多,特别是处理一些小的批量操作
    dd0754
        20
    dd0754  
       2023-01-12 19:45:40 +08:00
    大佬牛批
    Hancock
        21
    Hancock  
       2023-01-12 20:21:20 +08:00
    常用 excel to html,期待支持导入合并单元格的
    watzds
        22
    watzds  
       2023-01-13 10:38:39 +08:00
    这不比一般前端强多了
    dengji85
        23
    dengji85  
       2023-01-13 11:14:54 +08:00
    上次开始就一直在用,希望支持一下 oracle
    Fechin
        24
    Fechin  
    OP
       2023-01-13 17:43:35 +08:00
    @dengji85 老哥 oracle 具体是指哪一块?
    Cesaryuan
        25
    Cesaryuan  
       2023-01-13 19:26:24 +08:00
    outsider168
        26
    outsider168  
       2023-01-13 21:02:44 +08:00   ❤️ 1
    666 啊 这个工具是我最喜欢的格式转换工具 原来作者在这里
    cicl
        27
    cicl  
       2023-01-14 11:33:40 +08:00
    一直以为是国外的网站,没想到是 v 站大佬的,哈哈
    Fechin
        28
    Fechin  
    OP
       2023-01-16 09:52:11 +08:00
    @Cesaryuan 已修复
    zijieq
        29
    zijieq  
       2023-01-16 10:22:54 +08:00
    居然遇到作者了,半年前偶然在搜索引擎里搜到这个工具,非常好用,刚刚打开发现之前的缓存都还在
    oneisall8955
        30
    oneisall8955  
       2023-01-16 10:29:57 +08:00 via Android
    @zijieq 是的,没想到半年前用过
    mydingyan
        31
    mydingyan  
       2023-01-16 10:38:39 +08:00
    @zijieq 同意,我是搜 HTML 转 markdown 搜到的
    shanghai1998
        32
    shanghai1998  
       2023-01-16 10:43:34 +08:00
    UI 喜欢,用了什么 UI 框架了没?
    Fechin
        33
    Fechin  
    OP
       2023-01-16 11:07:13 +08:00
    @zijieq 缓存过分了,我应该让缓存时长更短一些
    Fechin
        34
    Fechin  
    OP
       2023-01-16 11:08:28 +08:00
    @Fechin 没用 UI 框架,用了 CSS 框架 Tailwind CSS
    lifeintools
        35
    lifeintools  
       2023-01-16 11:22:35 +08:00
    之前用过 对我很有用。谢谢作者
    gbw1992
        36
    gbw1992  
       2023-01-16 16:17:02 +08:00
    这这这 这个好啊!!!
    illl
        37
    illl  
       2023-01-16 16:54:32 +08:00 via iPhone
    有没有考虑做成 app ,有时候处理敏感数据的话不敢用网页版的
    Fechin
        38
    Fechin  
    OP
       2023-01-16 17:23:15 +08:00
    @illl 暂时没有打算,工具不会请求 API ,不会存储任何用户数据,所有数据处理都是在浏览器里完成的
    lqzhgood
        39
    lqzhgood  
       2023-01-16 17:46:13 +08:00
    试了下,发现个 bug~
    https://imgloc.com/i/2dUcN
    zx9481
        40
    zx9481  
       2023-01-16 17:47:16 +08:00
    有简体中文版吗
    zx9481
        41
    zx9481  
       2023-01-16 17:48:39 +08:00
    @zx9481 找到了 右下角可以切换
    Fechin
        42
    Fechin  
    OP
       2023-01-17 10:39:14 +08:00
    @lqzhgood 已修复,感谢反馈 https://tableconvert.com/json-to-markdown?data=[{a:1,b:2},%20{b:9999,a:444}]
    lqzhgood
        43
    lqzhgood  
       2023-01-17 10:45:40 +08:00
    lqzhgood
        44
    lqzhgood  
       2023-01-17 10:46:34 +08:00
    @lqzhgood https://tableconvert.com/json-to-markdown?data=[{a:1,b:2},%20{b:9999,c:123},{d:999},{e:123}]
    lqzhgood
        45
    lqzhgood  
       2023-01-17 10:58:36 +08:00
    不知道这个算不算 bug ,毕竟大部分导出的数据都比较”规整“
    对于这个”bug“,可能还需要用户提供一个 空值 的 默认值 选项~
    Fechin
        46
    Fechin  
    OP
       2023-01-17 11:43:57 +08:00
    @lqzhgood 我觉得算,虽然极少出现,但是数据丢失的体验不友好。

    我修改了一下,保证 header 顺序的同时去重,平铺所有数据,没有值则为空: https://tableconvert.com/json-to-markdown?data=%5B%7Ba%3A1%2Cb%3A2%7D%2C%7Bb%3A9999%2Cc%3A123%7D%2C%7Bd%3A999%7D%2C%7Be%3A123%7D%5D
    OSong
        47
    OSong  
       2023-01-17 14:44:33 +08:00
    @sarices 其实右下方可以改为简体中文 哈哈哈
    hanswu
        48
    hanswu  
       2023-01-17 15:31:46 +08:00
    给大佬点个赞,最近在百度搜才用到这个,真心好用!
    sarices
        49
    sarices  
       2023-01-17 15:44:15 +08:00
    @OSong 应该放到顶部,估计没多少人会拉到底部,基本工功能就在上面可以完成了
    wangwei216
        50
    wangwei216  
       2023-01-17 17:15:46 +08:00
    牛皮,我前几天还用到了这个,这个还是很有用的,鼓励
    lovedoing
        51
    lovedoing  
       2023-01-17 17:42:22 +08:00
    表头魔法为空,第一行还是被忽略了
    lscho
        52
    lscho  
       2023-01-17 18:50:08 +08:00 via iPhone
    牛逼,以前都是自己写脚本实现,没想到做个通用的工具
    Fechin
        53
    Fechin  
    OP
       2023-01-17 18:51:46 +08:00
    @lovedoing 有空格或换行符,也会当做魔法,想要保留表头,需要清空 textarea 文本框
    Fechin
        54
    Fechin  
    OP
       2023-01-17 18:52:38 +08:00
    @lscho 我也是亏了好多脚本 :)
    manito2
        55
    manito2  
       2023-01-18 00:09:07 +08:00
    厉害,非常实用。
    bshu
        56
    bshu  
       2023-01-18 10:02:45 +08:00
    好东西,很实用
    yuhuanxi
        57
    yuhuanxi  
       2023-01-18 10:07:50 +08:00
    已加入到个人主页工具链接,试用了下很给力
    Fechin
        58
    Fechin  
    OP
       2023-01-18 10:17:26 +08:00
    @yuhuanxi 谢谢支持
    imzhoukunqiang
        59
    imzhoukunqiang  
       2023-01-19 14:59:11 +08:00
    @Fechin 大佬,项目开源吗
    Fechin
        60
    Fechin  
    OP
       2023-01-20 09:43:35 +08:00
    @imzhoukunqiang 代码太拉了,近期没有开源的计划
    LaurelHarmon
        61
    LaurelHarmon  
       354 天前
    大佬,可以记录文字的颜色吗,带颜色的表格上传之后颜色都没了,转为其他格式(例如 LaTeX )还得重新调
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   5305 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 38ms · UTC 08:26 · PVG 16:26 · LAX 01:26 · JFK 04:26
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.