Commit 39561e8d authored by 张牧越's avatar 张牧越

视频监控添加球机控制

parent 1678cbc4
......@@ -20,7 +20,26 @@ export async function getPlayBackUrl(id, params) {
return await request({
url: `/wisdom/screen/monitor/info/${id}`,
method: 'get',
params
params,
})
}
export function startCameraMove(id, params) {
return request({
url: `/wisdom/screen/monitor/control/start/${id}`,
method: `get`,
params,
noloading: true
})
}
export function stopCameraMove(id) {
return request({
url: `/wisdom/screen/monitor/control/stop/${id}`,
method: `get`,
noloading: true
})
}
\ No newline at end of file
@font-face {
font-family: "iconfont";
/* Project id 4100703 */
src: url('iconfont.woff2?t=1690536909939') format('woff2'),
url('iconfont.woff?t=1690536909939') format('woff'),
url('iconfont.ttf?t=1690536909939') format('truetype');
}
.iconfont {
font-family: "iconfont" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-zuo1:before {
content: "\e609";
}
.icon-nan:before {
content: "\e664";
}
.icon-nv:before {
content: "\e665";
}
.icon-shijian:before {
content: "\e85f";
}
.icon-jiaojufangda:before {
content: "\e602";
}
.icon-jiaojusuoxiao:before {
content: "\e603";
}
.icon-zhongxin:before {
content: "\e9e4";
}
.icon-youxia:before {
content: "\e9e0";
}
.icon-youshang:before {
content: "\e9e1";
}
.icon-you2:before {
content: "\e9e2";
}
.icon-jinjiaoju:before {
content: "\e9e3";
}
.icon-zuoxia:before {
content: "\e9e5";
}
.icon-zuo:before {
content: "\e9e6";
}
.icon-xia:before {
content: "\e9e7";
}
.icon-zuoshang:before {
content: "\e9e8";
}
.icon-fangda:before {
content: "\e9dd";
}
.icon-yuanjiaoju:before {
content: "\e9dc";
}
.icon-shang:before {
content: "\e9de";
}
.icon-suoxiao:before {
content: "\e9df";
}
.icon-report-fill-03:before {
content: "\e9cf";
}
.icon-report-fill-01:before {
content: "\e9d3";
}
.icon-report-fill-02:before {
content: "\e9d4";
}
.icon-report-fill-03-2:before {
content: "\e9d5";
}
.icon-you:before {
content: "\e600";
}
.icon-you1:before {
content: "\e706";
}
.icon-fl-renyuan:before {
content: "\e625";
}
.icon-anquanmao:before {
content: "\e9cb";
}
.icon-you-21:before {
content: "\e7b7";
}
.icon-shanchu-2:before {
content: "\e7b8";
}
.icon-you-23:before {
content: "\e7c4";
}
.icon-you-22:before {
content: "\e7d3";
}
.icon-you-2-2:before {
content: "\e7d4";
}
.icon-shang-01:before {
content: "\e8e3";
}
.icon-shang-02:before {
content: "\e8e4";
}
.icon-shanghun-2:before {
content: "\e9d0";
}
.icon-shanghun-3:before {
content: "\e9d1";
}
.icon-shanghun-1:before {
content: "\e9d2";
}
.icon-linbianfanghu-liebiao-2:before {
content: "\e9c9";
}
.icon-anquanmao-dangqianshiyong:before {
content: "\e9c1";
}
.icon-icon_ss:before {
content: "\e9c2";
}
.icon-shipinjiankong-1:before {
content: "\e9c3";
}
.icon-anquanmao-lishiguiji:before {
content: "\e9c4";
}
.icon-bofang:before {
content: "\e9c5";
}
.icon-tadiao:before {
content: "\e9c6";
}
.icon-shigongshengjiangji:before {
content: "\e9c7";
}
.icon-shipinjiankong-2:before {
content: "\e9c8";
}
.icon-linbianfanghu-liebiao-1:before {
content: "\e9ca";
}
.icon-yangchenzaoyin:before {
content: "\e9cc";
}
.icon-linbianfanghu-dingwei:before {
content: "\e9cd";
}
.icon-xieliaopingtai:before {
content: "\e9ce";
}
\ No newline at end of file
This diff is collapsed.
{
"id": "4100703",
"name": "智慧工地-大屏",
"font_family": "font_family",
"css_prefix_text": "icon-",
"description": "",
"glyphs": [
{
"icon_id": "2304262",
"name": "左",
"font_class": "zuo1",
"unicode": "e609",
"unicode_decimal": 58889
},
{
"icon_id": "982372",
"name": "男",
"font_class": "nan",
"unicode": "e664",
"unicode_decimal": 58980
},
{
"icon_id": "982373",
"name": "女",
"font_class": "nv",
"unicode": "e665",
"unicode_decimal": 58981
},
{
"icon_id": "34202286",
"name": "时间",
"font_class": "shijian",
"unicode": "e85f",
"unicode_decimal": 59487
},
{
"icon_id": "20743929",
"name": "焦距放大",
"font_class": "jiaojufangda",
"unicode": "e602",
"unicode_decimal": 58882
},
{
"icon_id": "20743932",
"name": "焦距缩小",
"font_class": "jiaojusuoxiao",
"unicode": "e603",
"unicode_decimal": 58883
},
{
"icon_id": "36509848",
"name": "中心",
"font_class": "zhongxin",
"unicode": "e9e4",
"unicode_decimal": 59876
},
{
"icon_id": "36508440",
"name": "右下",
"font_class": "youxia",
"unicode": "e9e0",
"unicode_decimal": 59872
},
{
"icon_id": "36508439",
"name": "右上",
"font_class": "youshang",
"unicode": "e9e1",
"unicode_decimal": 59873
},
{
"icon_id": "36508437",
"name": "右",
"font_class": "you2",
"unicode": "e9e2",
"unicode_decimal": 59874
},
{
"icon_id": "36508429",
"name": "近焦距",
"font_class": "jinjiaoju",
"unicode": "e9e3",
"unicode_decimal": 59875
},
{
"icon_id": "36508431",
"name": "左下",
"font_class": "zuoxia",
"unicode": "e9e5",
"unicode_decimal": 59877
},
{
"icon_id": "36508432",
"name": "左",
"font_class": "zuo",
"unicode": "e9e6",
"unicode_decimal": 59878
},
{
"icon_id": "36508433",
"name": "下",
"font_class": "xia",
"unicode": "e9e7",
"unicode_decimal": 59879
},
{
"icon_id": "36508430",
"name": "左上",
"font_class": "zuoshang",
"unicode": "e9e8",
"unicode_decimal": 59880
},
{
"icon_id": "36508441",
"name": "放大",
"font_class": "fangda",
"unicode": "e9dd",
"unicode_decimal": 59869
},
{
"icon_id": "36508434",
"name": "远焦距",
"font_class": "yuanjiaoju",
"unicode": "e9dc",
"unicode_decimal": 59868
},
{
"icon_id": "36508436",
"name": "上",
"font_class": "shang",
"unicode": "e9de",
"unicode_decimal": 59870
},
{
"icon_id": "36508438",
"name": "缩小",
"font_class": "suoxiao",
"unicode": "e9df",
"unicode_decimal": 59871
},
{
"icon_id": "35871490",
"name": "icon_san",
"font_class": "report-fill-03",
"unicode": "e9cf",
"unicode_decimal": 59855
},
{
"icon_id": "35871509",
"name": "icon_yi",
"font_class": "report-fill-01",
"unicode": "e9d3",
"unicode_decimal": 59859
},
{
"icon_id": "35871531",
"name": "icon_er",
"font_class": "report-fill-02",
"unicode": "e9d4",
"unicode_decimal": 59860
},
{
"icon_id": "36013877",
"name": "report-fill-03-2",
"font_class": "report-fill-03-2",
"unicode": "e9d5",
"unicode_decimal": 59861
},
{
"icon_id": "14456894",
"name": "左",
"font_class": "you",
"unicode": "e600",
"unicode_decimal": 58880
},
{
"icon_id": "16588070",
"name": "右",
"font_class": "you1",
"unicode": "e706",
"unicode_decimal": 59142
},
{
"icon_id": "2439690",
"name": "人员",
"font_class": "fl-renyuan",
"unicode": "e625",
"unicode_decimal": 58917
},
{
"icon_id": "35798422",
"name": "安全帽",
"font_class": "anquanmao",
"unicode": "e9cb",
"unicode_decimal": 59851
},
{
"icon_id": "15937967",
"name": "ico_xiaj",
"font_class": "you-21",
"unicode": "e7b7",
"unicode_decimal": 59319
},
{
"icon_id": "15937969",
"name": "ico_guanbi",
"font_class": "shanchu-2",
"unicode": "e7b8",
"unicode_decimal": 59320
},
{
"icon_id": "16040674",
"name": "ico_shang",
"font_class": "you-23",
"unicode": "e7c4",
"unicode_decimal": 59332
},
{
"icon_id": "16111497",
"name": "ico_zuo",
"font_class": "you-22",
"unicode": "e7d3",
"unicode_decimal": 59347
},
{
"icon_id": "16111498",
"name": "ico_you",
"font_class": "you-2-2",
"unicode": "e7d4",
"unicode_decimal": 59348
},
{
"icon_id": "28202666",
"name": "shang-01",
"font_class": "shang-01",
"unicode": "e8e3",
"unicode_decimal": 59619
},
{
"icon_id": "28202667",
"name": "shang-02",
"font_class": "shang-02",
"unicode": "e8e4",
"unicode_decimal": 59620
},
{
"icon_id": "35798148",
"name": "商混-2",
"font_class": "shanghun-2",
"unicode": "e9d0",
"unicode_decimal": 59856
},
{
"icon_id": "35798149",
"name": "商混-3",
"font_class": "shanghun-3",
"unicode": "e9d1",
"unicode_decimal": 59857
},
{
"icon_id": "35798150",
"name": "商混-1",
"font_class": "shanghun-1",
"unicode": "e9d2",
"unicode_decimal": 59858
},
{
"icon_id": "35798104",
"name": "临边防护-列表-2",
"font_class": "linbianfanghu-liebiao-2",
"unicode": "e9c9",
"unicode_decimal": 59849
},
{
"icon_id": "35798047",
"name": "安全帽-当前使用",
"font_class": "anquanmao-dangqianshiyong",
"unicode": "e9c1",
"unicode_decimal": 59841
},
{
"icon_id": "35798048",
"name": "icon_ss",
"font_class": "icon_ss",
"unicode": "e9c2",
"unicode_decimal": 59842
},
{
"icon_id": "35798049",
"name": "视频监控-1",
"font_class": "shipinjiankong-1",
"unicode": "e9c3",
"unicode_decimal": 59843
},
{
"icon_id": "35798050",
"name": "安全帽-历史轨迹",
"font_class": "anquanmao-lishiguiji",
"unicode": "e9c4",
"unicode_decimal": 59844
},
{
"icon_id": "35798051",
"name": "播放",
"font_class": "bofang",
"unicode": "e9c5",
"unicode_decimal": 59845
},
{
"icon_id": "35798052",
"name": "塔吊",
"font_class": "tadiao",
"unicode": "e9c6",
"unicode_decimal": 59846
},
{
"icon_id": "35798053",
"name": "施工升降机",
"font_class": "shigongshengjiangji",
"unicode": "e9c7",
"unicode_decimal": 59847
},
{
"icon_id": "35798054",
"name": "视频监控-2",
"font_class": "shipinjiankong-2",
"unicode": "e9c8",
"unicode_decimal": 59848
},
{
"icon_id": "35798056",
"name": "临边防护-列表-1",
"font_class": "linbianfanghu-liebiao-1",
"unicode": "e9ca",
"unicode_decimal": 59850
},
{
"icon_id": "35798058",
"name": "扬尘噪音",
"font_class": "yangchenzaoyin",
"unicode": "e9cc",
"unicode_decimal": 59852
},
{
"icon_id": "35798059",
"name": "临边防护-定位",
"font_class": "linbianfanghu-dingwei",
"unicode": "e9cd",
"unicode_decimal": 59853
},
{
"icon_id": "35798060",
"name": "卸料平台",
"font_class": "xieliaopingtai",
"unicode": "e9ce",
"unicode_decimal": 59854
}
]
}
<template>
<el-dialog
:visible.sync="dialogVisible"
:class="[isFullScreen ? 'full-screen' : '']"
:class="[isFullScreen || fullScreen ? 'full-screen' : '']"
:append-to-body="true"
:width="width"
top=".98rem"
......@@ -13,7 +13,7 @@
<span class="dialog-title-span">
{{ title }}
</span>
<span class="op-buttons">
<span class="op-buttons" v-if="!fullScreen">
<i
@click="changeFullScreen"
:class="['iconfont', isFullScreen ? 'icon-suoxiao' : 'icon-fangda']"
......@@ -40,6 +40,10 @@ export default {
type: [String, Number],
default: 1200,
},
fullScreen: {
type: Boolean,
default: false,
},
},
data() {
return {
......@@ -97,4 +101,10 @@ export default {
.dialog-title-span {
position: relative;
}
.icon-fangda:before {
content: "\e60e" !important;
}
.icon-suoxiao:before {
content: "\e616" !important;
}
</style>
\ No newline at end of file
......@@ -13,6 +13,7 @@ import Title from "@/components/common/Title"
import Section from "@/components/common/Section"
import STable from "@/components/common/STable"
import "@/assets/iconfont/iconfont.css";
import "@/assets/iconfont-camera/iconfont.css";
import "@/assets/common/common.less"
import "@/assets/common/element.less"
......
<template>
<div class="project-info">
<div class="title">
数据更新时间
数据更新时间:【{{ noiseData.data_time }}
<span class="history" @click="historyVisible = true">查看历史记录</span>
<HistoryDust
:visible="historyVisible"
......
......@@ -2,6 +2,7 @@
<Dialog
:title="projectName"
:visible="dialogVisible"
:full-screen="true"
width="70%"
@change-visible="changeVisible"
>
......
......@@ -41,6 +41,114 @@
<div class="operate-body">
<div class="box-title">监控操作</div>
<div class="control-container" style="display: flex">
<div id="direction-control">
<div>
<div
class="arrow"
@mousedown="mouseDownEvent('left_up')"
@mouseup="mouseUpEvent"
>
<i class="iconfont icon-zuoshang"></i>
</div>
<div
class="arrow"
@mousedown="mouseDownEvent('up')"
@mouseup="mouseUpEvent"
>
<i class="iconfont icon-shang"></i>
</div>
<div
class="arrow"
@mousedown="mouseDownEvent('right_up')"
@mouseup="mouseUpEvent"
>
<i class="iconfont icon-youshang"></i>
</div>
</div>
<div>
<div
class="arrow"
@mousedown="mouseDownEvent('left')"
@mouseup="mouseUpEvent"
>
<i class="iconfont icon-zuo"></i>
</div>
<div class="arrow" style="cursor: inherit">
<i class="iconfont icon-zhongxin"></i>
</div>
<div
class="arrow"
@mousedown="mouseDownEvent('right')"
@mouseup="mouseUpEvent"
>
<i class="iconfont icon-you2"></i>
</div>
</div>
<div>
<div
class="arrow"
@mousedown="mouseDownEvent('left_down')"
@mouseup="mouseUpEvent"
>
<i class="iconfont icon-zuoxia"></i>
</div>
<div
class="arrow"
@mousedown="mouseDownEvent('down')"
@mouseup="mouseUpEvent"
>
<i class="iconfont icon-xia"></i>
</div>
<div
class="arrow"
@mousedown="mouseDownEvent('right_down')"
@mouseup="mouseUpEvent"
>
<i class="iconfont icon-youxia"></i>
</div>
</div>
</div>
<div id="else-control">
<div id="focus-control">
<div
class="button"
@mousedown="mouseDownEvent('focus_near')"
@mouseup="mouseUpEvent"
>
<i class="iconfont icon-jiaojufangda"></i>
<div class="font-text">近焦距</div>
</div>
<div
class="button"
@mousedown="mouseDownEvent('focus_far')"
@mouseup="mouseUpEvent"
>
<i class="iconfont icon-jiaojusuoxiao"></i>
<div class="font-text">远焦距</div>
</div>
</div>
<div id="zoom-control">
<div
class="button"
@mousedown="mouseDownEvent('zoom_in')"
@mouseup="mouseUpEvent"
>
<i class="iconfont icon-fangda"></i>
<div class="font-text">放大</div>
</div>
<div
class="button"
@mousedown="mouseDownEvent('zoom_out')"
@mouseup="mouseUpEvent"
>
<i class="iconfont icon-suoxiao"></i>
<div class="font-text">缩小</div>
</div>
</div>
</div>
</div>
<div class="operate-box">
<el-form class="my-form" ref="form" label-position="top">
<el-form-item label="分屏:">
......@@ -135,6 +243,8 @@ import {
getDeviceListByProjectId,
getDevicePlayAddress,
getPlayBackUrl,
startCameraMove,
stopCameraMove,
} from "@/api/video-supervisory.js";
import $ from "jquery";
export default {
......@@ -451,6 +561,30 @@ export default {
);
});
},
mouseDownEvent(direction) {
console.log(this.selectedItem, this.deviceList[this.activeCameraIndex]);
if (this.selectedItem.id || this.deviceList[this.activeCameraIndex].id) {
startCameraMove(
this.selectedItem.id
? this.selectedItem.id
: this.deviceList[this.activeCameraIndex].id,
{
direction,
speed: 1,
}
);
} else {
return this.$message.warning("请选中要操作的监控!");
}
},
mouseUpEvent() {
stopCameraMove(
this.selectedItem.id
? this.selectedItem.id
: this.deviceList[this.activeCameraIndex].id
);
},
},
};
</script>
......@@ -490,7 +624,8 @@ export default {
.devices {
width: 2.5rem;
display: flex;
flex-direction: column;
.list {
height: calc(100% - 0.5rem - 3.6rem);
background: rgba(41, 63, 151, 0.61);
......@@ -659,11 +794,11 @@ export default {
}
::v-deep .el-date-editor {
margin-bottom: 0.1rem;
margin-bottom: 4px;
}
::v-deep .el-form-item {
margin-bottom: 0;
margin-bottom: 0 !important;
}
::v-deep .el-input__inner {
......@@ -717,7 +852,7 @@ export default {
::v-deep .el-form-item__content {
line-height: 0.4rem;
margin-bottom: 0.04rem;
margin-bottom: 0 !important;
}
::v-deep .el-input__suffix {
......@@ -750,4 +885,89 @@ export default {
.parent-wnd .sub-wnd.sub-wnd-4 {
width: 25% !important;
}
#direction-control {
display: flex;
flex-wrap: wrap;
width: 128px;
flex-direction: column;
.arrow {
width: 40px;
padding: 4px 0;
text-align: center;
background: rgba(44, 96, 162, 0.2);
border-radius: 6px;
color: #fff;
cursor: pointer;
margin-right: 4px;
margin-bottom: 4px;
display: inline-block;
&:hover {
background: rgba(44, 96, 162, 0.8);
}
&:nth-child(3n) {
margin-right: 0;
}
&:nth-child(n + 7) {
margin-bottom: 0;
}
.iconfont {
font-size: 30px;
vertical-align: top;
}
}
}
#else-control {
color: #fff;
width: calc(100% - 132px);
margin-left: 4px;
.iconfont {
font-size: 30px;
color: #fff;
}
#focus-control,
#zoom-control {
border-radius: 6px;
background: rgba(44, 96, 162, 0.2);
display: flex;
text-align: center;
.button {
width: 50%;
padding: 8px 0;
font-size: 14px;
cursor: pointer;
&:hover {
background: rgba(44, 96, 162, 0.8);
}
.iconfont {
font-size: 20px;
color: #fff;
}
.font-text {
margin-top: 6px;
}
&:first-child {
border-right: 1px solid #2c60a2;
border-top-left-radius: 6px;
border-bottom-left-radius: 6px;
}
&:last-child {
border-top-right-radius: 6px;
border-bottom-right-radius: 6px;
}
}
}
#focus-control {
margin-bottom: 4px;
}
}
::v-deep .el-form--label-top .el-form-item__label {
line-height: 30px;
}
.w-100 {
width: 100%;
}
</style>
\ No newline at end of file
......@@ -23,7 +23,7 @@ module.exports = defineConfig({
port: 3000,
proxy: {
'/wisdom': {
target: 'http://192.168.0.57:8011/',
target: 'http://cx.zhjd.io/',
changeOrigin: true,
},
......
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