Agency_WxApp/miniprogram/pages/voyageManage/takeBill/takeBill.js

import {
  uploadFile
} from "../../../utils/uploadImage"
Page({
  data: {
    avatar: "https://6875-huihenduo-2gx127w7f837b584-1255802371.tcb.qcloud.la/miniapp-static/avatar-icon.jpg?sign=f5c66c94d189436f82353eb48cb01f08&t=1634538864",
    cameraIcon: "https://6875-huihenduo-2gx127w7f837b584-1255802371.tcb.qcloud.la/miniapp-static/camera-icon.png?sign=11a65871a2800cd04ecaa8991687fccd&t=1634607415",
    newCameraIcon: "https://6875-huihenduo-2gx127w7f837b584-1255802371.tcb.qcloud.la/miniapp-static/camera.png?sign=ad0fe8bead6a46cb20f45f792d4bed67&t=1645502416",
    userName: "",
    phone: "",
    shipName: "",
    shipMmsi: "",
    authModal: false,
    modalText: "位置",
    cw: '',
    ch: '',
    disabled: false,
    imgCache: ''
  },
  takeBill() {
    if (this.data.disabled) return
    wx.showLoading({
      title: '正在上传...',
    })
    this.data.disabled = true
    const ctx = wx.createCameraContext()
    ctx.takePhoto({
      quality: 'high',
      success: (res) => {
        let src = res.tempImagePath
        let ch = res.height * 2
        let cw = res.width * 2
        wx.getImageInfo({
          src,
          success: e => {
            this.setData({
              ch,
              cw
            })
            const query = wx.createSelectorQuery();
            query.select('#myCanvas').node().exec((res) => {
              const canvas = res[0].node;
              const ctx = canvas.getContext('2d');
              const img = canvas.createImage();
              let h = ch / 2
              let w = cw / 2
              canvas.height = h * 0.85
              canvas.width = w * 0.9
              img.src = src
              img.onload = () => {
                ctx.drawImage(img, -w * 0.05, -h * 0.05);
              }
              this.saveImg(src)
            })
          }
        })

      }
    })
  },
  goBack() {
    wx.navigateBack()
  },
  async saveImg(src) {
    const query = wx.createSelectorQuery();
    const canvas = await new Promise((resolve, reject) => {
      query.select('#myCanvas')
        .fields({
          node: true,
          size: true
        })
        .exec(async (res) => {
          resolve(res[0].node);
        })
    });

    wx.canvasToTempFilePath({
      canvas,
      success: async e => {
        // let path = e.tempFilePath
        // wx.navigateTo({
        //   url: `/pages/takeBill/success/success?src=${src}&path=${path}`
        // })
        // return
        this.setData({
          imgCache: e.tempFilePath
        })
        let res = await uploadFile("/voyage/uploadVoyageWayBill", e.tempFilePath, {
          type: this.data.type,
          voyageId: this.data.voyageId
        })
        wx.hideLoading({
          success: (res) => {},
        })
        console.log(res)
        wx.showToast({
          title: res.msg,
        })
        setTimeout(() => {
          this.data.disabled = false
          wx.setStorageSync('addStatus', "success")
          this.goBack()
        }, 1000)
      },
      fail(res) {
        console.log('fail');
      }
    })
  },

  onLoad(options) {
    this.setData({
      ...options
    })
  }
})