Commit 4808d319 authored by xiexingan's avatar xiexingan

Merge branch 'dev' of gitlab.suntrayoa.com:geqilin/energyai_vue into dev

parents d0a13eb2 137760ce
......@@ -2,24 +2,6 @@
<div class="energy-page">
<cardList cardListTitle="能耗数据分析">
<div slot="right">
<!-- <span
:class="activeIndex === index ? 'active-hight-linght' : ''"
class="date-text"
@click="activehandle(item, index)"
v-for="(item, index) in dateList"
:key="item.value"
>{{ item.label }}</span
> -->
<!-- <el-date-picker
size="mini"
type="daterange"
range-separator="~"
start-placeholder="开始日期"
end-placeholder="结束日期"
> -->
<!-- </el-date-picker> -->
<!-- <i style=" padding-left:20px;padding-right: 20px;color:#21acfc" class="el-icon-s-unfold"></i> -->
<!-- <i class="el-icon-printer" style="color:#21acfc"></i> -->
<el-button size="mini" type="primary" @click="toPowerPage"
>图形/列表</el-button
>
......@@ -27,8 +9,17 @@
<div slot="content" style="height: calc(100% - 70px)">
<div>
<el-tabs class="en-tabs" v-model="activetap">
<el-form :inline="true" size="mini" style="padding-top: 15px">
<!-- <el-form-item label="时间范围:">
<el-tab-pane
:label="item.label"
:name="item.value"
v-for="(item, index) in energyTabList"
:key="index"
></el-tab-pane>
</el-tabs>
</div>
<div>
<el-form :inline="true" size="mini" style="padding-top: 15px">
<!-- <el-form-item label="时间范围:">
<el-date-picker
v-model="startTime"
align="right"
......@@ -51,32 +42,29 @@
<el-button type="primary" size="mini" icon="el-icon-search"
>查询</el-button
> -->
<el-form-item label="时间范围:">
<el-button
size="mini"
type="primary"
@click="handleDate(index)"
v-for="(item, index) in typeList"
:key="index"
:class="[index == currentActive ? 'isActive' : '']"
>
{{ item.name }}
</el-button>
</el-form-item>
</el-form>
<el-tab-pane
:label="item.label"
:name="item.value"
v-for="(item, index) in energyTabList"
:key="index"
></el-tab-pane>
</el-tabs>
<el-form-item label="时间范围:">
<el-button
size="mini"
type="primary"
@click="handleDate(item.id)"
v-for="(item, index) in typeList"
:key="index"
:class="[item.id == currentActive ? 'isActive' : '']"
>
{{ item.name }}
</el-button>
</el-form-item>
</el-form>
</div>
<div style="height: calc(100% - 70px)">
<!-- <chart yAxisName='单位:kwh'></chart> -->
<chart id="111" :data="data" title="能耗数据" color="#21ACFC" yAxisName='单位:kwh'></chart>
<chart
id="111"
:data="data"
title="能耗数据"
color="#21ACFC"
yAxisName="单位:kwh"
></chart>
</div>
</div>
</cardList>
......@@ -97,68 +85,79 @@ export default {
},
data() {
return {
startTime: '',
endTime: '',
activeIndex: 1,
activetap: '01',
activetap: '1',
typeList: [
{ name: '当日' },
{ name: '本周' },
{ name: '当月' },
{ name: '今年' }
],
currentActive: '0',
data: [
['2019-8-14 8:00:00', 70],
['2019-8-14 8:00:01', 60],
['2019-8-14 8:00:02', 30],
['2019-8-14 8:00:03', 79],
['2019-8-14 8:00:06', 10],
['2019-8-14 8:00:20', 31]
{ name: '当日', id: 1 },
{ name: '本周', id: 2 },
{ name: '当月', id: 3 },
{ name: '今年', id: 4 }
],
currentActive: 1,
data: [],
energyTabList: [
{
value: '01',
value: '1',
label: '全部'
},
{
value: '02',
value: 'b6af764f2a6e454490a6b1b3c9057e57',
label: '排风机'
},
{
value: '03',
value: 'ece0b8b2db27411886254e81134988a3',
label: '机房空调(220V)'
},
{
value: '04',
value: 'b47661ca1d454f9792ba5369f3cb2bc5',
label: '机房空调(380V)'
},
{
value: '05',
value: 'c788ce98c1f248f590434394da485ce4',
label: '防火卷帘门'
},
{
value: '06',
value: 'b45827c068254695864ee3c1d42573cb',
label: '风冷热泵机组'
},
{
value: '07',
value: '303310efddb34a2e9bf269bdff8a7dc5',
label: '室内机风柜'
},
{
value: '08',
value: '173466a2cf9a42a6a17b2bdfbeae36d5',
label: '多联室外机'
}
]
}
},
watch: {
activetap() {
this.getDataList()
}
},
mounted() {
this.getDataList()
},
methods: {
activehandle(item, index) {
this.activeIndex = index
getDataList() {
this.$http({
url: this.$http.adornUrl('/analysis/getEnergyFx'),
method: 'get',
params: this.$http.adornParams({
resourceType: this.activetap, //资源点类型
type: this.currentActive
})
}).then((data) => {
if (data && data.code === 0) {
// console.log('数据', data)
this.data = data.list
}
})
},
// 当日 ,本周
// 当日 ,本周
handleDate(i) {
this.currentActive = i
this.getDataList()
},
toPowerPage() {
this.$router.push({
......
......@@ -48,15 +48,20 @@ export default {
]
}
},
mounted() {
this.getDataList()
},
methods: {
tabClick(tab, event) {
console.log(tab, event)
// console.log(tab, event)
this.getDataList()
},
getDataList() {
this.$http({
url: this.$http.adornUrl('/analysis/getSnqxzInfoTj'),
method: 'get',
params: this.$http.adornParams({
resourceId: '',
region: Number(this.activeName), //区域类型
type: this.currentActive
})
......@@ -73,6 +78,7 @@ export default {
// 当日 ,本周
handleDate(i) {
this.currentActive = i
this.getDataList()
}
}
}
......
export const tableColumsOne = [
{
align: 'center',
prop: 'A',
prop: 'name',
label: '设备名称',
width: 132
},
{
align: 'center',
prop: 'B',
prop: 'deployLocation',
label: '设备位置'
// width: 112,
},
{
align: 'center',
prop: 'C',
prop: 'status',
label: '设备状态',
width: 182
},
......@@ -31,7 +31,7 @@
},
{
align: 'center',
prop: 'F',
prop: 'code',
label: '设备编号',
width: 132
}
......@@ -46,7 +46,7 @@
},
{
align: 'center',
prop: 'stationName',
prop: 'deployLocation',
label: '设备位置'
// width: 112,
},
......@@ -58,7 +58,7 @@
},
{
align: 'center',
prop: 'D',
prop: 'status',
label: '设备状态',
width: 182
},
......@@ -76,166 +76,8 @@
},
{
align: 'center',
prop: 'G',
prop: 'code',
label: '设备编号',
width: 132
}
]
export const tableDataOne = [
{
A: '风冷热泵机组',
B: '左侧办公房屋',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '风冷热泵机组',
B: '左侧办公房屋',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '风冷热泵机组',
B: '左侧办公房屋',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '风冷热泵机组',
B: '左侧办公房屋',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '风冷热泵机组',
B: '左侧办公房屋',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
}
]
export const tableDataTwo = [
{
A: '室内机风柜',
B: '屋面',
C: '110',
D: '开启',
E: '10',
F: '100',
G: 'JK-1'
},
{
A: '室内机风柜',
B: '屋面',
C: '110',
D: '开启',
E: '10',
F: '100',
G: 'JK-1'
},
{
A: '室内机风柜',
B: '屋面',
C: '110',
D: '开启',
E: '10',
F: '100',
G: 'JK-1'
},
{
A: '室内机风柜',
B: '屋面',
C: '110',
D: '开启',
E: '10',
F: '100',
G: 'JK-1'
},
{
A: '室内机风柜',
B: '屋面',
C: '110',
D: '开启',
E: '10',
F: '100',
G: 'JK-1'
},
{
A: '室内机风柜',
B: '屋面',
C: '110',
D: '开启',
E: '10',
F: '100',
G: 'JK-1'
}
]
export const tableDataThree = [
{
A: '水泵',
B: '通信机械室',
C: '110',
D: '开启',
E: '10',
F: '100',
G: 'JK-1'
},
{
A: '水泵',
B: '通信机械室',
C: '110',
D: '开启',
E: '10',
F: '100',
G: 'JK-1'
},
{
A: '水泵',
B: '通信机械室',
C: '110',
D: '开启',
E: '10',
F: '100',
G: 'JK-1'
},
{
A: '水泵',
B: '通信机械室',
C: '110',
D: '开启',
E: '10',
F: '100',
G: 'JK-1'
},
{
A: '水泵',
B: '通信机械室',
C: '110',
D: '开启',
E: '10',
F: '100',
G: 'JK-1'
},
{
A: ' 水泵',
B: '通信机械室',
C: '110',
D: '开启',
E: '10',
F: '100',
G: 'JK-1'
}
]
......@@ -259,7 +259,6 @@ export default {
if (data && data.code === 0) {
console.log('数据', data)
this.tableData = data.page.rows
// this.tableColums = crecords
this.totalSize = data.page.total
} else {
......
export const tableColumsOne = [
{
align: 'center',
prop: 'A',
prop: 'name',
label: '设备名称',
width: 132
},
{
align: 'center',
prop: 'B',
prop: 'deployLocation',
label: '设备位置'
// width: 150
},
{
align: 'center',
prop: 'C',
prop: 'status',
label: '设备状态',
width: 182
},
......@@ -31,246 +31,8 @@
},
{
align: 'center',
prop: 'F',
prop: 'code',
label: '设备编号',
width: 132
}
]
export const tableDataOne = [
{
A: '排风机',
B: '左侧办公房屋',
C: '开启',
D: '10',
E: '100',
F: 'DLW-A1'
},
{
A: '排风机',
B: '左侧办公房屋',
C: '开启',
D: '10',
E: '100',
F: 'DLW-A1'
},
{
A: '排风机',
B: '左侧办公房屋',
C: '开启',
D: '10',
E: '100',
F: 'DLW-A1'
},
{
A: '排风机',
B: '左侧办公房屋',
C: '开启',
D: '10',
E: '100',
F: 'DLW-A1'
}
]
export const tableDataTwo = [
{
A: '机房空调(220V)',
B: '左侧旅客服务房屋',
C: '开启',
D: '10',
E: '100',
F: 'DLW-A1'
},
{
A: '机房空调(220V)',
B: '左侧旅客服务房屋',
C: '开启',
D: '10',
E: '100',
F: 'DLW-A1'
},
{
A: '机房空调(220V)',
B: '左侧旅客服务房屋',
C: '开启',
D: '10',
E: '100',
F: 'DLW-A1'
},
{
A: '机房空调(220V)',
B: '左侧旅客服务房屋',
C: '开启',
D: '10',
E: '100',
F: 'DLW-A1'
}
]
export const tableDataThree = [
{
A: '机房空调(380V)',
B: '通信机械室',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '机房空调(380V)',
B: '通信机械室',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '机房空调(380V)',
B: '通信机械室',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '机房空调(380V)',
B: '通信机械室',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '机房空调(380V)',
B: '通信机械室',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
}
]
export const tableDataFour = [
{
A: '防火卷帘门',
B: '售票厅',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '防火卷帘门',
B: '售票厅',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
}
]
export const tableDataFive = [
{
A: '多联室内机',
B: '左侧办公房屋',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '多联室内机',
B: '左侧办公房屋',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '多联室内机',
B: '左侧办公房屋',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '多联室内机',
B: '左侧办公房屋',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
}
]
export const tableDataSix = [
{
A: '多联室外机',
B: '屋面',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '多联室外机',
B: '屋面',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '多联室外机',
B: '屋面',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '多联室外机',
B: '屋面',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
}
]
export const tableDataSeven = [
{
A: '换气扇',
B: 'VIP候车室',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '换气扇',
B: 'VIP候车室',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '换气扇',
B: 'VIP候车室',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '换气扇',
B: 'VIP候车室',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
}
]
......@@ -59,16 +59,7 @@
import cardList from '../../components/cardList'
import enTabs from '../../components/enTabs'
import enTable from '../../components/enTable'
import {
tableColumsOne,
tableDataOne,
tableDataTwo,
tableDataThree,
tableDataFour,
tableDataFive,
tableDataSix,
tableDataSeven
} from './config'
import { tableColumsOne } from './config'
export default {
name: 'officeAreaControl',
......@@ -123,32 +114,35 @@ export default {
this.activeTab = val
this.getDataList()
switch (val) {
case '01':
case 'b6af764f2a6e454490a6b1b3c9057e57':
this.tableColums = tableColumsOne
break
case '02':
case 'ece0b8b2db27411886254e81134988a3':
this.tableColums = tableColumsOne
break
case '03':
case 'b47661ca1d454f9792ba5369f3cb2bc5':
this.tableColums = tableColumsOne
break
case '04':
case 'c788ce98c1f248f590434394da485ce4':
this.tableColums = tableColumsOne
break
case '05':
case '173466a2cf9a42a6a17b2bdfbeae36d5':
this.tableColums = tableColumsOne
break
case '06':
case '8f5530fee2484e8eb107c0ca672132b2':
this.tableColums = tableColumsOne
break
case '07':
case '49f5921a6d7f43cfa222c09f0223ae04':
this.tableColums = tableColumsOne
break
}
}
},
mounted() {
this.getDataList()
},
methods: {
// 获取数据列表
// 获取数据列表
getDataList(page, size) {
this.$http({
url: this.$http.adornUrl('/liResource/list'),
......
......@@ -2,10 +2,10 @@
el-dialog(:title="type==1?'历史数据':'统计图表'", :close-on-click-modal='false', :visible.sync='visible' width='80%' :append-to-body='true')
el-form(:model='dataForm', size='mini' :inline='true' :rules='dataRule' ,ref='dataForm', @keyup.enter.native='dataFormSubmit()', label-width='120px')
el-form-item(label='设备名称', prop='name')
el-input(v-model='dataForm.name', placeholder='设备名称' )
el-form-item(label='设备编号', prop='name')
el-input(v-model='dataForm.name', placeholder='设备编号' )
el-form-item(label='数据起止阶段', prop='name')
el-input(v-model='dataForm.name', placeholder='设备名称' readOnly)
el-form-item(label='设备编号', prop='code')
el-input(v-model='dataForm.code', placeholder='设备编号' readOnly)
el-form-item(label='数据起止阶段', prop='time')
el-button(
size="mini",
type="primary",
......@@ -54,10 +54,7 @@ export default {
pageIndex: 1,
totalPage: 0,
visible: false,
dataForm: {
name: '',
dateValue: ''
},
dataForm: {},
dataList: [],
chartList: [
{ id: '11', title: '温度', color: '#21ACFC', data: [] },
......@@ -71,6 +68,7 @@ export default {
methods: {
init(data, type) {
this.dataForm = data
this.type = type
this.visible = true
this.currentActive = 1
......@@ -85,8 +83,8 @@ export default {
url: this.$http.adornUrl(`/kanban/getListByTypeAndId`),
method: 'get',
params: this.$http.adornParams({
resourceId: '',
resourceType: '507ba9ae22174e4dbbf32dbf34dd7139', //室内气象站
resourceId: this.dataForm.id,
resourceType: this.dataForm.type,
type: this.currentActive,
page: page || this.pageIndex,
rows: size || this.pageSize
......@@ -107,7 +105,8 @@ export default {
url: this.$http.adornUrl('/analysis/getSnqxzInfoTj'),
method: 'get',
params: this.$http.adornParams({
resourceId: '',
region: this.dataForm.region,
resourceId: this.dataForm.id,
type: this.currentActive
})
}).then((data) => {
......@@ -128,13 +127,6 @@ export default {
} else if (this.type === 2) {
this.getDataListTb()
}
},
showParams(data, type) {
console.log(111)
this.historyVisible = true
this.$nextTick(() => {
this.$refs.history.init(data, type)
})
}
}
}
......
......@@ -7,11 +7,11 @@ card-warp(title="室内气象数据", height="45px", showBackground)
el-tabs.myTabs(v-model="activeName", @tab-click="tabClick")
el-tab-pane(label="候车室区域", name="1")
el-tab-pane(label="办公区域", name="2")
el-form(:inline="true")
el-form-item(label="设备编号:")
el-input(size="mini")
el-form-item(label="")
el-button(type="primary", size="mini") 查询
el-form(:inline="true" :mode="formData")
el-form-item(label="设备编号:" prop="code")
el-input(size="mini" v-model="formData.code" clearable)
el-form-item()
el-button(type="primary", size="mini" @click="getDataList()") 查询
.data-warp
.data-item
.type 温度
......@@ -46,7 +46,7 @@ card-warp(title="室内气象数据", height="45px", showBackground)
)
el-table-column(
:resizable="false",
prop="visitorId",
prop="code",
header-align="center",
align="center",
width="240",
......@@ -54,7 +54,7 @@ card-warp(title="室内气象数据", height="45px", showBackground)
)
el-table-column(
:resizable="false",
prop="visitorId",
prop="name",
header-align="center",
align="center",
width="240",
......@@ -87,7 +87,7 @@ card-warp(title="室内气象数据", height="45px", showBackground)
span ( PPM )
el-table-column(
:resizable="false",
prop="visitorId",
prop="status",
header-align="center",
align="center",
label="设备状态"
......@@ -135,7 +135,8 @@ export default {
return {
historyVisible: false,
activeName: '1',
dataList: [{ id: 1 }],
formData: {},
dataList: [],
dataListLoading: false,
pageSize: 10,
pageIndex: 1,
......@@ -156,6 +157,7 @@ export default {
url: this.$http.adornUrl('/liResource/list'),
method: 'post',
data: {
code: this.formData.code,
type: '507ba9ae22174e4dbbf32dbf34dd7139', //室内气象站
region: Number(this.activeName), //区域类型
page: page || this.pageIndex,
......@@ -164,13 +166,11 @@ export default {
}).then((data) => {
if (data && data.code === 0) {
console.log('数据', data)
// this.dataList = data.page.rows
// this.tableColums = crecords
this.totalSize = data.page.total
this.dataList = data.page.rows
this.totalPage = data.page.total
} else {
this.dataList = []
this.totalSize = 0
this.totalPage = 0
}
})
},
......
......@@ -16,10 +16,10 @@ el-dialog(
label-width="120px"
)
el-form-item(label="设备名称", prop="name")
el-input(v-model="dataForm.name", placeholder="设备名称")
el-form-item(label="设备编号", prop="name")
el-input(v-model="dataForm.name", placeholder="设备编号")
el-form-item(label="数据起止阶段", prop="name")
el-input(v-model="dataForm.name", placeholder="设备名称" readOnly)
el-form-item(label="设备编号", prop="code")
el-input(v-model="dataForm.code", placeholder="设备编号" readOnly)
el-form-item(label="数据起止阶段", prop="time")
el-button(
size="mini",
type="primary",
......@@ -147,10 +147,7 @@ export default {
pageSize: 10,
totalPage: 0,
visible: false,
dataForm: {
name: '',
dateValue: ''
},
dataForm: {},
typeList: [
{ name: '当日', id: 1 },
{ name: '本周', id: 2 },
......@@ -175,7 +172,7 @@ export default {
methods: {
init(data, type) {
console.log(11111)
this.dataForm = data
this.type = type // 1=>>> 历史数据 / 2=>>> 统计图表
this.visible = true
this.currentActive = 1
......@@ -199,8 +196,8 @@ export default {
url: this.$http.adornUrl(`/kanban/getListByTypeAndId`),
method: 'get',
params: this.$http.adornParams({
resourceId: '',
resourceType: '9a570e608d0840499551eca89d76449d', //室外气象站
resourceId: this.dataForm.id,
resourceType: this.dataForm.type, //室外气象站
type: this.currentActive,
page: page || this.pageIndex,
rows: size || this.pageSize
......@@ -236,13 +233,6 @@ export default {
this.chartList[7].data = data.radiationList
}
})
},
showParams(data, type) {
console.log(111)
this.historyVisible = true
this.$nextTick(() => {
this.$refs.history.init(data, type)
})
}
}
}
......
......@@ -38,14 +38,14 @@ card-warp(title="室外气象数据", height="45px", showBackground)
)
el-table-column(
:resizable="false",
prop="visitorId",
prop="code",
header-align="center",
align="center",
label="设备编号"
)
el-table-column(
:resizable="false",
prop="visitorId",
prop="name",
header-align="center",
align="center",
label="设备名称"
......@@ -104,7 +104,7 @@ card-warp(title="室外气象数据", height="45px", showBackground)
)
el-table-column(
:resizable="false",
prop="visitorId",
prop="status",
header-align="center",
align="center",
label="设备状态"
......@@ -151,7 +151,6 @@ card-warp(title="室外气象数据", height="45px", showBackground)
<script>
import tablePagination from '@/pages/components/tablePagination'
// import pie from './pie'
import history from './history'
import chart from '@/pages/components/chart.vue'
......@@ -159,20 +158,16 @@ export default {
components: {
tablePagination,
chart,
// pie,
history
},
data() {
return {
formData: {
code: 'SWQX-001',
name: '室外气象站'
},
formData: {},
historyVisible: false,
chartListVisible: false,
showList: false,
activeName: '1',
dataList: [{ id: 1 }],
dataList: [],
dataListLoading: false,
pageSize: 50,
totalPage: 0,
......@@ -201,6 +196,7 @@ export default {
}
},
mounted() {
this.getDataList()
this.getDataListTb()
},
methods: {
......@@ -217,13 +213,13 @@ export default {
}).then((data) => {
if (data && data.code === 0) {
console.log('数据', data)
// this.dataList = data.page.rows
// this.tableColums = crecords
this.totalSize = data.page.total
this.dataList = data.page.rows
this.formData.name = this.dataList[0].name
this.formData.code = this.dataList[0].code
this.totalPage = data.page.total
} else {
this.dataList = []
this.totalSize = 0
this.totalPage = 0
}
})
},
......@@ -249,7 +245,6 @@ export default {
})
},
showParams(data, type) {
console.log(111)
this.historyVisible = true
this.$nextTick(() => {
this.$refs.history.init(data, type)
......
......@@ -7,13 +7,23 @@
width="1200px"
>
<el-form :inline="true">
<el-form-item label="设备名称:" style="margin-bottom:0">
<el-input size="mini" autocomplete="off"></el-input>
<el-form-item label="设备名称:" prop="name" style="margin-bottom: 0">
<el-input
v-model="dataForm.name"
size="mini"
autocomplete="off"
readOnly
></el-input>
</el-form-item>
<el-form-item label="设备编号:" style="margin-bottom:0">
<el-input size="mini" autocomplete="off"></el-input>
<el-form-item label="设备编号:" prop="code" style="margin-bottom: 0">
<el-input
v-model="dataForm.code"
size="mini"
autocomplete="off"
readOnly
></el-input>
</el-form-item>
<el-form-item label="数据起止阶段:" >
<el-form-item label="数据起止阶段:">
<!-- <el-date-picker style="width:172px" size="mini" type="date" placeholder="">
</el-date-picker>
<span style="padding:0 10px"></span>
......@@ -22,77 +32,104 @@
<el-button
size="mini"
type="primary"
@click="handleDate(index)"
@click="handleDate(item.id)"
v-for="(item, index) in typeList"
:key="index"
:class="[index == currentActive ? 'isActive' : '']"
:class="[item.id == currentActive ? 'isActive' : '']"
>{{ item.name }}
</el-button>
</el-form-item>
<el-form-item >
<el-button size='mini' type="primary" icon="el-icon-download">导出</el-button>
</el-form-item>
</el-form>
<enTable :tableData="historyData" :tableColums="tableColums"></enTable>
<div slot="footer">
<el-button @click="cancelhandle">取 消</el-button>
<el-button type="primary" @click="cancelhandle">确 定</el-button>
</div>
<tablePagination
:pageSize="pageSize"
:totalSize="totalPage"
@parentMethod="getDataList"
></tablePagination>
</el-dialog>
</template>
<script >
<script>
import enTable from '../../../components/enTable'
const historyData = [
]
import tablePagination from '@/pages/components/tablePagination'
const tableColums = [
{
label: '功率',
prop: 'qq',
width: 200,
align: 'center'
},
{
label: '设备状态',
prop: 'ww',
width: 200,
align: 'center'
},
{
label: '采集时间',
prop: 'ee',
// width:200,
align: 'center'
}
{
label: '功率',
prop: 'qq',
width: 200,
align: 'center'
},
{
label: '设备状态',
prop: 'ww',
width: 200,
align: 'center'
},
{
label: '采集时间',
prop: 'ee',
// width:200,
align: 'center'
}
]
export default {
name: 'historyDataModal',
props: ['historyDataModalVisible'],
components: {
enTable
tablePagination,
enTable
},
data() {
return {
formLabelWidth: '0px',
historyData,
pageIndex: 1,
pageSize: 10,
totalPage: 0,
dataForm: {},
historyData: [],
tableColums,
typeList: [
{ name: '当日' },
{ name: '本周' },
{ name: '当月' },
{ name: '今年' }
typeList: [
{ name: '当日', id: 1 },
{ name: '本周', id: 2 },
{ name: '当月', id: 3 },
{ name: '今年', id: 4 }
],
currentActive: '0'
currentActive: 1
}
},
methods: {
init(data) {
this.dataForm = data
this.currentActive = 1
this.getDataList() //获取历史数据列表
},
getDataList(page, size) {
this.$http({
url: this.$http.adornUrl(`/kanban/getListByTypeAndId`),
method: 'get',
params: this.$http.adornParams({
resourceId: this.dataForm.id, //资源点id
resourceType: this.dataForm.type, //资源点类型
type: this.currentActive,
page: page || this.pageIndex,
rows: size || this.pageSize
})
}).then((data) => {
if (data && data.code === 0) {
this.historyData = data.page.records
this.totalPage = data.page.total
} else {
this.historyData = []
this.totalPage = 0
}
})
},
cancelhandle() {
this.$emit('cancelhandle')
},
// 当日 ,本周
// 当日 ,本周
handleDate(i) {
this.currentActive = i
this.getDataList()
}
}
}
......
......@@ -31,29 +31,20 @@
<el-button
size="mini"
type="primary"
@click="handleDate(index)"
@click="handleDate(item.id)"
v-for="(item, index) in typeList"
:key="index"
:class="[index == currentActive ? 'isActive' : '']"
:class="[item.id == currentActive ? 'isActive' : '']"
>{{ item.name }}
</el-button>
</el-form-item>
<el-form-item>
<el-button size="mini" type="primary" icon="el-icon-search"
>查询</el-button
>
</el-form-item>
</el-form>
<div v-if="statisticModalVisible" id="categoryId" style="height: 400px">
<chart id="111" :data="data" title="能耗数据" color="#21ACFC"></chart>
</div>
<div slot="footer">
<el-button @click="cancelhandlePic">取 消</el-button>
<el-button type="primary" @click.stop="cancelhandlePic">确 定</el-button>
</div>
</el-dialog>
</template>
<script >
<script>
import chart from '@/pages/components/chart.vue'
export default {
name: 'statisticPicTableModal',
......@@ -64,59 +55,47 @@ export default {
data() {
return {
formLabelWidth: '120px',
dataForm: {},
category: null,
typeList: [
{ name: '当日' },
{ name: '本周' },
{ name: '当月' },
{ name: '今年' }
{ name: '当日', id: 1 },
{ name: '本周', id: 2 },
{ name: '当月', id: 3 },
{ name: '今年', id: 4 }
],
currentActive: '0',
data: [
['2019-8-14 8:00:00', 70],
['2019-8-14 8:00:01', 60],
['2019-8-14 8:00:02', 30],
['2019-8-14 8:00:03', 79],
['2019-8-14 8:00:06', 10],
['2019-8-14 8:00:20', 31]
]
currentActive: 1,
data: []
}
},
mounted() {
// setTimeout(() => {
// this.initCategory();
// }, 3000);
},
methods: {
init(data) {
this.dataForm = data
this.currentActive = 1
this.getDataListTb()
},
getDataListTb() {
this.$http({
url: this.$http.adornUrl('/analysis/getEnergyTb'),
method: 'get',
params: this.$http.adornParams({
resourceId: this.dataForm.id,
type: this.currentActive
})
}).then((data) => {
if (data && data.code === 0) {
// console.log('数据', data)
this.data = data.list
}
})
},
cancelhandlePic() {
this.$emit('cancelhandlePic')
},
// 当日 ,本周
handleDate(i) {
this.currentActive = i
this.getDataListTb()
}
// initCategory() {
// let gId = document.getElementById('categoryId')
// this.category = this.$echarts.init(gId)
// const option = {
// xAxis: {
// type: 'category',
// data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
// },
// yAxis: {
// type: 'value'
// },
// series: [
// {
// data: [150, 230, 224, 218, 135, 147, 260],
// type: 'line'
// }
// ]
// }
// this.category.setOption(option)
// }
}
}
</script>
export const tableColums = [
{
align: 'center',
prop: 'A',
prop: 'name',
label: '设备名称',
width: 162
},
{
align: 'center',
prop: 'B',
prop: 'deployLocation',
label: '设备位置'
// width: 182
},
......@@ -25,13 +25,13 @@ export const tableColums = [
},
{
align: 'center',
prop: 'E',
prop: 'status',
label: '设备状态',
width: 152
},
{
align: 'center',
prop: 'F',
prop: 'code',
label: '设备编号',
width: 152
}
......
......@@ -21,23 +21,42 @@
</div>
<div>
<el-form :inline="true" :mode="formData">
<el-form-item label="设备名称:">
<el-input size="mini" placeholder=""></el-input>
<el-form-item label="设备名称:" prop="name">
<el-input
v-model="formData.name"
size="mini"
placeholder=""
clearable
></el-input>
</el-form-item>
<el-form-item label="设备编号:">
<el-input size="mini" placeholder=""></el-input>
<el-form-item label="设备编号:" prop="code">
<el-input
v-model="formData.code"
size="mini"
placeholder=""
clearable
></el-input>
</el-form-item>
<el-form-item label="运行状态:">
<el-select size="mini" placeholder="" v-model="formData.tyoe">
<el-option label="正常" value="shanghai"></el-option>
<el-option label="不正常" value="beijing"></el-option>
<el-form-item label="运行状态:" prop="status">
<el-select
size="mini"
placeholder="请选择"
v-model="formData.status"
clearable
>
<el-option label="在线" value="1"></el-option>
<el-option label="离线" value="2"></el-option>
<el-option label="故障" value="3"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button icon="el-icon-search" size="mini" type="primary"
<el-button
icon="el-icon-search"
size="mini"
type="primary"
@click="getDataList()"
>查询</el-button
>
</el-form-item>
......@@ -50,10 +69,12 @@
:isShowOp="true"
>
<template #operation="data">
<el-button type="text" @click="openHistoryHandle(data)"
<el-button type="text" @click="openHistoryHandle(data.scope.row)"
>历史数据</el-button
>
<el-button type="text" @click="openPicTHandle">统计图表</el-button>
<el-button type="text" @click="openPicTHandle(data.scope.row)"
>统计图表</el-button
>
</template>
</enTable>
<tablePagination
......@@ -65,10 +86,12 @@
</cardList>
<history-data-modal
:historyDataModalVisible="historyDataModalVisible"
ref="historyDataModal"
v-on:cancelhandle="cancelhandle"
></history-data-modal>
<statistic-pic-table-modal
:statisticModalVisible="statisticModalVisible"
ref="statisticPicTableModal"
v-on:cancelhandlePic="cancelhandlePic"
></statistic-pic-table-modal>
</div>
......@@ -97,14 +120,14 @@ export default {
pageSize: 10,
totalSize: 0,
formData: {},
activeTab: '01',
activeTab: '1',
historyDataModalVisible: false,
statisticModalVisible: false,
tableColums,
tableData: [],
electroTabList: [
{
value: '01',
value: '1',
label: '全部'
},
{
......@@ -150,6 +173,39 @@ export default {
// 获取数据
getDataList(page, size) {
console.log('类型id', this.activeTab)
console.log('formData:', this.formData)
let list = []
if (this.activeTab === '1') {
this.electroTabList.forEach((element) => {
if (element.value !== '1') {
list.push(element.value)
}
})
}
this.$http({
url: this.$http.adornUrl('/liResource/list'),
method: 'post',
data: {
name: this.formData.name,
code: this.formData.code,
status: this.formData.status,
type: this.activeTab === '1' ? '' : this.activeTab, //资源点类型
list: list,
page: page || this.pageIndex,
size: size || this.pageSize
}
}).then((data) => {
if (data && data.code === 0) {
console.log('数据', data)
this.tableData = data.page.rows
this.tableColums = tableColums
this.totalSize = data.page.total
} else {
this.tableData = []
this.totalSize = 0
}
})
},
cancelhandle() {
this.$nextTick(() => {
......@@ -162,12 +218,17 @@ export default {
})
},
openHistoryHandle() {
openHistoryHandle(data) {
console.log('用电:', data)
this.historyDataModalVisible = true
this.$nextTick(() => {
this.$refs.historyDataModal.init(data)
})
},
openPicTHandle() {
openPicTHandle(data) {
this.statisticModalVisible = true
this.$nextTick(() => {
this.statisticModalVisible = true
this.$refs.statisticPicTableModal.init(data)
})
},
toEnergyPage() {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment