Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
K
kd_control
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
zhanglw
kd_control
Commits
31213c25
Commit
31213c25
authored
Jul 25, 2023
by
zhanglw
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
矿山监控使用视频流服务flv视频流
parent
ffd50123
Changes
4
Hide whitespace changes
Inline
Side-by-side
Showing
4 changed files
with
60 additions
and
32 deletions
+60
-32
common.js
src/assets/js/common.js
+9
-0
EZUIKitJs.vue
src/components/ezuikit/EZUIKitJs.vue
+28
-7
index.vue
src/views/MLargeScreen/index.vue
+1
-1
index.vue
src/views/monitoringManagement/mineVideoSetUp/index.vue
+22
-24
No files found.
src/assets/js/common.js
View file @
31213c25
...
...
@@ -700,6 +700,15 @@ var HttpReq = function(){
return
res
})
},
mineMonitoringCameraUpdate
:
function
(
data
){
return
request
({
url
:
'
/api/cameraDetail/updateCameraDetail
'
,
method
:
'
PUT
'
,
data
:
data
,
}).
then
((
res
)
=>
{
return
res
})
},
mineMonitoringCameraDel
:
function
(
data
){
return
request
({
url
:
'
/api/cameraDetail/delCameraDetail
'
,
...
...
src/components/ezuikit/EZUIKitJs.vue
View file @
31213c25
...
...
@@ -16,7 +16,7 @@
<DPcomputer17
class=
"DPcomputer17Class"
></DPcomputer17>
<div
v-show=
"noPtz"
id=
"hkView"
class=
"noPtzVideo1"
>
<video
id=
"rtcStreamerVideo"
c
ontrols
style=
"width: 100%;height: 100%;"
>
<video
id=
"rtcStreamerVideo"
c
lass=
"video-js vjs-default-skin vjs-big-play-centered"
controls
preload=
"auto"
data-setup=
"
{}" style="width: 100%;height: 100%;" autoplay
>
您的浏览器不支持:HTML5 video.
</video>
<el-button
class=
"noPtzCloseStyle"
type=
"danger"
icon=
"el-icon-close"
@
click=
"noPtzCloseFn()"
size=
"mini"
>
关闭
...
...
@@ -30,6 +30,7 @@
<
script
>
import
{
Tools
,
HttpReq
,
Dates
}
from
'
@/assets/js/common.js
'
;
import
DPcomputer17
from
'
../../views/MLargeScreen/components/smallComponents/DPcomputer17.vue
'
import
{
flvjs
}
from
'
@/assets/js/flv.js
'
;
export
default
{
components
:
{
...
...
@@ -42,6 +43,7 @@ export default {
children
:
"
children
"
,
label
:
"
label
"
,
},
flvPlayer
:
null
,
noPtz
:
false
,
webRtcServer
:
null
,
cameraUrl
:
`hk/index.html?ip=192.168.0.54&port=80&un=admin&pw=gemho10-7`
,
...
...
@@ -81,18 +83,37 @@ export default {
}
})
},
stopPlay
(){
if
(
this
.
flvPlayer
&&
this
.
flvPlayer
.
_msectl
&&
this
.
flvPlayer
.
e
){
this
.
flvPlayer
.
pause
();
this
.
flvPlayer
.
unload
();
this
.
flvPlayer
.
detachMediaElement
();
this
.
flvPlayer
.
destroy
();
this
.
flvPlayer
=
null
}
},
handleNodeClick
(
data
)
{
this
.
$parent
.
closeHkView
();
if
(
data
.
children
)
{
return
;
}
this
.
noPtz
=
true
;
// this.cameraUrl = `hk/index.html?ip=${data.cameraIp}&port=${data.port}&un=${data.userName}&pw=${data.passWord}`;
this
.
webRtcServer
=
new
WebRtcStreamer
(
"
rtcStreamerVideo
"
,
"
http://39.164.225.220:5007
"
);
// this.webRtcServer.connect(`rtsp://admin:hik12345+@10.10.203.11:554/h264/ch1/main/av_stream`);
this
.
webRtcServer
.
connect
(
`rtsp://
${
data
.
userName
}
:
${
data
.
passWord
}
@
${
data
.
cameraIp
}
:554/h264/ch1/main/av_stream`
);
// this.webRtcServer = new WebRtcStreamer("rtcStreamerVideo","http://192.168.3.38:8041");
// this.webRtcServer.connect(`rtsp://admin:gemho10-7@192.168.0.54:554/h264/ch1/main/av_stream`);
// this.webRtcServer = new WebRtcStreamer("rtcStreamerVideo","http://39.164.225.220:5007");
// this.webRtcServer.connect(`rtsp://${data.userName}:${data.passWord}@${data.cameraIp}:554/h264/ch1/main/av_stream`);
if
(
flvjs
.
isSupported
())
{
this
.
flvPlayer
&&
this
.
stopPlay
();
this
.
flvPlayer
=
flvjs
.
createPlayer
({
type
:
"
flv
"
,
isLive
:
true
,
hasAudio
:
false
,
url
:
data
.
url
,
});
this
.
flvPlayer
.
attachMediaElement
(
document
.
getElementById
(
"
rtcStreamerVideo
"
));
this
.
flvPlayer
.
load
();
}
else
{
console
.
log
(
"
不支持的格式
"
);
}
},
noPtzCloseFn
()
{
if
(
this
.
webRtcServer
){
...
...
src/views/MLargeScreen/index.vue
View file @
31213c25
...
...
@@ -71,7 +71,7 @@
<!--
</div>
-->
<!-- 嵌入三维地图页面 -->
<!--
<iframe
:src=
"url"
frameborder=
"0"
class=
"mapcontainer1"
></iframe>
-->
<iframe
ref=
"iframe"
src=
"http://39.164.225.220:5001//#/Index"
frameborder=
"0"
class=
"mapcontainer1"
></iframe
>
<!--
<iframe
ref=
"iframe"
src=
"http://39.164.225.220:5001//#/Index"
frameborder=
"0"
class=
"mapcontainer1"
></iframe>
--
>
<!--
<iframe
ref=
"iframe"
src=
"http://192.168.3.38:3002/#/Index"
frameborder=
"0"
class=
"mapcontainer1"
></iframe>
-->
<!-- 单个车辆视频监控 -->
...
...
src/views/monitoringManagement/mineVideoSetUp/index.vue
View file @
31213c25
...
...
@@ -54,10 +54,11 @@
<el-table
:data=
"cameraDetail"
border
style=
"width: 100%"
height=
"710"
>
<el-table-column
prop=
"id"
label=
"NO."
align=
"center"
width=
"60"
></el-table-column>
<el-table-column
prop=
"cameraName"
label=
"摄像头名称"
align=
"left"
></el-table-column>
<el-table-column
prop=
"
streamName"
label=
"视频流名称
"
align=
"left"
></el-table-column>
<el-table-column
prop=
"cameraIp"
label=
"IP地址"
align=
"left"
></el-table-column
>
<el-table-column
prop=
"
url"
label=
"直播视频源
"
align=
"left"
></el-table-column>
<!-- <el-table-column prop="cameraIp" label="IP地址" align="left"></el-table-column>--
>
<el-table-column
label=
"操作"
width=
"150"
align=
"center"
>
<
template
slot-scope=
"scope"
>
<el-button
size=
"mini"
round
type=
"success"
@
click=
"cameraDetaileEdit('edit', scope.row)"
>
修改
</el-button>
<el-button
size=
"mini"
round
type=
"danger"
@
click=
"cameraDetaileDelete(scope.row)"
>
删除
</el-button>
</
template
>
</el-table-column>
...
...
@@ -69,15 +70,15 @@
<el-form-item
label=
"摄像头名称"
style=
"margin-bottom:15px;"
prop=
"cameraName"
>
<el-input
v-model=
"cameraDetailData.cameraName"
></el-input>
</el-form-item>
<el-form-item
label=
"
视频流名称
"
style=
"margin-bottom:15px;"
prop=
"streamName"
>
<el-input
v-model=
"cameraDetailData.
streamName
"
></el-input>
<el-form-item
label=
"
直播视频源
"
style=
"margin-bottom:15px;"
prop=
"streamName"
>
<el-input
v-model=
"cameraDetailData.
url
"
></el-input>
</el-form-item>
<el-form-item
label=
"IP地址"
style=
"margin-bottom:15px;"
prop=
"cameraIp"
>
<el-input
v-model=
"cameraDetailData.cameraIp"
></el-input
>
</el-form-item
>
<!-- <el-form-item label="端口" style="margin-bottom:15px;"
>
<el-input v-model="cameraDetailData.cameraPort"></el-input
>
</el-form-item>
-->
<!-- <el-form-item label="IP地址" style="margin-bottom:15px;" prop="cameraIp">--
>
<!-- <el-input v-model="cameraDetailData.cameraIp"></el-input>--
>
<!-- </el-form-item>--
>
<!-- <el-form-item label="端口" style="margin-bottom:15px;">--
>
<!-- <el-input v-model="cameraDetailData.cameraPort"></el-input>--
>
<!-- </el-form-item>
-->
</el-form>
<span
slot=
"footer"
class=
"dialog-footer"
>
<el-button
@
click=
"cameraDetaileCancel()"
style=
"padding:10px;"
>
取 消
</el-button>
...
...
@@ -262,7 +263,7 @@ export default {
if
(
this
.
cameraDetailType
==
"
add
"
){
this
.
cameraDetailTitle
=
"
增加摄像头
"
;
this
.
disabledInp
=
false
;
}
else
if
(
this
.
cameraDetailType
==
"
change
"
){
}
else
if
(
this
.
cameraDetailType
==
"
edit
"
){
this
.
cameraDetailTitle
=
"
修改摄像头
"
;
this
.
cameraDetailData
=
{...
row
};
this
.
disabledInp
=
true
;
...
...
@@ -273,7 +274,6 @@ export default {
if
(
valid
)
{
if
(
this
.
cameraDetailType
==
"
add
"
){
this
.
cameraDetailData
.
cameraId
=
this
.
camID
;
console
.
log
(
this
.
cameraDetailData
);
HttpReq
.
truckDispatching
.
mineMonitoringCameraAdd
(
this
.
cameraDetailData
).
then
((
res
)
=>
{
this
.
$message
.
success
(
'
添加成功
'
);
HttpReq
.
truckDispatching
.
mineMonitoringCameraQuery
({
page
:
0
,
size
:
100
,
cameraId
:
this
.
camID
}).
then
((
res
)
=>
{
...
...
@@ -283,19 +283,17 @@ export default {
}).
catch
(
function
(
error
)
{
});
this
.
cameraDetailVisible
=
false
;
this
.
cameraDetailData
=
{};
}
else
if
(
this
.
cameraDetailType
==
"
change
"
){
let
that
=
this
;
let
newData
=
[];
this
.
cameraDetail
.
forEach
(
function
(
item
){
if
(
item
.
id
==
that
.
cameraDetailData
.
id
){
newData
.
push
(
that
.
cameraDetailData
);
}
else
{
newData
.
push
(
item
);
}
})
this
.
cameraDetail
=
newData
;
}
else
if
(
this
.
cameraDetailType
==
"
edit
"
){
this
.
cameraDetailData
.
cameraId
=
this
.
camID
;
HttpReq
.
truckDispatching
.
mineMonitoringCameraUpdate
(
this
.
cameraDetailData
).
then
((
res
)
=>
{
this
.
$message
.
success
(
'
修改成功
'
);
HttpReq
.
truckDispatching
.
mineMonitoringCameraQuery
({
page
:
0
,
size
:
100
,
cameraId
:
this
.
camID
}).
then
((
res
)
=>
{
console
.
log
(
"
mainCameraDetail
"
,
res
);
this
.
cameraDetail
=
res
.
content
})
}).
catch
(
function
(
error
)
{
});
this
.
cameraDetailVisible
=
false
;
this
.
cameraDetailData
=
{
id
:
""
,
cameraId
:
""
,
cameraName
:
""
,
streamName
:
""
,
cameraIp
:
""
,
cameraPort
:
""
,
cameraWay
:
""
};
this
.
cameraDetailData
=
{};
}
}
else
{
console
.
log
(
'
error submit!!
'
);
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment