【教程】第四章:任务与评论插件 —— 如虎添翼,顺利掌握

news/2024/11/14 1:20:59/文章来源:https://www.cnblogs.com/nocobase/p/18540419

回顾上一节

小伙伴们还记得上一节的挑战任务吗?我们要为任务表配置 状态附件 字段,并在任务列表里展示它们。别急,咱们先揭晓答案!

  1. 状态字段的配置
    • 选择 下拉菜单(单选) 字段,填写选项标签:未开始、进行中、待审核、已完成、已取消、已归档。颜色根据你的喜好自由设置,给任务增添一点色彩吧!

状态字段配置

  1. 附件字段的配置
    • 新建 附件 字段,给它取个名字,比如“附件”,点击提交,完成得简简单单。

  1. 任务列表显示创建人和状态
    • 在表格区块中勾选“创建人”、“状态”和“附件”字段,让任务列表展示更多关键信息,变得更加丰富。

任务列表显示字段

  1. 添加和编辑表单中显示字段
    • 在弹窗表单中,别忘了勾选状态和附件字段,这样无论是添加还是编辑任务时,都能方便地看到这些字段。

表单中显示字段

做得不错吧?别急,反复操作几次,你会发现自己逐渐熟练掌握 NocoBase 的核心用法。每一步操作都为你后续的任务管理打下坚实的基础,咱们继续往下看!


4.1 任务内容与评论:任务管理互动

到目前为止,你的任务管理系统已经能够承载基本的任务信息了。然而,我们知道,任务管理不仅仅是几行文字的描述,有时候我们需要更丰富的内容,以及团队成员之间的实时互动。

4.1.1 Markdown(Vditor):让任务内容更加丰富

你可能已经注意到了 NocoBase 提供的 富文本Markdown 编辑器,不过它们的功能可能还不够让你满意。
富文本编辑器功能较为有限,Markdown 编辑器虽然好用,但不支持实时预览。

那么,有没有一种编辑器既能实时预览、又支持丰富的功能呢?答案是肯定的!Markdown(Vditor) 是 NocoBase 里功能最强大的文本编辑器,支持实时预览、图片上传、甚至语音录制。而且,它已经内置在系统中,完全免费!

插件简介: 插件是NocoBase的核心功能之一,允许用户根据项目需求添加自定义功能或集成第三方服务。
通过使用插件扩展,可以扩展实现一些方便或意想不到的功能集成,更加方便你的创作与开发。

下面我将带你一步步开启这个强大的编辑器,还记得我们的插件管理器吗?哈哈没错,它就在里面。

Markdown(Vditor): 用于存储 Markdown,并使用 Vditor 编辑器渲染,支持常见 Markdown 语法,如列表,代码,引用等,并支持上传图片,录音等。同时可以做到即时渲染,所见即所得。

  1. 启用 Markdown(Vditor) 插件
    • 打开右上角的 插件管理器,输入 "markdown" 搜索插件,启用 Markdown(Vditor)。别担心页面会短暂刷新,几秒钟后它就会恢复正常啦。

启用 Markdown 插件

  1. 创建 Markdown 字段

    • 回到任务表,点击“创建字段”,我们的 Markdown Pro Plus 加强版已经出现了!

  • 给它取个名字,比如“任务详情(task_detail)”,勾选所有可用功能。
  1. 你可能注意到 “文件数据表” 的选项,不选会不会影响文件功能?不必担心,会存储到我们的默认存储空间中,放心使用吧。

  1. 测试 Markdown 字段
    • 现在返回任务管理页面,开始写下你的第一个 Markdown 文本吧!再试试粘贴图片,或者上传文件,是不是感觉很强大?

任务表越来越丰富了!跟随每个步骤,你的系统功能逐步扩展,接着我们来看看如何调整字段的排布,让界面更加美观。

4.1.2 调整字段的排布

随着任务表里字段的增多,页面布局可能会显得有些混乱,别担心,NocoBase 的灵活性让你可以轻松调整字段的位置。

调整字段位置

  • 将鼠标移到字段右上角的十字图标,点击并拖动字段到想要的位置,放手即可完成调整。试试看,页面瞬间整洁多了吧!

调整字段位置

这样操作后,页面布局会更符合你的需求。接下来,我们来为任务表增加评论功能,让团队互动更轻松。

4.2 评论功能

光有任务描述还不够,有时我们还需要团队成员为任务添加评论,讨论问题,记录反馈。一起开始实现吧。

4.2.1 方法一:使用评论插件

4.2.1.1 安装评论插件

评论插件 (商业插件): 提供评论数据表模板和区块,为任意数据表的数据添加评论功能。

注意添加评论时需要通过关系字段关联目标数据表,以免评论数据冲突

插件管理器 中,上传并启用 评论插件。插件启用后,数据源里会出现一个新的“评论表”选项。
点击添加 > 上传插件 > 拖入压缩包 > 提交
搜索评论,评论插件已经出现!开启后进入数据源,看到评论表的选项了,安装成功!

安装评论插件

4.2.1.2 新建评论表

我们切换到数据源,新建评论数据表 评论表(Comments)

4.2.1.3 评论表与任务表的关系探讨

我们已经创建了 评论表(Comments),可能你会想:是不是可以直接去页面上绘制评论区了呢?别着急,我们先来想一想,每个任务都有自己的评论区,而评论和任务之间应当是多对一的关系。那么如何把评论和任务联系起来呢?

对了!这就是我们接下来要用到的“关系字段”!

NocoBase 允许我们通过关系字段,在数据层面上把表与表之间的关系建立起来,就像搭建桥梁一样,将相关的数据紧密连接。

为什么选择多对一关系?

我们为什么要选择多对一关系,而不是一对多或其他类型的关系呢?回想一下,每个任务都有多个评论,因此,多条评论可以指向同一个任务。这种情况下,我们就需要在评论表中创建一个多对一的字段,指向任务表中的任务。

聪明的你可能已经想到:
既然评论和任务是多对一的关系,那么在任务表中是不是可以建立一个一对多的字段,来指向评论表呢?
恭喜你,完全正确! 一对多和多对一是互为反向的关系,我们同样可以在任务表里创建一个一对多的字段,关联到评论表。你真是棒极了!

4.2.1.4 设置多对一关系字段

接下来,我们就要在评论表中创建一个多对一的字段,用来与任务表进行关联。我们可以将这个字段命名为所属任务(belong_task)。在设置时,有几个关键配置需要注意:

  1. 数据源表:我们从哪里发起关系?这里选择的是评论表
  2. 目标数据表:我们要与哪张表建立关系?这里选择的是任务表

外键与目标数据表字段标识:举例:
接下来是关键的部分:外键目标数据表字段标识
这个概念听起来有点复杂?别担心,接下来我们用一个详细的例子来帮你轻松理解。

设想一个场景,假如你现在手里有很多张高考成绩单,我们的任务是将每一张成绩单找到它所对应的学生。那么我们如何做呢?
我们拿到了一张成绩单,上面有如下信息:

  • 姓名:张三
  • 班级:高三十五班
  • 准考证号:202300000001
  • 身份证号:111111111111
    现在,假设你想通过姓名班级来找到学生张三。但是问题来了——在同一个学校里,同名的学生有很多,光高三十五班就有 20 个叫张三的同学!这样光靠姓名和班级,很难精确地确认是哪一个张三对吧?
    这时候,我们就需要一个更独特的标识来帮助我们识别。比如,准考证号就是一个非常好的选择。每个学生的准考证号都是唯一的,通过准考证号,我们可以精准地找到成绩单对应的学生。例如,你发出了准考证号 202300000001 的查询,不一会儿,有个学校传来了回复:“这张成绩单属于张三,我们高三十五班第 3 排戴眼镜的那个!”
    同样的道理,回到评论关系设计的场景,你是否灵光一现:我们可以选一个任务表的唯一标识字段(比如 id),保存到这个评论中,来确定评论归属于哪个任务?
    这就是多对一关系的实现的核心概念:外键,简单吧,哈哈哈

我们在评论表中,保存任务表的这个唯一 id 字段,我们命名为 task_id,这样就能通过 task_id 把评论和任务绑定在一起。

4.2.1.5 删除时的外键处理策略

在 NocoBase 中,设置多对一关系后,还需要考虑如果删除任务时,评论的数据应当如何处理。你可以选择以下几种方式:

  • CASCADE:如果你删除了任务,所有与这个任务关联的评论也会一起被删除。
  • SET NULL(默认设置):任务被删除时,评论的数据会被保留,但关联的外键字段会被置空。
  • RESTRICT 和 NO ACTION:当任务有关联的评论时,系统会阻止你删除这个任务,确保评论不会丢失。

4.2.1.7 在任务表中创建反向关系

最后,我们勾选 ”在目标数据表里创建反向关系字段”,用来方便我们从任务中查看所有关联的评论。这让数据管理更加便捷。

在 NocoBase 中,关系字段的存放位置决定了数据的获取方式,所以如果我们希望在任务表中也能查看到对应的评论数据,就需要在任务表中创建一个一对多的反向关系字段,关联到评论表。

当你再次打开任务表时,系统会自动生成一个关联的评论字段,并注明“一对多”的关系,这样你就可以轻松查看和管理所有关联的评论啦!

4.3 页面搭建

4.3.1 开启评论表

紧张刺激的时刻来了,我们回到编辑弹窗,创建评论表区块,顺便勾上需要的功能,搞定!

demov3N-16.gif

4.3.2 调整页面

我们美化下页面样式,鼠标放在编辑按钮右上侧,选择较宽的弹窗。运用我们刚学的知识,拖动评论区块,放在弹窗右侧,完美!

demov3N-17.gif

现在有的朋友可能眼馋了:我也想要实现评论!别怕,我也为你准备了第二种免费方案。

4.2.2 方法二:自定义评论表

如果你没有购买评论插件,我们还可以通过创建普通表来实现类似的评论功能。

  1. 新建评论表

    • 创建 评论表(comments2),添加 评论内容(content) 字段(Markdown 类型)和 所属任务(belong_task) 字段(多对一类型)。
  2. 在页面中创建评论列表区块

    • 在任务表的编辑弹窗中,添加一个 列表区块(我们的第三种区块出现啦,列表同时可以展示字段的详情信息),选择评论,测试一下:
      创建评论列表区块

小结

你已经学会了如何通过 Markdown(Vditor) 丰富任务内容,并且给任务添加了评论功能!任务管理系统已经有了完整的功能基础,是不是感觉自己离打造一个专业的任务管理工具更近了一步呢?

别忘了继续探索和操作,NocoBase 充满无限可能。如果你遇到什么问题,别慌,我会一直陪着你,带你走过每个步骤。

下一章(第五章:标签页 & 区块 —— 丰富视图,精彩纷呈),我们将深入探索 NocoBase 的更多区块功能,帮助你把系统提升到一个新的高度。继续加油!


继续探索,尽情发挥你的创造力!如果遇到问题,不要忘了随时可以查阅 NocoBase 官方文档 或加入 NocoBase 社区 进行讨论。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/831948.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

wsl2踩坑日记(配置代理/zsh+p10k/Neovim)

1. proxy wsl --install Ubuntu-24.04 安装好 wsl 之后,测试了一下 v2rayN 的代理能不能正常使用(用 vultr 服务器搭建的校园网 ipv6 免流),发现可以 curl www.google.com,但是 sudo apt-get update 报错 Clearsigned file isnt valid, got NOSPLIT (does the network req…

基于MIMO系统的SDR-AltMin混合预编码算法matlab性能仿真

1.算法仿真效果 matlab2022a仿真结果如下(完整代码运行后无水印): 仿真操作步骤可参考程序配套的操作视频。2.算法涉及理论知识概要基于MIMO(Multiple-Input Multiple-Output)系统的SDR-AltMin混合预编码算法是一种先进的无线通信技术,它结合了凸优化和交替最小化技术来…

前端技术对html中块级元素的学习

块级元素目录块级元素列表元素有序列表无序列表自定义列表 列表元素 有序列表 在 HTML 中, 标签用来表示有序列表。有序列表之间的内容有先后顺序之分,例如菜谱中的一系列步骤,这些步骤需要按顺序完成,这时就可以使用有序列表。 我们来看一个简单的实例: <!DOCTYPE ht…

IDEA-idea激活

通过百度网盘分享的文件:IDEA激活工具 链接:https://pan.baidu.com/s/18QIqrMVE4ScNhBjhwde_7Q 提取码:sky1二、重启电脑

说明与笔记导航

对使用这些笔记的同学想说的话,以及更新进度。为什么写这么多B东西? 其一呢是帮助我自己,边写笔记边梳理知识;其二呢是帮助各位义父义母考试成功。 更新进度与内容说明 11.11:本周工作日需突击学习python,计划今晚更新有限体积法剩余部分。 目前进度:3009 建模:数值方法…

鸿蒙NEXT开发案例:指尖轮盘

【1】引言 “指尖轮盘”是一个简单而有趣的互动游戏(类似抓阄),这个应用通过触摸屏幕的方式,让玩家参与一个激动人心的游戏,最终选出幸运的赢家。未来可以进一步扩展功能,如增加游戏模式、优化动画效果、增加音效等,提升用户体验。 【2】环境准备 电脑系统:windows 10 …

antD——Warning: `callback` is deprecated. Please return a promise instead.

参考: 1. https://blog.csdn.net/huochai770880/article/details/125925665我的情况 antD表单校验,代码未报错,但提交时控制台报错:Warning: `callback` is deprecated. Please return a promise instead.原报错代码:const validateParams = useCallback((_: RuleObject, …

Qml 中的那些坑(七)---ComboBox嵌入Popup时,滚动内容超过其可见区域不会关闭ComboBox弹窗

最近在写信息提交 ( 表单 ) 的窗口时发现一个奇怪的 BUG: 可以看到,当 `ComboBox` 嵌入 `Popup` 时,点开 `ComboBox`,然后滚动内容超过其可见区域并不会关闭 `ComboBox` 弹窗,并且会超出其 `父 Popup` 范围。【写在前面】 最近在写信息提交 ( 表单 ) 的窗口时发现一个奇怪…

【Cytoscape 3.10软件下载与安装教程】

1、安装包 Cytoscape3.10: 链接:https://pan.quark.cn/s/0fc00372f3a4 提取码:styP Cytoscape3.9 链接:https://pan.quark.cn/s/f2747b32fe54 提取码:ean2 Cytoscape3.8: 链接:https://pan.quark.cn/s/c6092262f108 提取码:24G6 Cytoscape3.7: 链接:https://pan.qua…

max 函数与 min 函数相关

max 函数与 min 函数相关前情概要 只要有两个实数,就会涉及能大小比较的问题,那么只要有两个函数,自然也会涉及能大小比较的问题,比如我们熟悉的两个简单函数 \(y=2x+1\) 和 \(y=-x+1\),做出两个函数的图象如下,从图象可以看出,当 \(x<0\) 时,\(g(x)>f(x)\);当 …

kafka监控

kafka监控部署 kafka使用Prometheus、Grafana和kafka_exporter来构建kafka指标监控 问题背景 在实时场景下,对于数据积压是很常见的,我们更希望如何去快速知道有没有数据积压,目前消费了多少,速度怎么样,趋势如何。可以使用原生命令kafka-consumer-groups.sh --bootstrap-…

实景三维赋能地灾风险管控

在当今社会,随着城市化进程的加速以及工业化的发展,地质灾害成为了威胁人们生命财产安全的重要因素之一。特别是在全球气候变化的背景下,极端天气事件的增多导致地质灾害的发生频率和强度都有所上升。因此,如何有效地进行地质灾害的风险管控,成为当前亟待解决的问题之一。…