Browse Source

光伏二级页面联调数据服务;

SunZehao 2 years ago
parent
commit
8b7cd1c142
3 changed files with 197 additions and 110 deletions
  1. 28 0
      src/api/index.js
  2. 151 109
      src/components/PvDetailPages.vue
  3. 18 1
      src/components/allMatrices.vue

+ 28 - 0
src/api/index.js

@@ -31,6 +31,31 @@ const getSvgData = (params) => {
         method: "get",
     });
 }
+// 获取矩阵页面光伏二级页左侧栏数据
+const getStationInfoData = () => {
+    return request({
+        baseURL:process.env.VUE_APP_API,
+        url: `/api/station/pv_info`,
+        method: "get",
+    });
+}
+// 获取矩阵页面光伏二级页整体数据
+const getAllPvStationData = (params) => {
+    return request({
+        baseURL:process.env.VUE_APP_ADAPTERURL,
+        url: `/ts/latest?thingType=windturbine&thingId=${params.id}&uniformCodes=${params.codes}`,
+        method: "get",
+    });
+}
+// 获取矩阵页面光伏二级页echarts数据
+const getAllPvHistoryData = (params) => {
+    return request({
+        baseURL:process.env.VUE_APP_ADAPTERURL,
+        url: `/ts/history/snap?thingType=windturbine&thingId=${params.id}&uniformCode=${params.code}&startTs=${params.startTime}&endTs=${params.endTime}&interval=${params.interval}`,
+        method: "get",
+    });
+}
+
 // 标题栏数据
 const stationOverview = () => {
     return request({
@@ -413,6 +438,9 @@ export default {
     statusTime,
     getWindturbine,
     getSvgData,
+    getStationInfoData,
+    getAllPvStationData,
+    getAllPvHistoryData,
     getAllStationTab,
     getAllStationSvgInfo,
     stationOverview,

+ 151 - 109
src/components/PvDetailPages.vue

@@ -18,7 +18,7 @@
                     </div>
                     <div class="arrMsg">
                         <span style="padding-right: 20px">{{item.value}}</span>
-                        <span style="width: 20%;color: #c3c3c3">{{item.tes}}</span>
+                        <span style="width: 20%;color: #c3c3c3">{{item.unit}}</span>
                     </div>
                 </div>
             </div>
@@ -88,124 +88,165 @@ export default {
     },
     data() {
         return {
-            nbqData: []
+            nbqData: [],
+            echartsData: [],
+            pvTitle: [],
+            startTimer: null,
+            echartTimer: null,
         };
     },
+    computed: {
+        echartHeight() {
+            return {
+                'height': document.documentElement.clientHeight-30 + 'px'
+            }
+        }
+    },
     created() {
-        this.nbqData = [
-            {
-                name: '交流电压',
-                value: 0,
-                tes: 'V'
-            },
-            {
-                name: '交流电流',
-                value: 0,
-                tes: 'A'
-            },
-            {
-                name: '直流电压',
-                value: 0,
-                tes: 'V'
-            },
-            {
-                name: '直流电流',
-                value: 0,
-                tes: 'A'
-            },
-            {
-                name: '并网功率',
-                value: 0,
-                tes: 'KW'
-            },
-            {
-                name: '电网频率',
-                value: 0,
-                tes: 'Hz'
-            },
-            {
-                name: '功率因数',
-                value: 0,
-                tes: ''
-            },
-            {
-                name: '日发电量',
-                value: 0,
-                tes: 'Kwh'
-            },
-            {
-                name: '月发电量',
-                value: 0,
-                tes: 'Kwh'
-            },
-            {
-                name: '年发电量',
-                value: 0,
-                tes: 'Kwh'
-            },
-            {
-                name: '累计发电量',
-                value: 0,
-                tes: 'Kwh'
-            },
-            {
-                name: '逆变器温度',
-                value: 0,
-                tes: '℃'
-            },
-            {
-                name: '效率',
-                value: 0,
-                tes: '%'
-            },
-        ]
     },
 
     methods: {
         opened() {
-            this.$nextTick(() =>{
-                this.getEcharts()
+            this.getPvStationInfoData()
+        },
+        // 获取光伏详情配置
+        getPvStationInfoData() {
+            let that = this
+            that.echartsData = []
+            api.getStationInfoData().then(datas =>{
+                if (datas && datas.data) {
+                    console.log(datas)
+                    for(let i in datas.data) {
+                        if (that.windturbine.station === i) {
+                            this.startTimer = setInterval(() =>{
+                                that.getPvStationData(datas.data[i].codeInfos)
+                            }, 3000)
+                            this.echartTimer = setInterval(() =>{
+                                that.getEcharts(datas.data[i].codeInfos)
+                            }, 10000)
+                        }
+                    }
+                    
+                }
+            })
+        },
+        // 获取光伏详情配置数据
+        getPvStationData(list) {
+            console.log('list', list)
+            console.log('windturbine', this.windturbine)
+            let code = []
+            list.forEach(it =>{
+                code.push(it.code)
+            })
+            let params = {
+                id: this.windturbine.id,
+                codes: code.join(',')
+            }
+            api.getAllPvStationData(params).then(datas =>{
+                if (datas && datas.data) {
+                    list.forEach(it =>{
+                        if (it.code) {
+                            let codeFv = it.code.split(',')
+                            if (codeFv.length === 1) {
+                                for(let i in datas.data) {
+                                    if (it.code === i) {
+                                        it.value = datas.data[i].value.toFixed(2)
+                                    }
+                                }
+                            } else if (codeFv.length > 1) {
+                                for(let j =0; j<codeFv.length; j++) {
+                                    let codeVal = 0
+                                    for(let i in datas.data) {
+                                        if (codeFv[j] === i) {
+                                            codeVal += datas.data[i].value
+                                        }
+                                    }
+                                    it.value = codeVal.toFixed(2)
+                                }
+                            }
+                        } else {
+                            it.value = 0.00
+                        }
+                    })
+                    this.nbqData = list
+                }
             })
         },
-        closed(){},
         // 获取曲线数据
-        getEcharts() {
-            let series = [
-                {
-                name: 'Email',
-                type: 'line',
-                stack: 'Total',
-                data: [120, 132, 101, 134, 90, 230, 210]
-                },
-                {
-                name: 'Union Ads',
-                type: 'line',
-                stack: 'Total',
-                data: [220, 182, 191, 234, 290, 330, 310]
-                },
-                {
-                name: 'Video Ads',
-                type: 'line',
-                stack: 'Total',
-                data: [150, 232, 201, 154, 190, 330, 410]
-                },
-                {
-                name: 'Direct',
-                type: 'line',
-                stack: 'Total',
-                data: [320, 332, 301, 334, 390, 330, 320]
-                },
-                {
-                name: 'Search Engine',
-                type: 'line',
-                stack: 'Total',
-                data: [820, 932, 901, 934, 1290, 1330, 1320]
+        getEcharts(data) {
+            let end = new Date().getTime()
+            for(let i =0; i<data.length; i++) {
+                let it = data[i]
+                if (it.type) {
+                    let params = {
+                        id: this.windturbine.id,
+                        code: it.code,
+                        startTime: end - 8*60*60*1000,
+                        endTime: end,
+                        interval: 60
+                    }
+                    api.getAllPvHistoryData(params).then(datas =>{
+                        let obj = {
+                            name: it.name,
+                            type: it.type,
+                            series: datas.data
+                        }
+                        this.echartsData.push(obj)
+                        if (this.echartsData.length === 3) {
+                            this.changeDataFormat(this.echartsData)
+                        }
+                    })
+                }
+            }
+        },
+        changeDataFormat(datas) {
+            let series = []
+            let xAxis = []
+            let legend = []
+            console.log('datas', datas)
+            datas.forEach((it, index) =>{
+                legend.push(it.name)
+                if (index === 0) {
+                    it.series.forEach(ic =>{
+                        let time = this.getTime(new Date(ic.ts))
+                        xAxis.push(time)
+                    })
                 }
-            ]
-            let xAxis = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
-            let legend = ['Email', 'Union Ads', 'Video Ads', 'Direct', 'Search Engine']
+                let oneSeries = []
+                it.series.forEach(iv =>{
+                    oneSeries.push(iv.value)
+                })
+                let seriesObj = {
+                    name: it.name,
+                    type: 'line',
+                    data: oneSeries.map(ib => {
+                        return ib.toFixed(2)
+                    }),
+                    symbol: 'none'
+                }
+                series.push(seriesObj)
+            })
+            console.log('series', series)
+            console.log('xAxis', xAxis)
+            console.log('legend', legend)
             this.getglobalLine('pvEchart', xAxis, legend, series)
         },
+        getTime(date){ 
+            var h = date.getHours();  
+            h=h < 10 ? ('0' + h) : h;  
+            var minute = date.getMinutes();  
+            minute = minute < 10 ? ('0' + minute) : minute;  
+            var second=date.getSeconds();
+            second=second < 10 ? ('0' + second) : second;
+            return h + ':' + minute + ':' + second; 
+        },
+        closed(){
+            clearInterval(this.startTimer);
+            clearInterval(this.echartTimer);
+            this.startTimer = null
+            this.echartTimer = null
+        },
+        
         getglobalLine(name, xAxis, legend, series) {
             let option = {
                 backgroundColor: '#232d38',
@@ -227,13 +268,13 @@ export default {
                     data: xAxis
                 },
                 yAxis: {
-                    type: 'value',
-                    name: '万千瓦时(Wkw/h)'
+                    type: 'value'
                 },
                 series: series
             };
             // 基于准备好的dom,初始化echarts实例
             let dom = document.getElementById(name);
+            dom.removeAttribute("_echarts_instance_")
             let myChart = echarts.init(dom, 'dark');
             myChart.setOption(option);
             window.addEventListener("resize", function () {
@@ -339,6 +380,7 @@ export default {
             background:#232d38;
             border-radius: 10px;
             margin-top: 10px;
+            height: 60%;
             .pvRightBotTitle{
                 text-align: center;
                 height: 20px;
@@ -352,7 +394,7 @@ export default {
             }
             .pvRightBotEchart{
                 width: 100%;
-                height: 375px;
+                height: calc(100% - 70px);
             }
         }
     }

+ 18 - 1
src/components/allMatrices.vue

@@ -428,7 +428,24 @@ export default {
         console.log('item', item)
     },
     handleClickPv(values) {
-
+        if (values.active) {
+            let showIndex = null;
+            this.chooseList.forEach((item, index) => {
+            if (item.windturbineId === values.windturbineId) {
+                showIndex = index;
+            }
+            });
+            this.chooseList.splice(showIndex, 1);
+        } else {
+            this.chooseList.push(values);
+        }
+        this.stationArr.forEach((item) => {
+            item.forEach((val) => {
+            if (val.id === values.id) {
+                val.active = !val.active;
+            }
+            });
+        });
     },
     handleClosePv() {
       this.dialogPvDia = false;