通过 Dataviewjs 制作一个带数据面板的任务筛选框 - 丝滑到飞起

1. 简介与说明

任务管理对每个人来说都是必不可少的，然而，每个人的需求和习惯却各不相同。你可能会见到各种不同的插件、时间线和日历视图，但是否真的能满足你的实际需求？

我曾经尝试过许多流行的任务管理工具，但总感觉不能完全符合我的要求。或许我的需求比较特别，我只想简单统计、快速筛选，以迅速得出结果。

本文的目的即使作为一个初学者，小白也不再需要费心去学习复杂的语法或插件使用方法，甚至不需要熟悉 tasks 插件的语法，只需简单点击即可完成任务管理。

2. 效果

3. 安装使用

1. 文章末尾即可下载压缩包中 02_查询语法文件及css 一共 2 个文件 ， view.css view.js ； 不能换成其他的名称； dataview 的语法规定如此，别改了 ，改了用不了
2. 路径 -1：这 2 个文件，你随便放；建议放在不是根目录的文件夹；
3. 路径 -2：你下载之后，放的路径，肯定与我发的演示这个语法里面的路径不一样，自己改喔
4. 使用：在任何一个 Page 页面，输入 dataviewjs 的查询 查询语法，例子如下
5. 使用：改路径，改路径，改路径，说三扁哈；"987_Task任务面板/02_查询语法文件及css" , 就是改这个，最末尾不要加反斜杠切记 ；
6. 原理 ：这个路径写它，是说语法在这个路径下面，去寻找 view.css view.js 这 2 个文件，所以要改，不改用什么查 ；

(async () => {
    await dv.view("987_Task任务面板/02_查询语法文件及css",);
})();

4.查询相关参数解释

关于日期（这个是统计的标准 ，每个人对任务的理解不一样，直接导致统计的结果不一样）

1. due ： 任务的截止日期
2. scheduled ： 我大概预计什么时候开始做这事儿的日期
3. completion ： 你在 tasks 这个插件上看不到；是吗？ 因为我用的是 dataview 的语法 ； 在后台 ，隐藏信息里面有的
4. 统计标准：我讲的 已经安排 → 指的 Scheduled 的日期 ； 截止 指的就是 due； 完成日期就是 completion

第 1 排的筛选解释

1. 今天到期：指的是有设定 due ，且日期为今天的任务 ；这个没办法进行日期筛选，因为本身就是限定为当天
2. 已经超期： 指的是 未完成 + 有 due + 超期了； 可以日期筛选 + 排序
3. 有截止日期：指的 未完成 + 有 due ； 可以日期筛选 + 排序
4. 已安排： 指的是 未完成 + 有 scheduled 这个日期； 可以日期筛选 + 排序
5. 已安排 ：把的是有 已完成 + completion 这个日期 ； 可以日期筛选 + 排序
6. 项目已完成：针对的有 父子项的任务 ；表示所有的子任务全部完成了
7. 本月未完成 ： 未完成 + 有 due + 且截止日期在月底之前

第 2 排的筛选解释

1. `10天内待办` ： 为什么是10天？7天行不行？ 3天行不行？ 8天行不行？当然行，自己去修改`view.js`里面的 ` WaitingDayNumber ` 这个变量的值哈 ；我搞这个筛选的原因：相当于它是一个安全盒，只要我排期（`due` 或者 `scheduled`） 了；比如在10天内，我会知道我的任务压力值；会去看看，时时调整

2. `计划未完成`： 什么是`计划`？ 标准是什么？ ，我的标准就是：我设定了 `due - 截止日期` |  `scheduled` -- 大概做的日期； 相当于在我准备做的时间线里面； 任务可以有100个，可能有前20个我最近 想做，有80个是以后的，我可以只排这20个的日期； 

3. `全部未完成` ： 就是字面意思 ， 你所有的，只要没有√的任务，都展示

4. `循环未完成`： 首先讲明 ，dataview的官网 里，我也找了，也输出打印了，目前没看着这个字段key，没办法进行筛选；那么，我是通过啥筛选的？ 是通过你的文本里面，有那个循环的符号，`🔁` 通过它来实现的； 当然 后期如果我找着了，或者 官网 明确写了，只能再更新 函数了；毕竟循环任务也不多吧？ 直接批量生成就行了。

5. `意外情况` ： 筛选标准指的是`[?]` , 任务的括号里面，有一些其他的字符，正常的话，一般是完成 就是`×` ； 没完成就是空的； 当然 有插件，搞了特别花式儿的各种符号； 那么你就可以用这个筛选； 下面有照片 

6. `未完成项目`： 字面意思，必须得是项目； "未完成" ，是说你没有全部完成 ，因为有父子级的存在；适合于多线程任务管理 ；  
7. `本周未完成`： 就是本周的嘞，没完成 的嘞 ，简单 

日期筛选，我觉得要讲的部分

1. 日期搜索 ： 这个是我做了优化，你可以搜索中文。一月 | 1月 10~15号 2024年 2022年 ；可以跨年；跨月； ”明天，明年，后年，本月 ，上月，下个月，下月 “ ；都行，常用的我都优化了
2. 时间块搜索： 什么块儿？ 比如 100 天内 10 天内 ； 你想快速 知道 你未来 ，过去 XX 天内有多少任务用的； 输入 100，就是未来 100 天； 输入 -10，就是查看回顾过去 10 天的； 输入 ” -5 10 ” ; 就是过去 5 天 + 未来 10 天的
3. Text ： 就是文本呀，任务里面写的有什么关键字，你去搜
4. tags ： 这不讲
5. Section ： 就是任务的上级，平时我们写的 list， task, 都是归属于某个 heading 下面，这一块儿，就叫 section ； 有啥用呀： 比如有人写任务，就是固定在某个 标题下面 ，那么以后回顾的时候，就可以直接搜索这个标题；可以筛选出所有相关的任务；

排序，为什么有 2 个呀 ？

1. 来源于大佬呀， 大佬  cuman 的文章：如何给 DataviewJS 中的 TaskList 的任务列表排序
2. 举例一下：一个 Page 里面有 100 个任务，截止日期 ， 安排日期，都不一样的，你平时写也很难保证 完全 是按顺序的
3. 如果你按 Page 的名称排序了，如何保证 日期也是按顺序的呢？
4. So 我们有 2 个，一个是针对 string ： 就是 text ，tag ，scetion，全部都是 string ；
5. 第二个就是日期类，按 due scheduled ，都可以自己排

分组？ 分什么组？

视频教程

作为一个小白，也不是程序员，学习了个把月，才完善出这个查询框，至少是符合自己喜欢的，适合自己的，因为一直没有找着别人写的能令自己满意 的，只能自己写了，但是平台 ，还有各个社区，开源的氛围非常的好，很多人分享的有用的知识，非常感谢，我也想把自己的一点儿点儿小心得分享出来。

如果方便还有什么不清楚 的，我也制作了视频讲解

如果哪儿有 bug，也欢迎在文章后留言反馈，我及时修改补充

代码下载

请移步文末的讨论区中下载代码，其中记得把 演示及查询语法代码 中的 "987_Task任务面板/02_查询语法文件及cs" 换成自己的路径。

讨论

若阁下有独到的见解或新颖的想法，诚邀您在文章下方留言，与大家共同探讨。