人员定位告警

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,5 +1,6 @@
<template> <template>
<el-dialog v-model="visible" title="告警信息" width="70%"> <el-dialog v-model="visible" title="报警信息" width="70%">
<table class="print_table">
<el-card> <el-card>
<el-form <el-form
:model="searchForm" :model="searchForm"
@ -75,6 +76,7 @@
<el-table-column property="regName" label="备注" /> <el-table-column property="regName" label="备注" />
</layout-table> </layout-table>
</layout-card> </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%;
} }