saas_pc/src/components/dataReview/index.vue

<template>
  <div>
    <el-dialog
      title="资料填写"
      :visible.sync="isShow"
      width="1000px"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      :show-close="false"
    >
      <div class="info__content">
        <el-row :gutter="20">
          <el-form
            :model="infoForm"
            ref="infoForm"
            :rules="rules"
            :disabled="STATUS"
          >
            <el-col
              v-for="(item, index) in listData"
              :span="item.fieldKey == 'commitment_electr_signature' ? 24 : 12"
              :key="index"
            >
              <el-form-item
                v-if="item.inputType == 1"
                :label="item.fieldName"
                label-width="120px"
                :prop="item.fieldKey"
              >
                <el-input
                  :disabled="
                    (item.fieldKey == 'name' && nameDisabledStatus) ||
                    (item.fieldKey == 'idcard' && idcardDisabledStatus) ||
                    (item.fieldKey == 'telphone' && telphoneDisabledStatus)
                      ? true
                      : false
                  "
                  clearable
                  v-model.trim="infoForm[item.fieldKey]"
                  :placeholder="`请输入${item.fieldName}`"
                />
              </el-form-item>
              <el-form-item
                v-else-if="item.inputType == 2"
                :label="item.fieldName"
                label-width="120px"
                :prop="item.fieldKey"
              >
                <el-select
                  v-model="infoForm[item.fieldKey]"
                  :placeholder="`请选择${item.fieldName}`"
                  clearable
                >
                  <el-option
                    v-for="(items, indexs) in options[item.fieldKey]"
                    :key="indexs"
                    :label="items"
                    :value="items"
                    :disabled="
                      item.fieldKey == 'education'
                        ? eduDisAbledStatus(items)
                        : false
                    "
                  >
                  </el-option>
                </el-select>
              </el-form-item>
              <template v-else-if="item.inputType == 3 || item.inputType == 4">
                <div
                  class="cns_sq"
                  v-if="item.fieldKey == 'commitment_electr_signature'"
                >
                  <div class="left">
                    <h3>承诺书</h3>
                    <p>
                      本人自愿做出如下承诺：本人己仔细阅读《广东省住房和城乡建设厅关于推进住房和城乡建设领域施工现场专业人员职业培训工作的通知》
                      全部内容并知晓和理解，本人的学历证书、身份证、工作年限、相片等所有资料完全真实、符合报名条件、资格审查要求和相关规定，本人在报名、审查、培训、测试等有关的事项中会严格道守相关规定和要求，如有虛假或与实际规定不符等情况造成的一切后果由本人承担。
                    </p>
                    <p style="text-align: end;">特此承诺！</p>
                  </div>
                  <div class="right">
                    <h3>
                      <span>
                        签名板：<span class="texts"
                          >（请在下方签名区进行签名）</span
                        >
                      </span>
                      <span class="btn_text" @click="retDraw" v-if="!STATUS"
                        >清空</span
                      >
                    </h3>
                    <el-form-item
                      label=""
                      label-width="0px"
                      :prop="item.fieldKey"
                    >
                      <vue-esign
                        v-if="!infoForm[item.fieldKey]"
                        ref="esign"
                        :isCrop="false"
                        :lineWidth="5"
                        :lineColor="'#333'"
                        :bgColor="'#fff'"
                        :height="480"
                        :isClearBgColor="false"
                      />
                      <img
                        v-else
                        style="width: 100%; height: 100%"
                        :src="$tools.splitImgHost(infoForm[item.fieldKey])"
                      />
                    </el-form-item>
                  </div>
                </div>
                <el-form-item
                  v-else
                  :label="item.fieldName"
                  label-width="120px"
                  :prop="item.fieldKey"
                >
                  <div
                    v-if="infoForm[item.fieldKey]"
                    style="display: inline-block;"
                  >
                    <el-image
                      fit="contain"
                      style="width: 80px; height: 80px;border-radius: 8px;border: 2px dotted #eee;"
                      :src="$tools.splitImgHost(infoForm[item.fieldKey])"
                      :preview-src-list="[
                        $tools.splitImgHost(infoForm[item.fieldKey])
                      ]"
                    >
                    </el-image
                    ><span
                      v-if="item.fieldKey == 'commitment_seal' || !STATUS"
                      class="btn_text"
                      @click="infoForm[item.fieldKey] = ''"
                      >删除</span
                    >
                  </div>
                  <label v-else style="display: inline-block;">
                    <div class="uploadBox">
                      <i class="el-icon-plus"></i>
                    </div>
                    <input
                      style="display: none;"
                      type="file"
                      @change="uploadImg($event, item.fieldKey)"
                    />
                  </label>
                  <span
                    v-if="item.fieldKey == 'commitment_seal'"
                    class="btn_text"
                    @click="downloadStamp"
                    >下载模板</span
                  >
                  <span style="vertical-align: bottom;color: #a4a4a4;" v-else>{{
                    item.fieldKey == "recent_photos"
                      ? "竖向白底证件照 文件大小<2M"
                      : "文件大小<2M"
                  }}</span>
                </el-form-item>
              </template>
              <el-form-item
                v-else-if="item.inputType == 5"
                :label="item.fieldName"
                label-width="120px"
                :prop="item.fieldKey"
                ><el-date-picker
                  type="date"
                  v-model="infoForm[item.fieldKey]"
                  :placeholder="`请选择${item.fieldName}`"
                  value-format="yyyy-MM-dd"
                >
                </el-date-picker>
              </el-form-item>
            </el-col>
          </el-form>
        </el-row>
        <div
          style="color:red;display: flex;"
          v-if="historyData.text && historyData.text.length > 0"
        >
          <div style="width:110px;">审核结果反馈：</div>
          <div>{{ historyData.text }}</div>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="close">取 消</el-button>
        <el-button type="primary" @click="submitForm" :loading="uploading"
          >确 定</el-button
        >
      </span>
    </el-dialog>
  </div>
</template>

<script>
import * as imageConversion from "image-conversion";
export default {
  name: "",
  props: {},
  data() {
    return {
      listData: [],
      options: {},
      infoForm: {},
      rules: {},
      historyData: {}, //历史数据
      cacheIdCardData: {}, //身份证数据
      nameDisabledStatus: false,
      idcardDisabledStatus: false,
      telphoneDisabledStatus: false,
      uploading: false,
      isShow: false,
      activeData: {},
      idcard_face_photo_old: "",
      recent_photos_old: "",
      checkStatus: 0, //是否审核通过才允许学习 1是0否
      STATUS: false //区分个人中心入口操作
    };
  },
  computed: {
    eduDisAbledStatus: function() {
      return function(item) {
        if (
          this.activeData.educationName == "继续教育" &&
          this.activeData.projectName == "施工现场专业人员" &&
          this.activeData.businessName == "七大员"
        ) {
          if (
            this.activeData.categoryName == "材料员" ||
            this.activeData.categoryName == "资料员" ||
            this.activeData.categoryName == "劳务员"
          ) {
            let list = [
              "职高",
              "高中",
              "专科",
              "本科",
              "硕士研究生",
              "博士研究生"
            ];
            return !list.includes(item);
          } else {
            let list = ["专科", "本科", "硕士研究生", "博士研究生"];
            return !list.includes(item);
          }
        } else {
          return false;
        }
      };
    }
  },
  methods: {
    async init(item, status = false) {
      this.STATUS = status;
      console.log(item, "item");
      this.activeData = item;
      //获取初始数据
      try {
        await this.getInitData();
        console.log("1");
        //获取历史数据
        await this.getHistoricalRecord();
        console.log("2");
        this.isShow = true;
        //回填数据
        this.backFillData();
        console.log("3");
      } catch (error) {
        console.log("4");
        console.log("抛出：", error);
      }
    },
    getInitData() {
      return new Promise((resolve, reject) => {
        let commitDictAry = {
          sex: "sys_user_sex",
          education: "edu_level",
          working_years: "working_years",
          apply_post: "apply_post"
        };
        this.$request.getbaseprofiletpId(this.activeData.goodsId).then(res => {
          if (!res.data) {
            //不需要填写
            this.isShow = false;
            this.$emit("callbackDataReview");
            return reject("不需要填写");
          }
          let Ary = [
            ...JSON.parse(res.data.keyValue),
            ...JSON.parse(res.data.keyValue2)
          ];
          let Obj = {};
          this.checkStatus = res.data.checkStatus || 0;
          Ary.forEach(i => {
            Obj[i.fieldKey] = [
              {
                required: i.required,
                message: `请${
                  i.inputType == 1
                    ? "输入"
                    : i.inputType == 2 || i.inputType == 5
                    ? "选择"
                    : "上传"
                }${i.fieldName}`,
                trigger: i.inputType == 1 ? "blur" : "change"
              }
            ];
            if (i.fieldKey == "unit_tel" && i.required) {
              Obj[i.fieldKey].push({
                validator: (rule, value, callback) => {
                  var reg_tel = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;
                  var vartest = /^([0-9]{3,4}-)?[0-9]{7,8}$/;
                  var vartest1 = /^([0-9]{3,4})?[0-9]{7,8}$/;
                  if (
                    reg_tel.test(value) ||
                    vartest.test(value) ||
                    vartest1.test(value)
                  ) {
                    return callback();
                  } else {
                    return callback(new Error("单位联系电话不正确"));
                  }
                },
                trigger: ["change", "blur"]
              });
            }
            if (i.inputType == 2) {
              this.options[i.fieldKey] = this.$store.state.dictList[
                commitDictAry[i.fieldKey]
              ];
            }
          });
          this.rules = Obj;
          this.listData = Ary;
          resolve();
        });
      });
    },
    //获取历史记录
    getHistoricalRecord() {
      return new Promise((resolve, reject) => {
        this.$request
          .getbaseprofiletpgetInfo({
            goodsId: this.activeData.goodsId,
            orderGoodsId: this.activeData.orderGoodsId
          })
          .then(res => {
            if (!res.data) {
              //提示填写规则
              this.$confirm(`请填写资料`, "温馨提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                closeOnClickModal: false,
                closeOnPressEscape: false,
                distinguishCancelAndClose: false,
                showClose: false
              })
                .then(_ => {
                  let str = this.listData.map(i => i.fieldName).join("、");
                  this.$confirm(
                    `
          本产品（或服务）提供【${this.activeData.goodsName}】课程的在线学习功能，为使用这些功能，我们需要使用您设备上的摄像头，并收集以下个人信息：
         ${str}
          ,学习详细记录。
          我们会将上述信息提供至广东省建设执业注册管理中心等第三方组织使用，用于继续教育备案等。如果您拒绝，将导致这些功能无法实现，但不影响您使用本产品（或服务）的其他业务功能。
        `,
                    "提示",
                    {
                      confirmButtonText: "确定",
                      cancelButtonText: "返回",
                      closeOnClickModal: false,
                      closeOnPressEscape: false,
                      distinguishCancelAndClose: false,
                      showClose: false
                    }
                  )
                    .then(_ => {
                      resolve();
                    })
                    .catch(_ => {
                      //停止执行-退出页面
                      this.$router.back(-1);
                    });
                })
                .catch(_ => {
                  //停止执行-退出页面
                  this.$router.back(-1);
                });
            } else if (res.data.status === 3 && res.data.changeStatus === 1) {
              //资料审核不通过，请前往重新填写
              this.$confirm(`资料审核不通过，请前往重新填写`, "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "返回",
                closeOnClickModal: false,
                closeOnPressEscape: false,
                distinguishCancelAndClose: false,
                showClose: false
              })
                .then(_ => {
                  this.historyData = Object.assign(
                    { id: res.data.id, text: res.data.text },
                    JSON.parse(res.data.keyValue)
                  ); //历史数据
                  resolve();
                })
                .catch(_ => {
                  //停止执行-退出页面
                  this.$router.back(-1);
                });
            } else if (this.STATUS) {
              this.historyData = Object.assign(
                { id: res.data.id },
                JSON.parse(res.data.keyValue)
              ); //历史数据
              resolve();
            } else if (this.checkStatus == 1 && res.data.status !== 1) {
              //后台设置需要审核通过才允许学习
              this.checkFunc();
            } else {
              this.isShow = false;
              //不需要填写
              this.$emit("callbackDataReview");
              return reject("不需要填写");
            }
          });
      });
    },
    //回填数据
    backFillData() {
      if (Object.keys(this.historyData).length > 0 || this.historyData.id) {
        for (let i in this.historyData) {
          this.$set(
            this.infoForm,
            i,
            this.historyData[i] ? this.historyData[i].value : null
          );
          if (i == "recent_photos") {
            this.recent_photos_old = this.historyData[i].value;
          }
          if (i == "idcard_face_photo") {
            this.idcard_face_photo_old = this.historyData[i].value;
          }
        }
        this.$nextTick(() => {
          this.$refs["infoForm"].clearValidate();
        });
      } else {
        if (!this.infoForm["name"]) {
          if (this.$store.state.userInfo.realname) {
            this.$set(
              this.infoForm,
              "name",
              this.$store.state.userInfo.realname
            );
            this.nameDisabledStatus = true;
          }
        } else {
          this.nameDisabledStatus = true;
        }
        if (!this.infoForm["idcard"]) {
          if (this.$store.state.userInfo.idCard) {
            this.$set(
              this.infoForm,
              "idcard",
              this.$store.state.userInfo.idCard
            );
            this.idcardDisabledStatus = true;
          }
        } else {
          this.idcardDisabledStatus = true;
        }
        if (!this.infoForm["telphone"]) {
          if (this.$store.state.userInfo.telphone) {
            this.$set(
              this.infoForm,
              "telphone",
              this.$store.state.userInfo.telphone
            );
            this.telphoneDisabledStatus = true;
          }
        } else {
          this.telphoneDisabledStatus = true;
        }
        if (
          !this.infoForm["work_unit"] &&
          this.$store.state.userInfo.companyName
        ) {
          this.$set(
            this.infoForm,
            "work_unit",
            this.$store.state.userInfo.companyName
          );
        }
        if (!this.infoForm["sex"] && this.$store.state.userInfo.sex) {
          this.$set(
            this.infoForm,
            "sex",
            this.$store.state.userInfo.sex == 1
              ? "男"
              : this.$store.state.userInfo.sex == 2
              ? "女"
              : null
          );
        }
        if (
          !this.infoForm["education"] &&
          this.$store.state.userInfo.eduLevel &&
          !(
            this.activeData.educationName == "继续教育" &&
            this.activeData.projectName == "施工现场专业人员" &&
            this.activeData.businessName == "七大员"
          )
        ) {
          this.$set(
            this.infoForm,
            "education",
            this.$store.state.userInfo.eduLevel
          );
        }
        if (
          !this.infoForm["recent_photos"] &&
          this.$store.state.userInfo.oneInchPhotos
        ) {
          this.$set(
            this.infoForm,
            "recent_photos",
            this.$store.state.userInfo.oneInchPhotos
          );
          this.recent_photos_old = this.$store.state.userInfo.oneInchPhotos;
        }
        if (
          !this.infoForm["idcard_face_photo"] &&
          this.$store.state.userInfo.idCardImg1
        ) {
          this.$set(
            this.infoForm,
            "idcard_face_photo",
            this.$store.state.userInfo.idCardImg1
          );
          this.idcard_face_photo_old = this.$store.state.userInfo.idCardImg1;
        }
        if (
          !this.infoForm["idcard_national_photo"] &&
          this.$store.state.userInfo.idCardImg2
        ) {
          this.$set(
            this.infoForm,
            "idcard_national_photo",
            this.$store.state.userInfo.idCardImg2
          );
        }
      }
    },
    //审核通过才允许学习
    checkFunc() {
      //后台设置需要审核通过才允许学习
      this.$confirm(
        `资料正在审核中，暂无法学习，请耐心等待！如需加急审核，请联系客服人员`,
        "提示",
        {
          confirmButtonText: "确定",
          cancelButtonText: "返回",
          closeOnClickModal: false,
          closeOnPressEscape: false,
          distinguishCancelAndClose: false,
          showClose: false
        }
      )
        .then(_ => {
          //停止执行-退出页面
          this.$router.back(-1);
        })
        .catch(_ => {
          //停止执行-退出页面
          this.$router.back(-1);
        });
    },
    //照片处理逻辑
    async uploadImg(e, item) {
      try {
        let A = ["idcard_face_photo"].indexOf(item); //["idcard_face_photo","idcard_national_photo"]
        let file = await this.uploadRules(e.target.files[0]);
        if (A !== -1) {
          const res = await this.faceCertificationIDCardOCR(A + 1, file);
          if (res.code == 500) {
            this.$message.error(res.msg);
          } else {
            this.cacheIdCardData = res.data;
            //身份证姓名身份证比对
            await this.idCardDataComparison();
            this.$set(this.infoForm, item, res.data.IdImgPath);
          }
        } else {
          this.$set(
            this.infoForm,
            item,
            await this.$upload.upload(file, 0, {}, false)
          );
        }
        this.$refs["infoForm"].validateField(item);
        e.target.value = "";
      } catch (error) {
        e.target.value = "";
      }
    },
    //清空签名板
    retDraw() {
      this.$set(this.infoForm, "commitment_electr_signature", "");
      this.$nextTick(() => {
        this.$refs.esign[0].reset();
      });
    },
    //校验及压缩
    uploadRules(file) {
      return new Promise((resolve, reject) => {
        const fileType = file.type;
        const isImage = fileType.indexOf("image") != -1;
        const sizeToM = file.size / 1024 / 1024;
        if (!isImage) {
          this.$message.error("只能上传图片格式png、jpg、gif!");
          reject(false);
        }
        if (sizeToM > 2) {
          imageConversion
            .compressAccurately(file, {
              size: 1024 * 2,
              width: 1000,
              height: 1000
            })
            .then(res => {
              res = new File([res], file.name, { type: res.type });
              resolve(res);
            });
        } else {
          resolve(file);
        }
      });
    },
    //身份证校验
    faceCertificationIDCardOCR(cardSide, file) {
      return new Promise(resolve => {
        var reader = new FileReader();
        // 将文件加载进入
        reader.readAsDataURL(file);
        reader.onload = e => {
          // 转换完成输出该文件base64编码
          let base64 = e.target.result;

          this.$request
            .faceCertificationIDCardOCR({
              cardSide: cardSide, //1人像  2 国徽
              cardImageBase64: base64,
              gradeId: this.activeData.gradeId
            })
            .then(res => {
              resolve(res);
            })
            .catch(err => {
              resolve(err);
            });
        };
      });
    },
    //身份证姓名身份证比对
    idCardDataComparison() {
      return new Promise((resolve, reject) => {
        if (
          this.infoForm["name"] &&
          this.cacheIdCardData["IdName"] &&
          this.infoForm["name"].trim() !== this.cacheIdCardData["IdName"]
        ) {
          var str = "输入的姓名和身份证人像面照片姓名不匹配,请联系客服";
          this.$message.warning(str);
          reject(str);
        } else if (
          this.infoForm["idcard"] &&
          this.cacheIdCardData["IdNum"] &&
          this.infoForm["idcard"] !== this.cacheIdCardData["IdNum"]
        ) {
          var str = "输入的身份证号和身份证人像面照片身份证号不匹配,请联系客服";
          this.$message.warning(str);
          reject(str);
        } else {
          resolve();
        }
      });
    },
    async downloadStamp() {
      await this.subCanvas();
      this.$request
        .baseProfileStampV2AddWord({
          goodsId: this.activeData.goodsId,
          keyValue: this.returnData()
        })
        .then(res => {
          let url = this.$tools.splitImgHost(res.msg);
          let name = res.msg.substring(res.msg.lastIndexOf("/") + 1);
          let image = new Image();
          // 解决跨域 Canvas 污染问题,
          image.setAttribute("crossorigin", "anonymous");
          image.onload = function() {
            var canvas = document.createElement("canvas");
            canvas.width = image.width;
            canvas.height = image.height;
            var context = canvas.getContext("2d");
            context.drawImage(image, 0, 0, image.width, image.height);
            var base64 = canvas.toDataURL("image/jpg"); //将图片格式转为base64
            var a = document.createElement("a"); // 生成一个a元素
            var event = new MouseEvent("click"); // 创建一个单击事件
            a.download = name; // 设置图片名称
            console.log(base64);
            a.href = base64; // 将生成的URL设置为a.href属性
            a.dispatchEvent(event); // 触发a的单击事件
          };
          image.src = url + "?time=" + Date.now(); //注意，这里是灵魂，否则依旧会产生跨域问题
        });
    },
    //将canvas签名生产oss地址
    subCanvas() {
      return new Promise((resolve, reject) => {
        const STATUS = this.listData.findIndex(
          i => i.fieldKey == "commitment_electr_signature"
        );
        if (!this.infoForm["commitment_electr_signature"] && STATUS !== -1) {
          this.$refs.esign[0]
            .generate() // 使用生成器调用把签字的图片转换成为base64图片格式
            .then(async res => {
              let url = await this.$upload.upload(
                this.convertBase64UrlToBlob(res),
                0
              );
              this.$set(this.infoForm, "commitment_electr_signature", url);
              this.$refs["infoForm"].validateField(
                "commitment_electr_signature"
              );
              resolve();
            })
            .catch(err => {
              console.log(err, "err");
              resolve();
            });
        } else {
          resolve();
        }
      });
    },
    //canvas转file
    convertBase64UrlToBlob(urlData) {
      var localData = urlData; //dataUrl为base64位
      let base = atob(localData.substring(localData.indexOf(",") + 1)); // base是将base64编码解码，去掉data:image/png;base64部分
      let length = base.length;
      let url = new Uint8Array(length);
      while (length--) {
        url[length] = base.charCodeAt(length);
      }
      let file = new File([url], "a.jpg", {
        type: "image/jpg"
      });
      //最后将file，通过ajax请求做为参数传给服务器就可以了
      return file;
    },
    //证件照与身份证匹配
    IdCardCompareFace() {
      return new Promise(async (resolve, reject) => {
        if (
          !(
            this.infoForm["idcard_face_photo"] &&
            this.infoForm["recent_photos"] &&
            (this.infoForm["idcard_face_photo"] !==
              this.idcard_face_photo_old ||
              this.infoForm["recent_photos"] !== this.recent_photos_old)
          )
        ) {
          resolve();
          return;
        }
        this.$request
          .faceCertificationIdCardCompareFace({
            urlA: this.infoForm["idcard_face_photo"],
            oneInchPhotos: await this.$tools.imageToBase64(
              this.$tools.splitImgHost(this.infoForm["recent_photos"])
            )
          })
          .then(res => {
            if (res.data >= 70) {
              resolve();
            } else {
              var str = "证件照和身份证人像面照片不匹配";
              this.$message.warning(str);
              reject(str);
            }
          })
          .catch(err => {
            reject(err);
          });
      });
    },
    close() {
      if (this.STATUS) {
        this.isShow = false;
      } else {
        this.$router.back(-1);
      }
    },
    returnData() {
      let map = new Map();
      this.listData.forEach(i => {
        map.set(i.fieldKey, {
          fieldKey: i.fieldKey,
          value: this.infoForm[i.fieldKey],
          fieldName: i.fieldName,
          status: this.historyData[i.fieldKey]
            ? this.infoForm[i.fieldKey] == this.historyData[i.fieldKey].value
              ? 0
              : 1
            : 0
        });
      });
      return JSON.stringify(Object.fromEntries(map));
    },
    async submitForm() {
      //签名需在表单验证前执行完毕 否则会导致表单验证不通过
      await this.subCanvas();
      this.$refs["infoForm"].validate(async valid => {
        if (valid) {
          //独立操作上传承诺书
          if (this.STATUS) {
            this.uploading = true;
            if (this.infoForm["commitment_seal"]) {
              this.$request
                .baseprofiletpcommitmentupload({
                  id: this.historyData.id,
                  imageUrl: this.infoForm["commitment_seal"]
                })
                .then(res => {
                  this.$message.success("提交成功");
                  this.isShow = false;
                  this.$emit("callbackDataReview");
                })
                .catch(err => {
                  this.$message.error(err.msg);
                })
                .finally(() => {
                  this.uploading = false;
                });
            } else {
              this.$message.error("请上传承诺书盖章");
              this.uploading = false;
            }
            return;
          }
          //end
          try {
            this.uploading = true;
            await this.idCardDataComparison();
            await this.IdCardCompareFace();
            let obj = this.returnData();
            if (this.historyData.id) {
              let data = {
                id: this.historyData.id,
                goodsId: this.activeData.goodsId,
                orderGoodsId: this.activeData.orderGoodsId,
                keyValue: obj
              };
              this.$request
                .editbaseprofiletp(data)
                .then(res => {
                  this.$message.success("提交成功");
                  this.isShow = false;
                  if (this.checkStatus == 1) {
                    //后台设置需要审核通过才允许学习
                    this.checkFunc();
                    return;
                  }
                  this.$emit("callbackDataReview");
                })
                .catch(err => {
                  this.$message.warning(err.msg);
                })
                .finally(() => {
                  this.uploading = false;
                });
            } else {
              let data = {
                profileTpId: this.activeData.goodsId,
                goodsId: this.activeData.goodsId,
                orderGoodsId: this.activeData.orderGoodsId,
                keyValue: obj
              };
              this.$request
                .addbaseprofiletp(data)
                .then(res => {
                  this.$message.success("提交成功");
                  this.isShow = false;
                  if (this.checkStatus == 1) {
                    //后台设置需要审核通过才允许学习
                    this.checkFunc();
                    return;
                  }
                  this.$emit("callbackDataReview");
                })
                .catch(err => {
                  this.$message.warning(err.msg);
                })
                .finally(() => {
                  this.uploading = false;
                });
            }
          } catch (error) {
            this.uploading = false;
          }
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    }
  }
};
</script>

<style lang="scss" scoped>
/deep/ .el-dialog {
  margin-top: 2vh !important;
  border-radius: 18px;
  & > .el-dialog__header {
    border-bottom: 2px solid #eee;
    & > .el-dialog__title {
      font-size: 16px;
    }
  }
}
.uploadBox {
  border: 2px dotted rgb(190, 190, 190);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 80px;
  border-radius: 8px;
  & > i {
    font-size: 30px;
    font-weight: bold;
    color: rgb(190, 190, 190);
  }
}
.cns_sq {
  display: flex;
  background-color: rgb(247, 248, 250);
  border-radius: 8px;
  height: 330px;
  margin-bottom: 22px;
  .left {
    flex: 1;
    padding: 10px 20px;
    p {
      line-height: 30px;
    }
  }
  .right {
    flex: 1;
    padding: 10px 20px;
    h3 {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 16px;
      .texts {
        color: #a4a4a4;
      }
    }
  }
}
.btn_text {
  color: #409eff;
  cursor: pointer;
  user-select: none;
  font-weight: 400;
  margin-left: 8px;
}
</style>