使用eggjs+微信小程序开发一个时间管理小程序（一）——项目介绍

目录

系列文章目录

前言

涉及的技术点

页面展示

首页

我的

创建日程

日程列表

打卡详情 

消息通知

总结 

---

系列文章目录

使用eggjs+微信小程序开发一个时间管理小程序（一）——项目介绍

使用eggjs+微信小程序开发一个时间管理小程序（二）——后端项目搭建  

使用eggjs+微信小程序开发一个时间管理小程序（三）——前端项目搭建

使用eggjs+微信小程序开发一个时间管理小程序（四）——自动登录实现

前言

       在生活中，对我来说有个非常痛的痛点，就是经常会忘记一些重要的日子，比如家人的生日，纪念日等。作为一个单纯的打工人，我只对今天是周几比较敏感，对日期并不敏感，农历日期就更不用说了。而忘记这些日子，轻则让相关人员心内失望，重则让自己睡好几天沙发，所以这个痛点必须解决。

       基于此，我想到了开发一个时间管理的小程序，可以在这些日期到来之前，发送微信通知给我，从而让我对此有所准备。

       说干就干，经过一个多月有一搭没一搭的开发，我的【轻记时刻】小程序上线了，虽然忠实用户只有我和我女朋友，但还是满满的成就感。

       虽然是一个简单应用，但麻雀虽小，五脏俱全，中间还是涉及到很多知识点可以分享，接下来我将把开发过程中的问题一一展示。

涉及的技术点

1. 小程序搭建、tabbar配置、导航栏的几种模式、接口调用方法封装
2. 小程序用户体系，小程序自动登录方案优化
3. 小程序消息订阅
4. eggjs图片上传到七牛云
5. 生成小程序码
6. 文本内容支持emoj表情等

       后面是对【轻记时刻】功能的一些介绍，方便后续讲知识点时有个背景参考，如果不感兴趣，可以直接跳到下篇文章了。

页面展示

       小程序有两个tab，【首页】和【我的】。

首页

如下图所示，首页由日历和当天待办日程构成，日历可以展开收起。

1. 日历

       该日历可以展示星期、农历/阳历日期、节日、节气、法定假期、调休安排等，功能十分齐全。

       这个日历是自己实现的，使用了小程序原生的swiper组件，构建日历的二维数组展示即可，难度不大在这里简单提一嘴即可。

       日历农历阳历换算，节日换算，法定节假日休假安排等，自己写代码很复杂，还不准，推荐一个npm库lunar-javascript。

2. 今日日程

       日程分为三类，日程、纪念日、每日打卡，如果当天有某种分类的安排，就会在下面展示出来，不同分类的展示略有不同，比如每日打卡会显示当前打卡进度以及打卡按钮，方便操作。

       刚进入小程序，如果当天有日程安排，默认会收起日历，如果没有安排，则默认展开日历。

我的

       个人中心由三部分组成

• 个人信息

       这里显示头像和昵称，点击可以进入编辑页，设置这些信息。由于微信限制，开发者不可以直接获取微信头像和昵称，所以需要有个编辑页，让用户自己设置，否则就展示默认的头像和昵称。

• 事件相关

       全部事件展示当前用户设置的打卡和日程数量，点击可以进入详细列表。
       由于微信小程序订阅消息分为长期订阅和一次性订阅两种，前者是用户授权一次，即可无限给用户发通知，后者是用户授权一次，只能给用户发一次通知。而长期订阅有严格的服务领域限制，这种日程提醒的服务只能使用一次性订阅。
       为了解决用户授权次数不足，无法正常发送服务通知的问题，有两种方案：

1.   提供一个公共位置，让用户可以手动授权，增加订阅次数，并且小程序可以记录剩余的可通知次数。我用的就是这种方案。
2. 将小程序与公众号绑定，如果小程序服务通知发送失败，则通过关联的公众号推送通知。正常是通过【微信开放平台】将小程序与公众号绑定，不过这个是收费的，而且必须是企业号，所以我没用这个方案。

       如果大伙有方案可以绕过微信限制将小程序和公众号的用户体系关联，可以评论区教教我。

• 通用功能

       暂时只做了意见反馈，后续有空了再扩展一些全局设置的能力。

创建日程

创建日程-选择日程类型

创建日程-填写必要信息

创建一个日程的必要信息如下：

• 日程名称
• 开始时间

       支持公历和农历时间切换，解决记不住日子的根本痛点

• 重复方式

       支持不重复、按天、周、月、年、星期的重复方式。小程序会按这个时间周期，将该日程列在每日日程中，在日程列表中，会展示距离该日程还有多少天。

创建日程-重复方式

• 提醒方式

       可选不提醒、当天提醒、前一天、前两天、前三天提醒。
       假设提前三天提醒，则会在开始日期前三天开始，每天指定时间发消息通知提醒该日程。

• 提醒时间

       选择发送消息推送的时间，可选时间为上午6点到晚上12点

• 备注

日程列表

打卡列表

日程列表

       日程、纪念日的展示逻辑相同，展示日程名称、目标日期、距离目标日期天数、重复方式。
       每日打卡展示日程名称、开始时间、打卡进度。 

打卡详情 

       创建打卡后，可以分享给好友，让好友加入该打卡。如图，该打卡有三人加入。

       详情中默认会展示所有成员的打卡记录，可以通过点击“只看自己”切换展示模式。

       如果当前用户打卡次数未达到目标天数，将展示打卡按钮，点击打卡，弹出弹窗，用户可以输入对本次打卡的描述，默认填写“打卡”。

打卡详情

消息通知

消息通知

       如果设置了需要提醒的日程，小程序会通过服务通知，定时给用户发推送消息，点击消息卡片可以进入日程详情。 

总结 

       小程序的基本功能就介绍到这里了，欢迎大伙儿批评指正。
       后续文章将会按照最上面列出来的相关知识点一一展开分享，如果有问题，欢迎提出讨论。