import QtQml.Models 2.2
import QtQml 2.2


import QtQuick
import QtQuick.Layouts
import QtQuick.Controls
import Qt.labs.qmlmodels

Item {
    anchors.fill: parent
    //color: "lightslategrey"
    property var availableFilters: ["Name", "Adresse", "PLZ", "Ort"]

    SearchBar
    {
        id:searchBar
        anchors.margins: 9
    }

    ColumnLayout
    {
        id: tableColumn
        anchors
        {

            top: searchBar.bottom
            bottom: parent.bottom
            left: parent.left
            right: parent.right
        }

        RowLayout
        {
            // Layout.fillHeight: true
            // Layout.fillWidth: true


            RadioButton
            {

                checked: true
                text: qsTr("Alle")
            }
            RadioButton
            {

                text: qsTr("Interessent")
            }
            RadioButton
            {

                text: qsTr("Kunden")
            }
            RadioButton
            {

                text: qsTr("Erledigt")
            }

        }

        HorizontalHeaderView
        {
            // @disable-check M16
            id: horizontalHeader
            Layout.fillWidth: true
            movableColumns: true
            syncView: testTable

        }

        TableView
        {
            property var customWidths: [0.2, 0.5, 0.3]
            property real newWidth: 0

            id: testTable
            Layout.fillHeight: true
            Layout.fillWidth: true
            columnSpacing: 1
            rowSpacing: 2
            model: dbm
            alternatingRows: true
            resizableColumns: true
            selectionBehavior: TableView.SelectRows
            selectionModel: ItemSelectionModel
            {
                id: selModel
                model: testTable.model
            }

            columnWidthProvider: function(column)
            {
                // switch (column)
                // {
                //     case 0: return width * 0.2;
                //     case 1: return width * 0.5;
                //     case 2: return width * 0.3;
                //     default: return width / model.columnCount();
                // }
                //return customWidths[column] * width;
                //return tableColumn.content.implicitWidth // model.columnCount()
                newWidth = columnWidth(column)
                return newWidth
            }

            Timer
            {
                running: true
                interval: 100
                onTriggered:
                {
                    //testTable.columnWidths[2] = 150
                    testTable.forceLayout();
                }
            }



            delegate:Rectangle
            {
                required property bool selected
                required property bool current
                implicitWidth: tableColumn.width / testTable.columns
                Layout.fillWidth: true
                implicitHeight: 25
                //color: selected? "lightblue": palette.base
                color: selected
                           ? "lightblue" //palette.highlight
                           : (testTable.alternatingRows && row % 2 !== 0
                           ? palette.base
                           : palette.alternateBase)

                Text
                {
                    Layout.fillWidth: true
                    text: model.display
                    //elide: Text.ElideRight
                }

                MouseArea
                {
                    id: mouseArea
                    property bool hovered:false

                    anchors.fill: parent
                    hoverEnabled: true


                    onClicked:
                    {
                        dbm.onRowClicked(row)
                        testTable.selectionModel.select(testTable.model.index(row, 0), ItemSelectionModel.SelectCurrent | ItemSelectionModel.Rows)


                    }
                }
            }
        }


        Item
        {
            Layout.fillHeight: true
            Layout.fillWidth: true
        }
    }
}