SOURCE

const genThead = (machines) => {
  return `<tr>
    <td>机型</td>
    <td>FW版本：</td>
    ${machines.map((v) => `<td>${v}</td>`).join('')}
  </tr>`
}

const genFirstTr = (arr) => {
  return `
    <tr>
      <td rowspan="5">SDII</td>
      <td>客户</td>
      ${arr.map((v) => `<td>${v}</td>`).join('')}
    </tr>
  `
}

const genCommonTr = (title, arr) => {
  return `<tr>
    <td>${title}</td>
     ${arr.map((v) => `<td>${v}</td>`).join('')}
  </tr>`
}

const genTbody = (results) => {
  return `
    ${genFirstTr(results.issuedata.map((arr) => arr[2]))}
    ${genCommonTr('工单号', results.issuedata.map((arr) => arr[3]))}
    ${genCommonTr('检测总数', results.issuedata.map((arr) => arr[4]))}
    ${genCommonTr('良品数', results.issuedata.map((arr) => arr[5]))}
    ${genCommonTr('良品率', results.issuedata.map((arr) => arr[6]))}
  `
}

const insertData = () => {
  const oApp = document.getElementById('app');
  const machines = ['v1.15', 'v1.15'];
  const table = `
    <table border>
      ${genThead(machines)}
      
      ${genTbody({
        issuedata: [
          [
            'ROG',
            '5.12',
            '王小帅',
            'ED112233',
            21,
            18,
            18 / 21,
            '人为损坏',
            '2024/04/12 孙子弄坏的'
          ],
          [
            'IPHONE',
            '5.14',
            '吏不畏',
            'AE11223',
            20,
            10,
            10 / 20,
            '人为损坏',
            '2024/04/22 曾孙子弄坏的'
          ]
        ]
      })}
    </table>
  `
  oApp.innerHTML = table
}

insertData()

<div id="app">

</div>