wangpeng
/
integrated_traffic_vue
forked from integrated_whb/integrated_whb_vue
1
0
Fork 0
Code Pull Requests Activity

bi页人员定位，ai视频分析完成

pull/1/head
dearlin 2024-01-29 17:35:09 +08:00
parent 7724a93c30
commit aa5c41e8ba
11 changed files with 427 additions and 213 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
src/request/bi/mapApi.js Normal file
View File

@ -0,0 +1,33 @@
import { post } from "@/request/axios.js";
export const getPersonnelTypeCount = (params) =>
post("/map/getPersonnelTypeCount", params); // 人员类型统计
export const getAlarmTypeCount = (params) =>
post("/map/getAlarmTypeCount", params); // 告警类型统计
export const getPersonnelPositioningCount = (params) =>
post("/map/getPersonnelPositioningCount", params); // 人员定位情况
// 八项作业
export const getEightWorkEcharts = (params) =>
post("/map/Eight/getEcharts", params); // 安全作业情况统计
export const getSafetyStatusStatistics = (params) =>
post("/map/Eight/findFormCount", params); // 安全作业状态统计
// 摄像头
export const getCameraAlarmCount = (params) =>
post("/map/getCameraAlarmCount", params); // 摄像头告警数
export const getCameraAlarmTypeCount = (params) =>
post("/map/getCameraAlarmTypeCount", params); // 报警类型
export const getCameraAlarmTimeCount = (params) =>
post("/map/getCameraAlarmTimeCount", params); // 告警时间趋势
export const getCameraAlarmSourceCount = (params) =>
post("/map/getCameraAlarmSourceCount", params); // 告警来源
export const getAiWarningList = (params) =>
post(
"/aiwarning/list?currentPage=" +
params.currentPage +
"&showCount=" +
params.showCount,
params
); // ai报警列表
export const getCameraTopToShow = (params) =>
post("/map/getCameraTopToShow", params); // bi页播放摄像头信息

2
src/request/video_manager.js
View File

@ -9,5 +9,7 @@ export const getVideoManagerView = (params) =>
post("/videomanager/goEdit", params); // 台账添加 post("/videomanager/goEdit", params); // 台账添加
export const setVideoManagerDelete = (params) => export const setVideoManagerDelete = (params) =>
post("/videomanager/delete", params); // 删除 post("/videomanager/delete", params); // 删除
export const setUpToBi = (params) =>
post("/videomanager/editZhiding", params); // 删除
export const setVideoManagerEdit = (params) => export const setVideoManagerEdit = (params) =>
post("/videomanager/edit", params); post("/videomanager/edit", params);

252
src/views/BI/components/personnel.vue
View File

@ -5,7 +5,7 @@
<div class="option"> <div class="option">
<div <div
class="list" class="list"
v-for="(item, index) in block1OptionsList" v-for="(item, index) in data.block1OptionsList"
:key="index" :key="index"
> >
<img :src="item.img" alt="" class="img" /> <img :src="item.img" alt="" class="img" />
@ -21,12 +21,12 @@
<div class="option"> <div class="option">
<div <div
class="list" class="list"
v-for="(item, index) in block2OptionsList" v-for="(item, index) in data.block2OptionsList"
:key="index" :key="index"
> >
<div class="name">{{ item.label }}</div> <div class="name">{{ item.label }}</div>
<div class="num"> <div class="num">
<count-up :end-val="item.count"></count-up> <count-up :end-val="item.total"></count-up>
</div> </div>
</div> </div>
</div> </div>
@ -34,27 +34,16 @@
<div class="block3"> <div class="block3">
<layout-title title="人员定位情况" /> <layout-title title="人员定位情况" />
<div class="option"> <div class="option">
<div class="tab_list">
<div
class="list"
v-for="(item, index) in tabsList"
:class="['item', { active: index === tabIndex }]"
:key="index"
@click="tabIndex = index"
>
{{ item }}
</div>
</div>
<div class="table"> <div class="table">
<div class="tr"> <div class="tr">
<div class="td">姓名</div> <div class="td">姓名</div>
<div class="td">职务</div> <div class="td">卡号</div>
<div class="td">电量</div> <div class="td">电量</div>
</div> </div>
<div class="tr" v-for="(item, index) in block3List" :key="index"> <div class="tr" v-for="(item, index) in data.block3List" :key="index">
<div class="td">{{ item.name }}</div> <div class="td">{{ item.name }}</div>
<div class="td">{{ item.Office }}</div> <div class="td">{{ item.cardNo }}</div>
<div class="td">{{ item.electricity }}</div> <div class="td">{{ item.stset + "%" }}</div>
</div> </div>
</div> </div>
</div> </div>
@ -64,107 +53,134 @@
<script setup> <script setup>
import LayoutTitle from "./title.vue"; import LayoutTitle from "./title.vue";
import CountUp from "vue-countup-v3"; import CountUp from "vue-countup-v3";
import { ref } from "vue"; import { nextTick, reactive } from "vue";
import {
getPersonnelTypeCount,
getAlarmTypeCount,
getPersonnelPositioningCount,
} from "@/request/bi/mapApi.js";
const block1OptionsList = [ const data = reactive({
{ block1OptionsList: [
img: new URL("/src/assets/images/map/img1.png", import.meta.url).href, {
label: "人员", img: new URL("/src/assets/images/map/img1.png", import.meta.url).href,
count: 3500, label: "全部人员",
}, count: 3500,
{ },
img: new URL("/src/assets/images/map/img2.png", import.meta.url).href, ],
label: "相关方人员", block2OptionsList: [
count: 3500, {
}, label: "滞留报警",
{ count: 3500,
img: new URL("/src/assets/images/map/img3.png", import.meta.url).href, },
label: "外来人员", {
count: 3500, label: "越界报警",
}, count: 235,
]; },
const block2OptionsList = [ {
{ label: "超员报警",
label: "滞留报警", count: 569,
count: 3500, },
}, {
{ label: "缺员报警",
label: "越界报警", count: 569,
count: 235, },
}, {
{ label: "静止报警",
label: "超员报警", count: 423,
count: 569, },
}, {
{ label: "串岗报警",
label: "缺员报警", count: 789,
count: 569, },
}, {
{ label: "一键告警",
label: "静止报警", count: 236,
count: 423, },
}, {
{ label: "聚集告警",
label: "串岗报警", count: 214,
count: 789, },
}, {
{ label: "作业告警",
label: "一键告警", count: 852,
count: 236, },
}, ],
{ block3List: [
label: "聚集告警", {
count: 214, name: "赵一诺",
}, Office: "大堂经理",
{ electricity: "30%",
label: "作业告警", },
count: 852, {
}, name: "赵一诺",
]; Office: "大堂经理",
const block3List = [ electricity: "30%",
{ },
name: "赵一诺", {
Office: "大堂经理", name: "赵一诺",
electricity: "30%", Office: "大堂经理",
}, electricity: "30%",
{ },
name: "赵一诺", {
Office: "大堂经理", name: "赵一诺",
electricity: "30%", Office: "大堂经理",
}, electricity: "30%",
{ },
name: "赵一诺", {
Office: "大堂经理", name: "赵一诺",
electricity: "30%", Office: "大堂经理",
}, electricity: "30%",
{ },
name: "赵一诺", {
Office: "大堂经理", name: "赵一诺",
electricity: "30%", Office: "大堂经理",
}, electricity: "30%",
{ },
name: "赵一诺", {
Office: "大堂经理", name: "赵一诺",
electricity: "30%", Office: "大堂经理",
}, electricity: "30%",
{ },
name: "赵一诺", {
Office: "大堂经理", name: "赵一诺",
electricity: "30%", Office: "大堂经理",
}, electricity: "30%",
{ },
name: "赵一诺", ],
Office: "大堂经理", });
electricity: "30%", const getPersonnelData = async () => {
}, const resData = await getPersonnelTypeCount();
{ await nextTick(() => {
name: "赵一诺", data.block1OptionsList.forEach((item) => {
Office: "大堂经理", item.count = resData.userCount;
electricity: "30%", });
}, });
]; };
const tabsList = ["人员", "相关方人员", "外来人员"]; const getAlarmTypeData = async () => {
const tabIndex = ref(0); const resData = await getAlarmTypeCount();
const dataList = resData.data.data.data;
// (1=滞留报警,2=串岗报警,3=超员报警,4=缺员报警,5=静止报警,6=一键报警,7=越界报警,8=聚集告警 )
dataList.forEach((item) => {
if (item.type === "1") item.label = "滞留报警";
if (item.type === "2") item.label = "串岗报警";
if (item.type === "3") item.label = "超员报警";
if (item.type === "4") item.label = "缺员报警";
if (item.type === "5") item.label = "静止报警";
if (item.type === "6") item.label = "一键报警";
if (item.type === "7") item.label = "越界报警";
if (item.type === "8") item.label = "聚集告警";
});
data.block2OptionsList = dataList;
};
const getPositionData = async () => {
const resData = await getPersonnelPositioningCount();
console.log(resData.data.rows);
data.block3List = resData.data.rows;
};
getPersonnelData();
getAlarmTypeData();
getPositionData();
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.container { .container {

54
src/views/BI/components/video_ai_analysis.vue
View File

@ -50,6 +50,11 @@ import CountUp from "vue-countup-v3";
import { onMounted, reactive } from "vue"; import { onMounted, reactive } from "vue";
import echarts1 from "../js/echarts1.js"; import echarts1 from "../js/echarts1.js";
import echarts2 from "../js/echarts2.js"; import echarts2 from "../js/echarts2.js";
import {
getCameraAlarmCount,
getCameraAlarmTimeCount,
getCameraAlarmTypeCount,
} from "@/request/bi/mapApi.js";
const data = reactive({ const data = reactive({
block1OptionsList: [ block1OptionsList: [
@ -87,9 +92,54 @@ const data = reactive({
}, },
], ],
}); });
const getCameraAlarmData = async () => {
const resData = await getCameraAlarmCount();
let allAlarm = 0;
let disposed = 0;
resData.CameraAlarmCount.forEach((item) => {
allAlarm += item.count;
if (item.type === 3) {
disposed = item.count;
}
data.block1OptionsList[0].count = allAlarm;
data.block1OptionsList[1].count = allAlarm - disposed;
data.block1OptionsList[2].count = disposed;
});
};
const getCameraAlarmTimeData = async () => {
const resData = await getCameraAlarmTimeCount();
echarts2(
"main2",
resData.varList.monthStrList,
resData.varList.accumulatedList,
resData.varList.monthList
);
};
const getCameraAlarmTypeData = async () => {
const resData = await getCameraAlarmTypeCount();
const leg = [];
const cont = [];
resData.varList.forEach((item) => {
leg.push(item.TYPE);
cont.push(item.PERCENTAGE);
});
echarts1("main1", leg, cont);
};
getCameraAlarmData();
getCameraAlarmTimeData();
getCameraAlarmTypeData();
onMounted(() => { onMounted(() => {
echarts1("main1"); echarts1(
echarts2("main2"); "main1",
["烟雾", "水电", "烟雾", "烟雾", "烟雾"],
[12.2, 15, 11, 8, 16]
);
echarts2(
"main2",
["1月", "2月", "3月", "4月", "5月", "6月", "7月"],
[393, 831, 933, 1200, 1386, 1721, 2027],
[393, 438, 102, 267, 186, 315, 316]
);
}); });
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">

190
src/views/BI/components/video_ai_analysisRight.vue
View File

@ -1,89 +1,132 @@
<template> <template>
<div class="container"> <div class="container">
<div class="block1"> <div class="block1">
<div class="video"> <div v-if="data.videoSrc" class="video">
<img src="/src/assets/images/map/img16.png" alt="" /> <iframe
:src="data.videoSrc.VIDEOURL"
style="width: 100%; height: 100%"
/>
<!-- <img src="/src/assets/images/map/img16.png" alt="" />-->
</div> </div>
</div> </div>
<div class="block2"> <div class="block2">
<layout-title title="实时告警监控" /> <layout-title title="实时告警监控" />
<div class="options"> <div class="options">
<div <div
class="option mb-10" v-infinite-scroll="load"
v-for="(item, index) in data.block1OptionsList" :infinite-scroll-disabled="disabled"
:key="index" class="scroll"
> >
<div class="img"> <div
<img :src="item.img" alt="" /> class="option mb-10"
</div> v-for="(item, index) in data.block1OptionsList"
<div class="info" :class="item.type === 1 ? '' : 'bg_blue'"> :key="index"
<div class="title"> >
<div class="tit">{{ item.title }}</div> <div class="img">
<div class="ico"> <img :src="VITE_FILE_URL + item.IMG_PATH" alt="" />
<img :src="item.type === 1 ? item.img1 : item.img2" alt="" /> </div>
</div> <div class="info" :class="item.ISTRUE === 3 ? '' : 'bg_blue'">
<div class="title">
<div class="tit">{{ item.TYPE }}</div>
<div class="ico">
<img
:src="item.ISTRUE === 3 ? data.img1 : data.img2"
alt=""
/>
</div>
</div>
<div class="time">{{ item.WARNING_TIME }}</div>
<div class="text">{{ "摄像头名称" + item.VIDEONAME }}</div>
<div class="text">{{ "摄像头编号" + item.CODE }}</div>
</div> </div>
<div class="time">{{ item.time }}</div>
<div class="text">{{ item.text }}</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script setup> <script setup>
import LayoutTitle from "./title.vue"; import LayoutTitle from "./title.vue";
import { reactive } from "vue"; import { reactive, computed } from "vue";
import { getAiWarningList, getCameraTopToShow } from "@/request/bi/mapApi.js";
const VITE_FILE_URL = import.meta.env.VITE_FILE_URL;
const data = reactive({ const data = reactive({
img1: new URL("/src/assets/images/map/img17.png", import.meta.url).href,
img2: new URL("/src/assets/images/map/img18.png", import.meta.url).href,
videoSrc: {},
loading: false,
currentPage: 1,
totalPage: 1,
block1OptionsList: [ block1OptionsList: [
{ // {
img: new URL("/src/assets/images/map/img16.png", import.meta.url).href, // img: new URL("/src/assets/images/map/img16.png", import.meta.url).href,
img1: new URL("/src/assets/images/map/img17.png", import.meta.url).href, // title: "未戴安全帽",
img2: new URL("/src/assets/images/map/img18.png", import.meta.url).href, // time: "2023-08-09 15:14:23",
title: "未戴安全帽", // text: "告警源：油品库包装裤袋",
time: "2023-08-09 15:14:23", // type: 1,
text: "告警源：油品库包装裤袋", // },
type: 1, // {
}, // img: new URL("/src/assets/images/map/img16.png", import.meta.url).href,
{ // title: "未戴安全帽",
img: new URL("/src/assets/images/map/img16.png", import.meta.url).href, // time: "2023-08-09 15:14:23",
img1: new URL("/src/assets/images/map/img17.png", import.meta.url).href, // text: "告警源：油品库包装裤袋",
img2: new URL("/src/assets/images/map/img18.png", import.meta.url).href, // type: 1,
title: "未戴安全帽", // },
time: "2023-08-09 15:14:23", // {
text: "告警源：油品库包装裤袋", // img: new URL("/src/assets/images/map/img16.png", import.meta.url).href,
type: 1, // title: "未戴安全帽",
}, // time: "2023-08-09 15:14:23",
{ // text: "告警源：油品库包装裤袋",
img: new URL("/src/assets/images/map/img16.png", import.meta.url).href, // type: 1,
img1: new URL("/src/assets/images/map/img17.png", import.meta.url).href, // },
img2: new URL("/src/assets/images/map/img18.png", import.meta.url).href, // {
title: "未戴安全帽", // img: new URL("/src/assets/images/map/img16.png", import.meta.url).href,
time: "2023-08-09 15:14:23", // title: "未戴安全帽",
text: "告警源：油品库包装裤袋", // time: "2023-08-09 15:14:23",
type: 1, // text: "告警源：油品库包装裤袋",
}, // type: 1,
{ // },
img: new URL("/src/assets/images/map/img16.png", import.meta.url).href, // {
img1: new URL("/src/assets/images/map/img17.png", import.meta.url).href, // img: new URL("/src/assets/images/map/img16.png", import.meta.url).href,
img2: new URL("/src/assets/images/map/img18.png", import.meta.url).href, // title: "未戴安全帽",
title: "未戴安全帽", // time: "2023-08-09 15:14:23",
time: "2023-08-09 15:14:23", // text: "告警源：油品库包装裤袋",
text: "告警源：油品库包装裤袋", // type: 2,
type: 1, // },
},
{
img: new URL("/src/assets/images/map/img16.png", import.meta.url).href,
img1: new URL("/src/assets/images/map/img17.png", import.meta.url).href,
img2: new URL("/src/assets/images/map/img18.png", import.meta.url).href,
title: "未戴安全帽",
time: "2023-08-09 15:14:23",
text: "告警源：油品库包装裤袋",
type: 2,
},
], ],
}); });
const getAiWarningData = async () => {
const resData = await getAiWarningList({
currentPage: data.currentPage,
showCount: 10,
});
resData.varList.forEach((item) => {
data.block1OptionsList.push(item);
});
data.totalPage = resData.page.totalPage;
data.loading = false;
};
const getCameraTopToShowData = async () => {
const resData = await getCameraTopToShow();
data.videoSrc = resData.pd;
};
// 无限滚动
const disabled = computed(() => {
return noMore.value;
});
const load = () => {
data.loading = true;
data.currentPage += 1;
getAiWarningData();
};
const noMore = computed(() => {
return data.currentPage >= data.totalPage;
});
getAiWarningData();
getCameraTopToShowData();
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.container { .container {
@ -129,7 +172,30 @@ const data = reactive({
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding: 10px; padding: 10px;
.scroll {
max-height: 600px;
overflow-y: auto;
&::-webkit-scrollbar {
width: 5px;
}
&::-webkit-scrollbar-thumb {
border-radius: 5px;
background: rgba(2, 30, 81, 0.851);
}
&::-webkit-scrollbar-track {
border-radius: 5px;
background: rgba(255, 255, 255, 0.1);
}
.tr {
&:nth-child(odd) {
background-color: transparent;
}
}
}
.option { .option {
width: 100%; width: 100%;
display: flex; display: flex;

7
src/views/BI/components/work_safely.vue
View File

@ -47,7 +47,7 @@ import LayoutTitle from "./title.vue";
import CountUp from "vue-countup-v3"; import CountUp from "vue-countup-v3";
import { onMounted, reactive } from "vue"; import { onMounted, reactive } from "vue";
import echarts5 from "../js/echarts5.js"; import echarts5 from "../js/echarts5.js";
// import { getSafetyStatusStatistics } from "@/request/bi/mapApi.js";
const data = reactive({ const data = reactive({
block1OptionsList: [ block1OptionsList: [
{ {
@ -132,6 +132,11 @@ const data = reactive({
onMounted(() => { onMounted(() => {
echarts5("main1"); echarts5("main1");
}); });
// const getSafetyStatusData = async () => {
// const resData = await getSafetyStatusStatistics();
// console.log(resData);
// };
// getSafetyStatusData();
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.container { .container {

12
src/views/BI/js/echarts1.js
View File

@ -1,7 +1,7 @@
import * as echarts from "echarts"; import * as echarts from "echarts";
import { tryOnMounted, tryOnUnmounted } from "@vueuse/core"; import { tryOnMounted, tryOnUnmounted } from "@vueuse/core";
let myChart1; let myChart1;
function echarts1(id) { function echarts1(id, legend, echartCount) {
myChart1 = echarts.init(document.querySelector(`#${id}`)); myChart1 = echarts.init(document.querySelector(`#${id}`));
function xWrapText(params, num = 2) { function xWrapText(params, num = 2) {
let newParamsName = ""; let newParamsName = "";
@ -25,8 +25,8 @@ function echarts1(id) {
} }
return newParamsName; return newParamsName;
} }
const legend = ["烟雾", "水电", "烟雾", "烟雾", "烟雾"]; // const legend = ["烟雾", "水电", "烟雾", "烟雾", "烟雾"];
const echartCount = [12, 15, 11, 8, 16]; // const echartCount = [12, 15, 11, 8, 16];
const option = { const option = {
backgroundColor: "", backgroundColor: "",
grid: { grid: {
@ -62,8 +62,10 @@ function echarts1(id) {
fontSize: 10, fontSize: 10,
}, },
formatter(params) { formatter(params) {
const res = xWrapText(params, 6); // const res = xWrapText(params, 6);
return params.length > 15 ? `${res.slice(0, 15)}...` : res; xWrapText(params, 6);
// return params.length > 15 ? `${res.slice(0, 15)}...` : res;
return "";
}, },
}, },
axisTick: { axisTick: {

16
src/views/BI/js/echarts2.js
View File

@ -1,7 +1,7 @@
import * as echarts from "echarts"; import * as echarts from "echarts";
import { tryOnMounted, tryOnUnmounted } from "@vueuse/core"; import { tryOnMounted, tryOnUnmounted } from "@vueuse/core";
let myChart2; let myChart2;
function echarts2(id) { function echarts2(id, month, accumulated, currentMonth) {
myChart2 = echarts.init(document.querySelector(`#${id}`)); myChart2 = echarts.init(document.querySelector(`#${id}`));
const option = { const option = {
backgroundColor: "", backgroundColor: "",
@ -15,7 +15,7 @@ function echarts2(id) {
}, },
legend: { legend: {
icon: "circle", icon: "circle",
data: ["累计推荐", "本月推荐"], data: ["累计趋势", "当月趋势"],
textStyle: { textStyle: {
color: "#999999", color: "#999999",
borderColor: "#fff", borderColor: "#fff",
@ -38,11 +38,13 @@ function echarts2(id) {
color: "#d1e6eb", color: "#d1e6eb",
margin: 15, margin: 15,
}, },
interval: 0,
rotate: 30,
}, },
axisTick: { axisTick: {
show: false, show: false,
}, },
data: ["1月", "2月", "3月", "4月", "5月", "6月", "7月"], data: month,
}, },
], ],
yAxis: [ yAxis: [
@ -73,7 +75,7 @@ function echarts2(id) {
], ],
series: [ series: [
{ {
name: "累计推荐", name: "累计趋势",
type: "line", type: "line",
symbol: "circle", // 默认是空心圆（中间是白色的），改成实心圆 symbol: "circle", // 默认是空心圆（中间是白色的），改成实心圆
showAllSymbol: true, showAllSymbol: true,
@ -111,10 +113,10 @@ function echarts2(id) {
shadowColor: "rgba(53,142,215, 0.9)", // 阴影颜色 shadowColor: "rgba(53,142,215, 0.9)", // 阴影颜色
shadowBlur: 20, // shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。 shadowBlur: 20, // shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
}, },
data: [393, 438, 485, 631, 689, 824, 987], data: accumulated,
}, },
{ {
name: "本月推荐", name: "当月趋势",
type: "bar", type: "bar",
barWidth: 20, barWidth: 20,
tooltip: { tooltip: {
@ -123,7 +125,7 @@ function echarts2(id) {
itemStyle: { itemStyle: {
color: "#1492FF", color: "#1492FF",
}, },
data: [200, 382, 102, 267, 186, 315, 316], data: currentMonth,
}, },
], ],
}; };

10
src/views/video_manager/ai_warning/components/add.vue
View File

@ -1,9 +1,5 @@
<template> <template>
<el-dialog <el-dialog v-model="visible" :before-close="fnClose">
v-model="visible"
:title="type === 'edit' ? '审核' : '新增'"
:before-close="fnClose"
>
<el-form ref="formRef" :rules="rules" :model="form" label-width="150px"> <el-form ref="formRef" :rules="rules" :model="form" label-width="150px">
<el-form-item label="监控设备名称" prop="VIDEONAME"> <el-form-item label="监控设备名称" prop="VIDEONAME">
<el-input v-model="form.VIDEONAME" disabled /> <el-input v-model="form.VIDEONAME" disabled />
@ -105,10 +101,6 @@ const options = [
value: 2, value: 2,
label: "否", label: "否",
}, },
{
value: 3,
label: "请选择",
},
]; ];
const data = reactive({ const data = reactive({
videoDialog: { videoDialog: {

38
src/views/video_manager/ai_warning/index.vue
View File

@ -3,18 +3,30 @@
<el-card> <el-card>
<el-form <el-form
:model="searchForm" :model="searchForm"
label-width="50px" label-width="120px"
@submit.prevent="fnResetPagination" @submit.prevent="fnResetPagination"
> >
<el-row> <el-row>
<el-col :span="6"> <el-col :span="6">
<el-form-item prop="KEYWORDS"> <el-form-item label="请输入关键字" prop="KEYWORDS">
<el-input <el-input
v-model="searchForm.KEYWORDS" v-model="searchForm.KEYWORDS"
placeholder="请输入关键字" placeholder="请输入关键字"
/> />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="6">
<el-form-item label="请选择是否审核" prop="ISTRUE">
<el-select v-model="searchForm.ISTRUE" placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label-width="10px"> <el-form-item label-width="10px">
<el-button type="primary" native-type="submit">搜索</el-button> <el-button type="primary" native-type="submit">搜索</el-button>
@ -61,13 +73,12 @@
<el-table-column label="操作" width="250"> <el-table-column label="操作" width="250">
<template v-slot="{ row }"> <template v-slot="{ row }">
<el-button <el-button
v-if="row.ISTRUE === 3"
type="primary" type="primary"
text text
link link
@click="fnAddOrEdit(row.AIWARNING_ID, 'edit')" @click="fnAddOrEdit(row.AIWARNING_ID, 'edit')"
> >
审核 {{ row.ISTRUE === 3 ? "审核" : "编辑" }}
</el-button> </el-button>
<el-button type="primary" text link @click="fnDeleteAiWarning(row)"> <el-button type="primary" text link @click="fnDeleteAiWarning(row)">
删除 删除
@ -87,10 +98,6 @@
:type="data.addDialog.type" :type="data.addDialog.type"
@get-data="fnResetPagination" @get-data="fnResetPagination"
/> />
<video-view
v-model:visible="data.videoDialog.visible"
:src="data.videoDialog.src"
/>
</div> </div>
</template> </template>
@ -108,6 +115,20 @@ import Add from "./components/add.vue";
import { nextTick, reactive } from "vue"; import { nextTick, reactive } from "vue";
import { ElMessage, ElMessageBox } from "element-plus"; import { ElMessage, ElMessageBox } from "element-plus";
import { debounce } from "throttle-debounce"; import { debounce } from "throttle-debounce";
const options = [
{
value: 1,
label: "真实报警",
},
{
value: 2,
label: "忽略报警",
},
{
value: 3,
label: "未审核",
},
];
const data = reactive({ const data = reactive({
addDialog: { addDialog: {
@ -166,6 +187,7 @@ const fnAddOrEdit = async (AIWARNING_ID, type) => {
data.addDialog.type = type; data.addDialog.type = type;
if (type === "edit") { if (type === "edit") {
const resData = await getAiWarningView({ AIWARNING_ID }); const resData = await getAiWarningView({ AIWARNING_ID });
if (resData.pd.ISTRUE === 3) resData.pd.ISTRUE = 1;
data.addDialog.form = resData.pd; data.addDialog.form = resData.pd;
} }
}; };

26
src/views/video_manager/video_manager/index.vue
View File

@ -41,6 +41,15 @@
<el-table-column prop="CODE" label="监控设备编码" /> <el-table-column prop="CODE" label="监控设备编码" />
<el-table-column label="操作" width="250"> <el-table-column label="操作" width="250">
<template v-slot="{ row }"> <template v-slot="{ row }">
<el-button
v-if="row.ISSHOW === 0"
type="primary"
text
link
@click="fnUpToBi(row.VIDEOMANAGER_ID)"
>
置顶
</el-button>
<el-button <el-button
type="primary" type="primary"
text text
@ -87,11 +96,12 @@ import useListData from "@/assets/js/useListData.js";
import { import {
getVideoManagerList, getVideoManagerList,
getVideoManagerView, getVideoManagerView,
setUpToBi,
setVideoManagerDelete, setVideoManagerDelete,
} from "@/request/video_manager.js"; } from "@/request/video_manager.js";
import Add from "./components/add.vue"; import Add from "./components/add.vue";
import { nextTick, reactive } from "vue"; import { nextTick, reactive } from "vue";
import { ElMessageBox } from "element-plus"; import { ElMessage, ElMessageBox } from "element-plus";
import VideoView from "./components/video.vue"; import VideoView from "./components/video.vue";
import { setVideoManagerList } from "@/request/eightwork_videomanager.js"; import { setVideoManagerList } from "@/request/eightwork_videomanager.js";
@ -126,6 +136,7 @@ const fnDeleteVideo = async (row) => {
await setVideoManagerDelete({ await setVideoManagerDelete({
VIDEOMANAGER_ID: row.VIDEOMANAGER_ID, VIDEOMANAGER_ID: row.VIDEOMANAGER_ID,
}); });
await ElMessage.success("操作成功");
fnResetPagination(); fnResetPagination();
} }
}; };
@ -138,6 +149,19 @@ const fnAddOrEdit = async (VIDEOMANAGER_ID, type) => {
data.addDialog.form = resData.pd; data.addDialog.form = resData.pd;
} }
}; };
const fnUpToBi = async (VIDEOMANAGER_ID) => {
await ElMessageBox.confirm("确定要置顶吗？置顶后将会默认展示在Bi页", {
type: "warning",
});
await setUpToBi({
VIDEOMANAGER_ID,
});
ElMessage({
message: "操作成功",
type: "success",
});
fnResetPagination();
};
const fnPreviewVideo = (VIDEOURL) => { const fnPreviewVideo = (VIDEOURL) => {
data.videoDialog.visible = true; data.videoDialog.visible = true;
data.videoDialog.src = VIDEOURL; data.videoDialog.src = VIDEOURL;