jonhon-mes-web/src/views/qualityManagement/inspectionArchiving/ERecord/printDialog.vue

<template>
    <el-dialog title="打印预览" append-to-body :modelValue="showPrint" width="80%" @close="closeDialog">
        <el-button v-print="printObj" type="primary" class="printButton">打 印</el-button>
    <div v-loading="loading" id="printMe" ref="printContent" class="printBox">
      <div class="printTitle">电子档案</div>
      <table id="cus-table" cellspacing="0" style="width:100%">
        <template v-if="checkedList[0] && modelOne!= null && modelOne.wo != null">
          <tr>
            <td>订单号</td>
            <td colspan="4">{{ modelOne.wo.woCode || '/' }}</td>
            <td>使用部门</td>
            <td colspan="3">{{ modelOne.wo.pjYieldOrder.useDept || '/' }}</td>
            <td>单位</td>
            <td colspan="2">3400</td>
          </tr>
          <tr>
            <td>零件号</td>
            <td colspan="4">{{ modelOne.dsPart.partCode || '/' }}</td>
            <td>产品型号</td>
            <td colspan="3">{{ modelOne.wo.pjYieldOrder.productType || '/' }}</td>
            <td>生产标识</td>
            <td colspan="2">{{ modelOne.wo.pjYieldOrder.prodIdent || '/' }}</td>
          </tr>
          <tr>
            <td>批次号</td>
            <td colspan="4">{{ modelOne.wo.batchNo || '/' }}</td>
            <td>名称</td>
            <td colspan="3">{{ modelOne.dsPart.partName || '/' }}</td>
            <td>数量</td>
            <td colspan="2">{{ modelOne.wo.pjYieldOrder.poQty || '/' }}</td>
          </tr>
          <tr>
            <td>材料</td>
            <td colspan="4">{{ modelOne.dsPart.material || '/' }}</td>
            <td>零件面积</td>
            <td colspan="3">{{ modelOne.wo.pjYieldOrder.poArea || '/' }}</td>
            <td>设备编码</td>
            <td colspan="2">{{ '' || '/' }}</td>
          </tr>
          <tr>
            <td>镀种</td>
            <td colspan="8">{{ modelOne.wo.pjYieldOrder.plate || '/' }}</td>
            <td>硬度</td>
            <td colspan="2">{{ '' || '/' }}</td>
          </tr>
          <tr>
            <td>标记要求</td>
            <td colspan="8">{{ '' || '/' }}</td>
            <td>工艺规程</td>
            <td colspan="2">{{ '' || '/' }}</td>
          </tr>
          <tr>
            <td>工艺路线</td>
            <td colspan="8">{{ modelOne.wo.pjYieldOrder.primaryCraft || '/' }}</td>
            <td>技术状态</td>
            <td colspan="2">{{ '' || '/' }}</td>
          </tr>
          <tr>
            <td>关键信息</td>
            <td colspan="11">{{ ( modelOne.dsPart.cruxMemo? modelOne.dsPart.cruxMemo :'' +'   '+ modelOne.dsPart.memo?modelOne.dsPart.memo:'') || '/' }}</td>
          </tr>
        </template>
        <template v-if="checkedList[1] && modelTwo && modelTwo.length>0">
          <tr>
            <td colspan="12" style="font-size:21px">生产过程</td>
          </tr>
          <template v-for="(item,index) in modelTwo">

            <!-- 如果存在同槽编号 -->
            <tbody v-if="item.slotList && item.slotList.length>0">
              <tr>
                <td colspan="12">同槽信息</td>
              </tr>
              <tr>
                <td>同槽编号</td>
                <td colspan="3">零件号</td>
                <td colspan="4">批次号</td>
                <td>数量</td>
                <td>生产标识</td>
                <td>面积</td>
                <td>总面积</td>
              </tr>
              <template v-for="(slItems,slIndex) in item.slotList">
                <tr>
                  <td v-if="slIndex ==0" :rowspan="item.slotList.length+1">{{ slItems.mtuCode || '/' }}</td>
                  <td colspan="3">{{ slItems.partCode || '/' }}</td>
                  <td colspan="4">{{ slItems.batchNo || '/' }}</td>
                  <td>{{ slItems.qua || '/' }}</td>
                  <td>{{ slItems.prodIdent || '/' }}</td>
                  <td>{{ slItems.area || '/' }}</td>
                  <td v-if="slIndex ==0" :rowspan="item.slotList.length">{{ slItems.totalArea || '/' }}</td>
                </tr>
              </template>
            </tbody>

            <!-- <tr v-if="item.printType == 1 " :key="item.wpId+item.woCode+index">
              <td colspan="12" />
            </tr> -->
            <tr>
              <td :rowspan="3+(item.prList?item.prList.length+1:0) +((item.flagQty > 0 || item.beltQty > 0) && !item.checked ? 2:0)+(item.procedureSet.special ? 1:0)">{{ item.procedureSet.ppsName || '/' }}</td>
            </tr>
            <tr>
              <td colspan="7">报工时间</td>
              <td colspan="1">操作者</td>
              <td v-if="item.gjCode && !item.fbCode && !item.deviceCode " colspan="3">{{ item.gjCode ? '挂具编号' :'' }}</td>
              <template v-else-if=" item.fbCode && item.deviceCode">
                <td colspan="1">飞拔编号</td>
                <td colspan="2">设备编号</td>
              </template>
              <td v-else colspan="3">{{ (item.gjCode && !item.fbCode && !item.deviceCode)? '设备编号' : '' }}</td>
              <!-- <td colspan="3">设备编号</td> -->
            </tr>
            <tr>
              <td colspan="4">开始时间:{{ item.factStartTime || '/' }}</td>
              <td colspan="3">结束时间:{{ item.factEndTime || '/' }}</td>
              <td colspan="1">{{ item.createMan || '/' }}</td>
              <td v-if="item.gjCode && !item.fbCode && !item.deviceCode " colspan="3">{{ item.gjCode || '/' }}</td>
              <template v-else-if=" item.fbCode && item.deviceCode">
                <td colspan="1">{{ item.fbCode || '/' }}</td>
                <td colspan="2">{{ item.deviceCode || '/' }}</td>
              </template>
              <td v-else colspan="3">{{ item.deviceCode || '/' }}</td>

            </tr>
            <tr v-if="item.procedureSet.special">
              <td colspan="3">接收数</td>
              <td>{{ item.qualifiedQty || '/' }}</td>
              <td />
              <td colspan="2">已合格</td>
              <td>{{ item.workQty || '/' }}</td>
              <td colspan="2">报废数量</td>
              <td>{{ item.scrapQty || '/' }}</td>

            </tr>
            <tr v-if="(item.flagQty > 0 || item.beltQty > 0) && !item.checked">
              <td>色标数量</td>
              <td colspan="2">{{ item.flagQty || '/' }}</td>
              <td>颜色1</td>
              <td>{{ item.flagColourOne || '/' }}</td>
              <td>颜色2</td>
              <td>{{ item.flagColourTwo || '/' }}</td>
              <td>油墨类</td>
              <td>{{ item.flagInk || '/' }}</td>
              <td>物料号</td>
              <td>{{ '' || '/' }}</td>
            </tr>
            <tr v-if="(item.flagQty > 0 || item.beltQty > 0) && !item.checked">
              <td>色带数量</td>
              <td colspan="2">{{ item.beltQty || '/' }}</td>
              <td>颜色1</td>
              <td>{{ item.beltColourOne || '/' }}</td>
              <td>颜色2</td>
              <td>{{ item.beltColourTwo || '/' }}</td>
              <td>油墨类</td>
              <td>{{ item.beltInk || '/' }}</td>
              <td>物料号</td>
              <td>{{ '' || '/' }}</td>
            </tr>

            <tr v-if="item.prList && item.prList.length>0 && item.printType == 1">
              <td :colspan="item.procedureSet.eleStream ? 1:2 ">槽位</td>
              <td :colspan="item.procedureSet.eleRate ? 1:2">入槽时间</td>
              <td :colspan="item.procedureSet.phValue ? 1:2">出槽时间</td>
              <td :colspan="item.procedureSet.niValue ? 1:2">槽内温度(℃)</td>
              <td v-if="item.procedureSet.eleStream">电流(A)</td>
              <td v-if="item.procedureSet.eleRate">电导率</td>
              <td v-if="item.procedureSet.phValue">PH</td>
              <td v-if="item.procedureSet.niValue">NI+</td>
              <td v-if="item.procedureSet.cyropactorControl">整流机控制模块</td>
              <td v-if="item.procedureSet.vSpeed">转速/振频</td>
              <td :colspan="(item.procedureSet.cyropactorControl&&item.procedureSet.vSpeed) ? 1: (!item.procedureSet.cyropactorControl&&!item.procedureSet.vSpeed ? 3:2) ">生产状态</td>
            </tr>
            <template v-for="(prItems,prIndex) in item.prList">
              <tr v-if="item.prList && item.prList.length>0 && item.printType == 1">
                <td :colspan="item.procedureSet.eleStream ? 1:2 ">{{ prItems.workSlot || '/' }}</td>
                <td :colspan="item.procedureSet.eleRate ? 1:2">{{ prItems.inDate || '/' }}</td>
                <td :colspan="item.procedureSet.phValue ? 1:2">{{ prItems.outDate || '/' }}</td>
                <td :colspan="item.procedureSet.niValue ? 1:2">{{ prItems.tempSlot || '/' }}</td>
                <td v-if="item.procedureSet.eleStream">{{ prItems.eleStream || '/' }}</td>
                <td v-if="item.procedureSet.eleRate">{{ prItems.eleRate || '/' }}</td>
                <td v-if="item.procedureSet.phValue">{{ prItems.phValue || '/' }}</td>
                <td v-if="item.procedureSet.niValue">{{ prItems.niValue || '/' }}</td>
                <td v-if="item.procedureSet.cyropactorControl">{{ prItems.cyropactorControl || '/' }}</td>
                <td v-if="item.procedureSet.vSpeed">{{ prItems.vSpeed || '/' }}</td>
                <td :colspan="(item.procedureSet.cyropactorControl&&item.procedureSet.vSpeed) ? 1: (!item.procedureSet.cyropactorControl&&!item.procedureSet.vSpeed ? 3:2) ">{{ prItems.productStatus || '/' }}</td>
              </tr>
            </template>
            <!-- <tr v-if="item.qcProduceRun && item.qcProduceRun.prId && item.printType == 1" :key="item.wpId+item.woCode+index">
              <td rowspan="3">烘干</td>
              <td colspan="6">报工时间</td>
              <td colspan="2">操作者</td>
              <td colspan="2">设备编号</td>
            </tr> -->
            <!-- <tr v-if="item.qcProduceRun && item.qcProduceRun.prId && item.printType == 1" :key="item.wpId+item.woCode+index">
              <td colspan="2">开始时间:{{ item.qcProduceRun.inDate }}</td>
              <td colspan="4">结束时间:{{ item.qcProduceRun.outDate }}</td>
              <td colspan="2">{{ item.createMan }}</td>
              <td colspan="2">222</td>
            </tr> -->
            <!-- <tr v-if="item.qcProduceRun && item.qcProduceRun.prId && item.printType == 1" :key="item.wpId+item.woCode+index">
              <td colspan="2">烘箱温度(℃)</td>
              <td colspan="8">{{ item.qcProduceRun.tempSlot }}</td>
            </tr> -->

          </template>
        </template>

        <template v-if="checkedList[2]">
          <tr>
            <td colspan="12">
              <div style="font-size:21px">检验记录</div>
            </td>
          </tr>
          <tr>
            <td>项目编号</td>
            <td colspan="4">检测项目</td>
            <td>测试值</td>
            <td>设备量具编码</td>
            <td>试验数</td>
            <td>抽样数</td>
            <td>检验结果</td>
            <td>检验员</td>
            <td>检验日期</td>
          </tr>
          <template v-for="(items,indexs) in modelThree.checkList">
            <tr>
              <td>{{ items.testOrders || '/' }}</td>
              <td colspan="1">{{ items.cccList[0].testName || '/' }}</td>
              <td colspan="3">{{ items.cccList[0].trialStandard || '/' }}</td>
              <td>{{ items.cccList[0].checkValue || '/' }}</td>
              <td>{{ ''|| '/' }}</td>
              <td>{{ items.testQty || '/' }}</td>
              <td>{{ items.checkQty || '/' }}</td>
              <td>{{ items.checkResult || '/' }}</td>
              <td>{{ items.checkName || '/' }}</td>
              <td>{{ items.checkDate || '/' }} </td>
            </tr>
          </template>
        </template>

        <tbody v-if="checkedList[3]">
          <tr>
            <td colspan="12">
              <div style="font-size:21px">镀后入库记录</div>
            </td>
          </tr>
          <tr>
            <td>车间订单</td>
            <td colspan="3">{{ modelFour.woCode || '/' }}</td>
            <td>流程卡号</td>
            <td colspan="3">{{ modelFour.prWorkOrder.cardNo || '/' }}</td>
            <td>批次</td>
            <td colspan="3">{{ modelFour.prWorkOrder.batchNo || '/' }}</td>
          </tr>
          <tr>
            <td>产品号</td>
            <td colspan="3">{{ modelFour.prWorkOrder.pjYieldOrder.partCode|| '/' }}</td>
            <td>产品型号</td>
            <td colspan="3">{{ modelFour.prWorkOrder.pjYieldOrder.productType || '/' }}</td>
            <td>产品名</td>
            <td colspan="3">{{ modelFour.prWorkOrder.pjYieldOrder.partName || '/' }}</td>
          </tr>
          <tr>
            <td>镀种信息</td>
            <td colspan="3">{{ modelFour.prWorkOrder.pjYieldOrder.plate|| '/' }}</td>
            <td>当前工序</td>
            <td colspan="3">{{ modelFour.procedureSet.ppsName || '/' }}</td>
            <td>接收数</td>
            <td colspan="3">{{ modelFour.qualifiedQty || '/' }}</td>
          </tr>
          <tr>
            <td>已合格数</td>
            <td colspan="3">{{ modelFour.passQualifiedQty || '/' }}</td>
            <td>接收数量</td>
            <td colspan="3">{{ modelFour.scrapQty || '/' }}</td>
            <td>报废数量</td>
            <td colspan="3">{{ modelFour.scrapQty || '/' }}</td>
          </tr>
          <template v-if="modelFour.printType == 1">
            <tr>
              <td colspan="12"> 生产过程 </td>
            </tr>
          </template>
        </tbody>

      </table>
    </div>
    </el-dialog>
</template>

<script>
export default {
    props:{
        showPrint: {
            type: Boolean,
            default: false
        },
        checkedList: {
            type: Array,
            default: () => []
        },
    },
    data(){
        return{
            printObj: {
                id: 'printMe',
                popTitle: '打印66',
                ignoreClass: 'noprint',
                endCallback: (e) => {
                console.log(e, 5555);
                }
            },
            modelOne: {
                wo: { pjYieldOrder: {}},
                checkList: [],
                wpList: [
                {
                    prWorkOrder: { pjYieldOrder: {}},
                    procedureSet: {},
                    partCode: '',
                    woCode: ''
                }
                ],
                dsPart: {}
            },
            modelTwo: [],
            modelThree: { checkList: [], procedureSet: {}},
            modelFour: { procedureSet: {}, prWorkOrder: { pjYieldOrder: {}}},
        }
    },
    methods:{
        closeDialog(){
            this.$emit('closeDialog');
        },
    }
}
</script>

<style lang="scss" scoped>
    .printButton {
  float: right;
  margin-right: 8px;
  margin-top: 16px;
}
.printBox {
  width: 100%;
  padding: 6px;
  text-align: center;
  .printTitle {
    font-size: 22px;
    font-weight: 700;
    padding: 8px;
    // margin-bottom: 6px;
  }
}

table {
  tr {
    page-break-inside: avoid;
  }
  td {
    width: 125px;
    height: 30px;
    border: 1px solid #000;
    background: transparent;
    color: #000;
    font-size: 14px;
    text-align: center;
    padding: 0;
    margin: 0;
  }
}
@media print {
  @page {
    size: auto;
    margin: 6mm;
  }
}
</style>