<table>
    <colgroup>
        <col width="18px">
        <col width="calc(50% - 18px)">
        <col width="25%">
        <col width="25%">
<!--        <col width="9%">-->
<!--        <col width="9%">-->
<!--        <col width="9%">-->
<!--        <col width="9%">-->
<!--        <col width="9%">-->
<!--        <col width="9%">-->
<!--        <col width="9%">-->
    </colgroup>
    <thead>
        <tr>
            <th></th>
            <th>전송시각</th>
            <th>교통정보</th>
            <th>돌발정보</th>
<!--            <th>KBS-교통정보</th>-->
<!--            <th>SK-교통정보</th>-->
<!--            <th>동부-교통정보</th>-->
<!--            <th>KBS-돌발정보</th>-->
<!--            <th>SK-돌발정보</th>-->
<!--            <th>동부-돌발정보</th>-->
<!--            <th>KBS-통제정보</th>-->
        </tr>
    </thead>
    <tbody></tbody>
    <tfoot></tfoot>
</table>

<script>
    const endPoint = "getPeriodSndMoctStatistics";
    
    function callBack(data) {
        if (data && data.length) {
            let trafTot       = 0;
            // let kbsTot        = 0;
            // let skTot         = 0;
            // let dongbuTot     = 0;
            let incdTot       = 0;
            // let kbsIncdTot    = 0;
            // let skIncdTot     = 0;
            // let dongbuIncdTot = 0;
            // let kbsCtrlTot    = 0;
            data.forEach((obj)=>{
                trafTot +=  obj.traf || 0;
                // kbsTot +=  obj.kbs || 0;
                // skTot += obj.sk || 0;
                // dongbuTot += obj.dongbu || 0;
                incdTot += obj.incd || 0;
                // kbsIncdTot += obj.kbsIncd || 0;
                // skIncdTot += obj.skIncd || 0;
                // dongbuIncdTot += obj.dongbuIncd || 0;
                // kbsCtrlTot += obj.kbsCtrl || 0;
            });
            return `<tr>
                       <td></td>
                       <td>합계</td>
                       <td>${trafTot.toLocaleString()}</td>
                       <td>${incdTot.toLocaleString()}</td>
                    </tr>`;
                       // <td>${kbsTot.toLocaleString()}</td>
                       // <td>${skTot.toLocaleString()}</td>
                       // <td>${dongbuTot.toLocaleString()}</td>
                       // <td>${kbsIncdTot.toLocaleString()}</td>
                       // <td>${skIncdTot.toLocaleString()}</td>
                       // <td>${dongbuIncdTot.toLocaleString()}</td>
                       // <td>${kbsCtrlTot.toLocaleString()}</td>
        }
    }

    function getTableRow(obj, idx) {
        let traf = obj.traf || 0;
        let incd = obj.incd || 0;
        // let kbs = obj.kbs || 0;
        // let sk = obj.sk || 0;
        // let dongbu = obj.dongbu || 0;
        // let kbsIncd = obj.kbsIncd || 0;
        // let skIncd = obj.skIncd || 0;
        // let dongbuIncd = obj.dongbuIncd || 0;
        // let kbsCtrl = obj.kbsCtrl || 0;
        return `<tr onclick="rowClick(this, 'container-2 table tbody')" >
                    <td><input style="display: none" type="checkbox" id="check_${idx}" onchange="checkEvent(this, 'container-2 table tbody')"></td>
                    <td>${obj.regDate}</td>
                    <td>${traf.toLocaleString()}</td>
                    <td>${incd.toLocaleString()}</td>
                </tr>`;
                    // <td>${kbs.toLocaleString()}</td>
                    // <td>${sk.toLocaleString()}</td>
                    // <td>${dongbu.toLocaleString()}</td>
                    // <td>${kbsIncd.toLocaleString()}</td>
                    // <td>${skIncd.toLocaleString()}</td>
                    // <td>${dongbuIncd.toLocaleString()}</td>
                    // <td>${kbsCtrl.toLocaleString()}</td>
    }
</script>