<template>
  <el-button @click="printClick(2)">横向打印</el-button>
  <el-button @click="printClick(1)">竖向打印</el-button>
  <el-radio v-model="paperSize" label="A4" size="large">A4</el-radio>
  <el-radio v-model="paperSize" label="A5" size="large">A5</el-radio>
  <div ref="printRef">
    <div style="width:394pt;height:570pt;background-color: white;font-size: 9.75pt;">
      <div style="font-size: 18pt;text-align: center;font-weight:bold;">
        长沙泰和医院
      </div>
      <div style="text-align: center;margin-top: 3.75pt">
        {{ patInfo.title }}
      </div>

      <table class="no_border">
        <tr>
          <td>病人身份：{{ patInfo.responceTypeName }}</td>
          <td>单号：{{ patInfo.reqNo }}</td>
          <td>
            急诊： {{ judgeWhetherItIsEmergency(patInfo.zFlag) }}
          </td>
        </tr>
      </table>

      <div style="border-top: 0.75pt dashed black; border-bottom: 0;width: 100%">
        <table class="no_border">
          <tr>
            <td>住院号：{{ patInfo.inpatientNo }}</td>
            <td>姓名：{{ patInfo.pname }}</td>
            <td>性别：{{ cptSex(patInfo.sex) }}</td>
            <td>年龄：{{ patInfo.page }}</td>
            <td>床号：{{ patInfo.bedNo }}</td>
          </tr>

          <tr>
            <td colspan="3">病人住址: {{ patInfo.homeStreet }}</td>
            <td colspan="2" style="width: 90pt">联系电话:{{ patInfo.homeTel }}</td>
          </tr>
        </table>

      </div>

      <table class="table_border" cellspacing=0>
        <tr>
          <td class="describe" style="border-right: 0;border-top: 0.75pt solid black">
            <div style="height: 5px"/>
            病史摘要<br>
            申请检查<br>
            要求：
          </td>
          <td style=" border-top: 0.75pt solid black">
            {{ patInfo.reqComment }}
          </td>
        </tr>

        <tr>
          <td class="describe" style="border-right: 0">
            <div style="height: 5px"/>
            体征
          </td>
          <td>
            {{ patInfo.reqTzComment }}
          </td>
        </tr>

        <tr>
          <td class="describe" style="border-right: 0">
            <div style="height: 5px"/>
            相关辅检<br>
            结果
          </td>
          <td>
            {{ patInfo.reqOtherResult }}
          </td>
        </tr>

        <tr>
          <td class="describe" style="border-right: 0">
            <div style="height: 5px"/>
            临床诊断
          </td>
          <td>
            {{ patInfo.diagText }}
          </td>
        </tr>

        <tr>
          <td class="describe" style="border-right: 0">
            <div style="height: 5px"/>
            检查部位<br>
            及项目
          </td>
          <td>
            {{ patInfo.orderName }}
          </td>
        </tr>

        <tr>
          <td class="describe" style="border-right: 0;height: 30pt">
          </td>
          <td>
            <table style="width: 100%">
              <tr>
                <td style="border: 0">
                  申请科室：{{ patInfo.reqDeptName }}
                </td>
                <td style="border: 0">
                  申请医生： {{ patInfo.reqDoctorName }}
                </td>
              </tr>
              <tr>
                <td style="border: 0">
                  申请日期：{{ patInfo.reqDate }}
                </td>
                <td style="border: 0">
                  医师签字：
                </td>
              </tr>
            </table>
          </td>
        </tr>
      </table>
      <div style="margin-left: 7.5pt; max-height: 187.5pt">
        <div>
          注意事项：
        </div>
        <div>
          <pre style="margin: 3.75pt 0 0;">{{ mattersNeedingAttention }}</pre>
        </div>
      </div>
    </div>
  </div>
</template>

<script setup name='PrintCheckV2'>

import {getLodop, initLodop} from "@/utils/c-lodop";
import {stringIsBlank} from "@/utils/blank-utils";
import {cptSex} from "@/utils/computed";


const printRef = ref()
const printClick = (flag) => {
  let LODOP = getLodop()
  let css = `<style>
table{
width: 100%;
}

table td{
  font-size: 9pt;
}
.no_border {
  border: 0;
  width: 100%;
}
.table_border {
  width: 100%;
}

.table_border td {
    border: 0.75pt solid black;
    border-top: 0;
    vertical-align: baseline;
  }

.describe {
  width: 52.5pt;
  height: 52.5pt;
  text-align: center;
  font-size: 9pt;
}</style>`
  let strFormHtml = css + '<body style="width:394pt;height:570pt">' + printRef.value.innerHTML + '</body>'
  LODOP.PRINT_INIT(0, 0, 522, 333, '检查申请') // 初始化打印机 名字
  LODOP.SET_PRINT_PAGESIZE(flag, 0, 0, paperSize)
  LODOP.ADD_PRINT_HTML(0, 0, '100%', '100%', strFormHtml)
  LODOP.PREVIEW()
}


let patInfo = $ref({})
let title = '检查申请单'
let mattersNeedingAttention = $ref('')
let paperSize = $ref('A5')
const fillData = (data) => {
  patInfo = data.data
  title = data.title
  mattersNeedingAttention = data.mattersNeedingAttention
}

const judgeWhetherItIsEmergency = (val) => {
  if (stringIsBlank(val)) return
  if (val === '1') {
    return '√'
  }
}

defineExpose({
  fillData
})

onMounted(() => {
  initLodop()
})

</script>

<style scoped>
table {
  width: 100%;
}

table td {
  font-size: 9pt;
}

.no_border {
  border: 0;
  width: 100%;
}

.table_border {
  width: 100%;
}

.table_border td {
  border: 0.75pt solid;
  border-top: 0;
  vertical-align: baseline;
}

.describe {
  width: 52.5pt;
  height: 52.5pt;
  text-align: center;
  font-size: 9pt;
}

</style>
