Skip to content

S
supervise-front
Commit 34632a05 by niuxiaolin
Options

latest ui 08/13/2019 12:05:46

parent f2a28a4e
Showing with 76 additions and 41 deletions
src/app/video/video.component.ts
...@@ -3,6 +3,8 @@ import { DynamicScriptLoaderService } from '../dynamic-script.service'; ...@@ -3,6 +3,8 @@ import { DynamicScriptLoaderService } from '../dynamic-script.service';
import { NzTreeNodeOptions, NzFormatEmitEvent } from 'ng-zorro-antd'; import { NzTreeNodeOptions, NzFormatEmitEvent } from 'ng-zorro-antd';
import { HttpClient } from '@angular/common/http'; import { HttpClient } from '@angular/common/http';
import { DefaultService } from '../api'; import { DefaultService } from '../api';
import { mergeMap, merge } from 'rxjs/operators';
import { of, concat } from 'rxjs';
declare var WebControl; declare var WebControl;
declare var JSEncrypt; declare var JSEncrypt;
declare var $; declare var $;
...@@ -43,7 +45,7 @@ export class VideoComponent implements OnInit { ...@@ -43,7 +45,7 @@ export class VideoComponent implements OnInit {
switch (node.level) { switch (node.level) {
case 0://项目 case 0://项目
request = "/project/list/"; request = "/project/list/";
break; break;
case 1://标段 case 1://标段
request = "/scetion/findListById/"; request = "/scetion/findListById/";
break; break;
...@@ -55,12 +57,17 @@ export class VideoComponent implements OnInit { ...@@ -55,12 +57,17 @@ export class VideoComponent implements OnInit {
break; break;
} }
if (node && node.getChildren().length === 0 && node.isExpanded) { if (node && node.getChildren().length === 0 && node.isExpanded) {
this.http.get( this.d.basePath+ request+node.key).subscribe(res=>{
console.log(res); this.http.get( this.d.basePath+ request+node.key).subscribe(res=>{
if(node.level==2){ if(node.level==2){
(res as any).data.forEach((element,index) => { (res as any).data.forEach((element,index) => {
this.preview2(element.cameraIndexCode,index+1) this.preview2(element.cameraIndexCode,index+1)
}); });
// concat(...previews);
//of('test').pipe(...concatMaps);
} }
node.addChildren((res as any).data.map((d,index)=>({title:d.name || d.cameraName,key:d.id ||d.cameraIndexCode,index:index,isLeaf:node.level==2 }))); node.addChildren((res as any).data.map((d,index)=>({title:d.name || d.cameraName,key:d.id ||d.cameraIndexCode,index:index,isLeaf:node.level==2 })));
}); });
...@@ -73,7 +80,7 @@ export class VideoComponent implements OnInit { ...@@ -73,7 +80,7 @@ export class VideoComponent implements OnInit {
} }
} }
addVCR($event:Required<NzFormatEmitEvent>){ addVCR($event:Required<NzFormatEmitEvent>){
this.preview2($event.node.key,$event.node.origin.index+1); this.preview2($event.node.key,0);
} }
loadNode(): Promise<NzTreeNodeOptions[]> { loadNode(): Promise<NzTreeNodeOptions[]> {
return new Promise(resolve => { return new Promise(resolve => {
...@@ -96,29 +103,31 @@ export class VideoComponent implements OnInit { ...@@ -96,29 +103,31 @@ export class VideoComponent implements OnInit {
console.log('Button cancel clicked!'); console.log('Button cancel clicked!');
this.isVisible = false; this.isVisible = false;
} }
preview() { // preview() {
var cameraIndexCode ="862edc0a09734e83a69101f69f840e0d"; //获取输入的监控点编号值，必填 // var cameraIndexCode ="862edc0a09734e83a69101f69f840e0d"; //获取输入的监控点编号值，必填
var streamMode = 0; //主子码流标识：0-主码流，1-子码流 // var streamMode = 0; //主子码流标识：0-主码流，1-子码流
var transMode = 1; //传输协议：0-UDP，1-TCP // var transMode = 1; //传输协议：0-UDP，1-TCP
var gpuMode = 0; //是否启用GPU硬解，0-不启用，1-启用 // var gpuMode = 0; //是否启用GPU硬解，0-不启用，1-启用
var wndId = -1; //播放窗口序号（在2x2以上布局下可指定播放窗口） // var wndId = -1; //播放窗口序号（在2x2以上布局下可指定播放窗口）
cameraIndexCode = cameraIndexCode.replace(/(^\s*)/g, ""); // cameraIndexCode = cameraIndexCode.replace(/(^\s*)/g, "");
cameraIndexCode = cameraIndexCode.replace(/(\s*$)/g, ""); // cameraIndexCode = cameraIndexCode.replace(/(\s*$)/g, "");
this.oWebControl.JS_RequestInterface({ // this.oWebControl.JS_RequestInterface({
funcName: "startPreview", // funcName: "startPreview",
argument: JSON.stringify({ // argument: JSON.stringify({
cameraIndexCode:cameraIndexCode, //监控点编号 // cameraIndexCode:cameraIndexCode, //监控点编号
streamMode: streamMode, //主子码流标识 // streamMode: streamMode, //主子码流标识
transMode: transMode, //传输协议 // transMode: transMode, //传输协议
gpuMode: gpuMode, //是否开启GPU硬解 // gpuMode: gpuMode, //是否开启GPU硬解
wndId:wndId //可指定播放窗口 // wndId:wndId //可指定播放窗口
}) // })
}) // })
} // }
preview2(cameraIndexCode:string,wndId) { preview2(cameraIndexCode:string,idnex):Promise<string> {
//var cameraIndexCode ="bb44edc4e843421da68f33699e7203f2"; //获取输入的监控点编号值，必填 return new Promise((res,rej)=>{
console.log('start')
//var cameraIndexCode ="bb44edc4e843421da68f33699e7203f2"; //获取输入的监控点编号值，必填
var streamMode = 0; //主子码流标识：0-主码流，1-子码流 var streamMode = 0; //主子码流标识：0-主码流，1-子码流
var transMode = 1; //传输协议：0-UDP，1-TCP var transMode = 1; //传输协议：0-UDP，1-TCP
var gpuMode = 0; //是否启用GPU硬解，0-不启用，1-启用 //播放窗口序号（在2x2以上布局下可指定播放窗口） var gpuMode = 0; //是否启用GPU硬解，0-不启用，1-启用 //播放窗口序号（在2x2以上布局下可指定播放窗口）
...@@ -126,18 +135,22 @@ export class VideoComponent implements OnInit { ...@@ -126,18 +135,22 @@ export class VideoComponent implements OnInit {
cameraIndexCode = cameraIndexCode.replace(/(^\s*)/g, ""); cameraIndexCode = cameraIndexCode.replace(/(^\s*)/g, "");
cameraIndexCode = cameraIndexCode.replace(/(\s*$)/g, ""); cameraIndexCode = cameraIndexCode.replace(/(\s*$)/g, "");
this.oWebControl.JS_RequestInterface({ this.oWebControl.JS_RequestInterface({
funcName: "startPreview", funcName: "startPreview",
argument: JSON.stringify({ argument: JSON.stringify({
cameraIndexCode:cameraIndexCode, //监控点编号 cameraIndexCode:cameraIndexCode, //监控点编号
streamMode: streamMode, //主子码流标识 streamMode: streamMode, //主子码流标识
transMode: transMode, //传输协议 transMode: transMode, //传输协议
gpuMode: gpuMode, //是否开启GPU硬解 gpuMode: gpuMode, //是否开启GPU硬解
wndId:wndId //可指定播放窗口 wndId:idnex //可指定播放窗口
}) })
}).then(msg=>{ }).finally(e=>{
console.log(msg) console.log('end')
res(e);
}); });
});
} }
startVideo() { startVideo() {
// 监听resize事件，使插件窗口尺寸跟随DIV窗口变化 // 监听resize事件，使插件窗口尺寸跟随DIV窗口变化
...@@ -147,24 +160,24 @@ export class VideoComponent implements OnInit { ...@@ -147,24 +160,24 @@ export class VideoComponent implements OnInit {
var height=$(document).height() var height=$(document).height()
oWebControl.JS_Resize(width*0.7, height*0.7); oWebControl.JS_Resize(width*0.7, height*0.7);
//oWebControl.JS_Resize((1500/1920)*width*0.8, (700/900)*height*0.8); //oWebControl.JS_Resize((1500/1920)*width*0.8, (700/900)*height*0.8);
setWndCover(); setWndCover();
} }
}); });
// 监听滚动条scroll事件，使插件窗口跟随浏览器滚动而移动 // 监听滚动条scroll事件，使插件窗口跟随浏览器滚动而移动
$(window).scroll(function () { $(window).scroll(function () {
if (oWebControl != null) { if (oWebControl != null) {
var width=$(document).width() var width=$(document).width()
var height=$(document).height() var height=$(document).height()
oWebControl.JS_Resize(width*0.7, height*0.7); oWebControl.JS_Resize(width*0.7, height*0.7);
// oWebControl.JS_Resize((1500/1920)*width*0.8, (700/900)*height*0.8); // oWebControl.JS_Resize((1500/1920)*width*0.8, (700/900)*height*0.8);
setWndCover(); setWndCover();
} }
}); });
// 设置窗口裁剪，当因滚动条滚动导致窗口需要被遮住的情况下需要JS_CuttingPartWindow部分窗口 // 设置窗口裁剪，当因滚动条滚动导致窗口需要被遮住的情况下需要JS_CuttingPartWindow部分窗口
function setWndCover() { function setWndCover() {
var iWidth = $(window).width(); var iWidth = $(window).width();
var iHeight = $(window).height(); var iHeight = $(window).height();
var oDivRect = $("#playWnd").get(0).getBoundingClientRect(); var oDivRect = $("#playWnd").get(0).getBoundingClientRect();
...@@ -179,7 +192,7 @@ function setWndCover() { ...@@ -179,7 +192,7 @@ function setWndCover() {
iCoverRight = (iCoverRight > 1500) ? 1500 : iCoverRight; iCoverRight = (iCoverRight > 1500) ? 1500 : iCoverRight;
iCoverBottom = (iCoverBottom > 700) ? 700 : iCoverBottom; iCoverBottom = (iCoverBottom > 700) ? 700 : iCoverBottom;
oWebControl.JS_RepairPartWindow(0, 0, 1001, 700); // 多1个像素点防止还原后边界缺失一个像素条 oWebControl.JS_RepairPartWindow(0, 0, 1001, 700); // 多1个像素点防止还原后边界缺失一个像素条
if (iCoverLeft != 0) { if (iCoverLeft != 0) {
oWebControl.JS_CuttingPartWindow(0, 0, iCoverLeft, 700); oWebControl.JS_CuttingPartWindow(0, 0, iCoverLeft, 700);
} }
...@@ -193,7 +206,7 @@ oWebControl.JS_RepairPartWindow(0, 0, 1001, 700); // 多1个像素点防止 ...@@ -193,7 +206,7 @@ oWebControl.JS_RepairPartWindow(0, 0, 1001, 700); // 多1个像素点防止
oWebControl.JS_CuttingPartWindow(0, 700 - iCoverBottom, 1500, iCoverBottom); oWebControl.JS_CuttingPartWindow(0, 700 - iCoverBottom, 1500, iCoverBottom);
} }
} }
let pubKey = null; let pubKey = null;
//RSA加密 //RSA加密
function setEncrypt(value) { function setEncrypt(value) {
var encrypt = new JSEncrypt(); var encrypt = new JSEncrypt();
...@@ -217,7 +230,7 @@ oWebControl.JS_RepairPartWindow(0, 0, 1001, 700); // 多1个像素点防止 ...@@ -217,7 +230,7 @@ oWebControl.JS_RepairPartWindow(0, 0, 1001, 700); // 多1个像素点防止
} }
}) })
} }
getPubKey(oWebControl, function () { getPubKey(oWebControl, function () {
////////////////////////////////// 请自行修改以下变量值 //////////////////////////////////// ////////////////////////////////// 请自行修改以下变量值 ////////////////////////////////////
var appkey = "24824919"; //综合安防管理平台提供的appkey，必填 var appkey = "24824919"; //综合安防管理平台提供的appkey，必填
...@@ -280,7 +293,7 @@ oWebControl.JS_RepairPartWindow(0, 0, 1001, 700); // 多1个像素点防止 ...@@ -280,7 +293,7 @@ oWebControl.JS_RepairPartWindow(0, 0, 1001, 700); // 多1个像素点防止
}); });
} }
let oWebControl = new WebControl({ let oWebControl = new WebControl({
szPluginContainer: "playWnd", // 指定容器id szPluginContainer: "playWnd", // 指定容器id
iServicePortStart: 15900, // 指定起止端口号，建议使用该值 iServicePortStart: 15900, // 指定起止端口号，建议使用该值
iServicePortEnd: 15909, iServicePortEnd: 15909,
...@@ -321,13 +334,13 @@ oWebControl.JS_RepairPartWindow(0, 0, 1001, 700); // 多1个像素点防止 ...@@ -321,13 +334,13 @@ oWebControl.JS_RepairPartWindow(0, 0, 1001, 700); // 多1个像素点防止
oWebControl = null; oWebControl = null;
} }
}); });
this.oWebControl = oWebControl; this.oWebControl = oWebControl;
} }
ngOnDestory(){ ngOnDestory(){
if (this.oWebControl != null){ if (this.oWebControl != null){
this.oWebControl.JS_HideWnd(); // 先让窗口隐藏，规避可能的插件窗口滞后于浏览器消失问题 this.oWebControl.JS_HideWnd(); // 先让窗口隐藏，规避可能的插件窗口滞后于浏览器消失问题
this.oWebControl.JS_Disconnect().then(function(){ // 断开与插件服务连接成功 this.oWebControl.JS_Disconnect().then(function(){ // 断开与插件服务连接成功
}, },
function() { // 断开与插件服务连接失败 function() { // 断开与插件服务连接失败
}); });
...@@ -340,12 +353,12 @@ oWebControl.JS_RepairPartWindow(0, 0, 1001, 700); // 多1个像素点防止 ...@@ -340,12 +353,12 @@ oWebControl.JS_RepairPartWindow(0, 0, 1001, 700); // 多1个像素点防止
back(){ back(){
if (this.oWebControl != null){ if (this.oWebControl != null){
this.oWebControl.JS_HideWnd(); // 先让窗口隐藏，规避可能的插件窗口滞后于浏览器消失问题 this.oWebControl.JS_HideWnd(); // 先让窗口隐藏，规避可能的插件窗口滞后于浏览器消失问题
this.oWebControl.JS_Disconnect().then(function(){ // 断开与插件服务连接成功 this.oWebControl.JS_Disconnect().then(function(){ // 断开与插件服务连接成功
}, },
function() { // 断开与插件服务连接失败 function() { // 断开与插件服务连接失败
}); });
} }
history.back(); history.back();
} }
......
src/index.html
...@@ -4,7 +4,29 @@ ...@@ -4,7 +4,29 @@
<meta charset="utf-8"> <meta charset="utf-8">
<title>Map</title> <title>Map</title>
<base href="/"> <base href="/">
<!-- pre-zone polyfills -->
<script src="node_modules/core-js/client/shim.min.js"></script>
<script src="node_modules/web-animations-js/web-animations.min.js"></script>
<script>
/**
* you can configure some zone flags which can disable zone interception for some
* asynchronous activities to improve startup performance - use these options only
* if you know what you are doing as it could result in hard to trace down bugs..
*/
// __Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
// __Zone_disable_on_property = true; // disable patch onProperty such as onclick
// __zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
/*
* in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
* with the following flag, it will bypass `zone.js` patch for IE/Edge
*/
// __Zone_enable_cross_context_check = true;
</script>
<!-- zone.js required by Angular -->
<script src="node_modules/zone.js/dist/zone.js"></script>
<!-- application polyfills -->
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico"> <link rel="icon" type="image/x-icon" href="favicon.ico">
<script src="assets/map_load.js"></script> <script src="assets/map_load.js"></script>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment