epmet-resi-rizhao/subpages/mine/pages/badge/apply/index.ts

import { inputSync, nextTick } from "../../../../../utils/tools";
import {
  wxShowToast,
  wxRequestPost,
  wxUploadFile,
  wxChooseImage,
  wxShowActionSheet,
} from "../../../../../utils/promise-wx-api";
import validate from "../../../../../utils/validate/index.js";
import words from "../../../../../config/words";

const app = getApp();

Component({
  properties: {
    badgeId: {
      type: String,
      value: "",
    },
  },

  data: {
    iniLoaded: false,

    isApplied: false,

    fmData: {
      surname: "",
      name: "",
      idcard: "",
      isCertificated: false,
      mobile: "",
      code: "",
      certificationImg: "",
      remark: "",

      authResult: "",
      authReason: "",
      recordId: "",
    },
    fmConfig: {
      surname: false,
      name: false,
      idcard: false,
      isCertificated: false,
      mobile: false,
      code: false,
      certificationImg: false,
      remark: false,
    },

    submitBtnIsAllowed: false,

    // 本地选择作品图片路径数组
    imgList: [
      // {
      //     tempFilePath: '', // 本地录制文件临时路径
      //     src: '', // 上传路径
      //     valid: true, // 是否合法
      // }
    ],

    // 手机验证码
    codeData: {
      status: 0, // 0初始 1发送中 2成功 3失败
      cd: 0,
    },
  },

  methods: {
    async onLoad() {
      await app.doAfterLogin();

      await this.getFmConfig();
      await this.iniVisit();

      this.setData({
        iniLoaded: true,
      });
    },

    onShow() {},

    inputSync,

    // 更新data数据后需主动触发
    $afterUpdateData() {
      this.computeSubmitBtnIsAllowed();
    },

    // 获取短信验证码
    async getTelCode() {
      const { codeData } = this.data;
      if (codeData.status == 1 || codeData.cd != 0) return;

      const { fmData } = this.data,
        vlt = validate(fmData, {
          mobile: [
            {
              rule: "required",
              message: "请先输入【手机号码】",
            },
            {
              rule: "mobile",
              message: "【手机号码】格式不正确",
            },
          ],
        });
      if (!vlt.valid) {
        return wx.showToast({
          title: vlt.error,
          icon: "none",
          duration: 1500,
        });
      }

      codeData.status = 1;
      this.setData({ codeData });

      const {
        data: {
          data: { code },
        },
        msg,
      } = await wxRequestPost(
        "epmetuser/more/badge/badgesendcode",
        {
          mobile: fmData.mobile,
        },
        {
          // isMock: true,
          isQuiet: false,
        }
      );

      if (msg === "success" && code === 0) {
        codeData.status = 2;
        codeData.cd = 59;
        this.setData({ codeData });

        // 开始倒计时
        this.sendTelCodeCd();
      } else {
        codeData.status = 3;
        this.setData({ codeData });
      }
    },

    // 发送短信倒计时
    sendTelCodeCd() {
      // 开始计时
      const cdFn = async () => {
        await nextTick(1000);

        const { codeData } = this.data;
        if (codeData.cd > 0) {
          codeData.cd -= 1;
          this.setData({ codeData });
          cdFn();
        }
      };
      cdFn();
    },

    // 删除封面
    async handleLongTapCertificationImg() {
      const {
        fmData: { certificationImg },
      } = this.data;
      if (!certificationImg) return;
      const { msg, data } = await wxShowActionSheet({
        itemList: ["删除封面", "查看大图"],
      });
      if (msg == "success") {
        const { tapIndex } = data;
        if (tapIndex === 0) {
          this.deleteCertificationImg();
        } else if (tapIndex === 1) {
          this.previewCertificationImg();
        }
      }
    },

    previewCertificationImg() {
      const {
        fmData: { certificationImg },
      } = this.data;
      wx.previewImage({
        urls: [certificationImg],
      });
    },

    deleteCertificationImg() {
      this.setData({
        imgList: [],
        "fmData.certificationImg": "",
      });
    },
    async addImg() {
      const { imgList } = this.data;
      const { msg, data } = await wxChooseImage({
        count: 1,
        sizeType: ["compressed"],
      });
      if (msg === "success") {
        const { tempFilePaths } = data;
        let newImgList = tempFilePaths.map((tempFilePath) => {
          return {
            tempFilePath,
            src: "",
            valid: true,
          };
        });
        this.setData({
          imgList: newImgList,
          "fmData.certificationImg": tempFilePaths[0],
        });
        this.computeSubmitBtnIsAllowed();
      }
    },
    // 上传图片
    async uploadImgs() {
      if (this.data.imgList.length === 0) {
        return;
      }
      // 必须先开了，否则可能会冲突
      wx.showLoading({
        title: "上传图片中",
        mask: true,
      });

      // 上传图片，返回地址
      const uploadedImgList = await new Promise(async (reslove) => {
        let { imgList } = this.data,
          residueNum = imgList.length;
        imgList.forEach(async (img, index) => {
          if (img.src == "") {
            const {
              data: { data },
              msg,
            } = await wxUploadFile("oss/file/uploadimg", img.tempFilePath, {
              // isMock: true
            });
            if (msg === "success" && data.code === 0) {
              img.src = data.data.url;
              img.valid = true;
            }
          }
          imgList[index] = img;

          residueNum -= 1;
          if (residueNum === 0) {
            reslove(imgList);
          }
        });
      });

      wx.hideLoading();

      console.log(uploadedImgList);

      this.setData({ imgList: uploadedImgList });

      const imgsValid = uploadedImgList.every((item) => item.valid),
        imgsAllUploaded = uploadedImgList.every((item) => item.src != "");
      if (!imgsValid) {
        wx.showToast({
          title: "图片可能包含非法内容",
          icon: "none",
          duration: 1500,
        });
        return Promise.reject();
      } else if (!imgsAllUploaded) {
        wx.showToast({
          title: "上传图片出错，请重试",
          icon: "none",
          duration: 1500,
        });
        return Promise.reject();
      } else {
        return this.setData({
          "fmData.certificationImg": uploadedImgList[0].src,
        });
      }
    },

    computeSubmitBtnIsAllowed(isQuiet = true) {
      const { fmConfig, fmData } = this.data;
      const fmAllRules = {
        surname: [
          {
            rule: "required",
            message: "请先输入您的【姓氏】",
          },
        ],
        name: [
          {
            rule: "required",
            message: "请先输入您的【名字】",
          },
        ],
        idcard: [
          {
            rule: "required",
            message: "请先输入您的【证件号】",
          },
        ],
        mobile: [
          {
            rule: "required",
            message: "请先输入【手机号码】",
          },
          {
            rule: "mobile",
            message: "【手机号码】格式不正确",
          },
        ],
        code: [
          {
            rule: "required",
            message: "请先输入【短信验证码】",
          },
        ],
        remark: [
          {
            rule: "required",
            message: "请先输入【备注】",
          },
        ],
        certificationImg: [
          {
            rule: "required",
            message: "请上传【认证证件】",
          },
        ],
      };
      let fmRules = {};
      Object.keys(fmAllRules).forEach((k) => {
        if (fmConfig[k]) {
          fmRules[k] = fmAllRules[k];
        }
      });
      const vlt = validate(fmData, fmRules);
      if (!vlt.valid) {
        if (!isQuiet) {
          wx.showToast({
            title: vlt.error,
            icon: "none",
            duration: 1500,
          });
        }
        this.setData({
          submitBtnIsAllowed: false,
        });
        return false;
      } else {
        this.setData({
          submitBtnIsAllowed: true,
        });
        return true;
      }
    },

    // 初始化访问
    async iniVisit() {
      const customerId = app.globalData.customerId;
      const { badgeId, fmData } = this.data;
      const {
        data: {
          data: { code, data },
        },
        msg,
      } = await wxRequestPost(
        "epmetuser/more/badge/certification/detail",
        {
          badgeId,
          customerId,
        },
        {
          // isMock: true,
          isQuiet: false,
        }
      );

      if (msg === "success" && code === 0) {
        this.setData({
          fmData: { ...fmData, ...data },
          isApplied: true,
        });

        this.computeSubmitBtnIsAllowed();
      }
    },

    // 初始化访问
    async getFmConfig() {
      const customerId = app.globalData.customerId;
      const { badgeId, fmConfig } = this.data;
      const {
        data: {
          data: { code, data },
        },
        msg,
      } = await wxRequestPost(
        "epmetuser/more/badge/authfield",
        {
          badgeId,
          customerId,
        },
        {
          // isMock: true,
          isQuiet: false,
        }
      );

      if (msg === "success" && code === 0) {
        if (Array.isArray(data) && data.length > 0) {
          data.forEach((item) => {
            fmConfig[item.enName] = true;
          });
        }
        if (fmConfig.mobile) {
          fmConfig.code = true;
        }
        this.setData({
          fmConfig,
        });
      }
    },

    // 注册
    async submit() {
      if (!this.computeSubmitBtnIsAllowed(false)) return;

      await this.uploadImgs();

      const { badgeId, fmData, fmConfig } = this.data;
      const customerId = app.globalData.customerId;
      let reqData = {};
      Object.keys(fmData).forEach((k) => {
        if (fmConfig[k]) {
          reqData[k] = fmData[k];
        }
      });

      wx.showLoading({
        title: words.common.submitting,
        mask: true,
      });
      const {
        data: {
          data: { code, data },
        },
        msg,
      } = await wxRequestPost(
        "resi/mine/badge/certification/add",
        {
          customerId,
          badgeId,
          ...reqData,
        },
        {
          // isMock: true,
          isQuiet: false,
        }
      );
      wx.hideLoading();

      if (msg === "success" && code === 0) {
        await this.selectComponent("#requestMsg").handleMsg();

        wxShowToast({
          title: "提交成功，请等待审核",
          duration: 1500,
        });
        await nextTick(1500);
        wx.navigateBack();
      }
    },
  },
});