<template>
  <div>
    <div id="printRecruit">
      <div class="text-center title">招聘申请表</div>
      <table border="1">
        <tr>
          <td :colspan="2" class="fontbold">申请人</td>
          <td :colspan="2">{{ getUserName(form.applier) }}</td>
          <td :colspan="2" class="fontbold">申请部门</td>
          <td :colspan="3">{{  getDeptName(form.applyDept) }}</td>
        </tr>
        <tr>
          <td :colspan="2" class="fontbold">项目编号</td>
          <td :colspan="2">{{ form.project.projectNumber ? form.project.projectNumber : '无' }}</td>
          <td :colspan="2" class="fontbold">项目名称</td>
          <td :colspan="3">{{ form.project.projectName ? form.project.projectName:'无' }}</td>
        </tr>
        <tr>
          <td :colspan="2" class="fontbold">岗位名称</td>
          <td :colspan="4">{{ form.postName }}</td>
          <td :colspan="2" class="fontbold">招聘人数</td>
          <td :colspan="1">{{ form.postNumber }}</td>
        </tr>
        <tr>
          <td :colspan="2" class="fontbold">岗位职责</td>
          <td :colspan="7" style="white-space: pre-wrap;"><div  class="minHeight">{{ form.duty }}</div></td>
        </tr>
        <tr>
          <td :colspan="2" class="fontbold">任职资格</td>
          <td :colspan="7" style="white-space: pre-wrap;"><div class="minHeight">{{ form.qualification }}</div></td>
        </tr>
        <tr>
          <td :colspan="2" class="fontbold">薪资待遇</td>
          <td :colspan="7" style="white-space: pre-wrap;"><div  class="minHeight">{{ form.wage }}</div></td>
        </tr>
        <tr>
          <td :colspan="2" class="fontbold">部门意见</td>
          <td :colspan="3"><div class="minHeight">{{ form.deptComment }}</div></td>
          <td :colspan="2" style="text-align:left;min-width:120px;">签名：<span class="auditor">{{
            getUserName(form.deptUserId) }}</span></td>
          <td :colspan="2" style="text-align:left;width:240px;">日期：{{ form.deptTime }}</td>
        </tr>
        <tr>
          <td :colspan="2" class="fontbold">分管审批意见</td>
          <td :colspan="3"><div class="minHeight">{{ form.managerComment }}</div></td>
          <td :colspan="2" style="text-align:left;min-width:120px;">
            签名：<span class="auditor">{{ getUserName(form.managerUserId) }}</span>
          </td>
          <td :colspan="2" style="text-align:left;width:240px;">日期：{{ form.managerTime }}</td>
        </tr>
         <tr>
          <td :colspan="2" class="fontbold">总经理审批意见</td>
          <td :colspan="3"><div class="minHeight">{{ form.zjlComment }}</div></td>
          <td :colspan="2" style="text-align:left;min-width:120px;">
            签名：<span class="auditor">{{ getUserName(form.zjlUserId) }}</span>
          </td>
          <td :colspan="2" style="text-align:left;width:240px;">日期：{{ form.zjlTime }}</td>
        </tr>
      </table>
    </div>
    <div class="text-center mt20">
      <el-button type="primary" v-print="print">确认打印</el-button>
      <el-button @click="$emit('cancel')">取消</el-button>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    form: {
      type: Object
    }
  },
  data() {
    return {
      settleSum: {},
      deptSettleList: [],
      deductionsList: [],
      actualSumSettle: '',
      print: {
        id: 'printRecruit',
        popTitle: '招聘申请表', // 打印配置页上方标题
        extraHead: '', //最上方的头部文字，附加在head标签上的额外标签,使用逗号分隔
        preview: false, // 是否启动预览模式，默认是false（开启预览模式，可以先预览后打印）
        previewTitle: '', // 打印预览的标题（开启预览模式后出现）,
        previewPrintBtnLabel: '', // 打印预览的标题的下方按钮文本，点击可进入打印（开启预览模式后出现）
        zIndex: '', // 预览的窗口的z-index，默认是 20002（此值要高一些，这涉及到预览模式是否显示在最上面）
        previewBeforeOpenCallback() { }, //预览窗口打开之前的callback（开启预览模式调用）
        previewOpenCallback() { }, // 预览窗口打开之后的callback（开启预览模式调用）
        beforeOpenCallback() { }, // 开启打印前的回调事件
        openCallback() { }, // 调用打印之后的回调事件
        closeCallback() { }, //关闭打印的回调事件（无法确定点击的是确认还是取消）
        url: '',
        standard: '',
        extraCss: ''
      }
    }
  },
}
</script>

<style lang="scss" scoped>
table {
  /*边框*/
  /* border: 1px solid black; */
  width: 90%;
  // text-align: center;
  border-collapse: collapse;
  margin: 0 auto;
  table-layout: fixed; 

  /*设置背景颜色*/
  /* background-color: #bfa; */
  td {
    padding: 5px;
    word-wrap: break-word;
    word-break: break-all;
    overflow-wrap: break-word;
    // line-height: 30px;
  }
}

.header {
  font-family: '黑体';
  font-size: 16px;
  font-weight: bold;
  line-height: 30px;
}

.bg {
  background-color: #eee;
  -webkit-print-color-adjust: exact;
}

.title {
  font-family: '黑体';
  font-size: 20px;
  font-weight: bold;
  line-height: 30px;
}

.fontbold {
  font-weight: bold;
  min-width: 150px;
  text-align: center;
}

.conment-width {
  // max-width: 200px;
}


@page {
  size: auto;
  /* 去除页脚 */
  margin-bottom: 0;
  // 横向A4
  // size:A4 landscape;
}

@media print {
  #print table {
    width: 100%;
  }
}

.minHeight{
  min-height: 100px;
}
</style>