<template>
  <div>
    <div style="text-align: right">
      <el-button type="primary" @click="printLicence">打印</el-button>
    </div>
    <div id="fireUpLicence">
      <div class="fire-title">动火安全作业许可证</div>
      <table style="width: 100%;" border="1" cellpadding="5" cellspacing="0">
        <tr>
          <td colspan="2">申请部门</td>
          <td style="width: 18%">{{ dataInfo.applyDeptName }}</td>
          <td>申请人</td>
          <td style="width: 18%">{{ dataInfo.applyName }}</td>
          <td>作业证编号</td>
          <td colspan="2" style="width: 18%">{{ dataInfo.documentNum }}</td>
        </tr>

        <tr>
          <td colspan="2">动火作业级别</td>
          <td>{{ getlevelname(baseInfo.level) }}</td>
          <td>动火地点</td>
          <td>{{ baseInfo.address }}</td>
          <td>动火方式</td>
          <td  colspan="2">{{ baseInfo.type }}</td>
        </tr>

        <tr>
          <td colspan="2">动火时间</td>
          <td colspan="6">
          <span v-if="baseInfo.startTime && baseInfo.endTime">
            自 {{ $parent.$parent.dateFormatter(baseInfo.startTime) }}始 至 {{ $parent.$parent.dateFormatter(baseInfo.endTime) }}止
          </span>
            <span v-else>自   年   月   日   时   分始   至   年   月   日   时   分止</span>
          </td>
        </tr>

        <tr>
          <td colspan="2">动火作业负责人</td>
          <td>{{ baseInfo.head }}</td>
          <td>动火作业人</td>
          <td colspan="4">{{ baseInfo.operator }}</td>
        </tr>

        <tr>
          <td colspan="2">动火人特种作业证号</td>
          <td colspan="6">{{ analysisInfo.fenxi.cardNum }}</td>
        </tr>

        <tr>
          <td colspan="2">动火分析时间</td>
          <td colspan="2">{{ $parent.$parent.dateFormatter(dataInfo.analysisTime) }}</td>
          <td colspan="2">
            <span v-if="analysisInfo.fenxi.fenxiList && analysisInfo.fenxi.fenxiList.length > 0">{{ $parent.$parent.dateFormatter(analysisInfo.fenxi.fenxiList[0].date) }}</span>
          </td>
          <td colspan="2">
            <span v-if="analysisInfo.fenxi.fenxiList && analysisInfo.fenxi.fenxiList.length > 1">{{ $parent.$parent.dateFormatter(analysisInfo.fenxi.fenxiList[1].date) }}</span>
          </td>
        </tr>

        <tr>
          <td colspan="2">分析点名称</td>
          <td colspan="2">{{ analysisInfo.fenxi.name }}</td>
          <td colspan="2">
            <span v-if="analysisInfo.fenxi.fenxiList && analysisInfo.fenxi.fenxiList.length > 0">{{ analysisInfo.fenxi.fenxiList[0].name }}</span>
          </td>
          <td colspan="2">
            <span v-if="analysisInfo.fenxi.fenxiList && analysisInfo.fenxi.fenxiList.length > 1">{{ analysisInfo.fenxi.fenxiList[1].name }}</span>
          </td>
        </tr>

        <tr>
          <td colspan="2">分析数据</td>
          <td colspan="2">{{ analysisInfo.fenxi.datas }}</td>
          <td colspan="2">
            <span v-if="analysisInfo.fenxi.fenxiList && analysisInfo.fenxi.fenxiList.length > 0">{{ analysisInfo.fenxi.fenxiList[0].datas }}</span>
          </td>
          <td colspan="2">
            <span v-if="analysisInfo.fenxi.fenxiList && analysisInfo.fenxi.fenxiList.length > 1">{{ analysisInfo.fenxi.fenxiList[1].datas }}</span>
          </td>
        </tr>

        <tr>
          <td colspan="2">分析人</td>
          <td colspan="2">{{ analysisInfo.fenxi.people }}</td>
          <td colspan="2">
            <span v-if="analysisInfo.fenxi.fenxiList && analysisInfo.fenxi.fenxiList.length > 0">{{ analysisInfo.fenxi.fenxiList[0].people }}</span>
          </td>
          <td colspan="2">
            <span v-if="analysisInfo.fenxi.fenxiList && analysisInfo.fenxi.fenxiList.length > 1">{{ analysisInfo.fenxi.fenxiList[1].people }}</span>
          </td>
        </tr>

        <tr>
          <td colspan="2">涉及的其他特殊作业</td>
          <td colspan="6">{{ analysisInfo.fenxi.otherNum }}</td>
        </tr>

        <tr>
          <td colspan="2">危害辨识</td>
          <td colspan="6">{{ analysisInfo.fenxi.danger }}</td>
        </tr>

        <tr>
          <td style="width: 7%;text-align: center;">序号</td>
          <td colspan="6" style="text-align: center">安全措施</td>
          <td style="width: 9%;text-align: center">是否涉及</td>
        </tr>

        <tr>
          <td style="text-align: center;">1</td>
          <td colspan="6">动火设备内部构件清理干净，蒸汽吹扫或水洗合格，达到用火条件</td>
          <td style="text-align: center"><span :class="analysisInfo.cuoshi[0]?'sheji':'busheji'">{{analysisInfo.cuoshi[0]?'涉及':'不涉及'}}</span></td>
        </tr>

        <tr>
          <td style="text-align: center;">2</td>
          <td colspan="6">开与动火设备相连的所有管线，加盲板( {{ analysisInfo.cuoshidetai.banNum }} )块</td>
          <td style="text-align: center"><span :class="analysisInfo.cuoshi[1]?'sheji':'busheji'">{{analysisInfo.cuoshi[1]?'涉及':'不涉及'}}</span></td>
        </tr>

        <tr>
          <td style="text-align: center;">3</td>
          <td colspan="6">动火点周围的下水井、地漏、地沟、电缆沟等已清除易燃易爆物，并已采取覆盖、铺沙、水封等手段进行隔离</td>
          <td style="text-align: center"><span :class="analysisInfo.cuoshi[2]?'sheji':'busheji'">{{analysisInfo.cuoshi[2]?'涉及':'不涉及'}}</span></td>
        </tr>
        <tr>
          <td style="text-align: center;">4</td>
          <td colspan="6">电焊机所处位置已考虑防火防爆要求，且已可靠接地，电焊回路线已接在焊件上，把线未穿过下水井或与其他设备搭接</td>
          <td style="text-align: center"><span :class="analysisInfo.cuoshi[3]?'sheji':'busheji'">{{analysisInfo.cuoshi[3]?'涉及':'不涉及'}}</span></td>
        </tr>

        <tr>
          <td style="text-align: center;">5</td>
          <td colspan="6">高处作业已采取防火花飞溅措施</td>
          <td style="text-align: center"><span :class="analysisInfo.cuoshi[4]?'sheji':'busheji'">{{analysisInfo.cuoshi[4]?'涉及':'不涉及'}}</span></td>
        </tr>

        <tr>
          <td style="text-align: center;">6</td>
          <td colspan="6">动火点周围规定距离内没有易燃易爆化学品的装卸、排放、喷漆等可能引起火灾、爆炸的危险作业</td>
          <td style="text-align: center"><span :class="analysisInfo.cuoshi[5]?'sheji':'busheji'">{{analysisInfo.cuoshi[5]?'涉及':'不涉及'}}</span></td>
        </tr>

        <tr>
          <td style="text-align: center;">7</td>
          <td colspan="6">乙炔气瓶（直立放置）、氧气瓶与火源间的距离大于10m</td>
          <td style="text-align: center"><span :class="analysisInfo.cuoshi[6]?'sheji':'busheji'">{{analysisInfo.cuoshi[6]?'涉及':'不涉及'}}</span></td>
        </tr>

        <tr>
          <td style="text-align: center;">8</td>
          <td colspan="6">现场配备灭火器( {{ analysisInfo.cuoshidetai.miehuoqi }} )个，铁锹( {{ analysisInfo.cuoshidetai.teqiao }} )把，石棉布( {{ analysisInfo.cuoshidetai.shimian }} )块</td>
          <td style="text-align: center"><span :class="analysisInfo.cuoshi[7]?'sheji':'busheji'">{{analysisInfo.cuoshi[7]?'涉及':'不涉及'}}</span></td>
        </tr>

        <tr>
          <td style="text-align: center;">9</td>
          <td colspan="6">动火点周围易燃物已清除，动火点30m内垂直空间未排放可燃气体；15m内垂直空间未排放可燃液体；10m 范围内及动火点下方未同时进行可燃溶剂清洗或喷漆等作业，10m范围内未见有可燃性粉尘清扫作业</td>
          <td style="text-align: center"><span :class="analysisInfo.cuoshi[8]?'sheji':'busheji'">{{analysisInfo.cuoshi[8]?'涉及':'不涉及'}}</span></td>
        </tr>

        <tr>
          <td style="text-align: center;">10</td>
          <td colspan="6">已开展作业危害分析，制定相应的安全风险管控措施，交叉作业已明确协调人</td>
          <td style="text-align: center"><span :class="analysisInfo.cuoshi[9]?'sheji':'busheji'">{{analysisInfo.cuoshi[9]?'涉及':'不涉及'}}</span></td>
        </tr>

        <tr>
          <td style="text-align: center;">11</td>
          <td colspan="6">用于连续检测的移动式可燃气体检测仪已配备到位</td>
          <td style="text-align: center"><span :class="analysisInfo.cuoshi[10]?'sheji':'busheji'">{{analysisInfo.cuoshi[10]?'涉及':'不涉及'}}</span></td>
        </tr>

        <tr>
          <td style="text-align: center;">12</td>
          <td colspan="6">配备的摄录设备已到位，且防爆级别满足安全要求</td>
          <td style="text-align: center"><span :class="analysisInfo.cuoshi[11]?'sheji':'busheji'">{{analysisInfo.cuoshi[11]?'涉及':'不涉及'}}</span></td>
        </tr>

        <tr>
          <td style="text-align: center;">13</td>
          <td colspan="6">其他相关特殊作业已办理相应安全作业票，作业现场四周已设立警戒区</td>
          <td style="text-align: center"><span :class="analysisInfo.cuoshi[12]?'sheji':'busheji'">{{analysisInfo.cuoshi[12]?'涉及':'不涉及'}}</span></td>
        </tr>

        <tr>
          <td style="text-align: center;">14</td>
          <td colspan="6">其他安全措施: {{ analysisInfo.cuoshidetai.qitacuoshi }}</td>
          <td style="text-align: center"><span :class="analysisInfo.cuoshi[13]?'sheji':'busheji'">{{analysisInfo.cuoshi[13]?'涉及':'不涉及'}}</span></td>
        </tr>

        <tr>
          <td style="text-align: center">确认人</td>
          <td colspan="7">
            <div style="width: 100px;height: 24px">
              <el-image
                v-if="analysisInfo.cuoshidetai.signUrl"
                :src="analysisInfo.cuoshidetai.signUrl"
                :preview-src-list="[analysisInfo.cuoshidetai.signUrl]"
                :z-index="9999"
                style="width: 24px;height: 100px;transform: rotate(-90deg);top: -39px;left: 39px;"
              >
              </el-image>
              <span v-else></span>
            </div>
          </td>
        </tr>

        <tr>
          <td colspan="2">生产部门负责人</td>
          <td>
            <div style="width: 124px;height: 24px">
              <el-image
                v-if="$parent.$parent.getSignInfo(-1).signUrl"
                :src="$parent.$parent.getSignInfo(-1).signUrl"
                :preview-src-list="[$parent.$parent.getSignInfo(-1).signUrl]"
                :z-index="9999"
                style="width: 24px;height: 124px;transform: rotate(-90deg);top: -50px;left: 55px;"
              >
              </el-image>
              <span v-else></span>
            </div>
          </td>
          <td>监火人</td>
          <td>
            <div style="width: 124px;height: 24px">
              <el-image
                v-if="$parent.$parent.getSignInfo(-2).signUrl"
                :src="$parent.$parent.getSignInfo(-2).signUrl"
                :preview-src-list="[$parent.$parent.getSignInfo(-2).signUrl]"
                :z-index="9999"
                style="width: 24px;height: 124px;transform: rotate(-90deg);top: -50px;left: 55px;"
              >
              </el-image>
              <span v-else></span>
            </div>
          </td>
          <td>动火初审人</td>
          <td colspan="2">
            <div style="width: 124px;height: 24px">
              <el-image
                v-if="$parent.$parent.getSignInfo(-3).signUrl"
                :src="$parent.$parent.getSignInfo(-3).signUrl"
                :preview-src-list="[$parent.$parent.getSignInfo(-3).signUrl]"
                :z-index="9999"
                style="width: 24px;height: 124px;transform: rotate(-90deg);top: -50px;left: 55px;"
              >
              </el-image>
              <span v-else></span>
            </div>
          </td>
        </tr>

        <tr>
          <td colspan="2">实施安全教育人</td>
          <td colspan="6">
            <div style="width: 124px;height: 24px">
              <el-image
                v-if="$parent.$parent.getSignInfo(-4).signUrl"
                :src="$parent.$parent.getSignInfo(-4).signUrl"
                :preview-src-list="[$parent.$parent.getSignInfo(-4).signUrl]"
                :z-index="9999"
                style="width: 24px;height: 124px;transform: rotate(-90deg);top: -50px;left: 55px;"
              >
              </el-image>
              <span v-else></span>
            </div>
          </td>
        </tr>

        <tr>
          <td colspan="8" style="text-align: left;">
            <div style="margin-bottom: 5px">申请部门意见</div>
            <div>{{ $parent.$parent.getSignInfo(1).signOpinion }}</div>
            <div style="display: flex;justify-content:flex-end;margin-top: 5px;">
              签字:
              <div style="width: 85px;height: 24px">
                <el-image
                  v-if="$parent.$parent.getSignInfo(1).signUrl"
                  :src="$parent.$parent.getSignInfo(1).signUrl"
                  :preview-src-list="[$parent.$parent.getSignInfo(1).signUrl]"
                  :z-index="9999"
                  style="width: 24px;height: 85px;transform: rotate(-90deg);top: -32px;left: 30px;"
                >
                </el-image>
                <span v-else></span>
              </div>
              <span style="width: 230px" v-if="$parent.$parent.getSignInfo(1).signTime">{{ $parent.$parent.dateFormatter($parent.$parent.getSignInfo(1).signTime) }}</span>
              <span v-else>年   月   日   时   分</span>
            </div>
          </td>
        </tr>

        <tr>
          <td colspan="8" style="text-align: left">
            <div style="margin-bottom: 5px">安全管理部门意见</div>
            <div>{{ $parent.$parent.getSignInfo(2).signOpinion }}</div>
            <div style="justify-content:flex-end;display: flex;margin-top: 5px">
              签字:
              <div style="width: 85px;height: 24px">
                <el-image
                  v-if="$parent.$parent.getSignInfo(2).signUrl"
                  :src="$parent.$parent.getSignInfo(2).signUrl"
                  :preview-src-list="[$parent.$parent.getSignInfo(2).signUrl]"
                  :z-index="9999"
                  style="width: 24px;height: 85px;transform: rotate(-90deg);top: -32px;left: 30px;"
                >
                </el-image>
                <span v-else></span>
              </div>
              <span style="width: 230px" v-if="$parent.$parent.getSignInfo(2).signTime">{{ $parent.$parent.dateFormatter($parent.$parent.getSignInfo(2).signTime) }}</span>
              <span v-else>年 月 日 时 分</span>
            </div>
          </td>
        </tr>

        <tr>
          <td colspan="8" style="text-align: left">
            <div style="margin-bottom: 5px">动火审批人意见</div>
            <div>{{ $parent.$parent.getSignInfo(3).signOpinion }}</div>
            <div style="justify-content:flex-end;display: flex;margin-top: 5px">
              签字:
              <div style="width: 85px;height: 24px">
                <el-image
                  v-if="$parent.$parent.getSignInfo(3).signUrl"
                  :src="$parent.$parent.getSignInfo(3).signUrl"
                  :preview-src-list="[$parent.$parent.getSignInfo(3).signUrl]"
                  :z-index="9999"
                  style="width: 24px;height: 85px;transform: rotate(-90deg);top: -32px;left: 30px;"
                >
                </el-image>
                <span v-else></span>
              </div>
              <span style="width: 230px" v-if="$parent.$parent.getSignInfo(3).signTime">{{ $parent.$parent.dateFormatter($parent.$parent.getSignInfo(3).signTime) }}</span>
              <span v-else>年 月 日 时 分</span>
            </div>
          </td>
        </tr>

        <tr>
          <td colspan="8" style="text-align: left">
            <div style="margin-bottom: 5px">动火前，岗位当班班长验票</div>
            <div>{{ $parent.$parent.getSignInfo(4).signOpinion }}</div>
            <div style="justify-content:flex-end;display: flex;margin-top: 5px">
              签字:
              <div style="width: 85px;height: 24px">
                <el-image
                  v-if="$parent.$parent.getSignInfo(4).signUrl"
                  :src="$parent.$parent.getSignInfo(4).signUrl"
                  :preview-src-list="[$parent.$parent.getSignInfo(4).signUrl]"
                  :z-index="9999"
                  style="width: 24px;height: 85px;transform: rotate(-90deg);top: -32px;left: 30px;"
                >
                </el-image>
                <span v-else></span>
              </div>
              <span style="width: 230px" v-if="$parent.$parent.getSignInfo(4).signTime">{{ $parent.$parent.dateFormatter($parent.$parent.getSignInfo(4).signTime) }}</span>
              <span v-else>年 月 日 时 分</span>
            </div>
          </td>
        </tr>

        <tr>
          <td colspan="8" style="text-align: left">
            <div style="margin-bottom: 5px">完工（验收）验收</div>
            <div>{{ $parent.$parent.getSignInfo(5).signOpinion }}</div>
            <div style="justify-content:flex-end;display: flex;margin-top: 5px">
              签字:
              <div style="width: 85px;height: 24px">
                <el-image
                  v-if="$parent.$parent.getSignInfo(5).signUrl"
                  :src="$parent.$parent.getSignInfo(5).signUrl"
                  :preview-src-list="[$parent.$parent.getSignInfo(5).signUrl]"
                  :z-index="9999"
                  style="width: 24px;height: 85px;transform: rotate(-90deg);top: -32px;left: 30px;"
                >
                </el-image>
                <span v-else></span>
              </div>
              <span style="width: 230px" v-if="$parent.$parent.getSignInfo(5).signTime">{{ $parent.$parent.dateFormatter($parent.$parent.getSignInfo(5).signTime) }}</span>
              <span v-else>年 月 日 时 分</span>
            </div>
          </td>
        </tr>

      </table>
    </div>
  </div>
</template>

<script>
  import printJs from "print-js";
  export default {
    name: "fire-up-table",
    data(){
        return{
          dataInfo:{},
          baseInfo:{
            "applicant": "",
            "applicantDept": "",
            "specialNum": "",
            "level": "",
            "address": "",
            "type": "",
            "startTime": "",
            "endTime": "",
            "head": "",
            "operator": ""
          },
          analysisInfo:{
            "fenxi": {
              "cardNum": "",
              "name": "",
              "datas": "",
              "people": "",
              "otherNum": "",
              "danger": "",
              "fenxiList":[],
            },
            "cuoshi": [false,
              false,
              false,
              false,
              false,
              false,
              false,
              false,
              false,
              false,
              false,
              false,
              false],
            "cuoshidetai": {
              "banNum": "",
              "miehuoqi": "",
              "teqiao": "",
              "shimian": "",
              "qitacuoshi": "",
              "signUrl": ""
            }
          }
        }
    },
    methods: {
      getlevelname(num){
        if(num==1){
          return "特级"
        }else if(num==2){
          return "一级"
        }
        return "二级"
      },
      printLicence(){
        printJs({
          //需要打印区域设置的id
          printable: 'fireUpLicence',
          //打印类型
          type: 'html',
          maxWidth: '100%',
          // * 代表所有样式，没有设置，打印窗口忽略所有样式
          targetStyles: ['*'],
        })
      }
    }

  }
</script>

<style scoped lang="scss">
  .fire-title{
    width: 100%;
    text-align: center;
    font-size: 25px;
    padding: 13px;
  }
  .sheji{
    color:red;
  }
  .busheji{
    color:#111111;
  }
</style>
