CuboBmsTool/qml/Screens/CellMonitorScreen.qml

import QtQuick 2.12
import QtQuick.Layouts 1.12
import QtGraphicalEffects 1.0

import Controls 1.0 as Controls
import Cubo 1.0
import Utils 1.0

Item {
    Component {
        id: cellListHeader

        RowLayout {
            spacing: 0
            width: ListView.view.width

            Rectangle {
                id: numberTab
                color: Palette.tableHeaderBackgroundColor
                Layout.preferredHeight: 60
                Layout.fillWidth: true

                Controls.SubtitleLabel {
                    text: qsTr("№")
                    color: Palette.tableHeaderTextColor
                    anchors.centerIn: parent
                }
            }

            Rectangle {
                id: voltageTab
                color: Palette.tableHeaderBackgroundColor
                Layout.preferredHeight: 60
                Layout.fillWidth: true

                Controls.SubtitleLabel {
                    text: qsTr("Voltage")
                    color: Palette.tableHeaderTextColor
                    anchors.centerIn: parent
                }
            }

            Rectangle {
                id: balancingTab
                color: Palette.tableHeaderBackgroundColor
                Layout.preferredHeight: 60
                Layout.fillWidth: true

                Controls.SubtitleLabel {
                    text: qsTr("Balancing")
                    color: Palette.tableHeaderTextColor
                    anchors.centerIn: parent
                }
            }

            Layout.fillWidth: true
        }
    }

    Component {
        id: cellListDelegate

        RowLayout {
            spacing: 10
            width: ListView.view.width
            height: 38

            Item {
                Layout.preferredWidth: parent.width / 6 - 20
            }

            Controls.SubtitleLabel {
                id: indexLabel
                color: Palette.tableHeaderTextColor
                Layout.preferredWidth: 25
                Layout.alignment: Qt.AlignCenter
            }

            Controls.DotSeparator {
                Layout.fillWidth: true
            }

            Controls.SubtitleLabel {
                text: modelData.voltage + " " + qsTr("V")
                color: Palette.tableHeaderTextColor
            }

            Controls.DotSeparator {
                Layout.fillWidth: true
            }

            Controls.AvailabilityIndicator {
                enabled: modelData.balancing
                Layout.alignment: Qt.AlignCenter
            }

            Item {
                Layout.preferredWidth: parent.width / 6 - 20
            }

            Component.onCompleted: {
                indexLabel.text = index + ListView.view.indexOffset
            }
        }
    }

    RowLayout {
        anchors.fill: parent
        spacing: 20

        Controls.Frame {
            padding: 1

            ListView {
                id: firstCellGroup
                anchors.fill: parent
                clip: true
                model: []
                spacing: 0
                boundsBehavior: Flickable.StopAtBounds

                property int indexOffset: 1

                header: cellListHeader
                delegate: cellListDelegate
            }

            Layout.fillWidth: true
            Layout.fillHeight: true
        }

        Controls.Frame {
            padding: 1
            visible: secondCellGroup.model.length > 0

            ListView {
                id: secondCellGroup
                anchors.fill: parent
                clip: true
                model: []
                spacing: 0
                boundsBehavior: Flickable.StopAtBounds

                property int indexOffset: 17

                header: cellListHeader
                delegate: cellListDelegate
            }

            Layout.fillWidth: true
            Layout.fillHeight: true
        }
    }

    Connections {
        target: BmsInterface.commands()
        onCellsReceived: {
            firstCellGroup.model = []
            var firstModel = []

            for (var i = 0; i < Math.min(cellCount, 16); ++i) {
                firstModel.push({"voltage": MathHelper.roundDouble(cellVoltageArray[i]), "balancing": cellVoltageArray[i] < 0})
            }
            firstCellGroup.model = firstModel

            if (cellCount > 16) {
                secondCellGroup.model = []
                var secondModel = []

                for (var j = 16; j < Math.min(cellCount, 32); ++j) {
                    secondModel.push({"voltage": MathHelper.roundDouble(cellVoltageArray[j]), "balancing": cellVoltageArray[i] < 0})
                }
                secondCellGroup.model = secondModel
            }
        }
    }

    Connections {
        target: BmsInterface
        onPortConnectedChanged: getValues()
    }

    onVisibleChanged: getValues()

    function getValues() {
        if (BmsInterface.isPortConnected() && visible) {
            BmsInterface.commands().getCells()
        }
    }
}