|
|
|
|
@ -37,6 +37,16 @@
|
|
|
|
|
></el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="通道">
|
|
|
|
|
<el-select v-model="formdata.channel">
|
|
|
|
|
<el-option
|
|
|
|
|
v-for="item in tdOptions"
|
|
|
|
|
:key="item.id"
|
|
|
|
|
:label="item.name"
|
|
|
|
|
:value="item.id"
|
|
|
|
|
></el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="开始日期">
|
|
|
|
|
<!-- <el-date-picker
|
|
|
|
|
v-model="formdata.timeVal"
|
|
|
|
|
@ -208,18 +218,6 @@
|
|
|
|
|
v-if="selectRow.path !== '' && tableData.length !== 0"
|
|
|
|
|
>
|
|
|
|
|
<!-- v-viewer="OptionssalseImg" -->
|
|
|
|
|
<!-- <div
|
|
|
|
|
class="nosee"
|
|
|
|
|
:style="'backgroundImage:url(' + photoPic + '!1366x768)'"
|
|
|
|
|
></div>
|
|
|
|
|
<viewer :options="OptionssalseImg" class="bigimgView">
|
|
|
|
|
<img
|
|
|
|
|
@load="imgOnload"
|
|
|
|
|
ref="picJpg"
|
|
|
|
|
class="animImg"
|
|
|
|
|
:src="photoPic + '!1366x768'"
|
|
|
|
|
/>
|
|
|
|
|
</viewer> -->
|
|
|
|
|
<img
|
|
|
|
|
ref="picJpg"
|
|
|
|
|
class="animImg"
|
|
|
|
|
@ -253,24 +251,44 @@
|
|
|
|
|
</div>
|
|
|
|
|
<div class="pictureBox" v-else v-loading="loading">
|
|
|
|
|
<div class="piclist" v-if="tableData.length !== 0">
|
|
|
|
|
<el-card
|
|
|
|
|
<div
|
|
|
|
|
class="box-card imgList"
|
|
|
|
|
v-for="(item, index) in tableData"
|
|
|
|
|
:key="index"
|
|
|
|
|
:class="current === index ? 'bgColor' : ''"
|
|
|
|
|
>
|
|
|
|
|
<div class="bigpic">
|
|
|
|
|
<div class="toolsBtn">
|
|
|
|
|
<el-button
|
|
|
|
|
title="主动拍照"
|
|
|
|
|
type="primary"
|
|
|
|
|
icon="el-icon-camera"
|
|
|
|
|
@click.stop="handlePicList(item)"
|
|
|
|
|
></el-button>
|
|
|
|
|
<el-button
|
|
|
|
|
title="历史图片"
|
|
|
|
|
type="primary"
|
|
|
|
|
icon="el-icon-picture-outline"
|
|
|
|
|
@click.stop="handlePicHistory(item)"
|
|
|
|
|
></el-button>
|
|
|
|
|
<!-- <el-button
|
|
|
|
|
type="primary"
|
|
|
|
|
:loading="btnpicloading"
|
|
|
|
|
@click.stop="handlePicList(item)"
|
|
|
|
|
>主动拍照</el-button
|
|
|
|
|
>
|
|
|
|
|
<el-button type="primary" @click.stop="handlePicHistory(item)"
|
|
|
|
|
>历史图片</el-button
|
|
|
|
|
> -->
|
|
|
|
|
</div>
|
|
|
|
|
<div class="picshow" @click="handlePicAlarm(item, index)">
|
|
|
|
|
<img :src="item.path + '!1366x768'" ref="picJpg" />
|
|
|
|
|
<!-- <canvas
|
|
|
|
|
id="myCanvas"
|
|
|
|
|
class="myCanvas"
|
|
|
|
|
:ref="'myCanvas' + index"
|
|
|
|
|
></canvas> -->
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="caption">
|
|
|
|
|
<p class="infoTop">
|
|
|
|
|
<span v-if="item.isread == 1" class="readbox">[已读]</span>
|
|
|
|
|
<span v-if="item.isread == 0">[未读]</span>
|
|
|
|
|
<span>
|
|
|
|
|
{{ item.lineName }} /
|
|
|
|
|
{{
|
|
|
|
|
item.displayName !== null && item.displayName !== ""
|
|
|
|
|
@ -283,25 +301,17 @@
|
|
|
|
|
? item.alias
|
|
|
|
|
: item.channnelName
|
|
|
|
|
}}
|
|
|
|
|
/ 告警原因：<span class="alarmInfo">({{ item.enname }})</span>
|
|
|
|
|
</span>
|
|
|
|
|
</p>
|
|
|
|
|
<p class="infoBottom">
|
|
|
|
|
告警时间：{{
|
|
|
|
|
<span>{{
|
|
|
|
|
$moment(item.alarmTime).format("YYYY-MM-DD HH:mm:ss")
|
|
|
|
|
}}
|
|
|
|
|
<el-button
|
|
|
|
|
type="primary"
|
|
|
|
|
:loading="btnpicloading"
|
|
|
|
|
@click.stop="handlePicList(item)"
|
|
|
|
|
>主动拍照</el-button
|
|
|
|
|
>
|
|
|
|
|
<el-button type="primary" @click.stop="handlePicHistory(item)"
|
|
|
|
|
>历史图片</el-button
|
|
|
|
|
>
|
|
|
|
|
}}</span>
|
|
|
|
|
<span class="alarmInfo">({{ item.enname }})</span>
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</el-card>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="piclist" v-else>
|
|
|
|
|
<el-empty description="暂无数据"></el-empty>
|
|
|
|
|
@ -372,8 +382,10 @@ export default {
|
|
|
|
|
dyOptions: [{ id: -1, name: "全部" }], //电压数据
|
|
|
|
|
xlOptions: [{ id: -1, name: "全部" }], //线路数据
|
|
|
|
|
gtOptions: [{ id: -1, name: "全部" }], //杆塔数据
|
|
|
|
|
tdOptions: [{ id: -1, name: "全部", alias: null }], //通道数据
|
|
|
|
|
gjOptions: [{ id: -1, label: -1, name: "全部" }], //告警数据
|
|
|
|
|
formdata: {
|
|
|
|
|
channel: 1,
|
|
|
|
|
dyId: -1,
|
|
|
|
|
lineId: -1,
|
|
|
|
|
towerId: -1,
|
|
|
|
|
@ -548,9 +560,14 @@ export default {
|
|
|
|
|
.then((res) => {
|
|
|
|
|
this.gjOptions = [{ id: -1, label: -1, name: "全部" }];
|
|
|
|
|
this.gjOptions = this.gjOptions.concat(res.data.list);
|
|
|
|
|
this.tdOptions = [{ id: -1, name: "全部", alias: null }];
|
|
|
|
|
this.tdOptions = this.tdOptions.concat(res.data.channellist);
|
|
|
|
|
console.log(this.tdOptions);
|
|
|
|
|
console.log(this.gjOptions);
|
|
|
|
|
this.formdata.label = this.gjOptions[0].label;
|
|
|
|
|
this.formdata.channel = this.tdOptions[1].id;
|
|
|
|
|
console.log(this.formdata.label);
|
|
|
|
|
console.log(this.formdata.channel);
|
|
|
|
|
})
|
|
|
|
|
.catch((err) => {});
|
|
|
|
|
},
|
|
|
|
|
@ -822,9 +839,9 @@ export default {
|
|
|
|
|
console.log(this.requestId);
|
|
|
|
|
this.btnpicloading = true;
|
|
|
|
|
this.statusTimer = window.setInterval(() => {
|
|
|
|
|
this.getTakePicStatus(this.requestId);
|
|
|
|
|
this.getTakePicStatus(res.data);
|
|
|
|
|
this.statusNum++;
|
|
|
|
|
}, 2000);
|
|
|
|
|
}, 3000);
|
|
|
|
|
})
|
|
|
|
|
.catch((err) => {
|
|
|
|
|
console.log(err); //代码错误、请求失败捕获
|
|
|
|
|
@ -843,12 +860,18 @@ export default {
|
|
|
|
|
getTakePicStatus(data) {
|
|
|
|
|
console.log(data);
|
|
|
|
|
getTakePicStatusJoggle({
|
|
|
|
|
requestid: data,
|
|
|
|
|
requestid: data.requestId,
|
|
|
|
|
termId: this.selectRow.termId,
|
|
|
|
|
photoTime: new Date(data.taketime).getTime(),
|
|
|
|
|
})
|
|
|
|
|
.then((res) => {
|
|
|
|
|
console.log(res);
|
|
|
|
|
//res.data 0 状态未知 1 成功 2失败
|
|
|
|
|
if (res.data == 0 && this.statusNum >= 5) {
|
|
|
|
|
if (
|
|
|
|
|
res.data.cmaStatus == 0 &&
|
|
|
|
|
res.data.picStatus == false &&
|
|
|
|
|
this.statusNum >= 5
|
|
|
|
|
) {
|
|
|
|
|
this.statusNum = 0;
|
|
|
|
|
clearInterval(this.statusTimer);
|
|
|
|
|
this.statusTimer = null;
|
|
|
|
|
@ -860,16 +883,16 @@ export default {
|
|
|
|
|
message: "下发指令超时，请重试！",
|
|
|
|
|
type: "warning",
|
|
|
|
|
});
|
|
|
|
|
} else if (res.data == 1) {
|
|
|
|
|
this.statusNum = 0;
|
|
|
|
|
clearInterval(this.statusTimer);
|
|
|
|
|
this.statusTimer = null;
|
|
|
|
|
} else if (res.data.cmaStatus == 1 || res.data.picStatus == true) {
|
|
|
|
|
this.$message({
|
|
|
|
|
duration: 1500,
|
|
|
|
|
showClose: true,
|
|
|
|
|
message: "下发指令成功！",
|
|
|
|
|
type: "success",
|
|
|
|
|
});
|
|
|
|
|
this.statusNum = 0;
|
|
|
|
|
clearInterval(this.statusTimer);
|
|
|
|
|
this.statusTimer = null;
|
|
|
|
|
this.timer = window.setInterval(() => {
|
|
|
|
|
this.newPicApi();
|
|
|
|
|
this.i++;
|
|
|
|
|
@ -895,6 +918,7 @@ export default {
|
|
|
|
|
getTakePicPhotoStatusJoggle({
|
|
|
|
|
photoTime: new Date(this.picTime).getTime(),
|
|
|
|
|
termId: this.selectRow.termId,
|
|
|
|
|
requestid: this.requestId,
|
|
|
|
|
}).then((res) => {
|
|
|
|
|
console.log(res.data);
|
|
|
|
|
if (res.data == true && this.i < 10) {
|
|
|
|
|
@ -957,11 +981,26 @@ export default {
|
|
|
|
|
console.log(val);
|
|
|
|
|
this.bigPhotoPic = val.path;
|
|
|
|
|
this.showBigpic = true;
|
|
|
|
|
|
|
|
|
|
this.$nextTick(() => {
|
|
|
|
|
console.log("huatu");
|
|
|
|
|
this.drawlineList(val, index);
|
|
|
|
|
});
|
|
|
|
|
//未读变已读
|
|
|
|
|
if (val.isread == 0) {
|
|
|
|
|
setTimeout(function () {
|
|
|
|
|
readAlarm({
|
|
|
|
|
id: val.id,
|
|
|
|
|
})
|
|
|
|
|
.then((res) => {
|
|
|
|
|
console.log(res);
|
|
|
|
|
val.isread = 1;
|
|
|
|
|
console.log(val.isread);
|
|
|
|
|
})
|
|
|
|
|
.catch((err) => {
|
|
|
|
|
console.log(err);
|
|
|
|
|
});
|
|
|
|
|
}, 300);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
dateFormat(row, column) {
|
|
|
|
|
@ -1096,7 +1135,7 @@ export default {
|
|
|
|
|
background-color: rgba(18, 128, 113, 0.2);
|
|
|
|
|
}
|
|
|
|
|
.readbox {
|
|
|
|
|
color: #e49e61;
|
|
|
|
|
color: #169e8c;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.pageNation {
|
|
|
|
|
@ -1166,34 +1205,36 @@ export default {
|
|
|
|
|
margin: auto;
|
|
|
|
|
}
|
|
|
|
|
.piclist {
|
|
|
|
|
display: flex;
|
|
|
|
|
// justify-content: space-around;
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
// display: flex;
|
|
|
|
|
// // justify-content: space-around;
|
|
|
|
|
// flex-wrap: wrap;
|
|
|
|
|
overflow: auto;
|
|
|
|
|
border: 1px solid #eee;
|
|
|
|
|
height: calc(100% - 2px);
|
|
|
|
|
}
|
|
|
|
|
.imgList {
|
|
|
|
|
width: calc((100% - 104px) / 3);
|
|
|
|
|
width: calc((100% - 40px) / 4);
|
|
|
|
|
position: relative;
|
|
|
|
|
display: inline-block;
|
|
|
|
|
margin: 8px;
|
|
|
|
|
margin: 2px;
|
|
|
|
|
position: relative;
|
|
|
|
|
padding: 4px;
|
|
|
|
|
border-radius: 3px;
|
|
|
|
|
background: #fff;
|
|
|
|
|
height: fit-content;
|
|
|
|
|
//height: auto;
|
|
|
|
|
height: 30%;
|
|
|
|
|
border: 2px solid transparent;
|
|
|
|
|
.el-card__body {
|
|
|
|
|
padding: 0px;
|
|
|
|
|
}
|
|
|
|
|
.bigpic {
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 100%;
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
position: relative;
|
|
|
|
|
.picshow {
|
|
|
|
|
position: relative;
|
|
|
|
|
height: 100%;
|
|
|
|
|
img {
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 100%;
|
|
|
|
|
}
|
|
|
|
|
.myCanvas {
|
|
|
|
|
position: absolute;
|
|
|
|
|
width: 100%;
|
|
|
|
|
@ -1204,35 +1245,37 @@ export default {
|
|
|
|
|
pointer-events: none;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
img {
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 250px;
|
|
|
|
|
object-fit: fill;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.caption {
|
|
|
|
|
padding: 9px;
|
|
|
|
|
color: #333;
|
|
|
|
|
padding: 6px;
|
|
|
|
|
color: #fff;
|
|
|
|
|
position: absolute;
|
|
|
|
|
left: 0;
|
|
|
|
|
bottom: 0px;
|
|
|
|
|
background: rgba(0, 0, 0, 0.5);
|
|
|
|
|
width: calc(100% - 12px);
|
|
|
|
|
.alarmInfo {
|
|
|
|
|
color: #e49e61;
|
|
|
|
|
color: #fff;
|
|
|
|
|
}
|
|
|
|
|
.infoTop {
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
color: #000;
|
|
|
|
|
color: #fff;
|
|
|
|
|
font-weight: normal;
|
|
|
|
|
margin-top: 2px;
|
|
|
|
|
padding-left: 5px;
|
|
|
|
|
padding-right: 5px;
|
|
|
|
|
.readbox {
|
|
|
|
|
color: #169e8c;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.infoBottom {
|
|
|
|
|
color: #000;
|
|
|
|
|
color: #fff;
|
|
|
|
|
font-size: 12px;
|
|
|
|
|
font-weight: normal;
|
|
|
|
|
margin-top: 6px;
|
|
|
|
|
padding-left: 5px;
|
|
|
|
|
padding-right: 5px;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
.el-button--small {
|
|
|
|
|
margin-left: 24px;
|
|
|
|
|
padding: 4px;
|
|
|
|
|
@ -1243,9 +1286,24 @@ export default {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.toolsBtn {
|
|
|
|
|
position: absolute;
|
|
|
|
|
right: 4px;
|
|
|
|
|
top: 4px;
|
|
|
|
|
z-index: 2;
|
|
|
|
|
.el-button {
|
|
|
|
|
width: auto;
|
|
|
|
|
background: rgba(0, 0, 0, 0.5);
|
|
|
|
|
border: 1px solid transparent;
|
|
|
|
|
color: #fff;
|
|
|
|
|
font-size: 20px;
|
|
|
|
|
padding: 2px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.bgColor {
|
|
|
|
|
border: 2px solid #e49e61;
|
|
|
|
|
border: 2px solid #169e8c;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
fanluyan
2 years ago