import QtQuick 2.12

import "qrc:/components"
import "qrc:/globals"

HeaderBarPopup { id: _root
    readonly property string qrCodeURL         : "www.diality.com/moda-flx"
    readonly property int rightColumnWidth     : 325
    readonly property int leftColumnWidth      : 170
    readonly property int columnSpacing        : Variables.defaultMargin * 3

    readonly property var _dataModel: [
        { name: qsTr("OS Version"       ) , value: vDevice.osVersion                },
        { name: qsTr("UI Version"       ) , value: Qt.application.version           },
        { name: qsTr("TD Version"       ) , value: vAdjustmentVersions.tdVerDevice  },
        { name: qsTr("TD FPGA Version"  ) , value: vAdjustmentVersions.tdVerFPGA    },
        { name: qsTr("TD Serial Number" ) , value: vAdjustmentVersions.tdSerial     },
        { name: qsTr("DD Version"       ) , value: vAdjustmentVersions.ddVerDevice  },
        { name: qsTr("DD FPGA Version"  ) , value: vAdjustmentVersions.ddVerFPGA    },
        { name: qsTr("DD Serial Number" ) , value: vAdjustmentVersions.ddSerial     },
        { name: qsTr("FP Version"       ) , value: vAdjustmentVersions.fpVerDevice  },
        { name: qsTr("FP FPGA Version"  ) , value: vAdjustmentVersions.fpVerFPGA    }
    ]

    padding     : Variables.defaultMargin * 2

    contentItem: Column { id: _contentColumn
        anchors.centerIn    : parent
        spacing             : Variables.defaultMargin * 2

        Item  { id: _versionList
            width   : rightColumnWidth + leftColumnWidth + columnSpacing
            height  : _versionColumn.implicitHeight

            Column { id: _versionColumn
                anchors.fill: parent

                Repeater {
                    model: _dataModel

                    delegate: Item { id: _delegate
                        width   : _versionColumn.width
                        height  : 40

                        Row { id: _row
                            spacing : columnSpacing
                            width   : _versionColumn.width
                            anchors.verticalCenter: parent.verticalCenter

                            Text { id: _name
                                color               : "#2E5E92"
                                text                : modelData.name
                                width               : leftColumnWidth
                                font.pixelSize      : Fonts.fontPixelDialogText
                                font.weight         : Font.Medium
                                horizontalAlignment : Text.AlignLeft
                            }

                            Text { id: _value
                                color               : "grey"
                                text                : modelData.value
                                width               : rightColumnWidth
                                font.pixelSize      : 20
                                horizontalAlignment : Text.AlignRight
                                verticalAlignment   : Text.AlignVCenter
                                elide               : Text.ElideRight
                            }
                        }

                        Line { id   : _spacerLine
                            anchors.bottom  : parent.bottom
                            length          : _versionList.width
                            color           : Colors.dialogShadowColor
                        }
                    }
                }
            }
        }

        Row { id: _qrRow
            spacing         : Variables.defaultMargin
            anchors.left    : parent.left

            QRCode { id: _qrCode
                anchors.verticalCenter: parent.verticalCenter
            }

            Text { id: _qrCodeInstructions
                anchors.bottom          : _qrCode.bottom
                text                    : qsTr("Scan for electronic instructions for use (eIFU)"  )
                color                   : Colors.dialogText
                font.pixelSize          : Fonts.fontPixelDialogText
            }
        }
    }

    Component.onCompleted: { _qrCode.qrcode  = qrCodeURL }
}
