|
@@ -13,7 +13,7 @@
|
|
|
</div>
|
|
|
<div class="alarm-content" style="background: #0F152B">
|
|
|
<chart-pie v-if="alarmPie.length > 0" :data="alarmPie"></chart-pie>
|
|
|
- <div style="line-height: 200px; font-size: 22px; color: white">暂无数据</div>
|
|
|
+ <div v-else style="line-height: 200px; font-size: 22px; color: white">暂无数据</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="alarm-divide" v-loading="listLoading"
|
|
@@ -180,7 +180,7 @@
|
|
|
<img :src="item.recordImage" width="100%" alt="">
|
|
|
</div>
|
|
|
<div class="case-right" style="text-align: left">
|
|
|
- <div style="text-align: left">{{item.swingTime}}</div>
|
|
|
+ <div style="text-align: left; color: white">{{item.swingTime}}</div>
|
|
|
<div style="color: white; line-height: 30px">陌生人</div>
|
|
|
<div style="color: white; line-height: 30px">
|
|
|
进入区域:
|
|
@@ -195,8 +195,17 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="bio-dialog" v-show="dialog" @click="dialog = false">
|
|
|
- <div class="dialog-content1">
|
|
|
- <img :src="selectImg" width="100%" alt="">
|
|
|
+ <div class="dialog-content2">
|
|
|
+ <div class="base-banner1">
|
|
|
+ <div class="base-left1">
|
|
|
+ <img :src="selectImg" height="500px" alt="">
|
|
|
+ </div>
|
|
|
+ <div class="base-right">
|
|
|
+ <p>抓拍时间:{{selectItems.swingTime}}</p>
|
|
|
+ <p>抓拍区域:{{selectItems.deviceName}}</p>
|
|
|
+ <p> 姓 名 :{{selectItems.personName ? selectItems.personName : '未识别'}}</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -209,9 +218,10 @@ import AlarmBar from "@/views/Alarm/chart/AlarmBar";
|
|
|
// import ChartBar from "@/views/BioSafety/chart/ChartBar";
|
|
|
import { swiper, swiperSlide } from 'vue-awesome-swiper'
|
|
|
import 'swiper/css/swiper.css'
|
|
|
-import {getAlarmList, getWeekInfo, getPersonList, getFaceToken, getAlarmRate, getCountByDay, getDevice} from "@/utils/api";
|
|
|
+import {getAlarmList, getWeekInfo, getPersonList, getAlarmRate, getCountByDay, getDevice} from "@/utils/api";
|
|
|
import img from '@/assets/Alarm/111.png';
|
|
|
import {timeDate} from "@/utils";
|
|
|
+import { mapState } from "vuex";
|
|
|
|
|
|
export default {
|
|
|
name: "Alarm",
|
|
@@ -266,6 +276,7 @@ export default {
|
|
|
},
|
|
|
personList: [],
|
|
|
selectImg: '',
|
|
|
+ selectItems: {},
|
|
|
dialog: false,
|
|
|
alarmPie: [],
|
|
|
dayLoading: true,
|
|
@@ -289,6 +300,9 @@ export default {
|
|
|
]
|
|
|
}
|
|
|
},
|
|
|
+ computed: {
|
|
|
+ ...mapState(['ip'])
|
|
|
+ },
|
|
|
methods: {
|
|
|
alarmClick(num) {
|
|
|
this.num = num;
|
|
@@ -444,10 +458,11 @@ export default {
|
|
|
if(res.code == 0) {
|
|
|
let result = JSON.parse(res.result);
|
|
|
this.personList = result.data.pageData;
|
|
|
- const { token } = await getFaceToken();
|
|
|
+ // const { token } = await getFaceToken();
|
|
|
this.personList.forEach((item) => {
|
|
|
item.channelName = item.channelName.split("人脸门禁")[0];
|
|
|
- item.recordImage = `https://36.26.62.70:447/evo-pic/${item.recordImage}?token=${token}&oss_addr=172.16.3.223:8925`;
|
|
|
+ item.recordImage = `${this.ip}/video/picture/get?alarmPicture=${item.recordImage}`;
|
|
|
+ // item.recordImage = `https://36.26.62.70:447/evo-pic/${item.recordImage}?token=${token}&oss_addr=172.16.3.223:8925`;
|
|
|
});
|
|
|
}
|
|
|
this.personLoading = false;
|
|
@@ -493,6 +508,7 @@ export default {
|
|
|
open(item) {
|
|
|
this.dialog = true;
|
|
|
this.selectImg = item.recordImage;
|
|
|
+ this.selectItems = item;
|
|
|
}
|
|
|
},
|
|
|
mounted() {
|
|
@@ -726,7 +742,7 @@ export default {
|
|
|
position: absolute;
|
|
|
top: 0;
|
|
|
left: 0;
|
|
|
- background-color: rgba(0,0,0 ,.6);
|
|
|
+ background-color: rgba(0,0,0, .9);
|
|
|
z-index: 999;
|
|
|
}
|
|
|
.dialog-content1 {
|
|
@@ -769,4 +785,43 @@ export default {
|
|
|
font-size: 18px;
|
|
|
color: #fff;
|
|
|
}
|
|
|
+ .dialog-content2 {
|
|
|
+ width: 800px;
|
|
|
+ position: absolute;
|
|
|
+ top: 50%;
|
|
|
+ left: 50%;
|
|
|
+ transform: translate(-50%, -50%);
|
|
|
+
|
|
|
+ /*background-color: black;*/
|
|
|
+ }
|
|
|
+ .base-banner1 {
|
|
|
+ width: 800px;
|
|
|
+ height: 600px;
|
|
|
+ background: url("../../assets/BioSafety/03.png") no-repeat;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ display: flex;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 40px 20px 20px 50px;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ .base-left {
|
|
|
+ width: 750px;
|
|
|
+ }
|
|
|
+ .base-left1 {
|
|
|
+ box-sizing: border-box;
|
|
|
+ text-align: left;
|
|
|
+ padding-left: 100px;
|
|
|
+ height: 500px;
|
|
|
+ }
|
|
|
+ .base-right {
|
|
|
+ flex: 1;
|
|
|
+ }
|
|
|
+ .base-right p {
|
|
|
+ line-height: 80px;
|
|
|
+ font-size: 16px;
|
|
|
+ color: #fff;
|
|
|
+ box-sizing: border-box;
|
|
|
+ text-align: left;
|
|
|
+ padding-left: 50px;
|
|
|
+ }
|
|
|
</style>
|