<template>
  <div class="recordBill">
    <div
      id="div1"
      class="printView_header"
    >
      <div style="text-align: center;  height: 40px">
        护理交接班
      </div>
      <div>
        <span style="display: inline-block; width: 200px">日期：{{ printData.date.substring(0, 10) }}</span>
        <span style="display: inline-block; width: 180px">发起人：{{ printData.initiator.name }}</span>
        <span style="display: inline-block; width: 140px">接收人：{{ printData.heir.name }}</span>
      </div>
      <div>
        <span
          v-for="item in printData.cols"
          :key="item.propertyType"
          style="display: inline-block; width: 90px"
          v-text="item.display + '：' + printData[item.propertyType]"
        />
      </div>
    </div>
    <div
      id="div2"
      class="printView_content"
    >
      <table
        border="1"
        cellSpacing="0"
        width="98%"
        cellPadding="1"
        style=" border-collapse:collapse; font-size: 14px"
        bordercolor="#333333"
      >
        <thead>
          <TR>
            <TD colspan="1">
              <DIV
                style="width: 40px"
                align="center"
              >
                类别
              </DIV>
            </TD>
            <TD colspan="1">
              <DIV
                style="width: 50px"
                align="center"
              >
                床号
              </DIV>
            </TD>
            <TD colspan="1">
              <DIV
                style="width: 60px"
                align="center"
              >
                姓名
              </DIV>
            </TD>
            <TD colspan="1">
              <DIV
                style="width: 90px"
                align="center"
              >
                主诉
              </DIV>
            </TD>
            <TD colspan="1">
              <DIV
                style="width: 90px"
                align="center"
              >
                既往史
              </DIV>
            </TD>
            <TD colspan="1">
              <DIV
                style="width: 90px"
                align="center"
              >
                诊断
              </DIV>
            </TD>
            <TD colspan="1">
              <DIV
                style="width: 155px"
                align="center"
              >
                交接信息
              </DIV>
            </TD>
          </TR>
        </thead>
        <tbody>
          <tr
            v-for="item in printData.shiftRecordItems"
            :key="item.id"
          >
            <td v-html="item.typeDisplay" />
            <td v-html="item.bedName" />
            <td v-html="item.patientName" />
            <td v-html="item.mainSuit" />
            <td v-html="item.previousHistory" />
            <td v-html="item.diagnosis" />
            <td v-html="item.content" />
          </tr>
        </tbody>
      </table>
    </div>
  </div>
</template>
<script>
// 迁移到 hiprint
import { simplePrint, PRINT_TEMPLATE } from '@/utils/printUtils.js'

export default {
  data() {
    return {
      printData: {
        patientInfo: {},
        recordData: {},
        cols: []
      }
    }
  },
  mounted() {},
  methods: {
    /**
     * 使用 hiprint 执行打印
     */
    async printTest() {
      try {
        // 构建打印数据
        const shiftRecordItems = (this.printData.shiftRecordItems || []).map(item => ({
          typeDisplay: item.typeDisplay || '',
          bedName: item.bedName || '',
          patientName: item.patientName || '',
          mainSuit: item.mainSuit || '',
          previousHistory: item.previousHistory || '',
          diagnosis: item.diagnosis || '',
          content: item.content || ''
        }))

        const printData = {
          date: this.printData.date ? this.printData.date.substring(0, 10) : '',
          initiatorName: this.printData.initiator ? this.printData.initiator.name : '',
          heirName: this.printData.heir ? this.printData.heir.name : '',
          shiftRecordItems: shiftRecordItems
        }
        // 使用 hiprint 打印
        await simplePrint(PRINT_TEMPLATE.CHANGE_SHIFT_BILL, printData)
      } catch (error) {
        console.error('护理交接班打印失败:', error)
      }
    }
  }
}
</script>
<style  scoped lang="less">
  .recordBill {
    border: #8d8d8d 1px solid;
    display: grid;
    grid-template-rows: 90px 1fr;
    height: 200px !important;
    width: 740px;

    /deep/ .el-table .cell {
      font-size: 10px !important;
    }
    .printView_header {
      grid-template-rows: 40px 30px 30px;
      height: 200px !important;
      h4{
        text-align: center;
        margin: 15px;
      }
    }
    .printView_content{

    }
  }

</style>
