Vue_New/src/xt_pages/workforce/remind_print.vue

<template>
  <div class="main-contain">
    <div class="position">
      <bread-crumb :crumbs="crumbs"></bread-crumb>
      <el-row style="float:right;">
        <el-col :span="24">
          <el-button
            size="small"
            icon="el-icon-printer"
            type="primary"
            @click="printAction"
            >打印</el-button
          >
        </el-col>
      </el-row>
    </div>
    <div class="app-container" style="background-color: white;">
      <div id="print_content">
        <div class="print_main_content">
          <div class="order_title_panl">
            <span class="main_title">{{day}}排班提醒（{{ currentDate }}）</span>
          </div>
          <div class="table_panel">
            <table class="table">
              <thead>
                <tr>
                  <td width="60">序号</td>
                  <td width="60" v-if="printObj.week == 1">星期</td>
                  <td width="70" v-if="printObj.name == 1">姓名</td>
                  <td width="100" v-if="printObj.zone == 1">分区</td>
                  <td width="60" v-if="printObj.classes == 1">班次</td>
                  <td width="100" v-if="printObj.number == 1">机号</td>
                  <td width="50" v-if="printObj.mode == 1">透析模式</td>
                  <td width="100" v-if="printObj.dialyzers == 1 && printObj.perfusion_apparatus == 1">透析器/灌流器</td>
                  <td width="100" v-if="printObj.anticoagulant==1">抗凝剂(商品名称)</td>
                  <td width="30" v-if="printObj.anticoagulant_zongliang == 1">首剂</td>
                  <td width="30" v-if="printObj.anticoagulant_zongliang == 1">维持</td>
                  <td width="30" v-if="printObj.anticoagulant_zongliang == 1">总量</td>
                  <td width="">血管通路</td>
                  <td width="" v-if="org_id == 0 || org_id ==10567">管路</td>
                  <td width="300" v-if="printObj.doctor_advice == 1">长期医嘱</td>
                </tr>
              </thead>
              <tbody>
              <tr v-for="(main_collection, index) in scheduleData" :key="index">
                <td >{{index + 1}}</td>
                <td  v-if="printObj.week == 1">
                  <span v-if="main_collection.schedule_week == 0">周日</span>
                  <span v-if="main_collection.schedule_week == 1">周一</span>
                  <span v-if="main_collection.schedule_week == 2">周二</span>
                  <span v-if="main_collection.schedule_week == 3">周三</span>
                  <span v-if="main_collection.schedule_week == 4">周四</span>
                  <span v-if="main_collection.schedule_week == 5">周五</span>
                  <span v-if="main_collection.schedule_week == 6">周六</span>
                </td>
                <td  v-if="printObj.name == 1">{{ main_collection.patient.name}}</td>
                <td  v-if="printObj.zone == 1">{{ main_collection.zone.name }}({{ getType(main_collection.partition_id)  }})</td>
                <td v-if="printObj.classes == 1">
                  {{getSchedulesType(main_collection.schedule_type)}}
                </td>
                <td v-if="printObj.number == 1">
                  {{main_collection.number.number}}
                </td>
                <td v-if="printObj.mode == 1">
                  {{modeOptions[main_collection.mode_id].name}}
                </td>

                <td v-if="printObj.dialyzers == 1 && printObj.perfusion_apparatus ==1">
                 
                  <span v-if="main_collection.prescription.dialysis_dialyszers == ''">{{main_collection.dialysissolution.dialysis_dialyszers}}</span>
                  <span v-if="main_collection.prescription.dialysis_dialyszers != ''">{{main_collection.prescription.dialysis_dialyszers}}</span>

                  <span v-if="main_collection.prescription.dialyzer_perfusion_apparatus == ''">{{main_collection.dialysissolution.dialyzer_perfusion_apparatus}}</span>
                  <span v-if="main_collection.prescription.dialyzer_perfusion_apparatus != ''">{{main_collection.prescription.dialyzer_perfusion_apparatus}}</span>

                  <span v-if="main_collection.prescription.dialysis_irrigation == ''">/{{main_collection.dialysissolution.dialysis_irrigation}}</span>
                  <span v-if="main_collection.prescription.dialysis_irrigation != ''">/{{main_collection.prescription.dialysis_irrigation}}</span>
                </td>
                <td v-if="printObj.anticoagulant == 1">
                  {{ main_collection.dialysissolution.anticoagulant ? anticoagulants_confit[main_collection.dialysissolution.anticoagulant].name : ''}}
                  <span v-if="main_collection.prescription.antioxidant_commodity_name!=''">
                    (<span>{{main_collection.prescription.antioxidant_commodity_name}}</span>)
                  </span>
                </td>
                <td v-if="printObj.anticoagulant_zongliang == 1">
                  <span v-if="main_collection.dialysissolution.anticoagulant == 1">{{main_collection.dialysissolution.anticoagulant_shouji?main_collection.dialysissolution.anticoagulant_shouji+'mg':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 2">{{main_collection.dialysissolution.anticoagulant_shouji?main_collection.dialysissolution.anticoagulant_shouji+'iu':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 3">{{main_collection.dialysissolution.anticoagulant_shouji?main_collection.dialysissolution.anticoagulant_shouji+'iu':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 4">{{main_collection.dialysissolution.anticoagulant_shouji?main_collection.dialysissolution.anticoagulant_shouji+'mg':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 5">{{main_collection.dialysissolution.anticoagulant_shouji?main_collection.dialysissolution.anticoagulant_shouji+'mg':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 6">{{main_collection.dialysissolution.anticoagulant_shouji?main_collection.dialysissolution.anticoagulant_shouji+'iu':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 7">{{main_collection.dialysissolution.anticoagulant_shouji?main_collection.dialysissolution.anticoagulant_shouji+'iu':''}}</span>
                   <span v-if="main_collection.dialysissolution.anticoagulant == 8">{{main_collection.dialysissolution.anticoagulant_shouji?main_collection.dialysissolution.anticoagulant_shouji+'iu':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 9">{{main_collection.dialysissolution.anticoagulant_shouji?main_collection.dialysissolution.anticoagulant_shouji+'iu':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 10">{{main_collection.dialysissolution.anticoagulant_shouji?main_collection.dialysissolution.anticoagulant_shouji+'iu':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 11">{{main_collection.dialysissolution.anticoagulant_shouji?main_collection.dialysissolution.anticoagulant_shouji+'iu':''}}</span>
                </td>

                <td v-if="printObj.anticoagulant_zongliang == 1">
                  <span v-if="main_collection.dialysissolution.anticoagulant == 1">{{main_collection.dialysissolution.anticoagulant_weichi?main_collection.dialysissolution.anticoagulant_weichi+'mg/h':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 2">{{main_collection.dialysissolution.anticoagulant_weichi?main_collection.dialysissolution.anticoagulant_weichi+'iu/h':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 3">{{main_collection.dialysissolution.anticoagulant_weichi?main_collection.dialysissolution.anticoagulant_weichi+'iu/h':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 4">{{main_collection.dialysissolution.anticoagulant_weichi?main_collection.dialysissolution.anticoagulant_weichi+'mg/h':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 5">{{main_collection.dialysissolution.anticoagulant_weichi?main_collection.dialysissolution.anticoagulant_weichi+'mg/h':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 6">{{main_collection.dialysissolution.anticoagulant_weichi?main_collection.dialysissolution.anticoagulant_weichi+'iu/h':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 7">{{main_collection.dialysissolution.anticoagulant_weichi?main_collection.dialysissolution.anticoagulant_weichi+'iu/h':''}}</span>
                   <span v-if="main_collection.dialysissolution.anticoagulant == 8">{{main_collection.dialysissolution.anticoagulant_weichi?main_collection.dialysissolution.anticoagulant_weichi+'iu/h':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 9">{{main_collection.dialysissolution.anticoagulant_weichi?main_collection.dialysissolution.anticoagulant_weichi+'iu/h':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 10">{{main_collection.dialysissolution.anticoagulant_weichi?main_collection.dialysissolution.anticoagulant_weichi+'iu/h':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 11">{{main_collection.dialysissolution.anticoagulant_weichi?main_collection.dialysissolution.anticoagulant_weichi+'iu/h':''}}</span>
                </td>
              
                <td v-if="printObj.anticoagulant_zongliang == 1">
                  <span v-if="main_collection.dialysissolution.anticoagulant == 1">{{main_collection.dialysissolution.anticoagulant_zongliang?main_collection.dialysissolution.anticoagulant_zongliang+'mg':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 2">{{main_collection.dialysissolution.anticoagulant_zongliang?main_collection.dialysissolution.anticoagulant_zongliang+'iu':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 3">{{main_collection.dialysissolution.anticoagulant_zongliang?main_collection.dialysissolution.anticoagulant_zongliang+'iu':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 4">{{main_collection.dialysissolution.anticoagulant_zongliang?main_collection.dialysissolution.anticoagulant_zongliang+'mg':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 5">{{main_collection.dialysissolution.anticoagulant_zongliang?main_collection.dialysissolution.anticoagulant_zongliang+'mg':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 6">{{main_collection.dialysissolution.anticoagulant_zongliang?main_collection.dialysissolution.anticoagulant_zongliang+'iu':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 7">{{main_collection.dialysissolution.anticoagulant_zongliang?main_collection.dialysissolution.anticoagulant_zongliang+'iu':''}}</span>
                   <span v-if="main_collection.dialysissolution.anticoagulant == 8">{{main_collection.dialysissolution.anticoagulant_zongliang?main_collection.dialysissolution.anticoagulant_zongliang+'iu':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 9">{{main_collection.dialysissolution.anticoagulant_zongliang?main_collection.dialysissolution.anticoagulant_zongliang+'iu':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 10">{{main_collection.dialysissolution.anticoagulant_zongliang?main_collection.dialysissolution.anticoagulant_zongliang+'iu':''}}</span>
                  <span v-if="main_collection.dialysissolution.anticoagulant == 11">{{main_collection.dialysissolution.anticoagulant_zongliang?main_collection.dialysissolution.anticoagulant_zongliang+'iu':''}}</span>
                </td>
                <td >
                   <span>{{getBloodName(main_collection.prescription.blood_access)  }}</span>
                </td>
                <td v-if="org_id == 0 || org_id ==10567">
                   <span>
                     {{ getProjectName(main_collection.projectList,main_collection.schedule_date) }}
                   </span>
                </td>
                <td  style="text-align:left"  v-if="printObj.doctor_advice == 1">
                  <span style="white-space: pre" v-if="main_collection.doctoradvice.length>0">{{getAdvice(main_collection.doctoradvice)}}</span>
                   <span style="white-space: pre" v-if="main_collection.hisdoctoradviceinfo.length>0">{{ getAdviceOne(main_collection.hisdoctoradviceinfo)}}</span>
                </td>
              </tr>
              </tbody>
            </table>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
  import { getScheduleList,getPrintList,getAllZoneList } from '@/api/schedule'
  import { getDataConfig } from '@/utils/data'
  import { parseTime } from '@/utils'
  import BreadCrumb from '@/xt_pages/components/bread-crumb'
  import print from 'print-js'

  export default {
    name: 'SchedulePrint',
    data() {
      return {
        crumbs: [
          { path: false, name: '排班提醒' },
          { path: false, name: '排班提醒打印' }
        ],
        scheduleData:[],
        week_type: 0,
        day:'',
        td_1_width: '10%',
        td_2_width: '10%',
        td_3_width: '25%',
        td_4_width: '45%',
        modeOptions: null,
        anticoagulants_confit:null,
        currentDate:'',
        org_id:0,
        printObj:{},
        week_time:0,
        zone:0,
        blood_access_option:[],
        zoneList:[]
      }
    },
    components: {
      BreadCrumb
    },
    created() {
      this.getAllZoneList()
      this.getPrintList()
      this.org_id = this.$store.getters.xt_user.org.id

      this.blood_access_option = getDataConfig(
          'hemodialysis',
          'vascular_access_desc'
       )
      
     //console.log("org_id23322323",this.org_id)
    //  this.currentDate = this.getCurrentDate()
      this.modeOptions = this.$store.getters.treatment_mode
      this.anticoagulants_confit = this.$store.getters.anticoagulants_confit
      this.week_type = this.$route.query.week_type
      this.week_time  = this.$route.query.week_time
      this.zone = this.$route.query.zone
      const params = {
          week_type:this.week_type,
          week_time:this.week_time,
          zone:this.zone,
          ids:this.$route.query.ids,
          limit:1000,
          page:1,
        }
       console.log("params",params)
       getScheduleList(params).then(response=>{
         if(response.data.state ==1){
           var list = response.data.data.list
           console.log("list2323323",list)
           for(let i=0;i<list.length;i++){
              list[i].sort = list[i].number.sort
              list[i].projectList = []
              if(list[i].his_prescription_template.his_prescription_info.length>0){
                for(let j=0;j<list[i].his_prescription_template.his_prescription_info.length;j++){
                  if(list[i].his_prescription_template.his_prescription_info[j].project.length >0){
                    for(let z=0;z<list[i].his_prescription_template.his_prescription_info[j].project.length;z++){
                      list[i].projectList.push(list[i].his_prescription_template.his_prescription_info[j].project[z])
                    }
                    
                  }
                }
              }
           }
           console.log("likst==========================",list)
           var arr = list.sort(this.compare('sort'))
            
             this.scheduleData = arr
            
             let a = response.data.data.day
              console.log("a",a)
              var myDate = new Date(a);
              var year = myDate.getFullYear(); //年
              var month = myDate.getMonth() + 1; //月
              var day = myDate.getDate(); //日
              var days = myDate.getDay();
              switch(days) {
              case 1:
                days = '星期一';
                break;
              case 2:
                days = '星期二';
                break;
              case 3:
                days = '星期三';
                break;
              case 4:
                days = '星期四';
                break;
              case 5:
                days = '星期五';
                break;
              case 6:
                days = '星期六';
                break;
              case 0:
                days = '星期日';
                break;
          }
          var str = year + "年" + month + "月" + day + "日  " + days;
          this.currentDate = str
          }
       })
       
      
    },
    methods: {
     getAllZoneList(){
      getAllZoneList().then(response=>{
         if(response.data.state == 1){
            var zonelist = response.data.data.zoneList
            this.zoneList.push(...zonelist)
         }
      })
      },
      getAdvice:function(doctor_advice) {
        if (doctor_advice != null) {

        let name = ""
        for (let i = 0; i< doctor_advice.length; i++) {

          let prescribing_number = ''
          let single_dose = ''
          let drug_spec = ''

          if (doctor_advice[i].prescribing_number > 0) {
            prescribing_number = doctor_advice[i].prescribing_number + doctor_advice[i].prescribing_number_unit
          }
          if (doctor_advice[i].single_dose > 0) {
            single_dose = ' 单次用量 ' + doctor_advice[i].single_dose + doctor_advice[i].single_dose_unit
          }

          if (doctor_advice[i].drug_spec > 0) {
            drug_spec = doctor_advice[i].drug_spec + doctor_advice[i].drug_spec_unit
          }

          name = name + doctor_advice[i].advice_name + " " + drug_spec + " " + prescribing_number + " " + single_dose + " " + doctor_advice[i].delivery_way + " " + doctor_advice[i].execution_frequency + " " + doctor_advice[i].remark + "\n"

          if (doctor_advice[i].child.length > 0) {

            for (let a = 0; a < doctor_advice[i].child.length; a++) {

              if (doctor_advice[i].child[a].prescribing_number > 0) {
                doctor_advice[i].child[a]['presc'] = doctor_advice[i].child[a].prescribing_number + doctor_advice[i].child[a].prescribing_number_unit
              } else {
                doctor_advice[i].child[a]['presc'] = ''
              }

              if (doctor_advice[i].child[a].single_dose > 0) {
                doctor_advice[i].child[a]['single'] = " " + ' 单次用量 ' + " " + doctor_advice[i].child[a].single_dose + doctor_advice[i].child[a].single_dose_unit
              } else {
                doctor_advice[i].child[a]['single'] = ''
              }

              name = name + "▲" + doctor_advice[i].child[a].advice_name + ""
                + doctor_advice[i].child[a].advice_desc
                + doctor_advice[i].child[a].drug_spec_unit
                + doctor_advice[i].child[a].presc
                + doctor_advice[i].child[a].single + "\n"
            }

          }
        }
          return name


        }

      },
      getAdviceOne:function(doctor_advice) {
        if (doctor_advice != null) {

        let name = ""
        for (let i = 0; i< doctor_advice.length; i++) {

          let prescribing_number = ''
          let single_dose = ''
          let drug_spec = ''

          if (doctor_advice[i].prescribing_number > 0) {
            prescribing_number = doctor_advice[i].prescribing_number + doctor_advice[i].prescribing_number_unit
          }
          if (doctor_advice[i].single_dose > 0) {
            single_dose = ' 单次用量 ' + doctor_advice[i].single_dose + doctor_advice[i].single_dose_unit
          }

          if (doctor_advice[i].drug_spec > 0) {
            drug_spec = doctor_advice[i].drug_spec + doctor_advice[i].drug_spec_unit
          }

          name = name + doctor_advice[i].advice_name + " " + drug_spec + " " + prescribing_number + " " + single_dose + " " + doctor_advice[i].delivery_way + " " + doctor_advice[i].execution_frequency + " " + doctor_advice[i].remark + "\n"

        
        }
          return name


        }

      },
     
      printAction: function() {
        const style = '@media print { .print_main_content { background-color: white; width:960px;  margin:0 auto; padding: 0 0 20px 0; } .order_title_panl { text-align: center; } .main_title { font-size: 18px; line-height: 40px; font-weight: 500; } .table_panel { } .table { width: 100%; border: 1px solid; border-collapse: collapse; padding: 2px; } thead tr td { border: 1px solid; text-align: center; font-size: 20px; padding: 15px 5px; } tbody tr td { border: 1px solid; text-align: center; font-size: 18px; padding: 10px 5px; } .proj { padding: 5px 0; text-align: left; } .proj_title { font-size: 16px; font-weight: 500; line-height: 25px; } .proj_item { font-size: 15px; line-height: 20px; } .zone_name { font-weight: 500; } }'

        printJS({
          printable: 'print_content',
          type: 'html',
          documentTitle: '  ',
          style: style,
          scanStyles: false
        })
      }, getSchedulesType: function(type) {
        let type_name = ''
        switch (type) {
          case 1:
            type_name = '上午'
            break
          case 2:
            type_name = '下午'
            break
          case 3:
            type_name = '晚上'
            break
        }
        return type_name
      },
      getCurrentDate: function () {
        console.log(this.$route.query.week_type)
        var myDate = new Date();
        var year = myDate.getFullYear(); //年
        var month = myDate.getMonth() + 1; //月
        var day = myDate.getDate(); //日
        var newday = myDate.getDay();
        var days = parseInt(this.$route.query.week_type);
        var dayNum = parseInt(this.$route.query.week_type);
        switch(days) {
          case 1:
            days = '星期一';
            break;
          case 2:
            days = '星期二';
            break;
          case 3:
            days = '星期三';
            break;
          case 4:
            days = '星期四';
            break;
          case 5:
            days = '星期五';
            break;
          case 6:
            days = '星期六';
            break;
          case 7:
            days = '星期日';
            break;
        }
        if(newday > dayNum){
          let lastDay = day - (newday - dayNum)
          console.log("lastDay1",lastDay)
          var str = year + "年" + month + "月" + lastDay + "日  " + days;
          return str;
        }else if(newday < dayNum){
          let lastDay = day + (dayNum - newday)
          console.log("lastDay2",lastDay)
          var str = year + "年" + month + "月" + lastDay + "日  " + days;
          return str;
        }else{
          var str = year + "年" + month + "月" + day + "日  " + days;
          return str;
        }
      },
      compare(property) {
        return function (a, b) {
            var value1 = a[property];
            var value2 = b[property];
            return value1 - value2;
        }
      },
     getPrintList(){
      getPrintList().then(response=>{
         if(response.data.state == 1){
           var list = response.data.data.list
           console.log("list22222",list)
           this.printObj = list
         }
      })
     },
    getDialysisDialyszerPerfusion(patient_id){
        var name = ""
        for(let i=0;i<this.scheduleData.length;i++){
          if(patient_id == this.scheduleData[i].patient_id){
            var arrLength = this.scheduleData[i].dialysissolution.length
            if(arrLength > 0){
               name = this.scheduleData[i].dialysissolution[arrLength - 1].dialyzer_perfusion_apparatus
            }
          }
        }
       return name
     },
    getDialysisDialyszerPerfusionOne(patient_id,mode_id,solution) {
        var name = ''
        for (let i = 0; i < solution.length; i++) {
          if (mode_id == solution[i].mode_id) {
         
            name = solution[i].dialyzer_perfusion_apparatus
            
          }
        }
        console.log('name', name)
        return name
      },
      getBloodName(id){
         var name= ""
         for(let i=0;i<this.blood_access_option.length;i++){
           if(id == this.blood_access_option[i].id){
              name = this.blood_access_option[i].name
           }
         }
         return name
      },
      getType(zone_id){
        var type_name =""
        var is_type = 0
        for(let i=0;i<this.zoneList.length;i++){
           if(zone_id == this.zoneList[i].id){
               is_type =this.zoneList[i].type
           }
        }
        if(is_type ==1){
          type_name = "普通"
        }
        if(is_type ==2){
          type_name = "乙肝"
        }
        if(is_type ==3){
          type_name = "丙肝"
        }
        if(is_type ==4){
          type_name = "艾滋病"
        }
        if(is_type ==5){
          type_name = "肺结核"
        }
        if(is_type ==6){
          type_name = "梅毒"
        }

        return type_name 

      },
      getProjectName(val,schedule_date){
       var project_name = ""
       if(val!=null && val.length>0){
         for(let i=0;i<val.length;i++){
          if(val[i].good_info.good_type_id == 9716){
            if(val[i].frequency_type == 1 || (val[i].frequency_type == 3 && val[i].week_day.indexOf(this.getweekday(schedule_date))!=-1)){
              project_name += val[i].good_info.good_name +val[i].count + val[i].good_info.packing_unit +","
            }
          }
           
         }
       }
       return project_name
      },
      getweekday(date){
        var weekArray = new Array("周日", "周一", "周二", "周三", "周四", "周五", "周六");

        var week = weekArray[new Date(date).getDay()];//注意此处必须是先new一个Date

        return week;
      }
    },
  }
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.print_main_content {
  background-color: white;
  max-width: 1500px;
  margin: 0 auto;
  padding: 0 0 20px 0;

  .order_title_panl {
    text-align: center;

    .main_title {
      font-size: 18px;
      line-height: 40px;
      font-weight: 500;
    }
  }
  .table_panel {
    .table {
      width: 100%;
      border: 1px solid;
      border-collapse: collapse;
      padding: 2px;

      thead {
        tr {
          td {
            border: 1px solid;
            text-align: center;
            font-size: 18px;
            padding: 10px 5px;
          }
        }
      }
      tbody {
        tr {
          td {
            border: 1px solid;
            text-align: center;
            font-size: 18px;
            padding: 10px 5px;

            .proj {
              padding: 5px 0;
              text-align: left;

              .proj_title {
                font-size: 16px;
                font-weight: 500;
                line-height: 25px;
              }

              .proj_item {
                font-size: 15px;
                line-height: 20px;

                .zone_name {
                  font-weight: 500;
                }
              }
            }
          }
        }
      }
    }
  }
}
</style>