<template>
  <div class="checkRecord">
    <headNav
      @backPage="backPage"
      @rightClick="rightClick"
      :iconName="showIcon"
      :title="'监督检查记录'"
      :id="$route.params.id"
      :backRouter="{
        path: `/reportListDetail/${$route.params.id}`
      }"
      class="headNav"
    ></headNav>
    <div class="content">
       <!-- :class="[tdEditable ? '' : 'span-td']" -->
      <div v-if="showImg" class="pdfImg">
        <!-- <iframe :src="pdfSrc" frameborder="0"></iframe> -->
        <pdfPreview :url="pdfSrc"></pdfPreview>
      </div>

      <div class="file" id="file" v-else>
        <div class="title scale8">
          <div class="title_top" style="padding-top: 30px;">
            {{ topInfo.lawUnit }}
          </div>
          <div class="title_bottom">消防监督检查记录</div>
          <div class="title_bottom">(其他形式消防监督检查适用)</div>
        </div>

        <div class="number scale8 code_num" style="margin-bottom: 5px;">
          <span class="">编号：<span class="fb">{{ pdfNumberRes }}</span></span>
        </div>
        <div class="number scale8 monitor_record_name_time" style="justify-content:space-between;">
          <span class="monitor_record_name">
            <label>被检查单位名称：</label><div class="fb" v-if="!tdEditable">{{ objName }}</div>
              <van-field
                v-else
                autosize
                disabled
                v-model="objName"
                :border="false"
              />
          </span>
          <!-- @click="showSelectCheckTime" -->
          <span class="monitor_record_time"><label>检查时间：</label><span class="fb">{{checkTime}}</span></span>
        </div>
        <table class="record_table scale8">
          <tr>
            <td colspan="5" class="check_type_tr">
              <div class="check_type_label">检查类型：</div>
              <van-radio-group v-model="check_type" direction="horizontal" class="check_item_content check_type_content">
               <van-radio shape="square" name="0">对举报投诉的检查</van-radio>
                <van-radio shape="square" name="1">大型群众性活动举办前的检查</van-radio>
                <van-radio shape="square" name="2">建设工程施工现场检查</van-radio>
                <van-radio shape="square" name="3">责令限期改正复查</van-radio>
                <van-radio shape="square" name="4">申请恢复施工、使用、生产、经营的检查</van-radio>
                <van-radio shape="square" name="5" style="width:100%;">申请解除临时查封的检查</van-radio>
                <van-radio shape="square" name="6">其他检查</van-radio>
              </van-radio-group>
            </td>
          </tr>
          <!-- <tr>
            <td rowspan="2" style="width: 10%;" class="td_center">
              单位<br />情况
            </td>
            <td style="width: 18%;" class="td_center">
              单位(场所)<br />名&nbsp;&nbsp;称
            </td>
            <td style="width: 27%;">
              <div class="full_field" v-if="!tdEditable">{{ objName }}</div>
              <van-field
                class="full_field"
                v-else
                autosize
                v-model="objName"
                type="textarea"
                :border="false"
              />
            </td>
            <td style="width: 18%;" class="td_center">
              法定代表人/<br />主要负责人
            </td>
            <td style="width: 27%;">
              <div class="full_field" v-if="!tdEditable">
                {{ objLegPerson }}
              </div>
              <van-field
                class="full_field"
                v-else
                autosize
                v-model="objLegPerson"
                type="textarea"
                :border="false"
              />
            </td>
          </tr> -->
          <!-- <tr>
            <td class="td_center">
              地&nbsp;&nbsp;址
            </td>
            <td>
              <div class="full_field" v-if="!tdEditable">{{ objAddr }}</div>
              <van-field
                class="full_field"
                v-else
                autosize
                v-model="objAddr"
                type="textarea"
                :border="false"
              />
            </td>
            <td class="td_center">联系人及<br />联系电话</td>
            <td>
              <div class="full_field" v-if="!tdEditable">
                {{ objLegPersonPhone }}
              </div>
              <van-field
                class="full_field"
                v-else
                autosize
                v-model="objLegPersonPhone"
                type="textarea"
                :border="false"
              />
            </td>
          </tr> -->
          <tr>
            <td style="width: 10%;" class="td_center">
              发现<br />的违<br />法行<br />为及<br />火灾<br />隐患<br />
            </td>
            <td colspan="4">
              <span class="content_td fb">{{checkContent}}</span>
            </td>
          </tr>
          <tr id="content_tr">
            <td style="width: 10%;" class="td_center">
               处理<br />情况
            </td>
            <td colspan="4">
              <van-field
                v-if="tdEditable"
                v-model="IllegalContent"
                rows="3"
                type="textarea"
                :border="false"
              />
              <span class="content_td fb" v-else>{{IllegalContent}}</span>
            </td>
          </tr>
          <tr>
            <td style="width: 10%;" class="td_center">
              备注
            </td>
            <td colspan="4">
              <span class="remark_td fb">{{remark}}</span>
            </td>
          </tr>
          <tr>
             <!-- @click="showCheckerSignPannel=true;" -->
            <td colspan="5" class="no_border sign_img_container">
              消防监督检察员(签名)：<span id="signOne" class="showLine FontColorWhite">检察员签字</span>
              <!-- <span>消防监督检察员(签名)：</span>
              <img class="sign_img" :src="checkerSignVal" alt="">
              <br /> -->
            </td>
          </tr>
          <tr>
            <td colspan="5" class="no_border sign_img_container">
              被检查单位随同检察人员(签名)：<span id="signTwo" class="showLine FontColorWhite">单位主管签字</span>
              <!-- <span>被检查单位随同检察人员(签名)：</span> -->
              <!-- <img class="sign_img" :src="assistantSignVal" alt=""> -->
            </td>
          </tr>
          <tr>
            <td colspan="5" class="no_border">
              <div style="text-indent:2em;">一式两份，一份交被检查单位，一份存档。对大型群众性活动举办前进行消防安全检查的，另制作一份与消防安全检查意见书一并交本级公安机关治安部门。</div>
              <div class="fb">（备注：1、此记录表应由支队、大队确定的主责参谋分号段编号，并按顺序装订归档）</div>
              <!-- 此纪录由公安机关消防机构存档。对大型群众性活动举办前进行消防安全检查的，另制作一份加盖印章后移交公安机关治安管理部门，由其在存档联备注栏签收。 -->
            </td>
          </tr>
        </table>
      </div>
      <div class="btn">
        <van-button v-if="nextStep" type="primary" @click="backToExecute">上一步</van-button>
        <van-button v-if="nextStep" type="info" @click="sure">下一步</van-button>
      </div>
    </div>
    <van-popup v-model="show_time" position="bottom">
      <van-datetime-picker
        v-model="checkTime"
        title="检查时间"
        type="datehour"
        :min-date="minDate"
        :max-date="maxDate"
        @cancel="cancelSelectTime"
        @confirm="chooseDate"
      />
    </van-popup>
    <van-popup overlay-class="sign_popup" v-model="showCheckerSignPannel" position="bottom">
        <sign @save="saveCheckerSign" v-model="checkerSignVal"></sign>
    </van-popup>
    <van-popup overlay-class="sign_popup" v-model="showAssistantSignPannel" position="bottom">
        <sign @save="saveAssistantSign" v-model="assistantSignVal"></sign>
    </van-popup>
    <!-- 遮罩层 -->
    <v-mask class="top-mask" :showOverLay="showOverLay" :tipMsg="tipMsg"></v-mask>
  </div>
</template>

<script>
import dayjs from "dayjs";
import headNav from "@/components/headNav.vue";
import sign from "@/components/sign.vue";
import { handleProblemImgs, sealFile, convert, downloadSignedFile, signSetToken, initSign } from "@/utils/index.js";
import { getOnePdf } from "@/utils/htmlToPDF";
import pdfPreview from '@/components/pdf.vue'
import mask_overLay from "@/components/overLay_xy.vue";
import { get } from "@/utils/http.js";
import Vue from 'vue'
import config from '@/config';
import pdfNumber from '@/mixins/pdfNumber';
import executeStepMixin from '@/mixins/executeStep';
import { isEmpty } from '@/utils/tool';
import { PDF_SCALE, PDF_SIGN_WIDTH, PDF_SIGN_HEIGHT } from '@/config';

export default {
  name: "reportJobMonitorCheckRecord",
  components: {
    headNav,
    sign,
    "v-mask": mask_overLay,
    pdfPreview,
  },
  mixins: [pdfNumber, executeStepMixin],
  data() {
    return {
      dayjs,
      tdEditable: true,
      check_type: '',
      show_time: false,
      checkTime: "",
      objName: "",
      objAddr: "",
      objLegPerson: "",
      objLegPersonPhone: "",
      checkContent: "",
      IllegalContent: '',
      remark: "",
      minDate: new Date(),
      maxDate: new Date(2025, 10, 1),
      checkerAssign: "",
      assismentAssign: "",
      checkForm: "1",
      isImportant: "1",
      showOverLay: false,
      tipMsg: "加载中",
      topInfo: "",
      questionList: "",
      companyInfo: "",
      year: "",
      month: "",
      day: "",
      hour: "",
      imgSrc: "",
      pdfSrc: "",
      showImg: "",
      showIcon: "",
      checkBox1: false,
      checkBox2: false,
      checkBox3: false,
      checkBox4: false,
      radioGroup1: "",
      pdfDataOld: [],
      pdfDataNew: "",
      pdfDataQes: "",
      fileNum: "",
      arr1: [],
      arr2: [],
      arr3: [],
      arr4: [],
      arr5: [],
      arr6: [],
      arr7: [],
      arr8: [],
      arr9: [],
      arr10: [],
      formData: {},
      signId: null,
      showCheckerSignPannel: false,
      checkerSignVal: null,
      showAssistantSignPannel: false,
      assistantSignVal: null,
    };
  },
  computed: {
    jobDetail() {
      const jobDetail = this.$route.query.jobDetail;
      if (!jobDetail) return {};
      const res = JSON.parse(jobDetail);
      const { job_result_content, enforce_result, job_result_remark, IllegalContent } = res;
      this.checkContent = job_result_content;
      this.IllegalContent = IllegalContent;
      this.remark = job_result_remark;
      this.objName = res.enforce_obj_name;
      this.objAddr = res.enforce_obj && res.enforce_obj.enforce_obj_address;
      this.objLegPerson = res.enforce_obj && res.enforce_obj.legal_person;
      this.objLegPersonPhone =
        res.enforce_obj && res.enforce_obj.legal_person_phone;
      this.checkTime = dayjs(res.start_time).format(
        "YYYY年MM月DD日HH时"
      );
      // 监督检查记录文件 id
      this.showImg = res.result_file_id;
      this.imgSrc = handleProblemImgs(res.result_file_id);
      this.pdfSrc = handleProblemImgs(res.result_file_id);
      return res;
    },
    nextStep() {
      return this.$route.query.nextStep !== 'false'
    }
  },
  created() {
    signSetToken(this.$signAos)
  },
  mounted() {
    this.init();
  },
  watch: {
    show_time(n) {
      if (!n) {
        this.checkTime =
          this.checkTime ||
          dayjs(this.jobDetail.start_time).format("YYYY年MM月DD日HH时");
      }
    },
  },
  methods: {
    backToExecute() {
      if (this.formData) {
        this.$router.replace({
          name: "executeReportJob",
          query: {
            jobDetail: JSON.stringify(this.formData),
          },
        });
      }
    },
    saveCheckerSign() {
      this.showCheckerSignPannel = false
    },
    saveAssistantSign() {
      this.showAssistantSignPannel = false
    },
    addAosEvent() {
      if (!this.$signAos) return
      this.$signAos.event.once('onSubmitSuccess', this.onSignSubmitSuccess)
      this.$signAos.event.once('onSignComplete', this.onSignComplete)
      this.$signAos.event.once('onCloseFrame', this.onCloseFrame)
    },
    async onSignSubmitSuccess(options) {
      const { signId, thirdBizId, files, sourceFileList, fileMd5List } = options;
      this.signId = signId
      this.$signAos.startView(signId)
      try {
        this.showOverLay = true
        // 获取签字后的 pdf 文件流
        const signFile = await downloadSignedFile(files[0])
        // 将 pdf流 转为 base64 的文件
        const signFileBase64 = await convert(signFile.data)
        // // 上传 base64 图片盖章
        const sealFileData = await sealFile(signFileBase64, {
            "x": "250.00",
            "y": "50.00",
        })
        // const sealFileBase64 = await convert(sealFileData.data)
        // 将 pdf 的文件转换为 image
        // const imgBase64 = await converPdfToImage(new Blob([sealFileData.data], {type: 'application/pdf'}))
        // // 将盖章后的 pdf 文件流 转为 base64 的文件
        this.tipMsg = "下发中...";
        await this.uploadPngAndPdf(
          // dataURLtoBlob(imgBase64),
          new Blob([sealFileData.data], {type: 'application/pdf'})
        )
      } catch(err) {
        console.log(err);
        this.showOverLay = false
        this.tdEditable = true
      }
    },
    onSignComplete() {
    },
    onCloseFrame() {
      this.showOverLay = false
      this.tdEditable = true
    },
    showSelectCheckTime() {
      this.show_time = true;
    },
    formatter(type, val) {
      return dayjs(val).format("YYYY年MM月DD日HH时");
    },
    chooseDate(value) {
      this.checkTime = dayjs(value).format("YYYY年MM月DD日HH时");
      this.show_time = false;
    },
    cancelSelectTime() {
      this.show_time = false;
      this.checkTime = dayjs(this.jobDetail.start_time).format(
        "YYYY年MM月DD日HH时"
      );
    },
    // 初始化
    async init() {
      this.loadPdfNumber('record');
      this.$http.get(`/v2/api/enforce-job/${this.jobDetail.id}`).then((res) => {
        if (res && res.data && res.data.check_nodes) {
          const obj = res.data;
          const users = [];
          if (obj.executors) {
            obj.executors.map((item) => {
              users.push(item.user_name);
            });
            obj.executorNames = users.join(", ");
          }
          const date = new Date(obj.start_time);
          this.year = date.getFullYear();
          this.month = date.getMonth();
          this.day = date.getDay();
          this.hour = date.getHours();
          this.formData = res.data;
          this.fileNum = res.data.job_no;
          this.checkContent = res.data.job_result_content;
          this.IllegalContent = res.data.IllegalContent;
          this.remark = res.data.job_result_remark || '无';
          this.updateTaskStep(obj.id, 'RECORD');
        }
      });
    },

    // 获取图片Api
    getPdfImgApi(id) {
      return get(`/supervision/getCheckLogPic/${id}`);
    },

    // 获取任务详情信息
    async getDetailInfoApi() {
      const res = await get(
        `/cdsupervisionTask/get/${this.$route.params.currentID}`
      );
      if (res.success === true) {
        return res.data;
      }
    },

    // 获取pdf答案
    async getPdfDataApi(id) {
      const res = await get(`/applet/getPdfData/${id}`);
      if (res.success === true) {
        return res.data;
      }
    },

    // 获取单位信息
    async getCompanyInfoApi(id) {
      const res = await get(`/cdSuperObjE/get/${id}`);
      if (res.success === true) {
        return res.data;
      }
    },

    // 获取编号
    async getFileNumApi() {
      const res = await get(`/applet/getPdfCode`);
      if (res.success === true) {
        return res.data;
      }
    },

    // 解析radio的字符串为数组
    getRadioGroup(str) {
      return str.split(",");
    },

    // 后退一页
    backPage() {
      this.$router.go(-1);
    },

    // 跳转检查结果
    rightClick() {
      this.$router.push(
        `/checkResult/${this.topInfo.taskId}/${this.$route.params.currentID}`
      );
    },

    // base64转blob
    dataURItoBlob(base64Data) {
      var byteString;

      if (base64Data.split(",")[0].indexOf("base64") >= 0)
        byteString = atob(base64Data.split(",")[1]);
      else byteString = unescape(base64Data.split(",")[1]);

      var mimeString = base64Data
        .split(",")[0]
        .split(":")[1]
        .split(";")[0];

      var ia = new Uint8Array(byteString.length);

      for (var i = 0; i < byteString.length; i++) {
        ia[i] = byteString.charCodeAt(i);
      }

      return new Blob([ia], {
        type: mimeString,
      });
    },
    async uploadPngAndPdf(pdfblob) {
        // 上一步中的函数
        // var imgFd = new FormData();
        // imgFd.append("fileBinary", imgblob, "pdf.png");
        // imgFd.append("fileName", `消防监督检查记录-${Date.now()}.png`);
        // // 上传图片
        // let imgUploadRes = await this.$http.post("/v2/api/file", imgFd);
        // 上传 pdf
        const pdfFd = new FormData();
        pdfFd.append("fileBinary", pdfblob);
        pdfFd.append(
          "fileName",
          `消防监督检查记录-${Date.now()}.pdf`
        );
        // 上传 pdf
        const pdfUploadRes = await this.$http.post("/v2/api/file", pdfFd)
        // 更新任务字段
        const noticeResult = this.setupStaticNoticeResult(this.jobDetail, 'record',  this.check_type, this.IllegalContent);
        const res = await this.$http.put(`/v2/api/enforce-job/${this.jobDetail.id}`, {
          result_file_id: pdfUploadRes.data.id,
          static_notice_result: noticeResult,
        })
        this.showOverLay = false
        this.$router.replace({
          path: `/reportJobCheckSummery/${this.jobDetail.id}`,
          query: {
            jobDetail: JSON.stringify(this.jobDetail),
          },
        });
    },
    // 确定
    sure() {
      if (isEmpty(this.check_type)) {
        this.$toast.fail('请消防监督检查员签名');
        return
      }
      // if (!this.assistantSignVal) {
      //   this.$toast.fail('请被检查单位随同检查人员签名');
      //   return
      // }
      //  如果已经上传了 png以及 pdf 则直接跳转
      if (this.jobDetail.result_file_id) {
        this.$router.replace({
          path: `/reportJobCheckSummery/${this.jobDetail.id}`,
        });
        return;
      }
      let subData = "";
      this.tdEditable = false;
      this.$nextTick(async () => {
        subData = await getOnePdf(
          document.querySelector("#file"),
          "消防监督检查记录"
        );
        // await this.jumpSignAndSeal(subData)
        // return
        try {
          this.addAosEvent()
          // 发起签署
          if (this.$signAos) {
              const f = document.getElementById('file');
              const one = document.getElementById('signOne');
              let x1 = 140, y1 = 140, x2 = 180, y2 = 110;
              const height = document.getElementById('content_tr').clientHeight;
              const dis = height > 60 ? 55 : 70;
              if (f && one && one.offsetParent) {
                  y1 = (f.clientHeight - one.offsetParent.offsetTop) * PDF_SCALE - dis;
                  x1 = one.offsetLeft;
              }
              const two = document.getElementById('signTwo');
              if (f && two && two.offsetParent) {
                  y2 = (f.clientHeight - two.offsetParent.offsetTop) * PDF_SCALE - dis;
                  x2 = two.offsetLeft;
              }
              this.$signAos.startSign({
                  signId: '',
                  socialCreditCode: config.socialCreditCode,
                  files: [
                    {
                      file: subData,
                      sign: [{
                          x: x1,
                          y: y1,
                          width: PDF_SIGN_WIDTH,
                          height: PDF_SIGN_HEIGHT,
                          page: 1,
                          required: true,
                          name: '签名',
                          tipText: '消防监督检察员签名',
                      }, {
                          x: x2,
                          y: y2,
                          width: PDF_SIGN_WIDTH,
                          height: PDF_SIGN_HEIGHT,
                          page: 1,
                          required: true,
                          name: '签名',
                          tipText: '被检查单位随同检察人员签名',
                      }]
                    }
                  ],
                  signType: 'TOUCH',
                  isFree: false,
                  thirdBizId: 'xxx',
              });
          }
          else {
              this.$toast.fail('签署还未就绪，请过会再试');
              this.showOverLay = false;
              initSign().then(res => {
                  Vue.prototype.$signAos = res
              }).catch(_ => {})
          }
        }catch(err) {
          console.log(err);
        }
      });
    },
    async jumpSignAndSeal(subData) {
        var blob = this.dataURItoBlob(subData.turnImgData); // 上一步中的函数
        // var canvas = document.createElement("canvas");
        // var dataURL = canvas.toDataURL("image/jpeg", 0.5);
        var imgFd = new FormData(document.forms[0]);
        imgFd.append("fileBinary", blob, "pdf.png");
        imgFd.append("fileName", `消防监督检查记录-${Date.now()}.png`);

        this.tipMsg = "上传pdf中";
        // 上传图片
        let imgUploadRes = await this.$http.post("/v2/api/file", imgFd);
        const imageId = imgUploadRes.data.id;
        console.log(handleProblemImgs(imageId));
        subData.pdfFile.append("fileBinary", subData.pdfFile.get("file"));
        subData.pdfFile.append(
          "fileName",
          `消防监督检查记录-${Date.now()}.pdf`
        );
        // 上传 pdf
        this.$http
          .post("/v2/api/file", subData.pdfFile)
          .then((pdfUploadRes) => {
            // 更新任务字段
            this.$http
              .put(`/v2/api/enforce-job/${this.jobDetail.id}`, {
                result_file_id: pdfUploadRes.data.id,
                result_png_file_id: imgUploadRes.data.id,
              })
              .then((res) => {
                this.$router.replace({
                  path: `/reportJobCheckSummery/${this.jobDetail.id}`,
                  query: {
                    jobDetail: JSON.stringify(this.jobDetail),
                  },
                });
              });
          });
    }
  },
};
</script>

<style lang="scss" scoped>
.top-mask {
  z-index: 999999 !important;
}
.checkRecord {
  height: 100vh;
  display: flex;
  flex-direction: column;
  font-size: 14px;
  overflow: hidden;
  .headNav {
    flex: 0 0 50px;
  }
  .content {
    flex: 1;
    overflow-y: auto;
  }

  .pdfImg {
    margin-top: 47px;
    iframe {
      width: 100vw;
      height: 100vh;
    }
  }

  .ml5 {
    margin-left: 5px;
  }

  .scale8 {
    transform: scale(0.8);
  }

  .scale9 {
    transform: scale(0.9);
  }

  .item {
  }

  .itemFlex1 {
    flex: 1;
  }

  .itemFlex2 {
    flex: 2;
  }

  .underLine {
    flex: 1;
    height: 15px;
    border-bottom: 1px solid #a0a0a2;
  }

  .underLine_ {
    border-bottom: 1px solid #a0a0a2;
    padding: 0 4px;
  }

  .file {
    margin-top: 45px;
    background-color: #fff;
    font-family: arial;

    color: #585858;
    font-size: 10px;

    .title {
      width: 100%;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      letter-spacing: 2px;

      .title_top {
        font-size: 1px;
        margin-bottom: 10px;
      }

      .title_bottom {
        font-size: 14px;
        font-weight: bold;
      }
    }

    .title {
      margin-bottom: 5px;
    }

    .number {
      font-size: 12px;
      display: flex;
      justify-content: flex-end;
      margin: -5px 0 0 0;
    }

    .file_top {
      margin-top: -40px;
    }

    .isImportant {
      margin: 20px 0;
      display: flex;
    }

    .tips {
      margin: 80px 0;
    }
  }

  .btn {
    margin-top: 15px;
    display: flex;
    justify-content: space-around;

    button {
      flex: 1;
      margin: 5px 25px;
      height: 40px;
    }
  }

  .table {
    margin-top: -120px;

    .flexEnd {
      align-items: flex-end !important;
    }

    table {
      border: none;
      border-bottom: 1px solid;
      // border-collapse: collapse
    }

    .processName {
      width: 30px;
      font-size: 13px;
      text-align: center;
      color: #4d4d4d;
    }

    .sonProcessContent {
      padding: 0px 0px 20px 0px;

      .sonProcessItem {
        display: flex;
        align-items: flex-start;
        justify-content: flex-start;
        flex-wrap: wrap;

        .tableInput {
          border: none;
          border-bottom: 1px solid #a0a0a2;
        }

        .left {
          display: flex;
          margin-top: 2px;
        }

        .explain {
          textarea {
            border: none;
            width: 100%;
            resize: none;
            padding: 0;
          }
        }

        .sonProcessName {
          font-weight: bold;
          font-size: 12px;
          transform: scale(0.9);
          margin-left: -5px;
          // margin-top: 2px;
        }

        .right {
          display: flex;
          flex-wrap: wrap;
          margin-left: 10px;
          flex: 2;
          margin-top: -1px;

          .right_title {
          }

          .right_content {
            padding-left: 8px;
            height: 15px;
            display: flex;
            align-items: flex-end;
          }
        }

        .pabsolute {
          position: absolute;
          right: 15px;
          top: 15px;
        }
      }

      .sonProcessSpec {
        flex-wrap: nowrap;
        position: relative;
      }
    }

    th {
      border: 1px solid;
      padding: 4px 5px;
      border-bottom: none;
      border-right: none;

      &:last-child {
        border-right: 1px solid;
      }
    }

    td {
      border: 1px solid;
      padding: 4px 5px;
      border-bottom: none;
      border-right: none;

      &:last-child {
        border-right: 1px solid;
      }
    }

    .tableNewList_item {
      display: flex;
      justify-content: space-between;
    }
  }
}
.sign_img_container {
  position: relative;
}
.sign_img {
  position: absolute;
  height: 40px;
  top: 50%;
  transform: translateY(-50%);
}
/deep/ {
  .sign_popup {
  z-index: 200003 !important;
  + .van-popup  {
    z-index: 200005 !important;
  }
}
}
</style>

<style lang="scss">
.checkRecord {
  .specCheckBox {
    display: inline-block;
    position: relative;

    .specCheckBox_div {
      position: absolute;
      font-weight: normal;
      width: 130px;
      top: -14px;
      left: 20px;
    }
  }

  .van-radio-group {
    flex-wrap: wrap;
    align-items: flex-start;
  }

  .van-radio__icon--checked .van-icon {
    background-color: transparent;
    border: none;
    color: #000;
    // font-size: 14px;
  }

  .van-radio__label {
    color: #585858;
  }

  .van-radio__icon.van-radio__icon--square {
    border: 1px solid #383838;
    width: 10px;
    height: 10px;
    margin-bottom: 2px;
  }

  .van-radio__icon.van-radio__icon--square.van-radio__icon--checked {
    border: 1px solid transparent;
    margin-left: -3px;
  }

  .van-icon.van-icon-success {
    border: none;
  }

  .van-field__control {
    border-bottom: 1px solid #757575;
    width: 100%;
  }

  .van-cell.van-field {
    padding: 5px 5px;
  }

  .van-radio__icon--disabled .van-icon {
    background-color: transparent;
  }

  .van-radio__label.van-radio__label--disabled {
    margin-left: 4px;
    color: #7f7f7f;
  }

  .van-checkbox {
    align-items: flex-start;

    .van-checkbox__icon.van-checkbox__icon--square {
      width: 12px;
      height: 12px;
    }

    .van-checkbox__icon.van-checkbox__icon--square.van-checkbox__icon--checked {
      // margin-top: 5px;

      .van-icon.van-icon-success {
        margin-top: 5px;
        width: 12px;
        height: 12px;
        font-size: 12px;
        background-color: transparent;
        color: #323233;
        border: none;
      }
    }

    .van-icon.van-icon-success {
      margin-top: 5px;
      width: 12px;
      height: 12px;
      font-size: 12px;
      border: 1px solid #323243;
    }
  }
}
</style>
<style lang="scss" scoped>
.check_type {
  width: 90%;
  margin: 0 5%;
  display: flex;
  border: 1px solid #ddd;
}
.check_item_label {
  flex: 0 0 57px;
}
.check_item_content {
  flex: 1;
}
.flex {
  display: flex;
}
.flex_col {
  flex-direction: column;
}
.flex_1 {
  flex: 1;
}
.br {
  border-right: 1px solid #ddd;
}
.bl {
  border-left: 1px solid #ddd;
}
.bt {
  border-top: 1px solid #ddd;
}
.bb {
  border-bottom: 1px solid #ddd;
}
.nb {
  border: none;
}
.min-height {
  height: 50%;
}
.center {
  display: flex;
  align-items: center;
  text-align: center;
}
/deep/ {
  .van-field__control {
    border: none;
  }
}
p {
  /deep/ {
    .van-field {
      width: 50px;
    }
  }
}

.span-td {
  .record_table {
    margin-top: -35px;
  }
  .code_num.number {
    margin-top: -12px;
  }
  .title {
    padding-top: 20px;
  }
}
.content_td,
.remark_td {
  display: flex;
  width: 100%;
  min-height: 55px;
  align-items: center;
}
.record_table {
  border-collapse: collapse;
  margin-top: -38px;
  td {
    padding: 0;
    border: 1px solid #ddd;
    &.td_center {
      text-align: center;
    }
    &.no_border {
      padding-top: 8px;
      padding-bottom: 0;
    }
  }
  .no_border {
    border: none;
    span,
    .van-field {
      vertical-align: middle;
    }
    .van-field {
      height: 20px;
      display: inline-block;
      width: 100px;
    }
  }
}
.check_type_label {
  float: left;
  width: 60px;
}
.check_type_content {
  width: calc(100% - 60px);
}
.full_field {
  width: 100%;
  height: 100%;
  font-size: 10px;
}
</style>
