SOURCE

const style = `
  <style>
       table {
            width: 100%;
            border-collapse: collapse;
        }
        td {
            width: calc(1920px / 17);
            height: 40px;
            text-align: center;
            font-size: 14px;
        }
  </style>
`

const noticeModel = {
  // 自卸车生产通知单模板
  dumpTruck: (data) => {
    return style + `
     <table border="1px">
      <tr>
          <td colspan="3">顾客名称</td>
          <td colspan="6">${data.customerName}</td>
          <td colspan="5">合同编号</td>
          <td colspan="3">${data.contractNo}</td>
      </tr>
      <tr>
          <td colspan="3">数量（台）</td>
          <td colspan="3">${data.num}</td>
          <td colspan="3">公告型号</td>
          <td colspan="8">${data.type}</td>
      </tr>
      <tr>
          <td colspan="3">交货日期</td>
          <td colspan="3"> ${data.month} 月 ${data.month} 日</td>
          <td colspan="3">底盘型号</td>
          <td colspan="8">${data.chassisType}</td>
      </tr>
      <tr>
          <td rowspan="3" width="50px">产品分类</td>
          <td colspan="2">常规</td>
          <td colspan="14">${data.general}</td>
      </tr>
      <tr>
          <td colspan="2" rowspan="2">非常规</td>
          <td colspan="2">技术说明</td>
          <td colspan="1">${data.technote}</td>
          <td colspan="3" rowspan="2">技术资料下发时间</td>
          <td colspan="3" rowspan="2">${data.deliveryTime}</td>
          <td colspan="3" rowspan="2">技术确认</td>
          <td colspan="3" rowspan="2">${data.TCF}</td>
      </tr>
      <tr>
          <td colspan="2">设计图纸</td>
          <td colspan="1">${data.designDrawing}</td>
      </tr>
      <tr>
          <td rowspan="8">大厢</td>
          <td colspan="2">车厢形式</td>
          <td colspan="6">${data.carForm}</td>
          <td colspan="3">举升方式</td>
          <td colspan="6">${data.liftingWay}</td>
      </tr>
      <tr>
          <td colspan="2">密封盖</td>
          <td colspan="6">${data.sealCover}</td>
          <td colspan="3">转动臂</td>
          <td colspan="6">${data.rotorArm}</td>
      </tr>
      <tr>
          <td colspan="2">后门锁紧</td>
          <td colspan="4">${data.afterLock}</td>
          <td colspan="2">车厢颜色</td>
          <td colspan="3">${data.carColor}</td>
          <td colspan="3">板厚</td>
          <td colspan="3">${data.thickness}</td>
      </tr>
      <tr>
          <td colspan="2">底边材质</td>
          <td colspan="4">${data.bottomMaterial}</td>
          <td colspan="2">车厢尺寸</td>
          <td colspan="9">${data.carSize}</td>
      </tr>
      <tr>
          <td colspan="2">挡泥板</td>
          <td colspan="4">${data.fender}</td>
          <td colspan="2">爬梯</td>
          <td colspan="3">${data.ladder}</td>
          <td colspan="3">后防护</td>
          <td colspan="3">${data.afterProtection}</td>
      </tr>
      <tr>
          <td colspan="2">侧防护</td>
          <td colspan="6">${data.lateralProtection}</td>
          <td colspan="3">举升稳定架</td>
          <td colspan="5">${data.liftStabilizer}</td>
      </tr>
      <tr>
          <td colspan="4">侧标志灯侧回复反射器</td>
          <td colspan="2">${data.sideSignlight}</td>
          <td colspan="2">示廊灯</td>
          <td colspan="3">${data.corridorLamp}</td>
          <td colspan="3">反光标识条</td>
          <td colspan="3">${data.reflectiveStrip}</td>
      </tr>
      <tr>
          <td colspan="2">工作灯</td>
          <td colspan="2">${data.workLight}</td>
          <td colspan="4">防飞溅装置</td>
          <td colspan="3">${data.splashProof}</td>
          <td colspan="3">车辆尾部标识板</td>
          <td colspan="3">${data.rearSignPlate}</td>
      </tr>
      <tr height="400px">
          <td>其它要求</td>
          <td colspan="16">${data.others}</td>
      </tr>
    </table> `
  },
}

let data = {
    customerName: '张三',
    contractNo: 'XASD1341231',
    num: 13,
    type: '自卸车',
    month: 8,
    day: 10,
    chassisType: '型号一',
    general: '常规',
    technote: '技术说明',
    deliveryTime: '2021-8-10',
    TCF: '张三',
    designDrawing: '设计图纸',
    carForm: '车厢形式',
    liftingWay: '举升方式',
    sealCover: '密封盖',
    rotorArm: '转动臂',
    afterLock: '后门锁紧',
    carColor: '颜色一',
    thickness: '2CM',
    bottomMaterial: '钢',
    carSize: '2M*3m*2M',
    fender: '挡泥板',
    ladder: '爬梯',
    afterProtection: '后防护',
    lateralProtection: '侧防护',
    liftStabilizer: '举升稳定架',
    sideSignlight: '侧标志灯侧回复反射器',
    corridorLamp: '示廊灯',
    reflectiveStrip: '反光标识条',
    workLight: '工作灯',
    splashProof: '防飞溅装置',
    rearSignPlate: '车辆尾部标识板',
    others: '其它要求'
}
var iframe = window.open("","_blank");
iframe.document.body.innerHTML = noticeModel.dumpTruck(data);
iframe.print();