#小程序云开发挑战赛#-BT清单-BT工作助手

发布于 5 年前作者 yonghu4088 次浏览最后编辑 5 年前来自 share

应用场景

____BT清单是一个结合了清单和计时功能的小程序,用户可以设置每一天的任务以及未来的计划,同时,用户也可以在计时页面开始专注。BT清单简洁的界面与清晰的交互方式,可以帮助用户在工作中或学习中更好地统筹规划时间,安排自己的日程表。

目标用户

学生、上班族、喜欢列计划的人、时间管理者等追求效率的人群

实现思路

BT清单以todos功能为基础,扩展出了日历、计时,与历史记录界面。今日记录与日历的数据互通,与计时器的数据独立,最终所有的操作记录展示在历史记录界面中。

前端架构使用的均为微信小程序自带的组件以及效果,风格简洁明快。后端使用了腾讯云,主要使用了云数据库及少量云函数。todos以及历史记录均存储在数据库里,在前端分别以不同的检索条件进行展示、同时进行增删改等数据库操作。

架构图

效果截图

WXOPEN Club 内容图片

今日清单页面展示截止到当天的所有任务,过期的和今日待办任务分开显示,每一栏任务都有完成按钮、日期更改按钮和删除按钮。过期任务会显示任务的日期。底部的按钮可以进行全局操作。最底部的tabbar则显示今日共有多少任务待办。

WXOPEN Club 内容图片

日期更改页面。

WXOPEN Club 内容图片

日历页面会展示选中日期当日的任务清单,在日历页面也可以进行待办的增删改查。

WXOPEN Club 内容图片

可以把日历扩展为月历视图,选中某个日期后就会显示当日任务,点击今日按钮可以返回今日日期,在日历中今日日期予以绿色圆点标注。

WXOPEN Club 内容图片

计时页面可以拖动上方的滑块来调节倒计时时长,开始计时后,中间的动画效果开始播放,灰色小球会每秒不匀速转动,计时结束后,动画停止。

WXOPEN Club 内容图片

在历史记录页面,可以查看自己的任务增删记录和计时记录。点击“全部”按钮可以显示出所有的记录。

WXOPEN Club 内容图片

长按某一条记录后可以选择删除该条记录。

WXOPEN Club 内容图片

点击“清除所有”按钮可以删除所有该类别的记录。

WXOPEN Club 内容图片

如果任务均标记为已完成,可以选择重新开始,也可以选择删除任务。

WXOPEN Club 内容图片

当今日没有待办任务且已完成任务均被删除时,界面展示“没有任务”字样。

部分功能代码演示

WXOPEN Club 内容图片

点击待办实现“完成任务”功能的代码

WXOPEN Club 内容图片

使用正则表达式来格式化日期的代码

WXOPEN Club 内容图片

清除“过期的已完成的”任务的代码

体验二维码

WXOPEN Club 内容图片

团队简介

一位来自北京邮电大学信通院信息工程专业的本科生,假期自学过小程序。

1 回复
nsun
nsun1 楼3 年前

好棒的小程序