vue在线文档编辑(腾讯文档)多人在线编辑 定义页眉设置水印 授权填写控件(一)

需求说明

最近项目遇到分页文档编辑器,需要定制页眉页脚,打水印,流程审批填写内容授权指定人填写等功能问题,开始想去网上搜索看看有没有类似现成的vue写源码,很遗憾没有!对比各家在线文档最符合的是腾讯文档word,可惜人家不开源。想自己重头写一个,时间和人员配置不允许,最后找了个文档编辑器改造成分页,加页眉页脚,添加水印,添加自定义控件-插件。

demo在线体验,项目整体效果如下:

vue在线文档编辑(腾讯文档)多人在线编辑 定义页眉设置水印 授权填写控件(一)_第1张图片

 

 开发思路

  1. 找一个功能文本编辑全的富文本编辑器,有文字样式、段落、颜色、表格、可自定义插件。找到相对符合的编辑AoMao Editor (一个支持协同编辑的富文本编辑器,可以自由的使用 React、Vue 等前端常用库扩展定义插件)因为文档中使用的表格编辑多,这个编辑器的表格功能比较全面,最终决定使用它,减少了很大工作量。文档分页大家提供有真分页、假分页、不实时分页(即编辑时不分页,打印时在分页),我这里线上了(假分页和不实时分页),最后选用假分页方式。实现代码会在接下来文章详细讲解并附上。
  2. 可以自由添加需求插件
  3. 在原有的编辑器添加分页
  4. 在分页内添加页眉页脚 
  5. 在分页区内添加水印 实现水印移步另外一篇文章

你可能感兴趣的:(vue3前端开发,前端开发,前端,javascript,开发语言)