<template>
  <div class="main-content illegal-print">
    <div class="content-header">
      <span class="title">列入严重违法失信名单决定报上级审批</span>
      <div class="back-btn">
        <el-button type="primary" size="mini" @click="$router.back()">返回</el-button>
        <el-button type="primary" size="mini" @click="printCurrent">打印当前页</el-button>
        <el-button type="primary" size="mini" @click="printAll">全部打印</el-button>
      </div>
    </div>
    <div id="content-body" class="content-body">
      <div class="preview-box">
        <paper-swiper ref="swiper">
          <paper
            v-for="({tsserillegallist,tsBizSerIllegal,tsWrit,eBaseinfo}, index) in paperInfo"
            :key="index"
            style="width: 700px; line-height: 30px; font-family: '宋体';margin: 0 auto;"
          >
            <div style="text-align: center">
              <!-- 表头  -->
              <h3 style="margin-bottom: 5px">
                广州市市场监督管理局
              </h3>
              <h3 style="margin-top: 0">列入严重违法失信名单决定报上级审批</h3>
            </div>
            <br>
            <div class="paper-table">
              <!-- 表格  -->
              <table width="100%" border="1" style="border-collapse: collapse">
                <tbody>
                  <tr>
                    <th width="25%" style="text-align: center; padding: 10px">
                      当事人
                    </th>
                    <td colspan="2" style="padding: 10px">{{ eBaseinfo.entname }}</td>
                    <th width="25%" style="text-align: center; padding: 10px;">
                      统一社会信用代码/身份证号码
                    </th>
                    <td colspan="2" style="padding: 10px;word-wrap: break-word; word-break: break-all;">{{ eBaseinfo.uniscid || eBaseinfo.regno }}</td>
                  </tr>
                  <tr>
                    <th width="25%" style="text-align: center; padding: 10px">
                      住所（经营场所）
                    </th>
                    <td colspan="2" style="padding: 10px">{{ eBaseinfo.dom || eBaseinfo.address }}</td>
                    <th width="25%" style="text-align: center; padding: 10px">
                      法定代表人（负责人、经营者）姓名
                    </th>
                    <td colspan="2" style="padding: 10px">{{ eBaseinfo.lerep }}</td>
                  </tr>
                  <tr>
                    <th width="25%" style="text-align: center; padding: 10px">
                      事实、理由、依据及处理意见
                    </th>
                    <td colspan="4" style="padding: 10px">
                      {{ tsBizSerIllegal.lostcreditexplain }}
                      <div style="text-align: right">
                        经办人：{{ jbyj.handler }}
                        <br>
                        {{ $moment(jbyj.handledate).format('YYYY 年 MM 月 DD 日 ') }}
                      </div>
                    </td>
                  </tr>
                  <tr>
                    <th width="25%" style="text-align: center; padding: 10px">
                      是否经过听证程序
                    </th>
                    <td colspan="4" style="padding: 10px">
                      <div>
                        <template v-if="tsBizSerIllegal.ishea ==='1'">
                          □ 当事人未提出陈述、申辩意见或者申请听证
                          <br>
                          ☑ 已经听证
                        </template>
                        <template v-else>
                          ☑ 当事人未提出陈述、申辩意见或者申请听证
                          <br>
                          □ 已经听证
                        </template>
                      </div>
                    </td>
                  </tr>
                  <tr>
                    <th width="25%" style="text-align: center; padding: 10px">
                      当事人听证中提出的主要意见
                    </th>
                    <td colspan="4" style="padding: 10px">
                      {{ tsBizSerIllegal.heaop }}
                    </td>
                  </tr>
                  <tr>
                    <th width="25%" style="text-align: center; padding: 10px">
                      听证意见
                    </th>
                    <td colspan="4" style="padding: 10px" >
                      {{ tsBizSerIllegal.heaopinionl }}
                    </td>
                  </tr>
                  <!--                  <tr>-->
                  <!--                    <th width="25%" style="text-align: center; padding: 10px">-->
                  <!--                      材料清单-->
                  <!--                    </th>-->
                  <!--                    <td colspan="4" style="padding: 10px" />-->
                  <!--                  </tr>-->
                  <tr>
                    <th width="25%" style="text-align: center; padding: 10px">
                      经办人意见
                    </th>
                    <td colspan="4" style="padding: 10px">
                      {{ jbyj.opinioncontent }}
                      <div style="text-align: right">
                        负责人：{{ jbyj.handler }}
                        <br>
                        {{ $moment(jbyj.handledate).format('YYYY 年 MM 月 DD 日 ') }}
                      </div>
                    </td>
                  </tr>
                  <tr>
                    <th width="25%" style="text-align: center; padding: 10px">
                      部门负责人意见
                    </th>
                    <td colspan="4" style="padding: 10px">
                      {{ bmyj.opinioncontent }}
                      <div style="text-align: right">
                        负责人：{{ bmyj.handler }}
                        <br>
                        {{ $moment(bmyj.handledate).format('YYYY 年 MM 月 DD 日 ') }}
                      </div>
                    </td>
                  </tr>
                  <tr>
                    <th width="25%" style="text-align: center; padding: 10px">
                      区局领导意见
                    </th>
                    <td colspan="4" style="padding: 10px">
                      {{ qjyj.opinioncontent }}
                      <div style="text-align: right">
                        负责人：{{ qjyj.handler }}
                        <br>
                        {{ $moment(qjyj.handledate).format('YYYY 年 MM 月 DD 日 ') }}
                      </div>
                    </td>
                  </tr>
                </tbody>
              </table>
            </div>
          </paper>
        </paper-swiper>
      </div>
    </div>
  </div>
</template>

<script>
import { getIllegalInclusionDecWrit } from '@/api/illegal'
import { taskOpinion } from '@/api/task'
export default {
  data() {
    return {
      paperInfo: [],
      bizseq: '',
      workflowId: '',
      jbyj: {},
      bmyj: {},
      qjyj: {},
      historyLog: []
    }
  },
  mounted() {
    this.bizseq = this.$route.query.bizseq
    this.workflowId = this.$route.query.workflowId
    // 获取文书信息
    getIllegalInclusionDecWrit(this.bizseq).then(res => {
      if (res.code === 0) {
        this.paperInfo = res.data
      }
    })
    taskOpinion(this.workflowId).then(res => {
      if (res.code === 0) {
        res.data.forEach(each => {
          this.historyLog.push(each)
        })
        // 经办人意见
        for (const item of this.historyLog) {
          if (item.opiniontype === '0') {
            this.jbyj = item
          } else if (item.opiniontype === '6') {
            // 到了送市局了，跳出
            break
          }
        }
        // 部门意见
        for (const item of this.historyLog) {
          if (item.opiniontype === '1') {
            this.bmyj = item
          } else if (item.opiniontype === '6') {
            // 到了送市局了，跳出
            break
          }
        }
        // 区局领导意见
        for (const item of this.historyLog) {
          if (item.opiniontype === '2') {
            this.qjyj = item
          } else if (item.opiniontype === '6') {
            // 到了送市局了，跳出
            break
          }
        }
      } else {
        this.$message.error('加载处办记录失败')
      }
    })
  },
  methods: {
    printCurrent() {
      const swiper = this.$refs.swiper
      const page = swiper.getPaperElement()

      const printHtml = page.outerHTML // 获取到要打印的节点内容
      // 打开新窗口
      const newWindow = window.open('打印', '_blank')
      newWindow.document.write(printHtml)
      // 关闭文档
      newWindow.document.close()
      // 调用打印机
      newWindow.print()
      newWindow.close()
    },
    printAll() {
      let html = ''
      const swiper = this.$refs.swiper
      for (let i = 0; i < this.paperInfo.length; i++) {
        const page = swiper.getPaperElement(i)
        const printHtml = page.outerHTML
        html += printHtml
      }
      const style =
          '<style type="text/css">body>div:not(:first-child){margin-top:600px}</style>'
      html += style
      // 打开新窗口
      const newWindow = window.open('打印', '_blank')
      newWindow.document.write(html)
      // 关闭文档
      newWindow.document.close()
      // 调用打印机
      newWindow.print()
      newWindow.close()
    }
  }
}
</script>
<style lang="scss" scoped>
.main-content {
  font-size:16px;
  padding: 20pt;
  .back-btn {
    display: inline-block;
    position: absolute;
    right: 40pt;
  }
  .content-header,
  .content-body {
    background: white;
    padding: 20px 10px;
  }
  .content-header {
    height: 60px;
    .title {
      font-weight: 700;
      font-size: $font-size-sub-title;
    }
  }
  .content-body {
    padding: 20pt;
    .tab {
      .tab-title {
        label {
          background: $color-primary;
          display: inline-block;
          color: $color-title-color;
          padding: 5px;
        }
      }
    }
    .form {
      margin-bottom: 20pt;
    }
  }
}
</style>
