STUDY/Vue

printer 개인 참고 용 화면에 보여지는 그리드 헤더 가져오기

uragiljay 2025. 3. 20. 00:03
반응형

 

 

function getRenderedHeaders() {
    const theadRows = document.querySelectorAll('.tui-grid-header-area thead tr');
    const headers = [];

    theadRows.forEach(row => {
        const headerCells = [];
        row.querySelectorAll('th').forEach(th => {
            headerCells.push(th.innerText.trim()); // 헤더 텍스트만 추출
        });
        headers.push(headerCells);
    });

    return headers;
}

// 테스트 실행
console.log(getRenderedHeaders());

 

 

 

//

printData() {
    const checkedData = grid.getCheckedData();
    const headers = getRenderedHeaders();

    if (checkedData.length === 0) {
        alert("선택된 항목이 없습니다.");
        return;
    }

    let printHtml = "<table border='1' style='border-collapse:collapse; width:100%; text-align:center;'>";

    // 헤더 추가
    headers.forEach(row => {
        printHtml += "<tr>";
        row.forEach(cell => {
            printHtml += `<th>${cell}</th>`;
        });
        printHtml += "</tr>";
    });

    // 데이터 추가
    checkedData.forEach(row => {
        printHtml += "<tr>";
        Object.values(row).forEach(value => {
            printHtml += `<td>${value}</td>`;
        });
        printHtml += "</tr>";
    });

    printHtml += "</table>";

    // 프린트 실행
    const printWindow = window.open("", "", "width=800,height=600");
    printWindow.document.write("<html><head><title>Print</title></head><body>");
    printWindow.document.write(printHtml);
    printWindow.document.write("</body></html>");
    printWindow.document.close();
    printWindow.print();
}

반응형