import QtQml 2.3
import QtQuick 2.6
import QtQuick.Window 2.2
import QtQuick.Controls 2.0
import QtDataVisualization 1.2
import QtQuick3D
import QtCharts 2.0
Item {
    id: mainWindow
    visible: true
    width: 3840
    height: 1080

    property int mainHeight: 1000
    property int camHeight: 360
    property int lineWidth: 20
    property int statusWidth: 417
    property int leftCamWidth: 470
    property int frontCamWidth: 1906
    property int frontCamWidth1: 1736
    property int rightCamWidth: 491
    property int radarWidth: 417
    property int radarSize: 120

    //property int radarRedRange: 2000
    //property int radarGreenRange: 4000

    property int radarRedRange: 1500
    property int radarGreenRange: 3000
    property int radarGreenOutRange: 5000

    
    property string radarFrontGreenImg: 'qrc:/images/front_green.png'
    property string radarFrontYellowImg: 'qrc:/images/front_yellow.png'
    property string radarFrontRedImg: 'qrc:/images/front_red.png'

    property string radarRightFGreenImg: 'qrc:/images/right_f_green.png'
    property string radarRightFYellowImg: 'qrc:/images/right_f_yellow.png'
    property string radarRightFRedImg: 'qrc:/images/right_f_red.png'

    property string radarRightRGreenImg: 'qrc:/images/right_r_green.png'
    property string radarRightRYellowImg: 'qrc:/images/right_r_yellow.png'
    property string radarRightRRedImg: 'qrc:/images/right_r_red.png'

    property string radarLeftFGreenImg: 'qrc:/images/left_f_green.png'
    property string radarLeftFYellowImg: 'qrc:/images/left_f_yellow.png'
    property string radarLeftFRedImg: 'qrc:/images/left_f_red.png'

    property string radarLeftRGreenImg: 'qrc:/images/left_r_green.png'
    property string radarLeftRYellowImg: 'qrc:/images/left_r_yellow.png'
    property string radarLeftRRedImg: 'qrc:/images/left_r_red.png'

    property string radarBottomGreenImg: 'qrc:/images/bottom_green.png'
    property string radarBottomYellowImg: 'qrc:/images/bottom_yellow.png'
    property string radarBottomRedImg: 'qrc:/images/bottom_red.png'

    property int radarRightMargin: 40
    property int radarTopMargin: 350
    property int radarBottomMargin: 280
    property int radarleftMargin: 200
    property int radarTxtSize: 14

    property bool m_bIfDisplayLine: true
    property bool m_bIfDisplayLine_2: true
    property int currentIndex: 0

    FontLoader {
        id: alibaba
        source: "qrc:/components/font/Alibaba-PuHuiTi-Bold.ttf"
    }

    FontLoader {
        id: fontawesome
        source: "qrc:/components/font/fontawesome-webfont.ttf"
    }

    FontLoader {
        id: digtalFont
        source: "qrc:/components/font/fontawesome-webfont.ttf"
    }


    Rectangle {
        id: mainForm
        anchors.fill: parent
        anchors.horizontalCenter: mainForm.horizontalCenter
        Image {
            fillMode: Image.PreserveAspectFit
            source: 'qrc:/images/bg4k.png'
        }

        Rectangle {
            id: mainFormHeader
            width: mainForm.width
            height: 80
            color: 'transparent'
            
            //visible:false
            Image {
                id: mainFormBannerBg
                anchors.top: mainFormHeader.top
                anchors.right: mainFormHeader.right
                anchors.rightMargin: 990
                fillMode: Image.PreserveAspectFit
                source: 'qrc:/images/banner.png'
            }
            Text {
                id: mainFormTitle
                width: mainFormHeader.width
                height: mainFormHeader.height
                horizontalAlignment: Text.AlignHCenter
                verticalAlignment: Text.AlignVCenter
                anchors.right: mainFormHeader.right
                anchors.rightMargin: 10
                text: textTitle
                font.family: alibaba.name
                font.pointSize: 24
                color: mainTextColor
            }

            Text {
                id: delayms
                text: '网络延迟： ' + (appModel.ping / 2).toFixed(1) + ' ms'
                color: appModel.ping/2 > 200 ? popupBgColorErr : mainTextColor
                font.family: alibaba.name
                font.pointSize: 16
                anchors.right: mainFormHeader.right
                anchors.rightMargin: 150
                anchors.top: mainFormHeader.top
                anchors.topMargin: 25
            }

            
            //时间显示
            Rectangle {
                id: refreshDate
                width: statusData.width - 100
                height: 50
                color: mainAppColor
                anchors.top: mainFormHeader.top
                anchors.topMargin: 25
                anchors.left: mainFormHeader.left
                anchors.leftMargin: 130
                Text {
                    id: localTime
                    width: 140
                    height: 50
                    anchors.horizontalCenter: refreshDate.horizontalCenter
                    color: '#FFFFFF'
                    font.family: digtalFont.name
                    font.pointSize: 20
                    text: new Date().toLocaleTimeString()
                    Component.onCompleted: {
                        localTimeRefresh.start()
                    }
                }
                Timer {
                    id: localTimeRefresh
                    interval: 1000
                    repeat: true
                    onTriggered: {
                        localTime.text = new Date().toLocaleTimeString()
                    }
                }
            }
        }

        Rectangle {
            id: mainFormContent
            width: mainForm.width
            height: mainForm.height - 80
            anchors.top: mainFormHeader.bottom
            color: 'transparent'

            Row {
                /*
                Rectangle {
                    id: statusData
                    width: statusWidth + lineWidth -100
                    height: mainHeight
                    color: 'transparent'

                    /*
                    Image {
                        width: lineWidth
                        height: mainHeight
                        anchors.left: statusData.left
                        anchors.leftMargin: 20
                        fillMode: Image.Stretch
                        source: 'qrc:/images/border_l.png'
                    }
                    
                    Rectangle {
                        id: carImage
                        width: statusData.width - 200
                        height: 300
                        color: 'transparent'
                        anchors.horizontalCenter: statusData.horizontalCenter
                        anchors.top: statusData.top
                        anchors.topMargin: 50
                        anchors.left: statusData.left
                        anchors.horizontalCenterOffset: 10
                        Image {
                            width: 360
                            height: 240
                            fillMode: Image.Stretch
                            source: 'qrc:/images/wagon.png'
                            anchors.horizontalCenter: carImage.horizontalCenter
                        }
                    }
                     Row {
                        id: driveDataForm
                        width: statusData.width - 100
                        height: 300
                        anchors.top: carImage.bottom
                        anchors.topMargin: 0
                        anchors.left: carImage.left
                        anchors.leftMargin: 100

                        Text {
                            text:"舱位:"
                            color: mainTextColor
                            anchors.left: statusData.left
                            anchors.leftMargin: 20
                            font.family: alibaba.name
                            font.pointSize: 20
                        }
                        Text {
                            id: driveOpType
                            text: appModel.DriveName
                            color: mainTextColor
                            anchors.left: radarData.left
                            anchors.leftMargin: 180
                            font.family: digtalFont.name
                            font.pointSize: 20
                        }

                        spacing: 50
                    }
                    Row {
                        id: carDataForm
                        width: statusData.width - 100
                        height: 300
                        anchors.top: carImage.bottom
                        anchors.topMargin: 40
                        anchors.left: carImage.left
                        anchors.leftMargin: 100

                        Text {
                            text:"车号 :"
                            color: mainTextColor
                            anchors.left: statusData.left
                            anchors.leftMargin: 20
                            font.family: alibaba.name
                            font.pointSize: 20
                        }
                        Text {
                            id: carOpType
                            text: appModel.CarName
                            color: mainTextColor
                            anchors.left: radarData.left
                            anchors.leftMargin: 180
                            font.family: digtalFont.name
                            font.pointSize: 20
                        }

                        spacing: 50
                    }
                      Row {
                        id: tempState
                        width: statusData.width - 100
                        height: 300
                        anchors.top: carImage.bottom
                        anchors.topMargin: 80
                        anchors.left: carImage.left
                        anchors.leftMargin: 100
                         visible:true
                        Text {
                            text: "系统温度:"
                            color: mainTextColor
                            anchors.left: statusData.left
                            anchors.leftMargin: 20
                            font.family: alibaba.name
                            font.pointSize: 20
                        }
                        Text {
                            id: tempValue

                            text: appModel.temp +"°C"
                            color:  appModel.temp<70? mainTextColor:popupBgColorErr
                            anchors.left: radarData.left
                            anchors.leftMargin: 180
                            font.family: digtalFont.name
                            font.pointSize: 24
                        }

                        spacing: 50
                    }
                      Row {
                        id: steerState
                        width: statusData.width - 100
                        height: 300
                        anchors.top: carImage.bottom
                        anchors.topMargin: 120
                        anchors.left: carImage.left
                        anchors.leftMargin: 100
                        visible:true
                        Text {
                            text: "转向角度 :"
                            color: mainTextColor
                            anchors.left: statusData.left
                            anchors.leftMargin: 20
                            font.family: alibaba.name
                            font.pointSize: 20
                        }
                        Text {
                            id: steer
                            text: appModel.Steer
                            color: mainTextColor
                            anchors.left: radarData.left
                            anchors.leftMargin: 180
                            font.family: digtalFont.name
                            font.pointSize: 24
                        }


                        spacing: 50
                    }
                    Row {
                        id: rpmState
                        width: statusData.width - 100
                        height: 300
                        anchors.top: carImage.bottom
                        anchors.topMargin: 160
                        anchors.left: carImage.left
                        anchors.leftMargin: 100
                         visible:appModel.Visible
                        Text {
                            text: "发动机转速:"
                            color: mainTextColor
                            anchors.left: statusData.left
                            anchors.leftMargin: 20
                            font.family: alibaba.name
                            font.pointSize: 20
                        }
                        Text {
                            id: rpmValue

                            text: appModel.EnginRpm
                            color:  appModel.EnginRpm>200? mainTextColor:popupBgColorErr
                            anchors.left: radarData.left
                            anchors.leftMargin: 180
                            font.family: digtalFont.name
                            font.pointSize: 24
                        }

                        spacing: 50
                    }
                    Row {
                        id: gpaState
                        width: statusData.width - 100
                        height: 300
                        anchors.top: carImage.bottom
                        anchors.topMargin: 200
                        anchors.left: carImage.left
                        anchors.leftMargin: 100
                        visible:appModel.Visible
                        Text {
                            text: "发动机油压:"

                            color: mainTextColor
                            anchors.left: statusData.left
                            anchors.leftMargin: 20
                            font.family: alibaba.name
                            font.pointSize: 20
                        }
                        Text {
                            id: gpavalue

                            text: appModel.EngineOilPressure
                            color: mainTextColor
                            anchors.left: radarData.left
                            anchors.leftMargin: 180
                            font.family: digtalFont.name
                            font.pointSize: 24
                        }

                        spacing: 50
                    }
                    Row {
                        id: coldState
                        width: statusData.width - 100
                        height: 300
                        anchors.top: carImage.bottom
                        anchors.topMargin: 240
                        anchors.left: carImage.left
                        anchors.leftMargin: 100
                        visible:appModel.Visible
                        Text {
                            text: "冷却液温度:"
                            color: mainTextColor
                            anchors.left: statusData.left
                            anchors.leftMargin: 20
                            font.family: alibaba.name
                            font.pointSize: 20
                        }
                        Text {
                            id: coldValue
                            text: appModel.Cold
                            color: mainTextColor
                            anchors.left: radarData.left
                            anchors.leftMargin: 180
                            font.family: digtalFont.name
                            font.pointSize: 24
                        }

                        spacing: 50
                    }
                        Row {
                        id: paState
                        width: statusData.width - 100
                        height: 300
                        anchors.top: carImage.bottom
                        anchors.topMargin: 280
                        anchors.left: carImage.left
                        anchors.leftMargin: 100
                        visible:appModel.Visible
                        Text {
                            text: "变速箱油压:"
                            color: mainTextColor
                            anchors.left: statusData.left
                            anchors.leftMargin: 20
                            font.family: alibaba.name
                            font.pointSize: 20
                        }
                        Text {
                            id: paValue
                            text: appModel.GearboxOilPressure
                            color: appModel.GearboxOilPressure<16 || appModel.GearboxOilPressure>20? popupBgColorErr:mainTextColor
                            anchors.left: radarData.left
                            anchors.leftMargin: 180
                            font.family: digtalFont.name
                            font.pointSize: 24
                        }

                        spacing: 50
                    }
                      Row {
                        id: gearState
                        width: statusData.width - 100
                        height: 300
                        anchors.top: carImage.bottom
                        anchors.topMargin: 320
                        anchors.left: carImage.left
                        anchors.leftMargin: 100
                        visible:appModel.Visible
                        Text {
                            text: "变速箱油温:"
                            color: mainTextColor
                            anchors.left: statusData.left
                            anchors.leftMargin: 20
                            font.family: alibaba.name
                            font.pointSize: 20
                        }
                        Text {
                            id: gearValue
                            text: appModel.GearboxOilTemp
                            color: appModel.GearboxOilTemp>100 ? popupBgColorErr:mainTextColor
                            anchors.left: radarData.left
                            anchors.leftMargin: 180
                            font.family: digtalFont.name
                            font.pointSize: 24
                        }


                        spacing: 50
                    }
                         Row {
                        id: brakeState
                        width: statusData.width - 100
                        height: 300
                        anchors.top: carImage.bottom
                        anchors.topMargin: 360
                        anchors.left: carImage.left
                        anchors.leftMargin: 100
                        visible:appModel.Visible
                        Text {
                            text: "制动压力 :"
                            color: mainTextColor
                            anchors.left: statusData.left
                            anchors.leftMargin: 20
                            font.family: alibaba.name
                            font.pointSize: 20
                        }
                        Text {
                            id: brakeValue
                            text: appModel.BrakePressure
                            color:  appModel.BrakePressure<6 ? popupBgColorErr:mainTextColor
                            anchors.left: radarData.left
                            anchors.leftMargin: 180
                            font.family: digtalFont.name
                            font.pointSize: 24
                        }


                        spacing: 50
                    }
                      Row {
                        id: presState
                        width: statusData.width - 100
                        height: 300
                        anchors.top: carImage.bottom
                        anchors.topMargin: 400
                        anchors.left: carImage.left
                        anchors.leftMargin: 100
                        visible:appModel.Visible
                        Text {
                            text: "液压压力 :"
                            color: mainTextColor
                            anchors.left: statusData.left
                            anchors.leftMargin: 20
                            font.family: alibaba.name
                            font.pointSize: 20
                        }
                        Text {
                            id: preValue
                            text: appModel.BrakePressure
                            color: mainTextColor
                            anchors.left: radarData.left
                            anchors.leftMargin: 180
                            font.family: digtalFont.name
                            font.pointSize: 24
                        }


                        spacing: 50
                    }
                     /*
                     Row {
                        id: speedState
                        width: statusData.width - 100
                        height: 300
                        anchors.top: carImage.bottom
                        anchors.topMargin: 320
                        anchors.left: carImage.left
                        anchors.leftMargin: 100
                        visible:appModel.Visible
                        Text {
                            text: "车辆速度 :"
                            color: mainTextColor
                            anchors.left: statusData.left
                            anchors.leftMargin: 20
                            font.family: alibaba.name
                            font.pointSize: 20
                        }
                        Text {
                            id: speed
                            text:appModel.Speed
                            color: mainTextColor
                            anchors.left: radarData.left
                            anchors.leftMargin: 180
                            font.family: digtalFont.name
                            font.pointSize: 24
                        }


                        spacing: 50
                    }
                    
                    
                   /*   Row {
                        id: leftlockState
                        width: statusData.width - 100
                        height: 300
                        anchors.top: carImage.bottom
                        anchors.topMargin: 390
                        anchors.left: carImage.left
                        anchors.leftMargin: 100
                        
                        Text {
                            text: "左锁钩状态 :"
                            color: mainTextColor
                            anchors.left: statusData.left
                            anchors.leftMargin: 20
                            font.family: alibaba.name
                            font.pointSize: 20
                        }
                        Text {
                            id: leftlock
                            text:  appModel.Steer
                            color: mainTextColor
                            anchors.left: radarData.left
                            anchors.leftMargin: 180
                            font.family: digtalFont.name
                            font.pointSize: 24
                        }


                        spacing: 50
                    }
                    Row {
                        id: rightlockState
                        width: statusData.width - 100
                        height: 300
                        anchors.top: carImage.bottom
                        anchors.topMargin: 425
                        anchors.left: carImage.left
                        anchors.leftMargin: 100

                        Text {
                            text: "右锁钩状态 :"
                            color: mainTextColor
                            anchors.left: statusData.left
                            anchors.leftMargin: 20
                            font.family: alibaba.name
                            font.pointSize: 20
                        }
                        Text {
                            id: rightlock
                            text:  appModel.Steer
                            color: mainTextColor
                            anchors.left: radarData.left
                            anchors.leftMargin: 180
                            font.family: digtalFont.name
                            font.pointSize: 24
                        }


                        spacing: 50
                    }
                    Rectangle {
                        id: refreshDate
                        width: statusData.width - 100
                        height: 50
                        color: mainAppColor
                        anchors.bottom: statusData.bottom
                        anchors.bottomMargin: 30
                        anchors.horizontalCenter: statusData.horizontalCenter
                        anchors.horizontalCenterOffset: 10
                        Text {
                            id: localTime
                            width: 140
                            height: 50
                            anchors.horizontalCenter: refreshDate.horizontalCenter
                            color: '#FFFFFF'
                            font.family: digtalFont.name
                            font.pointSize: 36
                            text: new Date().toLocaleTimeString()
                            Component.onCompleted: {
                                localTimeRefresh.start()
                            }
                        }
                        Timer {
                            id: localTimeRefresh
                            interval: 1000
                            repeat: true
                            onTriggered: {
                                localTime.text = new Date().toLocaleTimeString()
                            }
                        }
                    }

                   /* Image {
                        width: lineWidth
                        height: mainHeight
                        anchors.right: statusData.right
                        fillMode: Image.Stretch
                        source: 'qrc:/images/border_r.png'
                    }
                }
                */

                Rectangle {
                    id: leftCam
                    //width: leftCamWidth + lineWidth
                    width: leftCamWidth + lineWidth + statusWidth + lineWidth
                    height: mainHeight
                    color: 'transparent'

                    /* Image {
                        width: lineWidth
                        height: mainHeight
                        anchors.left: leftCam.left
                        anchors.leftMargin: 20
                        fillMode: Image.Stretch
                        source: 'qrc:/images/border_l.png'
                        z: 99
                    }
                    */

                    Image {
                        anchors.left: leftCam.right
                        anchors.leftMargin: -130
                        anchors.top: leftCam.top
                        anchors.topMargin: -35
                        fillMode: Image.Stretch
                        //左后视镜边框
                        source: 'qrc:/images/sideV_left1.png'
                        z: 99
                    }

                    Column {
                        anchors.left: leftCam.left
                        anchors.leftMargin: 20
                        Rectangle {
                            width: leftCamWidth + statusWidth + lineWidth
                            height: mainHeight
                            color: 'transparent'
                            anchors.left: leftCam.left
                            anchors.leftMargin: 20
                            border.color: "blue"
                            border.width: 1
                            // CAM Left
                            Image {
                                id: leftImg
                                width: leftCamWidth + statusWidth + lineWidth
                                height: mainHeight
                                //fillMode: Image.Stretch//拉伸模式
                                //fillMode: Image.PreserveAspectFit//保持宽高比例适应模式
                                fillMode: Image.PreserveAspectCrop //保持宽高比裁剪模式
                                //fillMode: Image.Tile//平铺模式
                            }
                            //左摄像头
                            Connections {
                                target: LeftImage
                                onCallQmlRefeshLeftImg: {
                                    //aaa
                                    leftImg.source = ""
                                    leftImg.source = "image://LeftImage"
                                }
                            }
                            Image {
                                id: leftImg_camera1
                                width: leftCamWidth + statusWidth + lineWidth
                                height: mainHeight
                                fillMode: Image.Stretch
                                source: 'qrc:/images/left_camera1.png'
                            }
                        }
                    }
                    Image {
                        anchors.top: leftCam.top
                        anchors.topMargin: -30
                        anchors.right: leftCam.left
                        anchors.rightMargin: -100
                        fillMode: Image.Stretch
                        //左后视镜边框
                        source: 'qrc:/images/sideV_right1.png'
                        z: 99
                    }
                    /*
                    Rectangle {
                        width: leftCamWidth
                        height: mainHeight/2
                        y:mainHeight/2
                        color: 'transparent'
                        anchors.left: leftCam.left
                        anchors.leftMargin: 20
                        border.color: mainAppColor
                        border.width: 1
                        // CAM Left
                        Image {
                            id: leftan
                            width: leftCamWidth
                            height: mainHeight/2
                            fillMode: Image.Stretch
                        }
                        Connections {
                            target: LeftAnchor
                            onCallQmlRefeshLeftAnchor: {
                                leftan.source = ""
                                leftan.source = "image://LeftAnchor"
                            }
                        }
                    }
                    */
                    /* Image {
                        width: lineWidth
                        height: mainHeight
                        anchors.right: leftCam.right
                        fillMode: Image.Stretch
                        source: 'qrc:/images/border_r.png'
                        z: 99
                    }
                    */
                    
                }
                Rectangle {
                    id: centerPanel
                    width: frontCamWidth + 2 * lineWidth
                    height: mainHeight
                    anchors.top: mainFormContent.top
                    anchors.horizontalCenter: mainFormContent.horizontalCenter
                    color: 'transparent'
                    
                    MouseArea {
                        anchors.fill: parent
                        drag.target: backImgRect
                        drag.axis: Drag.XandYAxis
                        drag.minimumX: 20
                        drag.maximumX: centerPanel.width - backImgRect.width - 20
                        drag.minimumY: 0
                        drag.maximumY: centerPanel.height - backImgRect.height
                    }
                    

                    //新增的边框图片
                    Image {
                        height: 1100
                        anchors.left: centerPanel.left
                        anchors.leftMargin: 0
                        anchors.top: centerPanel.top
                        anchors.topMargin: -75
                        fillMode: Image.Stretch
                        visible: true
                        //中间屏幕边框
                        source: 'qrc:/images/main_left.png'
                        z: 99
                    }
                    Rectangle {
                        width: frontCamWidth1
                        height: mainHeight
                        color: 'transparent'
                        anchors.left: centerPanel.left
                        anchors.leftMargin: 105
                        border.color: "blue"
                        border.width: 1
                        // CAM FRONT
                        Image {
                            id: frontImg
                            anchors.topMargin: 140
                            width: frontCamWidth1
                            height: mainHeight
                            fillMode: Image.Stretch
                            //fillMode: Image.PreserveAspectFit//保持宽高比例适应模式
                            //fillMode: Image.PreserveAspectCrop //保持宽高比裁剪模式
                            //fillMode: Image.Tile//平铺模式
                            z: 97
                        }
                        Connections {
                            target: FrontImage
                            onCallQmlRefeshFrontImg: {
                            //aaa
                                frontImg.source = ""
                                frontImg.source = "image://FrontImage"
                            }
                        }
                        
                        Image {
                            id: img_camera1
                            anchors.topMargin: 140
                            width: frontCamWidth1
                            height: mainHeight
                            fillMode: Image.Stretch
                            source: 'qrc:/images/middle_camera1.png'
                            z: 97
                        }
                        Image {
                            id: img_camera2
                            visible:true
                            anchors.top:parent.top
                            anchors.topMargin: 640
                            anchors.horizontalCenter: parent.horizontalCenter
                            //anchors.verticalCenter: parent.verticalCenter
                            width: frontCamWidth1*4/5
                            height: mainHeight/3
                            fillMode: Image.Stretch
                            source: 'qrc:/images/caution2.png'
                            z: 99
                        }
                    }

                    Rectangle {
                        id: backImgRect1
                        width: frontCamWidth
                        height: mainHeight
                        color: 'transparent'
                        x:25
                        z:100
                        //y:mainHeight/2+200
                        border.color: "transparent"
                        border.width: 1


                       /* 
                        // CAM BACK REAR
                        Image {
                            id: backImg
                            anchors.topMargin: 40
                            anchors.horizontalCenter: parent.horizontalCenter
                            width: parent.width/4
                            height: parent.height/4
                            fillMode: Image.Stretch
                            z: 98
                        }

                        Connections {
                            target: RightAnchor
                            onCallQmlRefeshRightAnchor: {
                            //aaa
                            //增加的第6个摄像头-在最上面
                                backImg.source = ""
                                //backImg.source = "image://RightAnchor"
                            }
                        }*/
                        
                        Rectangle {
                            Image {
                                fillMode: Image.Stretch
                                x: 10
                                y: 440
                                z: 99
                                //                            visible:appModel.lightL === 1
                                visible: true
                                source: 'qrc:/images/left_light1.png'
                            }
                            Image {
                                fillMode: Image.Stretch
                                x: 10
                                y: 440
                                z: 99
                                visible: appModel.lightL === true
                                //visible: true
                                source: 'qrc:/images/left_light.png'
                            }
                            Text {
                                id: leftLight
                                x: 10
                                y: 470
                                z: 99
                                text: "左转"
                                color: "#70FFFFFF"
                                font.family: alibaba.name
                                font.pointSize: radarTxtSize
                            }
                        }
                        Rectangle {
                            Image {
                                x: 10
                                y: 500
                                z: 99
                                fillMode: Image.Stretch
                                //                                visible:appModel.lightFront === 1
                                visible: true
                                source: 'qrc:/images/frontlight1.png'
                            }
                            Image {
                                x: 10
                                y: 500
                                z: 99
                                fillMode: Image.Stretch
                                visible: appModel.lightFront
                                //                                visible: true
                                source: 'qrc:/images/frontlight.png'
                            }
                            Text {
                                id: frontlight
                                x: 10
                                y: 530
                                z: 99
                                text: "前灯"
                                color: "#70FFFFFF"
                                font.family: alibaba.name
                                font.pointSize: radarTxtSize
                            }
                        }

                        Rectangle {
                            Image {
                                fillMode: Image.Stretch
                                x: 10
                                y: 560
                                z: 99
                                //                                visible:appModel.carPark === 1
                                visible: true
                                source: 'qrc:/images/emergency1.png'
                            }
                            Image {
                                fillMode: Image.Stretch
                                x: 10
                                y: 560
                                z: 99
                                visible: appModel.carPark === false
                                //visible: true
                                source: 'qrc:/images/emergency.png'
                            }
                            Text {
                                id: emergency
                                x: 10
                                y: 590
                                z: 99
                                text: "驻停"
                                color: "#70FFFFFF"
                                font.family: alibaba.name
                                font.pointSize: radarTxtSize
                            }
                        }
                        Rectangle {

                            Image {
                                fillMode: Image.Stretch
                                x: 10
                                y: 620
                                z: 99
                                //visible:appModel.cautionLight === 1
                                visible: true
                                source: 'qrc:/images/buzzer1.png'
                            }
                            Image {
                                fillMode: Image.Stretch
                                x: 10
                                y: 620
                                z: 99
                                visible: appModel.cautionLight === true
                                //visible:true
                                source: 'qrc:/images/buzzer.png'
                            }
                            Text {
                                id: buzzer
                                x: 10
                                y: 650
                                z: 99
                                text: "双闪"
                                color: "#70FFFFFF"
                                font.family: alibaba.name
                                font.pointSize: radarTxtSize
                            }
                        }

                        Rectangle {
                            Image {
                                fillMode: Image.Stretch
                                x: 10
                                y: 680
                                z: 99
                                //                                visible:appModel.lightWork === 1
                                visible: true
                                source: 'qrc:/images/wiper1.png'
                            }

                            Image {
                                fillMode: Image.Stretch
                                x: 10
                                y: 680
                                z: 99
                                visible: appModel.lightWork === true
                                //                                visible:true
                                source: 'qrc:/images/wiper.png'
                            }

                            Text {
                                id: wiper
                                x: 10
                                y: 715
                                z: 99
                                text: "工作"
                                color: "#70FFFFFF"
                                font.family: alibaba.name
                                font.pointSize: radarTxtSize
                            }
                        }

                        Rectangle {
                            Image {
                                fillMode: Image.Stretch
                                x: 10
                                y: 745
                                z: 99
                                //                                visible:appModel.gearR === 0
                                visible: true
                                source: 'qrc:/images/backlight1.png'
                            }
                            Image {
                                fillMode: Image.Stretch
                                x: 10
                                y: 745
                                z: 99
                                visible: appModel.gearR === true
                                //visible:true
                                source: 'qrc:/images/backlight.png'
                            }
                            Text {
                                id: backlight
                                x: 10
                                y: 775
                                z: 99
                                text: "后灯"
                                color: "#70FFFFFF"
                                font.family: alibaba.name
                                font.pointSize: radarTxtSize
                            }
                        }

                        Rectangle {
                            Image {
                                fillMode: Image.Stretch
                                x: 880
                                y: 645
                                z: 100
                                visible: appModel.emergency1 === false
                                //visible:true
                                source: 'qrc:/images/carStop.png'
                            }
                            Text {
                                id: emergencyLight
                                x: 913
                                y: 775
                                z: 100
                                visible: appModel.emergency1 === false
                                text: "急停"
                                color: "red"
                                font.family: alibaba.name
                                font.pointSize: 24
                            }
                        }

                        Rectangle {
                            Image {
                                fillMode: Image.Stretch
                                x: 1845
                                y: 440
                                z: 99
                                visible: true
                                //                                visible:appModel.lightR === 1
                                source: 'qrc:/images/right_light1.png'
                            }
                            Image {
                                fillMode: Image.Stretch
                                x: 1845
                                y: 440
                                z: 99
                                //visible: true
                                visible: appModel.lightR === true
                                source: 'qrc:/images/right_light.png'
                            }
                            Text {
                                id: rightLight
                                x: 1845
                                y: 470
                                z: 99
                                text: "右转"
                                font.family: alibaba.name
                                font.pointSize: radarTxtSize
                                color: "#70FFFFFF"
                            }
                        }

                        Rectangle {
                            Image {
                                fillMode: Image.Stretch
                                x: 1845
                                y: 500
                                z: 99
                                //                                visible:(appModel.gear_d === 1)&&(appModel.forward !== -1)
                                visible: true
                                source: 'qrc:/images/gear_11.png'
                            }
                            Image {
                                fillMode: Image.Stretch
                                x: 1845
                                y: 500
                                z: 99
                                //                                visible:(appModel.gear_d === 1)&&(appModel.forward !== -1)
                                visible: true
                                source: 'qrc:/images/gear_1.png'
                            }
                            Text {
                                id: gear_d_1
                                x: 1845
                                y: 530
                                z: 99
                                text: " 1挡"
                                font.family: alibaba.name
                                font.pointSize: radarTxtSize
                                color: "#70FFFFFF"
                            }
                        }
                        Rectangle {
                            Image {
                                fillMode: Image.Stretch
                                x: 1845
                                y: 560
                                z: 99
                                //                                visible:appModel.gear_d === 2
                                visible: true
                                source: 'qrc:/images/gear_21.png'
                            }
                            Image {
                                fillMode: Image.Stretch
                                x: 1845
                                y: 560
                                z: 99
                                //                                visible:appModel.gear_d === 2
                                visible: false
                                source: 'qrc:/images/gear_2.png'
                            }
                            Text {
                                id: gear_d_2
                                x: 1845
                                y: 590
                                z: 99
                                text: " 2挡"
                                font.family: alibaba.name
                                font.pointSize: radarTxtSize
                                color: "#70FFFFFF"
                            }
                        }

                        Rectangle {
                            Image {
                                fillMode: Image.Stretch
                                x: 1845
                                y: 590
                                z: 99
                                //                                visible:appModel.gear_d === 3
                                visible: false
                                source: 'qrc:/images/gear_3.png'
                            }
                            Image {
                                fillMode: Image.Stretch
                                x: 1845
                                y: 590
                                z: 99
                                //                                visible:appModel.gear_d === 4
                                visible: false
                                source: 'qrc:/images/gear_4.png'
                            }
                        }
                        Rectangle {
                            Image {
                                fillMode: Image.Stretch
                                x: 1845
                                y: 620
                                z: 99
                                //                                visible:appModel.gearF === 1
                                visible: true
                                source: 'qrc:/images/gear_d1.png'
                            }
                            Image {
                                fillMode: Image.Stretch
                                x: 1845
                                y: 620
                                z: 99
                                visible: appModel.gearF === true
                                //visible: true
                                source: 'qrc:/images/gear_d.png'
                            }
                            Text {
                                id: gear_d
                                x: 1845
                                y: 650
                                z: 99
                                text: " F挡"
                                font.family: alibaba.name
                                font.pointSize: radarTxtSize
                                color: "#70FFFFFF"
                            }
                        }

                        Rectangle {
                            Image {
                                fillMode: Image.Stretch
                                x: 1845
                                y: 680
                                z: 99
                                //visible:appModel.forward === -1
                                visible: true
                                source: 'qrc:/images/gear_n1.png'
                            }
                            Image {
                                fillMode: Image.Stretch
                                x: 1845
                                y: 680
                                z: 99
                                visible: (appModel.gearR === false)
                                         && (appModel.gearF === false)
                                //visible: true
                                source: 'qrc:/images/gear_n.png'
                            }
                            Text {
                                id: gear_n
                                x: 1845
                                y: 710
                                z: 99
                                text: " N挡"
                                font.family: alibaba.name
                                font.pointSize: radarTxtSize
                                color: "#70FFFFFF"
                            }
                        }

                        Rectangle {
                            Image {
                                fillMode: Image.Stretch
                                x: 1845
                                y: 740
                                z: 99
                                //                                visible:appModel.gearR === 1
                                visible: true
                                source: 'qrc:/images/gear_r1.png'
                            }
                            Image {
                                fillMode: Image.Stretch
                                x: 1845
                                y: 740
                                z: 99
                                visible: appModel.gearR === true
                                //visible: true
                                source: 'qrc:/images/gear_r.png'
                            }
                            Text {
                                id: gear_r
                                x: 1845
                                y: 770
                                z: 99
                                text: " R挡"
                                font.family: alibaba.name
                                font.pointSize: radarTxtSize
                                color: "#70FFFFFF"
                            }
                        }
                    }
                    /*
                    Image {
                        width: lineWidth
                        height: mainHeight
                        anchors.right: centerPanel.right
                        anchors.rightMargin: 20
                        fillMode: Image.Stretch
                        source: 'qrc:/images/border_r.png'
                        z: 99
                    }
                    */
                    Image {
                        height: 1100
                        anchors.right: centerPanel.right
                        anchors.rightMargin: 0
                        anchors.top: centerPanel.top
                        anchors.topMargin: -75
                        fillMode: Image.Stretch
                        visible: true
                        //中间屏幕边框
                        source: 'qrc:/images/main_right.png'
                        z: 99
                    }
                }

                Rectangle {
                    id: rightCam
                    width: rightCamWidth + lineWidth + radarWidth + lineWidth
                    height: mainHeight
                    color: 'transparent'
                    
                    Image {
                        anchors.left: rightCam.left
                        anchors.leftMargin: -20
                        anchors.top: rightCam.top
                        anchors.topMargin: -32
                        fillMode: Image.Stretch

                        //右后视镜边框
                        source: 'qrc:/images/sideV_left.png'
                        z: 99
                    }
                    /*Image {
                        width: lineWidth
                        height: mainHeight
                        anchors.left: rightCam.left
                        fillMode: Image.Stretch
                        source: 'qrc:/images/border_l.png'
                        z: 99
                    }
                    */

                    Column {
                        anchors.right: rightCam.right
                        anchors.rightMargin: 20
                    

                        Rectangle {
                            width: rightCamWidth + radarWidth + lineWidth
                            height: mainHeight
                            color: 'transparent'
                            anchors.left: rightCam.left
                            border.color: "blue"
                            border.width: 1
                            // CAM Right
                            Image {
                                id: rightImg
                                width: rightCamWidth + radarWidth + lineWidth
                                height: mainHeight
                                //fillMode: Image.Stretch//拉伸模式
                                //fillMode: Image.PreserveAspectFit//保持宽高比例适应模式
                                fillMode: Image.PreserveAspectCrop //保持宽高比裁剪模式
                                //fillMode: Image.Tile//平铺模式

                            }
                            //右摄像头
                            Connections {
                                target: RightImage
                                onCallQmlRefeshRightImg: {
                                //aaa
                                    rightImg.source = ""
                                    rightImg.source = "image://RightImage"
                                }
                            }
                            Image {
                                id: rightImg_camera1
                                width: rightCamWidth + radarWidth + lineWidth + lineWidth
                                height: mainHeight
                                fillMode: Image.Stretch
                                source: 'qrc:/images/right_camera1.png'
                            }
                        }
                    }
                    Image {
                        anchors.right: rightCam.right
                        anchors.rightMargin: -45 - lineWidth
                        anchors.top: rightCam.top
                        anchors.topMargin: -34
                        fillMode: Image.Stretch
                        visible: true
                        //右后视镜边框
                        source: 'qrc:/images/sideV_right.png'
                        z: 99
                    }
                    /*
                    Rectangle {
                        width: rightCamWidth
                        height: mainHeight/2
                        y:mainHeight/2
                        color: 'transparent'
                        anchors.left: rightCam.left
                        border.color: mainAppColor
                        border.width: 1
                        // CAM Right
                        Image {
                            id: rightan
                            width: rightCamWidth
                            height: mainHeight/2
                            fillMode: Image.Stretch

                        }
                        Connections {
                            target: RightAnchor
                            onCallQmlRefeshRightAnchor: {
                                rightan.source = ""
                                rightan.source = "image://RightAnchor"
                            }
                        }
                    }
                    */
                    /* Image {
                        width: lineWidth
                        height: mainHeight
                        anchors.right: rightCam.right
                        anchors.rightMargin: 20
                        fillMode: Image.Stretch
                        source: 'qrc:/images/border_r.png'

                    }
                    */
                }
/*
                Rectangle {
                    id: radarData
                    width: radarWidth -160
                    height: mainHeight
                    color: 'transparent'

                    /* Image {
                        width: lineWidth-200
                        height: mainHeight
                        anchors.left: radarData.left
                        fillMode: Image.Stretch
                        source: 'qrc:/images/border_l.png'
                    }
                    */
                    /*
                    Image {
                        id: radar_car
                        width: 600
                        height: 800
                        anchors.horizontalCenter: radarData.horizontalCenter
                        anchors.verticalCenter: radarData.verticalCenter
                        fillMode: Image.Stretch
                        source: 'qrc:/images/radar_car.png'
                    }

                    //------------ radarRightF

                    Image {
                        id: radarRightF0
                        width: radarSize
                        height: radarSize
                        anchors.right: radarData.right
                        anchors.rightMargin: radarRightMargin
                        anchors.top: radarData.top
                        anchors.topMargin: radarTopMargin
                        fillMode: Image.PreserveAspectFit
                        source: radarRightFGreenImg
                        visible: appModel.radar1 >= radarGreenRange
                    }
                    Image {
                        id: radarRightF1
                        width: radarSize
                        height: radarSize
                        anchors.right: radarData.right
                        anchors.rightMargin: radarRightMargin
                        anchors.top: radarData.top
                        anchors.topMargin: radarTopMargin
                        fillMode: Image.PreserveAspectFit
                        source: radarRightFYellowImg
                        visible: appModel.radar1 < radarGreenRange
                                 && appModel.radar1 > radarRedRange
                    }
                    Image {
                        id: radarRightF2
                        width: radarSize
                        height: radarSize
                        anchors.right: radarData.right
                        anchors.rightMargin: radarRightMargin
                        anchors.top: radarData.top
                        anchors.topMargin: radarTopMargin
                        fillMode: Image.PreserveAspectFit
                        source: radarRightFRedImg
                        visible: appModel.radar1 <= radarRedRange
                    }

                    //------------ radarRightR
                    Image {
                        id: radarRightR0
                        width: radarSize
                        height: radarSize
                        anchors.bottom: radarData.bottom
                        anchors.bottomMargin: radarTopMargin
                        anchors.right: radarData.right
                        anchors.rightMargin: radarRightMargin
                        fillMode: Image.PreserveAspectFit
                        source: radarRightRGreenImg
                        visible: appModel.radar2 >= radarGreenRange
                    }
                    Image {
                        id: radarRightR1
                        width: radarSize
                        height: radarSize
                        anchors.bottom: radarData.bottom
                        anchors.bottomMargin: radarTopMargin
                        anchors.right: radarData.right
                        anchors.rightMargin: radarRightMargin
                        fillMode: Image.PreserveAspectFit
                        source: radarRightRYellowImg
                        visible: appModel.radar2 < radarGreenRange
                                 && appModel.radar2 > radarRedRange
                    }
                    Image {
                        id: radarRightR2
                        width: radarSize
                        height: radarSize
                        anchors.bottom: radarData.bottom
                        anchors.bottomMargin: radarTopMargin
                        anchors.right: radarData.right
                        anchors.rightMargin: radarRightMargin
                        fillMode: Image.PreserveAspectFit
                        source: radarRightRRedImg
                        visible: appModel.radar2 <= radarRedRange
                    }

                    //------------ radarLeftF
                    Image {
                        id: radarLeftF0
                        width: radarSize
                        height: radarSize
                        anchors.left: radarData.left
                        anchors.leftMargin: radarRightMargin
                        anchors.top: radarData.top
                        anchors.topMargin: radarTopMargin
                        fillMode: Image.PreserveAspectFit
                        source: radarLeftFGreenImg
                        visible: appModel.radar3 >= radarGreenRange
                    }
                    Image {
                        id: radarLeftF1
                        width: radarSize
                        height: radarSize
                        anchors.left: radarData.left
                        anchors.leftMargin: radarRightMargin
                        anchors.top: radarData.top
                        anchors.topMargin: radarTopMargin
                        fillMode: Image.PreserveAspectFit
                        source: radarLeftFYellowImg
                        visible: appModel.radar3 < radarGreenRange
                                 && appModel.radar3 > radarRedRange
                    }
                    Image {
                        id: radarLeftF2
                        width: radarSize
                        height: radarSize
                        anchors.left: radarData.left
                        anchors.leftMargin: radarRightMargin
                        anchors.top: radarData.top
                        anchors.topMargin: radarTopMargin
                        fillMode: Image.PreserveAspectFit
                        source: radarLeftFRedImg
                        visible: appModel.radar3 <= radarRedRange
                    }

                    //------------ radarLeftR
                    Image {
                        id: radarLeftR0
                        width: radarSize
                        height: radarSize
                        anchors.bottom: radarData.bottom
                        anchors.bottomMargin: radarTopMargin
                        anchors.left: radarData.left
                        anchors.leftMargin: radarRightMargin
                        fillMode: Image.PreserveAspectFit
                        source: radarLeftRGreenImg
                        visible: appModel.radar4 >= radarGreenRange
                    }

                    Image {
                        id: radarLeftR1
                        width: radarSize
                        height: radarSize
                        anchors.bottom: radarData.bottom
                        anchors.bottomMargin: radarTopMargin
                        anchors.left: radarData.left
                        anchors.leftMargin: radarRightMargin
                        fillMode: Image.PreserveAspectFit
                        source: radarLeftRYellowImg
                        visible: appModel.radar4 < radarGreenRange
                                 && appModel.radar4 > radarRedRange
                    }

                    Image {
                        id: radarLeftR2
                        width: radarSize
                        height: radarSize
                        anchors.bottom: radarData.bottom
                        anchors.bottomMargin: radarTopMargin
                        anchors.left: radarData.left
                        anchors.leftMargin: radarRightMargin
                        fillMode: Image.PreserveAspectFit
                        source: radarLeftRRedImg
                        visible: appModel.radar4 <= radarRedRange
                    }

                    //------------ radarBottomL
                    Image {
                        id: radarBottomL0
                        width: radarSize
                        height: radarSize
                        anchors.bottom: radarData.bottom
                        anchors.bottomMargin: radarBottomMargin
                        anchors.left: radarData.left
                        anchors.leftMargin: radarleftMargin
                        fillMode: Image.PreserveAspectFit
                        source: radarBottomGreenImg
                        visible: appModel.radar5 >= radarGreenRange
                    }

                    Image {
                        id: radarBottomL1
                        width: radarSize
                        height: radarSize
                        anchors.bottom: radarData.bottom
                        anchors.bottomMargin: radarBottomMargin
                        anchors.left: radarData.left
                        anchors.leftMargin: radarleftMargin
                        fillMode: Image.PreserveAspectFit
                        source: radarBottomYellowImg
                        visible: appModel.radar5 < radarGreenRange
                                 && appModel.radar5 > radarRedRange
                    }

                    Image {
                        id: radarBottomL2
                        width: radarSize
                        height: radarSize
                        anchors.bottom: radarData.bottom
                        anchors.bottomMargin: radarBottomMargin
                        anchors.left: radarData.left
                        anchors.leftMargin: radarleftMargin
                        fillMode: Image.PreserveAspectFit
                        source: radarBottomRedImg
                        visible: appModel.radar5 <= radarRedRange
                    }
                    */

                    //------------ radarBottomR
                    /*
                    Image {
                        id: radarBottomR0
                        width: radarSize
                        height: radarSize
                        anchors.bottom: radarData.bottom
                        anchors.bottomMargin: radarBottomMargin
                        anchors.right: radarData.right
                        anchors.rightMargin: radarleftMargin
                        fillMode: Image.PreserveAspectFit
                        source: radarBottomGreenImg
                        visible: appModel.radar6 >= radarGreenRange
                    }

                    Image {
                        id: radarBottomR1
                        width: radarSize
                        height: radarSize
                        anchors.bottom: radarData.bottom
                        anchors.bottomMargin: radarBottomMargin
                        anchors.right: radarData.right
                        anchors.rightMargin: radarleftMargin
                        fillMode: Image.PreserveAspectFit
                        source: radarBottomYellowImg
                        visible: appModel.radar6 < radarGreenRange
                                 && appModel.radar6 > radarRedRange
                    }

                    Image {
                        id: radarBottomR2
                        width: radarSize
                        height: radarSize
                        anchors.bottom: radarData.bottom
                        anchors.bottomMargin: radarBottomMargin
                        anchors.right: radarData.right
                        anchors.rightMargin: radarleftMargin
                        fillMode: Image.PreserveAspectFit
                        source: radarBottomRedImg
                        visible: appModel.radar6 <= radarRedRange
                    }
                    


                    Row {
                        height: parent.height
                        anchors.horizontalCenter: parent.horizontalCenter
                        anchors.top: radarData.top
                        anchors.topMargin: 60

                        Text {
                            text: "前方雷达："
                            color: mainTextColor
                            anchors.left: radarData.left
                            anchors.leftMargin: 20
                            font.family: alibaba.name
                            font.pointSize: radarTxtSize
                        }
                        spacing: 50
                        Text {
                            id: radar1
                            text: (appModel.radar1 / 100).toFixed(2)
                            color: appModel.radar1>200? mainTextColor:popupBgColorErr
                            anchors.left: radarData.left
                            anchors.leftMargin: 20
                            font.family: alibaba.name
                            font.pointSize: radarTxtSize
                        }

                    }

                    Row {
                        height: parent.height
                        anchors.top: radarData.top
                        anchors.topMargin: 100
                        anchors.horizontalCenter: parent.horizontalCenter
                        Text {
                            text: "左前雷达："
                            color: mainTextColor
                            anchors.left: radarData.left
                            anchors.leftMargin: 20
                            font.family: alibaba.name
                            font.pointSize: radarTxtSize
                        }
                        spacing: 50
                        Text {
                            id: radar2
                            text: (appModel.radar2 / 100).toFixed(2)
                            color: appModel.radar2>200? mainTextColor:popupBgColorErr
                            anchors.left: radarData.left
                            anchors.leftMargin: 60
                            font.family: alibaba.name
                            font.pointSize: radarTxtSize
                        }
                    }
                    Row{
                        height: parent.height
                        anchors.horizontalCenter: parent.horizontalCenter
                        anchors.top: radarData.top
                        anchors.topMargin: 140

                        Text {
                            text: "右前雷达："
                            color: mainTextColor
                            anchors.left: radarData.left
                            anchors.leftMargin: 20
                            font.family: alibaba.name
                            font.pointSize: radarTxtSize
                        }
                        spacing: 50
                        Text {
                            id: radar3
                            text: (appModel.radar3 / 100).toFixed(2)
                            color: appModel.radar3>200? mainTextColor:popupBgColorErr
                            anchors.left: radarData.left
                            anchors.leftMargin: 100
                            font.family: alibaba.name
                            font.pointSize: radarTxtSize
                        }
                    }
                    Row {
                        height: parent.height
                        anchors.horizontalCenter: parent.horizontalCenter
                        anchors.top: radarData.top
                        anchors.topMargin: 180

                        Text {
                            text: "左后雷达："
                            color: mainTextColor
                            anchors.left: radarData.left
                            anchors.leftMargin: 20
                            font.family: alibaba.name
                            font.pointSize: radarTxtSize
                        }
                        spacing: 50
                        Text {
                            id: radar4
                            text: (appModel.radar4 / 100).toFixed(2)
                            color: appModel.radar4>200? mainTextColor:popupBgColorErr
                            anchors.left: radarData.left
                            anchors.leftMargin: 140
                            font.family: alibaba.name
                            font.pointSize: radarTxtSize
                        }
                    }
                    Row{
                        //            spacing: 30
                        height: parent.height
                        anchors.horizontalCenter: parent.horizontalCenter
                        anchors.top: radarData.top
                        anchors.topMargin: 220
                        Text {
                            text: "右后雷达："
                            color: mainTextColor
                            anchors.left: radarData.left
                            anchors.leftMargin: 20
                            font.family: alibaba.name
                            font.pointSize: radarTxtSize
                        }
                        spacing: 50
                        Text {
                            id: radar5
                            text: (appModel.radar5 / 100).toFixed(2)
                            color: appModel.radar5>200? mainTextColor:popupBgColorErr
                            anchors.left: radarData.left
                            anchors.leftMargin: 180
                            font.family: alibaba.name
                            font.pointSize: radarTxtSize
                        }



                        
                    }
                    /*
                    Row{
             //            spacing: 30
                        height: parent.height
                        anchors.horizontalCenter: parent.horizontalCenter
                        anchors.top: radarData.top
                        anchors.topMargin: 220
                        Text {
                            text: "左倒车雷达："
                            color: mainTextColor
                            anchors.left: radarData.left
                            anchors.leftMargin: 0
                            font.family: alibaba.name
                            font.pointSize: radarTxtSize
                        }
                        spacing: 30
                        Text {
                            id: radar6
                            text: (appModel.radar6 / 100).toFixed(2)
                            color: appModel.radar6>200? mainTextColor:popupBgColorErr
                            anchors.left: radarData.left
                            anchors.leftMargin: 0
                            font.family: alibaba.name
                            font.pointSize: radarTxtSize
                        }




                    }
                    Row{
             //            spacing: 30
                        height: parent.height
                        anchors.horizontalCenter: parent.horizontalCenter
                        anchors.top: radarData.top
                        anchors.topMargin: 260
                        Text {
                            text: "右倒车雷达："
                            color: mainTextColor
                            anchors.left: radarData.left
                            anchors.leftMargin: 0
                            font.family: alibaba.name
                            font.pointSize: radarTxtSize
                        }
                        spacing: 30
                        Text {
                            id: radar7
                            text: (appModel.radar7 / 100).toFixed(2)
                            color: appModel.radar7>200? mainTextColor:popupBgColorErr
                            anchors.left: radarData.left
                            anchors.leftMargin: 0
                            font.family: alibaba.name
                            font.pointSize: radarTxtSize
                        }




                    }
                    Rectangle {
                        id: chart
                        width: radarData.width
                        height: 400
                        anchors.horizontalCenter: parent.horizontalCenter
                        anchors.top: radarData.top
                        anchors.topMargin: 400
                        anchors.left: radarData.left
                        anchors.leftMargin: 0
                        color: 'transparent'

                        //   anchors.topMargin: 30


                        ChartView {
                            titleColor: mainTextColor
                            title: "支腿高度"
                            anchors.fill: parent
                            //  legend.alignment: Qt.AlignBottom
                            antialiasing: true
                            backgroundColor: "#050e34"
                            titleFont.pixelSize: 24

                            StackedBarSeries {
                                id: mySeries
                                axisX: BarCategoryAxis {
                                    color: mainTextColor
                                    //categories: [  "左支腿", "右支腿" ] }
                                    categories: [  "左支腿", "右支腿" ] }

                                axisY: ValueAxis {
                                    id: barY;
                                    gridLineColor: "gray";
                                    labelsColor: "white";
                                    max: 400 }
                                BarSet {values: [ appModel.rightAngle, appModel.leftAngle ] }


                                //  BarSet { label: "James"; values: [  5, 8] }
                            }
                        }
                        
                        
                    }

                    Rectangle {
                        id: warning
                        width: radarData.width - 60
                        height: 50
                        color: popupBgColorErr
                        anchors.bottom: radarData.bottom
                        anchors.bottomMargin: 30
                        anchors.horizontalCenter: radarData.horizontalCenter
                        Text {
                            id: warningtxt
                            text: qsTr("注意保持车距")
                            color: '#FFFFFF'
                            font.family: alibaba.name
                            font.pointSize: 24
                            anchors.horizontalCenter: warning.horizontalCenter
                        }
                        visible: appModel.radar1 < radarRedRange
                                 || appModel.radar2 < radarRedRange
                                 || appModel.radar3 < radarRedRange
                                 || appModel.radar4 < radarRedRange
                                 || appModel.radar5 < radarRedRange
                                 || appModel.radar6 < radarRedRange

                    }

                    //                        Rectangle {
                    //                            width: radarData.width
                    //                            height: rightPanel.height
                    //                            color: 'transparent'

                    //                            Rectangle {
                    //                                width: radarData.width - 300
                    //                                height: radarData.height
                    //                                color: 'lightblue'

                    //                                Image {
                    //                                    width: 800
                    //                                    height: 1200
                    //                                    anchors.left: radarData.left
                    //                                    fillMode: Image.Stretch
                    //                                    source: 'qrc:/images/radar_car.png'
                    //                                }
                    //                            }
                    //                        }
                    /* Image {
                        width: lineWidth
                        height: mainHeight
                        anchors.right: radarData.right
                        fillMode: Image.Stretch
                        source: 'qrc:/images/border_r.png'
                    }
                    
                }

            */
            }
        }
    }
}