校园小程序: 基于云开发的校园服务类小程序--综合版本集成多种多样的功能且进行组件化封装，方便二次构建开发。

![](https://img.shields.io/badge/build-passing-brightgreen)  ![](https://img.shields.io/badge/progress-75%25-blue)

### 校园信息服务小程序（拓展版）

### 1 项目开发历程

这是我初学小程序时就在维护的项目，至此已经有近两年时间了，这个小程序对我本人来说有着不同寻常的意义。但是人总是要成长，人总不能靠着一个项目来决定技术生涯的全。小程序也只是我全栈学习生涯之中的一个部分，人总是要向前看的，这是我最后一次对这个项目进行大规模重。未来或许有时间还会经常看看这个项目，或许还会进行拓展，但是这次确定下来的项目结构不再会进行任何变动，本次重构的思路有如下几点：

1. 组件化，功能开发封装为组件，便于维护迁移。
2. 结构化，通配形式开发，预留足够多的拓展接口，方便后期基于此项目的功能拓展。
3. 动态化，把一些配置信息和api进行封装，方便动态修改和维护。

*初学者的开发历程*

[[v1.0] 第一版本](https://gitee.com/Kindear/yamako_procedure/tree/V1.0/)

[[v2.0]第二版本（样式重构）-- 线上版本](https://gitee.com/Kindear/yamako_procedure/tree/RebuildVersion/)

### 2 EXV重构版简略介绍

具体信息请看[WIKI文档](https://gitee.com/Kindear/yamako_procedure/wikis/pages)

#### 2.1 基于教务系统的功能实现

现项目基于强智教务系统API进行实现，所有支持强智教务系统的学校都可以在此基础上，进行简单的配置文件修改和数据映射处理，就可以改造该项目适配自己学校。该接口形式支持二次开发进行功能拓展，理论上，在不修改样式的情况下，可以完成对全部教务系统的接口适配。

![](https://gitee.com/Kindear/BlogAssets/raw/master/cnblogs/flowrb2.png)

**已实现**

1. 课表查询     ✔
2. 空教室查询 ✔
3. 成绩查询     ✔

#### 2.2 基于教务系统的功能优化

基于教务系统基础的信息接口，可以获取返回信息。对于返回信息的处理，进行了结构上的优化，实现了对登录态的验证集中拦截，实现了登录态过期，统一跳转到登录界面的拦截方式。`api.js`中定义了集中拦截的方式和对网络异常等交互效果的集中实现。

~~~javascript
function NetError(){
  wx.showToast({
    title: '网络错误',
    icon:'none'
  })
  wx.hideLoading({
    complete: (res) => {},
  })
}
~~~

于此同时，我还基于返回信息的基础上对小程序的功能体验进行优化。

> 课表查询优化

1. 样式优化     ✔
2. 自定义课表 🔨

> 空教室查询优化

1. 查询模式优化 ✔
2. 样式优化         ✔

> 成绩查询优化

1. 绩点统计        ✔
2. 单项成绩检索 ✔
3. 样式优化         ✔

#### 2.3 基于WxParse和微信editor的富文本编辑器实现和优化

富文本编辑器实现具体细节请查看 [富文本编辑器Editor](https://gitee.com/Kindear/yamako_procedure/wikis/pages?sort_id=2325427&doc_id=311520)

对该自定义富文本编辑器，做了如下几个优化

> editor优化

1. 组件化封装（可以作为组件引入） ✔
2. 图片递归上传（避免高并发的网络错误和图片返回顺序不一致问题） ✔
3. 资源发布（云开发绑定，内容可作为文章发布） ✔

基于Editor编辑的文章，提取内容为HTML存储到云数据库中，通过WxParse进行解析。

~~~vue
<Parse html="{{detailData.html}}"></Parse>
~~~

Editor 和 WxParse功能组合利用，共同组成了一个类似blog的文章发布展示流程。

> WxParse文章展示优化

1. 引入`comment-box`组件，提供点赞评论功能 ✔

~~~vue
<comment-bottom id="commentBottom" commentid="{{detailData._id}}" commentnum="{{detailData.commentnum}}" bind:send="handleSend"></comment-bottom>
~~~

2. 引入鉴权机制，为文章发布者显示删除按钮 ✔

#### 2.4 Nexu基于云存储/转储的资源文件共享

Nexu实现具体细节请看[WIKI-Nexu资源共享](https://gitee.com/Kindear/yamako_procedure/wikis/pages?sort_id=2333831&doc_id=311520)

该功能在云数据库中的记录存储形式如下：

~~~
{
  _id
  uid 上传者id
  uschool 上传者学校
  type : file/set 单个文件 / 集合
  status : 'exposed':'private' 公开 / 私有
  sofname : 文件或者集合名称
  source: 'cloud':'server' 云开发或者服务器
  fileurls: 文件下载地址列表 云开发为fileID 服务器为真实地址[{ filename:'',fileurl:'',filetype:''}]
}
~~~

qingyunshangxing/校园小程序

简介

发行版

贡献者

近期动态

qingyunshangxing/校园小程序 .gitee-modal { width: 500px !important; }

简介

发行版

贡献者

近期动态

搜索帮助

qingyunshangxing/校园小程序