import QtQuick
import QtQuick.Controls
import TCustomPlot
import "./common"
// import "./Style"
Item {
    id: self
    width: 400
    height: 300
    property var guid: getGuid()
    property var name: parent.title
    property int __activeIndex: 1
    property real __intervalCoefficient: 0
    property var dateArr: ["00:00", "01:00","02:00","03:00","04:00","05:00","06:00","07:00","08:00","09:00","10:00","11:00","12:00","13:00","14:00","15:00","16:00","17:00","18:00","19:00","20:00","21:00","22:00", "23:00"]
    property var fieldItems: []
    property var starttime: ""
    property var stoptime: ""
    property var t_value: 0
    property var old_value: 0
    property var firstInit: true
    signal removeTabItem(var guid)
    signal changeData(var dataStr)
    property var lasttime: -1

    onNameChanged: {
        if(starttime != "" && stoptime != "" && name !== "" && guid !== "")
        {
            var req = {
                "guid": guid,
                "name": name,
                "starttime": starttime,
                "stoptime": stoptime,
                "fieldItems": fieldItems
            }
            changeData(JSON.stringify(req))
        }
    }

    //![1]
    TCustomPlot {
        id: customPlot
        focus: true
        anchors.fill: parent
        MouseArea{
            anchors.fill: parent
            hoverEnabled: true
            acceptedButtons: Qt.AllButtons
            propagateComposedEvents: false
            onPressed:
            {
                if( mouse.buttons == Qt.RightButton )
                {
                    menuTime.popup()
                }
                else
                {
                    mouse.accepted = false
                }
            }
            onPositionChanged: {
                toolTip.x = ( mouseX + toolTip.width)  > width ? (mouseX-toolTip.width) : mouseX
                toolTip.y = mouseY
                var arr = customPlot.positionChange(mouseX, mouseY)
                t_value = ""
                arr.forEach(function(obj){
                    t_value += obj.time + " " + obj.value + "\n"
                    if( old_value !== t_value)
                    {
                        old_value = t_value
                    }
                })
            }
        }
    }
    Item{
        id: toolTip
        width: 200
        height: 20
        visible: old_value !== "nan"
        Text{
            anchors.centerIn: parent
            color:"white"
            text: old_value === "nan" ? "" : old_value
        }
    }

    function removeTab()
    {
        removeTabItem(guid)
    }

    function getGuid() {
        function s4() {
            return Math.floor((1 + Math.random()) * 0x10000)
            .toString(16)
            .substring(1);
        }
        return (
                    s4() +
                    s4() +
                    "-" +
                    s4() +
                    "-4" +
                    s4().substr(0, 3) +
                    "-" +
                    s4() +
                    "-" +
                    s4() +
                    s4() +
                    s4()
                    );
    }

    function setTime(start, stop){
        starttime = start
        stoptime = stop
    }

    function setFieldItems(_fieldItems){
        fieldItems = _fieldItems
        setColors(fieldItems.length)
    }

    function appendGraph(start, stop)
    {
        starttime = start
        stoptime = stop
        var req = {
            "guid": guid,
            "name": name,
            "starttime": starttime,
            "stoptime": stoptime,
            "fieldItems": fieldItems
        }
        for( var i = 0; i < fieldItems.length; ++i)
        {
            var item = fieldItems[i]
            var measurements = []
            var fields = []
            measurements.push(item.parentName)
            fields.push(item.name)
            var req = {
                "bucket": g_curPro.name,
                "start" : start,
                "stop": stop,
                "measurement": measurements,
                "field": fields
            }
            var result = backend_proxy.influx_query_data(JSON.stringify(req))
            if(result.code !== 200)
            {
                alert.show(result.msg)
                return
            }
            customPlot.addGraphData(JSON.stringify(result.data), i )
        }
        if(stoptime == "now()")
            timerAdd.start()
    }

    function searchData(start, stop)
    {
        starttime = start
        stoptime = stop
        var req = {
            "guid": guid,
            "name": name,
            "starttime": starttime,
            "stoptime": stoptime,
            "fieldItems": fieldItems
        }
        changeData( JSON.stringify(req) )
        // customPlot.clearData()       
        var measurements = []
        var fields = []
        var check_measurements = {}
        for( var i = 0; i < fieldItems.length; ++i)
        {
            var item = fieldItems[i]

            measurements.push(item.parentName)
            fields.push(item.name)
            check_measurements[item.parentName + item.name] = true
        }
        measurements = Array.from(new Set(measurements))
        fields = Array.from(new Set(fields))
        var req = {
            "bucket": g_curPro.name,
            "start" : start,
            "stop": stop,
            "measurement": measurements,
            "field": fields
        }
        var result = backend_proxy.influx_query_data(JSON.stringify(req))
        if(result.code !== 200)
        {
            alert.show(result.msg)
            return
        }
        customPlot.setGraphData(JSON.stringify(result.data) , JSON.stringify(check_measurements))
        if(stoptime == "now()" && self.visible)
            timerAdd.start()
    }

    Menu {
        id: menuTime
        MenuItem {
            text: "自定义"
            onTriggered: datePicker.visible = true
        }
        MenuItem {
            text: "前5分钟"
            onTriggered: searchData("-5m", "now()")
        }
        MenuItem {
            text: "前15分钟"
            onTriggered: searchData("-15m", "now()")
        }
        MenuItem {
            text: "前1小时"
            onTriggered: searchData("-1h", "now()")
        }
        MenuItem {
            text: "前3小时"
            onTriggered: searchData("-3h", "now()")
        }
        MenuItem {
            text: "前6小时"
            onTriggered: searchData("-6h", "now()")
        }
        MenuItem {
            text: "前12小时"
            onTriggered: searchData("-12h", "now()")
        }
        MenuItem {
            text: "前24小时"
            onTriggered: searchData("-24h", "now()")
        }
        MenuItem {
            text: "前2天"
            onTriggered: searchData("-2d", "now()")
        }
        MenuItem {
            text: "前7天"
            onTriggered: searchData("-7d", "now()")
        }
        MenuItem {
            text: "前30天"
            onTriggered: searchData("-30d", "now()")
        }
    }

    Rectangle
    {
        id: datePicker
        anchors.centerIn: parent
        width: 620
        height: 400
        visible: false
        MouseArea
        {
            anchors.fill:parent
            onClicked:{}
        }
        Column{
            anchors.centerIn: parent
            Row
            {
                Column{
                    Rectangle
                    {
                        width: 310
                        height: 50
                        radius: 10
                        Row{
                            anchors.fill: parent
                            spacing: 5
                            Item{
                                width: 10
                                height: 1
                            }
                            QxText{
                                text: "开始时间:"
                            }
                            QxText{
                                id: txtStartTime
                                text: Qt.formatDateTime(startDate.selectedDate, "yyyy-MM-dd") +" "+ dateArr[startTime.currentIndex]
                            }
                        }

                    }
                    Row{

                        Calendar {
                            id: startDate
                            minimumDate: new Date(1970, 1, 1)
                            maximumDate: new Date()
                        }
                        Tumbler {
                            id: startTime
                            model: dateArr
                        }
                    }
                }

                Column{
                    Rectangle
                    {
                        width: 310
                        height: 50
                        radius: 10
                        Row{
                            anchors.fill: parent
                            spacing: 5
                            Item{
                                width: 10
                                height: 1
                            }
                            QxText{
                                text: "结束时间:"
                            }
                            QxText{
                                id: txtStopTime
                                text: Qt.formatDateTime(stopDate.selectedDate, "yyyy-MM-dd") + " " + dateArr[stopTime.currentIndex]
                            }
                        }
                    }
                    Row{
                        Calendar {
                            id: stopDate
                            minimumDate: new Date(1970, 1, 1)
                            maximumDate: new Date()
                        }
                        Tumbler {
                            id: stopTime
                            model: dateArr
                        }
                    }
                }
            }
            Item{
                width: parent.width
                height: 50
                Button{
                    anchors.centerIn: parent
                    text: "确认"
                    // style: ButtonStyle{}
                    onClicked:{
                        datePicker.visible = false
                        searchData(new Date(txtStartTime.text).getTime()/1000, new Date(txtStopTime.text).getTime()/1000)
                    }
                }
            }
        }
    }
  

    Timer {
        id: initTimer
        interval: 10; running: parent.visible && firstInit; repeat: false
        onTriggered: {
            firstInit = false
            searchData(starttime, stoptime)
        }
    }
     Timer {
         id: timerAdd
         interval: 2000; running: false; repeat: false
         onTriggered:{
            searchData(starttime, stoptime)
         } 
     }
    function setColors(count)
    {
        customPlot.setColors(count)
    }

    function setGraphData(jsonStr)
    {
        
    }

}