Inspection/weapp/package/inspectionInput/inspectionInput.js

// package/inspectionInput/inspectionInput.js
import { addPatrolRecord, getPatrolTemplate, getPatrolPlan } from "../../utils/getApiUrl";
import { Request } from "../../common";
const moment = require("../../utils/moment");

Page({
  /**
   * 页面的初始数据
   */
  data: {
    dataList: '', // 当前巡检计划
    itemData: '', // 点位
    address: '', // 当前位置
    imgUrl: getApp().globalData.imgUrl,
    checkItems: [], // 检查项
    inspectContent: {}, // 巡检内容
    isCommitting: false,
    /*** 扫码巡检 ***/
    planList: null, // 巡检计划列表
    planListVisible: true,
    scenePointId: null, // 当前点位id
  },

  // 获取巡检计划
  getPatrolPlan: function (scenePointId) {
    let that = this;
    wx.showLoading({
      title: '加载中',
    })
    const userInfo = wx.getStorageSync('userInfo');
    Request.get(getPatrolPlan(), { userId: userInfo.id }).then(res => {
      wx.hideLoading();
      let pointPlan = res.rows.filter(plan => {
        for (const point of plan.points) {
          if (point.id == scenePointId) {
            return true;
          }
        }
        return false;
      }).map(p => ({
        label: p.name,
        value: p.name,
        ...p
      }))
      if (!pointPlan.length) {
        wx.showModal({
          title: '提示',
          content: '你没有当前点位的巡检权限，请联系管理员进行授权',
          showCancel: false,
          success: function () {
            wx.switchTab({
              url: '/pages/index/index',
            })
          }
        })
      }
      that.setData({
        planList: pointPlan
      })
    })
  },

  // 获取巡检模板
  getPatrolTemplate(templateId) {
    Request.get(getPatrolTemplate(templateId)).then(res => {
      const checkItems = res.rows[0].checkItems;
      const inspectContent = {};
      for (const c of checkItems) {
        inspectContent[c.name] = {
          isNormal: null,
          msgInp: null,
          level: null,
          imgs: [],
        };
      }
      this.setData({
        checkItems,
        inspectContent,
      })
    })
  },

  onPickerChange(e) {
    const { key } = e.currentTarget.dataset;
    const { value } = e.detail;

    this.setData({
      [`${key}Visible`]: false,
      [`${key}Value`]: value,
      [`${key}Text`]: value.join(' '),
    });

    const curPlan = this.data.planList[e.detail.columns[0].index];
    this.setData({
      dataList: curPlan,
      itemData: curPlan.points.find(p => p.id == this.data.scenePointId)
    });
    this.getPatrolTemplate(curPlan.templateId);
  },

  onPickerCancel(e) {
    const { key } = e.currentTarget.dataset;
    this.setData({
      [`${key}Visible`]: false,
    });
  },

  onPlanListPicker() {
    this.setData({ planListVisible: true });
  },

  // 获取当前位置
  selfLocation() {
    const that = this
    wx.showLoading({
      title: '定位中',
      mask: true,
    });
    wx.getLocation({
      type: 'wgs84',
      success: (res) => {
        wx.request({
          url: `https://apis.map.qq.com/ws/geocoder/v1/?location=${res.latitude},${res.longitude}&key=${getApp().globalData.key}`,
          success: function (res) {
            wx.hideLoading();
            // 根据自己项目需求获取res内容
            that.setData({
              address: res.data.result.address
            })
          }
        })
      },
      fail: (res) => {
        console.log(res)
        wx.hideLoading();
        wx.showToast({
          title: res.errMsg,
          icon: 'none',
          duration: 1000
        });
      }
    });
  },

  handleChangeTwo(e) {
    const isNormal = e.detail.value === 'normal';
    const inspectContent = this.data.inspectContent;
    inspectContent[e.currentTarget.dataset.item].isNormal = isNormal;
    if (isNormal) { // 清除异常数据
      inspectContent[e.currentTarget.dataset.item].msgInp = null;
      inspectContent[e.currentTarget.dataset.item].level = null;
      inspectContent[e.currentTarget.dataset.item].imgs = [];
    }
    this.setData({
      inspectContent,
    })
  },

  handleChangeThree(e) {
    const inspectContent = this.data.inspectContent;
    inspectContent[e.currentTarget.dataset.item].level = e.detail.value;
    this.setData({
      inspectContent
    })
  },

  // 巡查详情
  bindInput: function (e) {
    const inspectContent = this.data.inspectContent;
    inspectContent[e.currentTarget.dataset.item].msgInp = e.detail.value;
    this.setData({
      inspectContent
    })
  },

  // 上传图片
  chooseImg: function (e) { // 这里是选取图片的方法
    const that = this;
    let pics = [];
    const detailPics = that.data.inspectContent[e.currentTarget.dataset.item].imgs;
    if (detailPics.length >= 20) {
      wx.showToast({
        title: '最多选择20张图片上传',
        icon: 'none'
      });
      return;
    }
    wx.chooseMedia({
      count: 20, // 基础库2.25.0前，最多可支持9个文件，2.25.0及以后最多可支持20个文件
      mediaType: ['image'], // 文件类型
      sizeType: ['original', 'compressed'], // original 原图，compressed 压缩图，默认二者都有
      sourceType: ['album', 'camera'], // album 从相册选图，camera 使用相机，默认二者都有
      success: function (res) {
        const imgs = res.tempFiles;
        for (let i = 0; i < imgs.length; i++) {
          if (res.tempFiles[i].size > 15728640) {
            wx.showToast({ title: '图片大于15M，不可上传', icon: 'none' });
            return;
          }
          const fileNameArr = res.tempFiles[i].tempFilePath.split('.');
          const extension = res.tempFiles[i].tempFilePath.split('.')[fileNameArr.length - 1];
          if (extension !== 'jpg' && extension !== 'png' && extension !== 'jpeg') {
            wx.showToast({ title: '只能上传jpg、jpeg、png格式的图片', icon: 'none' });
            return;
          }
          pics.push(imgs[i].tempFilePath)
        }
        that.uploadimg({
          url: getApp().globalData.webUrl + '_upload/attachments/project', // 图片上传的接口
          path: pics, // 选取的图片的地址数组
        }, e.currentTarget.dataset.item);
      },
    })
  },

  //多张图片上传
  uploadimg: function (data, itemName) {
    wx.showLoading({
      title: '上传中...',
      mask: true,
    })
    let that = this,
      i = data.i ? data.i : 0,
      success = data.success ? data.success : 0,
      fail = data.fail ? data.fail : 0;
    let imgs = that.data.inspectContent[itemName].imgs;
    wx.uploadFile({
      url: data.url,
      filePath: data.path[i],
      name: 'file',
      success: (resp) => {
        wx.hideLoading();
        success++;
        let str = JSON.parse(resp.data) // 返回的结果，可能不同项目结果不一样
        str = str.uploaded
        console.log(str);
        if (imgs.length >= 20) {
          const inspectContent = that.data.inspectContent;
          inspectContent[itemName].imgs = imgs;
          that.setData({
            inspectContent,
          });
          return false;
        } else {
          imgs.push(str);
          const inspectContent = that.data.inspectContent;
          inspectContent[itemName].imgs = imgs;
          that.setData({
            inspectContent,
          })
        }
      },
      fail: (res) => {
        fail++;
        console.log('fail:' + i + "fail:" + fail);
      },
      complete: () => {
        i++;
        if (i == data.path.length) { // 当图片传完时，停止调用     
          console.log('执行完毕');
          console.log('成功：' + success + " 失败：" + fail);
        } else { // 若图片还没有传完，则继续调用函数
          data.i = i;
          data.success = success;
          data.fail = fail;
          that.uploadimg(data, itemName); // 递归，回调自己
        }
      }
    });
  },

  // 删除图片
  deleteImg: function (e) {
    let imgs = this.data.inspectContent[e.currentTarget.dataset.item].imgs;
    const index = e.currentTarget.dataset.index;
    imgs.splice(index, 1);
    const inspectContent = this.data.inspectContent;
    inspectContent[e.currentTarget.dataset.item].imgs = imgs;
    this.setData({
      inspectContent
    });
  },

  // 预览图片
  previewImg: function (e) {
    // 获取当前图片的下标
    const index = e.currentTarget.dataset.index;
    // 所有图片
    const imgs = this.data.inspectContent[e.currentTarget.dataset.item].imgs;
    const newImgs = imgs.map(i => this.data.imgUrl + i);
    wx.previewImage({
      // 当前显示图片
      current: newImgs[index],
      // 所有图片
      urls: newImgs
    })
  },

  bindCancel() {
    if (this.data.scenePointId) {
      wx.switchTab({ url: '/pages/index/index' })
    } else {
      wx.navigateBack();
    }
  },

  // 开始巡检录入
  addPatrolRecord: function () {
    const that = this;
    if (that.data.isCommitting) { return }
    let {
      itemData,
      inspectContent,
      dataList,
      address
    } = that.data;
    let alarm = false;

    if (!address) {
      wx.showToast({
        title: '请获取当前位置',
        icon: 'none',
        duration: 1500
      })
      return;
    }

    for (const item in inspectContent) {
      if (inspectContent[item].isNormal === null) {
        wx.showToast({
          title: '请填写完整',
          icon: 'none',
          duration: 1500
        })
        return;
      }
      if ((!inspectContent[item].isNormal) && (!inspectContent[item].level || !inspectContent[item].msgInp)) {
        wx.showToast({
          title: '异常项必须输入巡查详情和选择严重等级',
          icon: 'none',
          duration: 2000
        })
        return;
      }
      if (inspectContent[item].isNormal === false) {
        alarm = true;
      }
    }

    let data = {
      patrolPlanId: dataList.id,
      pointId: itemData.id,
      inspectionTime: moment().format('YYYY-MM-DD HH:mm:ss'),
      points: {
        user: dataList.user,
        project: dataList.project,
        frequency: dataList.frequency,
        itemData: itemData,
        inspectContent,
        address: address
      },
      alarm
    }
    wx.showLoading({ title: '提交中...' });
    that.setData({ isCommitting: true });
    Request.post(addPatrolRecord(), data).then(res => {
      wx.hideLoading();
      that.setData({ isCommitting: false });
      wx.showToast({
        title: '提交成功',
        icon: 'success'
      })
      setTimeout(() => {
        that.bindCancel();
      }, 1500)
    })
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    const that = this;
    const scenePointId = options.scene;
    if (scenePointId) { // 扫小程序码进入
      const userInfo = wx.getStorageSync('userInfo');
      if (!userInfo || !userInfo.id) { // 如果没登录，先登录
        wx.showToast({ title: '请先登录' })
        wx.reLaunch({
          url: `/pages/login/login?scene=${scenePointId}`
        });
        return;
      }
      that.setData({ scenePointId });
      that.getPatrolPlan(scenePointId);
    } else { // 正常点击进入
      const dataList = JSON.parse(decodeURIComponent(options.dataList));
      const itemData = JSON.parse(decodeURIComponent(options.itemData));
      that.setData({
        dataList,
        itemData
      })
      that.getPatrolTemplate(dataList.templateId);
    }
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})