Common Components
On this page

文档打印 ​

点击查看代码
javascript
import { FormItemControlType } from "@nbicc/common-components";
import { ref, watch } from "vue";

const nPrintRef = ref();

const data = ref({ size: "A4" });
const fields = ref([]);

watch(
  () => ({ size: data.value.size }),
  ({ size }) => {
    const _fields = [
      [
        { name: "size", label: "尺寸", type: FormItemControlType.SELECT, initialValue: "custom" },
        {
          options: [
            { label: "自定义", value: "custom" },
            { label: "A5", value: "A5" },
            { label: "A4", value: "A4" },
            { label: "A3", value: "A3" },
            { label: "B5", value: "B5" },
            { label: "B4", value: "B4" },
            { label: "JIS-B5", value: "JIS-B5" },
            { label: "JIS-B4", value: "JIS-B4" },
            { label: "letter", value: "letter" },
            { label: "legal", value: "legal" },
            { label: "ledger", value: "ledger" }
          ]
        }
      ]
    ];

    if (size === "custom") {
      _fields.push(
        [
          {
            name: "width",
            label: "宽度",
            type: FormItemControlType.INPUT_NUMBER,
            initialValue: 80
          },
          { addonAfter: "mm", min: 20 }
        ],
        [
          {
            name: "height",
            label: "高度",
            type: FormItemControlType.INPUT_NUMBER,
            initialValue: 61
          },
          { addonAfter: "mm", min: 20 }
        ]
      );
    }

    _fields.push(
      [
        {
          name: "margin",
          label: "外边距",
          type: FormItemControlType.INPUT_NUMBER,
          initialValue: 1
        },
        { addonAfter: "mm" }
      ],
      [
        {
          name: "padding",
          label: "内边距",
          type: FormItemControlType.INPUT_NUMBER,
          initialValue: 1
        },
        { addonAfter: "mm" }
      ],
      [
        {
          name: "orientation",
          label: "方向",
          type: FormItemControlType.RADIO_GROUP,
          initialValue: "portrait"
        },
        {
          options: [
            { label: "纵向", value: "portrait" },
            { label: "横向", value: "landscape" }
          ]
        }
      ],
      [
        {
          name: "pagingMode",
          label: "分页模式",
          type: FormItemControlType.RADIO_GROUP,
          initialValue: "table"
        },
        {
          options: [
            { label: "自动", value: "auto" },
            { label: "裁剪", value: "clip" },
            { label: "紧凑", value: "compact" },
            { label: "表格", value: "table" }
          ]
        }
      ],
      [{ name: "title", label: "标题", type: FormItemControlType.INPUT, initialValue: "打印测试" }]
    );

    _fields.push(
      [
        {
          name: "hostname",
          label: "C-LODOP 服务地址",
          type: FormItemControlType.INPUT,
          initialValue: "localhost"
        },
        { type: "url" }
      ],
      { name: "port", label: "端口", type: FormItemControlType.INPUT_NUMBER, initialValue: 8000 },
      {
        name: "standbyPort",
        label: "备用端口",
        type: FormItemControlType.INPUT_NUMBER,
        initialValue: 18000
      }
    );

    fields.value = _fields;
  },
  { immediate: true }
);

function handleClose() {
  console.log("打印关闭");
}
html
<template>
  <n-form v-model:data="data" :fields="fields" :field-layout="{ span: 12 }" />

  <a-space>
    <n-button type="primary" @click="nPrintRef.print()">通过 ref 实例接口打印</n-button>
  </a-space>

  <NPrintLodop
    ref="nPrintRef"
    :size="data.size === 'custom' ? [`${data.width}mm`, `${data.height}mm`] : data.size"
    :margin="`${data.margin}mm`"
    :padding="`${data.padding}mm`"
    :orientation="data.orientation"
    :paging-mode="data.pagingMode"
    :title="data.title"
    :service-config="{ hostname: data.hostname, port: data.port, standbyPort: data.standbyPort }"
    @close="handleClose"
  >
    <template #toolbar="{ print }">
      <n-button type="primary" @click="print">通过 slot 打印</n-button>
    </template>

    <n-print-page>
      <div class="container">
        <table>
          <colgroup>
            <col style="width: 12.5%" />
            <col style="width: 12.5%" />
            <col style="width: 12.5%" />
            <col style="width: 12.5%" />
            <col style="width: 12.5%" />
            <col style="width: 12.5%" />
            <col style="width: 12.5%" />
            <col style="width: 12.5%" />
          </colgroup>
          <thead class="note-header">
            <tr>
              <th>中科数动</th>
              <th colspan="6" style="text-align: center; font-size: 32px; letter-spacing: 10px">
                生产任务单
                <span tdata="pageNO" format="#">第#页</span>
                <span tdata="pageCount" format="#">总共 #页</span>
              </th>
              <th>
                <div id="qrcode-0" title="TF2306300001">
                  <canvas width="100" height="100" style="display: none"></canvas>
                  <img
                    alt="Scan me!"
                    style="display: block"
                    src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAAAXNSR0IArs4c6QAABTBJREFUeF7tXduSqzAMK///0T3DabsTArElYSh0tK8EJ7Fs+ZLQnR6Px/Nx4N/zuV/8NE1/K6yQNwtrZbbbj+SP3qlU37zT/RoLVlShQANSCLkB4ZS58JBq5c1LaWUe4fLqmkde168xWr86dwtRP58BSYzGgHAevvBA5tXbeQhDL9VWFNEGo/SIGlAqRfdWpa8hZVVNoPCsAXmbEmo1vZWiVoRatwExIENbQY2tilG+SlnMJj4a6ymwomiM1mFAEl4zIADxo1bUi7KHrHtqX6WsEdYKUJndoNmeWqkza44M2IB0SBqQDdNmrC3zjFEygHonSsfMmu0hXb8qAvGyHoJaXhao0WJTPRhCLThb52i/qnxUf5ft9hqQF4SXab8bkA1AUDdjxqEuH1XcZz5jYgijB3TsqWfq6GaZarwaLHSNqILZcQZkx4khq2xkvAG5GiBPtKeAwJuMQemgirLa5aAd3YJt7hIxGZDlzZhd2ix42YAQVXyBvlMREiBM36ZdQURF0TiUeqLdHj03w/xhZqhQlgFZQ29AUudfDrCHbCjsaKX8BGW1t99Rt2NSSPQSgjKuB4BJl5W4pPbbsnUu1mJAxt+KUIpsvmHJ2DQE1oBcGJAM2c9zNBbM41EajOaubiDOc41kot2EbG8qBUu9LAPyMh80pqDj/huK8kmbATkJEAbJEcUwmc4oW2MAR1PdiIqOoEtUZj8OPsJFq3MDkkfiSJcGJNGfmlDYQ5LOwG0oq20uMhX4yALUtBFNE1ecW/CjAkfPzeh10X5nXjQg41omMpqs+jcgQZGYhWfUsxhDh4M6GqSYlLWiikfXlVnm5zmaTfaFoUrVctqLbtyArItGJqGwh3SWZg/JiHrHc4a7L0lZ7d5Vfq+yMBQH9O4wKo8ZpwZ1+DzEgDBw6GmvAeH0DI8+xEMqKnW033NE6hl5tRJDmE4ACggl04DEDoEaGxNzQ5kGxID8aWBkVUym9nOUhd46QV03sjfm8KqVcwRXj+TDEZ34riSKIXLrxICsoVJroPITQ6ZfhVIKep5fFTxv4SEo3TDpJOpZqKKr5j6TEqm0F70GFLmn6gVKbDAgb20bkDV/KAY1SwlZwx6C96QY6onoHy4M0ZRPPR1jDmpGa1HnRlNPNWGJ2kLMmku+MUTTPwPygi3SlwHpTPsnPETNstBaQE2JVc+N9oNSKUr/Kyqt/gq3oj0S8TEaLDNqULNGA0J89MMEz8sCoqS9aMbSWylj3RW0gVIWSp0qDTHvwR/soL2mKroxIAmMBoSxc32sPaTTnXo4pkOwfFOqQ9TJmaA7oqyK4nKWPWpfqPIZIEO2UdJeA7LWgAF56wQtGqPMUMnGmEyTSXTgGKJ6RcVmo7RUTTbQ/aDrV+l4BSxah6AbiKxB5WcDomp/4z3UwtApGVAZXh/Nj67fHgLEkNsDogZIlFJQKzoiLqBNT8YD0X1H3t/PV/IFFbowA5KnywZkxw1E1BBLPIThXzXwjapxNMBHFXdWJ6Dtd2YtJfsZ3e01ICoUr/fUeHzqf2ljLrmh6kDvRqHxC503G2dAiF946y2YYYMMiM/zWwDCBLfqjatKR1Nw5rZKKPPMGGJA8vhyagwxIBcHRA3ISN+pT4kjY5D5PvitrvD+bvCjy1/1EAOyUbl/M4YYEAOyyVy3oCw07WRaFKjMM4q4UetETV+ZLnGUgp/aXDQgLw0YkA1LuIWHoBbMjFP5uZ1DDf7VHV20amdaMyuKPPOSAwOkAVG1lbxnD4ljhj1kh+GdQVn/ALWu4vuLU6FVAAAAAElFTkSuQmCC"
                  />
                </div>
              </th>
            </tr>
            <tr>
              <td colspan="2">任务单号: TF2306300001</td>
              <td colspan="2">销售单号:20230612</td>
              <td colspan="2">计划单号:PF2306180006</td>
              <td colspan="2">分配时间:2023-06-30 12:00:00</td>
            </tr>
          </thead>

          <tbody>
            <tr>
              <th>产品编号</th>
              <th>产品名称</th>
              <th>规格型号</th>
              <th>颜色</th>
              <th>单位</th>
              <th>任务数量</th>
              <th>任务开始时间</th>
              <th>任务完成时间</th>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
          </tbody>

          <tfoot>
            <tr style="height: 40mm">
              <td>备注:</td>
              <td colspan="7"></td>
            </tr>
            <tr>
              <td>车间产线：</td>
              <td>车间02/产线02</td>
              <td>开工时间：</td>
              <td colspan="2"></td>
              <td>产线长签字:</td>
              <td colspan="2"></td>
            </tr>
          </tfoot>
        </table>
      </div>
    </n-print-page>
    <n-print-page>
      <div class="container">
        <table>
          <colgroup>
            <col style="width: 12.5%" />
            <col style="width: 12.5%" />
            <col style="width: 12.5%" />
            <col style="width: 12.5%" />
            <col style="width: 12.5%" />
            <col style="width: 12.5%" />
            <col style="width: 12.5%" />
            <col style="width: 12.5%" />
          </colgroup>
          <thead class="note-header">
            <tr>
              <th>中科数动</th>
              <th colspan="6" style="text-align: center; font-size: 32px; letter-spacing: 10px">
                生产任务单
                <span tdata="pageNO" format="#">第#页</span>
                <span tdata="pageCount" format="#">总共 #页</span>
              </th>
              <th>
                <div id="qrcode-0" title="TF2306300001">
                  <canvas width="100" height="100" style="display: none"></canvas>
                  <img
                    alt="Scan me!"
                    style="display: block"
                    src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAAAXNSR0IArs4c6QAABTBJREFUeF7tXduSqzAMK///0T3DabsTArElYSh0tK8EJ7Fs+ZLQnR6Px/Nx4N/zuV/8NE1/K6yQNwtrZbbbj+SP3qlU37zT/RoLVlShQANSCLkB4ZS58JBq5c1LaWUe4fLqmkde168xWr86dwtRP58BSYzGgHAevvBA5tXbeQhDL9VWFNEGo/SIGlAqRfdWpa8hZVVNoPCsAXmbEmo1vZWiVoRatwExIENbQY2tilG+SlnMJj4a6ymwomiM1mFAEl4zIADxo1bUi7KHrHtqX6WsEdYKUJndoNmeWqkza44M2IB0SBqQDdNmrC3zjFEygHonSsfMmu0hXb8qAvGyHoJaXhao0WJTPRhCLThb52i/qnxUf5ft9hqQF4SXab8bkA1AUDdjxqEuH1XcZz5jYgijB3TsqWfq6GaZarwaLHSNqILZcQZkx4khq2xkvAG5GiBPtKeAwJuMQemgirLa5aAd3YJt7hIxGZDlzZhd2ix42YAQVXyBvlMREiBM36ZdQURF0TiUeqLdHj03w/xhZqhQlgFZQ29AUudfDrCHbCjsaKX8BGW1t99Rt2NSSPQSgjKuB4BJl5W4pPbbsnUu1mJAxt+KUIpsvmHJ2DQE1oBcGJAM2c9zNBbM41EajOaubiDOc41kot2EbG8qBUu9LAPyMh80pqDj/huK8kmbATkJEAbJEcUwmc4oW2MAR1PdiIqOoEtUZj8OPsJFq3MDkkfiSJcGJNGfmlDYQ5LOwG0oq20uMhX4yALUtBFNE1ecW/CjAkfPzeh10X5nXjQg41omMpqs+jcgQZGYhWfUsxhDh4M6GqSYlLWiikfXlVnm5zmaTfaFoUrVctqLbtyArItGJqGwh3SWZg/JiHrHc4a7L0lZ7d5Vfq+yMBQH9O4wKo8ZpwZ1+DzEgDBw6GmvAeH0DI8+xEMqKnW033NE6hl5tRJDmE4ACggl04DEDoEaGxNzQ5kGxID8aWBkVUym9nOUhd46QV03sjfm8KqVcwRXj+TDEZ34riSKIXLrxICsoVJroPITQ6ZfhVIKep5fFTxv4SEo3TDpJOpZqKKr5j6TEqm0F70GFLmn6gVKbDAgb20bkDV/KAY1SwlZwx6C96QY6onoHy4M0ZRPPR1jDmpGa1HnRlNPNWGJ2kLMmku+MUTTPwPygi3SlwHpTPsnPETNstBaQE2JVc+N9oNSKUr/Kyqt/gq3oj0S8TEaLDNqULNGA0J89MMEz8sCoqS9aMbSWylj3RW0gVIWSp0qDTHvwR/soL2mKroxIAmMBoSxc32sPaTTnXo4pkOwfFOqQ9TJmaA7oqyK4nKWPWpfqPIZIEO2UdJeA7LWgAF56wQtGqPMUMnGmEyTSXTgGKJ6RcVmo7RUTTbQ/aDrV+l4BSxah6AbiKxB5WcDomp/4z3UwtApGVAZXh/Nj67fHgLEkNsDogZIlFJQKzoiLqBNT8YD0X1H3t/PV/IFFbowA5KnywZkxw1E1BBLPIThXzXwjapxNMBHFXdWJ6Dtd2YtJfsZ3e01ICoUr/fUeHzqf2ljLrmh6kDvRqHxC503G2dAiF946y2YYYMMiM/zWwDCBLfqjatKR1Nw5rZKKPPMGGJA8vhyagwxIBcHRA3ISN+pT4kjY5D5PvitrvD+bvCjy1/1EAOyUbl/M4YYEAOyyVy3oCw07WRaFKjMM4q4UetETV+ZLnGUgp/aXDQgLw0YkA1LuIWHoBbMjFP5uZ1DDf7VHV20amdaMyuKPPOSAwOkAVG1lbxnD4ljhj1kh+GdQVn/ALWu4vuLU6FVAAAAAElFTkSuQmCC"
                  />
                </div>
              </th>
            </tr>
            <tr>
              <td colspan="2">任务单号: TF2306300001</td>
              <td colspan="2">销售单号:20230612</td>
              <td colspan="2">计划单号:PF2306180006</td>
              <td colspan="2">分配时间:2023-06-30 12:00:00</td>
            </tr>
          </thead>

          <tbody>
            <tr>
              <th>产品编号</th>
              <th>产品名称</th>
              <th>规格型号</th>
              <th>颜色</th>
              <th>单位</th>
              <th>任务数量</th>
              <th>任务开始时间</th>
              <th>任务完成时间</th>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
            <tr>
              <td>yang_pd00518</td>
              <td>保温杯</td>
              <td>YH001</td>
              <td></td>
              <td>个</td>
              <td>68</td>
              <td>2023-06-21 00:00:00</td>
              <td>2023-06-21 23:59:59</td>
            </tr>
          </tbody>

          <tfoot>
            <tr style="height: 40mm">
              <td>备注:</td>
              <td colspan="7"></td>
            </tr>
            <tr>
              <td>车间产线：</td>
              <td>车间02/产线02</td>
              <td>开工时间：</td>
              <td colspan="2"></td>
              <td>产线长签字:</td>
              <td colspan="2"></td>
            </tr>
          </tfoot>
        </table>
      </div>
    </n-print-page>
  </NPrintLodop>
</template>

<style lang="less" scoped>
.container {
  width: 100%;

  table {
    table-layout: fixed;
    width: 100%;
    font-size: 14px;
    border-collapse: collapse;
  }

  td,
  th {
    border: 1px solid #9b9b9b;
  }
}

.note-header {
  td,
  th {
    //border: none;
  }
}

.spacer {
  height: 4mm;
}
.spacer--small {
  height: 1mm;
}
</style>