admin/zhgdyun
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

中建四（质量管理-时间查询、安全巡检字段修改）

Browse Source
This commit is contained in:
yjl 2023-02-28 17:26:12 +08:00
parent 78c2663e98
commit 74beb354ae
4 changed files with 333 additions and 281 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/assets/js/api/zhongjianFourth.js
View File

@ -36,7 +36,7 @@ export const getSecurityDataByProjectSnApi = params => get('xmgl/workerSafeEduca
// 安全巡检-班前喊话
export const getTodayInfoByProjectSnApi = params => get('xmgl/shoutInfo/getTodayInfoByProjectSn', params);
// 安全巡检-安全巡检
export const getAllTodayDataHdirApi = params => get('xmgl/hiddenDangerInspectRecord/getAllTodayDataHdir', params);
export const getAllTodayDataHdirApi = params => get('xmgl/hiddenDangerInspectRecord/getTotalAndWeekHiddenDanger', params);
// 安全巡检-设备监控
export const getAllDevApi = params => get('xmgl/dev/getAllDev', params);

54
src/views/projectAdmin/fourEngin/quality/centerBottom.vue
View File

@ -1,7 +1,7 @@
<template>
<Card title="现场验收">
<div class="list">
<el-date-picker
<!-- <el-date-picker
@change="checkTypes"
v-model="acceptanceDateTime"
value-format="yyyy-MM-dd"
@ -9,6 +9,18 @@
placeholder="选择日期时间"
:clearable="true"
>
</el-date-picker> -->
<el-date-picker
v-model="timeValue"
type="daterange"
size="small"
range-separator="至"
start-placeholder="开始日期"
value-format="yyyy-MM-dd"
end-placeholder="结束日期"
unlink-panels
@change="getTime"
>
</el-date-picker>
<div class="thead">
<div class="row">
@ -67,7 +79,9 @@ export default {
time1: '',
sn: '',
list: [],
acceptanceDateTime: '' //日期
beginActualAcceptanceDate: '', //开始日期
endActualAcceptanceDate: '', //结束日期
timeValue: []
}
},
created() {
@ -76,15 +90,24 @@ export default {
this.credad()
},
methods: {
checkTypes(val) {
console.log('类型或者时间修改事件值 ：', val)
this.credad(val)
//选择时间时
getTime(val) {
if (val) {
this.beginActualAcceptanceDate = val[0]
this.endActualAcceptanceDate = val[1]
} else {
this.beginActualAcceptanceDate = ''
this.endActualAcceptanceDate = ''
}
this.credad()
},
credad(val) {
credad() {
//查询分部分项验收
getLimitOrderByAcceptanceDateApi({
projectSn: this.sn,
acceptanceDate: val ? val : null
beginActualAcceptanceDate: this.beginActualAcceptanceDate,
endActualAcceptanceDate: this.endActualAcceptanceDate
}).then((res) => {
res.result.map((item) => {
item.imageUrl = JSON.parse(item.imageUrl)
@ -177,8 +200,8 @@ export default {
::v-deep .el-date-editor.el-input,
.el-date-editor.el-input__inner {
width: 180px;
margin-left: 80%;
width: 219px;
margin-left: 76%;
margin-top: 10px;
color: #fff !important;
}
@ -192,5 +215,18 @@ export default {
line-height: 36px;
color: #66d3d8;
}
::v-deep .el-range-editor--small .el-range-input {
background: transparent;
color: #fff;
}
::v-deep .el-range-editor--small .el-range-separator {
line-height: 30px;
font-size: 13px;
color: #ccc;
}
::v-deep .el-input__icon {
line-height: 28px;
color: #66d3d8;
}
}
</style>

16
src/views/projectAdmin/fourEngin/security/leftTop.vue
View File

@ -59,17 +59,17 @@
<JRingChart
:title="{
text: '本周巡检',
subTitle: `${safetyPatrolInspection.todayTotalNum}条`,
subTitle: `${safetyPatrolInspection.weekTotalNum}条`,
fontSize: 18
}"
:color="['#6EE4F0', '#E7622A']"
:data="[
{
value: safetyPatrolInspection.todayRectificationNum,
value: safetyPatrolInspection.weekRectificationNum,
name: '已闭合'
},
{
value: safetyPatrolInspection.todayNoRectificationNum,
value: safetyPatrolInspection.weekNoRectificationNum,
name: '未闭合'
}
]"
@ -83,9 +83,9 @@
<span>占比</span>
</div>
<div class="row">
<span>{{ safetyPatrolInspection.todayRectificationNum || 0 }}</span>
<span>{{ safetyPatrolInspection.weekRectificationNum || 0 }}</span>
<span
>{{ safetyPatrolInspection.todayRectificationRatio || 0 }}%</span
>{{ safetyPatrolInspection.weekRectificationRatio || 0 }}%</span
>
</div>
</div>
@ -96,12 +96,10 @@
</div>
<div class="row">
<span>{{
safetyPatrolInspection.todayNoRectificationNum || 0
safetyPatrolInspection.weekNoRectificationNum || 0
}}</span>
<span
>{{
safetyPatrolInspection.todayNoRectificationRatio || 0
}}%</span
>{{ safetyPatrolInspection.weekNoRectificationRatio || 0 }}%</span
>
</div>
</div>

542
src/views/projectFront/towerCrane/operationInfo.vue
View File

@ -8,8 +8,8 @@
<div class="flex2">
<div class="state_title pageTitle">
{{
$t("message.lifter.realTime") +
$t("message.lifter.movingTrajectory")
$t('message.lifter.realTime') +
$t('message.lifter.movingTrajectory')
}}
<span class="warningText">{{ warningText }}</span>
</div>
@ -46,7 +46,7 @@
:style="{
left: coordData.coordX + 8 + 'px',
height: coordData.lineLength + 'px',
top: '78px',
top: '78px'
}"
/>
<div
@ -55,7 +55,7 @@
v-show="hideGoods"
:style="{
top: coordData.coordY + 'px',
left: coordData.coordX - 6 + 'px',
left: coordData.coordX - 6 + 'px'
}"
>
<img src="@/assets/images/towericon/hock.png" alt="" />
@ -90,7 +90,11 @@
</div>
<div class="T_H_wrap whiteBlock">
<div class="load">
<div class="state_title pageTitle">实时视频<span class="tower-time">最后一条数据上传时间：{{towerData.realTime}}</span></div>
<div class="state_title pageTitle">
实时视频<span class="tower-time"
>最后一条数据上传时间：{{ towerData.realTime }}</span
>
</div>
<div style="margin-bottom: 15px">
<el-select
size="medium"
@ -132,7 +136,7 @@
<div class="direction_data_wrap flex">
<div class="data_wrap whiteBlock">
<div class="state_title pageTitle">
{{ $t("message.lifter.realTimeData") }}
{{ $t('message.lifter.realTimeData') }}
</div>
<div class="flex">
<div class="data_type">
@ -141,7 +145,7 @@
<img
src="@/assets/images/towericon/towercurrentdata1.png"
/>
<div>{{ $t("message.lifter.slingLoad") }}</div>
<div>{{ $t('message.lifter.slingLoad') }}</div>
</div>
<div class="value">{{ realTimeDevData.loading }} kg</div>
</div>
@ -150,7 +154,7 @@
<img
src="@/assets/images/towericon/towercurrentdata6.png"
/>
<div>{{ $t("message.lifter.airSpeed") }}</div>
<div>{{ $t('message.lifter.airSpeed') }}</div>
</div>
<div class="value">{{ realTimeDevData.windspeed }} m/s</div>
</div>
@ -161,7 +165,7 @@
<img
src="@/assets/images/towericon/towercurrentdata2.png"
/>
<div>{{ $t("message.lifter.altitude") }}</div>
<div>{{ $t('message.lifter.altitude') }}</div>
</div>
<div class="value">{{ realTimeDevData.height }} m</div>
</div>
@ -170,7 +174,7 @@
<img
src="@/assets/images/towericon/towercurrentdata7.png"
/>
<div>{{ $t("message.lifter.airSpeedOfPercentage") }}</div>
<div>{{ $t('message.lifter.airSpeedOfPercentage') }}</div>
</div>
<div class="value">
{{
@ -185,7 +189,7 @@
<img
src="@/assets/images/towericon/towercurrentdata3.png"
/>
<div>{{ $t("message.lifter.percentageOfMoments") }}</div>
<div>{{ $t('message.lifter.percentageOfMoments') }}</div>
</div>
<div class="value">{{ realTimeDevData.torqueRatio }} %</div>
</div>
@ -194,7 +198,7 @@
<img
src="@/assets/images/towericon/towercurrentdata8.png"
/>
<div>{{ $t("message.lifter.rotationAngle") }}</div>
<div>{{ $t('message.lifter.rotationAngle') }}</div>
</div>
<div class="value">{{ realTimeDevData.angle }}°</div>
</div>
@ -205,7 +209,7 @@
<img
src="@/assets/images/towericon/towercurrentdata4.png"
/>
<div>{{ $t("message.lifter.dip") }}</div>
<div>{{ $t('message.lifter.dip') }}</div>
</div>
<div class="value">
{{
@ -218,7 +222,7 @@
<img
src="@/assets/images/towericon/towercurrentdata9.png"
/>
<div>{{ $t("message.lifter.range") }}</div>
<div>{{ $t('message.lifter.range') }}</div>
</div>
<div class="value">{{ realTimeDevData.ranger }} m</div>
</div>
@ -229,7 +233,7 @@
<img
src="@/assets/images/towericon/towercurrentdata5.png"
/>
<div>{{ $t("message.lifter.percentageOfDip") }}</div>
<div>{{ $t('message.lifter.percentageOfDip') }}</div>
</div>
<div class="value">{{ realTimeDevData.biasAngleRatio }}%</div>
</div>
@ -238,13 +242,13 @@
<img
src="@/assets/images/towericon/towercurrentdata10.png"
/>
<div>{{ $t("message.lifter.earlyWarning") }}</div>
<div>{{ $t('message.lifter.earlyWarning') }}</div>
</div>
<div class="value">
{{
realTimeDevData.alarmName
? realTimeDevData.alarmName
: "无"
: '无'
}}
</div>
</div>
@ -278,7 +282,7 @@
<div>姓名：{{ realTimeDevData.driverName }}</div>
<div>
上岗时间：{{
realTimeDevData.driverName ? realTimeDevData.reciveTime : ""
realTimeDevData.driverName ? realTimeDevData.reciveTime : ''
}}
</div>
</div>
@ -327,7 +331,12 @@
</div>
</div>
<!-- 查看司机信息 -->
<el-dialog :modal-append-to-body="false" title="司机信息" :visible.sync="showDriver" width="667px">
<el-dialog
:modal-append-to-body="false"
title="司机信息"
:visible.sync="showDriver"
width="667px"
>
<div class="dialog_content">
<el-table :data="driverList" class="tables" style="width: 100%">
<el-table-column prop="workerName" label="姓名"> </el-table-column>
@ -383,9 +392,12 @@
<el-input v-model="towerData.registNo" :disabled="true"></el-input>
</el-form-item>
<el-form-item label="设备状态">
<div class="dev-leave" :class="{'dev-line': towerData.devOnline == 1}">
<!-- <span></span> -->
{{towerData.devOnlineName}}
<div
class="dev-leave"
:class="{ 'dev-line': towerData.devOnline == 1 }"
>
<!-- <span></span> -->
{{ towerData.devOnlineName }}
</div>
</el-form-item>
</el-form>
@ -394,226 +406,225 @@
</vue-scroll>
</template>
<script>
import echarts from 'echarts4';;
import videoModule from "@/components/videoModule/videoModule.vue";
import echarts from 'echarts4'
import videoModule from '@/components/videoModule/videoModule.vue'
import {
getTowerListApi,
getSelectTowerBySnApi,
getRecentWorkListApi,
getTowerCurrentDataApi,
getTodayTowerDataApi,
} from "@/assets/js/api/towerCrane";
getTodayTowerDataApi
} from '@/assets/js/api/towerCrane'
import {
hidePluginWindow,
showPluginWindow,
} from "@/components/videoModule/isc_plugin/video_isc_plugin.js";
var frontArmLength = 496; //图片塔吊臂长px
var height = 484; //图片塔吊高度px
var imgLeftWidth = 115; //塔吊图片司机距离左边距离px
var imgLeftHeight = 70; //塔吊图片司机距离上边距离px
var realWidth = 0; //实际塔吊臂长m
var realHeight = 0; //实际塔吊高度m
var $moveBox;
var $xMove;
var $line;
showPluginWindow
} from '@/components/videoModule/isc_plugin/video_isc_plugin.js'
var frontArmLength = 496 //图片塔吊臂长px
var height = 484 //图片塔吊高度px
var imgLeftWidth = 115 //塔吊图片司机距离左边距离px
var imgLeftHeight = 70 //塔吊图片司机距离上边距离px
var realWidth = 0 //实际塔吊臂长m
var realHeight = 0 //实际塔吊高度m
var $moveBox
var $xMove
var $line
export default {
components: { videoModule },
data() {
return {
projectSn: "",
projectSn: '',
towerList: [], //设备列表
checkedIndex: 0, //选中的设备
devSn: "", //选中的设备的sn
devSn: '', //选中的设备的sn
selectList: [], //视频数据源
videoList: [],
videoId: "",
videoId: '',
driverList: [],
showDriver: false, //司机列表
towerCraneDialog: false, //基本信息
towerData: {},
fileUrl: "",
fileUrl: '',
timeValue: [],
endTime: "",
startTime: "",
endTime: '',
startTime: '',
workList: [],
interval: null,
realTimeDevData: {
loading: "",
windspeed: "",
height: "",
windRatio: "",
torqueRatio: "",
angle: "",
biasAngle: "",
ranger: "",
biasAngleRatio: "",
alarmName: "",
loading: '',
windspeed: '',
height: '',
windRatio: '',
torqueRatio: '',
angle: '',
biasAngle: '',
ranger: '',
biasAngleRatio: '',
alarmName: ''
},
echartsData: [],
angle: 0,
coordData: {
coordX: 0,
coordY: 0,
lineLength: 0,
lineLength: 0
},
hideGoods: false, //隐藏货物
workingPlan: "",
workingPlan: '',
imgWidth: 0,
imgHeight: 0,
warningText: "",
interval2:null
};
warningText: '',
interval2: null
}
},
created() {
this.projectSn = this.$store.state.projectSn;
this.fileUrl = this.$store.state.FILEURL;
this.projectSn = this.$store.state.projectSn
this.fileUrl = this.$store.state.FILEURL
this.workingPlan =
this.$store.state.currentProDetail.constructionMapUrl &&
this.$store.state.currentProDetail.constructionMapUrl;
this.$store.state.currentProDetail.constructionMapUrl
// this.workingPlan = require('@/assets/images/3.jpg')
},
mounted() {
this.getTowerList();
this.getTowerList()
this.$nextTick(() => {
$moveBox = document.getElementById("moveBox");
$xMove = document.getElementById("xMove");
$line = document.getElementById("line");
});
$moveBox = document.getElementById('moveBox')
$xMove = document.getElementById('xMove')
$line = document.getElementById('line')
})
},
beforeDestroy() {
clearTimeout(this.interval);
clearInterval(this.interval2);
clearTimeout(this.interval)
clearInterval(this.interval2)
},
methods: {
//下拉框聚焦
visibleChange(val) {
if(this.videoList.length>0&&this.videoList[0].videoType==3){
if (val) {
hidePluginWindow();
if (this.videoList.length > 0 && this.videoList[0].videoType == 3) {
if (val) {
hidePluginWindow()
} else {
showPluginWindow();
showPluginWindow()
}
}
},
// 获取施工图计算比例
calculate() {
if (this.workingPlan) {
let url = this.workingPlan + "?" + Date.parse(new Date());
let url = this.workingPlan + '?' + Date.parse(new Date())
// 创建对象
var img = new Image();
var img = new Image()
// 改变图片的src
img.src = url;
img.src = url
let that = this;
let that = this
img.onload = function () {
let pack = that.$refs.allTowerTrack; //获取显示框的大小
let clientWidth = pack.clientWidth; //获取显示框宽
let clientHeight = pack.clientHeight; //获取显示框高
console.log(clientWidth,clientHeight)
let imgWidth = img.width; //获取图片宽
let imgHeight = img.height; //获取图片高
let pack = that.$refs.allTowerTrack //获取显示框的大小
let clientWidth = pack.clientWidth //获取显示框宽
let clientHeight = pack.clientHeight //获取显示框高
console.log(clientWidth, clientHeight)
let imgWidth = img.width //获取图片宽
let imgHeight = img.height //获取图片高
console.log(imgWidth, imgHeight)
let ratioX = clientWidth / imgWidth; //计算比例
let ratioY = clientHeight / imgHeight; //计算比例
console.log(ratioX, ratioY);
let w = imgWidth * ratioX; //图片的显示尺寸
let h = imgHeight * ratioX; //图片的显示尺寸
that.imgWidth = w;
console.log(w, h);
that.imgHeight = h;
let dataList = JSON.parse(JSON.stringify(that.towerList));
let ratioX = clientWidth / imgWidth //计算比例
let ratioY = clientHeight / imgHeight //计算比例
console.log(ratioX, ratioY)
let w = imgWidth * ratioX //图片的显示尺寸
let h = imgHeight * ratioX //图片的显示尺寸
that.imgWidth = w
console.log(w, h)
that.imgHeight = h
let dataList = JSON.parse(JSON.stringify(that.towerList))
for (let i = 0; i < dataList.length; i++) {
dataList[i].mapX = String(Number(dataList[i].mapX) * ratioX - 37);
dataList[i].mapY = String(Number(dataList[i].mapY) * ratioX - 37);
dataList[i].mapX = String(Number(dataList[i].mapX) * ratioX - 37)
dataList[i].mapY = String(Number(dataList[i].mapY) * ratioX - 37)
}
that.towerList = dataList;
};
that.towerList = dataList
}
}
},
//获取所有的设备列表
getTowerList() {
let data = {
projectSn: this.projectSn,
};
projectSn: this.projectSn
}
getTowerListApi(data).then((res) => {
if (res.code == 200) {
if (res.result.length > 0) {
this.towerList = res.result;
this.checkedIndex = res.result[0].id;
this.devSn = res.result[0].devSn;
this.getDevData(res.result[0]);
this.calculate();
this.towerList = res.result
this.checkedIndex = res.result[0].id
this.devSn = res.result[0].devSn
this.getDevData(res.result[0])
this.calculate()
}
}
});
})
},
//获取选中的设备信息
getDevData(val) {
this.checkedIndex = val.id;
this.devSn = val.devSn;
clearTimeout(this.interval);
clearInterval(this.interval2);
this.getTowerPageData();
this.getRecentWorkList();
this.createdEcharts();
this.checkedIndex = val.id
this.devSn = val.devSn
clearTimeout(this.interval)
clearInterval(this.interval2)
this.getTowerPageData()
this.getRecentWorkList()
this.createdEcharts()
this.interval2 = setInterval(() => {
this.createdEcharts();
}, 5000);
this.createdEcharts()
}, 5000)
},
//获取当前塔吊的数据 当前塔吊司机 当前塔吊视频 当前设备基本信息
getTowerPageData() {
let data = {
devSn: this.devSn,
};
devSn: this.devSn
}
getSelectTowerBySnApi(data).then((res) => {
if (res.code == 200) {
this.driverList = res.result.driverList;
this.towerData = res.result.tower;
if(this.towerData.devOnline == 1){
this.towerData.devOnlineName = "在线"
this.driverList = res.result.driverList
this.towerData = res.result.tower
if (this.towerData.devOnline == 1) {
this.towerData.devOnlineName = '在线'
} else {
this.towerData.devOnlineName = "离线"
this.towerData.devOnlineName = '离线'
}
console.log(this.towerData)
if(res.result.tower.enableVideoUrl==1){
this.videoList = res.result.videoList;
}else{
if(res.result.tower.videoUrl&&res.result.tower.videoUrl!='null'){
this.videoList = JSON.parse(res.result.tower.videoUrl);
}else{
if (res.result.tower.enableVideoUrl == 1) {
this.videoList = res.result.videoList
} else {
if (
res.result.tower.videoUrl &&
res.result.tower.videoUrl != 'null'
) {
this.videoList = JSON.parse(res.result.tower.videoUrl)
} else {
this.videoList = []
}
}
if (this.videoList.length > 0) {
this.videoId = this.videoList[0].id;
this.getVideo(this.videoList[0].id);
}else{
this.videoId=''
this.selectList=[]
this.videoId = this.videoList[0].id
this.getVideo(this.videoList[0].id)
} else {
this.videoId = ''
this.selectList = []
}
realWidth = this.towerData.forearmLength;
realHeight = this.towerData.towerHeight;
realWidth = this.towerData.forearmLength
realHeight = this.towerData.towerHeight
//获取设备的实时数据
this.getRealTimeData();
this.getRealTimeData()
}
});
})
},
//选择的视频
getVideo(val) {
for (let i = 0; i < this.videoList.length; i++) {
if (val == this.videoList[i].id) {
this.selectList = [this.videoList[i]];
this.selectList = [this.videoList[i]]
}
}
},
@ -621,11 +632,11 @@ export default {
//选择时间时
getTime(val) {
if (val) {
this.startTime = val[0];
this.endTime = val[1];
this.startTime = val[0]
this.endTime = val[1]
} else {
this.startTime = "";
this.endTime = "";
this.startTime = ''
this.endTime = ''
}
},
@ -634,61 +645,61 @@ export default {
let data = {
endTime: this.endTime,
startTime: this.startTime,
devSn: this.devSn,
};
devSn: this.devSn
}
getRecentWorkListApi(data).then((res) => {
if (res.code == 200) {
this.workList = res.result;
this.workList = res.result
}
});
})
},
//获取实时数据
getRealTimeData(devSn, index) {
let data = {
devSn: devSn ? devSn : this.devSn,
};
devSn: devSn ? devSn : this.devSn
}
getTowerCurrentDataApi(data).then((res) => {
console.log(index)
if (res.code == 200) {
if (res.result) {
if (devSn) {
this.towerList[index].angle = res.result ? res.result.angle : 0;
return;
} else{
this.towerList[index].angle = res.result ? res.result.angle : 0
return
} else {
console.log('000')
this.realTimeDevData = res.result;
this.interval=setTimeout(() => {
this.getRealTimeData(devSn, index);
}, 5000);
this.realTimeDevData = res.result
this.interval = setTimeout(() => {
this.getRealTimeData(devSn, index)
}, 5000)
}
var y = parseFloat(res.result.height);
var x = parseFloat(res.result.ranger);
this.move(x, y);
var y = parseFloat(res.result.height)
var x = parseFloat(res.result.ranger)
this.move(x, y)
// this.move(150,250)
this.hideGoods = true;
}else{
this.realTimeDevData={
loading: "",
windspeed: "",
height: "",
windRatio: "",
torqueRatio: "",
angle: "",
biasAngle: "",
ranger: "",
biasAngleRatio: "",
alarmName: "",
this.hideGoods = true
} else {
this.realTimeDevData = {
loading: '',
windspeed: '',
height: '',
windRatio: '',
torqueRatio: '',
angle: '',
biasAngle: '',
ranger: '',
biasAngleRatio: '',
alarmName: ''
}
}
}
});
})
},
move(x, y) {
// ;
// var x = randomNum(0,realWidth)
// var y = randomNum(0,realHeight)
var xImg, yImg;
var xImg, yImg
// if (x <= realWidth) {
// xImg = (x / realWidth) * frontArmLength + imgLeftWidth
@ -711,67 +722,74 @@ export default {
// }
// }
if (x <= realWidth) {
xImg = (x / realWidth) * (frontArmLength - imgLeftWidth) + imgLeftWidth;
this.warningText = "";
xImg = (x / realWidth) * (frontArmLength - imgLeftWidth) + imgLeftWidth
this.warningText = ''
} else {
xImg = frontArmLength-imgLeftWidth;
this.warningText = "当前设备前臂长参数错误";
xImg = frontArmLength - imgLeftWidth
this.warningText = '当前设备前臂长参数错误'
}
console.log(realHeight, y, realHeight, height, imgLeftHeight, imgLeftHeight);
console.log(
realHeight,
y,
realHeight,
height,
imgLeftHeight,
imgLeftHeight
)
if (y <= realHeight) {
yImg = ((y) / realHeight) * (height-imgLeftHeight) + imgLeftHeight;
yImg = (y / realHeight) * (height - imgLeftHeight) + imgLeftHeight
// this.warningText = "";
} else {
yImg = height-imgLeftHeight;
this.warningText = "当前设备高度参数错误";
yImg = height - imgLeftHeight
this.warningText = '当前设备高度参数错误'
}
if(xImg<90){
xImg=90
if (xImg < 90) {
xImg = 90
}
if (yImg > 380){
if (yImg > 380) {
yImg = 380
}
$moveBox.style.left = xImg - 6 + "px";
$moveBox.style.top = yImg + "px";
$xMove.style.left = xImg + "px";
$line.style.left = xImg + 8 + "px";
$line.style.height = yImg-74 + "px";
$moveBox.style.left = xImg - 6 + 'px'
$moveBox.style.top = yImg + 'px'
$xMove.style.left = xImg + 'px'
$line.style.left = xImg + 8 + 'px'
$line.style.height = yImg - 74 + 'px'
},
//创建图表
createdEcharts() {
let data = {
devSn: this.devSn,
};
devSn: this.devSn
}
getTodayTowerDataApi(data).then((res) => {
if (res.code == 200) {
this.echartsData = res.result;
this.echartsData = res.result
// loading
var chart1 = echarts.init(this.$refs.load);
chart1.clear();
chart1.setOption(this.getOption());
var chart1 = echarts.init(this.$refs.load)
chart1.clear()
chart1.setOption(this.getOption())
}
});
})
},
//图表
getOption() {
let xData = [];
let loadingData = []; //吊重
let rangerData = []; //幅度
let xData = []
let loadingData = [] //吊重
let rangerData = [] //幅度
if (this.echartsData.length > 0) {
for (let i = 0; i < this.echartsData.length; i++) {
let time = this.echartsData[i].reciveTime.substring(11);
xData.push(time);
loadingData.push(this.echartsData[i].loading);
rangerData.push(this.echartsData[i].ranger);
let time = this.echartsData[i].reciveTime.substring(11)
xData.push(time)
loadingData.push(this.echartsData[i].loading)
rangerData.push(this.echartsData[i].ranger)
}
}
let opt = {
color: ["#FD3A88", "#47F9FD"],
color: ['#FD3A88', '#47F9FD'],
tooltip: {
trigger: "axis",
trigger: 'axis'
},
legend: {
data: ["吊重", "幅度"],
data: ['吊重', '幅度']
},
dataZoom: [
{
@ -780,78 +798,78 @@ export default {
start: 0,
end: 80,
height: 8,
borderColor: "transparent",
backgroundColor: "#e8e8e8",
filterColor: "#999999",
bottom: 0,
},
borderColor: 'transparent',
backgroundColor: '#e8e8e8',
filterColor: '#999999',
bottom: 0
}
],
grid: {
top: 30,
bottom: 25,
left: 35,
right: 0,
containLabel: true,
containLabel: true
},
xAxis: {
type: "category",
type: 'category',
axisTick: {
show: false,
show: false
},
axisLine: {
show: false,
show: false
},
data: xData,
axisLabel: {
//X轴刻度配置
interval: "auto", //0：表示全部显示不间隔；auto:表示自动根据刻度个数和宽度自动设置间隔个数
},
interval: 'auto' //0：表示全部显示不间隔；auto:表示自动根据刻度个数和宽度自动设置间隔个数
}
},
yAxis: {
name: "",
name: '',
axisTick: {
show: false,
show: false
},
axisLine: {
show: false,
show: false
},
splitLine: {
lineStyle: {
color: "#eee",
},
},
color: '#eee'
}
}
},
series: [
{
name: "吊重",
type: "line",
name: '吊重',
type: 'line',
data: loadingData,
smooth: true,
smooth: true
},
{
name: "幅度",
type: "line",
name: '幅度',
type: 'line',
data: rangerData,
// symbol: "none",
smooth: true,
itemStyle: {
normal: {
lineStyle: {
color: "#47F9FD",
color: '#47F9FD'
},
areaStyle: {
color: "#47F9FD",
opacity: 0.3,
},
},
},
},
],
};
return opt;
},
},
};
color: '#47F9FD',
opacity: 0.3
}
}
}
}
]
}
return opt
}
}
}
</script>
<style lang="less" scoped>
@ -1081,32 +1099,32 @@ export default {
}
}
}
.tower-time{
.tower-time {
float: right;
font-size: 12px;
}
.dev-line{
.dev-line {
margin-left: 8px;
color: #67C23A;
span{
display: inline-block;
width: 12px;
height: 12px;
background: #67C23A;
border-radius: 50%;
margin-right: 10px;
}
color: #67c23a;
span {
display: inline-block;
width: 12px;
height: 12px;
background: #67c23a;
border-radius: 50%;
margin-right: 10px;
}
}
.dev-leave{
.dev-leave {
margin-left: 8px;
color: #909399;
span{
display: inline-block;
width: 12px;
height: 12px;
background: #909399;
border-radius: 50%;
margin-right: 10px;
}
span {
display: inline-block;
width: 12px;
height: 12px;
background: #909399;
border-radius: 50%;
margin-right: 10px;
}
}
</style>