|
@@ -0,0 +1,847 @@
|
|
|
+<template>
|
|
|
+ <div class="chart-container">
|
|
|
+ <div class="filter">
|
|
|
+ <div class="startTime">
|
|
|
+ <span class="timeText">起始时间</span>
|
|
|
+ <el-date-picker
|
|
|
+ v-model="startTime"
|
|
|
+ :clearable="false"
|
|
|
+ type="date"
|
|
|
+ value-format="timestamp"
|
|
|
+ placeholder="选择日期"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div class="endTime">
|
|
|
+ <span class="timeText">截止时间</span>
|
|
|
+ <el-date-picker
|
|
|
+ v-model="endTime"
|
|
|
+ :clearable="false"
|
|
|
+ type="date"
|
|
|
+ value-format="timestamp"
|
|
|
+ placeholder="选择日期"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <span class="timeText">设备选择</span>
|
|
|
+ <el-select v-model="equipmentId" placeholder="请选择">
|
|
|
+ <el-option
|
|
|
+ v-for="item in equipments"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ <div class="timeQuery">
|
|
|
+ <el-button :loading="loading" size="small" @click="get">查询</el-button>
|
|
|
+ </div>
|
|
|
+ <div class="timeQuery">
|
|
|
+ <el-button size="small" :loading="loading" @click="dataShow">数据显示设置</el-button>
|
|
|
+ </div>
|
|
|
+ <div class="timeQuery">
|
|
|
+ <el-button :loading="loading" size="small" @click="exportDataEvent">导出</el-button>
|
|
|
+ </div>
|
|
|
+ <div class="timeQuery">
|
|
|
+ <el-button :loading="loading" size="small" @click="prValue('click')" v-show="this.show">Pr值</el-button>
|
|
|
+ </div>
|
|
|
+ <div class="timeQuery" v-show="bShow" style="margin-left: 20%">
|
|
|
+ 日内总辐射平均:
|
|
|
+ <el-switch
|
|
|
+ v-model="switchValue"
|
|
|
+ @change="showavg"
|
|
|
+ active-color="#13ce66"
|
|
|
+ inactive-color="#ff4949"
|
|
|
+ active-text = "开启"
|
|
|
+ >
|
|
|
+ </el-switch>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="content">
|
|
|
+
|
|
|
+ <div class="tableContent">
|
|
|
+ <!-- <span class="demonstration">默认 Hover 指示器触发</span>-->
|
|
|
+ <el-carousel :height="autoH" trigger="click" :autoplay="false" direction="horizontal" indicator-position="">
|
|
|
+ <el-carousel-item v-for="item in itemDatas" :key="item.index" :label="item.type">
|
|
|
+ <vxe-grid
|
|
|
+ ref="xTable"
|
|
|
+ class="gridTable"
|
|
|
+ border
|
|
|
+ stripe
|
|
|
+ export-config
|
|
|
+ :auto-resize="true"
|
|
|
+ highlight-hover-row
|
|
|
+ :header-row-style="styleStr"
|
|
|
+ max-height="80%"
|
|
|
+ :cell-style="styleTableStr"
|
|
|
+ align="center"
|
|
|
+ :data="item.tableData"
|
|
|
+ :columns="item.tableColumn"
|
|
|
+ show-footer
|
|
|
+ :footer-method="footerMethod"
|
|
|
+ :footer-row-style="{background:'#014038',color:'white'}"
|
|
|
+ />
|
|
|
+ </el-carousel-item>
|
|
|
+ </el-carousel>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-dialog
|
|
|
+ title="选择展示数据类型"
|
|
|
+ :visible.sync="dialogVisible"
|
|
|
+ :before-close="this.cancelDisplay"
|
|
|
+ width="50%"
|
|
|
+ >
|
|
|
+ <div class="drag-box-item">
|
|
|
+ <div class="item-title">隐藏</div>
|
|
|
+
|
|
|
+ <draggable class="list-group" :list="listh" group="people" @change="log">
|
|
|
+ <transition-group id="done" tag="div" class="item-ul">
|
|
|
+ <div
|
|
|
+ v-for="(element) in listh"
|
|
|
+ :key="element.value"
|
|
|
+ class="drag-list"
|
|
|
+ ><!--class="drag-list"-->
|
|
|
+ {{ element.key }}
|
|
|
+ </div>
|
|
|
+ </transition-group>
|
|
|
+ </draggable>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div class="drag-box-item">
|
|
|
+ <div class="item-title">展示</div>
|
|
|
+
|
|
|
+ <draggable class="list-group" :list="lists" group="people">
|
|
|
+ <transition-group id="wdtodo" tag="div" class="item-ul">
|
|
|
+ <div
|
|
|
+ v-for="(element, index) in lists"
|
|
|
+ :key="element.value"
|
|
|
+ class="drag-list"
|
|
|
+ >
|
|
|
+ {{ element.key }}
|
|
|
+ </div>
|
|
|
+ </transition-group>
|
|
|
+ </draggable>
|
|
|
+ </div>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button style="color: #1f2d3d" @click="this.cancelDisplay">取 消</el-button>
|
|
|
+ <el-button type="primary" style="color: #1f2d3d" @click="this.changeDisplay">确 定</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ <el-dialog
|
|
|
+ :visible.sync="dialogVisible1"
|
|
|
+ :before-close="this.close"
|
|
|
+ width="50%"
|
|
|
+ >
|
|
|
+ <div>
|
|
|
+ <el-button :loading="loading" size="small" @click="exportDataEventPrValue">导出</el-button>
|
|
|
+ </div>
|
|
|
+ <div class="tableContentPrValue">
|
|
|
+ <el-carousel :height="autoH" trigger="click" :autoplay="false" direction="horizontal" indicator-position=""
|
|
|
+ style="height: 700px ">
|
|
|
+ <el-carousel-item v-for="item in itemPrValue" :key="item.index" :label="item.type" style="height: 850px">
|
|
|
+ <vxe-grid
|
|
|
+ ref="xTable"
|
|
|
+ class="gridTablePrValue"
|
|
|
+ border
|
|
|
+ stripe
|
|
|
+ export-config
|
|
|
+ :auto-resize="false"
|
|
|
+ highlight-hover-row
|
|
|
+ :header-row-style="styleStr"
|
|
|
+ max-height="80%"
|
|
|
+ :cell-style="styleTableStr"
|
|
|
+ align="center"
|
|
|
+ :data="item.tableDataPrValue"
|
|
|
+ :columns="item.tableColumnPrValue"
|
|
|
+ />
|
|
|
+ </el-carousel-item>
|
|
|
+ </el-carousel>
|
|
|
+ </div>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button type="primary" style="color: #1f2d3d" @click="this.close" size="small">关 闭</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import draggable from 'vuedraggable'
|
|
|
+export default {
|
|
|
+ name: 'InverterTable',
|
|
|
+ components: { draggable },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ styleStr:{},
|
|
|
+ styleTableStr:{},
|
|
|
+ clientWidth: document.body.clientWidth,
|
|
|
+ footerData: {},
|
|
|
+ autoH: '',
|
|
|
+ startTime: new Date(new Date().toLocaleDateString()).getTime(),
|
|
|
+ endTime: new Date(new Date().toLocaleDateString()).getTime() + 60 * 60 * 24 * 1000 - 1,
|
|
|
+ total: 0,
|
|
|
+ equipmentId: '',
|
|
|
+ pageSize: 10,
|
|
|
+ currentPage: 1,
|
|
|
+ equipments: '',
|
|
|
+ dialogVisible: false,
|
|
|
+ dialogVisible1: false,
|
|
|
+ show: '',
|
|
|
+ loading: true,
|
|
|
+ electricField: [],
|
|
|
+ hidden: [],
|
|
|
+ lists: [],
|
|
|
+ listh: [],
|
|
|
+ typelist: [],
|
|
|
+ test: '',
|
|
|
+ displayConfig: {
|
|
|
+ id: '',
|
|
|
+ displayCode: 'environmentalData',
|
|
|
+ showCode: '',
|
|
|
+ hiddenCode: ''
|
|
|
+ },
|
|
|
+ itemDatas: [{
|
|
|
+ type: '日统计',
|
|
|
+ tableColumn: [],
|
|
|
+ tableData: []
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: '月统计',
|
|
|
+ tableColumn: [],
|
|
|
+ tableData: []
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: '年统计',
|
|
|
+ tableColumn: [],
|
|
|
+ tableData: []
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ itemPrValue: [{
|
|
|
+ type: '日统计',
|
|
|
+ tableColumnPrValue: [
|
|
|
+ {field: 'time', title: '时间'},
|
|
|
+ {field: 'capacity', title: '容量(MW)'},
|
|
|
+ {field: 'hourDA', title: '日照小时数(h)'},
|
|
|
+ {field: 'ultraShortTermAccuracy', title: '系统效率'},
|
|
|
+ {field: 'theoreticalPowerGeneration', title: '理论发电量(MW)'},
|
|
|
+ {field: 'actualPowerGeneration', title: '实际发电量(MW)'},
|
|
|
+ {field: 'prValue', title: 'pr值(%)'},
|
|
|
+ ],
|
|
|
+ tableDataPrValue: []
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: '月统计',
|
|
|
+ tableColumnPrValue: [
|
|
|
+ {field: 'time', title: '时间'},
|
|
|
+ {field: 'capacity', title: '容量(MW)'},
|
|
|
+ {field: 'hourDA', title: '日照小时数(h)'},
|
|
|
+ {field: 'ultraShortTermAccuracy', title: '系统效率'},
|
|
|
+ {field: 'theoreticalPowerGeneration', title: '理论发电量(MW)'},
|
|
|
+ {field: 'actualPowerGeneration', title: '实际发电量(MW)'},
|
|
|
+ {field: 'prValue', title: 'pr值(%)'},
|
|
|
+ ],
|
|
|
+ tableDataPrValue: [],
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ bShow: false,
|
|
|
+ avgWEATHERSTATIONglobalR: 0,
|
|
|
+ switchValue: false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ clientWidth(newVal, oldVal) {
|
|
|
+ this.autoHeight()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ document.body.ondrop = function(event) {
|
|
|
+ event.preventDefault()
|
|
|
+ event.stopPropagation()
|
|
|
+ }
|
|
|
+ if(sessionStorage.getItem('styleSwitch') === 'blue'){
|
|
|
+ this.styleStr = {background:'black',color:'white',border:'white'}
|
|
|
+ this.styleTableStr = {background:'black',color:'white'}
|
|
|
+ }
|
|
|
+ this.autoHeight()
|
|
|
+ this.prValue()
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ const that = this
|
|
|
+ window.onresize = () => {
|
|
|
+ return (() => {
|
|
|
+ window.clientWidth = document.body.clientWidth
|
|
|
+ that.clientWidth = window.clientWidth
|
|
|
+ })()
|
|
|
+ }
|
|
|
+ this.getElectricField()
|
|
|
+ this.getEqAttribute()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ getElectricField() {
|
|
|
+ this.$axios.get('/electricField').then((res) => {
|
|
|
+ this.electricField = res.data
|
|
|
+ this.electricField.electricFieldTypeEnum = 'E2'
|
|
|
+ this.getEquipments(this.electricField.electricFieldTypeEnum)
|
|
|
+ }).catch((error) => {
|
|
|
+ this.$message.error('查询场站信息出错' + error)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getEquipments(eType) {
|
|
|
+ var url = '/weatherStationInfos'
|
|
|
+ this.displayConfig.displayCode = 'weatherStationEnvironmental'
|
|
|
+ // 枚举类型E1光伏 E2风电
|
|
|
+ if (eType == 'E2') {
|
|
|
+ url = '/windTowerInfos'
|
|
|
+ this.displayConfig.displayCode = 'windTowerEnvironmental'
|
|
|
+ }
|
|
|
+ this.$axios.get(url).then((res) => {
|
|
|
+ this.equipments = res.data
|
|
|
+ if (res.data != null && res.data.length > 0) {
|
|
|
+ this.equipmentId = this.equipments[0].id
|
|
|
+ this.getEqAttributeById()
|
|
|
+ this.get()
|
|
|
+ } else {
|
|
|
+ this.$message.warning('设备信息未维护')
|
|
|
+ }
|
|
|
+ }).catch((error) => {
|
|
|
+ this.$message.error('查询设备信息出错' + error)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ get() {
|
|
|
+ this.loading = true
|
|
|
+ if (this.endTime < this.startTime) {
|
|
|
+ this.$message.error('开始时间不能小于结束时间')
|
|
|
+ this.loading = false
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.$axios.get('environmentalDataOne/findEnvironmentalData/' + this.startTime + '/' + this.endTime + '/' + this.equipmentId).then(res => {
|
|
|
+ if (res.data.tableColumn.length > 0) {
|
|
|
+ const tableColumn = res.data.tableColumn
|
|
|
+ this.footerData = res.data.footerData
|
|
|
+ this.itemDatas[0].tableColumn = [{ field: 'times', title: '时间', width: 95 }]
|
|
|
+ this.itemDatas[1].tableColumn = [{ field: 'times', title: '时间', width: 95 }]
|
|
|
+ this.itemDatas[2].tableColumn = [{ field: 'times', title: '时间', width: 95 }]
|
|
|
+ for (let i = 0; i < tableColumn.length; i++) {
|
|
|
+ if(tableColumn[i].title == '总辐射日累计'||tableColumn[i].title == '直辐射日累计'||tableColumn[i].title == '散射辐射日累计'||tableColumn[i].title == '斜面辐射日累计'||tableColumn[i].title == '日照小时数'){
|
|
|
+ const column = {
|
|
|
+ title: tableColumn[i].title+"("+ tableColumn[i].unit+")",
|
|
|
+ children: [
|
|
|
+ { field: tableColumn[i].sum, title: '统计值', width: '5%' },
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ const column1 = {
|
|
|
+ title: tableColumn[i].title+"("+ tableColumn[i].unit+")",
|
|
|
+ children: [
|
|
|
+ { field: tableColumn[i].sum, title: '统计值', width: '5%' },
|
|
|
+ { field: tableColumn[i].max, title: '极大值', width: '5%' },
|
|
|
+ { field: tableColumn[i].maxTime, title: '极大值时刻', width: 180, formatter: this.dateFormat },
|
|
|
+ { field: tableColumn[i].min, title: '最小值', width: '5%' },
|
|
|
+ { field: tableColumn[i].minTime, title: '最小值时刻', width: 180, formatter: this.dateFormat },
|
|
|
+ { field: tableColumn[i].avg, title: '平均值', width: '5%' },
|
|
|
+ { field: tableColumn[i].maxAvgValue, title: '最大值', width: '5%' },
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ this.itemDatas[0].tableColumn.push(column)
|
|
|
+ this.itemDatas[1].tableColumn.push(column1)
|
|
|
+ this.itemDatas[2].tableColumn.push(column1)
|
|
|
+ }else if(tableColumn[i].title == '日受阻电量'||tableColumn[i].title == '日站内受阻电量'||tableColumn[i].title == '日站外受阻电量') {
|
|
|
+ const column = {
|
|
|
+ title: tableColumn[i].title+"("+ tableColumn[i].unit+")",
|
|
|
+ children: [
|
|
|
+ { field: tableColumn[i].sum, title: '统计值', width: '5%' },
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ const column1 = {
|
|
|
+ title: tableColumn[i].title+"("+ tableColumn[i].unit+")",
|
|
|
+ children: [
|
|
|
+ { field: tableColumn[i].sum, title: '统计值', width: '5%' },
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ this.itemDatas[0].tableColumn.push(column)
|
|
|
+ this.itemDatas[1].tableColumn.push(column1)
|
|
|
+ this.itemDatas[2].tableColumn.push(column1)
|
|
|
+ }else{
|
|
|
+ if(tableColumn[i].title == '总辐射'){
|
|
|
+ this.bShow = true
|
|
|
+ }
|
|
|
+ const column = {
|
|
|
+ title: tableColumn[i].title+"("+ tableColumn[i].unit+")",
|
|
|
+ children: [
|
|
|
+ { field: tableColumn[i].max, title: '极大值', width: '5%' },
|
|
|
+ { field: tableColumn[i].maxTime, title: '极大值时刻', width: 180, formatter: this.dateFormat },
|
|
|
+ { field: tableColumn[i].min, title: '最小值', width: '5%' },
|
|
|
+ { field: tableColumn[i].minTime, title: '最小值时刻', width: 180, formatter: this.dateFormat },
|
|
|
+ { field: tableColumn[i].avg, title: '平均值', width: '5%' },
|
|
|
+ { field: tableColumn[i].maxAvgValue, title: '最大值', width: '5%' },
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ this.itemDatas[0].tableColumn.push(column)
|
|
|
+ this.itemDatas[1].tableColumn.push(column)
|
|
|
+ this.itemDatas[2].tableColumn.push(column)
|
|
|
+ }
|
|
|
+
|
|
|
+ this.itemDatas[0].tableData = res.data.dayList
|
|
|
+ this.itemDatas[1].tableData = res.data.monthList
|
|
|
+ this.itemDatas[2].tableData = res.data.yearList
|
|
|
+
|
|
|
+ // this.itemDatas[1].tableData = res.data.monthList
|
|
|
+ // this.itemDatas[2].tableData = res.data.yearList
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.itemDatas[0].tableColumn = []
|
|
|
+ this.itemDatas[1].tableColumn = []
|
|
|
+ this.itemDatas[2].tableColumn = []
|
|
|
+ }
|
|
|
+ if(this.switchValue){
|
|
|
+ this.showavg()
|
|
|
+ }
|
|
|
+ this.loading = false
|
|
|
+ // console.log(this.itemDatas)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ prValue(click) {
|
|
|
+ this.$axios.get('prValue/findPrValueData/' + this.startTime + '/' + this.endTime).then(res => {
|
|
|
+ if (res.data.displayPrValue == 1) {
|
|
|
+ this.show = true
|
|
|
+ this.loading = true
|
|
|
+ this.dialogVisible1 = click ? true : false
|
|
|
+ if (this.endTime < this.startTime) {
|
|
|
+ this.$message.error('开始时间不能小于结束时间')
|
|
|
+ this.loading = false
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.itemPrValue[0].tableDataPrValue = res.data.dayList
|
|
|
+ this.itemPrValue[1].tableDataPrValue = res.data.monthList
|
|
|
+ } else {
|
|
|
+ this.show = false
|
|
|
+ this.loading = false
|
|
|
+ this.dialogVisible1 = false
|
|
|
+ }
|
|
|
+ this.loading = false
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getEqAttribute() {
|
|
|
+ this.$axios.get('environmentalDataOne/findEnvironmentalData').then((res) => {
|
|
|
+ this.hidden = res.data
|
|
|
+ }).catch((error) => {
|
|
|
+ this.$message.error('查询数据类型出错' + error)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ initDisplay() {
|
|
|
+ this.listh = []
|
|
|
+ this.lists = []
|
|
|
+ var typelist = []
|
|
|
+ this.lists = this.typelist
|
|
|
+ for (var k = 0; k < this.lists.length; k++) {
|
|
|
+ typelist.push(this.lists[k].value)
|
|
|
+ }
|
|
|
+ // for (var i = 0; i < this.lists.length; i++) {
|
|
|
+ // for (var j = 0; j < this.hidden.length; j++) {
|
|
|
+ // if (this.lists[i].value !== this.hidden[j].value) {
|
|
|
+ // if (typelist.indexOf(this.hidden[j].value) == -1) {
|
|
|
+ // typelist.push(this.hidden[j].value)
|
|
|
+ // this.lists.push(this.hidden[j])
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+
|
|
|
+ this.$nextTick(function() {
|
|
|
+ this.changeDisplay()
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getDisplay() {
|
|
|
+ this.$axios.get('/displayConfig/' + this.displayConfig.displayCode).then((res) => {
|
|
|
+ if (res.data == null || res.data.code == 0) {
|
|
|
+ this.initDisplay()
|
|
|
+ } else {
|
|
|
+ this.lists = []
|
|
|
+ this.listh = []
|
|
|
+ this.displayConfig = res.data
|
|
|
+ var showlist = this.displayConfig.showCode.split(',')
|
|
|
+ var hiddenlist = this.displayConfig.hiddenCode.split(',')
|
|
|
+ for (var i = 0; i < showlist.length; i++) {
|
|
|
+ for (var j = 0; j < this.hidden.length; j++) {
|
|
|
+ if (this.hidden[j].value === showlist[i]) {
|
|
|
+ this.lists.push(this.hidden[j])
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ for (var i = 0; i < hiddenlist.length; i++) {
|
|
|
+ for (var j = 0; j < this.hidden.length; j++) {
|
|
|
+ if (this.hidden[j].value === hiddenlist[i]) {
|
|
|
+ this.listh.push(this.hidden[j])
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ changeDisplay() {
|
|
|
+ this.displayConfig.showCode = ''
|
|
|
+ this.displayConfig.hiddenCode = ''
|
|
|
+ for (var i = 0; i < this.listh.length; i++) {
|
|
|
+ this.displayConfig.hiddenCode += this.listh[i].value + ','
|
|
|
+ }
|
|
|
+ for (var j = 0; j < this.lists.length; j++) {
|
|
|
+ this.displayConfig.showCode += this.lists[j].value + ','
|
|
|
+ }
|
|
|
+ this.$axios.post('displayConfig/', this.displayConfig).then((res) => {
|
|
|
+ this.displayConfig = res.data
|
|
|
+ this.$message.success('展示设置成功')
|
|
|
+ this.get()
|
|
|
+ this.dialogVisible = false
|
|
|
+ }).catch((error) => {
|
|
|
+ this.$message.error('展示设置出错' + error)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getEqAttributeById() {
|
|
|
+ this.$axios.get('environmentalDataOne/findEnvironmentalData/' + this.equipmentId).then((res) => {
|
|
|
+ var typelist = []
|
|
|
+ for (var i = 0; i < res.data.length; i++) {
|
|
|
+ typelist.push({
|
|
|
+ key: res.data[i].explanation,
|
|
|
+ value: res.data[i].fieldName
|
|
|
+ })
|
|
|
+ }
|
|
|
+ this.typelist = typelist
|
|
|
+ this.getDisplay()
|
|
|
+ })
|
|
|
+ },
|
|
|
+ exportDataEvent() {
|
|
|
+ this.loading = true
|
|
|
+ const params = new URLSearchParams()
|
|
|
+ params.append('startTime', this.startTime)
|
|
|
+ params.append('endTime', this.endTime)
|
|
|
+ params.append('eqId', this.equipmentId)
|
|
|
+ this.$axios.post('/environmentalDataOne/export', params, {
|
|
|
+ responseType: 'blob'// 用于解决中文乱码
|
|
|
+ }).then((response) => {
|
|
|
+ this.loading = false
|
|
|
+ })
|
|
|
+
|
|
|
+ // this.$refs.xTable.openExport()
|
|
|
+
|
|
|
+ },
|
|
|
+ exportDataEventPrValue() {
|
|
|
+ this.loading = true
|
|
|
+ const params = new URLSearchParams()
|
|
|
+ params.append('startTime', this.startTime)
|
|
|
+ params.append('endTime', this.endTime)
|
|
|
+ this.$axios.post('prValue/export', params, {
|
|
|
+ responseType: 'blob'// 用于解决中文乱码
|
|
|
+ }).then((response) => {
|
|
|
+ this.loading = false
|
|
|
+ })
|
|
|
+
|
|
|
+ // this.$refs.xTable.openExport()
|
|
|
+
|
|
|
+ },
|
|
|
+ showavg() {
|
|
|
+ if(this.switchValue){
|
|
|
+ var list = this.itemDatas[0].tableData
|
|
|
+ var avg = list[list.length-1].avgWEATHERSTATIONglobalR
|
|
|
+ this.avgWEATHERSTATIONglobalR = avg
|
|
|
+ this.$axios.get('/dashboard/getServerTime').then(res => {
|
|
|
+ var today = new Date(res.data)
|
|
|
+ var sDate = new Date(today.toLocaleDateString()).getTime()
|
|
|
+
|
|
|
+ var time = today.getTime() - sDate
|
|
|
+ var sk = time/60000
|
|
|
+ var result = sk*avg/1440
|
|
|
+
|
|
|
+ this.itemDatas[0].tableData[list.length-1].avgWEATHERSTATIONglobalR = Math.round(result*Math.pow(10,2))/Math.pow(10,2)
|
|
|
+
|
|
|
+ })
|
|
|
+ }else {
|
|
|
+ this.itemDatas[0].tableData[this.itemDatas[0].tableData.length-1].avgWEATHERSTATIONglobalR = this.avgWEATHERSTATIONglobalR
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ },
|
|
|
+ dataShow() {
|
|
|
+ this.dialogVisible = true
|
|
|
+ this.getEqAttributeById()
|
|
|
+ },
|
|
|
+ cancelDisplay() {
|
|
|
+ this.lists = []
|
|
|
+ this.listh = []
|
|
|
+ this.dialogVisible = false
|
|
|
+ },
|
|
|
+ close() {
|
|
|
+ this.dialogVisible1 = false
|
|
|
+ },
|
|
|
+ log: function(evt) {
|
|
|
+ /* console.log(evt);*/
|
|
|
+ /* console.log(this.lists)
|
|
|
+ console.log(this.listh)*/
|
|
|
+
|
|
|
+ /* this.changeDisplay()*/
|
|
|
+ },
|
|
|
+ footerMethod({ columns, data }) {
|
|
|
+ const sums = []
|
|
|
+ var footerData = this.footerData
|
|
|
+ columns.forEach((column, columnIndex) => {
|
|
|
+ if (columnIndex === 0) {
|
|
|
+ sums.push('统计列极值')
|
|
|
+ } else {
|
|
|
+ sums.push(footerData[column.property])
|
|
|
+ }
|
|
|
+ })
|
|
|
+ // 返回一个二维数组的表尾合计
|
|
|
+ return [sums]
|
|
|
+ },
|
|
|
+ dateFormat({ cellValue, row, column }) {
|
|
|
+ if (cellValue == undefined||cellValue == "") {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ // return this.$XEUtils.toDateString(cellValue, 'yyyy-MM-dd HH:mm:ss')
|
|
|
+ const date = new Date(cellValue) // 时间戳为10位需*1000,时间戳为13位的话不需乘1000
|
|
|
+ const Y = date.getFullYear() + '-'
|
|
|
+ const M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-'
|
|
|
+ const D = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate()) + ' '
|
|
|
+ const H = (date.getHours() < 10 ? '0' + (date.getHours()) : date.getHours()) + ':'
|
|
|
+ const m = (date.getMinutes() < 10 ? '0' + (date.getMinutes()) : date.getMinutes()) + ':'
|
|
|
+ const s = (date.getSeconds() < 10 ? '0' + (date.getSeconds()) : date.getSeconds())
|
|
|
+ return Y + M + D + H + m + s
|
|
|
+ },
|
|
|
+ handlePageChangeNo({ currentPage, pageSize }) {
|
|
|
+ this.currentPageNo = currentPage
|
|
|
+ this.pageSizeNo = pageSize
|
|
|
+ this.querywtDataNo()
|
|
|
+ this.startTime = this.queryStartTime
|
|
|
+ this.endTime = this.queryEndTime
|
|
|
+ },
|
|
|
+ handlePageChangeAll({ currentPage, pageSize }) {
|
|
|
+ this.currentPageAll = currentPage
|
|
|
+ this.pageSizeAll = pageSize
|
|
|
+ this.querywtDataAll()
|
|
|
+ this.startTime = this.queryStartTime
|
|
|
+ this.endTime = this.queryEndTime
|
|
|
+ },
|
|
|
+ autoHeight() {
|
|
|
+ const _w =
|
|
|
+ document.documentElement.clientWidth || document.body.clientWidth
|
|
|
+
|
|
|
+ this.autoH = (_w * 200) / 450 - 100 + 'px'
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+/*.chart-container{*/
|
|
|
+/*position:relative;*/
|
|
|
+/*width:100%;*/
|
|
|
+/*height:calc(100vh - 50px);*/
|
|
|
+/*}*/
|
|
|
+
|
|
|
+/*.filter{*/
|
|
|
+/*position:relative;*/
|
|
|
+/*display:flex;*/
|
|
|
+/*padding:20px 0 10px 15px;*/
|
|
|
+/*font-size:12px;*/
|
|
|
+/*line-height:11px;*/
|
|
|
+/*color:white;*/
|
|
|
+/*width: 100%;*/
|
|
|
+/*background-color: transparent;*/
|
|
|
+/*height: 10%;*/
|
|
|
+/*}*/
|
|
|
+
|
|
|
+/*input{*/
|
|
|
+/*background:transparent;*/
|
|
|
+/*border:none;*/
|
|
|
+/*color:white;*/
|
|
|
+/*}*/
|
|
|
+
|
|
|
+/*.timeText{*/
|
|
|
+/*opacity:0.69;*/
|
|
|
+/*padding-right:7px;*/
|
|
|
+/*font-size:14px;*/
|
|
|
+/*}*/
|
|
|
+
|
|
|
+/*.startTime{*/
|
|
|
+/*display:inline-block;*/
|
|
|
+/*}*/
|
|
|
+
|
|
|
+/*.endTime{*/
|
|
|
+/*display:inline-block;*/
|
|
|
+/*padding-left:42px;*/
|
|
|
+/*}*/
|
|
|
+
|
|
|
+/*.timeQuery{*/
|
|
|
+/*margin-left: 2%;*/
|
|
|
+/*background:transparent;*/
|
|
|
+/*}*/
|
|
|
+
|
|
|
+/*.el-button{*/
|
|
|
+/*background:transparent;*/
|
|
|
+/*color:white;*/
|
|
|
+/*}*/
|
|
|
+
|
|
|
+/*.filter >>> input{*/
|
|
|
+/*background:transparent;*/
|
|
|
+/*border:none;*/
|
|
|
+/*color:white;*/
|
|
|
+/*}*/
|
|
|
+
|
|
|
+/*.rtPageturning{*/
|
|
|
+/*width: 100%;*/
|
|
|
+/*height: 10%;*/
|
|
|
+/*display: flex;*/
|
|
|
+/*justify-content:space-between*/
|
|
|
+/*}*/
|
|
|
+/*.rtPageturning >>> button,*/
|
|
|
+/*.rtPageturning >>> span,*/
|
|
|
+/*.rtPageturning >>> input,*/
|
|
|
+/*.rtPageturning >>> .vxe-pager--btn-wrapper li{*/
|
|
|
+/*background-color: transparent !important;*/
|
|
|
+/*color: #ffffff !important;*/
|
|
|
+/*border: 1px solid #ffffff;*/
|
|
|
+/*}*/
|
|
|
+/*.rtPageturning >>> span{*/
|
|
|
+/*border:none*/
|
|
|
+/*}*/
|
|
|
+/*.rtPageturning >>> .vxe-pager--wrapper .vxe-pager--btn-wrapper li:not(.disabled).is--active {*/
|
|
|
+/*background-color: #9f9fa0 !important;*/
|
|
|
+/*}*/
|
|
|
+
|
|
|
+/*.tableContent{*/
|
|
|
+/*width: 100%;*/
|
|
|
+/*height:calc(80vh - 50px);*/
|
|
|
+/*}*/
|
|
|
+/*.tableContent >>> td{*/
|
|
|
+/*border:1px solid #ffffff;*/
|
|
|
+/*}*/
|
|
|
+/*.content{*/
|
|
|
+/*width: 100%;*/
|
|
|
+/*background-color: transparent;*/
|
|
|
+/*height: 90%;*/
|
|
|
+/*padding-left: 5px;*/
|
|
|
+/*padding-right: 5px;*/
|
|
|
+/*}*/
|
|
|
+/*.content >>> .el-tabs__item{*/
|
|
|
+/*color: white;*/
|
|
|
+/*}*/
|
|
|
+/*.content >>> .el-tabs__item.is-active {*/
|
|
|
+/*color: #409EFF;*/
|
|
|
+/*}*/
|
|
|
+
|
|
|
+/*.content >>> .vxe-button.type--button.is--circle{*/
|
|
|
+/*padding: 0 .5em;*/
|
|
|
+/*min-width: 34px;*/
|
|
|
+/*border-radius: 10%;*/
|
|
|
+/*border: none;*/
|
|
|
+/*background: transparent;*/
|
|
|
+/*color: white;*/
|
|
|
+/*}*/
|
|
|
+/*.el-carousel__item h3 {*/
|
|
|
+/*color: #475669;*/
|
|
|
+/*font-size: 14px;*/
|
|
|
+/*opacity: 0.75;*/
|
|
|
+/*line-height: 150px;*/
|
|
|
+/*margin: 0;*/
|
|
|
+/*}*/
|
|
|
+
|
|
|
+/*.el-carousel__item:nth-child(2n) {*/
|
|
|
+/*background-color: black;*/
|
|
|
+/*}*/
|
|
|
+
|
|
|
+/*.el-carousel__item:nth-child(2n+1) {*/
|
|
|
+/*background-color: black;*/
|
|
|
+/*}*/
|
|
|
+.item-title {
|
|
|
+ padding: 8px 8px 8px 12px;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 1.5;
|
|
|
+ color: #24292e;
|
|
|
+ font-weight: 600;
|
|
|
+}
|
|
|
+
|
|
|
+.drag-box-item {
|
|
|
+ /*margin:10px;*/
|
|
|
+ flex: 1;
|
|
|
+ height: 250px;
|
|
|
+ max-width: 100%;
|
|
|
+ min-width: 100%;
|
|
|
+ background-color: #eff1f5;
|
|
|
+ margin-right: 16px;
|
|
|
+ border-radius: 6px;
|
|
|
+ border: 1px #e1e4e8 solid;
|
|
|
+}
|
|
|
+.item-ul {
|
|
|
+ padding: 0 8px 8px;
|
|
|
+ height: 200px;
|
|
|
+ overflow-y: scroll;
|
|
|
+}
|
|
|
+
|
|
|
+.item-ul::-webkit-scrollbar {
|
|
|
+ width: 0;
|
|
|
+}
|
|
|
+.drag-list {
|
|
|
+ width: 20%;
|
|
|
+ float: left;
|
|
|
+ border: 1px #e1e4e8 solid;
|
|
|
+ padding: 10px;
|
|
|
+ text-align: center;
|
|
|
+ list-style: none;
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 6px;
|
|
|
+ cursor: pointer;
|
|
|
+ -webkit-transition: border .3s ease-in;
|
|
|
+ transition: border .3s ease-in;
|
|
|
+}
|
|
|
+
|
|
|
+.drag-list:hover {
|
|
|
+ border: 1px solid #20a0ff;
|
|
|
+}
|
|
|
+.no-allow{
|
|
|
+ width: 20%;
|
|
|
+ float: left;
|
|
|
+ border: 1px #e1e4e8 solid;
|
|
|
+ padding: 10px;
|
|
|
+ list-style: none;
|
|
|
+ text-align: center;
|
|
|
+ background-color: #d0dae5;
|
|
|
+ border-radius: 6px;
|
|
|
+ cursor:not-allowed;
|
|
|
+ -webkit-transition: border .3s ease-in;
|
|
|
+ transition: border .3s ease-in;
|
|
|
+}
|
|
|
+.grid >> tr{
|
|
|
+ border: 1px solid;
|
|
|
+}
|
|
|
+.el-carousel__indicators .el-carousel__indicators--horizontal .el-carousel__indicators--labels{
|
|
|
+ text-align: right;
|
|
|
+}
|
|
|
+</style>
|
|
|
+<style>
|
|
|
+.gridTable{
|
|
|
+ margin-top: 3%;
|
|
|
+ z-index: 1000;
|
|
|
+}
|
|
|
+.gridTablePrValue {
|
|
|
+ margin-top: 3%;
|
|
|
+ z-index: 500;
|
|
|
+ height: 300px;
|
|
|
+}
|
|
|
+.tableContent .el-carousel__indicators--labels{
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ height: 3%;
|
|
|
+ -webkit-transform: none;
|
|
|
+ transform: none;
|
|
|
+ text-align: center;
|
|
|
+ position: absolute;
|
|
|
+ top: 0px;
|
|
|
+}
|
|
|
+.tableContentPrValue .el-carousel__indicators--labels {
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ height: 1%;
|
|
|
+ -webkit-transform: none;
|
|
|
+ transform: none;
|
|
|
+ text-align: center;
|
|
|
+ position: absolute;
|
|
|
+ top: 0px;
|
|
|
+}
|
|
|
+</style>
|
|
|
+
|