粥里有勺糖

vuePress-theme-reco 粥里有勺糖    2018 - 2023
粥里有勺糖 粥里有勺糖

Choose mode

  • dark
  • auto
  • light
关于我
备战春秋
  • 心得总结
  • 校招考点汇总
  • 面经汇总
  • 复习自查
技术笔记
  • 技术教程
  • 模板工程
  • 源码学习
  • 技术概念
  • 个人作品
  • 学习笔记
计算机基础
  • 算法与数据结构
  • 操作系统
  • 计算机网络
  • 设计模式
  • 剑指offer
大前端
  • javascript
  • vue
  • html
  • css
  • 🌏浏览器专题
  • Web性能优化
  • regexp
  • node
面试
  • 问解
  • javascript
  • css
  • 手撕代码
  • 性能优化
  • 综合问题
  • 面经汇总
  • 小程序
手撕代码
  • 数据结构与算法
  • javascript
  • css
个人站点
  • GitHub (opens new window)
  • 博客园 (opens new window)
  • 掘金 (opens new window)
线上作品
  • 轻取(文件收集) (opens new window)
  • 个人图床 (opens new window)
  • 考勤小程序 (opens new window)
  • 时光恋人 (opens new window)
  • 在线简历生成 (opens new window)
留言板
Github (opens new window)
author-avatar

粥里有勺糖

285

文章

40

标签

关于我
备战春秋
  • 心得总结
  • 校招考点汇总
  • 面经汇总
  • 复习自查
技术笔记
  • 技术教程
  • 模板工程
  • 源码学习
  • 技术概念
  • 个人作品
  • 学习笔记
计算机基础
  • 算法与数据结构
  • 操作系统
  • 计算机网络
  • 设计模式
  • 剑指offer
大前端
  • javascript
  • vue
  • html
  • css
  • 🌏浏览器专题
  • Web性能优化
  • regexp
  • node
面试
  • 问解
  • javascript
  • css
  • 手撕代码
  • 性能优化
  • 综合问题
  • 面经汇总
  • 小程序
手撕代码
  • 数据结构与算法
  • javascript
  • css
个人站点
  • GitHub (opens new window)
  • 博客园 (opens new window)
  • 掘金 (opens new window)
线上作品
  • 轻取(文件收集) (opens new window)
  • 个人图床 (opens new window)
  • 考勤小程序 (opens new window)
  • 时光恋人 (opens new window)
  • 在线简历生成 (opens new window)
留言板
Github (opens new window)
  • wheel

    • 个人作品
    • 时间管理CLI工具
      • 做一个CLI版的时间管理工具(一)
      • 做一个CLI版的时间管理工具(十)
      • 做一个CLI版的时间管理工具(11)
      • 做一个CLI版的时间管理工具(12)
      • 做一个CLI版的时间管理工具(13)
      • 做一个CLI版的时间管理工具(14)
      • 做一个CLI版的时间管理工具(15)
      • 做一个CLI版的时间管理工具(二)
      • 做一个CLI版的时间管理工具(三)
      • 做一个CLI版的时间管理工具(四)
      • 做一个CLI版的时间管理工具(五)
      • 做一个CLI版的时间管理工具(六)
      • 做一个CLI版的时间管理工具(七)
      • 做一个CLI版的时间管理工具(八)
      • 做一个CLI版的时间管理工具(九)
    • 组装个支持记笔记的CodePen
    • ESCheck工具原理解析及增强实现
    • 一款检测代码中TODO的eslint插件
    • 实现一个Web UI检测(视觉走查)工具ing
    • 从0-1实现文件下载CLI工具
    • 内联JS处理(ES语法降级&内容压缩)
    • Node CLI工具原理解析
    • 我打造的在线简历生成应用
    • 助你轻松编写与分享snippet的VsCode插件
    • SourceMap解析CLI工具实现
    • 一个通过NPM包共(分)享代码块的解决方案
    • 实践:给女朋友个性化定制应用-体重记录(一)
    • 实践:给女朋友个性化定制应用-体重记录(二)
    • 实践:给女朋友个性化定制应用-体重记录(三)

做一个CL版的时间管理工具(八)

vuePress-theme-reco 粥里有勺糖    2018 - 2023

做一个CL版的时间管理工具(八)

粥里有勺糖 2021-08-09 技术笔记个人作品CLI工具

# 做一个CLI版的时间管理工具(八)

# 前言

上一篇文章主要阐述了删除任务与事物管理相关的指令开发

本文将着重介绍上文没讲解完的部分writeRecord方法,将记录的事物自动输出到配置的文件中

# 本期效果

演示过程中发现了一个bug,赶紧修复一下

图片

# 功能开发

# 自动记录事务

首先补齐打印事务耗时的逻辑

  • 从获取的配置文件中解构出事务对象thing,包含两个属性
    • name
    • startTime
  • 使用new Date(startTime)转换开始日期
  • 调用mmsToNormal计算当前时间与开始时间的差值
const { thing } = config
const s = new Date(thing.startTime)
console.log(`事务耗时:${thing.name} ${mmsToNormal(Date.now() - s)}`);
1
2
3

mmsToNormal方法非常朴素,将一个毫秒表示的时间换成天,时,分,秒

  • 其中数字取整采用位运算符>>,右移0位
  • 逐级取值
function mmsToNormal(mms) {
    mms = (mms / 1000) >> 0
    const day = (mms / (24 * 60 * 60)) >> 0
    mms -= day * 24 * 60 * 60
    const hour = (mms / (60 * 60)) >> 0
    mms -= hour * 60 * 60
    const minute = (mms / 60) >> 0
    mms -= minute * 60
    return `${day}天 ${hour}时 ${minute}分 ${mms}秒`
}
1
2
3
4
5
6
7
8
9
10

在结束当前事务和直接开始新的事务的时候都会打印这个任务的耗时,然后将其结果写入到md中

开始新任务的逻辑如下:

  • 打印耗时
  • 输出记录到文件中
  • 更新事务的值为最新的事务
  • 更新配置
console.log(`事务耗时:${thing.name} ${mmsToNormal(Date.now() - s)}`);
writeRecord(recordFilepath, task, thing.name, thing.startTime)

thing.name = name
thing.startTime = new Date().getTime()
writeFileSync(configPath, JSON.stringify(config))
1
2
3
4
5
6

下面开始介绍writeRecord的实现,接收4个参数

  • filePath:输出目标文件的路径
  • task:当前进行中的任务名
  • thing:当前进行中的事务名
  • startTime:事务开始时间
function writeRecord(filePath, task, thing, startTime){
    // ...code
}
1
2
3

通过getJSON与getFileContent方法合力将输出目标文件转为json

将开始时间转为Date对象,调用Date.prototype.format方法获取事务开始时间的日期

其中format方法的逻辑来源与网上大神写的正则 (opens new window)

事务持续时间保留5位小数

const json = getJSON(getFileContent(filePath))
const date = new Date(startTime)
const title = date.format('yyyy-MM-dd')
const hours = ((Date.now() - date.getTime()) / 3600000).toFixed(5)
1
2
3
4

导出json使用的是outPutMarkdown方法,默认导出结果不会带时间,例如

# 时间
## 任务名
* content
* 事务2
1
2
3
4

通过修改获取的json,将content内容加上时间,加上时间后的输出结果

# 时间
## 任务名
* content time
* 事务2 0.02
1
2
3
4

修改原数据content加上time的逻辑如下:

  • 通过reduce方法遍历所有的tasks
  • 通过map方法将所有task中的things读取出来
  • 调用flat方法展开数组
  • 再遍历每一个thing,为其content加上时间
const things = json.reduce((pre, v) => {
    const { tasks } = v
    const things = tasks.map(v => v.things).flat(2)
    return pre.concat(things)
}, [])
things.forEach(t => {
    const { content, time } = t
    t.content = `${content} ${time}`
})
1
2
3
4
5
6
7
8
9

下面开始核心逻辑

遍历json判断事务对应的日期是否已经存在

不存在则为当天的首个数据,直接向json对象中插入这个完整的对象即可

const dayIdx = json.findIndex(v => v.title === title)

if (dayIdx === -1) {
    const item = {
        title,
        tasks: [
            {
                title: task,
                things: [
                    {
                        content: `${thing} ${hours}`,
                        time: '0'
                    }
                ]
            }
        ]
    }
    json.push(item)
    return writeFileSync(filePath, outPutMarkdown(json, false))
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

如果不是当天首个事务,接着就判断是否是一个新的任务

遍历这一天数据中的每一个任务,判断任务名是否和当前的任务一致

  • 如果是,则将这个任务及事务相关数据插入到这一天的数据中
  • dataItem表示这一天的数据
const dataItem = json[dayIdx]
const taskIdx = dataItem.tasks.findIndex(v => v.title === task)
// 新的任务
if (taskIdx === -1) {
    dataItem.tasks.push({
        title: task,
        things: [
            {
                content: `${thing} ${hours}`,
                time: '0'
            }
        ]
    })
    return writeFileSync(filePath, outPutMarkdown(json, false))
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

最后就是直接将事务插入到旧的任务当中

const taskItem = dataItem.tasks[taskIdx]
taskItem.things.push({
    content: `${thing} ${hours}`,
    time: '0'
})

return writeFileSync(filePath, outPutMarkdown(json, false))
1
2
3
4
5
6
7

到此timc thing [option] [name]指令基本开发完毕

  • --stop,-s:结束当前事务

# 其它

由于每天空闲时间有限,本文就先到这

如果读者还感觉意犹未尽,敬请期待后续更新,或持续关注一下仓库 (opens new window)的状态

欢迎评论区提需求,交流探讨

本系列会不断的更新迭代,直至产品初代完成

  • 仓库地址 (opens new window)
Edit this page (opens new window)
Last Updated: 2022/5/15 12:46:34