|
|
@@ -1,11 +1,102 @@
|
|
|
<template>
|
|
|
<div style="padding: 10px 15px">
|
|
|
<el-card class="box-card">
|
|
|
+ <div style="display: flex; flex-direction: row; justify-content: space-between">
|
|
|
+ <div style="display: flex">
|
|
|
+ <div
|
|
|
+ style="
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ align-items: center;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <div style="font-size: 12px; width: 80px">告警名称:</div>
|
|
|
+ <el-input
|
|
|
+ v-model="searchform.alarmname"
|
|
|
+ placeholder="告警名称"
|
|
|
+ ></el-input>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ style="
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ align-items: center;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <div style="font-size: 12px; width: 80px;text-align: right;margin-right: 15px">告警时间:</div>
|
|
|
+ <el-date-picker type="daterange"></el-date-picker>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <el-button type="primary" plain>重置</el-button>
|
|
|
+ <el-button type="primary">搜索</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+
|
|
|
+ <el-card class="box-card" style="margin-top: 10px">
|
|
|
<template #header>
|
|
|
<div class="card-header">
|
|
|
- <span>东门立柱摄像-详情</span>
|
|
|
+ <span>实时告警</span>
|
|
|
+
|
|
|
</div>
|
|
|
</template>
|
|
|
+ <div>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-table :data="tabledata" border>
|
|
|
+ <el-table-column label="告警名称"></el-table-column>
|
|
|
+ <el-table-column label="告警值"></el-table-column>
|
|
|
+ <el-table-column label="告警设备"></el-table-column>
|
|
|
+ <el-table-column label="告警内容"></el-table-column>
|
|
|
+ <el-table-column label="处理人"></el-table-column>
|
|
|
+ <el-table-column label="处理方式"></el-table-column>
|
|
|
+ <el-table-column label="处理时间"></el-table-column>
|
|
|
+ <el-table-column label="状态"></el-table-column>
|
|
|
+ <el-table-column label="告警时间"></el-table-column>
|
|
|
+ <el-table-column label="操作">
|
|
|
+ <template #default="scope">
|
|
|
+ <div>
|
|
|
+ <el-button link>
|
|
|
+ <el-tooltip effect="dark" content="编辑">
|
|
|
+ <el-icon>
|
|
|
+ <Edit />
|
|
|
+ </el-icon>
|
|
|
+ </el-tooltip>
|
|
|
+ </el-button>
|
|
|
+ <el-popconfirm title="确定删除该标签?">
|
|
|
+ <template #reference>
|
|
|
+ <el-button link
|
|
|
+ ><el-tooltip effect="dark" content="删除"
|
|
|
+ ><el-icon><Delete /></el-icon></el-tooltip
|
|
|
+ ></el-button>
|
|
|
+ </template>
|
|
|
+ </el-popconfirm>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+
|
|
|
+ </el-table>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" style="margin-top: 10px;">
|
|
|
+ <el-pagination style="float: right;"
|
|
|
+ small
|
|
|
+ background
|
|
|
+ layout="prev, pager, next"
|
|
|
+ :total="50"
|
|
|
+ class="mt-4"
|
|
|
+ />
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ </div>
|
|
|
+
|
|
|
|
|
|
</el-card>
|
|
|
|
|
|
@@ -21,6 +112,13 @@ import {useRoute, useRouter} from "vue-router";
|
|
|
const route = useRoute();
|
|
|
const router = useRouter();
|
|
|
|
|
|
+const searchform = ref({
|
|
|
+ alarmname: '',
|
|
|
+ alarmtime:['','']
|
|
|
+});
|
|
|
+
|
|
|
+const tabledata = ref([1])
|
|
|
+
|
|
|
|
|
|
</script>
|
|
|
|
