云开发搭建安全生产知识答题活动小程序v3.0

基于云开发搭建安全生产知识答题活动小程序v3.0

安全生产月知识竞赛， “新安法知多少”网络竞赛活动主题，遵守安全生产法，当好第一责任人。若想在短期内，进行安全生产知识的传播，那么答题无疑是有效方式之一。

因此我搭建了最新版的优质的安全生产知识答题活动小程序。提炼了典型的业务模型，它可以帮助你快速搭建各种形式的答题软件产品。相信不管你的需求是什么，本项目都能帮助到你。

答题活动小程序v3.0，基于微信原生小程序 云开发实现。主要包含六大功能模块页面，首页、答题页、结果页、活动规则页、答题记录页、排行榜页。 适用于交通安全答题、 消防安全知识宣传、 安全生产知识学习、网络安全知识竞赛、五四青年节答题活动、学法普法教育、有奖答题等应用场景。

项目介绍

安全生产知识答题活动小程序v3.0，基于云开发的答题活动小程序。

本项目技术栈基于 ES2015 、WXML、WXSS、JavaScript 、微信原生 API和云开发，所有的请求数据都使用云数据库的小程序端SDK进行查询，提前了解和学习这些知识会对使用本项目有很大的帮助。

软件架构

• 微信原生小程序
• 后端云开发（数据库、云函数、存储）
• CMS后台管理系统

功能结构

• 活动规则页
• 答题记录页
• 排行榜页
• 题库随机抽题
• 查询历史成绩
• 微信授权登录
• 获取微信头像和昵称等
• 首页、答题页、结果页
• 实现页面间跳转功能
• 实现转发分享答题成绩功能
• 实现用云开发实现查询题库功能
• 实现动态题目数据绑定
• 答题交互逻辑
• 切换下一题
• 提交答卷保存到云数据库集合
• 系统自动判分
• 答题结果页从云数据库查询答题成绩
• 注册登录页
• 题库学习
• 支持单选、判断题型
• 错题集
• 查看所有用户的答题记录-管理员
• 查看用户的答题成绩以及答题情况-管理员
• 后台数据监控-管理员
• 后台管理-管理员

效果一览

v3.0版本升级：

1）升级功能：

• 排行榜页排名机制，优化为取个人最佳成绩进行排名√
• 答题页、结果页界面，增加展示微信头像和昵称栏目√
• 由仅支持单选，升级为支持单选、判断、多选题型 √
• 各界面及功能一些小优化√

2）拓展功能：

• 注册登录页 √
• 题库学习 √
• 错题集 √
• 查看所有用户的答题记录-管理员 √
• 查看用户的答题成绩以及答题情况-管理员 √
• 后台题库管理系统-管理员 √
• 题目增删查改-管理员 √

版本持续迭代中：

关键代码解读

实现页面间跳转功能

官方提供了5种路由的API，分别是：

1、wx.switchTab(Object object)，跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面；

2、wx.reLaunch(Object object)，关闭所有页面，打开到应用内的某个页面；

3、wx.redirectTo(Object object)，关闭当前页面，跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面；

4、wx.navigateTo(Object object)，保留当前页面，跳转到应用内的某个页面。但是不能跳到 tabbar 页面。使用wx.navigateBack可以返回到原页面。小程序中页面栈最多十层；

5、wx.navigateBack(Object object)，关闭当前页面，返回上一页面或多级页面。可通过getCurrentPages获取当前的页面栈，决定需要返回几层。

首页的.wxml

<view catchtap="goToTest">
 <button class='cu-btn bg-red round block lg'>开始答题</button>
</view>

首页的.js

goToTest: function() {
   wx.navigateTo({
      url: '../test/test'
   })
 },

实现转发分享答题成绩功能

在.js文件配置

Page({
  onShareAppMessage(res) {
    return {
      title: '@你，快来参与安全生产知识答题活动吧~'
    }
  },
})

用云开发实现查询题库功能

在小程序端调用数据库的方式很简单，我们可以把下面的代码写到一个事件处理函数里，然后直接在页面的生命周期函数里面执行。

其实概括起来，就三步走：

1）先使用 wx.cloud.database()获取数据库的引用（相当于连接数据库）;

2）再使用 db.collection()获取集合的引用；

3）再通过 Collection.get 来获取集合里的记录。

// 连接云数据库
const db = wx.cloud.database();
// 获取集合的引用
const activityQuestion = db.collection('activityQuestion');
// 数据库操作符
const _ = db.command;

Page({

  /**
   * 页面的初始数据
   */
  data: {
    questionList: [], // 题目列表
    index: 0 // 当前题目索引
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    // 获取题库-函数执行
    this.getQuestionList()
  },

  // 获取题库-函数定义
  getQuestionList() {
    // 显示 loading 提示框
    wx.showLoading({
      title: '拼命加载中'
    });
    // 构建查询条件
    activityQuestion.where({
      // 指定查询条件，返回带新查询条件的新的集合引用
      true: _.exists(true)
    })
    .get()
    .then(res => {
      // 获取集合数据，或获取根据查询条件筛选后的集合数据。
      console.log('[云数据库] [activityQuestion] 查询成功')
      console.log(res.data)
      let data = res.data || [];
      
      // 将数据从逻辑层发送到视图层，通俗的说，也就是更新数据到页面展示
      this.setData({
        questionList:data,
        index: 0
      });

      // 隐藏 loading 提示框
      wx.hideLoading();
    })
  }
})

提交答卷成绩到云数据库保存

// 提交答卷
  addExamRecord(){
    wx.showLoading({
      title: '提交答卷中'
    });
    let examResult = {
      wrongList: this.data.wrongList,
      wrong: this.data.wrong,
      wrongListSort: this.data.wrongListSort,
      chooseValue: this.data.chooseValue,
      totalScore: this.data.totalScore
    };
    activityRecord.add({
      data: {
        ...examResult,
        createDate: db.serverDate()
      }
    }).then(res => {

      // 跳转到答题结果页，查看成绩
      wx.redirectTo({
        url: '../results/results'
      });

      wx.hideLoading();
    })
  }

在结果页中实现从云数据库查询成绩

这里使用Collection.doc(id: string)，获取集合中指定记录的引用。方法接受一个 id 参数，指定需引用的记录的 _id。

activityRecord
    .doc(id)
    .get()
    .then(res => {
      let examResult = res.data;
      
      let { wrong, totalScore } = examResult;
      this.setData({
        totalScore,
        wrong,
        zql: (20-wrong)/20*100
      })
   })

用云开发的聚合能力实现从题库中随机出题功能

// 获取题库-函数定义
  getQuestionList() {

    // 数据库集合的聚合操作实例
    activityQuestion
    .aggregate()
    .match({       //类似于where，对记录进行筛选
      true: _.exists(true)
    })
    .sample({
      size: 20
    })
    .end()
    .then(res => {
      // 在控制台打印数据
      console.log(res.list)

      let data = res.list || [];
      
      // 将数据从逻辑层发送到视图层，通俗的说，也就是更新数据到页面展示
      this.setData({
        questionList:data
      });
    })
  }

排行榜页面实现答题成绩排名

按答题成绩totalScore字段进行排降序（totalScore越大越靠前）

getRankList() {
    // 数据库集合的聚合操作实例
    activityScore
    .where({
      _openid: _.exists(true)
    })
    .orderBy('totalScore', 'desc')
    .get()
    .then(res => {
      // 获取集合数据，或获取根据查询条件筛选后的集合数据。
      console.log('[云数据库] [排行榜] 查询成功')
      console.log(res.data)
      let data = res.data || [];
      
      // 将数据从逻辑层发送到视图层，通俗的说，也就是更新数据到页面展示
      this.setData({
        rankList:data
      });
    })
  }

题目数据采集

01.单选题

1.《生产安全事故应急条例》是根据《中华人民共和国（ ）》和《中华人民共和国突发事件应对法》制定的。

A.宪法

B.刑法

C.安全生产法（正确答案）

D.行政法

2. 《生产安全事故应急条例》规定，（ ）统一领导全国的生产安全事故应急工作，县级以上地方人民政府统一领导本行政区域内的生产安全事故应急工作。

A.中央人民政府

B.国务院（正确答案）

C.国家安全委员会

D.国家安全生产监督管理总局

3. 《生产安全事故应急条例》规定，生产经营单位应当加强生产安全事故应急工作，建立健全生产全事故应急工作责任制，其（ ）本单位的生产安全事故应急工作全面负责。

A.主要负责人（正确答案）

B.领导班子

C.法定代表人

D.安全部主管

4.《生产安全事故应急预案管理办》规定，生产经营单位应当在编制应急预案的基础上，针对工作场所、岗位的特点，编制简明、实用、有效的（ ）。

A.明白卡

B.应急处置卡（正确答案）

C.宣传卡

D.通讯方式卡

02.多选题

1.生产经营场所和员工宿舍应当设有符合（)的出口。

A.消防灭火

B.紧急疏散要求（正确答案）

C.标志明显（正确答案）

D.保持畅通（正确答案）

2. 生产经营单位进行（)以及国务院安全生产监督管理部门会同国务院有关部门规定的其他危险作业，应当安排专门人员进行现场安全管理，确保操作规程的遵守和安全措施的落实。

A.搬运

B.爆破（正确答案）

C.拆卸

D.吊装（正确答案）

3. 重大事故隐患排除前或者排除过程中无法保证安全的，应当责令从危险区域内撤出作业人员,责令暂时(）。

A.停产（正确答案）

B.停业（正确答案）

C.停止使用相关设施（正确答案）

D.停止使用相关设备（正确答案）

4.参与事故抢救的部门和单位应当服从统一指挥，根据事故救援的需要采取（)等措施，防止事故扩大和次生灾害的发生，减少人员伤亡和财产损失.

A.警戒（正确答案）

B.疏散（正确答案）

C.指导

D.抢救

03.判断题

1. 危险物品的生产、储存单位以及矿山、金属冶炼单位应当有注册安全工程师从事安全生产管理工作.（√）

2. 矿山、金属冶炼建设项目和用于生产、储存、装卸危险物品的建设项目,应当按照国家有关规定进行安全评估。（×）

正确答案：矿山、金属冶炼建设项目和用于生产、储存、装卸危险物品的建设项目,应当按照国家有关规定进行安全评价。

3.生产经营单位应当建立安全生产教育和培训档案,如实记录安全生产教育和培训的时间、内容、参加人员以及考核结果等情况.（√）

4.生产经营单位对重大危险源应当登记建档，进行定期检测、评估、监控，并制定应急预案，告知主要负责人和相关人员在紧急情况下应当采取的应急措施。（×）

正确答案：生产经营单位对重大危险源应当登记建档，进行定期检测、评估、监控，并制定应急预案，告知从业人员和相关人员在紧急情况下应当采取的应急措施。

04.填空题

1. 《生产安全事故应急条例》规定，国务院统一领导全国的生产安全事故应急工作，县级以上地方人民政府统一领导本行政区域内的生产安全事故应急工作。

2. 负有安全生产监督管理职责的部门，除有危及生产安全的紧急情形外，应当提前24小时通知生产经营单位。

3.工会对生产经营单位违反安全生产法律、法规，侵犯从业人员合法权益的行为，有权要求纠正。

4.负有安全生产监督管理职责的部门应当建立安全生产违法行为信息库。

系列教程持续更新中

这篇好文章是转载于：学新通技术网