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

import { uploadFile } from "../../../utils/uploadImage";
Page({
  data: {
    avatar:
      "https://frontend-1255802371.cos.ap-shanghai.myqcloud.com/miniapp-static/avatar-icon.jpg?sign=f5c66c94d189436f82353eb48cb01f08&t=1634538864",
    cameraIcon:
      "https://frontend-1255802371.cos.ap-shanghai.myqcloud.com/miniapp-static/camera-icon.png?sign=11a65871a2800cd04ecaa8991687fccd&t=1634607415",
    newCameraIcon:
      "https://frontend-1255802371.cos.ap-shanghai.myqcloud.com/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,
    });
  },
});