{"remainingRequest":"D:\\jenkins\\workspace\\cssc-fvue\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\jenkins\\workspace\\cssc-fvue\\src\\views\\GroupCoordination\\GroupControl.vue?vue&type=script&lang=js&","dependencies":[{"path":"D:\\jenkins\\workspace\\cssc-fvue\\src\\views\\GroupCoordination\\GroupControl.vue","mtime":1667804639618},{"path":"D:\\jenkins\\workspace\\cssc-fvue\\node_modules\\babel-loader\\lib\\index.js","mtime":315532800000},{"path":"D:\\jenkins\\workspace\\cssc-fvue\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\cssc-fvue\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n\r\nimport {Chart} from '@antv/g2'\r\nimport utils from '@/hotent-ui-util'\r\nexport default {\r\n    name: 'group-control',\r\n    data() {\r\n        return {\r\n            winD: '',\r\n            tableData: [],\r\n            chart1: null,\r\n            chartData: [],\r\n            chart2: null,\r\n            chart2Data: [],\r\n            accecptData: false,\r\n            emsFactoryWinspdAvg: null,\r\n            photosUrl: '', //require(\"@/assets/img/wake_21110.png\"),\r\n            srcList: [], //require('@/assets/img/wake_21110.png')\r\n        }\r\n    },\r\n    created() {\r\n        this.initData()\r\n    },\r\n    mounted() {\r\n        this.initChart1()\r\n        this.initChart2()\r\n        this.accecptData = true\r\n        this.$bus.$on('SCADAMsg', (data) => {\r\n            if (this.accecptData) {\r\n                this.changeData(data)\r\n            }\r\n        })\r\n        this.$bus.$on('CQKZMsg', (data) => {\r\n            if (this.accecptData) {\r\n                this.changeCQKZData(data)\r\n            }\r\n        })\r\n    },\r\n    beforeDestroy() {\r\n        // 切换页面 不再接收数据\r\n        this.accecptData = false\r\n        this.monthDataReady = false\r\n        document.removeEventListener('visibilitychange', this.windowVisiable)\r\n    },\r\n    methods: {\r\n        initData() {\r\n            this.$http\r\n                .post('${cssc}/biz/cqkz/fangroup/v1/getRecently')\r\n                .then((res) => {\r\n                    if (res.status == 200 && res.data && res.data.message) {\r\n                        let data = JSON.parse(res.data.message)\r\n                        this.changeCQKZData(data)\r\n                    }\r\n                })\r\n        },\r\n        changeCQKZData(data) {\r\n            if (data.photosUrl) {\r\n                this.srcList = []\r\n                this.photosUrl = data.photosUrl\r\n                this.srcList.push(data.photosUrl)\r\n            }\r\n            if (data.data) {\r\n                this.tableData = data.data\r\n            }\r\n            this.winD = data.wind_direction ? data.wind_direction : null\r\n            // 风速\r\n            let newData = {\r\n                date: parseInt(data.wind_time ? data.wind_time : null),\r\n                winD: data.wind_direction ? data.wind_direction : null,\r\n            }\r\n            let fakeData = {\r\n                date: parseInt(data.wind_time ? data.wind_time : null) - 60000,\r\n                winD: data.wind_direction ? data.wind_direction : null,\r\n            }\r\n\r\n            // 更新\r\n            if (data.wind_direction) {\r\n                this.formatData(fakeData, 2)\r\n                this.formatData(newData, 2)\r\n            }\r\n        },\r\n        changeData(data) {\r\n            // 平均风速\r\n            this.emsFactoryWinspdAvg = data.wind.emsFactoryWinspdAvg\r\n                ? data.wind.emsFactoryWinspdAvg.val\r\n                : null\r\n\r\n            // 风速\r\n            let newData = {\r\n                date: parseInt(data.time),\r\n                winSpd: data.wind.emsFactoryWinspdAvg\r\n                    ? data.wind.emsFactoryWinspdAvg.val\r\n                    : null,\r\n            }\r\n            // 任意一个有就更新，两个都没有就不更新\r\n            if (data.wind.emsFactoryWinspdAvg) {\r\n                this.formatData(newData, 1)\r\n            }\r\n        },\r\n        initChart1() {\r\n            this.chart1 = new Chart({\r\n                container: 'container1',\r\n                autoFit: true,\r\n                height: 300,\r\n            })\r\n            this.chart1.data(this.chartData)\r\n            this.chart1.scale({\r\n                date: {\r\n                    alias: '时间',\r\n                    type: 'time',\r\n                    formatter: (value) => {\r\n                        return utils.formatDate(value, 'time')\r\n                    },\r\n                },\r\n                winSpd: {\r\n                    alias: '平均风速(m/s)',\r\n                    sync: true, // 将 pv 字段数值同 time 字段数值进行同步\r\n                    nice: true,\r\n                    min: 0,\r\n                    max: 20,\r\n                },\r\n            })\r\n            this.chart1.axis('date', {\r\n                grid: null,\r\n                label: {\r\n                    style: {\r\n                        fill: '#979ba4',\r\n                    },\r\n                },\r\n                line: {\r\n                    style: {\r\n                        stroke: '#414959',\r\n                    },\r\n                },\r\n            })\r\n            this.chart1.axis('winSpd', {\r\n                grid: null,\r\n                label: {\r\n                    style: {\r\n                        fill: '#979ba4',\r\n                    },\r\n                },\r\n                line: {\r\n                    style: {\r\n                        stroke: '#414959',\r\n                    },\r\n                },\r\n            })\r\n            this.chart1.tooltip({\r\n                shared: true,\r\n                showCrosshairs: true,\r\n                domStyles: {\r\n                    'g2-tooltip': {\r\n                        background: 'rgba(0,0,0, 0.8)',\r\n                        color: '#d6e0ec',\r\n                    },\r\n                },\r\n            })\r\n            this.chart1.line().position('date*winSpd').color('#4FAAEB')\r\n            this.chart1.interaction('active-region')\r\n            this.chart1.render()\r\n        },\r\n        reloadChart() {\r\n            this.chartData = []\r\n            this.chart1.changeData(this.chartData)\r\n        },\r\n        formatData(newData, type) {\r\n            if (type == 1) {\r\n                this.chartData.push(newData)\r\n                if (this.chartData.length > 300) {\r\n                    this.chartData.splice(0, 1)\r\n                }\r\n                this.chart1.changeData(this.chartData)\r\n            } else if (type == 2) {\r\n                this.chart2Data.push(newData)\r\n                if (this.chart2Data.length > 300) {\r\n                    this.chart2Data.splice(0, 1)\r\n                }\r\n                this.chart2.changeData(this.chart2Data)\r\n            }\r\n        },\r\n        initChart2() {\r\n            this.chart2 = new Chart({\r\n                container: 'container2',\r\n                autoFit: true,\r\n                height: 300,\r\n            })\r\n            this.chart2.data(this.chart2Data)\r\n            this.chart2.scale({\r\n                date: {\r\n                    alias: '时间',\r\n                    type: 'time',\r\n                    formatter: (value) => {\r\n                        return utils.formatDate(value, 'time')\r\n                    },\r\n                },\r\n                winD: {\r\n                    alias: '风向',\r\n                    sync: true, // 将 pv 字段数值同 time 字段数值进行同步\r\n                    nice: true,\r\n                    min: 0,\r\n                },\r\n            })\r\n            this.chart2.axis('date', {\r\n                grid: null,\r\n                label: {\r\n                    style: {\r\n                        fill: '#979ba4',\r\n                    },\r\n                },\r\n                line: {\r\n                    style: {\r\n                        stroke: '#414959',\r\n                    },\r\n                },\r\n            })\r\n            this.chart2.axis('winD', {\r\n                grid: null,\r\n                label: {\r\n                    style: {\r\n                        fill: '#979ba4',\r\n                    },\r\n                },\r\n                line: {\r\n                    style: {\r\n                        stroke: '#414959',\r\n                    },\r\n                },\r\n            })\r\n            this.chart2.tooltip({\r\n                shared: true,\r\n                showCrosshairs: true,\r\n                domStyles: {\r\n                    'g2-tooltip': {\r\n                        background: 'rgba(0,0,0, 0.8)',\r\n                        color: '#d6e0ec',\r\n                    },\r\n                },\r\n            })\r\n            this.chart2.line().position('date*winD').color('#4FAAEB')\r\n            this.chart2.interaction('active-region')\r\n            this.chart2.render()\r\n        },\r\n        windowVisiable(e) {\r\n            if (e.target.visibilityState == 'visible') {\r\n                console.log('回到当前tab标签')\r\n                this.reloadChart()\r\n            } else {\r\n                console.log('离开当前tab标签')\r\n            }\r\n        },\r\n    },\r\n}\r\n",null]}