Skip to content
项目
群组
代码片段
帮助
当前项目
正在载入...
登录 / 注册
切换导航面板
M
mmc-stl-vue2
概览
概览
详情
活动
周期分析
版本库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
统计图
问题
0
议题
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
CI / CD
CI / CD
流水线
作业
日程表
图表
维基
Wiki
代码片段
代码片段
成员
成员
折叠边栏
关闭边栏
活动
图像
聊天
创建新问题
作业
提交
问题看板
Open sidebar
Administrator
mmc-stl-vue2
Commits
b245a574
提交
b245a574
authored
4月 13, 2024
作者:
翁进城
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
fix: 飞控中心修正不支持srs播放, 修正清流信息不显示
上级
325f9725
隐藏空白字符变更
内嵌
并排
正在显示
8 个修改的文件
包含
634 行增加
和
615 行删除
+634
-615
index.vue
...plications/components/player/components/livenvr/index.vue
+7
-7
index.vue
...plications/components/player/components/qingliu/index.vue
+0
-18
index.vue
...avApplications/components/player/components/srs/index.vue
+55
-125
jquery-1.10.2.min.js
...ons/components/player/components/srs/jquery-1.10.2.min.js
+0
-0
srs.sdk.js
...vApplications/components/player/components/srs/srs.sdk.js
+515
-0
index.vue
...er/components/uavApplications/components/player/index.vue
+55
-365
index.vue
...CFlightControlCenter/components/uavApplications/index.vue
+2
-72
uavApplications.js
...omponents/MMCFlightControlCenter/store/uavApplications.js
+0
-28
没有找到文件。
src/components/MMCFlightControlCenter/components/uavApplications/components/player/components/livenvr/index.vue
浏览文件 @
b245a574
...
@@ -5,10 +5,10 @@
...
@@ -5,10 +5,10 @@
:dblclick-fullscreen=
"false"
:dblclick-fullscreen=
"false"
aspect=
"fulllscreen"
aspect=
"fulllscreen"
:class=
"
{
:class=
"
{
small: !
videoFlag
,
small: !
smallFPV
,
'livenvr-player':
videoFlag
,
'livenvr-player':
smallFPV
,
vUrl: isStatus
&&
!
videoFlag
,
vUrl: isStatus
&&
!
smallFPV
,
vUrlDeffault: !isStatus
&&
!
videoFlag
,
vUrlDeffault: !isStatus
&&
!
smallFPV
,
}"
}"
ref="livePlayer"
ref="livePlayer"
:videoUrl="data.vUrl"
:videoUrl="data.vUrl"
...
@@ -20,8 +20,8 @@
...
@@ -20,8 +20,8 @@
:class=
"
{
:class=
"
{
vUrl: isStatus,
vUrl: isStatus,
vUrlDeffault: !isStatus,
vUrlDeffault: !isStatus,
small:
videoFlag
,
small:
smallFPV
,
'livenvr-player': !
videoFlag
,
'livenvr-player': !
smallFPV
,
}"
}"
ref="fpvPlayer"
ref="fpvPlayer"
:controls="false"
:controls="false"
...
@@ -53,7 +53,7 @@ export default {
...
@@ -53,7 +53,7 @@ export default {
},
},
className
:
String
,
className
:
String
,
videoFlag
:
{
smallFPV
:
{
type
:
Boolean
,
type
:
Boolean
,
default
:
()
=>
true
,
default
:
()
=>
true
,
},
},
...
...
src/components/MMCFlightControlCenter/components/uavApplications/components/player/components/qingliu/index.vue
浏览文件 @
b245a574
...
@@ -144,24 +144,6 @@ export default {
...
@@ -144,24 +144,6 @@ export default {
this
.
classNames
=
this
.
className
;
this
.
classNames
=
this
.
className
;
if
(
this
.
data
.
type
)
{
if
(
this
.
data
.
type
)
{
}
}
//鹰巢视频大小判断
console
.
log
(
this
.
$store
.
state
.
mapmanage
.
mapisStatus
,
"this.$store.state.mapmanage.mapisStatus"
);
if
(
this
.
$store
.
state
.
mapmanage
.
mapisStatus
.
flag
&&
this
.
$store
.
state
.
mapmanage
.
mapisStatus
.
type
==
"yc"
&&
this
.
$store
.
state
.
mapmanage
.
mapisStatus
.
num
==
0
)
{
this
.
classNames
=
this
.
className
+
" ycqingliumap"
;
}
if
(
this
.
$store
.
state
.
mapmanage
.
mapisStatus
.
flag
&&
this
.
$store
.
state
.
mapmanage
.
mapisStatus
.
type
==
"wrj"
)
{
this
.
classNames
=
this
.
className
+
" qingliumap"
;
}
this
.
getFontSize
();
this
.
getFontSize
();
if
(
this
.
device
.
customName
)
{
if
(
this
.
device
.
customName
)
{
...
...
src/components/MMCFlightControlCenter/components/uavApplications/components/player/components/srs/index.vue
浏览文件 @
b245a574
<
template
>
<
template
>
<div
class=
"cpt-player-webrtc"
>
<div
class=
"cpt-player-webrtc"
>
<video
id=
"rtc_media_player"
<video
id=
"rtc_media_player"
ref=
"webrtc"
controls
autoplay
></video>
ref=
"webrtc"
controls
autoplay
></video>
<!--
<div
class=
"cutImg"
id=
"cutImage"
>
<span
class=
"closeImg"
>
X
</span>
</div>
-->
</div>
</div>
</
template
>
</
template
>
<
script
>
<
script
>
let
sdk
=
null
;
import
$
from
"./jquery-1.10.2.min"
;
// import Qs from "qs";
import
{
SrsRtcPublisherAsync
,
SrsRtcPlayerAsync
,
SrsRtcFormatSenders
,
}
from
"./srs.sdk"
;
window
.
$
=
$
;
export
default
{
export
default
{
props
:
{
props
:
{
...
@@ -21,144 +21,74 @@ export default {
...
@@ -21,144 +21,74 @@ export default {
default
:
()
=>
({}),
default
:
()
=>
({}),
},
},
},
},
data
()
{
data
()
{
return
{
return
{
curr_data
:
{
sdk
:
null
,
vUrl
:
null
},
flight_info
:
null
,
};
};
},
},
mounted
()
{
watch
:
{
this
.
curr_data
=
{}
data
:
{
let
self
=
this
;
handler
(
value
)
{
self
.
$bus
.
$on
(
"takePhotos"
,
(
flight_info
)
=>
{
this
.
$nextTick
(()
=>
{
self
.
flight_info
=
flight_info
();
this
.
init
();
self
.
screenShot
(
self
.
flight_info
);
});
});
},
deep
:
true
,
immediate
:
true
,
},
},
beforeDestroy
()
{
this
.
sdk
.
close
();
},
},
methods
:
{
methods
:
{
init
()
{
pause
()
{
if
(
this
.
$refs
[
"webrtc"
])
{
if
(
this
.
$refs
[
"webrtc"
])
{
if
(
!
this
.
data
?.
vUrl
){
this
.
$refs
[
"webrtc"
].
pause
();
return
;
}
}
},
// if (sdk) {
play
()
{
// sdk.close();
if
(
this
.
$refs
[
"webrtc"
])
{
// }
this
.
$refs
[
"webrtc"
].
play
();
// sdk = new SrsRtcPlayerAsync();
}
// this.$refs["webrtc"].srcObject = sdk.stream;
},
// sdk.play(curr_data.vUrl);
init
()
{
let
_this
=
this
;
if
(
sdk
)
{
if
(
this
.
$refs
[
"webrtc"
])
{
sdk
.
close
();
if
(
this
.
sdk
)
{
this
.
sdk
.
close
();
}
}
sdk
=
new
SrsRtcPlayerAsync
();
this
.
sdk
=
new
SrsRtcPlayerAsync
();
// $('#rtc_media_player').prop('srcObject', sdk.stream);
this
.
$refs
[
"webrtc"
].
srcObject
=
this
.
sdk
.
stream
;
// console.log("sdk...", sdk)
this
.
sdk
this
.
$refs
[
"webrtc"
].
srcObject
=
sdk
.
stream
;
// curr_data.vUrl = "rtmp://121.43.58.140/live/";
// 'webrtc://srs.mmcuav.cn/live/xxxxxxxxxxxxxxx' // 测试地址,需使用推流工具推流
// console.log("curr_data.vUrl:", curr_data.vUrl);
let
self
=
this
sdk
.
play
(
this
.
data
.
vUrl
)
.
play
(
this
.
data
.
vUrl
)
.
then
(
function
(
session
)
{
.
then
(
function
(
session
)
{})
console
.
log
(
session
);
/* if (session) {
self.$bus.$emit("handleVideoState")
} */
})
.
catch
(
function
(
reason
)
{
.
catch
(
function
(
reason
)
{
console
.
log
(
'err reason'
,
reason
)
console
.
log
(
'srs err'
,
reason
)
sdk
.
close
();
_this
.
sdk
.
close
();
console
.
error
(
reason
);
});
}
},
async
screenShot
(
data
)
{
// console.log("screenShot:", data);
var
player
=
document
.
getElementById
(
"rtc_media_player"
);
//获取video的Dom节点
player
.
setAttribute
(
"crossOrigin"
,
"anonymous"
);
//添加srossOrigin属性,解决跨域问题
var
canvas
=
document
.
createElement
(
"canvas"
);
// var img = document.createElement("img");
canvas
.
width
=
player
.
clientWidth
;
canvas
.
height
=
player
.
clientHeight
;
canvas
.
getContext
(
"2d"
)
.
drawImage
(
player
,
0
,
0
,
canvas
.
width
,
canvas
.
height
);
//截
// var dataURL = canvas.toDataURL("image/png"); //将图片转成base64格式
// img.src = dataURL;
// img.width = player.clientWidth; //控制截出来的图片宽的大小
// img.height = player.clientHeight; //控制截出来的图片高的大小
// img.style.border = "1px solid #333333"; //控制截出来的图片边框的样式
// document.getElementById("cutImage").appendChild(img); //显示在页面中
// console.log("img:", dataURL);
try
{
canvas
.
toBlob
((
blob
)
=>
{
// 创建a元素来实现下载
// const a = document.createElement("a");
// a.style.display = "none";
// document.body.appendChild(a);
// a.href = window.URL.createObjectURL(blob);
// // 下载的文件名
// let fileName = "nt图片";
// a.download =
// fileName || `screenshot-${canvas.width}x${canvas.height}.png`;
// console.log("IMG-BLOD:", blob);
const
myFile
=
new
File
([
blob
],
"image.png"
,
{
type
:
blob
.
type
,
});
});
this
.
savaTaskImages
(
myFile
,
data
.
deviceId
,
data
.
id
);
// a.click();
// // 触发下载后,移除元素
// a.remove();
});
}
catch
(
e
)
{
console
.
log
(
e
);
}
}
// this.downFile(dataURL, "图片.jpg"); //下载截图
},
async
savaTaskImages
(
images
,
deviceHardId
,
task_id
)
{
let
forms
=
new
FormData
();
forms
.
append
(
"task_id"
,
task_id
);
forms
.
append
(
"deviceHardId"
,
deviceHardId
);
forms
.
append
(
"images"
,
images
);
},
},
},
fullScreen
()
{
watch
:
{
let
video
=
this
.
$refs
[
"webrtc"
];
data
:
{
if
(
video
.
webkitRequestFullScreen
)
{
handler
(
newVal
,
oldVal
)
{
video
.
webkitRequestFullScreen
();
let
self
=
this
}
else
if
(
video
.
requestFullscreen
)
{
if
(
newVal
?.
vUrl
!=
oldVal
?.
vUrl
)
{
video
.
requestFullscreen
();
this
.
$nextTick
(()
=>
{
}
else
if
(
video
.
mozRequestFullScreen
)
console
.
log
(
'self.init'
)
setTimeout
(()
=>
{
self
.
init
();
video
.
play
();
});
},
200
);
}
},
deep
:
true
,
immediate
:
true
,
},
},
},
},
};
};
</
script
>
</
script
>
<
style
lang=
"scss"
scoped
>
<
style
lang=
"scss"
scoped
>
video
::-webkit-media-controls-enclosure
{
display
:
none
;
}
.cpt-player-webrtc
{
.cpt-player-webrtc
{
height
:
100%
;
height
:
100%
;
width
:
100%
;
width
:
100%
;
background-color
:
#000
;
background-color
:
#000
;
&:hover
{
video
::
-webkit-media-controls-enclosure
{
display
:
inherit
!important
;
}
}
video
{
video
{
width
:
100%
;
width
:
100%
;
height
:
100%
;
height
:
100%
;
...
...
src/components/MMCFlightControlCenter/components/uavApplications/components/player/components/srs/jquery-1.10.2.min.js
0 → 100644
浏览文件 @
b245a574
This source diff could not be displayed because it is too large. You can
view the blob
instead.
src/components/MMCFlightControlCenter/components/uavApplications/components/player/components/srs/srs.sdk.js
0 → 100644
浏览文件 @
b245a574
//
// Copyright (c) 2013-2021 Winlin
//
// SPDX-License-Identifier: MIT
//
'use strict'
;
// Depends on adapter-7.4.0.min.js from https://github.com/webrtc/adapter
// Async-awat-prmise based SRS RTC Publisher.
export
function
SrsRtcPublisherAsync
()
{
var
self
=
{};
// https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia
self
.
constraints
=
{
audio
:
true
,
video
:
{
width
:
{
ideal
:
320
,
max
:
576
}
}
};
// @see https://github.com/rtcdn/rtcdn-draft
// @url The WebRTC url to play with, for example:
// webrtc://r.ossrs.net/live/livestream
// or specifies the API port:
// webrtc://r.ossrs.net:11985/live/livestream
// or autostart the publish:
// webrtc://r.ossrs.net/live/livestream?autostart=true
// or change the app from live to myapp:
// webrtc://r.ossrs.net:11985/myapp/livestream
// or change the stream from livestream to mystream:
// webrtc://r.ossrs.net:11985/live/mystream
// or set the api server to myapi.domain.com:
// webrtc://myapi.domain.com/live/livestream
// or set the candidate(eip) of answer:
// webrtc://r.ossrs.net/live/livestream?candidate=39.107.238.185
// or force to access https API:
// webrtc://r.ossrs.net/live/livestream?schema=https
// or use plaintext, without SRTP:
// webrtc://r.ossrs.net/live/livestream?encrypt=false
// or any other information, will pass-by in the query:
// webrtc://r.ossrs.net/live/livestream?vhost=xxx
// webrtc://r.ossrs.net/live/livestream?token=xxx
self
.
publish
=
async
function
(
url
)
{
var
conf
=
self
.
__internal
.
prepareUrl
(
url
);
self
.
pc
.
addTransceiver
(
"audio"
,
{
direction
:
"sendonly"
});
self
.
pc
.
addTransceiver
(
"video"
,
{
direction
:
"sendonly"
});
var
stream
=
await
navigator
.
mediaDevices
.
getUserMedia
(
self
.
constraints
);
// @see https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/addStream#Migrating_to_addTrack
stream
.
getTracks
().
forEach
(
function
(
track
)
{
self
.
pc
.
addTrack
(
track
);
// Notify about local track when stream is ok.
self
.
ontrack
&&
self
.
ontrack
({
track
:
track
});
});
var
offer
=
await
self
.
pc
.
createOffer
();
await
self
.
pc
.
setLocalDescription
(
offer
);
var
session
=
await
new
Promise
(
function
(
resolve
,
reject
)
{
// @see https://github.com/rtcdn/rtcdn-draft
var
data
=
{
api
:
conf
.
apiUrl
,
tid
:
conf
.
tid
,
streamurl
:
conf
.
streamUrl
,
clientip
:
null
,
sdp
:
offer
.
sdp
};
$
.
ajax
({
type
:
"POST"
,
url
:
conf
.
apiUrl
,
data
:
JSON
.
stringify
(
data
),
contentType
:
'application/json'
,
dataType
:
'json'
}).
done
(
function
(
data
)
{
if
(
data
.
code
)
{
reject
(
data
);
return
;
}
resolve
(
data
);
}).
fail
(
function
(
reason
)
{
reject
(
reason
);
});
});
await
self
.
pc
.
setRemoteDescription
(
new
RTCSessionDescription
({
type
:
'answer'
,
sdp
:
session
.
sdp
})
);
session
.
simulator
=
conf
.
schema
+
'//'
+
conf
.
urlObject
.
server
+
':'
+
conf
.
port
+
'/rtc/v1/nack/'
;
return
session
;
};
// Close the publisher.
self
.
close
=
function
()
{
self
.
pc
&&
self
.
pc
.
close
();
self
.
pc
=
null
;
};
// The callback when got local stream.
// @see https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/addStream#Migrating_to_addTrack
self
.
ontrack
=
function
(
event
)
{
// Add track to stream of SDK.
self
.
stream
.
addTrack
(
event
.
track
);
};
// Internal APIs.
self
.
__internal
=
{
defaultPath
:
'/rtc/v1/publish/'
,
prepareUrl
:
function
(
webrtcUrl
)
{
var
urlObject
=
self
.
__internal
.
parse
(
webrtcUrl
);
// If user specifies the schema, use it as API schema.
var
schema
=
urlObject
.
user_query
.
schema
;
schema
=
schema
?
schema
+
':'
:
window
.
location
.
protocol
;
var
port
=
urlObject
.
port
||
1985
;
if
(
schema
===
'https:'
)
{
port
=
urlObject
.
port
||
443
;
}
// @see https://github.com/rtcdn/rtcdn-draft
var
api
=
urlObject
.
user_query
.
play
||
self
.
__internal
.
defaultPath
;
if
(
api
.
lastIndexOf
(
'/'
)
!==
api
.
length
-
1
)
{
api
+=
'/'
;
}
apiUrl
=
schema
+
'//'
+
urlObject
.
server
+
':'
+
port
+
api
;
for
(
var
key
in
urlObject
.
user_query
)
{
if
(
key
!==
'api'
&&
key
!==
'play'
)
{
apiUrl
+=
'&'
+
key
+
'='
+
urlObject
.
user_query
[
key
];
}
}
// Replace /rtc/v1/play/&k=v to /rtc/v1/play/?k=v
var
apiUrl
=
apiUrl
.
replace
(
api
+
'&'
,
api
+
'?'
);
var
streamUrl
=
urlObject
.
url
;
return
{
apiUrl
:
apiUrl
,
streamUrl
:
streamUrl
,
schema
:
schema
,
urlObject
:
urlObject
,
port
:
port
,
tid
:
Number
(
parseInt
(
new
Date
().
getTime
()
*
Math
.
random
()
*
100
)).
toString
(
16
).
substr
(
0
,
7
)
};
},
parse
:
function
(
url
)
{
// @see: http://stackoverflow.com/questions/10469575/how-to-use-location-object-to-parse-url-without-redirecting-the-page-in-javascri
var
a
=
document
.
createElement
(
"a"
);
a
.
href
=
url
.
replace
(
"rtmp://"
,
"http://"
)
.
replace
(
"webrtc://"
,
"http://"
)
.
replace
(
"rtc://"
,
"http://"
);
var
vhost
=
a
.
hostname
;
var
app
=
a
.
pathname
.
substr
(
1
,
a
.
pathname
.
lastIndexOf
(
"/"
)
-
1
);
var
stream
=
a
.
pathname
.
substr
(
a
.
pathname
.
lastIndexOf
(
"/"
)
+
1
);
// parse the vhost in the params of app, that srs supports.
app
=
app
.
replace
(
"...vhost..."
,
"?vhost="
);
if
(
app
.
indexOf
(
"?"
)
>=
0
)
{
var
params
=
app
.
substr
(
app
.
indexOf
(
"?"
));
app
=
app
.
substr
(
0
,
app
.
indexOf
(
"?"
));
if
(
params
.
indexOf
(
"vhost="
)
>
0
)
{
vhost
=
params
.
substr
(
params
.
indexOf
(
"vhost="
)
+
"vhost="
.
length
);
if
(
vhost
.
indexOf
(
"&"
)
>
0
)
{
vhost
=
vhost
.
substr
(
0
,
vhost
.
indexOf
(
"&"
));
}
}
}
// when vhost equals to server, and server is ip,
// the vhost is __defaultVhost__
if
(
a
.
hostname
===
vhost
)
{
var
re
=
/^
(\d
+
)\.(\d
+
)\.(\d
+
)\.(\d
+
)
$/
;
if
(
re
.
test
(
a
.
hostname
))
{
vhost
=
"__defaultVhost__"
;
}
}
// parse the schema
var
schema
=
"rtmp"
;
if
(
url
.
indexOf
(
"://"
)
>
0
)
{
schema
=
url
.
substr
(
0
,
url
.
indexOf
(
"://"
));
}
var
port
=
a
.
port
;
if
(
!
port
)
{
if
(
schema
===
'http'
)
{
port
=
80
;
}
else
if
(
schema
===
'https'
)
{
port
=
443
;
}
else
if
(
schema
===
'rtmp'
)
{
port
=
1935
;
}
}
var
ret
=
{
url
:
url
,
schema
:
schema
,
server
:
a
.
hostname
,
port
:
port
,
vhost
:
vhost
,
app
:
app
,
stream
:
stream
};
self
.
__internal
.
fill_query
(
a
.
search
,
ret
);
// For webrtc API, we use 443 if page is https, or schema specified it.
if
(
!
ret
.
port
)
{
if
(
schema
===
'webrtc'
||
schema
===
'rtc'
)
{
if
(
ret
.
user_query
.
schema
===
'https'
)
{
ret
.
port
=
443
;
}
else
if
(
window
.
location
.
href
.
indexOf
(
'https://'
)
===
0
)
{
ret
.
port
=
443
;
}
else
{
// For WebRTC, SRS use 1985 as default API port.
ret
.
port
=
1985
;
}
}
}
return
ret
;
},
fill_query
:
function
(
query_string
,
obj
)
{
// pure user query object.
obj
.
user_query
=
{};
if
(
query_string
.
length
===
0
)
{
return
;
}
// split again for angularjs.
if
(
query_string
.
indexOf
(
"?"
)
>=
0
)
{
query_string
=
query_string
.
split
(
"?"
)[
1
];
}
var
queries
=
query_string
.
split
(
"&"
);
for
(
var
i
=
0
;
i
<
queries
.
length
;
i
++
)
{
var
elem
=
queries
[
i
];
var
query
=
elem
.
split
(
"="
);
obj
[
query
[
0
]]
=
query
[
1
];
obj
.
user_query
[
query
[
0
]]
=
query
[
1
];
}
// alias domain for vhost.
if
(
obj
.
domain
)
{
obj
.
vhost
=
obj
.
domain
;
}
}
};
self
.
pc
=
new
RTCPeerConnection
(
null
);
// To keep api consistent between player and publisher.
// @see https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/addStream#Migrating_to_addTrack
// @see https://webrtc.org/getting-started/media-devices
self
.
stream
=
new
MediaStream
();
return
self
;
}
// Depends on adapter-7.4.0.min.js from https://github.com/webrtc/adapter
// Async-await-promise based SRS RTC Player.
export
function
SrsRtcPlayerAsync
()
{
var
self
=
{};
// @see https://github.com/rtcdn/rtcdn-draft
// @url The WebRTC url to play with, for example:
// webrtc://r.ossrs.net/live/livestream
// or specifies the API port:
// webrtc://r.ossrs.net:11985/live/livestream
// or autostart the play:
// webrtc://r.ossrs.net/live/livestream?autostart=true
// or change the app from live to myapp:
// webrtc://r.ossrs.net:11985/myapp/livestream
// or change the stream from livestream to mystream:
// webrtc://r.ossrs.net:11985/live/mystream
// or set the api server to myapi.domain.com:
// webrtc://myapi.domain.com/live/livestream
// or set the candidate(eip) of answer:
// webrtc://r.ossrs.net/live/livestream?candidate=39.107.238.185
// or force to access https API:
// webrtc://r.ossrs.net/live/livestream?schema=https
// or use plaintext, without SRTP:
// webrtc://r.ossrs.net/live/livestream?encrypt=false
// or any other information, will pass-by in the query:
// webrtc://r.ossrs.net/live/livestream?vhost=xxx
// webrtc://r.ossrs.net/live/livestream?token=xxx
self
.
play
=
async
function
(
url
)
{
var
conf
=
self
.
__internal
.
prepareUrl
(
url
);
self
.
pc
.
addTransceiver
(
"audio"
,
{
direction
:
"recvonly"
});
self
.
pc
.
addTransceiver
(
"video"
,
{
direction
:
"recvonly"
});
var
offer
=
await
self
.
pc
.
createOffer
();
await
self
.
pc
.
setLocalDescription
(
offer
);
var
session
=
await
new
Promise
(
function
(
resolve
,
reject
)
{
// @see https://github.com/rtcdn/rtcdn-draft
var
data
=
{
api
:
conf
.
apiUrl
,
tid
:
conf
.
tid
,
streamurl
:
conf
.
streamUrl
,
clientip
:
null
,
sdp
:
offer
.
sdp
};
$
.
ajax
({
type
:
"POST"
,
url
:
conf
.
apiUrl
,
data
:
JSON
.
stringify
(
data
),
contentType
:
'application/json'
,
dataType
:
'json'
}).
done
(
function
(
data
)
{
if
(
data
.
code
)
{
reject
(
data
);
return
;
}
resolve
(
data
);
}).
fail
(
function
(
reason
){
reject
(
reason
);
});
});
await
self
.
pc
.
setRemoteDescription
(
new
RTCSessionDescription
({
type
:
'answer'
,
sdp
:
session
.
sdp
})
);
session
.
simulator
=
conf
.
schema
+
'//'
+
conf
.
urlObject
.
server
+
':'
+
conf
.
port
+
'/rtc/v1/nack/'
;
return
session
;
};
// Close the player.
self
.
close
=
function
()
{
self
.
pc
&&
self
.
pc
.
close
();
self
.
pc
=
null
;
};
// The callback when got remote track.
// Note that the onaddstream is deprecated, @see https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/onaddstream
self
.
ontrack
=
function
(
event
)
{
// https://webrtc.org/getting-started/remote-streams
self
.
stream
.
addTrack
(
event
.
track
);
};
// Internal APIs.
self
.
__internal
=
{
defaultPath
:
'/rtc/v1/play/'
,
prepareUrl
:
function
(
webrtcUrl
)
{
var
urlObject
=
self
.
__internal
.
parse
(
webrtcUrl
);
// If user specifies the schema, use it as API schema.
var
schema
=
urlObject
.
user_query
.
schema
;
schema
=
schema
?
schema
+
':'
:
window
.
location
.
protocol
;
var
port
=
urlObject
.
port
||
1985
;
if
(
schema
===
'https:'
)
{
port
=
urlObject
.
port
||
443
;
}
// @see https://github.com/rtcdn/rtcdn-draft
var
api
=
urlObject
.
user_query
.
play
||
self
.
__internal
.
defaultPath
;
if
(
api
.
lastIndexOf
(
'/'
)
!==
api
.
length
-
1
)
{
api
+=
'/'
;
}
apiUrl
=
schema
+
'//'
+
urlObject
.
server
+
':'
+
port
+
api
;
for
(
var
key
in
urlObject
.
user_query
)
{
if
(
key
!==
'api'
&&
key
!==
'play'
)
{
apiUrl
+=
'&'
+
key
+
'='
+
urlObject
.
user_query
[
key
];
}
}
// Replace /rtc/v1/play/&k=v to /rtc/v1/play/?k=v
var
apiUrl
=
apiUrl
.
replace
(
api
+
'&'
,
api
+
'?'
);
var
streamUrl
=
urlObject
.
url
;
return
{
apiUrl
:
apiUrl
,
streamUrl
:
streamUrl
,
schema
:
schema
,
urlObject
:
urlObject
,
port
:
port
,
tid
:
Number
(
parseInt
(
new
Date
().
getTime
()
*
Math
.
random
()
*
100
)).
toString
(
16
).
substr
(
0
,
7
)
};
},
parse
:
function
(
url
)
{
// @see: http://stackoverflow.com/questions/10469575/how-to-use-location-object-to-parse-url-without-redirecting-the-page-in-javascri
var
a
=
document
.
createElement
(
"a"
);
a
.
href
=
url
.
replace
(
"rtmp://"
,
"http://"
)
.
replace
(
"webrtc://"
,
"http://"
)
.
replace
(
"rtc://"
,
"http://"
);
var
vhost
=
a
.
hostname
;
var
app
=
a
.
pathname
.
substr
(
1
,
a
.
pathname
.
lastIndexOf
(
"/"
)
-
1
);
var
stream
=
a
.
pathname
.
substr
(
a
.
pathname
.
lastIndexOf
(
"/"
)
+
1
);
// parse the vhost in the params of app, that srs supports.
app
=
app
.
replace
(
"...vhost..."
,
"?vhost="
);
if
(
app
.
indexOf
(
"?"
)
>=
0
)
{
var
params
=
app
.
substr
(
app
.
indexOf
(
"?"
));
app
=
app
.
substr
(
0
,
app
.
indexOf
(
"?"
));
if
(
params
.
indexOf
(
"vhost="
)
>
0
)
{
vhost
=
params
.
substr
(
params
.
indexOf
(
"vhost="
)
+
"vhost="
.
length
);
if
(
vhost
.
indexOf
(
"&"
)
>
0
)
{
vhost
=
vhost
.
substr
(
0
,
vhost
.
indexOf
(
"&"
));
}
}
}
// when vhost equals to server, and server is ip,
// the vhost is __defaultVhost__
if
(
a
.
hostname
===
vhost
)
{
var
re
=
/^
(\d
+
)\.(\d
+
)\.(\d
+
)\.(\d
+
)
$/
;
if
(
re
.
test
(
a
.
hostname
))
{
vhost
=
"__defaultVhost__"
;
}
}
// parse the schema
var
schema
=
"rtmp"
;
if
(
url
.
indexOf
(
"://"
)
>
0
)
{
schema
=
url
.
substr
(
0
,
url
.
indexOf
(
"://"
));
}
var
port
=
a
.
port
;
if
(
!
port
)
{
if
(
schema
===
'http'
)
{
port
=
80
;
}
else
if
(
schema
===
'https'
)
{
port
=
443
;
}
else
if
(
schema
===
'rtmp'
)
{
port
=
1935
;
}
}
var
ret
=
{
url
:
url
,
schema
:
schema
,
server
:
a
.
hostname
,
port
:
port
,
vhost
:
vhost
,
app
:
app
,
stream
:
stream
};
self
.
__internal
.
fill_query
(
a
.
search
,
ret
);
// For webrtc API, we use 443 if page is https, or schema specified it.
if
(
!
ret
.
port
)
{
if
(
schema
===
'webrtc'
||
schema
===
'rtc'
)
{
if
(
ret
.
user_query
.
schema
===
'https'
)
{
ret
.
port
=
443
;
}
else
if
(
window
.
location
.
href
.
indexOf
(
'https://'
)
===
0
)
{
ret
.
port
=
443
;
}
else
{
// For WebRTC, SRS use 1985 as default API port.
ret
.
port
=
1985
;
}
}
}
return
ret
;
},
fill_query
:
function
(
query_string
,
obj
)
{
// pure user query object.
obj
.
user_query
=
{};
if
(
query_string
.
length
===
0
)
{
return
;
}
// split again for angularjs.
if
(
query_string
.
indexOf
(
"?"
)
>=
0
)
{
query_string
=
query_string
.
split
(
"?"
)[
1
];
}
var
queries
=
query_string
.
split
(
"&"
);
for
(
var
i
=
0
;
i
<
queries
.
length
;
i
++
)
{
var
elem
=
queries
[
i
];
var
query
=
elem
.
split
(
"="
);
obj
[
query
[
0
]]
=
query
[
1
];
obj
.
user_query
[
query
[
0
]]
=
query
[
1
];
}
// alias domain for vhost.
if
(
obj
.
domain
)
{
obj
.
vhost
=
obj
.
domain
;
}
}
};
console
.
log
(
"RTCPeerConnection"
);
self
.
pc
=
new
RTCPeerConnection
(
null
);
// Create a stream to add track to the stream, @see https://webrtc.org/getting-started/remote-streams
self
.
stream
=
new
MediaStream
();
// https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/ontrack
self
.
pc
.
ontrack
=
function
(
event
)
{
if
(
self
.
ontrack
)
{
self
.
ontrack
(
event
);
}
};
return
self
;
}
// Format the codec of RTCRtpSender, kind(audio/video) is optional filter.
// https://developer.mozilla.org/en-US/docs/Web/Media/Formats/WebRTC_codecs#getting_the_supported_codecs
export
function
SrsRtcFormatSenders
(
senders
,
kind
)
{
var
codecs
=
[];
senders
.
forEach
(
function
(
sender
)
{
var
params
=
sender
.
getParameters
();
params
&&
params
.
codecs
&&
params
.
codecs
.
forEach
(
function
(
c
)
{
if
(
kind
&&
sender
.
track
.
kind
!==
kind
)
{
return
;
}
if
(
c
.
mimeType
.
indexOf
(
'/red'
)
>
0
||
c
.
mimeType
.
indexOf
(
'/rtx'
)
>
0
||
c
.
mimeType
.
indexOf
(
'/fec'
)
>
0
)
{
return
;
}
var
s
=
''
;
s
+=
c
.
mimeType
.
replace
(
'audio/'
,
''
).
replace
(
'video/'
,
''
);
s
+=
', '
+
c
.
clockRate
+
'HZ'
;
if
(
sender
.
track
.
kind
===
"audio"
)
{
s
+=
', channels: '
+
c
.
channels
;
}
s
+=
', pt: '
+
c
.
payloadType
;
codecs
.
push
(
s
);
});
});
return
codecs
.
join
(
", "
);
}
src/components/MMCFlightControlCenter/components/uavApplications/components/player/index.vue
浏览文件 @
b245a574
...
@@ -3,7 +3,7 @@
...
@@ -3,7 +3,7 @@
<div>
<div>
<div
ref=
"wrap"
>
<div
ref=
"wrap"
>
<div
class=
"video-wrap"
:class=
"big"
@
dblclick=
"screen"
ref=
"video"
>
<div
class=
"video-wrap"
:class=
"big"
@
dblclick=
"screen"
ref=
"video"
>
<div
class=
"cpt_video"
@
click=
"
fn"
v-if=
"flag
"
v-interact
>
<div
class=
"cpt_video"
@
click=
"
lensControl"
v-if=
"showPlayer
"
v-interact
>
<Obstacle
v-if=
"!isStatus"
></Obstacle>
<Obstacle
v-if=
"!isStatus"
></Obstacle>
<div
class=
"video"
>
<div
class=
"video"
>
<div
class=
"name"
v-clipboard:copy=
"vUrl.vUrl"
>
{{
device
.
name
}}
</div>
<div
class=
"name"
v-clipboard:copy=
"vUrl.vUrl"
>
{{
device
.
name
}}
</div>
...
@@ -14,8 +14,7 @@
...
@@ -14,8 +14,7 @@
<videoModelChange
<videoModelChange
:data=
"data"
:data=
"data"
@
fn=
"videoModelChangeFn"
v-if=
"streamSelect == 'QINGLIU' && !isStatus"
v-if=
"streamSelect == 'QingLiu' && !isStatus"
class=
"cp pa cf modelStyle"
class=
"cp pa cf modelStyle"
@
click=
"VideoModelChange"
@
click=
"VideoModelChange"
:uavRealTimeData=
"uavRealTimeData"
:uavRealTimeData=
"uavRealTimeData"
...
@@ -24,7 +23,7 @@
...
@@ -24,7 +23,7 @@
<components
<components
:is=
"playerCom"
:is=
"playerCom"
:
videoFlag=
"videoFlag
"
:
smallFPV=
"smallFPV
"
:isStatus=
"isStatus"
:isStatus=
"isStatus"
ref=
"player"
ref=
"player"
:LivePlayerInfor=
"false"
:LivePlayerInfor=
"false"
...
@@ -40,7 +39,7 @@
...
@@ -40,7 +39,7 @@
@
close=
"infoflag = false"
@
close=
"infoflag = false"
/>
/>
<!-- @entryCross="entryCross" -->
<!-- @entryCross="entryCross" -->
<div
class=
"info"
v-if=
"
infoshow && streamSelect == 'QingLiu'&&!isStatus
"
>
<div
class=
"info"
v-if=
"
showInfo && streamSelect == 'QINGLIU'
"
>
<div
class=
"de"
>
<div
class=
"de"
>
<div
class=
"title"
>
bitrate:
</div>
<div
class=
"title"
>
bitrate:
</div>
<div
class=
"detail"
>
{{
raw_msg
?
raw_msg
/
1000
:
"0"
}}
kbps
</div>
<div
class=
"detail"
>
{{
raw_msg
?
raw_msg
/
1000
:
"0"
}}
kbps
</div>
...
@@ -114,7 +113,7 @@
...
@@ -114,7 +113,7 @@
<div
class=
"detail"
>
{{
infoData
?
infoData
.
vbuffer
/
1000
:
"0"
}}
ms
</div>
<div
class=
"detail"
>
{{
infoData
?
infoData
.
vbuffer
/
1000
:
"0"
}}
ms
</div>
</div>
</div>
</div>
</div>
<div
class=
"info_isStatus"
v-if=
"
infoshow && streamSelect == 'QingLiu
'&&isStatus"
>
<div
class=
"info_isStatus"
v-if=
"
showInfo && streamSelect == 'QINGLIU
'&&isStatus"
>
<div
class=
"title_box"
v-interact
>
<div
class=
"title_box"
v-interact
>
<div
class=
"title pl20"
>
<div
class=
"title pl20"
>
<img
src=
"./assets/images/mount_head.png"
/>
<img
src=
"./assets/images/mount_head.png"
/>
...
@@ -122,7 +121,7 @@
...
@@ -122,7 +121,7 @@
</div>
</div>
<div
style=
"display: flex"
>
<div
style=
"display: flex"
>
<div
class=
"icon-box"
></div>
<div
class=
"icon-box"
></div>
<div
class=
"cf ml20 mr10 c70d cp"
@
click=
"
infoshow
= false"
>
关闭
</div>
<div
class=
"cf ml20 mr10 c70d cp"
@
click=
"
showInfo
= false"
>
关闭
</div>
</div>
</div>
</div>
</div>
<div
class=
"content"
>
<div
class=
"content"
>
...
@@ -439,12 +438,8 @@ export default {
...
@@ -439,12 +438,8 @@ export default {
SRSPlayer
,
SRSPlayer
,
videoModelChange
,
videoModelChange
,
},
},
inject
:
[
'bus'
],
inject
:
[
"bus"
],
props
:
{
props
:
{
scheduleData
:
{
type
:
Object
,
default
:
()
=>
({}),
},
mountDatas
:
{
mountDatas
:
{
type
:
Object
,
type
:
Object
,
default
:
()
=>
({}),
default
:
()
=>
({}),
...
@@ -457,18 +452,9 @@ export default {
...
@@ -457,18 +452,9 @@ export default {
type
:
Object
,
type
:
Object
,
default
:
()
=>
({}),
default
:
()
=>
({}),
},
},
_index
:
Number
,
lineLableName
:
{
type
:
String
,
default
:
()
=>
""
,
},
},
},
data
()
{
data
()
{
return
{
return
{
aiPopup
:
null
,
timerList
:
[],
timers
:
[],
aiNameList
:
[],
backgroundStyle
:
{
backgroundStyle
:
{
"background-position-y"
:
0
,
"background-position-y"
:
0
,
},
},
...
@@ -528,18 +514,13 @@ export default {
...
@@ -528,18 +514,13 @@ export default {
Img
:
require
(
"./assets/images/游泳检测.svg"
),
Img
:
require
(
"./assets/images/游泳检测.svg"
),
},
},
],
],
setIntervalzoom
:
null
,
ygisCenterFlag
:
false
,
ygisCenterFlag
:
false
,
ygValue
:
null
,
ygValue
:
null
,
showCenter
:
false
,
//开启瞄准
showCenter
:
false
,
//开启瞄准
fuseFlag
:
true
,
//清流是否进行视频融合true为融合
controlflag
:
false
,
//清流 是否需要画中画主次画面切换,true为切换
screenRecordingStatus
:
false
,
//是否录制中
screenRecordingStatus
:
false
,
//是否录制中
infoshow
:
false
,
//清流视频信息展示
showInfo
:
false
,
//清流视频信息展示
infoData
:
null
,
//清流信息
infoData
:
null
,
//清流信息
raw_msg
:
0
,
raw_msg
:
0
,
imgshow
:
false
,
//·
imgshowurl
:
""
,
//弹出的图片路径
carList
:
[],
//车牌识别结果
carList
:
[],
//车牌识别结果
aiVisible
:
false
,
//打开ai
aiVisible
:
false
,
//打开ai
pid
:
null
,
pid
:
null
,
...
@@ -549,9 +530,8 @@ export default {
...
@@ -549,9 +530,8 @@ export default {
cartrafficShow
:
false
,
cartrafficShow
:
false
,
trafficData
:
{},
trafficData
:
{},
cartrafficData
:
{},
cartrafficData
:
{},
flag
:
true
,
showPlayer
:
true
,
// 显示播放器, 用于刷新播放器
isPlay
:
true
,
smallFPV
:
true
,
// FPV小化显示
videoFlag
:
true
,
isStatus
:
false
,
isStatus
:
false
,
big
:
""
,
big
:
""
,
streamSelect
:
""
,
//选择的流
streamSelect
:
""
,
//选择的流
...
@@ -583,10 +563,7 @@ export default {
...
@@ -583,10 +563,7 @@ export default {
seven
:
-
15
,
seven
:
-
15
,
},
},
isInfoShow
:
false
,
isInfoShow
:
false
,
osdFlage
:
true
,
openOSD
:
true
,
// 是否开启OSD
AISetInterval
:
null
,
aiLable
:
""
,
aiFlag
:
false
,
showFlywayAction
:
false
,
//显示航点动作
showFlywayAction
:
false
,
//显示航点动作
};
};
},
},
...
@@ -610,7 +587,8 @@ export default {
...
@@ -610,7 +587,8 @@ export default {
return
"QingLiuPlayer"
;
return
"QingLiuPlayer"
;
case
"webrtc"
:
case
"webrtc"
:
return
"LiveNVRPlayer"
;
// return "LiveNVRPlayer";
return
"SRSPlayer"
;
default
:
default
:
return
"LiveNVRPlayer"
;
return
"LiveNVRPlayer"
;
...
@@ -633,17 +611,6 @@ export default {
...
@@ -633,17 +611,6 @@ export default {
return
find
?.
label
||
""
;
return
find
?.
label
||
""
;
},
},
taskId
()
{
if
(
window
.
location
.
hash
.
includes
(
"accident"
))
{
return
this
.
$store
.
state
.
fckernel
.
YJtaskId
;
}
else
{
return
this
.
$store
.
state
.
fckernel
.
taskId
;
}
},
lineInfo
()
{
return
this
.
$store
.
state
.
fckernel
.
lineInfo
;
},
/**
/**
* 网络类型
* 网络类型
* @returns 专网 | 公网
* @returns 专网 | 公网
...
@@ -707,65 +674,9 @@ export default {
...
@@ -707,65 +674,9 @@ export default {
healthData
()
{
healthData
()
{
return
this
.
uavRealTimeData
.
healthData
;
return
this
.
uavRealTimeData
.
healthData
;
},
},
showPanel
()
{
return
this
.
$store
.
state
.
MMCFlightControlCenter
.
uavApplications
.
showPanel
;
},
showPlayer
()
{
return
this
.
$store
.
state
.
MMCFlightControlCenter
.
uavApplications
.
showPlayer
;
},
},
},
watch
:
{
watch
:
{
/* pointListFlag(val) {
if (val) {
let width = this.$refs.video.clientWidth;
let height = this.$refs.video.clientHeight;
let fullWidth = window.innerWidth;
let fullHeight = window.innerHeight - 100;
let centerX = fullWidth / 2 - width / 2;
let centerY = fullHeight / 2 - height / 2;
this.$refs.wrap.setAttribute("data-x", centerX);
this.$refs.wrap.setAttribute("data-y", centerY);
this.$refs.wrap.setAttribute(
"style",
`transform: translate(${centerX}px, ${50}px)`
);
this.big = "big_02";
}
}, */
// 获取航点
scheduleData
(
val
)
{
console
.
log
(
"获取航点"
,
val
);
let
data
=
{
hardId
:
this
.
device
.
hardId
,
mqttType
:
false
,
id
:
this
.
device
.
id
,
};
this
.
lineAi
(
val
,
data
);
},
NXdata
(
val
)
{
if
(
val
.
messageID
==
2043
)
{
// console.log(val,"valnx")
if
(
val
.
data
.
osdstatus
==
"false"
)
{
this
.
osdFlage
=
false
;
}
else
{
this
.
osdFlage
=
true
;
}
}
},
lineLableName
(
val
)
{
this
.
aiFlag
=
true
;
this
.
aiLable
=
val
;
console
.
log
(
val
,
"lineLableName"
);
},
infoData
:
function
()
{
// this.qoeInform(this.raw_msg);
},
raw_msg
:
function
(
newval1
)
{
// this.qoeInform(this.raw_msg);
},
uavRealTimeData
:
function
(
newval
)
{
uavRealTimeData
:
function
(
newval
)
{
let
gps
=
null
;
let
gps
=
null
;
if
(
if
(
...
@@ -812,21 +723,12 @@ export default {
...
@@ -812,21 +723,12 @@ export default {
this
.
streamSelect
=
""
;
//网络类型改变时,未有当前选择的流类型, 则重置
this
.
streamSelect
=
""
;
//网络类型改变时,未有当前选择的流类型, 则重置
}
}
},
},
// 结束任务时触发
"$store.state.fckernel.uav_task_status"
(
val
)
{
console
.
log
(
"清除识别点2"
);
if
(
val
&&
this
.
aiPopup
)
{
// 清除AI识别标记点
this
.
aiPopup
.
removeAll
();
}
},
deep
:
true
,
},
},
async
mounted
()
{
async
mounted
()
{
window
.
$uavPlayer
=
this
;
window
.
$uavPlayer
=
this
;
// this.wrapCenter();
// this.wrapCenter();
//视屏截图
//视屏截图
this
.
bus
.
$on
(
"uav
_take_p
hoto"
,
({
callback
})
=>
{
this
.
bus
.
$on
(
"uav
TakeP
hoto"
,
({
callback
})
=>
{
let
blob
=
this
.
screenShot
();
let
blob
=
this
.
screenShot
();
callback
&&
callback
(
blob
);
callback
&&
callback
(
blob
);
});
});
...
@@ -840,7 +742,6 @@ export default {
...
@@ -840,7 +742,6 @@ export default {
window
.
removeEventListener
(
"resize"
,
this
.
fullScreenChangeFn
);
window
.
removeEventListener
(
"resize"
,
this
.
fullScreenChangeFn
);
},
},
methods
:
{
methods
:
{
...
methods
,
...
fkutils
,
...
fkutils
,
startLinePoint
()
{
startLinePoint
()
{
let
gps
=
{};
let
gps
=
{};
...
@@ -856,22 +757,11 @@ export default {
...
@@ -856,22 +757,11 @@ export default {
}
}
}
}
this
.
showFlywayAction
=
true
;
if
(
this
.
uavRealTimeData
&&
gps
&&
gps
.
relativeAlt
>
20
)
{
/* if (this.uavRealTimeData && gps && gps.relativeAlt > 20) {
this
.
showFlywayAction
=
true
;
this.$emit("startLinePoint");
}
else
{
}
else
{
this
.
$message
.
warning
(
"当前高度不可创建航点动作!"
);
this
.
$message
.
warning
(
"当前高度不可创建航点动作!"
);
} */
}
},
setAll
()
{
let
data
=
{
hardId
:
this
.
device
.
hardId
,
mqttType
:
false
,
};
this
.
timers
.
forEach
((
val
)
=>
{
data
.
aiType
=
val
;
this
.
lineAi
(
this
.
scheduleData
,
data
);
});
},
},
async
checkUseOperateFn
(
device
)
{
async
checkUseOperateFn
(
device
)
{
// 查看是否有控制权限
// 查看是否有控制权限
...
@@ -883,172 +773,6 @@ export default {
...
@@ -883,172 +773,6 @@ export default {
return
true
;
return
true
;
}
}
},
},
getUavInfo
()
{
this
.
isInfoShow
=
!
this
.
isInfoShow
;
},
//OSD无人机信息
async
getOSD
()
{
let
res
=
await
this
.
checkUseOperateFn
(
this
.
device
.
hardId
);
if
(
!
res
)
{
return
false
;
}
this
.
osdFlage
=
!
this
.
osdFlage
;
let
data
=
null
;
if
(
this
.
osdFlage
)
{
data
=
{
data
:
{
messageID
:
1042
,
data
:
{
status
:
"true"
,
},
},
type
:
528
,
};
this
.
$message
.
success
(
"开启OSD"
);
}
else
{
data
=
{
data
:
{
messageID
:
1042
,
data
:
{
status
:
"false"
,
},
},
type
:
528
,
};
this
.
$message
.
success
(
"关闭OSD"
);
}
console
.
log
(
data
,
"data---eeeeeeeee"
);
this
.
$emit
(
"fn"
,
data
);
},
setFlyInfo
()
{
if
(
this
.
device
.
anotherName
&&
this
.
device
.
anotherName
.
indexOf
(
"-"
)
>
-
1
)
{
let
arr
=
this
.
device
.
anotherName
.
split
(
"-"
);
this
.
device
.
ername
=
arr
[
0
];
this
.
device
.
sanname
=
arr
[
1
];
}
else
{
this
.
device
.
ername
=
this
.
device
.
anotherName
;
}
let
nxdata
=
{
city
:
"盐城市"
,
county
:
this
.
device
.
ername
,
// "policeStation":this.device.sanname || '',
flyname
:
this
.
device
.
name
,
};
if
(
this
.
device
.
sanname
)
{
nxdata
.
policeStation
=
this
.
device
.
sanname
;
}
let
data
=
{
data
:
{
messageID
:
1041
,
data
:
nxdata
,
},
type
:
528
,
};
this
.
$emit
(
"fn"
,
data
);
},
setAiMessage
()
{
let
data
=
{
data
:
{
messageID
:
1036
,
data
:
{
streamInputType
:
1
,
"line-crossing-Entry"
:
"1200;50;1200;800;120;360;1800;360;"
,
"line-crossing-Exit"
:
"1000;830;1000;90;120;400;1830;400;"
,
"line-crossing-classId"
:
"0;1;2;3"
,
"line-crossing-enable"
:
1
,
classList
:
[
{
className
:
"person"
,
classID
:
0
,
},
{
className
:
"car"
,
classID
:
1
,
},
],
},
},
type
:
528
,
};
this
.
$emit
(
"fn"
,
data
);
let
data2
=
{
data
:
{
messageID
:
1037
,
data
:
{},
},
type
:
528
,
};
this
.
$emit
(
"fn"
,
data2
);
},
qoeInform
(
raw_msg
)
{
let
{
infoData
}
=
this
;
let
{
hardId
,
udpStatus
,
cateId
,
cateName
,
deviceName
,
flightState
,
goodsName
,
reportStatus
,
socketStatus
,
state
,
stationType
,
store
,
firmId
,
firmName
,
}
=
this
.
device
;
let
data
=
{
uavId
:
hardId
,
udpStatus
,
cateId
,
cateName
,
deviceName
,
flightState
,
goodsName
,
reportStatus
,
socketStatus
,
state
,
stationType
,
store
,
firmId
,
firmName
,
info
:
{
bitrate
:
raw_msg
?
raw_msg
/
1000
+
"kbps"
:
"0kbps"
,
venc_avg
:
infoData
?
infoData
.
venc_avg
/
1000
+
"ms"
:
"0ms"
,
venc_last
:
infoData
?
infoData
.
venc_last
/
1000
+
"ms"
:
"0ms"
,
pushrtt_avg
:
infoData
?
infoData
.
pushrtt_avg
[
0
]
/
1000
+
"ms"
:
"0ms"
,
pushrtt_last
:
infoData
?
infoData
.
pushrtt_last
[
0
]
/
1000
+
"ms"
:
"0ms"
,
recvrtt_avg
:
infoData
?
infoData
.
recvrtt_avg
[
0
]
/
1000
+
"ms"
:
"0ms"
,
recvrtt_last
:
infoData
?
infoData
.
recvrtt_last
[
0
]
/
1000
+
"ms"
:
"0ms"
,
pushretrans_avg
:
infoData
?
(
infoData
.
pushretrans_avg
[
0
]
*
0.1
).
toFixed
(
2
)
+
"%"
:
"0%"
,
pushretrans_last
:
infoData
?
(
infoData
.
pushretrans_last
[
0
]
*
0.1
).
toFixed
(
2
)
+
"%"
:
"0%"
,
recvretrans_avg
:
infoData
?
(
infoData
.
recvretrans_avg
[
0
]
*
0.1
).
toFixed
(
2
)
+
"%"
:
"0%"
,
recvretrans_last
:
infoData
?
(
infoData
.
recvretrans_last
[
0
]
*
0.1
).
toFixed
(
2
)
+
"%"
:
"0%"
,
vdec
:
infoData
?
infoData
.
vdec
/
1000
+
"ms"
:
"0ms"
,
vbuffer
:
infoData
?
infoData
.
vbuffer
/
1000
+
"ms"
:
"0ms"
,
},
};
API
.
QINGLIU
.
qoeInform
(
data
);
},
videoModelChangeFn
(
streamData
)
{
this
.
$emit
(
"fn"
,
streamData
);
},
showCenterFn
()
{
showCenterFn
()
{
this
.
showCenter
=
!
this
.
showCenter
;
this
.
showCenter
=
!
this
.
showCenter
;
},
},
...
@@ -1064,10 +788,10 @@ export default {
...
@@ -1064,10 +788,10 @@ export default {
}
}
},
},
getInfo
()
{
getInfo
()
{
this
.
infoshow
=
!
this
.
infoshow
;
this
.
showInfo
=
!
this
.
showInfo
;
},
},
async
change
()
{
async
change
()
{
this
.
videoFlag
=
!
this
.
videoFlag
;
this
.
smallFPV
=
!
this
.
smallFPV
;
},
},
//监听屏幕是否全屏
//监听屏幕是否全屏
fullScreenChangeFn
(
e
)
{
fullScreenChangeFn
(
e
)
{
...
@@ -1078,7 +802,7 @@ export default {
...
@@ -1078,7 +802,7 @@ export default {
}
}
},
},
close
(
data
)
{
close
(
data
)
{
this
.
$emit
(
'close'
);
this
.
$emit
(
"close"
);
},
},
screen
()
{
screen
()
{
if
(
this
.
playerCom
===
"LiveNVRPlayer"
)
{
if
(
this
.
playerCom
===
"LiveNVRPlayer"
)
{
...
@@ -1092,28 +816,18 @@ export default {
...
@@ -1092,28 +816,18 @@ export default {
play
()
{
play
()
{
if
(
this
.
playerCom
===
"LiveNVRPlayer"
)
{
if
(
this
.
playerCom
===
"LiveNVRPlayer"
)
{
this
.
$refs
.
player
.
$refs
[
"livePlayer"
].
pause
();
this
.
$refs
.
player
.
$refs
[
"livePlayer"
].
pause
();
this
.
isPlay
=
false
;
}
}
},
},
pause
()
{
pause
()
{
if
(
this
.
playerCom
===
"LiveNVRPlayer"
)
{
if
(
this
.
playerCom
===
"LiveNVRPlayer"
)
{
this
.
$refs
.
player
.
$refs
[
"livePlayer"
].
play
();
this
.
$refs
.
player
.
$refs
[
"livePlayer"
].
play
();
this
.
isPlay
=
true
;
}
}
},
},
async
reset
()
{
async
reset
()
{
this
.
flag
=
false
;
this
.
showPlayer
=
false
;
this
.
$nextTick
(()
=>
{
this
.
$nextTick
(()
=>
{
this
.
flag
=
true
;
this
.
showPlayer
=
true
;
});
});
// if (this.taskId) {
// let dataRun = {
// taskId: this.taskId,
// typeId: 3,
// deviceId: this.device.id
// };
// let run = await API.FCKERNEL.saveDeviceRunMonitorLog(dataRun);
// }
},
},
changeBig
(
id
)
{
changeBig
(
id
)
{
this
.
big
=
"big_0"
+
id
;
this
.
big
=
"big_0"
+
id
;
...
@@ -1180,9 +894,6 @@ export default {
...
@@ -1180,9 +894,6 @@ export default {
}
}
);
);
},
},
clearInter
()
{
clearInterval
(
this
.
AISetInterval
);
},
//游泳识别
//游泳识别
async
aiIdentifyType
(
aiType
)
{
async
aiIdentifyType
(
aiType
)
{
const
data
=
{
const
data
=
{
...
@@ -1193,56 +904,6 @@ export default {
...
@@ -1193,56 +904,6 @@ export default {
};
};
this
.
aiIdentify
(
data
,
true
);
this
.
aiIdentify
(
data
,
true
);
},
},
async
photoGuide
()
{
// if (!this.taskId) {
// this.$message.error("暂无任务!");
// return;
// }
let
blob
=
this
.
screenShot
();
console
.
log
(
blob
,
"blob"
);
saveAs
(
blob
,
"交通拍照.png"
);
let
fd
=
new
FormData
();
fd
.
append
(
"uploadFile"
,
blob
,
`拍照.png`
);
if
(
this
.
taskId
)
{
fd
.
append
(
"taskId"
,
this
.
taskId
);
}
fd
.
append
(
"hardId"
,
this
.
device
.
hardId
);
let
res
=
await
API
.
FCKERNEL
.
Upload
(
fd
);
if
(
this
.
taskId
)
{
let
dataRun
=
{
taskId
:
this
.
taskId
,
typeId
:
1
,
deviceId
:
this
.
device
.
id
,
};
// 运行日志
let
run
=
await
API
.
FCKERNEL
.
saveDeviceRunMonitorLog
(
dataRun
);
}
console
.
log
(
this
.
uavRealTimeData
);
let
{
latitude
,
longitude
}
=
this
.
uavRealTimeData
.
locationCoordinate3D
;
console
.
log
(
this
.
uavRealTimeData
,
"uavRealTimeData"
);
let
address
=
await
API
.
MAP
.
AiRegeo
({
location
:
`
${
longitude
}
,
${
latitude
}
`
,
});
let
addr
=
address
.
province
.
value
+
address
.
city
.
value
+
address
.
dist
.
value
+
address
.
road
.
roadname
+
address
.
poi
;
this
.
$message
.
success
(
"截图成功!"
);
let
imgshowurl
=
process
.
env
.
VUE_APP_IMG_URL
+
"/uploads"
+
res
.
fileKey
;
const
img
=
"opt/uploads"
+
res
.
fileKey
;
if
(
this
.
taskId
)
{
await
API
.
FCKERNEL
.
addTrafficTrouble
({
images
:
img
,
taskId
:
this
.
taskId
,
types
:
0
,
position
:
addr
||
""
,
arrivalTime
:
dayjs
().
format
(
"YYYY/MM/DD hh:mm:ss"
),
});
}
this
.
$emit
(
"imgUrl"
,
imgshowurl
);
},
async
photo
()
{
async
photo
()
{
let
blob
=
this
.
$refs
.
player
.
screenShot
();
let
blob
=
this
.
$refs
.
player
.
screenShot
();
if
(
blob
)
{
if
(
blob
)
{
...
@@ -1302,9 +963,9 @@ export default {
...
@@ -1302,9 +963,9 @@ export default {
});
});
},
},
/**
/**
*
视频指点
*
挂载镜头控制
*/
*/
async
fn
(
el
)
{
async
lensControl
(
el
)
{
// let mountData =this.$store.state.device.move_data
// let mountData =this.$store.state.device.move_data
let
{
device
,
mountData
}
=
this
;
let
{
device
,
mountData
}
=
this
;
// if mountStatus =1 代表启用 屏幕指点功能
// if mountStatus =1 代表启用 屏幕指点功能
...
@@ -1316,7 +977,7 @@ export default {
...
@@ -1316,7 +977,7 @@ export default {
let
evt
=
window
.
event
||
el
;
let
evt
=
window
.
event
||
el
;
var
div
=
null
;
var
div
=
null
;
if
(
this
.
streamSelect
==
"Q
ingLiu
"
)
{
if
(
this
.
streamSelect
==
"Q
INGLIU
"
)
{
// div = document.getElementById("canvas_layer0") ;
// div = document.getElementById("canvas_layer0") ;
div
=
document
.
getElementsByClassName
(
"qingliu"
)[
0
];
div
=
document
.
getElementsByClassName
(
"qingliu"
)[
0
];
}
else
{
}
else
{
...
@@ -1348,7 +1009,36 @@ export default {
...
@@ -1348,7 +1009,36 @@ export default {
}
}
let
mounteList
=
{
data
:
buffer
,
...
mountData
};
let
mounteList
=
{
data
:
buffer
,
...
mountData
};
if
(
buffer
)
{
if
(
buffer
)
{
this
.
$emit
(
"directiveFn"
,
mounteList
);
if
(
this
.
device
.
network
===
1
)
{
let
topic
=
"PX4/OBTAIN/"
+
this
.
device
.
hardId
;
this
.
$store
.
dispatch
(
"MMCMQTT/publish"
,
{
topic
:
topic
,
data
:
{
type
:
514
,
data
:
{
mountId
:
this
.
mounteList
.
mountId
,
payload
:
mounteList
.
data
,
},
},
callback
()
{
console
.
log
(
"挂载镜头控制成功"
);
},
});
}
else
{
let
sendData
=
{
type
:
200
,
data
:
{
cmdControlType
:
7000
,
cmdFunction
:
null
,
cmdState
:
null
,
cmdValue
:
null
,
cmdBuffer
:
mounteList
.
data
.
join
(
","
),
cmdName
:
mounteList
.
name
,
},
deviceHardId
:
mounteList
.
hardId
,
};
this
.
$store
.
dispatch
(
"MMCGroundStation/publish"
,
sendData
);
}
}
}
}
}
},
},
...
...
src/components/MMCFlightControlCenter/components/uavApplications/index.vue
浏览文件 @
b245a574
...
@@ -5,13 +5,8 @@
...
@@ -5,13 +5,8 @@
class=
"player"
class=
"player"
ref=
"player"
ref=
"player"
v-if=
"showPlayer && uav"
v-if=
"showPlayer && uav"
:pointListFlag=
"pointListFlag"
@
imgUrl=
"getimgUrl"
@
startLinePoint=
"startLinePoint"
:scheduleData=
"scheduleData"
:NXdata=
"NXdata"
:lineLableName=
"lineLableName"
:device=
"uav"
:device=
"uav"
:mountDatas=
"selectMount"
@
close=
"onPlayerClose"
@
close=
"onPlayerClose"
/>
/>
<ControlPanel
v-if=
"showPanel"
></ControlPanel>
<ControlPanel
v-if=
"showPanel"
></ControlPanel>
...
@@ -37,10 +32,7 @@ export default {
...
@@ -37,10 +32,7 @@ export default {
return
{
return
{
pointListFlag
:
false
,
pointListFlag
:
false
,
aiPopup
:
null
,
//识别图标
aiPopup
:
null
,
//识别图标
scheduleData
:
{},
//航线执行进度
keyFlag
:
false
,
//NX状态
keyFlag
:
false
,
//NX状态
NXdata
:
{},
//NX数据
lineLableName
:
""
,
//当前航线标签
videoItem
:
0
,
videoItem
:
0
,
showCenter
:
false
,
showCenter
:
false
,
};
};
...
@@ -50,6 +42,7 @@ export default {
...
@@ -50,6 +42,7 @@ export default {
"uav"
,
"uav"
,
"showPlayer"
,
"showPlayer"
,
"showPanel"
,
"showPanel"
,
"selectMount"
]),
]),
taskId
()
{
taskId
()
{
return
this
.
$store
.
state
.
fckernel
.
taskId
;
return
this
.
$store
.
state
.
fckernel
.
taskId
;
...
@@ -82,15 +75,6 @@ export default {
...
@@ -82,15 +75,6 @@ export default {
mounted
()
{},
mounted
()
{},
beforeDestroy
()
{},
beforeDestroy
()
{},
methods
:
{
methods
:
{
startLinePoint
()
{
this
.
pointListFlag
=
!
this
.
pointListFlag
;
if
(
this
.
pointListFlag
)
{
this
.
pointFlag
=
true
;
setTimeout
(()
=>
{
this
.
pointFlag
=
false
;
},
1000
);
}
},
getcanvas
(
val
,
item
)
{
getcanvas
(
val
,
item
)
{
let
data
=
null
;
let
data
=
null
;
if
(
item
.
jsonData
)
{
if
(
item
.
jsonData
)
{
...
@@ -350,60 +334,6 @@ export default {
...
@@ -350,60 +334,6 @@ export default {
});
});
}
}
},
},
async
getimgUrl
(
val
,
aiType
,
item
)
{
this
.
aiType
=
aiType
;
this
.
imgshow
=
true
;
this
.
imgshowurl
=
val
;
//人流
if
(
aiType
==
3
)
{
this
.
aiTotal
=
item
.
detectPersonCount
;
this
.
getcanvas
(
val
,
item
);
}
//车流
if
(
aiType
==
13
)
{
// this.aiTotal = item.detectPersonCount;
let
data
=
JSON
.
parse
(
item
.
jsonData
).
label
;
console
.
log
(
data
,
"datatat"
);
let
car
=
""
;
let
van
=
""
;
let
truck
=
""
;
let
bus
=
""
;
for
(
let
t
in
data
)
{
if
(
t
==
"car"
&&
data
[
"car"
])
{
car
=
"小轿车"
+
data
[
"car"
]
+
"辆"
;
}
else
if
(
t
==
"truck"
&&
data
[
"truck"
])
{
truck
=
"卡车"
+
data
[
"truck"
]
+
"辆"
;
}
else
if
(
t
==
"van"
&&
data
[
"van"
])
{
van
=
"面包车"
+
data
[
"van"
]
+
"辆"
;
}
else
if
(
t
==
"bus"
&&
data
[
"bus"
])
{
bus
=
"巴士"
+
data
[
"bus"
]
+
"辆"
;
}
}
this
.
aiTotal
=
car
+
truck
+
van
+
bus
;
this
.
getcanvas
(
val
,
item
);
}
//游泳
if
(
aiType
>=
4
)
{
this
.
getcanvas
(
val
,
item
);
}
//人脸
if
(
aiType
==
1
||
aiType
==
2
)
{
let
data
=
{
fileKey
:
item
.
visitUrl
,
aiType
:
aiType
,
};
let
res
=
await
API
.
FCKERNEL
.
getFaceResultByFileKey
(
data
);
if
(
aiType
==
1
)
{
this
.
faceList
=
res
.
faceImageInfo
?.
faceResults
;
this
.
faceShow
=
true
;
this
.
getcanvas
(
val
,
res
.
faceImageInfo
);
}
else
{
this
.
carList
=
res
.
aiPlateShiJuResultInfoDtoList
;
this
.
carShow
=
true
;
this
.
getcanvas
(
val
,
res
);
}
}
},
onPlayerClose
(){
onPlayerClose
(){
this
.
$store
.
dispatch
(
"MMCFlightControlCenter/uavApplications/showPlayer"
,
this
.
uav
);
this
.
$store
.
dispatch
(
"MMCFlightControlCenter/uavApplications/showPlayer"
,
this
.
uav
);
}
}
...
...
src/components/MMCFlightControlCenter/store/uavApplications.js
浏览文件 @
b245a574
...
@@ -882,13 +882,6 @@ const actions = {
...
@@ -882,13 +882,6 @@ const actions = {
},
},
});
});
}
else
{
}
else
{
// 地面站链路
window
.
$mmc
.
store
.
dispatch
(
"MMCGroundStation/order"
,
{
order
:
"指点飞行"
,
data
:
{},
deviceHardId
:
state
.
uav
.
hardId
,
});
data
?.
callback
&&
data
.
callback
(
true
);
}
}
},
},
/**
/**
...
@@ -936,13 +929,6 @@ const actions = {
...
@@ -936,13 +929,6 @@ const actions = {
},
},
});
});
}
else
{
}
else
{
// 地面站链路
window
.
$mmc
.
store
.
dispatch
(
"MMCGroundStation/order"
,
{
order
:
"指点飞行"
,
data
:
{},
deviceHardId
:
state
.
uav
.
hardId
,
});
data
?.
callback
&&
data
.
callback
(
true
);
}
}
},
},
/**
/**
...
@@ -961,13 +947,6 @@ const actions = {
...
@@ -961,13 +947,6 @@ const actions = {
},
},
});
});
}
else
{
}
else
{
// 地面站链路
window
.
$mmc
.
store
.
dispatch
(
"MMCGroundStation/order"
,
{
order
:
"指点飞行"
,
data
:
{},
deviceHardId
:
state
.
uav
.
hardId
,
});
data
?.
callback
&&
data
.
callback
(
true
);
}
}
},
},
...
@@ -987,13 +966,6 @@ const actions = {
...
@@ -987,13 +966,6 @@ const actions = {
},
},
});
});
}
else
{
}
else
{
// 地面站链路
window
.
$mmc
.
store
.
dispatch
(
"MMCGroundStation/order"
,
{
order
:
"指点飞行"
,
data
:
{},
deviceHardId
:
state
.
uav
.
hardId
,
});
data
?.
callback
&&
data
.
callback
(
true
);
}
}
},
},
...
...
编写
预览
Markdown
格式
0%
重试
或
添加新文件
添加附件
取消
您添加了
0
人
到此讨论。请谨慎行事。
请先完成此评论的编辑!
取消
请
注册
或者
登录
后发表评论