使用 Loop 从 SQLite 查询构建表？

Question

简介

在我的公司，我们目前使用 Excel 来维护一个相当大的项目数据库，用于成本估算。

我正在构建一个 Electron 应用程序，用一个简单的数据库和一些更用户友好的表单和报告来替换它。

现在，我有一个包含 2 个表的 SQLite 数据库：

materials
walls

会在某个时候添加更多内容。我不想为添加的每个表添加表 html，而是要循环遍历数据并动态构建表。

下面是应用程序外观的屏幕截图（使用预编码的列）：

我的工作内容：

我遍历“sqlite_master”表以获取左侧菜单的每个表的名称。然后我使用每个表名（row.name）来调用另一个函数，该函数获取每个表的列名，然后我将其输入到表中，所以我得到了这个：

我在哪里挣扎：

到此为止，我需要遍历表格并将其显示在右侧窗格中。如果我已经知道列名，我可以对其进行预编码并循环遍历每一行，但我需要能够动态添加/删除列和表（类似于 excel 工作簿），所以对它们进行预编码不是一个选项。

我认为我需要做什么：

我一直讨厌这部分，因为我知道的就够搞砸了。

我想我需要获取每列的列表，然后添加类似于

的行

let rowInfo = "<td>" + {{colName}} + "</td>" //WHERE THIS WOULD BE A LIST OF ALL COLS
for (i = 0; i <= col.length; i++) {
    $("#tableRows").append(rowInfo);
}

但我不知道如何从这里到那里。

相关代码片段：

function getMaterials() { // This is what I use to get the data from Image 1
    let sqlite3 = require( 'sqlite3' ).verbose();
    let db      = new sqlite3.Database( 'quoteTemplate.db' );

    db.each( "SELECT * FROM materials", function ( err, row ) {
        let table        = document.getElementById( "materialsTable" );
        let tableRow     = table.insertRow( 0 );
        let cell1        = tableRow.insertCell( 0 );
        let cell2        = tableRow.insertCell( 1 );
        let cell3        = tableRow.insertCell( 2 );
        let cell4        = tableRow.insertCell( 3 );
        let cell5        = tableRow.insertCell( 4 );
        let cell6        = tableRow.insertCell( 5 );
        let cell7        = tableRow.insertCell( 6 );
        let cell8        = tableRow.insertCell( 7 );
        let cell9        = tableRow.insertCell( 8 );
        let cell10       = tableRow.insertCell( 9 );
        let cell11       = tableRow.insertCell( 10 );
        let cell12       = tableRow.insertCell( 11 );
        cell1.innerHTML  = row.id;
        cell2.innerHTML  = row.item;
        cell3.innerHTML  = row.material;
        cell4.innerHTML  = row.type;
        cell5.innerHTML  = row.price;
        cell6.innerHTML  = row.freight;
        cell7.innerHTML  = row.width;
        cell8.innerHTML  = row.length;
        cell9.innerHTML  = row.height;
        cell10.innerHTML = row.thickness;
        cell11.innerHTML = row.weight;
        cell12.innerHTML = row.weightper;
    } );

    db.close();
}

function getTablesList() { // This gets the tables for the left pane
    let sqlite3 = require( 'sqlite3' ).verbose();
    let db      = new sqlite3.Database( 'quoteTemplate.db' );
    let list    = $( "#tablesList" );

    db.each( "SELECT name FROM sqlite_master WHERE type='table' AND name != 'sqlite_sequence' AND name != 'lorem'", function ( err, row ) {
        let activeChk = "";
        if(row.name == 'materials') {
            activeChk = "active";
        }
        list.append( '<span class="nav-group-item ' + activeChk + ' " onclick="getName(\'' + row.name + '\')">' + row.name + "</span>" );
    } );

    db.close();
}

function getName( table ) { // This gets the header row
    let sqlite3         = require( 'sqlite3' ).verbose();
    let db              = new sqlite3.Database( 'quoteTemplate.db' );
    let mainTableHeader = document.getElementById( "materialsTableHeader" );

    $( "#materialsTableHeader tr" ).remove();
    $( "#materialsTable tr" ).remove();
    let tableHeaderRow = mainTableHeader.insertRow( 0 );

    db.each( "PRAGMA table_info('" + table + "')", function ( err, row ) {
        let cell       = tableHeaderRow.insertCell( 0 );
        cell.outerHTML = "<th>" + row.name + "</th>";
    } );

    db.close();

    getRows( table );
}

function getRows( tableName ) { // This is where I want to get the table data
    let sqlite3   = require( 'sqlite3' ).verbose();
    let db        = new sqlite3.Database( 'quoteTemplate.db' );
    let mainTable = document.getElementById( "materialsTable" );

    // I need the code that would go here

    db.close();
}

一如既往，任何建议都值得赞赏。我意识到我可能会问一些基本的问题，但这不总是这样吗？我们可以在构建复杂的用户界面等困难的事情上表现出色（哈！），但我们在简单的事情上脑残。

Answer 1

好吧...我想通了...

function getRows( tableName ) {
    let sqlite3   = require( 'sqlite3' ).verbose();
    let db        = new sqlite3.Database( 'quoteTemplate.db' );
    let mainTable = document.getElementById( "materialsTable" );
    db.each( 'SELECT * FROM ' + tableName, [], function ( tx, results ) {
        let tableRow = mainTable.insertRow( 0 );
        $.each(results, function(key, value){
            let cell       = tableRow.insertCell( 0 );
            cell.outerHTML = "<td>" + value + "</td>";
        });
    } );
    db.close();
}

我知道这很简单。