人员定位告警

pull/1/head
dearlin 2024-02-21 10:16:35 +08:00
parent e0450b2e11
commit 0b5ab067fd
2 changed files with 106 additions and 89 deletions

View File

@ -1,80 +1,82 @@
<template> <template>
<el-dialog v-model="visible" title="告警信息" width="70%"> <el-dialog v-model="visible" title="报警信息" width="70%">
<el-card> <table class="print_table">
<el-form <el-card>
:model="searchForm" <el-form
label-width="100px" :model="searchForm"
@submit.prevent="fnResetPagination" label-width="100px"
> @submit.prevent="fnResetPagination"
<el-row> >
<el-col :span="6"> <el-row>
<el-form-item label="报警类型" prop="eleType" label-width="80px"> <el-col :span="6">
<el-select v-model="searchForm.eleType"> <el-form-item label="报警类型" prop="eleType" label-width="80px">
<el-option <el-select v-model="searchForm.eleType">
v-for="item in eleType" <el-option
:key="item.value" v-for="item in eleType"
:label="item.label" :key="item.value"
:value="item.value" :label="item.label"
/> :value="item.value"
</el-select> />
</el-form-item> </el-select>
</el-col> </el-form-item>
<el-col :span="6"> </el-col>
<el-form-item label="处理状态" prop="status" label-width="80px"> <el-col :span="6">
<el-select v-model="searchForm.status"> <el-form-item label="处理状态" prop="status" label-width="80px">
<el-option <el-select v-model="searchForm.status">
v-for="item in statusList" <el-option
:key="item.value" v-for="item in statusList"
:label="item.label" :key="item.value"
:value="item.value" :label="item.label"
/> :value="item.value"
</el-select> />
</el-form-item> </el-select>
</el-col> </el-form-item>
<el-col :span="6"> </el-col>
<el-form-item label-width="30px"> <el-col :span="6">
<el-button type="primary" native-type="submit">搜索</el-button> <el-form-item label-width="30px">
<el-button native-type="reset" @click="fnResetPagination"> <el-button type="primary" native-type="submit">搜索</el-button>
重置 <el-button native-type="reset" @click="fnResetPagination">
</el-button> 重置
</el-form-item> </el-button>
</el-col> </el-form-item>
</el-row> </el-col>
</el-form> </el-row>
</el-card> </el-form>
<layout-card> </el-card>
<layout-table <layout-card>
ref="tableRef" <layout-table
v-model:pagination="pagination" ref="tableRef"
:data="list" v-model:pagination="pagination"
@get-data="fnGetData" :data="list"
> @get-data="fnGetData"
<el-table-column reserve-selection type="selection" width="55" /> >
<el-table-column label="序号" width="70"> <el-table-column reserve-selection type="selection" width="55" />
<template #default="{ $index }"> <el-table-column label="序号" width="70">
{{ serialNumber(pagination, $index) }} <template #default="{ $index }">
</template> {{ serialNumber(pagination, $index) }}
</el-table-column> </template>
<el-table-column property="status" label="状态"> </el-table-column>
<template #default="{ row }"> <el-table-column property="status" label="状态">
{{ row.status === 0 ? "未处理" : "已处理" }} <template #default="{ row }">
</template> {{ row.status === 0 ? "未处理" : "已处理" }}
</el-table-column> </template>
<el-table-column property="eleType" label="告警类型"> </el-table-column>
<template #default="{ row }"> <el-table-column property="eleType" label="告警类型">
{{ typeList[row.eleType] }} <template #default="{ row }">
</template> {{ typeList[row.eleType] }}
</el-table-column> </template>
<el-table-column property="eleName" label="告警名称" /> </el-table-column>
<el-table-column property="name" label="触发人员" /> <el-table-column property="eleName" label="告警名称" />
<el-table-column property="layerGroup" label="触发地点" /> <el-table-column property="name" label="触发人员" />
<el-table-column property="alarmTime" label="触发时间" /> <el-table-column property="layerGroup" label="触发地点" />
<el-table-column property="disposeTime" label="处理时间" /> <el-table-column property="alarmTime" label="触发时间" />
<el-table-column property="disposeStr" label="处理方式" /> <el-table-column property="disposeTime" label="处理时间" />
<el-table-column property="disposeBy" label="处理人" /> <el-table-column property="disposeStr" label="处理方式" />
<el-table-column property="regName" label="备注" /> <el-table-column property="disposeBy" label="处理人" />
</layout-table> <el-table-column property="regName" label="备注" />
</layout-card> </layout-table>
</layout-card>
</table>
<template #footer> <template #footer>
<el-button @click="fnClose"></el-button> <el-button @click="fnClose"></el-button>
</template> </template>
@ -86,7 +88,6 @@ import { useVModels } from "@vueuse/core";
import useListData from "@/assets/js/useListData.js"; import useListData from "@/assets/js/useListData.js";
import { getAlArmDataList } from "@/request/bi/mapApi.js"; import { getAlArmDataList } from "@/request/bi/mapApi.js";
import { serialNumber } from "@/assets/js/utils.js"; import { serialNumber } from "@/assets/js/utils.js";
const typeList = { const typeList = {
1: "滞留报警", 1: "滞留报警",
2: "串岗报警", 2: "串岗报警",
@ -97,20 +98,29 @@ const typeList = {
7: "越界报警", 7: "越界报警",
8: "聚集告警", 8: "聚集告警",
}; };
const { list, pagination, searchForm, fnGetData, fnResetPagination, tableRef } =
useListData(getAlArmDataList);
const props = defineProps({ const props = defineProps({
visible: { visible: {
type: Boolean, type: Boolean,
required: true, required: true,
default: false, default: false,
}, },
eleTypeNum: {
type: Number,
required: true,
},
pd: { pd: {
type: Object, type: Object,
required: false, required: false,
default: () => ({}), default: () => ({}),
}, },
}); });
const { list, pagination, searchForm, fnGetData, fnResetPagination, tableRef } =
useListData(getAlArmDataList, {
defaultSearchForm: {
eleType: props.eleTypeNum,
status: 0,
},
});
const statusList = [ const statusList = [
{ {
label: "未处理", label: "未处理",
@ -136,4 +146,11 @@ const fnClose = () => {
}; };
</script> </script>
<style lang="scss" scoped></style> <style lang="scss" scoped>
.video {
width: 100%;
height: 500px;
border: 2px solid #11acd7;
border-radius: 4px;
}
</style>

View File

@ -50,7 +50,12 @@
</div> </div>
</div> </div>
</div> </div>
<alarm-dialog v-model:visible="data.drawer" :pd="data.form" /> <alarm-dialog
v-if="data.drawer"
v-model:visible="data.drawer"
v-model:pd="data.form"
:ele-type-num="+data.eleType"
/>
</div> </div>
</template> </template>
<script setup> <script setup>
@ -63,7 +68,6 @@ import {
getAlarmTypeCount, getAlarmTypeCount,
getPersonnelPositioningCount, getPersonnelPositioningCount,
} from "@/request/bi/mapApi.js"; } from "@/request/bi/mapApi.js";
const data = reactive({ const data = reactive({
block1OptionsList: [ block1OptionsList: [
{ {
@ -72,6 +76,7 @@ const data = reactive({
count: 0, count: 0,
}, },
], ],
eleType: 0,
block2OptionsList: [ block2OptionsList: [
{ {
label: "滞留报警", label: "滞留报警",
@ -166,7 +171,7 @@ const getPersonnelData = async () => {
const fnAlarmTypeClick = (e) => { const fnAlarmTypeClick = (e) => {
data.drawer = true; data.drawer = true;
data.form.title = e.label; data.form.title = e.label;
data.form.type = e.type; data.eleType = e.type;
}; };
const getAlarmTypeData = async () => { const getAlarmTypeData = async () => {
const resData = await getAlarmTypeCount(); const resData = await getAlarmTypeCount();
@ -288,6 +293,7 @@ getPositionData();
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
padding: 10px; padding: 10px;
cursor: pointer;
} }
} }
} }
@ -340,32 +346,26 @@ getPositionData();
} }
} }
} }
.table { .table {
margin-top: 5px; margin-top: 5px;
.tr { .tr {
display: flex; display: flex;
&:nth-child(odd) { &:nth-child(odd) {
background-color: rgba(42, 86, 158, 0.53); background-color: rgba(42, 86, 158, 0.53);
} }
.td { .td {
flex: 1; flex: 1;
text-align: left; text-align: left;
font-size: 14px; font-size: 14px;
color: #fff; color: #fff;
padding: 10px 10px; padding: 10px 10px;
&:nth-child(1) { &:nth-child(1) {
flex-basis: 30%; flex-basis: 30%;
} }
&:nth-child(2) { &:nth-child(2) {
flex-basis: 50%; flex-basis: 50%;
} }
&:nth-child(3) { &:nth-child(3) {
flex-basis: 20%; flex-basis: 20%;
} }