小程序+云开发+cms实现校园管理系统,含图书借阅,饭卡充值,宿舍维修,校园资讯等功能

一,老规矩先看效果图

小程序端

1,首页

2,校园资讯

3,新闻详情

4,个人中心

5,宿舍维修

6,宿舍维修订单

7,饭卡充值

8,支付

可选择充值金额,由于我们这里没有开通微信支付,所以这里是模拟支付,如果想实现微信支付,需要用营业执照注册一个企业小程序,并且要开通微信支付。如果想实现真实支付,可以找石头哥定制改造。

9,充值记录

10,校园官网


我们这里校园官网是用webview实现得,所以需要是企业小程序,并且要在小程序里配置相关域名。

如果你是个人小程序的话,直接打开校园官网会报下面错误

但是我们想在个人小程序里看校园官网怎么办呢?其实也是有方法的

  • 第一种方式:在模拟器里打开

    这里只要勾选不校验合法域名,就可以在电脑模拟器上看到校园官网
  • 第二种方式:在手机上打开,开启调试模式
    这里同样需要按上面第一种方式那样勾选 不校验合法域名。然后做如下操作。

    然后点击打开调试

    然后再次进入校园官网,就可以打开官网了。

11,图书借阅

12,图书借阅记录

我们可以在图书借阅记录里还书,查看以往借阅历史

13,修改学生信息

14,我的收藏


这里记录我们收藏过的文章

15,联系客服

这里要注意的是,联系客服功能模拟器里没法查看,必须在手机上才可以查看

16,反馈与建议

这里要注意的是,反馈与建议功能模拟器里没法查看,必须在手机上才可以查看

17,微信授权登录

登录前

登录后

管理后台

1,管理后台登录页

2,管理后台主页面

左侧菜单栏展开

左侧菜单栏收起

3,内容模型(拖拽生成数据库)

4,校园新闻管理

可以添加,修改,删除校园新闻

5,文章编辑器

支持富文本编辑

6,用户信息管理

7,搜索用户功能

8,用户充值记录管理

9,宿舍维修订单管理

10,更改维修订单状态

11,图书管理页

可以上架新图书,修改图书信息,删除图书

12,学生借阅管理页

二,技术选型

1,小程序前端

  • wxml
  • css
  • JavaScript

2,数据后台(云开发)

  • 云开发
  • 云数据库
  • 云函数
  • 云存储

3,管理后台(cms)

  • cms

三,项目目录

3-1,pages页面目录

3-2,云函数目录

四,源码与数据的导入

4-1,去网盘下载源码并解压

4-2,导入源码到小程序开发者工具

注意:导入的时候appid一定要换成你自己的。

4-3,初始化云开发环境

  • 1,在app.js里把env换成你自己的云开发环境id
  • 2,选择和云开发环境id对应的云函数环境

4-4,cms的开通

4-5,news表别忘记改权限

4-6,books图书表别忘记改权限

4-7,别忘记部署云函数

后面会录视频讲解,敬请期待

编程小石头 Python PHP MySQL
码农一枚,非著名全栈开发人员。分享自己的一些经验,学习心得,希望后来人少走弯路,少填坑。编程小石头和你一起快乐的学编程。
相关推荐