Commit c40a678e authored by yanzhongrong's avatar yanzhongrong

monitor status

parent 7a8fa80c
...@@ -89,7 +89,9 @@ export default { ...@@ -89,7 +89,9 @@ export default {
this.$emit('selectItem', data) this.$emit('selectItem', data)
}, },
getInit() { getInit() {
this.loading = true
getTree().then(res => { getTree().then(res => {
this.loading = false
let list = res || [] let list = res || []
this.data = list this.data = list
}) })
......
...@@ -2,4 +2,9 @@ export const alarmLeval = { ...@@ -2,4 +2,9 @@ export const alarmLeval = {
1: '紧急', 1: '紧急',
2: '重要', 2: '重要',
3: '一般', 3: '一般',
}
export const ConnectStatusEnum = {
0: '连接正常',
1: '连接异常'
} }
\ No newline at end of file
export const ConnectStatusEnum = {
0: '连接正常',
1: '连接异常'
}
\ No newline at end of file
...@@ -53,7 +53,7 @@ ...@@ -53,7 +53,7 @@
</template> </template>
<script> <script>
import { ConnectMaintainList, ConnectMaintainDelete } from '../api' import { ConnectMaintainList, ConnectMaintainDelete } from '../api'
import { ConnectStatusEnum } from '../const' import { ConnectStatusEnum } from '@/const/index'
export default { export default {
data() { data() {
...@@ -95,9 +95,9 @@ export default { ...@@ -95,9 +95,9 @@ export default {
}) })
}, },
cellClassFn({ row, column, rowIndex, columnIndex }) { cellClassFn({ row, column, rowIndex, columnIndex }) {
if (row.linkStatus == "连接异常" && column.label == "连接状态") { if (row.pointConnectStatus_text == "连接异常" && column.label == "连接状态") {
return "emergency"; return "emergency";
} else if (row.linkStatus == "连接正常" && column.label == "连接状态") { } else if (row.pointConnectStatus_text == "连接正常" && column.label == "连接状态") {
return "normal"; return "normal";
} }
if (rowIndex % 2 == 1) { if (rowIndex % 2 == 1) {
......
...@@ -53,7 +53,8 @@ ...@@ -53,7 +53,8 @@
</template> </template>
<script> <script>
import { ConnectStatusList, ConnectStatusDelete } from '../api' import { ConnectStatusList, ConnectStatusDelete } from '../api'
import { ConnectStatusEnum } from '../const' import { ConnectStatusEnum } from '@/const/index'
export default { export default {
props: [], props: [],
data() { data() {
...@@ -95,9 +96,9 @@ export default { ...@@ -95,9 +96,9 @@ export default {
}) })
}, },
cellClassFn({ row, column, rowIndex, columnIndex }) { cellClassFn({ row, column, rowIndex, columnIndex }) {
if (row.linkStatus == "连接异常" && column.label == "连接状态") { if (row.pointConnectStatus_text == "连接异常" && column.label == "连接状态") {
return "emergency"; return "emergency";
} else if (row.linkStatus == "连接正常" && column.label == "连接状态") { } else if (row.pointConnectStatus_text == "连接正常" && column.label == "连接状态") {
return "normal"; return "normal";
} }
if (rowIndex % 2 == 1) { if (rowIndex % 2 == 1) {
......
import request from '@/utils/request'
const path = {
CableStatusList: 'sysLeakyCableStatus/selectPage',
CableStatusExport: 'sysLeakyCableStatus/export',
DeviceStatusList: 'sysDeviceStatus/selectPage',
DeviceStatusExport: 'sysDeviceStatus/export',
}
export function CableStatusList() {
return request.post(path.CableStatusList, ...arguments)
}
export function CableStatusExport() {
return request.post(path.CableStatusExport, ...arguments)
}
export function DeviceStatusList() {
return request.post(path.DeviceStatusList, ...arguments)
}
export function DeviceStatusExport() {
return request.post(path.DeviceStatusExport, ...arguments)
}
...@@ -2,26 +2,29 @@ ...@@ -2,26 +2,29 @@
<!-- 漏缆实时状态 --> <!-- 漏缆实时状态 -->
<div class="leakage-cable"> <div class="leakage-cable">
<div class="leakage-top"> <div class="leakage-top">
<div> <div></div>
</div>
<div class="operate-btn"> <div class="operate-btn">
<el-button type="primary">刷新</el-button> <el-button type="primary" @click="getTableData">刷新</el-button>
<el-button type="primary">查询</el-button> <el-button type="primary">查询</el-button>
<el-button type="primary">导出</el-button> <el-button type="primary" @click="toExport">导出</el-button>
</div> </div>
</div> </div>
<el-table :data="tableData2" style="width: 100%" :cell-class-name="cellClassFn" :header-cell-style="{background:'#EAF1FE',color:'#666666'}"> <el-table
<el-table-column prop="equipment1" label="网元设备" align="center" /> :data="tableData"
<el-table-column prop="state1" label="连接状态" align="center" /> style="width: 100%"
<el-table-column prop="equipment2" label="网元设备" align="center" /> :cell-class-name="cellClassFn"
<el-table-column prop="state2" label="连接状态" align="center" /> :header-cell-style="{ background: '#EAF1FE', color: '#666666' }"
<el-table-column prop="equipment3" label="网元设备" align="center" /> >
<el-table-column prop="uploadDate" label="上传时间" align="center" /> <el-table-column prop="startPointDeviceName" label="网元设备" align="center" />
<el-table-column prop="startPointConnectStatus_text" label="连接状态" align="center" />
<el-table-column prop="endPointDeviceName" label="网元设备" align="center" />
<el-table-column prop="endPointConnectStatus_text" label="连接状态" align="center" />
<el-table-column prop="lastPointDeviceName" label="网元设备" align="center" />
<el-table-column prop="uploadTime" label="上传时间" align="center" />
</el-table> </el-table>
<pagination <Pagination
:limit="searchForm.pageSize" :limit="params.size"
:page="searchForm.pageNum" :page="params.current"
:total="total" :total="total"
class="pagination" class="pagination"
@pagination="handlePageChange" @pagination="handlePageChange"
...@@ -30,164 +33,59 @@ ...@@ -30,164 +33,59 @@
</template> </template>
<script> <script>
import Pagination from '@/components/Pagination' import { DeviceStatusList, DeviceStatusExport } from './api'
import { ConnectStatusEnum } from '@/const/index'
export default { export default {
components: { Pagination },
data() { data() {
return { return {
searchForm: { ConnectStatusEnum,
pageNum: 1, params: {
pageSize: 10 current: 1,
size: 10
}, },
total: 10, total: 10,
tableData2:[], tableData: [],
tableData: [
{
equipment1: '监控中心LSC',
state1: '连接正常',
equipment2: '现场管理单元 K65+308',
state2: '连接异常',
equipment3: '天馈线A_K4563_535',
uploadDate: '2022/12/18 11:51:12'
},
{
equipment1: '监控中心LSC',
state1: '连接异常',
equipment2: '现场管理单元 K65+308',
state2: '连接正常',
equipment3: '天馈线A_K4563_535',
uploadDate: '2022/12/18 11:51:12'
},{
equipment1: '监控中心LSC',
state1: '连接异常',
equipment2: '现场管理单元 K65+308',
state2: '连接异常',
equipment3: '天馈线A_K4563_535',
uploadDate: '2022/12/18 11:51:12'
},{
equipment1: '监控中心LSC',
state1: '连接正常',
equipment2: '现场管理单元 K65+308',
state2: '连接异常',
equipment3: '天馈线A_K4563_535',
uploadDate: '2022/12/18 11:51:12'
},
{
equipment1: '监控中心LSC',
state1: '连接异常',
equipment2: '现场管理单元 K65+308',
state2: '连接正常',
equipment3: '天馈线A_K4563_535',
uploadDate: '2022/12/18 11:51:12'
},{
equipment1: '监控中心LSC',
state1: '连接异常',
equipment2: '现场管理单元 K65+308',
state2: '连接异常',
equipment3: '天馈线A_K4563_535',
uploadDate: '2022/12/18 11:51:12'
},{
equipment1: '监控中心LSC',
state1: '连接正常',
equipment2: '现场管理单元 K65+308',
state2: '连接异常',
equipment3: '天馈线A_K4563_535',
uploadDate: '2022/12/18 11:51:12'
},
{
equipment1: '监控中心LSC',
state1: '连接异常',
equipment2: '现场管理单元 K65+308',
state2: '连接正常',
equipment3: '天馈线A_K4563_535',
uploadDate: '2022/12/18 11:51:12'
},{
equipment1: '监控中心LSC',
state1: '连接异常',
equipment2: '现场管理单元 K65+308',
state2: '连接异常',
equipment3: '天馈线A_K4563_535',
uploadDate: '2022/12/18 11:51:12'
},{
equipment1: '监控中心LSC',
state1: '连接正常',
equipment2: '现场管理单元 K65+308',
state2: '连接异常',
equipment3: '天馈线A_K4563_535',
uploadDate: '2022/12/18 11:51:12'
},
{
equipment1: '监控中心LSC',
state1: '连接异常',
equipment2: '现场管理单元 K65+308',
state2: '连接正常',
equipment3: '天馈线A_K4563_535',
uploadDate: '2022/12/18 11:51:12'
},{
equipment1: '监控中心LSC',
state1: '连接异常',
equipment2: '现场管理单元 K65+308',
state2: '连接异常',
equipment3: '天馈线A_K4563_535',
uploadDate: '2022/12/18 11:51:12'
},{
equipment1: '监控中心LSC',
state1: '连接正常',
equipment2: '现场管理单元 K65+308',
state2: '连接异常',
equipment3: '天馈线A_K4563_535',
uploadDate: '2022/12/18 11:51:12'
},
{
equipment1: '监控中心LSC',
state1: '连接异常',
equipment2: '现场管理单元 K65+308',
state2: '连接正常',
equipment3: '天馈线A_K4563_535',
uploadDate: '2022/12/18 11:51:12'
},{
equipment1: '监控中心LSC',
state1: '连接异常',
equipment2: '现场管理单元 K65+308',
state2: '连接异常',
equipment3: '天馈线A_K4563_535',
uploadDate: '2022/12/18 11:51:12'
}
],
}; };
}, },
methods: { methods: {
// 表格背景图颜色 // 表格背景图颜色
cellClassFn({row, column, rowIndex, columnIndex}) { cellClassFn({ row, column, rowIndex, columnIndex }) {
if ((row.state1 == '连接正常' && column.property == 'state1')) { if ((row.startPointConnectStatus_text == '连接正常' && column.property == 'startPointConnectStatus_text')) {
return 'green' return 'green'
} }
if ((row.state1 == '连接异常' && column.property == 'state1')) { if ((row.startPointConnectStatus_text == '连接异常' && column.property == 'startPointConnectStatus_text')) {
return 'red' return 'red'
} }
if ((row.state2 == '连接正常' && column.property == 'state2')) { if ((row.endPointConnectStatus_text == '连接正常' && column.property == 'endPointConnectStatus_text')) {
return 'green' return 'green'
} else if ((row.state2 == '连接异常' && column.property == 'state2')) { } else if ((row.endPointConnectStatus_text == '连接异常' && column.property == 'endPointConnectStatus_text')) {
return 'red' return 'red'
} }
if (rowIndex%2 == 1) { if (rowIndex % 2 == 1) {
return 'stripe' return 'stripe'
} }
}, },
handlePageChange(pageData) { handlePageChange(pageData) {
this.searchForm.pageSize = pageData.size; this.params.size = pageData.size;
this.searchForm.pageNum = pageData.page; this.params.current = pageData.page;
this.getTableData() this.getTableData()
},
getTableData() {
this.tableData2 = this.tableData.slice(( this.searchForm.pageNum - 1) * this.searchForm.pageSize,
this.searchForm.pageNum * this.searchForm.pageSize
);
this.total = this.tableData.length
}, },
getTableData() {
DeviceStatusList(this.params).then(res => {
let list = res.records || []
list.forEach(item => {
item.startPointConnectStatus_text = this.ConnectStatusEnum[item.startPointConnectStatus]
item.endPointConnectStatus_text = this.ConnectStatusEnum[item.endPointConnectStatus]
});
this.tableData = list
this.total = res.total
})
}, },
toExport() {
DeviceStatusExport().then(res => {})
}
},
mounted() { mounted() {
this.getTableData() this.getTableData()
}, },
...@@ -206,7 +104,7 @@ export default { ...@@ -206,7 +104,7 @@ export default {
color: #333333; color: #333333;
} }
& ::v-deep .stripe { & ::v-deep .stripe {
background-color: #EAF1FE; background-color: #eaf1fe;
} }
& ::v-deep .red { & ::v-deep .red {
background-color: #f00; background-color: #f00;
...@@ -219,7 +117,7 @@ export default { ...@@ -219,7 +117,7 @@ export default {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
margin: 20px 0; margin: 20px 0;
.pageNum { .current {
margin: 0 20px; margin: 0 20px;
} }
} }
......
This diff is collapsed.
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