Skip to content

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

页面调整

parent 73204c6f
Hide whitespace changes
Inline Side-by-side
Showing with 254 additions and 250 deletions
src/pages/eq/office/config.js
View file @ 32489cfa
......@@ -14,18 +14,24 @@
{
align: 'center',
prop: 'C',
label: '今日用电量',
label: '设备状态',
width: 182
},
{
align: 'center',
prop: 'D',
label: '本月用电量',
label: '今日用电量',
width: 182
},
{
align: 'center',
prop: 'E',
label: '本月用电量',
width: 182
},
{
align: 'center',
prop: 'F',
label: '设备编号',
width: 132
}
......@@ -33,103 +39,111 @@
export const tableDataOne = [
{
A: '多联空调A1',
A: '排风机',
B: '左侧办公房屋',
C: '10',
D: '100',
E: 'DLW-A1'
C: '开启',
D: '10',
E: '100',
F: 'DLW-A1'
},
{
A: '多联空调A2',
A: '排风机',
B: '左侧办公房屋',
C: '10',
D: '100',
E: 'DLW-A2'
C: '开启',
D: '10',
E: '100',
F: 'DLW-A1'
},
{
A: '多联空调A3',
A: '排风机',
B: '左侧办公房屋',
C: '10',
D: '100',
E: 'DLW-A3'
C: '开启',
D: '10',
E: '100',
F: 'DLW-A1'
},
{
A: '多联空调A4',
A: '排风机',
B: '左侧办公房屋',
C: '10',
D: '100',
E: 'DLW-A4'
C: '开启',
D: '10',
E: '100',
F: 'DLW-A1'
}
]
export const tableDataTwo = [
{
A: '多联新风',
B: '屋面',
C: '10',
D: '100',
E: 'DLX-1'
A: '机房空调(220V)',
B: '左侧旅客服务房屋',
C: '开启',
D: '10',
E: '100',
F: 'DLW-A1'
},
{
A: '多联新风',
B: '屋面',
C: '10',
D: '100',
E: 'DLX-1'
A: '机房空调(220V)',
B: '左侧旅客服务房屋',
C: '开启',
D: '10',
E: '100',
F: 'DLW-A1'
},
{
A: '多联新风',
B: '屋面',
C: '10',
D: '100',
E: 'DLX-1'
A: '机房空调(220V)',
B: '左侧旅客服务房屋',
C: '开启',
D: '10',
E: '100',
F: 'DLW-A1'
},
{
A: '多联新风',
B: '屋面',
C: '10',
D: '100',
E: 'DLX-1'
A: '机房空调(220V)',
B: '左侧旅客服务房屋',
C: '开启',
D: '10',
E: '100',
F: 'DLW-A1'
}
]
export const tableDataThree = [
{
A: '机房空调',
A: '机房空调(380V)',
B: '通信机械室',
C: '显示状态',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '机房空调',
A: '机房空调(380V)',
B: '通信机械室',
C: '显示状态',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '机房空调',
A: '机房空调(380V)',
B: '通信机械室',
C: '显示状态',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '机房空调',
A: '机房空调(380V)',
B: '通信机械室',
C: '显示状态',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '机房空调',
A: '机房空调(380V)',
B: '通信机械室',
C: '显示状态',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
......@@ -139,31 +153,124 @@
export const tableDataFour = [
{
A: '排风机',
A: '风幕机',
B: '售票厅',
C: '10',
D: '100',
E: 'PF-B5'
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '排风机',
B: '消防泵房',
C: '10',
D: '100',
E: 'PF-B4'
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: '10',
D: '100',
E: '厕所排风机1#'
A: '多联室内机',
B: '左侧办公房屋',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
},
{
A: '排风机',
B: '候车厅公共卫生间',
C: '10',
D: '100',
E: '厕所排风机2#'
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'
}
]
src/pages/eq/office/page.vue
View file @ 32489cfa
<template>
<div class="office-area-control" style="padding:0 0 40px 0">
<div class="office-area-control" style="padding: 0 0 40px 0">
<cardList cardListTitle="办公区域控制">
<div slot="content" >
<div slot="content">
<!-- <enTabs :tabList="officeTabList"></enTabs> -->
<el-tabs class="en-tabs" v-model="activeTab" >
<el-tab-pane
:label="item.label"
:name="item.value"
v-for="(item, index) in officeTabList"
:key="index"
></el-tab-pane>
</el-tabs>
<el-tabs class="en-tabs" v-model="activeTab">
<el-tab-pane
:label="item.label"
:name="item.value"
v-for="(item, index) in officeTabList"
:key="index"
></el-tab-pane>
</el-tabs>
<div style="margin-top: 20px"></div>
<en-table :tableData="tableData" :tableColums="tableColums" :isShowOp="true" isShowPage="true">
<template v-slot:operation='scope'>
<el-button type="text">编辑</el-button>
</template>
<en-table
:tableData="tableData"
:tableColums="tableColums"
:isShowOp="true"
isShowPage="true"
>
<template v-slot:operation="scope">
<el-button type="text" @click="statusHandle">开启</el-button>
<el-button type="text" @click="statusHandle">关闭</el-button>
</template>
</en-table>
</div>
</cardList>
</div>
</template>
<script >
// const tableColums = [
// {
// align: "center",
// prop: "A",
// label: "设备名称",
// width: 132,
// },
// {
// align: "center",
// prop: "B",
// label: "设备位置",
// // width: 112,
// },
// {
// align: "center",
// prop: "C",
// label: "控制方式",
// width: 132,
// },
// {
// align: "center",
// prop: "D",
// label: "能耗统计",
// width: 132,
// },
// // {
// // align: "center",
// // prop: "E",
// // label: "故障报警",
// // width: 132,
// // },
// // {
// // align: "center",
// // prop: "F",
// // label: "说明",
// // width: 132,
// // },
// {
// align: "center",
// prop: "G",
// label: "设备编号",
// width: 132,
// },
// ];
// const tableData = [
// {
// A: "A",
// B: "YA01254N51",
// C: "正常",
// D: "110Hz",
// E: "",
// F: "说明",
// G: "QY0001",
// },
// {
// A: "A",
// B: "YA01254N51",
// C: "正常",
// D: "110Hz",
// E: "",
// F: "说明",
// G: "QY0001",
// },
// {
// A: "A",
// B: "YA01254N51",
// C: "正常",
// D: "110Hz",
// E: "",
// F: "说明",
// G: "QY0001",
// },
// {
// A: "A",
// B: "YA01254N51",
// C: "正常",
// D: "110Hz",
// E: "",
// F: "说明",
// G: "QY0001",
// },
// {
// A: "A",
// B: "YA01254N51",
// C: "正常",
// D: "110Hz",
// E: "",
// F: "说明",
// G: "QY0001",
// },
// {
// A: "A",
// B: "YA01254N51",
// C: "正常",
// D: "110Hz",
// E: "",
// F: "说明",
// G: "QY0001",
// },
// {
// A: "A",
// B: "YA01254N51",
// C: "正常",
// D: "110Hz",
// E: "",
// F: "说明",
// G: "QY0001",
// },
// {
// A: "A",
// B: "YA01254N51",
// C: "正常",
// D: "110Hz",
// E: "",
// F: "说明",
// G: "QY0001",
// },
// {
// A: "A",
// B: "YA01254N51",
// C: "正常",
// D: "110Hz",
// E: "",
// F: "说明",
// G: "QY0001",
// },
// {
// A: "A",
// B: "YA01254N51",
// C: "正常",
// D: "110Hz",
// E: "",
// F: "说明",
// G: "QY0001",
// },
// {
// A: "A",
// B: "YA01254N51",
// C: "正常",
// D: "110Hz",
// E: "",
// F: "说明",
// G: "QY0001",
// },
// ];
<script>
import cardList from '../../components/cardList'
import enTabs from '../../components/enTabs'
import enTable from '../../components/enTable'
import { tableDataOne, tableColumsOne, tableDataTwo, tableDataThree, tableDataFour } from './config'
import {
tableColumsOne,
tableDataOne,
tableDataTwo,
tableDataThree,
tableDataFour,
tableDataFive,
tableDataSix,
tableDataSeven
} from './config'
export default {
name: 'officeAreaControl',
......@@ -188,44 +58,71 @@ export default {
officeTabList: [
{
value: '01',
label: '多联空调'
label: '排风机'
},
{
value: '02',
label: '多联新风'
label: '机房空调(220V)'
},
{
value: '03',
label: '机房空调'
label: '机房空调(380V)'
},
{
value: '04',
label: '排风机'
label: '风幕机'
},
{
value: '05',
label: '多联室内机'
},
{
value: '06',
label: '多联室外机'
},
{
value: '07',
label: '换气扇'
}
]
}
},
watch: {
activeTab(val) {
switch (val) {
case '01':
this.tableColums = tableColumsOne
this.tableData = tableDataOne
break
case '02':
this.tableColums = tableColumsOne
this.tableData = tableDataTwo
break
case '03':
this.tableColums = tableColumsOne
this.tableData = tableDataThree
break
case '04':
this.tableColums = tableColumsOne
this.tableData = tableDataFour
break
}
switch (val) {
case '01':
this.tableColums = tableColumsOne
this.tableData = tableDataOne
break
case '02':
this.tableColums = tableColumsOne
this.tableData = tableDataTwo
break
case '03':
this.tableColums = tableColumsOne
this.tableData = tableDataThree
break
case '04':
this.tableColums = tableColumsOne
this.tableData = tableDataFour
break
case '05':
this.tableColums = tableColumsOne
this.tableData = tableDataFive
break
case '06':
this.tableColums = tableColumsOne
this.tableData = tableDataSix
break
case '07':
this.tableColums = tableColumsOne
this.tableData = tableDataSeven
break
}
}
},
methods: {
statusHandle() {}
}
}
</script>
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