suojin
/
jiahe_device
14
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

对接大屏接口

Browse Source
main
jinna 2 years ago
parent 2de9a59a1e
commit fdd860da25
3 changed files with 64 additions and 74 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 19
      src/api/energySources/energySources.js
  2. 67
      src/views/energySources/component/dosage.vue
  3. 52
      src/views/energySources/component/equipmentLoad.vue

19
src/api/energySources/energySources.js
Unescape View File

@ -27,6 +27,7 @@ export const getDayElectricity = (query) => {
});
};
// 负荷分析-周分析
export const getWeekElectricity = (query) => {
return request({
url: "/api/blade-lims/largeScreen/getWeekElectricity",
@ -34,3 +35,21 @@ export const getWeekElectricity = (query) => {
params: query,
});
};
// 用量分析-每日
export const getPeriodElectricity = (query) => {
return request({
url: "/api/blade-lims/largeScreen/getPeriodElectricity",
method: "get",
params: query,
});
};
// 设备负载率
export const getInstrumentActLoad = (query) => {
return request({
url: "/api/blade-lims/largeScreen/getInstrumentActLoad",
method: "get",
params: query,
});
};

67
src/views/energySources/component/dosage.vue
Unescape View File

@ -5,8 +5,8 @@
<span style="color: #0096FF;">监测明细</span>
&nbsp;&nbsp;&nbsp;
<span style="color: #fff;">选择月份：</span>
<el-date-picker size="mini" v-model="value2" type="month" placeholder="选择月"
style="width: 1.2rem;margin-right: 0.26rem;">
<el-date-picker size="mini" v-model="selectDay" type="date" placeholder="选择月" @change="changeDate"
style="width: 1.3rem;margin-right: 0.26rem;" value-format="yyyy-MM-dd" format="yyyy-MM-dd">
</el-date-picker>
单位：kw·h
</div>
@ -16,9 +16,9 @@
<el-table :data="tableData" style="width: 62%;" height="92%" :stripe="true" :size="mini"
:row-class-name="tableRowClassName">
<el-table-column prop="name" label="部门/车间">
<el-table-column prop="name" label="部门/车间" show-overflow-tooltip>
<template slot-scope="scope">
<span style="color: #fff">{{ scope.row.name }}%</span>
<span style="color: #fff">{{ scope.row.name }}</span>
</template>
</el-table-column>
@ -26,14 +26,14 @@
<template slot-scope="scope">
<!-- <span :style="{ color: scope.row.address > 0 ? '#11F150' : 'rgba($color: #fff, $alpha: 0.2)' }">{{
scope.row.address }}%</span> -->
<span style="color: #11F150">{{ scope.row.address }}%</span>
<span style="color: #11F150">{{ scope.row.sum ? scope.row.sum : 0 }}</span>
</template>
</el-table-column>
<el-table-column prop="address" label="尖时段">
<template slot-scope="scope">
<!-- <span :style="{ color: scope.row.address > 0 ? '#FB5E2D' : 'rgba($color: #fff, $alpha: 0.2)' }">{{
scope.row.address }}%</span> -->
<span style="color: #FB5E2D">{{ scope.row.address }}%</span>
<span style="color: #FB5E2D">{{ scope.row.jian ? scope.row.jian : 0 }}</span>
</template>
</el-table-column>
<el-table-column prop="date" label="峰时段">
@ -41,21 +41,21 @@
<!-- <span :style="{ color: scope.row.address > 0 ? '#FBB02D' : 'rgba($color: #fff, $alpha: 0.2)' }">{{
scope.row.address
}}%</span> -->
<span style="color: #FBB02D">{{ scope.row.address }}%</span>
<span style="color: #FBB02D">{{ scope.row.feng ? scope.row.feng : 0 }}</span>
</template>
</el-table-column>
<el-table-column prop="address" label="峰时段">
<el-table-column prop="address" label="平时段">
<template slot-scope="scope">
<!-- <span :style="{ color: scope.row.address > 0 ? '#00A2FF' : 'rgba($color: #fff, $alpha: 0.2)' }">{{
scope.row.address }}%</span> -->
<span style="color: #00A2FF">{{ scope.row.address }}%</span>
<span style="color: #00A2FF">{{ scope.row.ping ? scope.row.ping : 0 }}</span>
</template>
</el-table-column>
<el-table-column prop="address" label="谷时段">
<template slot-scope="scope">
<!-- <span :style="{ color: scope.row.address > 0 ? '#10EFBD' : 'rgba($color: #fff, $alpha: 0.2)' }">{{
scope.row.address }}%</span> -->
<span style="color: #10EFBD">{{ scope.row.address }}%</span>
<span style="color: #10EFBD">{{ scope.row.gu ? scope.row.gu : 0 }}</span>
</template>
</el-table-column>
</el-table>
@ -85,49 +85,38 @@
<script>
import tit from "./tit.vue";
import { mapGetters } from "vuex";
import {getPeriodElectricity} from "@/api/energySources/energySources"
export default {
data() {
return {
tableData: [{
date: '2016-05-02',
name: '王小虎',
address: 29,
}, {
date: '2016-05-04',
name: '王小虎',
address: 0,
}, {
date: '2016-05-01',
name: '王小虎',
address: 29,
}, {
date: '2016-05-01',
name: '王小虎',
address: 29,
}, {
date: '2016-05-01',
name: '王小虎',
address: 29,
}, {
date: '2016-05-01',
name: '王小虎',
address: 29,
}, {
date: '2016-05-03',
name: '王小虎',
address: 29,
}]
selectDay:'',
tableData: []
};
},
components: {
tit
},
created() {
this.selectDay = this.$moment().format('YYYY-MM-DD')
this.$nextTick(() => {
this.getPeriodData()
this.echartsInit()
})
},
computed:{
...mapGetters(["userInfo", "permission"]),
},
methods: {
getPeriodData(){
getPeriodElectricity({manufacturerBrand:this.userInfo.dept_name,today:this.selectDay}).then(res =>{
console.log('period =====>',res)
this.tableData = res.data.data
})
},
changeDate(){
this.getPeriodData()
},
echartsInit() {
const chartDom = document.getElementById('mainDosage');
const myChart = this.$echarts.init(chartDom);

52
src/views/energySources/component/equipmentLoad.vue
Unescape View File

@ -5,14 +5,14 @@
</tit>
<el-table :data="tableData" style="width: 100%;" height="92%" :stripe="true" :size="mini"
:row-class-name="tableRowClassName">
<el-table-column prop="name" label="设备名称">
<el-table-column prop="name" label="设备名称" show-overflow-tooltip>
</el-table-column>
<el-table-column prop="address" label="负载率">
<template slot-scope="scope">
<span>{{ scope.row.address }}%</span>
<span>{{ scope.row.loadRate }}%</span>
</template>
</el-table-column>
<el-table-column prop="date" label="负载最长时段">
<el-table-column prop="sendTime" label="负载最长时段" show-overflow-tooltip>
</el-table-column>
</el-table>
</div>
@ -20,57 +20,39 @@
<script>
import tit from "./tit.vue";
import { mapGetters } from "vuex";
import {getInstrumentActLoad} from "@/api/energySources/energySources"
export default {
data() {
return {
tableData: [{
date: '2016-05-02',
name: '王小虎',
address: 29,
}, {
date: '2016-05-04',
name: '王小虎',
address: 0,
}, {
date: '2016-05-01',
name: '王小虎',
address: 29,
}, {
date: '2016-05-01',
name: '王小虎',
address: 29,
}, {
date: '2016-05-01',
name: '王小虎',
address: 29,
}, {
date: '2016-05-01',
name: '王小虎',
address: 29,
}, {
date: '2016-05-03',
name: '王小虎',
address: 29,
}]
tableData: []
};
},
components: {
tit
},
computed:{
...mapGetters(["userInfo", "permission"]),
},
created() {
this.getTableData()
},
methods: {
getTableData(){
getInstrumentActLoad({manufacturerBrand:this.userInfo.dept_name}).then(res =>{
this.tableData = res.data.data
})
},
tableRowClassName({ row, rowIndex }) {
if (rowIndex % 2 === 0) {
if (row.address > 0) {
if (row.loadRate > 0) {
return 'trEven colorFB5E2D';
} else {
return 'trEven';
}
} else {
if (row.address > 0) {
if (row.loadRate > 0) {
return 'trOdd colorFB5E2D';
} else {
return 'trOdd';

Write Preview
Loading…
Cancel
Save