鹿德源 楊蕾 王浩震

摘? 要：隨著辦公無紙化和信息化的演進(jìn)，傳統(tǒng)手寫筆記、文檔的記錄方式逐漸被移動(dòng)存儲(chǔ)和在線記錄方式所取代。文章設(shè)計(jì)一種基于B/S架構(gòu)的在線筆記與交流平臺(tái)，將筆記記錄、文檔管理、個(gè)人云盤、在線交流集成在同一個(gè)系統(tǒng)內(nèi)。用戶可通過終端瀏覽器隨時(shí)進(jìn)行使用，簡(jiǎn)化了筆記、文檔記錄和管理的流程，并且能夠進(jìn)行筆記的檢索和相關(guān)內(nèi)容的討論。該平臺(tái)設(shè)計(jì)完成度高，具有可用性強(qiáng)、操作簡(jiǎn)單等特點(diǎn)，可隨時(shí)投入實(shí)際應(yīng)用。

關(guān)鍵詞：SpringBoot；Vue；在線筆記；交流平臺(tái)

中圖分類號(hào)：TP311? 文獻(xiàn)標(biāo)識(shí)碼：A? 文章編號(hào)：2096-4706（2023）09-0022-04

Abstract： With the evolution of paperless office and informatization， the traditional way of recording of handwritten notes and documents has gradually been replaced by mobile storage and online recording. This paper designs an online note and communication platform based on B/S architecture， which integrates note recording， document management， personal cloud disk and online communication into one system. Users can use it at any time through the terminal browser， which simplifies the process of note-making， document recording and management， and can retrieve notes and discuss relevant contents. The platform has high design completion， strong usability， simple operation and other characteristics， and can be put into practical application at any time.

Keywords： SpringBoot; Vue; online note; communication platform

0? 引? 言

筆記的記錄作為日常生活和學(xué)習(xí)中的一個(gè)重要環(huán)節(jié)，其記錄情況與管理方式關(guān)乎人們工作和學(xué)習(xí)的效率[1，2]。隨著信息時(shí)代的到來以及辦公無紙化的推進(jìn)，傳統(tǒng)的手工記錄筆記或?qū)⑽臋n存儲(chǔ)于個(gè)人PC或U盤上已經(jīng)不能滿足諸多遠(yuǎn)程辦公場(chǎng)景的需要。相較于傳統(tǒng)的筆記記錄管理方法，使用云平臺(tái)進(jìn)行筆記記錄和文檔存儲(chǔ)更加便捷。此外現(xiàn)存在的筆記記錄平臺(tái)均不提供交流的平臺(tái)，這限制了信息的流通，所以需要開發(fā)低成本，同時(shí)兼具筆記記錄管理與交流的在線筆記記錄與交流系統(tǒng)，使用戶隨時(shí)能夠進(jìn)行筆記記錄與交流。

1? 系統(tǒng)概述

在線筆記與交流平臺(tái)面向的主要用戶是在校學(xué)生和IT從業(yè)者，旨在為他們提供一個(gè)能夠隨時(shí)進(jìn)行筆記記錄和交流的平臺(tái)。該平臺(tái)通過使用在線Web平臺(tái)進(jìn)行筆記記錄的方式取代傳統(tǒng)的紙質(zhì)手寫或PC離線編輯的方式，此外提供一個(gè)筆記分享交流的平臺(tái)用于平臺(tái)內(nèi)用戶的交流。

1.1? 系統(tǒng)工作原理

在線筆記與交流平臺(tái)采用B/S架構(gòu)和MVC模式開發(fā)。B/S架構(gòu)將系統(tǒng)功能實(shí)現(xiàn)的核心部分封裝過后集中到Web服務(wù)器上，簡(jiǎn)化了系統(tǒng)的開發(fā)、維護(hù)和使用，使用戶隨時(shí)可通過瀏覽器遠(yuǎn)程訪問系統(tǒng)[3，4]。系統(tǒng)的工作原理圖如圖1所示。

MVC模式全稱為模型-視圖-控制器模式，在線筆記與交流平臺(tái)采用MVC的設(shè)計(jì)模型，在MVC模式下系統(tǒng)各個(gè)層級(jí)之間的分工明確[5]。在MVC模式下系統(tǒng)的不同接口與功能實(shí)現(xiàn)類之間的耦合度降低，同時(shí)采用MVC模式有利于系統(tǒng)后期的更新與維護(hù)。MVC設(shè)計(jì)模式的結(jié)構(gòu)如圖2所示。

1.2? 系統(tǒng)結(jié)構(gòu)功能設(shè)計(jì)

系統(tǒng)的角色主要分為系統(tǒng)管理員和普通用戶。其中普通用戶在登錄平臺(tái)后，可實(shí)現(xiàn)實(shí)時(shí)的筆記編輯、查看、修改、分享以及交流，此外平臺(tái)還提供個(gè)人用戶網(wǎng)盤，用戶可隨時(shí)進(jìn)行文件的上傳和下載。系統(tǒng)管理員主要是對(duì)系統(tǒng)的運(yùn)行情況進(jìn)行監(jiān)測(cè)，通過查看平臺(tái)的各項(xiàng)數(shù)據(jù)，實(shí)時(shí)了解平臺(tái)的運(yùn)行情況，其中包括已注冊(cè)用戶量、新增筆記數(shù)量、系統(tǒng)網(wǎng)盤空間使用情況、筆記的分享審核、用戶舉報(bào)審核、發(fā)布系統(tǒng)公告等功能。在線筆記與交流平臺(tái)的系統(tǒng)結(jié)構(gòu)圖如圖3所示。

1.3? 系統(tǒng)的工作流程

在線筆記與交流平臺(tái)的系統(tǒng)功能包括普通用戶對(duì)筆記的相關(guān)操作、平臺(tái)管理員對(duì)系統(tǒng)的相關(guān)操作，具體功能如下。

1.3.1? 權(quán)限登錄功能

系統(tǒng)設(shè)計(jì)之初考慮為系統(tǒng)用戶劃分不同權(quán)限，不同權(quán)限用戶通過登錄操作實(shí)現(xiàn)個(gè)人權(quán)限的驗(yàn)證，登錄到個(gè)人所屬權(quán)限的操作界面。主要包括平臺(tái)管理員能夠登錄進(jìn)入平臺(tái)的管理操作界面，普通用戶能夠登錄進(jìn)入筆記記錄查看分享等相關(guān)操作的界面。

1.3.2? 個(gè)人信息管理

用戶登錄系統(tǒng)后可對(duì)自己的賬戶信息（賬戶密碼）以及個(gè)人的相關(guān)信息（個(gè)人昵稱、用戶郵箱、頭像、個(gè)人簡(jiǎn)介等）進(jìn)行管理，用于平臺(tái)內(nèi)用戶信息展示，分享時(shí)的分享者信息（僅展示用戶昵稱和頭像）展示。

1.3.3? 用戶筆記的相關(guān)操作

系統(tǒng)普通用戶登錄系統(tǒng)后可進(jìn)行對(duì)筆記的相關(guān)操作，其中包括用戶新增筆記、修改筆記、刪除筆記、筆記目錄管理、搜索筆記等功能。其中新增筆記首先需要新建筆記文件，輸入筆記名稱，編輯筆記內(nèi)容，填寫筆記標(biāo)簽（筆記標(biāo)簽為選填項(xiàng)）；修改筆記就是對(duì)已有的筆記內(nèi)容進(jìn)行更新操作；筆記目錄管理就是對(duì)用戶賬號(hào)下的文件或筆記目錄進(jìn)行新增、刪除、修改名稱等操作；搜索筆記即用戶可在平臺(tái)內(nèi)通過關(guān)鍵詞對(duì)已公開的筆記進(jìn)行搜索的操作。

1.3.4? 用戶個(gè)人云盤管理

系統(tǒng)的普通用戶登錄系統(tǒng)后可對(duì)個(gè)人云盤進(jìn)行相關(guān)操作，用戶可在系統(tǒng)內(nèi)進(jìn)行文件的上傳和下載、文件的實(shí)時(shí)在線預(yù)覽、文件的分享等。

1.3.5? 系統(tǒng)后臺(tái)管理

平臺(tái)管理員在成功登錄系統(tǒng)后臺(tái)后，在系統(tǒng)的后臺(tái)對(duì)其模塊進(jìn)行相關(guān)的管理操作，包括網(wǎng)站內(nèi)容管理、筆記管理、用戶管理、云盤管理、系統(tǒng)消息發(fā)布等。

具體的系統(tǒng)工作流程圖如圖4所示。

2? 系統(tǒng)設(shè)計(jì)

2.1? 系統(tǒng)數(shù)據(jù)庫設(shè)計(jì)

數(shù)據(jù)庫概念模型是在系統(tǒng)設(shè)計(jì)之初進(jìn)行數(shù)據(jù)庫設(shè)計(jì)時(shí)，將系統(tǒng)內(nèi)的事物實(shí)體進(jìn)行抽象化，形成數(shù)據(jù)庫的初始數(shù)據(jù)模型。

在線筆記與交流平臺(tái)的實(shí)體類包括系統(tǒng)用戶實(shí)體類、筆記實(shí)體類、筆記附件實(shí)體類、筆記目錄實(shí)體類、回收站實(shí)體類、系統(tǒng)日志實(shí)體類、用戶權(quán)限實(shí)體類、系統(tǒng)消息實(shí)體類、云盤目錄實(shí)體類、用戶云盤實(shí)體類、用戶黑名單實(shí)體類等，實(shí)體類屬性如下：

用戶實(shí)體類：用戶ID、手機(jī)號(hào)碼、昵稱、郵箱、性別、郵編、創(chuàng)建時(shí)間等屬性。

筆記實(shí)體類：筆記ID、筆記標(biāo)題、用戶ID、目錄ID、是否公開、分享鏈接、點(diǎn)贊數(shù)量、創(chuàng)建時(shí)間、修改時(shí)間等屬性。

筆記附件實(shí)體類：用戶ID、附件名稱、筆記ID、附件存儲(chǔ)路徑、創(chuàng)建時(shí)間等屬性。

筆記目錄實(shí)體類：目錄ID、目錄名稱、用戶ID、創(chuàng)建時(shí)間等屬性。

回收站實(shí)體類：筆記ID、筆記名稱、用戶ID、回收時(shí)間等屬性。

系統(tǒng)日志實(shí)體類：用戶ID、操作內(nèi)容、用戶IP、操作時(shí)間、請(qǐng)求方式等屬性。

用戶權(quán)限實(shí)體類：用戶ID、賬號(hào)密碼、權(quán)限類型、創(chuàng)建時(shí)間、權(quán)限ID等屬性。

系統(tǒng)消息實(shí)體類：消息ID、消息類型、消息名稱、消息內(nèi)容、發(fā)送人ID、接收人ID、消息狀態(tài)、創(chuàng)建時(shí)間等屬性。

云盤目錄實(shí)體類：云盤目錄ID、用戶ID、目錄名稱、創(chuàng)建時(shí)間、修改時(shí)間等屬性。

用戶云盤實(shí)體類：文件ID、用戶ID、文件名稱、文件大小、創(chuàng)建時(shí)間等屬性。

用戶黑名單實(shí)體類：黑名單ID、用戶ID、原因、創(chuàng)建時(shí)間、截止時(shí)間等屬性。

系統(tǒng)內(nèi)設(shè)計(jì)user（平臺(tái)用戶）、pan_dir（云盤目錄）、role（用戶權(quán)限）、article_recycle（筆記回收站）、article_dir（筆記目錄）、user_pan（用戶云盤）、user_blacklist（用戶黑名單）、notify（系統(tǒng)消息）、article（筆記）、article_afftix（筆記附件）、log（系統(tǒng)日志）11個(gè)實(shí)體表。

2.2? 系統(tǒng)開發(fā)工具與運(yùn)行環(huán)境

前端使用Vue框架，開發(fā)工具為HBuilder；后端使用Java語言、SpringBoot框架[6-8]，開發(fā)工具為IDEA；數(shù)據(jù)庫采用MySQL，數(shù)據(jù)庫開發(fā)工具為Navicat。

系統(tǒng)環(huán)境為CentOS 7.2，Web服務(wù)器選用Tomcat，版本控制器為Git，持續(xù)化部署工具為Docker+Jenkins。

3? 系統(tǒng)功能實(shí)現(xiàn)

3.1? 登錄注冊(cè)功能實(shí)現(xiàn)

用戶進(jìn)入系統(tǒng)后會(huì)首先進(jìn)入登錄界面，用戶通過輸入手機(jī)號(hào)及密碼進(jìn)行登錄操作，若未注冊(cè)可點(diǎn)擊注冊(cè)，此外系統(tǒng)提供QQ和GitHub賬號(hào)關(guān)聯(lián)登錄。

3.2? 管理員功能實(shí)現(xiàn)

管理員主界面如圖5所示。當(dāng)用戶進(jìn)行系統(tǒng)登錄時(shí)，系統(tǒng)對(duì)用戶的權(quán)限進(jìn)行判斷，若為管理員權(quán)限則成功登錄系統(tǒng)并進(jìn)入管理員主界面。

在管理員主界面的用戶統(tǒng)計(jì)中可瀏覽系統(tǒng)用戶的總注冊(cè)量、用戶的性別分布情況、日均注冊(cè)人數(shù)等信息。在文章分享量統(tǒng)計(jì)中可查看平臺(tái)內(nèi)公開的筆記數(shù)量總數(shù)以及每日分享筆記的數(shù)量。在用戶登錄統(tǒng)計(jì)中能夠詳細(xì)地查看每日登錄系統(tǒng)的人數(shù)以及每個(gè)用戶每日登錄系統(tǒng)的次數(shù)。在網(wǎng)盤使用情況中能夠查看系統(tǒng)內(nèi)網(wǎng)盤的剩余容量以及用戶已使用網(wǎng)盤容量的分布情況。以上的各種數(shù)據(jù)均能以折線圖、柱狀圖、餅狀圖以及文本的形式進(jìn)行展示并可供下載。系統(tǒng)管理員界面左側(cè)導(dǎo)航欄的網(wǎng)站信息包括查看用戶詳細(xì)信息、登錄詳細(xì)信息、筆記分享詳細(xì)信息等功能；筆記管理包括筆記分享審核、筆記日志查看等功能；用戶管理包括查看系統(tǒng)用戶列表、黑名單管理、查看用戶詳細(xì)日志等功能；網(wǎng)盤管理包括查看系統(tǒng)網(wǎng)盤信息、網(wǎng)盤詳細(xì)日志等功能；消息管理包括推送系統(tǒng)消息、查看系統(tǒng)消息詳細(xì)日志等功能；系統(tǒng)管理包括系統(tǒng)設(shè)置、查看系統(tǒng)日志、注銷當(dāng)前登錄等功能。

為了保證平臺(tái)良好的運(yùn)營(yíng)環(huán)境，平臺(tái)內(nèi)的用戶若在平臺(tái)交流中發(fā)現(xiàn)有違規(guī)信息或違規(guī)評(píng)論均可在平臺(tái)中對(duì)違規(guī)用戶進(jìn)行舉報(bào)，由管理員在登錄后查看舉報(bào)信息，核實(shí)后對(duì)用戶進(jìn)行不同時(shí)限的封禁。用戶黑名單管理界面如圖6所示。

3.3? 普通用戶功能實(shí)現(xiàn)

當(dāng)用戶進(jìn)行系統(tǒng)登錄時(shí)，系統(tǒng)對(duì)用戶的權(quán)限進(jìn)行判斷，若為普通用戶權(quán)限則成功登錄系統(tǒng)并進(jìn)入筆記編輯界面，如圖7所示。用戶可以進(jìn)行筆記編輯操作，包括標(biāo)題填寫、筆記標(biāo)簽、筆記內(nèi)容編輯、筆記附件添加，查看筆記分享以及筆記導(dǎo)出等功能。對(duì)于已存在的筆記文件，用戶可對(duì)其進(jìn)行重命名、位置移動(dòng)、刪除等操作。此外，為了防止文件被誤刪，系統(tǒng)提供回收站功能，文件進(jìn)入回收站后系統(tǒng)會(huì)自動(dòng)保留30天。在主頁上方導(dǎo)航欄中搜索可對(duì)筆記進(jìn)行搜索，點(diǎn)擊用戶名后可選擇對(duì)個(gè)人信息進(jìn)行編輯，查看站內(nèi)信息和公告。用戶名右側(cè)的數(shù)字標(biāo)識(shí)代表用戶在交流平臺(tái)內(nèi)的未讀消息數(shù)量。

在點(diǎn)擊用戶網(wǎng)盤后，用戶可進(jìn)入個(gè)人網(wǎng)盤主界面，如圖8所示。網(wǎng)盤主界面內(nèi)顯示網(wǎng)盤內(nèi)的全部文件并以進(jìn)度條的形式顯示用戶的網(wǎng)盤容量。用戶可在網(wǎng)盤內(nèi)創(chuàng)建文件夾，上傳下載文件，搜索文件，并且支持在線查看文件以及刪除文件。

4? 結(jié)? 論

本文提出一種在線筆記與交流平臺(tái)的解決方案，通過權(quán)限的劃分將整個(gè)平臺(tái)的使用者劃分為平臺(tái)管理員和普通使用者兩類，不同權(quán)限用戶通過登錄所屬賬號(hào)進(jìn)入所屬使用界面。在普通用戶方面，在用戶主頁新增目錄或筆記并進(jìn)行內(nèi)容上的編輯，用戶可隨時(shí)在個(gè)人網(wǎng)盤內(nèi)進(jìn)行文件的上傳和下載，選擇將筆記進(jìn)行公開，參與筆記的討論以及站內(nèi)的私信聊天。在系統(tǒng)管理方面，系統(tǒng)通過對(duì)日常用戶操作信息的收集，在平臺(tái)管理員界面以圖表的形式進(jìn)行數(shù)據(jù)可視化顯示。在對(duì)用戶的管理上，設(shè)置了用戶封禁功能、舉報(bào)審核功能等保證系統(tǒng)的正常運(yùn)營(yíng)。在線筆記與交流平臺(tái)能夠很好地取代傳統(tǒng)的筆記記錄方式，極大地簡(jiǎn)化了筆記記錄的流程，提供一個(gè)可隨時(shí)進(jìn)行交流的平臺(tái)，能夠在一定程度上提升工作效率。

參考文獻(xiàn)：

[1] 劉波.基于私有云的在線學(xué)習(xí)交流平臺(tái)的設(shè)計(jì)與實(shí)現(xiàn) [J].電子產(chǎn)品世界，2023，30（2）：70-75.

[2] 林榮杭，劉小英.基于Flutter的云筆記系統(tǒng) [J].信息技術(shù)與信息化，2021（10）：41-43+46.

[3] 張?zhí)K穎.基于云存儲(chǔ)的校園教學(xué)資源在線交流平臺(tái)設(shè)計(jì) [J].信息與電腦：理論版，2022，34（11）：125-127.

[4] 賀竑睿，周兵，林宏.基于C++跨平臺(tái)的云筆記設(shè)計(jì)與實(shí)現(xiàn) [J].無線互聯(lián)科技，2022，19（16）：109-111.

[5] 韋雪文.基于Spring Boot+Vue的爐況評(píng)價(jià)系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn) [J].電腦知識(shí)與技術(shù)，2022，18（35）：43-45+49.

[6] 辜萍萍，鄭宇輝.基于Spring Boot+Vue技術(shù)的漂書隊(duì)管理信息系統(tǒng)開發(fā) [J].數(shù)字技術(shù)與應(yīng)用，2023，41（1）：165-167.

[7] GU R J. A Lightweight Experimental Platform for Big Data Based on Docker Containers [EB/OL].[2023-02-12].https：//www.researchgate.net/publication/338424161_A_Lightweight_Experimental_Platform_for_Big_Data_Based_on_Docker_Containers.

[8] UPADHYAYA B，Mcgill M M. Dynamic Data Visualization for CSEdResearch.org using Tableau and MySQL [EB/OL].[2023-02-15].https：//dl.acm.org/doi/abs/10.1145/3328778.3372710.

作者簡(jiǎn)介：鹿德源（1998—），男，漢族，河南信陽人，碩士研究生在讀，主要研究方向：計(jì)算機(jī)視覺、深度學(xué)習(xí)；楊蕾（1979—），女，回族，河南洛陽人，教授，博士，主要研究方向：圖像處理、計(jì)算機(jī)視覺；王浩震（1997—），男，漢族，河南鶴壁人，碩士研究生在讀，主要研究方向：計(jì)算機(jī)視覺、深度學(xué)習(xí)。