ly.fan
/
xy-frontend
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

添加通道设置功能

Browse Source
wp1.0
fanluyan 1 year ago
parent fa46e54a1d
commit fcdde8aa33
5 changed files with 677 additions and 3 deletions
Show Stats Download Patch File Download Diff File

1
src/views/realTimeMonitor/components/carouselChart.vue
Unescape Escape View File

@ -390,7 +390,6 @@ export default {
//鼠标滚动
handleScroll(e) {
let direction = e.deltaY > 0 ? "down" : "up"; //deltaY为正则滚轮向下，为负滚轮向上
if (direction == "down") {
this.$refs.scrollBox.scrollLeft +=
(this.$refs.scrollBox.offsetWidth / this.photoNum) * 1;

4
src/views/realTimeMonitor/components/parameterArea.vue
Unescape Escape View File

@ -91,6 +91,8 @@
上传图片</el-button
>
<takeTimePicButton v-if="roleUser == 0"></takeTimePicButton>
<setChannelButton v-if="roleUser == 0"></setChannelButton>
<!-- <el-button type="primary" @click="handleTakePic" :loading="picLoading"
>主动拍照
</el-button> -->
@ -146,6 +148,7 @@
<script>
import EventBus from "@/utils/event-bus";
import takePicButton from "./takePicButton.vue";
import setChannelButton from "./setChannelButton.vue";
import takeTimePicButton from "./takeTimePicButton.vue";
import takeVideoButton from "./takeVideoButton.vue";
import deviceInfoButton from "./deviceInfoButton.vue";
@ -173,6 +176,7 @@ export default {
gpsButton,
parameterSetDialog,
uploadpic,
setChannelButton,
},
data() {
return {

34
src/views/realTimeMonitor/components/setChannelButton.vue
Unescape Escape View File

@ -0,0 +1,34 @@
<template>
<div class="buttonBox">
<el-button type="primary" @click="handleSetChannel">通道设置 </el-button>
<setChannelDialog ref="setChannelDialog_ref"></setChannelDialog>
</div>
</template>
<script>
import {} from "@/utils/api/index";
import setChannelDialog from "./setChannelDialog.vue";
export default {
components: { setChannelDialog },
data() {
return {};
},
watch: {},
mounted() {},
computed: {
termId() {
return this.$store.state.termId;
},
channelIdList() {
return this.$store.state.channelIdList;
},
},
methods: {
handleSetChannel() {
this.$refs.setChannelDialog_ref.display();
},
},
destroyed() {},
beforeRouteLeave(to, from, next) {},
};
</script>

616
src/views/realTimeMonitor/components/setChannelDialog.vue
Unescape Escape View File

@ -0,0 +1,616 @@
<template>
<el-dialog
class="setChannelDialog"
title="通道设置"
:visible.sync="isShow"
:close-on-click-modal="false"
width="640px"
@close="handleclose"
>
<div class="zzinfo">装置编号：{{ areaData.cmdid }}</div>
<div class="channelsetBox">
<el-form ref="form" :model="channelForm" label-width="80px">
<el-form-item label="装置编号">
<el-input v-model="channelForm.zzbh" disabled></el-input>
</el-form-item>
<el-form-item label="拍照通道">
<el-select
v-model="channelForm.selectChannel"
placeholder="请选择"
@change="changeChannel"
>
<el-option
v-for="item in channelList"
:key="item.channelid"
:label="
item.alias !== null && item.alias !== ''
? item.alias
: item.channelname
"
:value="item.channelid"
>
{{
item.alias !== null && item.alias !== ""
? item.alias
: item.channelname
}}
</el-option>
</el-select>
</el-form-item>
<el-form-item label="照片大小" class="photoSize">
<el-input v-model="channelForm.resolutionCX"></el-input>
<el-input v-model="channelForm.resolutionCY"></el-input>
<!-- <el-select v-model="channelForm.picSize" placeholder="请选择">
<el-option
v-for="item in pictureSize"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select> -->
</el-form-item>
<el-form-item label="压缩率">
<el-input v-model="channelForm.ysl"></el-input>
<span class="infoSpan">(0-100的整数)</span>
</el-form-item>
<el-form-item label="参数设置">
<el-checkbox
label="USB接口"
v-model="channelForm.usbchecked"
></el-checkbox>
<el-checkbox
label="自动对焦"
v-model="channelForm.zzdjchecked"
></el-checkbox>
<el-checkbox
label="自动曝光"
v-model="channelForm.zdbgchecked"
></el-checkbox>
</el-form-item>
<el-form-item label="曝光时间">
<el-input v-model="channelForm.bgsj"></el-input>
<span class="infoSpan">(毫秒)</span>
</el-form-item>
<el-form-item label="ISO">
<el-input v-model="channelForm.iso"></el-input>
</el-form-item>
<el-form-item label="模式选择">
<el-checkbox
label="HDR模式"
v-model="channelForm.hdrchecked"
></el-checkbox>
<el-checkbox
label="夜晚模式"
v-model="channelForm.ywchecked"
></el-checkbox>
</el-form-item>
<el-form-item label="旋转角度">
<el-select v-model="channelForm.roteval" placeholder="请选择">
<el-option
v-for="item in roteOptions"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="AI识别">
<el-select v-model="channelForm.aival" placeholder="请选择">
<el-option
v-for="item in aiOptions"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="左上OSD">
<el-input v-model="channelForm.ltosd"></el-input>
<span class="infoSpan">(多行使用\n换行)</span>
</el-form-item>
<el-form-item label="右上OSD">
<el-input v-model="channelForm.rtosd"></el-input>
<span class="infoSpan">(多行使用\n换行)</span>
</el-form-item>
<el-form-item label="左下OSD">
<el-input v-model="channelForm.lbosd"></el-input>
<span class="infoSpan">(多行使用\n换行)</span>
</el-form-item>
<el-form-item label="右下OSD">
<el-input v-model="channelForm.rbosd"></el-input>
<span class="infoSpan">(多行使用\n换行)</span>
</el-form-item>
</el-form>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="handleclose">取 消</el-button>
<el-button type="primary" @click="handleConfim" :loading="channelLoading"
>确 定</el-button
>
</div>
</el-dialog>
</template>
<script>
import {
getChannelListJoggle,
getTermStatus,
setTermCamera,
getTermCameraRequest,
} from "@/utils/api/index";
export default {
props: {},
data() {
return {
isShow: false,
channelLoading: false,
channelList: [], //通道选项
channelForm: {
zzbh: "",
selectChannel: "",
resolutionCX: "",
resolutionCY: "",
ysl: "",
usbchecked: "",
zzdjchecked: "",
zdbgchecked: "",
bgsj: "",
iso: "",
hdrchecked: "",
ywchecked: "",
roteval: "",
aival: "",
ltosd: "",
rtosd: "",
lbosd: "",
rbosd: "",
},
roteOptions: [
{
value: 0,
label: "无旋转",
},
{
value: 1,
label: "0°",
},
{
value: 2,
label: "90°",
},
{
value: 3,
label: "180°",
},
{
value: 4,
label: "270°",
},
],
aiOptions: [
{
value: 0,
label: "0-关闭当前通道AI识别",
},
{
value: 1,
label: "1-启用但不绘制区域",
},
{
value: 2,
label: "2-启用并绘制区域",
},
],
pictureSize: [
{
value: 0,
label: "5376X3024",
},
{
value: 1,
label: "1920X1080",
},
{
value: 2,
label: "2048X1536",
},
],
requestid: "",
};
},
computed: {
areaData() {
return this.$store.state.currentData;
},
},
mounted() {
this.channelForm.zzbh = this.areaData.cmdid;
this.channelForm.roteval = this.roteOptions[0].value;
this.channelForm.aival = this.aiOptions[0].value;
this.channelForm.picSize = this.pictureSize[0].value;
},
methods: {
//获取通道
getChannelSelect() {
getChannelListJoggle({ termid: this.areaData.id })
.then((res) => {
this.channelList = res.data.list;
this.channelForm.selectChannel = this.channelList[0].channelid;
console.log(this.channelList);
this.changeChannel();
})
.catch((err) => {});
},
//修改通道
changeChannel() {
console.log(this.channelForm.selectChannel);
if (this.channelForm.selectChannel == 1) {
// this.channelForm.picSize = this.pictureSize[0].value;
this.channelForm.resolutionCX = 5376;
this.channelForm.resolutionCY = 3024;
} else if (
this.channelForm.selectChannel == 2 ||
this.channelForm.selectChannel == 3
) {
//this.channelForm.picSize = this.pictureSize[1].value;
this.channelForm.resolutionCX = 1920;
this.channelForm.resolutionCY = 1080;
} else if (this.channelForm.selectChannel == 4) {
//this.channelForm.picSize = this.pictureSize[2].value;
this.channelForm.resolutionCX = 2048;
this.channelForm.resolutionCY = 1536;
}
},
handleConfim() {
console.log("点击了确定");
console.log(this.channelForm);
this.channelLoading = true;
// let params = [
// {
// name: "resolutionCX",
// type: 0,
// value: "",
// },
// {
// name: "resolutionCY",
// type: 0,
// value: "",
// },
// {
// name: "quality",
// type: 0,
// value: "",
// },
// {
// name: "usbCamera",
// type: 0,
// value: "",
// },
// {
// name: "autoFocus",
// type: 0,
// value: "",
// },
// {
// name: "autoExposure",
// type: 0,
// value: "",
// },
// {
// name: "exposureTime",
// type: 0,
// value: "",
// },
// {
// name: "sensibility",
// type: 0,
// value: "",
// },
// {
// name: "hdrMode",
// type: 0,
// value: "",
// },
// {
// name: "nightMode",
// type: 0,
// value: "",
// },
// {
// name: "orientation",
// type: 0,
// value: "",
// },
// {
// name: "recognization",
// type: 0,
// value: "",
// },
// {
// name: "osd.leftTop",
// type: 1,
// value: "",
// },
// {
// name: "osd.rightTop",
// type: 1,
// value: "",
// },
// {
// name: "osd.rightBottom",
// type: 1,
// value: "",
// },
// {
// name: "osd.leftBottom",
// type: 1,
// value: "",
// },
// ];
//--act=cfg --udp=1 --cmdid=XY-ANDROIDSIM-002 --pathType=1 --updateType=0 --path=data/channels/1.json --configs=3 --name1=osd.leftTop --type1=1 --value1="OSD for LeftTop %%CH%%" --name2=osd.rightTop --type2=255 --value2="OSD for rIGHTTop %%CH%%" --name3=usbCamera --type3=0 --value3=1 --clientid=5 --reqid=TS
getTermStatus({ termId: this.areaData.id }).then((res) => {
console.log(res);
if (res.data.isonline) {
let params = [
{
name: "act",
value: "cfg",
},
{
name: "udp",
value: 1,
},
{
name: "pathType",
value: 1,
},
{
name: "updateType",
value: 0,
},
{
name: "path",
value:
"data/channels/" + this.channelForm.selectChannel + ".json",
},
{
name: "configs",
value: 16,
},
// {
// name: "resolutionCX",
// type: 0,
// value: this.channelForm.resolutionCX,
// },
{ name: "name1", value: "resolutionCX" },
{ name: "value1", value: this.channelForm.resolutionCX },
{ name: "type1", value: 0 },
// {
// name: "resolutionCY",
// type: 0,
// value: this.channelForm.resolutionCY,
// },
{ name: "name2", value: "resolutionCY" },
{ name: "value2", value: this.channelForm.resolutionCY },
{ name: "type2", value: 0 },
// {
// name: "quality",
// type: 0,
// value: this.channelForm.ysl,
// },
{ name: "name3", value: "quality" },
{ name: "value3", value: this.channelForm.ysl },
{ name: "type3", value: 0 },
// {
// name: "usbCamera",
// type: 0,
// value: this.channelForm.usbchecked ? 1 : 0,
// },
{ name: "name4", value: "usbCamera" },
{ name: "value4", value: this.channelForm.usbchecked ? 1 : 0 },
{ name: "type4", value: 0 },
// {
// name: "autoFocus",
// type: 0,
// value: this.channelForm.zzdjchecked ? 1 : 0,
// },
{ name: "name5", value: "autoFocus" },
{ name: "value5", value: this.channelForm.zzdjchecked ? 1 : 0 },
{ name: "type5", value: 0 },
// {
// name: "autoExposure",
// type: 0,
// value: this.channelForm.zdbgchecked ? 1 : 0,
// },
{ name: "name6", value: "autoExposure" },
{ name: "value6", value: this.channelForm.zdbgchecked ? 1 : 0 },
{ name: "type6", value: 0 },
// {
// name: "exposureTime",
// type: 0,
// value: this.channelForm.bgsj,
// },
{ name: "name7", value: "exposureTime" },
{ name: "value7", value: this.channelForm.bgsj },
{ name: "type7", value: 0 },
// {
// name: "sensibility",
// type: 0,
// value: this.channelForm.iso,
// },
{ name: "name8", value: "sensibility" },
{ name: "value8", value: this.channelForm.iso },
{ name: "type8", value: 0 },
// {
// name: "hdrMode",
// type: 0,
// value: this.channelForm.hdrchecked ? 1 : 0,
// },
{ name: "name9", value: "hdrMode" },
{ name: "value9", value: this.channelForm.hdrchecked ? 1 : 0 },
{ name: "type9", value: 0 },
// {
// name: "nightMode",
// type: 0,
// value: this.channelForm.ywchecked ? 1 : 0,
// },
{ name: "name10", value: "nightMode" },
{ name: "value10", value: this.channelForm.ywchecked ? 1 : 0 },
{ name: "type10", value: 0 },
// {
// name: "orientation",
// type: 0,
// value: this.channelForm.roteval,
// },
{ name: "name11", value: "orientation" },
{ name: "value11", value: this.channelForm.roteval },
{ name: "type11", value: 0 },
// {
// name: "recognization",
// type: 0,
// value: this.channelForm.aival,
// },
{ name: "name12", value: "recognization" },
{ name: "value12", value: this.channelForm.aival },
{ name: "type12", value: 0 },
// {
// name: "osd.leftTop",
// type: 1,
// value: this.channelForm.ltosd,
// },
{ name: "name13", value: "osd.leftTop" },
{ name: "value13", value: this.channelForm.ltosd },
{ name: "type13", value: 1 },
// {
// name: "osd.rightTop",
// type: 1,
// value: this.channelForm.rtosd,
// },
{ name: "name14", value: "osd.rightTop" },
{ name: "value14", value: this.channelForm.rtosd },
{ name: "type14", value: 1 },
// {
// name: "osd.rightBottom",
// type: 1,
// value: this.channelForm.lbosd,
// },
{ name: "name15", value: "osd.rightBottom" },
{ name: "value15", value: this.channelForm.lbosd },
{ name: "type15", value: 1 },
// {
// name: "osd.leftBottom",
// type: 1,
// value: this.channelForm.rbosd,
// },
{ name: "name16", value: "osd.leftBottom" },
{ name: "value16", value: this.channelForm.rbosd },
{ name: "type16", value: 1 },
];
console.log(params);
this.setTermFn(params);
} else {
this.$message({
duration: 1500,
showClose: true,
message: "装置下线，发送指令失败",
type: "error",
});
}
});
},
setTermFn(val) {
setTermCamera({
termId: this.areaData.id,
list: val,
})
.then((res) => {
console.log(res);
this.requestid = res.data.requestId;
this.getTakechannelStatus();
})
.catch((err) => {});
},
getTakechannelStatus() {
getTermCameraRequest({ requestid: this.requestid })
.then((res) => {
console.log(res);
if (res.data.success == 1) {
this.isShow = false;
this.channelLoading = false;
this.$message({
duration: 1500,
showClose: true,
message: "通道设置成功",
type: "success",
});
} else {
this.isShow = false;
this.$message({
duration: 1500,
showClose: true,
message: "通道设置失败",
type: "error",
});
}
})
.catch((err) => {});
},
display() {
this.isShow = true;
this.getChannelSelect();
console.log(this.areaData);
},
handleclose() {
this.isShow = false;
},
},
};
</script>
<style lang="less">
.setChannelDialog {
.zzinfo {
position: absolute;
top: 22px;
left: 120px;
}
.el-dialog__body {
padding-bottom: 0px;
.el-form-item--small.el-form-item {
margin-bottom: 12px;
}
.channelsetBox {
width: 100%;
// height: 400px;
//background: #fcc;
.el-input {
width: 300px;
}
}
.infoSpan {
margin-left: 8px;
}
.photoSize {
.el-form-item__content {
display: flex;
//justify-content: space-between;
.el-input {
width: 144px;
margin-right: 12px;
}
}
}
}
.dialog-footer {
.el-button--default,
.el-button--primary {
width: 80px !important;
margin-bottom: 0px !important;
}
.el-button + .el-button {
margin-left: 10px !important;
}
}
}
</style>

25
src/views/realTimeMonitor/components/takePicButton.vue
Unescape Escape View File

@ -180,7 +180,11 @@ export default {
// }, 2000);
// return;
// }
if (res.data.cmaStatus != 1 && this.statusNum >= 5) {
if (
res.data.cmaStatus != 1 &&
res.data.picStatus == false &&
this.statusNum >= 5
) {
this.clearFn();
this.$message({
duration: 1500,
@ -188,7 +192,11 @@ export default {
message: "下发指令超时，请重试！",
type: "warning",
});
} else if (res.data.cmaStatus == 1 || res.data.picStatus == true) {
} else if (
res.data.cmaStatus == 1 &&
res.data.picStatus == false &&
this.statusNum < 5
) {
this.clearFn();
this.$message({
duration: 1500,
@ -203,6 +211,19 @@ export default {
this.newPicApi(val);
this.picNum++;
}, 8000);
} else if (
res.data.cmaStatus != 1 &&
res.data.picStatus == true &&
this.statusNum < 5
) {
this.clearFn();
this.newPicApi(val);
clearInterval(this.picPimer);
this.picPimer = null;
this.picPimer = window.setInterval(() => {
this.newPicApi(val);
this.picNum++;
}, 8000);
}
})
.catch((err) => {

Write Preview
Loading…
Cancel
Save