// Qt
import QtQuick                  2.15
import QtGraphicalEffects       1.12

//  Qml imports
import "qrc:/globals"
import "qrc:/components"
import "qrc:/compounds"
import "qrc:/dialogs"


SettingsBase    { id: _root
    itemIndex       : SettingsStack.CalibrationSettings
    confirmVisible  : false

    Component.onCompleted: vCalibrationSettings.refreshList(SettingsCalibrationSettings.Pressure)

    function openDialog( vIndex ) {
        _calibrationDialog.openDialog(  _componentComboBox.currentIndex,
                                        vIndex,
                                        _listView.model.get(vIndex))
    }

    CalibrationDialog { id: _calibrationDialog }

    BaseComboBox { id: _componentComboBox
        anchors.top                 : _root.top
        anchors.topMargin           : Variables.headerButtonsMargin
        anchors.horizontalCenter    : parent.horizontalCenter
        height                      : Variables.contentHeight
        currentIndex                : 0
        model                       : [
            qsTr("Pressure Sensors"     ) ,
            qsTr("Temperature"          ) ,
            qsTr("Concentrate Pump"     ) ,
            qsTr("Dialysate Pump (D48)" ) ,
            qsTr("Dialysate Pump (D12)" ) ,
            qsTr("Acid Types"           ) ,
            qsTr("Bicarb Types"         ) ,
            qsTr("Accelerometer"        ) ,
            qsTr("Blood Leak"           )
        ]

        onActivated: vCalibrationSettings.refreshList(currentIndex)
    }

    component HeaderText: Text { id: _headerText
        property string title   : ""
        anchors.verticalCenter  : parent.verticalCenter
        leftPadding             : Variables.defaultMargin * 2
        text                    : _headerText.title
        color                   : Colors.white
        font.pixelSize          : Fonts.fontPixelTextRectTitle
        font.weight             : Font.Medium
    }

    contentItem: Item { id: _contentItem
        anchors.fill : parent
        readonly property int contentWith: _listView.width - Variables.defaultMargin //* 2 // added margin to have scroll bar show on right

        Rectangle { id: _header
            color   : Colors.treatmentSectionHeader
            height  : Variables.institutionaltContainerHeight
            width   : _contentItem.contentWith
            radius  : 8.5

            Row { id: _headerRow
                width   : _contentItem.width
                height  : Variables.institutionaltContainerHeight

                HeaderText { title: qsTr("Description"); width: _contentItem.width * 0.3                    }
                HeaderText { title: qsTr("Component");   width: _contentItem.width * 0.1; leftPadding: 0    }

                Row { id: _headerComponentRow
                    width       : _contentItem.width * 0.6
                    height      : Variables.institutionaltContainerHeight

                    Repeater { id: _repeater
                        model   : vCalibrationSettings.columnTitle

                        delegate: HeaderText {
                            title               : modelData
                            height              : Variables.institutionaltContainerHeight
                            leftPadding         : 0
                            width               : _headerComponentRow.width / vCalibrationSettings.columnTitle.length
                            verticalAlignment   : Text.AlignVCenter
                        }
                    }
                }
            }

            layer.enabled   : true
            layer.effect: DropShadow {
                id: _dropShadow
                horizontalOffset: 0
                verticalOffset  : 3
                radius          : 3.0
                samples         : 7
                color           : "#50000000"
                source          : _header
                anchors.fill    : _header
            }
        }

        ListView { id: _listView
            anchors {
                top         :_header.bottom
                topMargin   : 10
                left        : parent.left
                right       : parent.right
                bottom      : parent.bottom
            }
            boundsBehavior      : Flickable.StopAtBounds
            clip                : true
            model               : vCalibrationSettings.model
            spacing             : anchors.topMargin
            flickableDirection  : Flickable.VerticalFlick

            delegate: Rectangle {
                height  : Variables.institutionaltContainerHeight
                width   : _contentItem.contentWith
                radius  : 8.5
                color   : Colors.panelBackgroundColor
                border {
                    width: 1
                    color: _mouseArea.pressed || _editButton.isPressed ? Colors.borderButton : Colors.panelBorderColor
                }

                MouseArea { id: _mouseArea
                    anchors.fill    : parent
                    anchors.rightMargin: _contentItem.width / 2
                    onClicked       :  _root.openDialog(index)
                }

                IconButton { id  : _editButton
                    anchors {
                        left            : parent.left
                        leftMargin      : Variables.defaultMargin / 2
                        verticalCenter  : parent.verticalCenter
                    }
                    iconImageSource     : "qrc:/images/iEdit"
                    iconSize            : Variables.iconsDiameter
                    onPressed           : _root.openDialog( index )
                }

                Row { id: _delegateRow
                    width   : _contentItem.width
                    height  : Variables.institutionaltContainerHeight

                    HeaderText { title: model.title;        width: _contentItem.width * 0.3;    font.weight: Font.Normal;   leftPadding: Variables.defaultMargin * 3    }
                    HeaderText { title: model.component;    width: _contentItem.width * 0.1                                 }

                    Row { id: _delegateComponentRow
                        width       : _contentItem.width * 0.6
                        height      : Variables.institutionaltContainerHeight

                        Repeater { id: _delegateRepeater
                            model   : payload

                            delegate: HeaderText {
                                readonly property bool isCalTime: index === _delegateRepeater.count - 1

                                title               : isCalTime ? modelData : Number(modelData).toFixed(3)
                                height              : Variables.institutionaltContainerHeight
                                leftPadding         : 0
                                width               : _delegateComponentRow.width / vCalibrationSettings.columnTitle.length
                                verticalAlignment   : Text.AlignVCenter
                                font.pixelSize      : isCalTime ? Fonts.fontPixelDefaultButton : Fonts.fontPixelTextRectTitle


                            }
                        }
                    }
                }
            }

            ScrollBar { flickable: _listView }
        }
    }
}