覆冰添加拍照

menu1.0
fanluyan 7 months ago
parent 1cb03f598b
commit 402ebe1f44

@ -50,7 +50,7 @@
slot="placeholder" slot="placeholder"
class="image-slot" class="image-slot"
:style="{ :style="{
backgroundImage: 'url(' + currentPicPath + '!160x60' + ')', backgroundImage: 'url(' + currentPicPath + '!260x160' + ')',
}" }"
> >
<!-- <i class="el-icon-loading"></i> --> <!-- <i class="el-icon-loading"></i> -->
@ -115,7 +115,7 @@
item.path.indexOf('videos') == -1 item.path.indexOf('videos') == -1
" "
> >
<img v-lazy="item.path + '!160x60'" /> <img v-lazy="item.path + '!260x160'" />
<!-- <img :src="item.path + '!260x160'" />--> <!-- <img :src="item.path + '!260x160'" />-->
<!-- :class="{ alarmSpan: item.isAlarm === 1 }" --> <!-- :class="{ alarmSpan: item.isAlarm === 1 }" -->
<p class="timeInfo"> <p class="timeInfo">
@ -150,7 +150,7 @@
</div> </div>
<div class="picBox" v-else-if="item.mediaType == 1"> <div class="picBox" v-else-if="item.mediaType == 1">
<!-- <el-image :src="item.thumb + '!260x160'"></el-image> --> <!-- <el-image :src="item.thumb + '!260x160'"></el-image> -->
<img v-lazy="item.thumb + '!160x60'" /> <img v-lazy="item.thumb + '!260x160'" />
<p class="timeInfo"> <p class="timeInfo">
<i class="el-icon-video-camera"></i> <i class="el-icon-video-camera"></i>
<el-tooltip <el-tooltip
@ -468,18 +468,18 @@ export default {
const selectedItemWidth = selectedItem.offsetWidth; const selectedItemWidth = selectedItem.offsetWidth;
// //
let scrollDistance = // let scrollDistance =
selectedItemLeft - (scrollContainerWidth - selectedItemWidth) / 2; // selectedItemLeft - (scrollContainerWidth - selectedItemWidth) / 2;
if (scrollDistance < 0) { // if (scrollDistance < 0) {
scrollDistance = 0; // scrollDistance = 0;
} else if ( // } else if (
scrollDistance + scrollContainerWidth > // scrollDistance + scrollContainerWidth >
scrollContainer.scrollWidth // scrollContainer.scrollWidth
) { // ) {
scrollDistance = scrollContainer.scrollWidth - scrollContainerWidth; // scrollDistance = scrollContainer.scrollWidth - scrollContainerWidth;
} // }
// scrollLeft // // scrollLeft
scrollContainer.scrollLeft = scrollDistance; // scrollContainer.scrollLeft = scrollDistance;
} }
}, },
loadImage() { loadImage() {

@ -0,0 +1,464 @@
<template>
<div class="setTime">
<el-dialog
title="选择拍照时间表"
:visible.sync="dialogVisible"
width="1100px"
>
<div class="setBox">
<div class="head">
<h3>通道</h3>
<el-select
v-model="channelVal"
placeholder="请选择"
class="channelDiv"
>
<el-option
v-for="item in channelOptions"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
<h3>预置位</h3>
<el-select
v-model="presetVal"
placeholder="请选择"
class="channelDiv"
filterable
>
<el-option
v-for="n in 255"
:key="n"
:label="n"
:value="n"
></el-option>
</el-select>
<h3>选择时间段</h3>
<el-time-picker
is-range
v-model="timeValue"
range-separator="至"
start-placeholder="开始时间"
end-placeholder="结束时间"
placeholder="选择时间范围"
>
</el-time-picker>
<h3 class="timespan">时间间隔</h3>
<el-input-number v-model="timeNum"></el-input-number>
<el-button type="primary" class="showList" @click="showTimeList"
>时间列表</el-button
>
<el-button type="primary" class="serachBtn" @click="deviceTimeClick"
>查询</el-button
>
</div>
<div class="contain">
<ul>
<li v-for="(time, index) in timeList" :key="index">
{{ formatTime(time) }}
<el-input
v-model="selectedValues[index]"
placeholder="请输入"
></el-input>
</li>
</ul>
<div class="tagsBox" v-if="deviceTimeList.length !== 0">
<el-tag v-for="(item, index) in deviceTimeList" :key="index"
>时间点{{ $moment(item).format("HH:mm") }} + 预置位:
{{ item.preset }}</el-tag
>
</div>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false"> </el-button>
<el-button type="primary" @click="handleSetTimeClick"
>下发时间表</el-button
>
</span>
</el-dialog>
</div>
</template>
<script>
import {
getTermStatus,
setTermCamera,
getTermCameraRequest,
} from "@/utils/api/index";
export default {
data() {
return {
deviceData: "", //
dialogVisible: false,
timeValue: [], //
timeNum: 30, //
timeList: [], //
channelVal: 1,
channelOptions: [
{
value: 1,
label: "通道1",
},
{
value: 2,
label: "通道2",
},
],
selectedValues: [], //
presetVal: 1, //
timeparams: [], //
deviceTimer: null, //
deviceNum: 1, //
deviceTimeList: [],
attemptCount: 0, //
maxAttempts: 9, //
};
},
mounted() {
//
let today = new Date();
//
let startOfDay = new Date(today);
startOfDay.setHours(0, 0, 0, 0); // 0
// 235959
let endOfDay = new Date(today);
endOfDay.setHours(23, 59, 59, 999); // 235959999
// value1
this.timeValue = [startOfDay, endOfDay];
},
methods: {
display(val) {
this.dialogVisible = true;
this.deviceData = val;
console.log(this.deviceData);
},
showTimeList() {
//
this.timeList = [];
//
const intervalMs = this.timeNum * 60 * 1000;
// timeValuestartOfDay
let currentTime = new Date(this.timeValue[0]);
//
while (currentTime <= this.timeValue[1]) {
//
this.timeList.push(new Date(currentTime));
//
currentTime.setTime(currentTime.getTime() + intervalMs);
}
//
console.log(this.timeList.map(this.formatTime));
console.log(this.presetVal);
this.selectedValues = this.timeList.map(() => this.presetVal);
},
formatTime(date) {
// "HH:mm"
const hours = String(date.getHours()).padStart(2, "0");
const minutes = String(date.getMinutes()).padStart(2, "0");
return `${hours}:${minutes}`;
},
handleSetTimeClick() {
this.timeparams = [];
this.timeList.forEach((time, index) => {
if (this.selectedValues[index] !== undefined) {
//
this.timeparams.push({
time: this.formatTime(time),
preset: this.selectedValues[index],
});
}
});
console.log(this.timeparams);
this.getsetTimeFun();
},
getsetTimeFun() {
getTermStatus({ termId: this.deviceData.id }).then((res) => {
console.log(res);
if (res.data.isonline) {
console.log(this.channelVal, this.setNum, this.deviceData.protocol);
let params = [
{
name: "act",
value: "schedule",
},
{
name: "flag",
value: 1,
},
{
name: "channel",
value: this.channelVal,
},
];
let group = this.timeparams.length;
params.push({
name: "group",
value: group,
});
for (let m = 0; m < this.timeparams.length; m++) {
console.log(this.timeparams[m].time);
let time = this.$moment(this.timeparams[m].time, "HH:mm"); // 使 moment
console.log(time);
params.push(
{
name: "hour" + (m + 1),
value: time.hour(),
},
{
name: "min" + (m + 1),
value: time.minute(),
},
{
name: "preset" + (m + 1),
value: this.timeparams[m].preset,
}
);
}
console.log(params);
let timeArrList = [];
for (var k = 0; k < this.timeparams.length; k++) {
//console.log(moment(dayArr[k]).hour());
console.log(this.timeparams[k].time);
let time = this.$moment(this.timeparams[k].time, "HH:mm"); // 使 moment
console.log(time);
timeArrList.push({
hour: time.hour(),
minute: time.minute(),
preset: this.timeparams[k].preset,
});
}
console.log(timeArrList);
var parmsobj = {
termid: this.deviceData.id,
channelid: this.channelVal,
list: timeArrList,
};
console.log(parmsobj);
//this.setTimeRuleJava(parmsobj); //使java
this.setTermFnRule(params);
} else {
this.sureloading = false;
this.$message({
duration: 1500,
showClose: true,
message: "装置下线,发送指令失败",
type: "error",
});
}
});
},
//
setTermFnRule(dataParams) {
setTermCamera({
termId: this.deviceData.id,
list: dataParams,
})
.then((res) => {
console.log(res);
this.requestid = res.data.requestId;
clearInterval(this.timer);
this.deviceTimer = window.setInterval(() => {
this.getinfoRules();
this.deviceNum++;
console.log(this.deviceNum, this.deviceNum * 1000);
}, 1000 * this.deviceNum);
})
.catch((err) => {});
},
getinfoRules() {
getTermCameraRequest({ requestid: this.requestid })
.then((res) => {
if (res.data.success == 1) {
this.sureloading = false;
window.clearInterval(this.deviceTimer);
this.deviceTimer = null;
this.deviceNum = 1;
console.log(JSON.parse(res.data.data));
this.isShowset = false;
this.$message({
duration: 1500,
showClose: true,
message: "时间表下发成功",
type: "success",
});
this.dialogVisible = false;
} else if (this.deviceNum > 9) {
this.sureloading = false;
window.clearInterval(this.deviceTimer);
this.deviceTimer = null;
this.deviceNum = 1;
this.failedFlag = true;
this.$message({
duration: 1500,
showClose: true,
message: "时间表下发失败",
type: "error",
});
this.dialogVisible = false;
}
})
.catch((err) => {});
},
//
deviceTimeClick() {
console.log("点击了获取装置时间表");
if (this.deviceData.onlinestatus === 1) {
this.deviceTimeLoading = true;
let params = [
{
name: "act",
value: "schedule",
},
{
name: "flag",
value: 0,
},
{
name: "channel",
value: this.channelVal,
},
];
this.setTermFn(params);
} else {
this.$message({
duration: 1500,
showClose: true,
message: "装置下线,发送指令失败",
type: "error",
});
}
},
//
setTermFn(dataParams) {
console.log("点击了统一的接口", dataParams);
setTermCamera({
termId: this.deviceData.id,
list: dataParams,
})
.then((res) => {
console.log(res);
this.requestid = res.data.requestId;
//
if (this.deviceTimer) {
clearInterval(this.deviceTimer);
}
// getinfo
this.deviceTimer = window.setInterval(() => {
this.getinfo();
}, 1000);
})
.catch((err) => {
if (this.deviceTimer) {
clearInterval(this.deviceTimer);
this.deviceTimer = null;
}
});
},
getinfo() {
getTermCameraRequest({ requestid: this.requestid })
.then((res) => {
if (res.data.success == 1) {
this.deviceTimeLoading = false;
clearInterval(this.deviceTimer);
this.deviceTimer = null;
this.attemptCount = 0; //
console.log(JSON.parse(res.data.data));
this.deviceTimeList = JSON.parse(res.data.data).groupData;
//this.processingData(JSON.parse(res.data.data).groupData); //
this.$message({
duration: 1500,
showClose: true,
message: "装置时间表已更新",
type: "success",
});
} else {
this.attemptCount++; // 1
if (this.attemptCount >= this.maxAttempts) {
//
clearInterval(this.deviceTimer);
this.deviceTimer = null;
this.deviceTimeLoading = false;
this.$message({
duration: 1500,
showClose: true,
message: "查询失败",
type: "error",
});
}
}
})
.catch((err) => {});
},
},
};
</script>
<style lang="less">
.setTime {
.setBox {
.head {
display: flex;
align-items: center;
//justify-content: space-around;
h3 {
margin-bottom: 0px;
}
.channelDiv {
width: 120px;
margin-right: 12px;
}
.el-date-editor {
width: 220px;
}
.timespan {
margin-left: 12px;
}
.showList {
margin-left: 12px;
width: 90px !important;
margin-bottom: 0px !important;
}
.serachBtn {
margin-left: 8px !important;
width: 60px !important;
margin-bottom: 0px !important;
}
}
.contain {
height: 410px;
margin-top: 20px;
display: flex;
ul {
display: flex;
flex-wrap: wrap;
align-content: flex-start; //
overflow: auto;
height: 410px;
width: 60%;
li {
width: 200px;
list-style: none;
height: 40px;
line-height: 40px;
.el-input {
width: 80px;
margin-left: 12px;
}
}
}
.tagsBox {
width: 40%;
overflow: auto;
height: 410px;
.el-tag {
margin-bottom: 12px;
margin-right: 12px;
}
}
}
}
}
</style>

@ -81,10 +81,18 @@
<span class="label">{{ speedVal }}%</span> <span class="label">{{ speedVal }}%</span>
</div> </div>
<div class="btnfungrop"> <div class="btnfungrop">
<el-button type="primary" icon="el-icon-camera">主动拍照</el-button> <el-button type="primary" icon="el-icon-camera" @click="handleTakePic"
<el-button type="primary" icon="el-icon-c-scale-to-original" >主动拍照</el-button
>开启雨刷</el-button >
<el-button
type="primary"
icon="el-icon-c-scale-to-original"
@click="handleTimeClick"
>下发时间表</el-button
> >
<!-- <el-button type="primary" icon="el-icon-c-scale-to-original"
>开启雨刷</el-button
> -->
<el-button type="primary" icon="el-icon-sunny">镜头除雾</el-button> <el-button type="primary" icon="el-icon-sunny">镜头除雾</el-button>
<el-button <el-button
type="primary" type="primary"
@ -151,18 +159,76 @@
<el-button type="primary" @click="commitPrest"> </el-button> <el-button type="primary" @click="commitPrest"> </el-button>
</div> </div>
</el-dialog> </el-dialog>
<setTime ref="setTime_ref"></setTime>
<!-- // -->
<el-dialog
title="主动拍照"
:visible.sync="takePicShow"
:close-on-click-modal="false"
width="480px"
>
<el-form :model="takepicform" :rules="rules" ref="ruleForm">
<el-form-item label="选择通道">
<el-select
v-model="takepicform.selectChannelValue"
placeholder="请选择通道"
ref="multiSelect"
>
<el-option
v-for="item in channelListOption"
: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="预置位号">
<el-select
v-model="takepicform.presetVal"
placeholder="请选择"
class="channelDiv"
filterable
>
<el-option
v-for="n in 255"
:key="n"
:label="n"
:value="n"
></el-option>
</el-select>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="takePicShow = false"> </el-button>
<el-button type="primary" @click="takePrestPic"> </el-button>
</div>
</el-dialog>
</div> </div>
</template> </template>
<script> <script>
import { import {
getChannelByTermidJoggle,
getTermStatus, getTermStatus,
setTermCamera, setTermCamera,
getTermCameraRequest, getTermCameraRequest,
getPresetApi, getPresetApi,
savePresetApi, savePresetApi,
deletePresetApi, deletePresetApi,
getTakePicStatusJoggle,
} from "@/utils/api/index"; } from "@/utils/api/index";
import setTime from "./components/setTime.vue";
export default { export default {
components: { setTime },
data() { data() {
var checkpreset = (rule, value, callback) => { var checkpreset = (rule, value, callback) => {
if (!value) { if (!value) {
@ -201,6 +267,16 @@ export default {
], ],
presetVal: [{ validator: checkpreset, trigger: "blur" }], presetVal: [{ validator: checkpreset, trigger: "blur" }],
}, },
//
channelListOption: [], //
takePicShow: false,
takepicform: {
selectChannelValue: 1,
presetVal: 1,
},
deviceTimer: null, //
deviceNum: 1, //
}; };
}, },
computed: { computed: {
@ -410,24 +486,132 @@ export default {
}) })
.catch((err) => {}); .catch((err) => {});
}, },
// getctrlStatus(val) {
// getTermCameraRequest({ requestid: val.requestId }) //
// .then((res) => { handleTimeClick() {
// console.log(res); console.log("下发拍照时间表");
// if (this.statusNum >= 5) { this.$refs.setTime_ref.display(this.areaData);
// clearInterval(this.statusTimer); },
// this.statusTimer = null; //
// this.statusNum = 0; getChannelList() {
// this.$message({ console.log(this.areaData);
// duration: 1500, getChannelByTermidJoggle({ termid: this.areaData.id })
// showClose: true, .then((res) => {
// message: "", console.log(res);
// type: "warning", this.channelListOption = res.data.list;
// }); })
// } .catch((err) => {
// }) console.log(err); //
// .catch((err) => {}); });
// }, },
//
handleTakePic() {
console.log(this.areaData);
this.takePicShow = true;
this.getChannelList();
},
takePrestPic() {
console.log("点击了拍照");
console.log(this.takepicform);
getTermStatus({ termId: this.termId }).then((res) => {
console.log(res);
if (res.data.isonline) {
let params = [
{
name: "act",
value: "capture",
},
{
name: "channel",
value: this.takepicform.selectChannelValue,
},
{
name: "preset",
value: this.takepicform.presetVal,
},
{
name: "type",
value: 0,
},
];
this.takepicFun(params);
} else {
this.picLoading = false;
this.$message({
duration: 1500,
showClose: true,
message: "装置下线,发送指令失败",
type: "error",
});
}
});
},
takepicFun(val) {
this.takePicShow = false;
setTermCamera({
termId: this.termId,
channelId: this.takepicform.selectChannelValue,
list: val,
})
.then((res) => {
console.log(res);
this.getTakePicStatus(res.data);
//
if (this.deviceTimer) {
clearInterval(this.deviceTimer);
}
// getinfo
this.deviceTimer = window.setInterval(() => {
this.getTakePicStatus(res.data);
this.deviceNum++;
}, 1000);
})
.catch((err) => {});
},
//
getTakePicStatus(val) {
console.log(val);
getTakePicStatusJoggle({
requestid: val.requestId,
termId: this.termId,
photoTime: new Date(val.date).getTime(),
})
.then((res) => {
console.log(res);
if (
res.data.cmaStatus != 1 &&
res.data.picStatus == false &&
this.statusNum >= 5
) {
window.clearInterval(this.deviceTimer);
this.deviceTimer = null;
this.deviceNum = 1;
this.$message({
duration: 1500,
showClose: true,
message: "下发指令超时,请重试!",
type: "warning",
});
} else if (
res.data.cmaStatus == 1 &&
res.data.picStatus == false &&
this.statusNum < 5
) {
window.clearInterval(this.deviceTimer);
this.deviceTimer = null;
this.deviceNum = 1;
this.$message({
duration: 1500,
showClose: true,
message: "下发指令成功!",
type: "success",
});
}
})
.catch((err) => {
console.log(err); //
});
},
}, },
}; };
</script> </script>

Loading…
Cancel
Save