fuzi_fauzia
/
hemat_solution
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fixing logic cctv

This commit is contained in:
Fuzi_fauzia 2024-06-22 02:58:33 +07:00
parent 1433c55fce
commit 2bc467b381
2 changed files with 31 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/app/content/hemat-app/monitoring/surveillance/surveillance.component.html
View File

@ -101,7 +101,7 @@
<div class="media d-flex"> <div class="media d-flex">
<div class="media-body text-left"> <div class="media-body text-left">
<h6 class="text-muted" style="color: #ffffff !important"> <h6 class="text-muted" style="color: #ffffff !important">
Total Device Total CCTV
</h6> </h6>
<h3 style="color: #ffffff !important">123123</h3> <h3 style="color: #ffffff !important">123123</h3>
</div> </div>
@ -125,7 +125,7 @@
<div class="media d-flex"> <div class="media d-flex">
<div class="media-body text-left"> <div class="media-body text-left">
<h6 class="text-light" style="color: #ffffff !important"> <h6 class="text-light" style="color: #ffffff !important">
Total Device Active Total CCTV Active
</h6> </h6>
<h3 style="color: #ffffff !important">13123</h3> <h3 style="color: #ffffff !important">13123</h3>
</div> </div>
@ -149,7 +149,7 @@
<div class="media d-flex"> <div class="media d-flex">
<div class="media-body text-left"> <div class="media-body text-left">
<h6 class="text-muted" style="color: #ffffff !important"> <h6 class="text-muted" style="color: #ffffff !important">
Total Device Non-Active Total CCTV Non-Active
</h6> </h6>
<h3 style="color: #ffffff !important">13123</h3> <h3 style="color: #ffffff !important">13123</h3>
</div> </div>

41
src/app/content/hemat-app/monitoring/surveillance/surveillance.component.ts
View File

@ -10,7 +10,7 @@ import videojs from "video.js";
styleUrls: ["./surveillance.component.css"], styleUrls: ["./surveillance.component.css"],
}) })
export class SurveillanceComponent { export class SurveillanceComponent {
@ViewChild('videoIframe', { static: false }) videoIframe: ElementRef; @ViewChild("videoIframe", { static: false }) videoIframe: ElementRef;
filteredRows: any[]; filteredRows: any[];
searchTerm: string = ""; searchTerm: string = "";
@ -24,28 +24,33 @@ export class SurveillanceComponent {
spinnerFilterActive = false; spinnerFilterActive = false;
switchState: boolean; switchState: boolean;
public breadcrumb: any; public breadcrumb: any;
showIframe = false; showIframe = false;
clicktrue = false;
cameras = [ cameras = [
{ {
id: 1, id: 1,
name: 'Pengadilan Agama Padang Cam 1', name: "Pengadilan Agama Padang Cam 1",
videoUrl: 'https://pdg2.cctvbadilag.my.id:5443/401900PTAPADANG/play.html?name=034163533934088379392939' videoUrl:
"https://pdg2.cctvbadilag.my.id:5443/401900PTAPADANG/play.html?name=034163533934088379392939",
}, },
{ {
id: 2, id: 2,
name: 'Pengadilan Agama Padang Cam 2', name: "Pengadilan Agama Padang Cam 2",
videoUrl: 'https://pdg2.cctvbadilag.my.id:5443/401900PTAPADANG/play.html?name=671014455048381705129283' videoUrl:
"https://pdg2.cctvbadilag.my.id:5443/401900PTAPADANG/play.html?name=671014455048381705129283",
}, },
{ {
id: 3, id: 3,
name: 'Pengadilan Agama Purwakarta Cam 1', name: "Pengadilan Agama Purwakarta Cam 1",
videoUrl: 'https://bdg2.cctvbadilag.my.id:5443/400854PAPURWAKARTA/play.html?name=194533247298993755522217' videoUrl:
"https://bdg2.cctvbadilag.my.id:5443/400854PAPURWAKARTA/play.html?name=194533247298993755522217",
}, },
{ {
id: 4, id: 4,
name: 'Pengadilan Agama Purwakarta Cam 2', name: "Pengadilan Agama Purwakarta Cam 2",
videoUrl: 'https://bdg2.cctvbadilag.my.id:5443/400854PAPURWAKARTA/play.html?name=113658520181242556385273' videoUrl:
} "https://bdg2.cctvbadilag.my.id:5443/400854PAPURWAKARTA/play.html?name=113658520181242556385273",
},
]; ];
constructor( constructor(
@ -83,7 +88,6 @@ showIframe = false;
ngAfterViewInit() { ngAfterViewInit() {
//Called after ngAfterContentInit when the component's view has been initialized. Applies to components only. //Called after ngAfterContentInit when the component's view has been initialized. Applies to components only.
//Add 'implements AfterViewInit' to the class. //Add 'implements AfterViewInit' to the class.
} }
fetchData(buildingSelected, categorySelected, statusSelected) { fetchData(buildingSelected, categorySelected, statusSelected) {
@ -131,22 +135,25 @@ showIframe = false;
onClick(videoUrl: string) { onClick(videoUrl: string) {
const iframe = this.videoIframe.nativeElement; const iframe = this.videoIframe.nativeElement;
iframe.src = videoUrl; iframe.src = videoUrl;
this.clicktrue = true;
} }
onMouseEnter(camera: any) { onMouseEnter(camera: any) {
console.log('enter'); console.log("enter");
if (this.clicktrue === false) {
const iframe = this.videoIframe.nativeElement; const iframe = this.videoIframe.nativeElement;
iframe.src = camera.videoUrl; iframe.src = camera.videoUrl;
}
this.showIframe = true; this.showIframe = true;
} }
onMouseLeave() { onMouseLeave() {
console.log('leave'); console.log("leave");
const iframe = this.videoIframe.nativeElement; const iframe = this.videoIframe.nativeElement;
iframe.src = ''; if (this.clicktrue === false) {
iframe.src = "";
}
this.showIframe = false; this.showIframe = false;
} }
} }