Commit 32489cfa authored by co_dengxiongwen's avatar co_dengxiongwen

页面调整

parent 73204c6f
...@@ -14,18 +14,24 @@ ...@@ -14,18 +14,24 @@
{ {
align: 'center', align: 'center',
prop: 'C', prop: 'C',
label: '今日用电量', label: '设备状态',
width: 182 width: 182
}, },
{ {
align: 'center', align: 'center',
prop: 'D', prop: 'D',
label: '本月用电量', label: '今日用电量',
width: 182 width: 182
}, },
{ {
align: 'center', align: 'center',
prop: 'E', prop: 'E',
label: '本月用电量',
width: 182
},
{
align: 'center',
prop: 'F',
label: '设备编号', label: '设备编号',
width: 132 width: 132
} }
...@@ -33,103 +39,111 @@ ...@@ -33,103 +39,111 @@
export const tableDataOne = [ export const tableDataOne = [
{ {
A: '多联空调A1', A: '排风机',
B: '左侧办公房屋', B: '左侧办公房屋',
C: '10', C: '开启',
D: '100', D: '10',
E: 'DLW-A1' E: '100',
F: 'DLW-A1'
}, },
{ {
A: '多联空调A2', A: '排风机',
B: '左侧办公房屋', B: '左侧办公房屋',
C: '10', C: '开启',
D: '100', D: '10',
E: 'DLW-A2' E: '100',
F: 'DLW-A1'
}, },
{ {
A: '多联空调A3', A: '排风机',
B: '左侧办公房屋', B: '左侧办公房屋',
C: '10', C: '开启',
D: '100', D: '10',
E: 'DLW-A3' E: '100',
F: 'DLW-A1'
}, },
{ {
A: '多联空调A4', A: '排风机',
B: '左侧办公房屋', B: '左侧办公房屋',
C: '10', C: '开启',
D: '100', D: '10',
E: 'DLW-A4' E: '100',
F: 'DLW-A1'
} }
] ]
export const tableDataTwo = [ export const tableDataTwo = [
{ {
A: '多联新风', A: '机房空调(220V)',
B: '屋面', B: '左侧旅客服务房屋',
C: '10', C: '开启',
D: '100', D: '10',
E: 'DLX-1' E: '100',
F: 'DLW-A1'
}, },
{ {
A: '多联新风', A: '机房空调(220V)',
B: '屋面', B: '左侧旅客服务房屋',
C: '10', C: '开启',
D: '100', D: '10',
E: 'DLX-1' E: '100',
F: 'DLW-A1'
}, },
{ {
A: '多联新风', A: '机房空调(220V)',
B: '屋面', B: '左侧旅客服务房屋',
C: '10', C: '开启',
D: '100', D: '10',
E: 'DLX-1' E: '100',
F: 'DLW-A1'
}, },
{ {
A: '多联新风', A: '机房空调(220V)',
B: '屋面', B: '左侧旅客服务房屋',
C: '10', C: '开启',
D: '100', D: '10',
E: 'DLX-1' E: '100',
F: 'DLW-A1'
} }
] ]
export const tableDataThree = [ export const tableDataThree = [
{ {
A: '机房空调', A: '机房空调(380V)',
B: '通信机械室', B: '通信机械室',
C: '显示状态', C: '开启',
D: '10', D: '10',
E: '100', E: '100',
F: 'JK-1' F: 'JK-1'
}, },
{ {
A: '机房空调', A: '机房空调(380V)',
B: '通信机械室', B: '通信机械室',
C: '显示状态', C: '开启',
D: '10', D: '10',
E: '100', E: '100',
F: 'JK-1' F: 'JK-1'
}, },
{ {
A: '机房空调', A: '机房空调(380V)',
B: '通信机械室', B: '通信机械室',
C: '显示状态', C: '开启',
D: '10', D: '10',
E: '100', E: '100',
F: 'JK-1' F: 'JK-1'
}, },
{ {
A: '机房空调', A: '机房空调(380V)',
B: '通信机械室', B: '通信机械室',
C: '显示状态', C: '开启',
D: '10', D: '10',
E: '100', E: '100',
F: 'JK-1' F: 'JK-1'
}, },
{ {
A: '机房空调', A: '机房空调(380V)',
B: '通信机械室', B: '通信机械室',
C: '显示状态', C: '开启',
D: '10', D: '10',
E: '100', E: '100',
F: 'JK-1' F: 'JK-1'
...@@ -139,31 +153,124 @@ ...@@ -139,31 +153,124 @@
export const tableDataFour = [ export const tableDataFour = [
{ {
A: '排风机', A: '风幕机',
B: '售票厅', B: '售票厅',
C: '10', C: '开启',
D: '100', D: '10',
E: 'PF-B5' E: '100',
F: 'JK-1'
}, },
{ {
A: '排风机', A: '风幕机',
B: '消防泵房', B: '售票厅',
C: '10', C: '开启',
D: '100', D: '10',
E: 'PF-B4' E: '100',
F: 'JK-1'
}
]
export const tableDataFive = [
{
A: '多联室内机',
B: '左侧办公房屋',
C: '开启',
D: '10',
E: '100',
F: 'JK-1'
}, },
{ {
A: '排风机', A: '多联室内机',
B: '车站备品间', B: '左侧办公房屋',
C: '10', C: '开启',
D: '100', D: '10',
E: '厕所排风机1#' E: '100',
F: 'JK-1'
}, },
{ {
A: '排风机', A: '多联室内机',
B: '候车厅公共卫生间', B: '左侧办公房屋',
C: '10', C: '开启',
D: '100', D: '10',
E: '厕所排风机2#' 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'
} }
] ]
<template> <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="办公区域控制"> <cardList cardListTitle="办公区域控制">
<div slot="content" > <div slot="content">
<!-- <enTabs :tabList="officeTabList"></enTabs> --> <!-- <enTabs :tabList="officeTabList"></enTabs> -->
<el-tabs class="en-tabs" v-model="activeTab" > <el-tabs class="en-tabs" v-model="activeTab">
<el-tab-pane <el-tab-pane
:label="item.label" :label="item.label"
:name="item.value" :name="item.value"
v-for="(item, index) in officeTabList" v-for="(item, index) in officeTabList"
:key="index" :key="index"
></el-tab-pane> ></el-tab-pane>
</el-tabs> </el-tabs>
<div style="margin-top: 20px"></div> <div style="margin-top: 20px"></div>
<en-table :tableData="tableData" :tableColums="tableColums" :isShowOp="true" isShowPage="true"> <en-table
<template v-slot:operation='scope'> :tableData="tableData"
<el-button type="text">编辑</el-button> :tableColums="tableColums"
</template> :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> </en-table>
</div> </div>
</cardList> </cardList>
</div> </div>
</template> </template>
<script > <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",
// },
// ];
import cardList from '../../components/cardList' import cardList from '../../components/cardList'
import enTabs from '../../components/enTabs' import enTabs from '../../components/enTabs'
import enTable from '../../components/enTable' 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 { export default {
name: 'officeAreaControl', name: 'officeAreaControl',
...@@ -188,44 +58,71 @@ export default { ...@@ -188,44 +58,71 @@ export default {
officeTabList: [ officeTabList: [
{ {
value: '01', value: '01',
label: '多联空调' label: '排风机'
}, },
{ {
value: '02', value: '02',
label: '多联新风' label: '机房空调(220V)'
}, },
{ {
value: '03', value: '03',
label: '机房空调' label: '机房空调(380V)'
}, },
{ {
value: '04', value: '04',
label: '排风机' label: '风幕机'
},
{
value: '05',
label: '多联室内机'
},
{
value: '06',
label: '多联室外机'
},
{
value: '07',
label: '换气扇'
} }
] ]
} }
}, },
watch: { watch: {
activeTab(val) { activeTab(val) {
switch (val) { switch (val) {
case '01': case '01':
this.tableColums = tableColumsOne this.tableColums = tableColumsOne
this.tableData = tableDataOne this.tableData = tableDataOne
break break
case '02': case '02':
this.tableColums = tableColumsOne this.tableColums = tableColumsOne
this.tableData = tableDataTwo this.tableData = tableDataTwo
break break
case '03': case '03':
this.tableColums = tableColumsOne this.tableColums = tableColumsOne
this.tableData = tableDataThree this.tableData = tableDataThree
break break
case '04': case '04':
this.tableColums = tableColumsOne this.tableColums = tableColumsOne
this.tableData = tableDataFour this.tableData = tableDataFour
break 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> </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