Skip to content

E
energyai_vue
Commit e777a1b5 authored by co_dengxiongwen's avatar co_dengxiongwen
Browse files
Options

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

# Conflicts:
#	src/pages/analysis/energy/page.vue
parents 45865f7e f623e88b
Hide whitespace changes
Inline Side-by-side
Showing with 132 additions and 172 deletions
src/pages/analysis/energy/page.vue
View file @ e777a1b5
...@@ -2,31 +2,12 @@ ...@@ -2,31 +2,12 @@
<div class="energy-page"> <div class="energy-page">
<cardList cardListTitle="能耗数据分析"> <cardList cardListTitle="能耗数据分析">
<div slot="right"> <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 size="mini" type="primary" @click="toPowerPage"
>图形/列表</el-button >图形/列表</el-button
> >
</div> </div>
<div slot="content"> <div slot="content">
<div> <div>
<!-- <enTabs :tabList="energyTabList"></enTabs> -->
<el-tabs class="en-tabs" v-model="activetap"> <el-tabs class="en-tabs" v-model="activetap">
<el-row style="padding-top: 15px"> <el-row style="padding-top: 15px">
<el-col :span="10"> <el-col :span="10">
...@@ -154,7 +135,6 @@ export default { ...@@ -154,7 +135,6 @@ export default {
<style lang="scss"> <style lang="scss">
.energy-page { .energy-page {
height: 100%; height: 100%;
padding: 0px 0px 40px 0px;
.date-text { .date-text {
padding-right: 20px; padding-right: 20px;
......
src/pages/analysis/fault/pie4.vue
View file @ e777a1b5
...@@ -34,7 +34,7 @@ export default { ...@@ -34,7 +34,7 @@ export default {
} }
}, },
created() { created() {
// this.list = this.genData(30) this.list = this.genData(30)
}, },
mounted() { mounted() {
this.ring() this.ring()
...@@ -47,8 +47,8 @@ export default { ...@@ -47,8 +47,8 @@ export default {
let myCharts = this.$echarts.init(dom) let myCharts = this.$echarts.init(dom)
let option = { let option = {
tooltip: { tooltip: {
trigger: 'item' trigger: 'item',
// formatter: '{a} <br/>{b} : {c} ({d}%)' formatter: '{a} <br/>{b} : {c} ({d}%)'
}, },
legend: { legend: {
type: 'scroll', type: 'scroll',
...@@ -56,23 +56,21 @@ export default { ...@@ -56,23 +56,21 @@ export default {
right: 10, right: 10,
top: 20, top: 20,
bottom: 20, bottom: 20,
data: [1, 2, 3, 4, 5, 6], data: ['测试1', '测试2', '测试3', '测试4']
selected: [1, 2, 3, 4, 5, 6] // selected: this.list.selected
}, },
series: [ series: [
{ {
name: '姓名', name: '',
type: 'pie', type: 'pie',
radius: '55%', radius: '55%',
center: ['40%', '50%'], center: ['40%', '50%'],
data: [ data: [
{ name: 1, value: '123' }, { name: '测试', value: '100', itemStyle: { color: 'skyblue' } },
{ name: 1, value: '123' }, { name: '测试2', value: '130', itemStyle: { color: '#F2637B' } },
{ name: 1, value: '123' }, { name: '测试3', value: '400', itemStyle: { color: '#8EE0E0' } },
{ name: 1, value: '123' }, { name: '测试4', value: '100', itemStyle: { color: '#FFCC00' } }
{ name: 1, value: '123' },
{ name: 1, value: '123' }
], ],
emphasis: { emphasis: {
itemStyle: { itemStyle: {
......
src/pages/components/cardList.vue
View file @ e777a1b5
...@@ -6,40 +6,40 @@ ...@@ -6,40 +6,40 @@
<slot name="right" /> <slot name="right" />
</div> </div>
</div> </div>
<div class="card-list-content"> <div class="card-list-content">
<slot name="content" /> <slot name="content" />
</div> </div>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
name: "cardList", name: 'cardList',
props: { props: {
cardListTitle: { cardListTitle: {
type: String, type: String,
default: "能耗统计", default: '能耗统计'
}, }
}, },
data() { data() {
return {}; return {}
}, }
}; }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.card-list { .card-list {
width: 100%; width: 100%;
height: 100%; height: 100%;
background: #fff; background: #fff;
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
&-line { &-line {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
padding: 0 20px; padding: 0 20px;
border-bottom: 1px solid #d9d9d9; border-bottom: 1px solid #d9d9d9;
background: #F2FAFF; background: #f2faff;
height: 45px; height: 45px;
line-height: 45px; line-height: 45px;
.card-list-title { .card-list-title {
display: flex; display: flex;
...@@ -66,9 +66,9 @@ export default { ...@@ -66,9 +66,9 @@ export default {
// height: 16px; // height: 16px;
// background: #1890ff; // background: #1890ff;
// } // }
.card-list-content{ .card-list-content {
padding:20px; padding: 20px;
height: calc( 155 - 40px ); height: calc(100% - 90px);
} }
} }
</style> </style>
src/pages/components/enTable.vue
View file @ e777a1b5
...@@ -26,7 +26,7 @@ ...@@ -26,7 +26,7 @@
</el-table-column> </el-table-column>
</template> </template>
<el-table-column align="center" label="操作" width="150" > <el-table-column align="center" label="操作" :width="opNum*80" >
<template slot-scope="scope" > <template slot-scope="scope" >
<slot name='operation' :scope='scope'></slot> <slot name='operation' :scope='scope'></slot>
</template> </template>
...@@ -53,37 +53,41 @@ ...@@ -53,37 +53,41 @@
<script > <script >
export default { export default {
name: "enTable", name: 'enTable',
props: { props: {
// ["", "tableColums",'isShowOp'.toString // ["", "tableColums",'isShowOp'.toString
tableData:{ tableData: {
type:Array, type: Array
}, },
tableColums:{ tableColums: {
type:Array, type: Array
}, },
isShowOp:{ isShowOp: {
type:Boolean, type: Boolean,
defaul:false, default: false
}, },
isShowPage:{ opNum: {
type: Number,
defaul:true, default: 3
}, },
isEdit:{ isShowPage: {
defaul:true,
default: true
},
isEdit: {
default: true
} }
}, },
data() { data() {
return {}; return {}
}, },
methods:{ methods: {
handleClick(){ handleClick() {
this.$emit('handleBtnClick') this.$emit('handleBtnClick')
} }
} }
}; }
</script> </script>
<style lang="scss"> <style lang="scss">
.record-color { .record-color {
......
src/pages/components/enTabs.vue
View file @ e777a1b5
...@@ -14,38 +14,30 @@ ...@@ -14,38 +14,30 @@
</ul> </ul>
</div> </div>
</template> </template>
<script > <script >
import { Tabs } from 'element-ui'; import { Tabs } from 'element-ui'
export default { export default {
name: "elTabs", name: 'elTabs',
props: ["tabList"], props: ['tabList'],
data() { data() {
return { return {
isActiveIndex: 0, isActiveIndex: 0,
activeName: 'second', activeName: 'second'
}; }
}, },
methods: { methods: {
tabHandle(item, index) { tabHandle(item, index) {
this.isActiveIndex = index; this.isActiveIndex = index
// this.$emit("tabHandle"); // this.$emit("tabHandle");
}, }
}, }
}; }
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.en-tabs { .en-tabs {
.show-bar-border { .show-bar-border {
...@@ -80,5 +72,4 @@ export default { ...@@ -80,5 +72,4 @@ export default {
// } // }
} }
</style>
</style>
\ No newline at end of file
src/pages/components/energyTotalCharts.vue
View file @ e777a1b5
<template> <template>
<div class="energy-total-charts"> <div id="energyChart" style="height:100%"></div>
<div id="energyChart" style="height: 385px"></div>
</div>
</template> </template>
<script> <script>
export default { export default {
name: "energyTotalCharts", name: 'energyTotalCharts',
data() { data() {
return { return {
energyChart: null, energyChart: null
}; }
}, },
mounted() { mounted() {
this.initChart(); this.initChart()
}, },
methods: { methods: {
initChart() { initChart() {
let energyChart = document.getElementById("energyChart"); let energyChart = document.getElementById('energyChart')
this.energyChart = this.$echarts.init(energyChart); this.energyChart = this.$echarts.init(energyChart)
let _this = this; let _this = this
const option = { const option = {
tooltip: { tooltip: {
trigger: "axis", trigger: 'axis',
axisPointer: { axisPointer: {
type: "cross", type: 'cross',
label: { label: {
// backgroundColor: "#21ACFC", // backgroundColor: "#21ACFC",
}, }
}, }
}, },
legend: { legend: {
data: [], data: []
}, },
grid: { grid: {
left: "3%", left: '3%',
right: "4%", right: '4%',
bottom: "3%", bottom: '3%',
containLabel: true, containLabel: true
}, },
// center: ['50%', '40%'], // center: ['50%', '40%'],
xAxis: [ xAxis: [
{ {
type: "category", type: 'category',
boundaryGap: false, boundaryGap: false,
data: [ data: [
"02-01", '02-01',
"02-01", '02-01',
"02-01", '02-01',
"02-01", '02-01',
"02-01", '02-01',
"02-01", '02-01',
"02-01", '02-01'
], ]
}, }
], ],
yAxis: [ yAxis: [
{ {
name: "单位：kwh", name: '单位：kwh',
type: "value", type: 'value'
// itemStyle : { // itemStyle : {
// normal : { // normal : {
// lineStyle:{ // lineStyle:{
// color:'#00FF00' // color:'#00FF00'
// } // }
// } // }
}, }
], ],
series: [ series: [
{ {
name: "能耗统计", name: '能耗统计',
type: "line", type: 'line',
showSymbol: false, showSymbol: false,
smooth: true, smooth: true,
stack: "总量", stack: '总量',
areaStyle: {}, areaStyle: {},
data: [120, 132, 101, 134, 90, 230, 210], data: [120, 132, 101, 134, 90, 230, 210],
lineStyle: { lineStyle: {
normal: { normal: {
width: 4, width: 4,
color: "#21ACFC", //设置实线的颜色 color: '#21ACFC' //设置实线的颜色
}, }
}, },
itemStyle: { itemStyle: {
normal: { normal: {
...@@ -98,37 +96,37 @@ export default { ...@@ -98,37 +96,37 @@ export default {
[ [
{ {
offset: 0, offset: 0,
color: "#21ACFC", color: '#21ACFC'
}, },
{ {
offset: 0.5, offset: 0.5,
color: "#21ACFC", color: '#21ACFC'
}, },
{ {
offset: 1, offset: 1,
color: "rgba(33, 172, 252, 0)", color: 'rgba(33, 172, 252, 0)'
}, }
] ]
), )
}, },
lineStyle: { lineStyle: {
//线的颜色 //线的颜色
color: "#349e85", color: '#349e85'
}, }
}, }
}, }
}, }
], ]
}; }
this.energyChart.setOption(option); this.energyChart.setOption(option)
window.addEventListener("resize", this.resizeHandle); window.addEventListener('resize', this.resizeHandle)
// background: linear-gradient(0deg, #21ACFC, rgba(33, 172, 252, 0)); // background: linear-gradient(0deg, #21ACFC, rgba(33, 172, 252, 0));
}, }
}, },
resizeHandle() { resizeHandle() {
this.energyChart.resize(); this.energyChart.resize()
}, }
}; }
</script> </script>
\ No newline at end of file
src/pages/components/myPies.vue
View file @ e777a1b5
<template> <template>
<div class="my-pies"> <div id="myPies" style="height: 100%"></div>
<div id="myPies" style="height: 548px"></div>
</div>
</template> </template>
<script> <script>
......
src/pages/eq/hall/config.js
View file @ e777a1b5
...@@ -123,6 +123,7 @@ ...@@ -123,6 +123,7 @@
E: '100', E: '100',
F: 'JK-1' F: 'JK-1'
} }
] ]
export const tableDataTwo = [ export const tableDataTwo = [
......
src/pages/eq/hall/page.vue
View file @ e777a1b5
<template> <template>
<div class="hall full-height"> <div class="hall">
<cardList cardListTitle="候车大厅控制"> <cardList cardListTitle="候车大厅控制">
<div slot="content"> <div slot="content">
<div> <div>
...@@ -36,7 +36,6 @@ ...@@ -36,7 +36,6 @@
</el-button> </el-button>
</el-form-item> </el-form-item>
</span> </span>
</el-row>
</el-form> </el-form>
...@@ -143,7 +142,6 @@ export default { ...@@ -143,7 +142,6 @@ export default {
<style lang="scss" > <style lang="scss" >
.hall { .hall {
height: 100%; height: 100%;
padding: 0px 0 40px 0px;
.el-input__inner { .el-input__inner {
height: 30px; height: 30px;
} }
......
src/pages/eq/office/page.vue
View file @ e777a1b5
<template> <template>
<div class="office-area-control" style="padding: 0 0 40px 0"> <div class="office-area-control" style="height:100%;">
<cardList cardListTitle="办公区域控制"> <cardList cardListTitle="办公区域控制">
<div slot="content"> <div slot="content">
<!-- <enTabs :tabList="officeTabList"></enTabs> --> <!-- <enTabs :tabList="officeTabList"></enTabs> -->
......
src/pages/home/page.vue
View file @ e777a1b5
...@@ -23,9 +23,9 @@ ...@@ -23,9 +23,9 @@
</div> </div>
</div> </div>
<div class="home-page-content"> <div class="home-page-content">
<el-row :gutter="12"> <el-row :gutter="12" style='height:100%;'>
<el-col :span="16"> <el-col :span="16" style='height:100%;'>
<card-list :cardListTitle="cardListLeftTitle"> <card-list :cardListTitle="cardListLeftTitle">
<div slot="right"> <div slot="right">
<span <span
:class="activeIndex === index ? 'active-hight-linght' : ''" :class="activeIndex === index ? 'active-hight-linght' : ''"
...@@ -35,20 +35,11 @@ ...@@ -35,20 +35,11 @@
:key="item.value" :key="item.value"
>{{ item.label }}</span >{{ item.label }}</span
> >
<!-- <el-date-picker
type="daterange"
range-separator="～"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker> -->
</div> </div>
<div slot="content" class="content-wrap"> <div slot="content" class="content-wrap">
<!-- 卡片 -->
<el-row <el-row
:gutter="12" :gutter="12"
class="margin_top_25"
type="flex" type="flex"
justify="center" justify="center"
> >
...@@ -74,7 +65,7 @@ ...@@ -74,7 +65,7 @@
<el-col :span="6"> <el-col :span="6">
<div class="handle-mode-wrap"> <div class="handle-mode-wrap">
<div class="font-style font_14"> <div class="font-style font_14">
<span>节能模式</span> <span>运行时间</span>
</div> </div>
<div class="flex-save-warp"> <div class="flex-save-warp">
<div> <div>
...@@ -104,16 +95,15 @@ ...@@ -104,16 +95,15 @@
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
<!-- echarts --> <div style="height:calc(100% - 130px);">
<div style="height: 100%">
<energy-total-charts></energy-total-charts> <energy-total-charts></energy-total-charts>
</div> </div>
</div> </div>
</card-list> </card-list>
</el-col> </el-col>
<el-col :span="8" style="padding-left: 0"> <el-col :span="8" style="padding-left: 0;height:100%;">
<card-list :cardListTitle="cardListRightTitle"> <card-list :cardListTitle="cardListRightTitle">
<div slot="content"> <div slot="content" style='height:100%;'>
<my-pies></my-pies> <my-pies></my-pies>
</div> </div>
</card-list> </card-list>
...@@ -206,10 +196,8 @@ export default { ...@@ -206,10 +196,8 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
@import '~@/assets/style/public.scss'; @import '~@/assets/style/public.scss';
.home-page { .home-page {
height: 100%; height:calc(100vh - 155px);
width: 100%; width: 100%;
padding: 0px 0px 40px 0px;
// overflow: auto;
&-top { &-top {
margin: 20px; margin: 20px;
margin-bottom: 24px; margin-bottom: 24px;
...@@ -254,6 +242,7 @@ export default { ...@@ -254,6 +242,7 @@ export default {
} }
.home-page-content { .home-page-content {
margin: 20px; margin: 20px;
height: calc(100vh - 450px);
.date-text { .date-text {
padding-right: 20px; padding-right: 20px;
font-size: 12px; font-size: 12px;
...@@ -268,6 +257,7 @@ export default { ...@@ -268,6 +257,7 @@ export default {
.content-wrap { .content-wrap {
// margin: 20px; // margin: 20px;
height: 100%;
.energy-save-mode-wrap { .energy-save-mode-wrap {
// width: ; // width: ;
box-sizing: border-box; box-sizing: border-box;
...@@ -279,19 +269,21 @@ export default { ...@@ -279,19 +269,21 @@ export default {
border-radius: 6px; border-radius: 6px;
.flex-save-warp { .flex-save-warp {
display: flex; display: flex;
justify-content: space-between; justify-content: space-around;
} }
} }
.handle-mode-wrap { .handle-mode-wrap {
background: #36cbcb; background: #36cbcb;
box-sizing: border-box; box-sizing: border-box;
padding: 24px 30px 25px 30px; // padding: 24px 30px 25px 30px;
padding-top: 24px;
height: 138px; height: 138px;
text-align: center; text-align: center;
border-radius: 6px; border-radius: 6px;
.flex-save-warp { .flex-save-warp {
display: flex; display: flex;
justify-content: space-between; justify-content: space-around;
} }
} }
.sys-save-mode-wrap { .sys-save-mode-wrap {
......
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