#小程序云开发挑战赛#-QSCamera-Incas - WXOPEN Club

QSCamera

——求是潮器材借还系统 By Incas

文章概述：本篇文章共分12部分内容，首先从应用场景、目标用户、实现思路、产品架构、小程序截图、部分核心功能代码展示六个方面对小程序做了大致的介绍，然后给出了小程序的Github地址、详细开发文档地址、详细使用指南地址以及介绍视频地址方便读者对我们的小程序进行进一步的了解。最后我们给出了小程序的体验二维码与Incas团队简介，方便大家对我们的小程序能够上手体验并对我们的团队有所了解。感谢您花费宝贵的时间阅读本篇文章，希望您能够有所收获！

1、应用场景：

该小程序面向浙江大学求是潮校级学生组织的摄影部及视频团队两个部门，用于部门内或跨部门的器材借还登记、借用记录查询、当前器材状态查询等场景。

2、目标用户

浙江大学校级学生组织求是潮摄影部及视频团队部门成员、

3、实现思路

QSCamera利用用户openid识别用户，前端90%以上内容使用组件化开发，相关组件定位明确，便于后续版本迭代更新。同时，二次封装了wx.request请求，使用async和await完美处理了异步调用问题，提高整体程序并发度与性能。同时，拥有全局网络请求异常机制，拥有良好的边界测试结果。另外，UI采用Color-UI组件库以及自写wxss进行样式设计。

后端采用纯云开发，使用云函数与云数据库进行信息存储与查询。

4、产品架构图

5、小程序部分效果截图：

首页 / 器材借用 / 器材查询 / 当前出借记录（从左至右）

后台管理系统 / 后台记录查询 / 后台用户信息 / 后台器材管理（从左至右）

6、部分核心功能代码展示（具体详见源代码与开发文档）

1）核心网络请求类实现（所有业务模型的父类）

         class HTTP {
              request({
                name,
                data = {},
              }) {
                return new Promise((resolve, reject) => {
                  this._request(name, resolve, reject, data)
                })
              }
              _request(name, resolve, reject, data = {}) {
                wx.cloud.callFunction({
                  name: name,
                  data: data,
                  success: res => {
                    console.log("CloudFunction_"+name+"_Called Success")
                    resolve(res)
                  },
                  fail: err => {
                    reject()
                    console.log("CloudFunction_"+name+"_Called Failed")
                    wx.showToast({
                      icon:'none',
                      title: '很抱歉，出现了一个错误，请重试',
                    })
                  }
                })
             }
         }

2）高并发借用器材实现

（大致思路如下：

1、校验用户是否登录

2、校验表单是否符合要求

3、并发向云端请求校验借用器材是否已经被人借用

4、并发向云端更新每一个器材的状态

5、创建借用记录

6、显示成功提示（或已经在以上任一步中失败即会中止并显示失败提示）

）

注：由于正常情况下，器材借用处只会显示当前尚未出借的器材。然而当两个人同时登录小程序借用同一个器材时，容易导致数据库数据不一致的情况发生。故做上述第三步，从而成功避免了两个人同时借用一个器材时，容易导致某器材被两个人同时借走的问题。

async FormSubmit(e) {
    if (!app.globalData.IsLogin) {
      wx.showToast({
        icon: 'none',
        title: '请先登录',
      })
      return
    }
    let FormCheck = this.checkEquip() && this.checkTime() && this.checkPurpose() && this.checkEquipCanbeBorrowOut()
    if (FormCheck) {
      //向云端请求时再一次确认这些器材未被借用
      let EquipCheck = true;
      let VideoChoosed_listLength = this.data.VideoChoosed_list.length
      this.setData({
        loadModal: true
      })
    var temp = []
      //视频团队器材校验
    for (var i = 0; i < VideoChoosed_listLength; i++) {
        temp.push(equipModel.CheckEquip(this.data.VideoChoosed_list[i]._id))
      }
    //摄影部器材校验
      let PhotographyChoosed_listLength = this.data.PhotographyChoosed_list.length
      if (PhotographyChoosed_listLength != 0) {
        for (var i = 0; i < PhotographyChoosed_listLength; i++) {
          temp.push(equipModel.CheckEquip(this.data.PhotographyChoosed_list[i]._id))
        }
      }
    //等待校验完成进行下一步借用：
      Promise.all(temp).then(async res => {
        for (var i = 0; i < VideoChoosed_listLength + PhotographyChoosed_listLength; i++) {
          EquipCheck = EquipCheck && res[i]
        }
        const BorrowManInfo = wx.getStorageSync('userInfo')
        const that = this
        //借用器材
        if (EquipCheck) {
      //借用视频团队器材
          for (var i = 0; i < VideoChoosed_listLength; i++) {
            equipModel.BorrowEquip(this.data.VideoChoosed_list[i]._id, that.data.EndDate, that.data.EndTime, BorrowManInfo)
          }
      //借用摄影部器材
          for (var i = 0; i < PhotographyChoosed_listLength; i++) {
            equipModel.BorrowEquip(this.data.PhotographyChoosed_list[i]._id, that.data.EndDate, that.data.EndTime, BorrowManInfo)
          }
          this.setData({
            Msg1: "创建租借记录中",
          })
      //创建租借记录
          await recordModel.CreateBorrowRecord(this.data.VideoChoosed_list, this.data.PhotographyChoosed_list, this.data.StartDate, this.data.StartTime, this.data.EndDate, this.data.EndTime, this.data.Purpose, BorrowManInfo)
          this.setData({
            loadModal: false
          })
          wx.showToast({
            title: '租借成功',
          })
          this.ClearPageInfo()
          wx.switchTab({
            url: '../myrecord/myrecord',
          })
        } else {
          this.setData({
            loadModal: false
          })
          wx.showToast({
            icon: 'none',
            title: '有器材已被别人抢先一步借走啦，请下拉刷新后重新进入该页面再进行选择',
            duration: 3000
          })
          that.ClearPageInfo()
        }
      })
    }
  },