<template>
  <div class="doctopdf">
    <div class="print-head"></div>
    <div class="fir-page">
      <div class="report-title">北京美中爱瑞肿瘤医院</div>
      <div class="report-type">放射治疗单</div>
      <div class="patient-info" style="page-break-after: always">
        <el-row class="pat-base-info">
          <el-col :span="8" class="info-item">
            <span class="info-title">患者ID：</span>
            <span class="info-text">{{ userInfo.healthCardNo }}</span>
          </el-col>
          <el-col :span="8" class="info-item">
            <span class="info-title">姓名：</span>
            <span class="info-text">{{ userInfo.patientName }}</span>
          </el-col>
          <el-col :span="8" class="info-item">
            <span class="info-title">性别：</span>
            <span class="info-text">{{ userInfo.gender }}</span>
          </el-col>
        </el-row>
        <el-row class="pat-base-info">
          <el-col :span="10" class="info-item">
            <span class="info-title">年龄：</span>
            <span class="info-text">{{ userInfo.age }}岁</span>
          </el-col>
          <el-col :span="14" class="info-item">
            <span class="info-title">出生日期：</span>
            <span class="info-text">{{ userInfo.birthday }}</span>
          </el-col>
        </el-row>
        <el-row class="pat-base-info">
          <el-col :span="24" class="info-item">
            <span class="info-title">住院病区：</span>
            <span class="info-text" style="width:88%">{{ userInfo.hospitalWard }}</span>
          </el-col>
        </el-row>
        <el-row class="pat-base-info">
          <el-col :span="24" class="info-item">
            <span class="info-title">住院日期：</span>
            <span class="info-text" style="width:88%">{{ radiationInDate }}</span>
          </el-col>
        </el-row>
        <el-row class="pat-base-info">
          <el-col :span="24" class="info-item">
            <span class="info-title">付费类别：</span>
            <span class="info-text" style="width:88%">{{ userInfo.payCategory }}</span>
          </el-col>
        </el-row>
        <el-row class="pat-base-info">
          <el-col :span="24" class="info-item">
            <span class="info-title">临床诊断：</span>
            <span class="info-text" style="width:88%">{{ radiotherapyOrder.clinicalDiagnose }}</span>
          </el-col>
        </el-row>
        <el-row class="pat-base-info">
          <el-col :span="24" class="info-item">
            <span class="info-title">病理诊断：</span>
            <span class="info-text" style="width:88%">{{ radiotherapyOrder.pathologicalDiagnose }}</span>
          </el-col>
        </el-row>
        <el-row class="pat-base-info">
          <el-col :span="24" class="info-item">
            <span class="info-title">治疗开始日期：</span>
            <span class="info-text" style="width:84%">{{ radiotherapyOrder.startDate }}</span>
          </el-col>
        </el-row>
        <el-row class="pat-base-info">
          <el-col :span="24" class="info-item">
            <span class="info-title">放疗号：</span>
            <span class="info-text" style="width:90%">{{
              radiotherapyOrder.radiotherapyNumber
            }}</span>
          </el-col>
        </el-row>
      </div>
      <div class="patient-info1" style="page-break-after: always">
        <div class="cell1"
          style="border-left: 1px solid #000;
          border-right: 1px solid #000;
          border-top: 1px solid #000;">
          <div
            style="
              padding: 10px 0;
              padding-left: 4px;
              font-size: 12px;
            "
          >
            靶区总剂量Gy,分次剂量Gy,分次次数,分次方式次/周
          </div>
        </div>
        <table border="0" cellpadding="5" cellspacing="1" width="100%" style="border:1px solid #333;">
          <tr>
            <th width="160">靶区</th>
            <th>描述</th>
            <th width="100">处方总剂量/Gy</th>
            <th width="80">平均剂量/Gy</th>
            <th width="80">靶区体积/cc</th>
          </tr>
          <tr v-for="(treatPlan, index) in subTDList" :key="index">
            <td>{{ treatPlan.target }}</td>
            <td>{{ treatPlan.describes }}</td>
            <td>{{ treatPlan.totalDose }}</td>
            <td>{{ treatPlan.averageDose }}</td>
            <td>{{ treatPlan.targetVolume }}</td>
          </tr>
        </table>
        <div class="cell1" 
         style="border-left: 1px solid #000;
          border-right: 1px solid #000;">
          <div style="padding: 10px 0; padding-left: 4px; font-size: 12px">
            照射野信息
          </div>
        </div>
         <table border="0" cellpadding="5" cellspacing="1" width="100%" style="border:1px solid #333;">
          <tr>
            <th width="100">旋转弧/固定野</th>
            <th width="60">能量</th>
            <th >起始角/机架角度</th>
            <th width="60">床角</th>
            <th width="60">小机头角</th>
            <th width="120">射野大小 CM*CM</th>
            <th width="70">机器跳数 MU</th>
          </tr>
          <tr v-for="(treatPlan, index) in subEFInfoList" :key="index">
            <td>{{ treatPlan.rotatingArcFixedWild }}</td>
            <td>{{ treatPlan.energy }}</td>
            <td>{{ treatPlan.startRackAngle }}</td>
            <td>{{ treatPlan.bedCouch }}</td>
            <td>{{ treatPlan.smallNoseAngle }}</td>
            <td>{{ treatPlan.beamSize }}</td>
            <td>{{ treatPlan.machineHop }}</td>
          </tr>
        </table>
        <div class="cell1" style="border-left: 1px solid #000;
          border-right: 1px solid #000; border-bottom: 1px solid #000;">
          <div style="padding: 10px 0; padding-left: 4px; font-size: 12px">
            图像验证频率:
          </div>
          <div
            style="
              font-size: 12px;
              padding-left: 5px;
              line-height: 14px;
              border-right: none;
              flex: 1;
              box-sizing: border-box;
              text-align: left;
            "
            class="section-con"
          >
            <el-radio-group
              v-model="radiotherapyOrder.imageVerificationFrequency"
              disabled 
            >
              <el-radio :label="0"
                ><span style="font-size: 12px; color: #000; font-weight: normal"
                  >每天一次</span
                >
              </el-radio>
              <el-radio :label="1"
                ><span style="font-size: 12px; color: #000; font-weight: normal"
                  >每周一次</span
                ></el-radio
              >
              <el-radio :label="2"
                ><span style="font-size: 12px; color: #000; font-weight: normal"
                  >连续五次每周一次</span
                ></el-radio
              >
              <el-radio :label="3"
                ><span style="font-size: 12px; color: #000; font-weight: normal"
                  >连续三次后每周一次</span
                ></el-radio
              >
              <el-radio :label="4"
                ><span style="font-size: 12px; color: #000; font-weight: normal"
                  >无</span
                ></el-radio
              >
            </el-radio-group>
          </div>
        </div>
        <div class="cell1" 
          style="border-left: 1px solid #000;
          border-right: 1px solid #000; border-bottom: 1px solid #000;">
          <div style="padding: 10px 0; padding-left: 4px; font-size: 12px;width: 100%;">
            <div style="font-size: 12px; padding-left: 4px">放射部位图像</div>
            <div
              style="
                padding: 3px 0;
                padding-left: 4px;
                font-size: 12px;
                min-height: 500px;
              "
            >
              <ul class="imgList" v-if="curImgs[0] != ''">
                <li
                  v-for="(img, index) in curImgs"
                  :key="'cur' + index"
                  class="img-box"
                  style="height: 100px"
                >
                  <el-image :src="img"></el-image>
                </li>
              </ul>
            </div>
          </div>
        </div>
        <div class="cell" style="border-left: 1px solid #000;
          border-right: 1px solid #000; border-bottom: 1px solid #000;">
          <div
            style="
              display: flex;
              padding: 10px 0;
              font-size: 12px;
              justify-content: space-around;
            "
          >
            <div
              class="sign-date"
              style="
                flex: 1;
                display: flex;
                flex-direction: column;
                padding-left: 80px;
              "
            >
              <div class="sign"></div>
              <span
                style="
                  display: inline-block;
                  position: relative;
                  height: 30px;
                  line-height: 30px;
                "
                ><span style="display: inline-block; vertical-align: top"
                  >医生签名:</span
                >
                <span style="display: inline-block;" >
                  <!-- <el-image
                    :src="doctorSignature"
                    placeholder
                    v-if="doctorSignature"
                    style="display: inline-block;"
                  >
                    <div
                      slot="error"
                      class="image-slot"
                    ></div> </el-image> -->
                     <img :src="doctorSignature"  v-if="doctorSignature" style="display: inline-block;width:80px;height:30px;"  slot="error"/>
                    </span
              ></span>
              <span
                >签字日期:
                <span style="margin-left: 7px">{{
                  doctorSignatureTime
                }}</span></span
              >
            </div>
            <div
              class="sign-date"
              style="
                flex: 1;
                display: flex;
                flex-direction: column;
                padding-left: 80px;
              "
            >
              <span
                style="
                  display: inline-block;
                  position: relative;
                  height: 30px;
                  line-height: 30px;
                "
                ><span style="display: inline-block; vertical-align: top"
                  >物理师签名:</span
                >
                <span style="display: inline-block">
                <!-- <el-image
                    :src="physicsTeacherSignature"
                    placeholder
                    v-if="physicsTeacherSignature"
                    style="display: inline-block"
                  >
                    <div slot="error" class="image-slot"></div> </el-image> -->
                     <img :src="physicsTeacherSignature"  v-if="physicsTeacherSignature" style="display: inline-block;width:80px;height:30px;"  slot="error"/>
                  </span>
              </span>
              <span
                >签字日期:<span style="margin-left: 25px">{{
                  physicsTeacherSignatureTime
                }}</span></span
              >
            </div>
          </div>
        </div>
      </div>
      <div
        class="patient-info"
        style="page-break-after: always; margin-top: 15px"
      >
        <!-- <div class="cell1">
          <div style="padding: 10px 0;padding-left:4px;font-size:12px;">放疗记录</div>
        </div> -->
        <div
          class="imageVerify"
          style="
            border-left: 1px solid #000;
            border-top: 1px solid #000;
            display: flex;
          "
        >
          <div
            class="image-item"
            style="width: 100%"
            v-for="(siteList, index) in subSiteTRList"
            :key="'site' + index"
          >
            <div
              class="title-con"
              style="border-bottom: 1px solid #000; display: table; width: 100%"
            >
              <div
                class="sub-title-con"
                style=" width: 100%"
              >
                <div
                  class="item-text"
                  style="
                    width: 100%;
                    padding: 10px 5px;
                    border-right: 1px solid #000;
                    border-bottom: 1px solid #000;
                    font-size: 12px;
                  "
                >
                  部位:{{ siteList.part }}
                </div>
               
              </div>
              <div
                class="sub-title-con"
                style="display: flex; flex-wrap: wrap; width: 100%"
              >
                 <div
                  class="item-text"
                  style="
                    width: 169.5px;
                    padding: 10px 5px;
                    border-right: 1px solid #000;
                    font-size: 12px;
                  "
                >
                  计划:{{ siteList.plan }}
                </div>
                <div
                  class="item-text"
                  style="
                    width: 170px;
                    padding: 10px 5px;
                    border-right: 1px solid #000;
                    font-size: 12px;
                  "
                >
                  射线MV:{{ siteList.ray }}
                </div>
                <div
                  class="item-text"
                  style="
                     width: 169.5px;
                    padding: 10px 5px;
                    font-size: 12px;
                    border-right: 1px solid #000;
                  "
                >
                  总量Gy:{{ siteList.quantum }}
                </div>
                 <div
                  class="item-text"
                  style="
                     width: 170px;
                    padding: 10px 5px;
                    font-size: 12px;
                    border-right: 1px solid #000;
                  "
                >
                  单次量Gy:{{ siteList.singleVolume }}
                </div>
              </div>
            </div>
            <p
              style="
                border-bottom: 1px solid #333;
                width: 100%;
                margin: 0;
                border-right: 1px solid #333;
                display: table;
                box-sizing: border-box;
              "
            >
              <span
                style="
                  display: table-cell;
                  width: 16%;
                  border-right: 1px solid #333;
                  padding: 10px 4px 10px 4px;
                  padding: 10px 5px;
                  font-size: 12px;
                "
                >日期</span
              >
               <span
                style="
                  display: table-cell;
                  width: 16%;
                  border-right: 1px solid #333;
                  padding: 10px 4px 10px 4px;
                  padding: 10px 5px;
                  font-size: 12px;
                "
                >备注</span
              >
              <span
                style="
                  display: table-cell;
                  width: 16%;
                  border-right: 1px solid #333;
                  padding: 10px 4px 10px 4px;
                  padding: 10px 5px;
                  font-size: 12px;
                "
                >机器(MU)</span
              >
              <span
                style="
                  display: table-cell;
                  width: 16%;
                  border-right: 1px solid #333;
                  padding: 10px 4px 10px 4px;
                  padding: 10px 5px;
                  font-size: 12px;
                "
                >单次量(Gy)</span
              >
              <span
                style="
                  display: table-cell;
                  flex: 1;
                   width: 16%;
                  padding: 10px 4px 10px 4px;
                  padding: 10px 5px;
                  font-size: 12px;
                  border-right: 1px solid #333;
                "
                >治疗师1</span
              >
               <span
                style="
                  display: table-cell;
                  flex: 1;
                   width: 16%;
                  padding: 10px 4px 10px 4px;
                  padding: 10px 5px;
                  font-size: 12px;
                "
                >治疗师2</span
              >
            </p>
            <p
              style="
                border-bottom: 1px solid #333;
                width: 100%;
                margin: 0;
                border-right: 1px solid #333;
                display: table;
                box-sizing: border-box;
              "
              v-for="(
                treatDetailst, index
              ) in siteList.treatmentRecordsDetailList"
              :key="index"
            >
              <span
                style="
                  display: table-cell;
                  width: 16%;
                  border-right: 1px solid #333;
                  height: 34px;
                  line-height: 34px;
                "
                >{{ treatDetailst.treatmentDate }}</span
              >
                <span
                style="
                  display: table-cell;
                  width: 16%;
                  border-right: 1px solid #333;
                  height: 34px;
                  line-height: 34px;
                "
                >{{ treatDetailst.remarks }}</span
              >
              <span
                style="
                  display: table-cell;
                  width: 16%;
                  border-right: 1px solid #333;
                  height: 34px;
                  line-height: 34px;
                "
                >{{ treatDetailst.machine }}</span
              >
              <span
                style="
                  display: table-cell;
                  width: 16%;
                  border-right: 1px solid #333;
                  height: 34px;
                  line-height: 34px;
                "
                >{{ treatDetailst.singleDose }}</span
              >
              <span
                style="
                  display: table-cell;
                  flex: 1;
                  width: 16%;
                  border-right: 1px solid #333;
                  height: 34px;
                  line-height: 34px;
                  text-align: center;
                "
              >
                <img
                  style="
                    vertical-align: middle;
                    height: 30px;
                     line-heighr:30px;
                    width: 50px;
                  "
                  v-if="treatDetailst.therapist"
                  :src="treatDetailst.therapist"
                  alt=""
                  srcset=""
                />
              </span>
              <span
                style="
                  display: table-cell;
                  flex: 1;
                  width: 16%;
                  height: 34px;
                  line-height: 34px;
                  text-align: center;
                "
              >
                <img
                  style="
                    vertical-align: middle;
                    height: 30px;
                     line-heighr:30px;
                    width: 50px;
                  "
                  v-if="treatDetailst.therapisttwo"
                  :src="treatDetailst.therapisttwo"
                  alt=""
                  srcset=""
                />
              </span>
            </p>
          </div>
        </div>
      </div>

      <div
        class="patient-info"
        style="page-break-after: always; margin-top: 5px"
      >
        <div style="display: table; border: 1px solid #000; width: 100%">
          <div
            style="
              display: table-cell;
              border-right: 1px solid #000;
              padding: 0;
              padding-left: 5px;
              font-size: 12px;
              height: 48px;
              line-height: 48px;
              width: 9%;
              box-sizing: border-box;
            "
          >
            日期
          </div>
          <div
            style="
              display: table-cell;
              border-right: 1px solid #000;
              padding: 10px 0;
              padding-left: 5px;
              font-size: 12px;
              line-height: 14px;
              width: 7.5%;
              box-sizing: border-box;
            "
          >
            分次数
          </div>
          <div
            style="
              display: table-cell;
              border-right: 1px solid #000;
              padding: 10px 0;
              padding-left: 5px;
              font-size: 12px;
              line-height: 14px;
              width: 7.5%;
              box-sizing: border-box;
            "
          >
            配准
          </div>
          <div
            style="
              display: table-cell;
              border-right: 1px solid #000;
              padding: 10px 0;
              padding-left: 5px;
              font-size: 12px;
              line-height: 14px;
              width: 7.5%;
              box-sizing: border-box;
            "
          >
            左右x(mm)
          </div>
          <div
            style="
              display: table-cell;
              border-right: 1px solid #000;
              padding: 10px 0;
              padding-left: 5px;
              font-size: 12px;
              line-height: 14px;
              width: 7.5%;
              box-sizing: border-box;
            "
          >
            纵向Y(mm)
          </div>
          <div
            style="
              display: table-cell;
              border-right: 1px solid #000;
              padding: 10px 0;
              padding-left: 5px;
              font-size: 12px;
              line-height: 14px;
              width: 7.5%;
              box-sizing: border-box;
            "
          >
            垂直Z(mm)
          </div>
          <div
            style="
              display: table-cell;
              border-right: 1px solid #000;
              padding: 10px 0;
              padding-left: 5px;
              font-size: 12px;
              line-height: 14px;
              width: 7.5%;
              box-sizing: border-box;
            "
          >
            Pitch（°）
          </div>
          <div
            style="
              display: table-cell;
              border-right: 1px solid #000;
              padding: 10px 0;
              padding-left: 5px;
              font-size: 12px;
              line-height: 14px;
              width: 7.5%;
              box-sizing: border-box;
            "
          >
            Roll（°）
          </div>
          <div
            style="
              display: table-cell;
              border-right: 1px solid #000;
              padding: 10px 0;
              padding-left: 5px;
              font-size: 12px;
              line-height: 14px;
              width: 7.5%;
              box-sizing: border-box;
            "
          >
             Rotation（°）
          </div>


          <div
            style="
              display: table-cell;
              border-right: 1px solid #000;
              padding: 10px 0;
              padding-left: 5px;
              font-size: 12px;
              line-height: 14px;
              width: 11%;
              box-sizing: border-box;
            "
          >
            医生
          </div>
          <div
            style="
             display: table-cell;
              border-right: 1px solid #000;
              padding: 10px 0;
              padding-left: 5px;
              font-size: 12px;
              line-height: 14px;
              width: 11%;
              box-sizing: border-box;
            "
          >
            治疗师1
          </div>
            <div
            style="
            display: table-cell;
              padding: 10px 0;
              padding-left: 5px;
              font-size: 12px;
              line-height: 14px;
              width: 11%;
            "
          >
            治疗师2
          </div>
        </div>
        <div
          v-for="(treatPlan, index) in subImgVRList"
          :key="index"
          style="
            display: table;
            border: 1px solid #333;
            width: 100%;
            border-top: none;
          "
        >
          <div
            style="
              display: table-cell;
              border-right: 1px solid #000;
              height: 34px;
              line-height: 34px;
              padding-left: 5px;
              font-size: 12px;
              line-height: 14px;
              width: 9%;
              box-sizing: border-box;
            "
          >
            {{ treatPlan.imageVerificationDate }}
          </div>
          <div
            style="
              display: table-cell;
              border-right: 1px solid #000;
              height: 34px;
              line-height: 34px;
              padding-left: 5px;
              font-size: 12px;
              line-height: 14px;
              width: 7.5%;
              box-sizing: border-box;
            "
          >
            {{ treatPlan.numberPoints }}
          </div>
          <div
            style="
              display: table-cell;
              border-right: 1px solid #000;
              height: 34px;
              line-height: 34px;
              padding-left: 5px;
              font-size: 12px;
              line-height: 14px;
              width: 7.5%;
              box-sizing: border-box;
            "
          >
            {{ treatPlan.registration }}
          </div>
          <div
            style="
              display: table-cell;
              border-right: 1px solid #000;
              height: 34px;
              line-height: 34px;
              padding-left: 5px;
              font-size: 12px;
              line-height: 14px;
              width: 7.5%;
              box-sizing: border-box;
            "
          >
            {{ treatPlan.aroundX }}
          </div>
          <div
            style="
              display: table-cell;
              border-right: 1px solid #000;
              height: 34px;
              line-height: 34px;
              padding-left: 5px;
              font-size: 12px;
              line-height: 14px;
              width: 7.5%;
              box-sizing: border-box;
            "
          >
            {{ treatPlan.lengthwayY }}
          </div>
          <div
            style="
              display: table-cell;
              border-right: 1px solid #000;
              height: 34px;
              line-height: 34px;
              padding-left: 5px;
              font-size: 12px;
              line-height: 14px;
              width: 7.5%;
              box-sizing: border-box;
            "
          >
            {{ treatPlan.verticalZ }}
          </div>

           <div
            style="
              display: table-cell;
              border-right: 1px solid #000;
              height: 34px;
              line-height: 34px;
              padding-left: 5px;
              font-size: 12px;
              line-height: 14px;
              width: 7.5%;
              box-sizing: border-box;
            "
          >
            {{ treatPlan.pitchDirect }}
          </div>
           <div
            style="
              display: table-cell;
              border-right: 1px solid #000;
              height: 34px;
              line-height: 34px;
              padding-left: 5px;
              font-size: 12px;
              line-height: 14px;
              width: 7.5%;
              box-sizing: border-box;
            "
          >
            {{ treatPlan.rollDirect }}
          </div>
           <div
            style="
              display: table-cell;
              border-right: 1px solid #000;
              height: 34px;
              line-height: 34px;
              padding-left: 5px;
              font-size: 12px;
              line-height: 14px;
              width: 7.5%;
              box-sizing: border-box;
            "
          >
            {{ treatPlan.rotationDirect }}
          </div>

          <div
            style="
              display: table-cell;
              border-right: 1px solid #000;
              height: 34px;
              font-size: 12px;
              line-height: 34px;
              width: 11%;
              box-sizing: border-box;
              text-align: center;
            "
          >
            <img
              style="
                vertical-align: middle;
                height: auto;
                width: 100%;
                margin-top: 8px;
              "
              v-if="treatPlan.doctorSignature"
              :src="treatPlan.doctorSignature"
              alt=""
              srcset=""
            />
            <span
              v-else
              style="
                display: inline-block;
                vertical-align: middle;
                height: 20px;
                 width: 100%;
                margin-top: 8px;
              "
            ></span>
          </div>
          <div
            style="
             display: table-cell;
              border-right: 1px solid #000;
              height: 34px;
              line-height: 34px;
              font-size: 12px;
              width: 11%;
              box-sizing: border-box;
              text-align: center;
            "
          >
            <img
              style="
                vertical-align: middle;
                height: auto;
                width: 100%;
                margin-top: 8px;
              "
              v-if="treatPlan.therapistSignature"
              :src="treatPlan.therapistSignature"
              alt=""
              srcset=""
            />
            <span
              v-else
              style="
                display: inline-block;
                vertical-align: middle;
                height: 20px;
                width: 100%;
                margin-top: 8px;
              "
            ></span>
          </div>
          <div
            style="
             display: table-cell;
              height: 34px;
              line-height: 34px;
              font-size: 12px;
              width: 11%;
              box-sizing: border-box;
              text-align: center;
            "
          >
            <img
              style="
                vertical-align: middle;
                height: auto;
                width:100%;
                margin-top: 8px;
              "
              v-if="treatPlan.therapistSignaturetwo"
              :src="treatPlan.therapistSignaturetwo"
              alt=""
              srcset=""
            />
            <span
              v-else
              style="
                display: inline-block;
                vertical-align: middle;
                height: 20px;
                width: 100%;
                margin-top: 8px;
              "
            ></span>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import moment from "moment";
import { cloneDeep } from "lodash";

export default {
  props: [
    "TDList",
    "EFInfoList",
    "imgList",
    "curImgs",
    "imgVRList",
    "siteTRList",
    "doctorSignature",
    "doctorSignatureTime",
    "physicsTeacherSignature",
    "physicsTeacherSignatureTime",
    "userInfo",
    "radiotherapyOrder",
    "radiationInDate"
  ],
  data() {
    return {
      checkList: [],
      subTDList: [],
      subEFInfoList: [],
      subSiteTRList: [],
      subImgVRList: [],
    };
  },
  watch: {
    // 靶区总剂量Gy,分次剂量Gy,分次次数,分次方式次/周
    TDList: {
      handler(val) {
        this.subTDList = this.setList(val, 4, {});
      },
      deep: true,
      immediate: true,
    },
    // 照射野信息
    EFInfoList: {
      handler(val) {
        this.subEFInfoList = this.setList(val, 5, {});
      },
      deep: true,
      immediate: true,
    },
    // 照射野信息
    imgVRList: {
      handler(val) {
        this.subImgVRList = this.setList(val, 5, {});
      },
      deep: true,
      immediate: true,
    },
    // 放疗记录
    siteTRList: {
      handler(val) {
        // let num = this.siteTRList ? this.returnNum(this.siteTRList.length) : 2
        // let list = this.setList(val, num, {
        //   part: "",
        //   plan: "",
        //   ray: "",
        //   quantum: "",
        //   treatmentRecordsDetailList: [],
        // });
       if(val){
          this.subSiteTRList = this.siteTRList.map((item) => {
          return {
            ...item,
            treatmentRecordsDetailList: this.setList(
              item.treatmentRecordsDetailList,
              9,
              {}
            ),
          };
        });
       }
      },
      deep: true,
      immediate: true,
    },
  },
  filters: {
    calcBirthday(val) {
      let date1 = new Date(val);
      return val ? moment(date1).format("YYYY-MM-DD") : "";
    },
  },
  created() {
    this.$nextTick(() => {
      this.subTDList = this.setList(this.TDList, 4, {});
      this.subEFInfoList = this.setList(this.EFInfoList, 5, {});
      this.subImgVRList = this.setList(this.imgVRList, 5, {});
      // 设置部位
      // console.log(this.siteTRList);
      // let num = this.siteTRList ? this.returnNum(this.siteTRList.length) : 1
      // let list = this.setList(this.siteTRList, num, {
      //   part: "",
      //   plan: "",
      //   ray: "",
      //   quantum: "",
      //   treatmentRecordsDetailList: [],
      // });
      this.subSiteTRList = this.siteTRList.map((item) => {
        return {
          ...item,
          treatmentRecordsDetailList: this.setList(
            item.treatmentRecordsDetailList,
            9,
            {}
          ),
        };
      });
    });
  },
  methods: {
    returnNum (len) {
      let num = 0;
      if(!len) {
        num = 2
      } else if(len%2 === 0) {
        num = len
      } else {
        num = len + 1
      }
      return num
    },
    setList(startList, limitNo, info) {
      let reList = [];
      if (startList && startList.length > limitNo) {
        reList = cloneDeep(startList);
      } else if (startList) {
        let len = startList.length;
        let num = limitNo - len;
        let list = cloneDeep(startList);
        for (let i = 0; i < num; i++) {
          list.push(info);
        }
        reList = list;
      }
      return reList;
    },
  },
};
</script>

<style lang="less" scoped>
.section-con {
  /deep/ .el-radio__input.is-checked .el-radio__inner {
    background: transparent;
    border-color: #d9d9d9;
  }

  .is-checked /deep/ .el-radio__inner::after {
    border-radius: 0;
    background: transparent;
    box-sizing: content-box;
    content: "";
    border-right: 1px solid #333;
    border-bottom: 1px solid #333;
    border-left: 0;
    border-top: 0;
    height: 15px;
    left: 6px;
    position: absolute;
    top: -6px;
    width: 5px;
    transform: rotate(45deg);
  }
  .is-checked /deep/ .el-radio__label {
    color: #d9d9d9;
  }
}

.cell {
  .el-image {
    width: 108px;
    height: 25px;
    margin-left: 12px;
    border: 1px solid #eeeeee;
    border-radius: 4px;
    background: #f6f9ff;
  }
  /deep/.el-image__inner{
    width: auto;
  }
}

.doctopdf {
  background-color: #ffffff;
  display: flex;
  flex-direction: column;
  font-family: "SimSun";
  padding: 0 20px 40px 20px;
  margin: 0 auto;
  padding: 0 1.5cm;
  width: 21cm;
  min-height: 28cm;
  box-sizing: border-box;
  .fir-page .diagose-bodys-con {
    padding: 0 10px;
  }
  .print-head,
  .print-footer {
    height: 60px;
  }
  .diagose-bodys-con {
    flex: 1;
  }
  .report-title,
  .report-type {
    font-size: 20px;
    margin-top: 50px;
    color: #000;
    font-weight: bold;
    text-align: center;
    margin-bottom: 15px;
  }
  .report-type {
    margin-bottom: 100px;
  }
  .pathology-number {
    text-align: right;
    line-height: 20px;
    span {
      display: inline-block;
      font-size: 14px;
      color: #000;
    }
    .pathology-code {
      min-width: 20px;
    }
  }
  .patient-info {
    // border-top: 1px solid #333;
    .info-item {
      height: 60px;
      font-size: 14px;
      color: #333;
      .info-title{
        display: inline-block;
      }
      /deep/.el-checkbox__inner {
        border: 1px solid #333;
      }
      /deep/ .el-checkbox__label {
        color: #333;
      }
      .info-text {
        width: 70%;
        display: inline-block;
        border-bottom: 1px solid #666;
      }
    }
  }
  .patient-info {
    .imageVerify {
      display: flex;
      flex-wrap: wrap;
      .title-con:nth-of-type(2n) {
        border-left: none;
      }
    }
  }
  .patient-info1 {
    .imageVerify {
      display: flex;
      flex-wrap: wrap;
      .title-con {
      }
      .image-item {
        width: 50%;
        display: flex;
        flex-wrap: wrap;
        .item-text {
          width: 50%;
          padding: 10px 0;
          padding-left: 4px;
          border-bottom: 1px solid #666;
          border-right: 1px solid #666;
        }
        // .p-text span:last-child {
        //   border-right:1px solid red;
        // }
      }
    }
    table {
      border-collapse:collapse;
      border:none;
      // border-top: 1px solid #000;
      // border-left: 1px solid #000;
      tr {
        min-height: 46px;
      }
      td,th {
        padding: 0 5px;
        height: 25px;
      }
      td,th {
        border:solid #000 1px;
        font-size: 12px;
        color: #333;
        font-family: "SimSun";
      }
    }
    // border: 1px solid #000;
    font-size: 12px;
    > div {
      // border-bottom: 1px solid #000;
    }
    > div:last-child {
      border-bottom: 0px;
    }
    .fir-title {
      text-align: center;
      font-size: 16px;
    }
    .sec-title {
      padding: 4px;
      font-size: 14px;
      font-weight: 600;
    }
    p {
      padding-left: 4px;
    }
    .cell {
      p {
        border-right: 1px solid #000;
        text-align: left;
        padding-left: 4px;
        box-sizing: border-box;
        // flex: 1;
      }
      p:last-child {
        border-right: 0px;
        justify-content: space-around;
      }
    }
    .cell1 {
      display: flex;
      align-items: center;
      box-sizing: border-box;
      div {
        color: #333;
      }
      .imgList {
        display: flex;
        height: 100%;
        flex-wrap: wrap;
        .img-box {
          display: flex;
          width: 98px;
          opacity: 1;
          background: #ffffff;
          border: 1px solid #d4dff1;
          margin-right: 20px;
          border-radius: 5px;
          text-align: center;
          overflow: hidden;
          margin-bottom: 10px;
          position: relative;
        }
      }

      p {
        text-align: left;
        padding-left: 4px;
        box-sizing: border-box;
        // flex: 1;
      }
      p:last-child {
        border-right: 0px;
      }
    }
    .cell1:last-child {
      border-bottom: 0px;
    }
    .cell4 {
      display: flex;
      div {
        border-right: 1px solid #000;
        text-align: left;
        padding: 2px 0;
        padding-left: 4px;
        box-sizing: border-box;
        flex: 1;
      }
      div:last-child {
        border-right: 0px;
      }
    }
    .cell2 {
      display: flex;
      div {
        border-right: 1px solid #000;
        text-align: left;
        width: 30%;
        padding: 2px 0;
        padding-left: 4px;
      }
      div:last-child {
        border-right: 0px;
      }
    }
    .cell3 {
      display: flex;
      div {
        border-right: 1px solid #000;
        text-align: left;
        width: 33%;
        padding: 2px 0;
        padding-left: 4px;
        box-sizing: border-box;
      }
      div:last-child {
        border-right: 0px;
      }
    }
    .else-title {
      text-align: center;
      font-size: 14px;
      font-weight: 600;
      padding: 4px 0;
    }
    .to-patient {
      p {
        text-align: justify;
        margin: 4px 2px;
        font-weight: 300;
      }
    }
  }
  .diogose-con {
    // border-top: 1px solid #333;
    // border-bottom: 1px solid #333;
    .diagnosis-itme {
      line-height: 50px;
      font-size: 14px;
      color: #000;
    }
  }
  .diagose-bodys-con {
    display: flex;
    flex-direction: column;
    .item-con {
      flex: 1;
    }
    span {
      line-height: 30px;
      font-size: 14px;
      color: #000;
    }
    .sampling-Info {
      line-height: 25px;
      font-size: 14px;
      color: #000;
      white-space: pre-wrap;
    }
    .diagose-Info {
      line-height: 25px;
      font-size: 14px;
      color: #000;
      white-space: pre-wrap;
    }
  }
  .print-footer {
    border-top: 1px solid #333;
    .print-footer-remark {
      line-height: 20px;
      text-align: center;
      font-size: 12px;
      color: #ccc;
    }
  }
}
</style>
