<template>
  <div>
    <div id="printContract">
      <h2 class="text-center title">承接合同评审表</h2>
      <table border="1">
        <tr>
          <td :colspan="1" class="fontbold">合同名称</td>
          <td :colspan="8">{{ form.contractName }}</td>
        </tr>
        <tr>
          <td :colspan="1" class="fontbold">甲方单位</td>
          <td :colspan="8">{{ getPartyAName(form.partyAId) }}</td>
        </tr>
        <tr>
          <td :colspan="1" class="fontbold">合同编码</td>
          <td :colspan="4">{{ form.contractCode }}</td>
          <td :colspan="1" class="fontbold">合同编号</td>
          <td :colspan="3">{{ form.contractNumber }}</td>
        </tr>
        <tr>
          <td :colspan="1" class="fontbold">合同金额</td>
          <td :colspan="4">{{ form.amount }}元</td>
          <td :colspan="1" class="fontbold">履约保证金</td>
          <td :colspan="3">{{ form.deposit }}元</td>
        </tr>
        <tr>
          <td :colspan="1" class="fontbold">合同文件</td>
          <td :colspan="8">{{ getFileName(form.contractDocument) }}</td>
        </tr>
        <tr>
          <td :colspan="1" class="fontbold">关联项目</td>
          <td :colspan="8">
            <div v-for="(project, index) in chooseProjectList" :key="index">
              {{ index + 1 }}. {{ project.projectName }} ({{ project.projectNumber }})
            </div>
          </td>
        </tr>
        <tr>
          <td :colspan="1" class="fontbold">合同计划工作量</td>
          <td :colspan="8">
            <table border="1" style="width:100%;">
              <tr>
                <td style="width:50px;">序号</td>
                <td style="min-width:100px;">工作内容</td>
                <td style="min-width:120px;">等级或比例尺</td>
                <td style="min-width:80px;">单位</td>
                <td style="min-width:80px;">工作量</td>
                <td style="min-width:120px;">要求完成时间</td>
                <td style="min-width:150px;">备注</td>
              </tr>
              <tr v-for="(work, idx) in workList" :key="idx">
                <td>{{ idx + 1 }}</td>
                <td>{{ work.content }}</td>
                <td>{{ work.scale }}</td>
                <td>{{ work.unit }}</td>
                <td>{{ work.workload }}</td>
                <td>{{ work.deadline }}</td>
                <td>{{ work.remark }}</td>
              </tr>
              <tr v-if="!workList || workList.length === 0">
                <td colspan="7">无</td>
              </tr>
            </table>
          </td>
        </tr>
        <tr>
          <td :colspan="1" class="fontbold">合同回款计划</td>
          <td :colspan="8">
            <table border="1" style="width:100%;">
              <tr>
                <td style="width:50px;">序号</td>
                <td style="min-width:100px;">回款条件</td>
                <td style="min-width:100px;">回款比例（%）</td>
                <td style="min-width:100px;">回款金额（元）</td>
                <td style="min-width:100px;">预计时间</td>
                <td style="min-width:100px;">备注</td>
              </tr>
              <tr v-for="(payment, idx) in paymentList" :key="idx">
                <td>{{ idx + 1 }}</td>
                <td>{{ payment.paymentCondition }}</td>
                <td>{{ payment.paymentPercentage }}</td>
                <td>{{ payment.paymentAmount }}</td>
                <td>{{ payment.paymentTime }}</td>
                <td>{{ payment.remark }}</td>
              </tr>
              <tr v-if="!paymentList || paymentList.length === 0">
                <td colspan="6">无</td>
              </tr>
            </table>
          </td>
        </tr>
        <tr>
          <td :colspan="1" class="fontbold">合同备注</td>
          <td :colspan="8" style="white-space: pre-wrap;">{{ form.remark }}</td>
        </tr>
        <tr>
          <td :colspan="1" class="fontbold">拟稿人</td>
          <td :colspan="4">{{ form.draftUser ? form.draftUser.nickName : '' }}</td>
          <td :colspan="1" class="fontbold">日期</td>
          <td :colspan="3">{{ form.draftTime }}</td>
        </tr>
        <tr v-if="form.commentType === '1'">
          <td :colspan="1" class="fontbold">会议评审</td>
          <td :colspan="8">
            <div>评审时间：{{ meetingForm.meetingTime }}</div>
            <div>评审地点：{{ getPlaceName(meetingForm.place) }}</div>
            <div>评审主持人：{{ meetingForm.hostUser ? meetingForm.hostUser.nickName : '' }}</div>
            <div>评审结论：{{ meetingForm.conclusion }}</div>
            <div>主持人签名：{{ meetingForm.hostUser ? meetingForm.hostUser.nickName : '' }}</div>
            <div>日期：{{ meetingForm.commentTime }}</div>
          </td>
        </tr>
        <tr v-if="form.commentType === '2'">
          <td :colspan="1" class="fontbold">线上会审</td>
          <td :colspan="8">
            <table border="1" style="width:100%;margin:0;">
              <tr>
                <td style="width:50px;">序号</td>
                <td>会审部门</td>
                <td>会审人</td>
                <td>会审意见</td>
                <td style="min-width:50px;">签名</td>
                <td style="min-width:90px;">日期</td>
              </tr>
              <tr v-for="(comment, index) in commentList" :key="index">
                <td>{{ index + 1 }}</td>
                <td>{{ getDeptName(comment.deptId) }}</td>
                <td>{{ comment.commentUser ? comment.commentUser.nickName : '' }}</td>
                <td style="white-space: pre-wrap;">{{ comment.comment }}</td>
                <td><span class="auditor">{{ comment.commentUser ? comment.commentUser.nickName : '' }}</span></td>
                <td>{{ comment.commentTime }}</td>
              </tr>
            </table>
          </td>
        </tr>
        <tr>
          <td :colspan="1" class="fontbold">分管审批意见</td>
          <td :colspan="4">{{ form.managerComment }}</td>
          <td :colspan="1" class="fontbold">签名</td>
          <td :colspan="2"><span class="auditor">{{ form.managerUser ? form.managerUser.nickName : '' }}</span></td>
          <td :colspan="1" style="min-width:90px;">{{ form.managerTime }}</td>
        </tr>
        <tr>
          <td :colspan="1" class="fontbold">总经理审批意见</td>
          <td :colspan="4">{{ form.gmComment }}</td>
          <td :colspan="1" class="fontbold">签名</td>
          <td :colspan="2"><span class="auditor">{{ form.gmUser ? form.gmUser.nickName : '' }}</span></td>
          <td :colspan="1" style="min-width:90px;">{{ form.gmTime }}</td>
        </tr>
        <tr>
          <td :colspan="1" class="fontbold">签订备注</td>
          <td :colspan="4">{{ form.signRemark }}</td>
          <td :colspan="1" class="fontbold">签订日期</td>
          <td :colspan="3" style="min-width:90px;">{{ form.signDate }}</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 {
  name: 'ContractPrint',
  props: {
    form: {
      type: Object,
      required: true
    },
    chooseTender: {
      type: Object,
      default: () => ({})
    },
    chooseProjectList: {
      type: Array,
      default: () => []
    },
    connectSubContractList: {
      type: Array,
      default: () => []
    },
    meetingForm: {
      type: Object,
      default: () => ({})
    },
    commentList: {
      type: Array,
      default: () => []
    },
    partyAList: {
      type: Array,
      default: () => []
    },
    deptList: {
      type: Array,
      default: () => []
    },
    placeList: {
      type: Array,
      default: () => []
    },
    workList: {
      type: Array,
      default: () => []
    },
    paymentList: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      print: {
        id: 'printContract',
        popTitle: '承接合同打印', // 打印配置页上方标题
        extraHead: '', //最上方的头部文字，附加在head标签上的额外标签,使用逗号分隔
        preview: false, // 是否启动预览模式，默认是false（开启预览模式，可以先预览后打印）
        previewTitle: '', // 打印预览的标题（开启预览模式后出现）,
        previewPrintBtnLabel: '', // 打印预览的标题的下方按钮文本，点击可进入打印（开启预览模式后出现）
        zIndex: '', // 预览的窗口的z-index，默认是 20002（此值要高一些，这涉及到预览模式是否显示在最上面）
        previewBeforeOpenCallback() { }, //预览窗口打开之前的callback（开启预览模式调用）
        previewOpenCallback() { }, // 预览窗口打开之后的callback（开启预览模式调用）
        beforeOpenCallback() { }, // 开启打印前的回调事件
        openCallback() { }, // 调用打印之后的回调事件
        closeCallback() { }, //关闭打印的回调事件（无法确定点击的是确认还是取消）
        url: '',
        standard: '',
        extraCss: ''
      }
    }
  },
  methods: {
    getPartyAName(partyAId) {
      const partyA = this.partyAList.find(item => item.partyAId === partyAId)
      return partyA ? partyA.partyAName : ''
    },
    getPlaceName(placeId) {
      const place = this.placeList.find(item => item.id === placeId)
      return place ? place.name : ''
    },
    getFileName(name) {
      if (name) {
        let arr = name.split('/')
        return arr[arr.length - 1]
      }
      return ''
    }
  }
}
</script>

<style lang="scss" scoped>
table {
  width: 90%;
  text-align: left;
  border-collapse: collapse;
  margin: 0 auto;
  border: 1px solid #a5abb0;

  td {
    padding: 15px;
  }
}

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

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

@page {
  size: auto;
  margin-bottom: 0;
}

@media print {
  #printContract table {
    width: 100%;
  }
}
</style>