前言

大家好，我是林三心，用最通俗易懂的話講最難的知識(shí)點(diǎn)是我的座右銘，基礎(chǔ)是進(jìn)階的前提是我的初心。

Flowmix/Docx 是一款即開(kāi)即用的多模態(tài)文檔編輯工具。它運(yùn)用基于blocks模式的文檔架構(gòu)，能夠適配各類(lèi)繁雜的文檔排版，允許嵌入多種類(lèi)型的文檔元素，諸如富文本、音視頻資料、思維導(dǎo)圖、自由畫(huà)板、內(nèi)嵌網(wǎng)頁(yè)的Iframe、業(yè)務(wù)信息流卡片、AI創(chuàng)作插件、表格、復(fù)雜的數(shù)學(xué)公式、可視化圖表、多語(yǔ)言代碼塊、PDF文檔以及自定義水印等。

體驗(yàn)地址: http://flowmix.turntip.cn/docx

圖片

它目前已經(jīng)支持Vue、React 這些前端框架，適用于大部分的前端項(xiàng)目~ 企業(yè)能夠依托其輕松構(gòu)建文檔知識(shí)庫(kù)與項(xiàng)目管理等系統(tǒng)，類(lèi)似于飛書(shū)文檔與釘釘文檔這樣的產(chǎn)品。當(dāng)然，目前的編輯器仍在迅速優(yōu)化升級(jí)，未來(lái)將逐步發(fā)展成為一款面向下一代的先進(jìn)文檔知識(shí)引擎。

Flowmix/Docx 宣布更新

圖片

轉(zhuǎn)瞬間一個(gè)月已悄然流逝，F(xiàn)lowmix/Docx 文檔編輯器在 10 月再度增添了數(shù)個(gè)功能要點(diǎn)，能夠極大地提升文檔編寫(xiě)的效率與體驗(yàn)。接下來(lái)，他會(huì)向眾人詳盡地闡述更新的具體內(nèi)容。當(dāng)然，在推介更新內(nèi)容之前，接下來(lái)我向大家介紹一下 Flowmix/Docx 以及其核心目標(biāo)。

Flowmix/Docx 的核心目標(biāo)

推出多模態(tài)文檔引擎的原因在于，傳統(tǒng)的富文本編輯器和 Markdown編輯器 已難以適應(yīng)不斷提升的用戶體驗(yàn)需求。隨著用戶體驗(yàn)的不斷升級(jí)，涌現(xiàn)出許多編寫(xiě)體驗(yàn)更佳、呈現(xiàn)形式更為多樣的文檔編輯器，例如 Notion 。

圖片

隨著 AI 技術(shù)的持續(xù)進(jìn)步，類(lèi)似結(jié)構(gòu)化的編輯器將會(huì)愈發(fā)普及。然而，不少企業(yè)因大企業(yè)的產(chǎn)品壟斷及技術(shù)壁壘而受限。正因如此，F(xiàn)lowmix/Docx 文檔引擎應(yīng)運(yùn)而生，旨在打破這一壁壘，助力中小企業(yè)或個(gè)人能以低廉的成本擁有一款類(lèi)似 Notion 或者飛書(shū)文檔的編輯器，輕松地將其集成至自身的系統(tǒng)或項(xiàng)目中，以最大限度地提升用戶體驗(yàn)。

當(dāng)然，F(xiàn)lowmix/Docx 并非僅限于當(dāng)前的功能。伴隨團(tuán)隊(duì)不斷的更新迭代，它會(huì)逐漸發(fā)展成為一個(gè)文檔生態(tài)系統(tǒng)，融合更多的業(yè)務(wù)流程與功能，達(dá)成all in one的價(jià)值理念。

近期，他們團(tuán)隊(duì)投入了大量精力研發(fā)一款文檔管理類(lèi) SaaS 系統(tǒng)，其底層架構(gòu)采用了 Flowmix/Docx 多模態(tài)文檔引擎，下面簡(jiǎn)單地向大家介紹一下：

圖片

Flowmix/Docx 更新盤(pán)點(diǎn)

接下來(lái)就到了我們的重點(diǎn), 我和大家分享一下最近的一些更新。

圖片

團(tuán)隊(duì)每個(gè)月都會(huì)根據(jù)用戶的需求和規(guī)劃的迭代計(jì)劃持續(xù)迭代, 大家可以關(guān)注 flowmix視界 公眾號(hào)獲取最新更新的信息：

1、文檔支持劃詞評(píng)論功能

圖片

2、支持高級(jí)思維導(dǎo)圖組件

最近新增了高級(jí)思維導(dǎo)圖, 我們可以在文檔中輕松創(chuàng)建多個(gè)精美的思維導(dǎo)圖, 讓知識(shí)管理更有價(jià)值。

圖片

3、支持Markdown實(shí)時(shí)轉(zhuǎn)寫(xiě)

圖片

由上面的演示可以看到, 我們?cè)诰庉嬈髦休斎?nbsp;MarkDown 語(yǔ)法, 編輯器會(huì)實(shí)時(shí)轉(zhuǎn)化成對(duì)應(yīng)的文檔組件, 這樣可以極大的方便熟悉MarkDown語(yǔ)法的技術(shù)開(kāi)發(fā)人員。

4、支持Markdown文本一件粘貼到文檔

這個(gè)功能也是非常實(shí)用的一個(gè)功能, 我們只需要復(fù)制一段 MarkDown 文本, 就可以快捷的粘貼到 flowmix/docx 文檔中, 并自動(dòng)解析成對(duì)應(yīng)的文檔組件。

圖片

5、編輯器支持AI側(cè)邊欄

圖片

編輯器之前雖然支持了AI問(wèn)答組件, 但是為了更好的挖掘文的價(jià)值, 我集成了AI側(cè)邊欄, 大家可以輕松集成市面上的AI大模型, 來(lái)實(shí)現(xiàn)AI輔助創(chuàng)作。

我們可以輕松的點(diǎn)擊右下角的AI按鈕, 打開(kāi)側(cè)邊欄和AI對(duì)話:

圖片

6、文檔支持一鍵導(dǎo)入Docx文件

圖片

文檔一鍵導(dǎo)入docx文件功能可以高效的幫助我們解析docx的內(nèi)容, 并在 flowmix/docx 中快速編輯. 接下來(lái)給大家看看原始的word文件:

圖片

在第一個(gè)版本中其實(shí)也實(shí)現(xiàn)了 docx 文件的導(dǎo)入, 但是之前對(duì)圖片, 表格這些 docx 特有的格式無(wú)法支持, 最近研究出來(lái)了一個(gè)方案, 可以很好的支持docx文件中的表格, 圖片等, 并一鍵轉(zhuǎn)化為 flowmix/docx 中支持的數(shù)據(jù)結(jié)構(gòu)。

在實(shí)現(xiàn)Docx解析方案中我采用了 DOMParser API , 這里我給大家介紹一下這個(gè)兼容性良好且功能強(qiáng)大的瀏覽器API。

圖片

7、支持實(shí)時(shí)獲取當(dāng)前光標(biāo)在文檔中的位置

圖片

實(shí)時(shí)獲取光標(biāo)位置的方案主要是為了實(shí)現(xiàn)多人協(xié)同的光標(biāo)位置確認(rèn), 這里我也基本實(shí)現(xiàn)了. 主要是用到了 window.getSelection API, 后續(xù)我會(huì)詳細(xì)和大家分享它的應(yīng)用場(chǎng)景. 實(shí)現(xiàn)代碼如下:

圖片

8、優(yōu)化文檔元素插入文檔的順序

這個(gè)問(wèn)題主要是為了解決文檔編輯器當(dāng)失去焦點(diǎn)時(shí), 仍能爭(zhēng)取插入到文檔光標(biāo)最近停留的位置. 之前一直用了“比較笨”的方案, 最近研究了一下,終于用window.getSelection實(shí)現(xiàn)了.(其實(shí)也是用的上述獲取光標(biāo)位置的方式實(shí)現(xiàn)的)

圖片

9、內(nèi)聯(lián)工具條UI優(yōu)化

圖片

Flowmix/Docx 未來(lái)規(guī)劃

11月團(tuán)隊(duì)做了一些迭代規(guī)劃, 除了上線文檔Saas版1.0之外, 希望在下個(gè)月帶給大家更強(qiáng)大的編輯器體驗(yàn):

• 支持劃詞評(píng)論
• 支持文檔圖層面板
• 支持高級(jí)可視化組件
• 支持文檔AI工作流
• 支持演示模式
• 支持多人協(xié)同編輯
• 支持一鍵生成PP

圖片