在线笔记与交流平台设计与实现

鹿德源 杨蕾 王浩震

摘  要：随着办公无纸化和信息化的演进，传统手写笔记、文档的记录方式逐渐被移动存储和在线记录方式所取代。文章设计一种基于B/S架构的在线笔记与交流平台，将笔记记录、文档管理、个人云盘、在线交流集成在同一个系统内。用户可通过终端浏览器随时进行使用，简化了笔记、文档记录和管理的流程，并且能够进行笔记的检索和相关内容的讨论。该平台设计完成度高，具有可用性强、操作简单等特点，可随时投入实际应用。

关键词：SpringBoot；Vue；在线笔记；交流平台

中图分类号：TP311  文献标识码：A  文章编号：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  引  言

笔记的记录作为日常生活和学习中的一个重要环节，其记录情况与管理方式关乎人们工作和学习的效率[1，2]。随着信息时代的到来以及办公无纸化的推进，传统的手工記录笔记或将文档存储于个人PC或U盘上已经不能满足诸多远程办公场景的需要。相较于传统的笔记记录管理方法，使用云平台进行笔记记录和文档存储更加便捷。此外现存在的笔记记录平台均不提供交流的平台，这限制了信息的流通，所以需要开发低成本，同时兼具笔记记录管理与交流的在线笔记记录与交流系统，使用户随时能够进行笔记记录与交流。

1  系统概述

在线笔记与交流平台面向的主要用户是在校学生和IT从业者，旨在为他们提供一个能够随时进行笔记记录和交流的平台。该平台通过使用在线Web平台进行笔记记录的方式取代传统的纸质手写或PC离线编辑的方式，此外提供一个笔记分享交流的平台用于平台内用户的交流。

1.1  系统工作原理

在线笔记与交流平台采用B/S架构和MVC模式开发。B/S架构将系统功能实现的核心部分封装过后集中到Web服务器上，简化了系统的开发、维护和使用，使用户随时可通过浏览器远程访问系统[3，4]。系统的工作原理图如图1所示。

MVC模式全称为模型-视图-控制器模式，在线笔记与交流平台采用MVC的设计模型，在MVC模式下系统各个层级之间的分工明确[5]。在MVC模式下系统的不同接口与功能实现类之间的耦合度降低，同时采用MVC模式有利于系统后期的更新与维护。MVC设计模式的结构如图2所示。

1.2  系统结构功能设计

系统的角色主要分为系统管理员和普通用户。其中普通用户在登录平台后，可实现实时的笔记编辑、查看、修改、分享以及交流，此外平台还提供个人用户网盘，用户可随时进行文件的上传和下载。系统管理员主要是对系统的运行情况进行监测，通过查看平台的各项数据，实时了解平台的运行情况，其中包括已注册用户量、新增笔记数量、系统网盘空间使用情况、笔记的分享审核、用户举报审核、发布系统公告等功能。在线笔记与交流平台的系统结构图如图3所示。

1.3  系统的工作流程

在线笔记与交流平台的系统功能包括普通用户对笔记的相关操作、平台管理员对系统的相关操作，具体功能如下。

1.3.1  权限登录功能

系统设计之初考虑为系统用户划分不同权限，不同权限用户通过登录操作实现个人权限的验证，登录到个人所属权限的操作界面。主要包括平台管理员能够登录进入平台的管理操作界面，普通用户能够登录进入笔记记录查看分享等相关操作的界面。

1.3.2  个人信息管理

用户登录系统后可对自己的账户信息（账户密码）以及个人的相关信息（个人昵称、用户邮箱、头像、个人简介等）进行管理，用于平台内用户信息展示，分享时的分享者信息（仅展示用户昵称和头像）展示。

1.3.3  用户笔记的相关操作

系统普通用户登录系统后可进行对笔记的相关操作，其中包括用户新增笔记、修改笔记、删除笔记、笔记目录管理、搜索笔记等功能。其中新增笔记首先需要新建笔记文件，输入笔记名称，编辑笔记内容，填写笔记标签（笔记标签为选填项）；修改笔记就是对已有的笔记内容进行更新操作；笔记目录管理就是对用户账号下的文件或笔记目录进行新增、删除、修改名称等操作；搜索笔记即用户可在平台内通过关键词对已公开的笔记进行搜索的操作。

1.3.4  用户个人云盘管理

系统的普通用户登录系统后可对个人云盘进行相关操作，用户可在系统内进行文件的上传和下载、文件的实时在线预览、文件的分享等。

1.3.5  系统后台管理

平台管理员在成功登录系统后台后，在系统的后台对其模块进行相关的管理操作，包括网站内容管理、笔记管理、用户管理、云盘管理、系统消息发布等。

具体的系统工作流程图如图4所示。

2  系统设计

2.1  系统数据库设计

数据库概念模型是在系统设计之初进行数据库设计时，将系统内的事物实体进行抽象化，形成数据库的初始数据模型。

在线笔记与交流平台的实体类包括系统用户实体类、笔记实体类、笔记附件实体类、笔记目录实体类、回收站实体类、系统日志实体类、用户权限实体类、系统消息实体类、云盘目录实体类、用户云盘实体类、用户黑名单实体类等，实体类属性如下：

用户实体类：用户ID、手机号码、昵称、邮箱、性别、邮编、创建时间等属性。

笔记实体类：笔记ID、笔记标题、用户ID、目录ID、是否公开、分享链接、点赞数量、创建时间、修改时间等属性。

笔记附件实体类：用户ID、附件名称、笔记ID、附件存储路径、创建时间等属性。

笔记目录实体类：目录ID、目录名称、用户ID、创建时间等属性。

回收站实体类：笔记ID、笔记名称、用户ID、回收时间等属性。

系统日志实体类：用户ID、操作内容、用户IP、操作时间、请求方式等属性。

用户权限实体类：用户ID、账号密码、权限类型、创建时间、权限ID等属性。

系统消息实体类：消息ID、消息类型、消息名称、消息内容、发送人ID、接收人ID、消息状态、创建时间等属性。

云盘目录实体类：云盘目录ID、用户ID、目录名称、创建时间、修改时间等属性。

用户云盘实体类：文件ID、用户ID、文件名称、文件大小、创建时间等属性。

用户黑名单实体类：黑名单ID、用户ID、原因、创建时间、截止时间等属性。

系统内设计user（平台用户）、pan_dir（云盘目录）、role（用户权限）、article_recycle（笔记回收站）、article_dir（笔记目录）、user_pan（用户云盘）、user_blacklist（用户黑名单）、notify（系统消息）、article（笔记）、article_afftix（笔记附件）、log（系统日志）11个实体表。

2.2  系統开发工具与运行环境

前端使用Vue框架，开发工具为HBuilder；后端使用Java语言、SpringBoot框架[6-8]，开发工具为IDEA；数据库采用MySQL，数据库开发工具为Navicat。

系统环境为CentOS 7.2，Web服务器选用Tomcat，版本控制器为Git，持续化部署工具为Docker+Jenkins。

3  系统功能实现

3.1  登录注册功能实现

用户进入系统后会首先进入登录界面，用户通过输入手机号及密码进行登录操作，若未注册可点击注册，此外系统提供QQ和GitHub账号关联登录。

3.2  管理员功能实现

管理员主界面如图5所示。当用户进行系统登录时，系统对用户的权限进行判断，若为管理员权限则成功登录系统并进入管理员主界面。

在管理员主界面的用户统计中可浏览系统用户的总注册量、用户的性别分布情况、日均注册人数等信息。在文章分享量统计中可查看平台内公开的笔记数量总数以及每日分享笔记的数量。在用户登录统计中能够详细地查看每日登录系统的人数以及每个用户每日登录系统的次数。在网盘使用情况中能够查看系统内网盘的剩余容量以及用户已使用网盘容量的分布情况。以上的各种数据均能以折线图、柱状图、饼状图以及文本的形式进行展示并可供下载。系统管理员界面左侧导航栏的网站信息包括查看用户详细信息、登录详细信息、笔记分享详细信息等功能；笔记管理包括笔记分享审核、笔记日志查看等功能；用户管理包括查看系统用户列表、黑名单管理、查看用户详细日志等功能；网盘管理包括查看系统网盘信息、网盘详细日志等功能；消息管理包括推送系统消息、查看系统消息详细日志等功能；系统管理包括系统设置、查看系统日志、注销当前登录等功能。

为了保证平台良好的运营环境，平台内的用户若在平台交流中发现有违规信息或违规评论均可在平台中对违规用户进行举报，由管理员在登录后查看举报信息，核实后对用户进行不同时限的封禁。用户黑名单管理界面如图6所示。

3.3  普通用户功能实现

当用户进行系统登录时，系统对用户的权限进行判断，若为普通用户权限则成功登录系统并进入笔记编辑界面，如图7所示。用户可以进行笔记编辑操作，包括标题填写、笔记标签、笔记内容编辑、笔记附件添加，查看笔记分享以及笔记导出等功能。对于已存在的笔记文件，用户可对其进行重命名、位置移动、删除等操作。此外，为了防止文件被误删，系统提供回收站功能，文件进入回收站后系统会自动保留30天。在主页上方导航栏中搜索可对笔记进行搜索，点击用户名后可选择对个人信息进行编辑，查看站内信息和公告。用户名右侧的数字标识代表用户在交流平台内的未读消息数量。

在点击用户网盘后，用户可进入个人网盘主界面，如图8所示。网盘主界面内显示网盘内的全部文件并以进度条的形式显示用户的网盘容量。用户可在网盘内创建文件夹，上传下载文件，搜索文件，并且支持在线查看文件以及删除文件。

4  结  论

本文提出一种在线笔记与交流平台的解决方案，通过权限的划分将整个平台的使用者划分为平台管理员和普通使用者两类，不同权限用户通过登录所属账号进入所属使用界面。在普通用户方面，在用户主页新增目录或笔记并进行内容上的编辑，用户可随时在个人网盘内进行文件的上传和下载，选择将笔记进行公开，参与笔记的讨论以及站内的私信聊天。在系统管理方面，系统通过对日常用户操作信息的收集，在平台管理员界面以图表的形式进行数据可视化显示。在对用户的管理上，设置了用户封禁功能、举报審核功能等保证系统的正常运营。在线笔记与交流平台能够很好地取代传统的笔记记录方式，极大地简化了笔记记录的流程，提供一个可随时进行交流的平台，能够在一定程度上提升工作效率。

参考文献：

[1] 刘波.基于私有云的在线学习交流平台的设计与实现 [J].电子产品世界，2023，30（2）：70-75.

[2] 林荣杭，刘小英.基于Flutter的云笔记系统 [J].信息技术与信息化，2021（10）：41-43+46.

[3] 张苏颖.基于云存储的校园教学资源在线交流平台设计 [J].信息与电脑：理论版，2022，34（11）：125-127.

[4] 贺竑睿，周兵，林宏.基于C++跨平台的云笔记设计与实现 [J].无线互联科技，2022，19（16）：109-111.

[5] 韦雪文.基于Spring Boot+Vue的炉况评价系统的设计与实现 [J].电脑知识与技术，2022，18（35）：43-45+49.

[6] 辜萍萍，郑宇辉.基于Spring Boot+Vue技术的漂书队管理信息系统开发 [J].数字技术与应用，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.

作者简介：鹿德源（1998—），男，汉族，河南信阳人，硕士研究生在读，主要研究方向：计算机视觉、深度学习；杨蕾（1979—），女，回族，河南洛阳人，教授，博士，主要研究方向：图像处理、计算机视觉；王浩震（1997—），男，汉族，河南鹤壁人，硕士研究生在读，主要研究方向：计算机视觉、深度学习。