function EasyTable(options) {
    this._head = []
    this._data = []
    this._table = undefined
    this._selectIndex = []
}

EasyTable.prototype = {
    createTable: function(tableId, head, data, onclick) {
        this._onClick = onclick
        this._head = head
        this._data = data

        this._table = $('#' + tableId)
        this._table.empty()

        var thead = $('<thead></thead>')
        var trH = $('<tr></tr>')

        for (let i = 0; i < head.length; i++) {
            const h = head[i];
            var th = $('<th></th>')
            th.prop("index", i)
            th.append(h)
            trH.append(th)
            this._selectIndex.push(i)
            // if (this._selectIndex.indexOf(i) != -1) {
            //     th.show()
            // } else {
            //     th.hide()
            // }
        }

        thead.append(trH)

        this._table.append(thead)

        var tbody = $('<tbody></tbody>')
        tbody.addClass('scrollbar')
        this._refreshTbody(data, tbody)
        this._table.append(tbody)
    },

    onNewData: function(data, merge) {

        var tbody = $(this._table.find('tbody')[0])
        if (merge != true) {
            this._data = []
            tbody.empty()
        }
        this._data.push.apply(this._data, data)
        this._refreshTbody(data, tbody)

        return this._data.length
    },

    deleteRow: function(rowIndex){
        var tbody = $(this._table.find('tbody')[0])
        var tr = tbody.find('tr')[rowIndex]
        $(tr).remove()
    },

    onChangeTh: function(index, add) {
        var ths = this._table.find('th')
        var tds = this._table.find('td')
        for (let i = 0; i < ths.length; i++) {
            var th = $(ths[i])
            if (th.prop('index') == index) {
                th.toggle()
            }
        }
        for (let i = 0; i < tds.length; i++) {
            var td = $(tds[i])
            if (td.prop('index') == index) {
                td.toggle()
            }
        }
        if (add) {
            this._selectIndex.push(index)
        } else {
            var i = this._selectIndex.indexOf(index)
            this._selectIndex.splice(i, 1)
        }
    },

    _refreshTbody: function(data, tbody) {
        var that = this
        data.forEach(e => {
            var trC = $('<tr></tr>')
            trC.addClass('tr-content')
            trC.on('onmouseover', function() {
                this.style.backgroundColor = 'var(--select_color)'
            })
            trC.on('onmouseout', function() {
                this.style.backgroundColor = 'transparent'
            })
            trC.on('click', function() {
                var trs = tbody.find('tr')
                for (let i = 0; i < trs.length; i++) {
                    const tr = trs[i];
                    $(tr).css('background-color', '')
                }
                $(this).css('background-color', 'var(--select_color)')
                that._onClick(e)
            })

            for (let i = 0; i < e.length; i++) {
                const v = e[i];
                var td = $('<td></td>')
                td.prop("index", i)
                td.append(v)
                trC.append(td)
                if (this._selectIndex.indexOf(i) != -1) {
                    td.show("fast")
                } else {
                    td.hide("fast")
                }
            }
            tbody.append(trC)
        });
        if (data.length == 0) {
            tbody.hide()
        } else {
            tbody.show()
        }
    },
}