Commit 85388a32 authored by 张牧越's avatar 张牧越

styleFix

parent 8bf2476e
......@@ -31,7 +31,7 @@
</style>
</head>
<body>
<body style="height: 100vh;">
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled.
Please enable it to continue.</strong>
......
......@@ -209,3 +209,9 @@
top: 50%;
transform: translateX(-50%)translateY(-50%);
}
::v-deep .el-slider__runway.disabled .el-slider__button-wrapper.dragging,
::v-deep .el-slider__runway.disabled .el-slider__button-wrapper.hover,
::v-deep .el-slider__runway.disabled .el-slider__button-wrapper:hover {
cursor: default !important;
}
\ No newline at end of file
......@@ -9,11 +9,10 @@
alt=""
/>
<div class="weather-text">
<div class="temperature">
{{ screenDetail.temperature }}
<span style="font-size: 14px"></span>
<div class="temperature">{{ screenDetail.temperature }}</div>
<div class="condition">
{{ screenDetail.weather_condition }}
</div>
<div class="condition">{{ screenDetail.weather_condition }}</div>
</div>
</div>
<template v-for="(router, index) in leftNav">
......@@ -183,6 +182,7 @@ export default {
var scale = deviceHeight / 1080;
document.body.style.zoom = scale;
document.body.style.height = (1 / scale) * 100 + "vh";
document.styleSheets[document.styleSheets.length - 1].insertRule(
"canvas:not(.amap-layer):not(.amap-labels) {zoom: " +
Number(1 / scale).toFixed(2) +
......@@ -261,7 +261,10 @@ export default {
this.leftNav = [...menu];
}
});
var isChrome = window.navigator.userAgent.indexOf("Chrome") !== -1;
if (isChrome) {
this.bodyScale();
}
this.getTime();
setInterval(() => {
......@@ -405,19 +408,22 @@ a,
.weather {
display: flex;
flex-wrap: nowrap;
line-height: 24px;
line-height: 26px;
vertical-align: top;
margin-top: 8px;
margin-right: 50px;
.weather-text {
color: #fff;
font-size: 18px;
display: inline-block;
}
.condition {
font-size: 14px;
}
.weather-img {
vertical-align: top;
width: 40px;
height: 40px;
margin-top: 6px;
margin-right: 4px;
}
}
......@@ -449,5 +455,6 @@ a,
}
.temperature {
white-space: nowrap;
font-size: 20px;
}
</style>
\ No newline at end of file
......@@ -148,26 +148,18 @@
<ShadowContainer class="short-container">
<div class="check-in">
<div class="checks">
<div class="title">管理人员/考勤率</div>
<div class="title">管理人员</div>
<div class="count" style="color: rgba(254, 186, 1, 1)">
{{ screenDetail.today_manage_attendance_rate }} <span>%</span>
{{ screenDetail.today_manage_attendance_rate }}<span>%</span>
</div>
<img
style="width: 120px; transform: translateY(-30px)"
src="@/assets/icon-person.png"
alt=""
/>
<img style="width: 120px" src="@/assets/icon-person.png" alt="" />
</div>
<div class="checks">
<div class="title">普通工人/考勤率</div>
<div class="title">普通工人</div>
<div class="count" style="color: rgba(24, 215, 185, 1)">
{{ screenDetail.today_normal_attendance_rate }} <span>%</span>
{{ screenDetail.today_normal_attendance_rate }}<span>%</span>
</div>
<img
style="width: 120px; transform: translateY(-30px)"
src="@/assets/icon-person.png"
alt=""
/>
<img style="width: 120px" src="@/assets/icon-person.png" alt="" />
</div>
</div>
</ShadowContainer>
......@@ -219,6 +211,11 @@
</div>
</div>
</div>
<div
id="scroll-container"
@mouseenter="clearScrollX"
@mouseleave="reScrollX"
>
<div id="step-scroll">
<el-steps :active="progressDetail.step" finish-status="success">
<el-step
......@@ -228,7 +225,9 @@
<template #title>
<div class="step-title">
{{ progress.over_date }}
<div class="step-status">{{ progress.status_text }}</div>
<div class="step-status">
{{ progress.status_text }}
</div>
</div>
</template>
<template #description>
......@@ -239,6 +238,7 @@
</div>
</div>
</div>
</div>
</ShadowContainer>
</div>
<div class="side-area">
......@@ -334,6 +334,9 @@ export default {
aiwarningData: [],
AIwarningTotal: 0,
interval1: null,
timeout1: null,
interval2: null,
timeout2: null,
};
},
methods: {
......@@ -347,6 +350,7 @@ export default {
const option = {
tooltip: {
trigger: "item",
appendToBody: true,
},
series: [
{
......@@ -404,22 +408,46 @@ export default {
getProgressDetail().then((res) => {
if (res.status == 200) {
this.progressDetail = res.data;
// if (res.data.progress_data.length > 6) {
// document.getElementById("step-scroll").style.width =
// 2 * res.data.progress_data.length + "rem";
// document.getElementById("step-scroll").style.animationDuration =
// res.data.progress_data.length / 2 + "s";
// }
this.$nextTick(() => {
const lines = document.getElementsByClassName(
"el-step__line-inner"
if (res.data.progress_data.length > 5) {
document.getElementById("step-scroll").style.width =
20 * res.data.progress_data.length + "%";
}
console.log(this.progressDetail.step);
console.log(this.progressDetail.progress_data);
const timeArray = this.progressDetail.progress_data.map((item) => {
return new Date(item.over_date).getTime();
});
let todayTs = new Date(this.getTime()).getTime();
console.log(timeArray.indexOf(todayTs));
if (timeArray.indexOf(todayTs) == -1) {
let insertIndex = timeArray.findIndex((item) => {
return item > todayTs;
});
if (insertIndex > this.progressDetail.step) {
this.progressDetail.progress_data.splice(
this.progressDetail.step,
0,
{
over_date: this.getTime(),
status_text: "当前进度",
type: "wait",
name: "当时日期",
}
);
if (lines.length > 2) {
lines[this.progressDetail.step - 1].style.width =
res.data.current_progress_rate + "%";
lines[this.progressDetail.step - 1].style.borderWidth = "1px";
this.progressDetail.step = this.progressDetail.step + 1;
} else {
this.progressDetail.progress_data.splice(insertIndex, 0, {
over_date: this.getTime(),
status_text: "当前进度",
type: "wait",
name: "当时日期",
});
}
}
this.$nextTick(() => {
const element = document.getElementById("scroll-container");
this.autoScrollX(1, 50, 1500, element);
});
}
});
......@@ -428,6 +456,17 @@ export default {
this.renderQualityChart();
});
},
getTime() {
let date = new Date();
let year = date.getFullYear();
let month = date.getMonth() + 1;
let day = date.getDate();
month = month > 9 ? month : "0" + month;
day = day < 10 ? "0" + day : day;
let today = year + "-" + month + "-" + day;
return today;
},
mouseLeaveEvent() {},
mouseOverEvent() {},
autoScroll(stepLength, speed, delay, element) {
......@@ -466,6 +505,41 @@ export default {
this.autoScroll(1, 50, 1500, element);
});
},
autoScrollX(stepLength, speed, delay, element) {
var that = this;
function start() {
that.interval2 = setInterval(scrolling, speed);
element.scrollLeft += stepLength;
}
function scrolling() {
var sLeft = element.scrollLeft;
element.scrollLeft += stepLength;
if (
sLeft === element.scrollLeft ||
sLeft == 0 ||
element.scrollLeft === element.scrollWidth - element.offsetWidth
) {
element.scrollLeft = 0;
clearInterval(that.interval2);
that.timeout2 = setTimeout(start, delay);
}
}
if (element.offsetWidth !== element.scrollWidth) {
// 元素内容没有溢出时,不触发
that.timeout2 = setTimeout(start, delay);
}
},
clearScrollX() {
clearInterval(this.interval2);
clearTimeout(this.timeout2);
},
reScrollX() {
this.$nextTick(() => {
const element = document.getElementById("scroll-container");
this.autoScrollX(1, 50, 1500, element);
});
},
},
mounted() {
......@@ -484,11 +558,11 @@ export default {
}
.side-area {
min-width: 400px;
width: 25%;
width: calc(25% - 6px);
height: 100%;
}
.mid-area {
width: calc(50% - 24px);
width: calc(50% - 12px);
height: 100%;
}
.divider {
......@@ -783,7 +857,7 @@ table {
}
}
.table-scroll {
height: calc(100% - 166px);
height: calc(100% - 190px);
overflow-y: auto;
}
.check-in {
......@@ -798,6 +872,13 @@ table {
.checks {
width: 50%;
text-align: center;
cursor: pointer;
&:hover {
img {
transform: translateY(-20px);
transition: 1s;
}
}
&:first-child {
border-right: 1px solid rgba(9, 124, 167, 0.5);
}
......@@ -810,6 +891,7 @@ table {
font-size: 12px;
color: rgba(225, 239, 255, 0.7);
margin-bottom: 20px;
margin-top: 10px;
}
.count {
font-size: 40px;
......@@ -821,7 +903,7 @@ table {
}
#step-scroll {
margin-top: 32px;
margin-top: 40px;
width: 100%;
}
.long-container {
......@@ -850,10 +932,14 @@ table {
text-align: left;
}
.rect {
width: 14px;
height: 14px;
width: 8px;
height: 8px;
display: inline-block;
vertical-align: middle;
}
}
#scroll-container {
width: 100%;
overflow-x: auto;
}
</style>
\ No newline at end of file
......@@ -64,7 +64,11 @@
src="@/assets/AIwarning/icon_d_san@2x.png"
alt=""
/>
<img class="person-head" :src="warns.alarm_big_img_url" />
<el-image
class="person-head"
:src="warns.alarm_big_img_url"
:preview-src-list="srcList"
/>
</div>
<div class="person-detail">
<div class="name">
......@@ -206,6 +210,7 @@ export default {
intervalTimer: null,
todayTotal: 0,
historyTotal: 0,
srcList: [],
};
},
methods: {
......@@ -263,6 +268,7 @@ export default {
itemGap: 12,
},
tooltip: {
appendToBody: true,
trigger: "axis",
},
xAxis: {
......@@ -311,6 +317,7 @@ export default {
this.todayTotal = total;
const option = {
tooltip: {
appendToBody: true,
trigger: "item",
},
series: [
......@@ -359,6 +366,7 @@ export default {
const chart = this.$echarts.init(this.$refs.historyChart);
const option = {
tooltip: {
appendToBody: true,
trigger: "item",
},
......@@ -410,6 +418,9 @@ export default {
}).then((res) => {
if (res.status == 200) {
this.warningList = [...res.data];
this.srcList = res.data.map((item) => {
return item.alarm_big_img_url;
});
this.intervalTimer = setInterval(() => {
getWarningList({
start_log_time: `${this.date} 00:00:00`,
......@@ -417,6 +428,9 @@ export default {
}).then((res) => {
if (res.status == 200) {
this.warningList = [...res.data];
this.srcList = res.data.map((item) => {
return item.alarm_big_img_url;
});
}
});
}, 60000);
......@@ -538,10 +552,10 @@ export default {
text-align: right;
font-size: 44px;
font-weight: bold;
color: #c6eaf9;
color: #fff;
line-height: 60px;
letter-spacing: 4px;
text-shadow: 0 0 5px #c6eaf9;
text-shadow: 0 0 5px rgba(255, 255, 255, 0.6);
}
}
}
......@@ -566,6 +580,9 @@ export default {
border-radius: 4px;
margin-bottom: 12px;
display: flex;
&:hover {
background: rgba(20, 86, 144, 0.5);
}
.portrait {
position: relative;
.rect {
......@@ -658,8 +675,8 @@ export default {
white-space: nowrap;
}
.rect {
width: 14px;
height: 14px;
width: 8px;
height: 8px;
display: inline-block;
vertical-align: middle;
}
......
......@@ -41,7 +41,7 @@
</div>
</ShadowContainer>
<Title text="报警信息"></Title>
<ShadowContainer class="short-container">
<ShadowContainer class="short-2-container">
<div id="warning-info">
<div>
<div class="warning-info-text">今日报警</div>
......@@ -183,7 +183,13 @@
bottom: `${leftBottom}%`,
}"
>
<div class="online-status" v-if="leftElevator">
<div
class="online-status"
v-if="leftElevator"
:style="{
color: leftElevator.is_online == 1 ? '#26D591' : '',
}"
>
{{ leftElevator.is_online_text }}
</div>
<div>
......@@ -203,7 +209,13 @@
}"
>
<div>
<div class="online-status" v-if="rightElevator">
<div
class="online-status"
v-if="rightElevator"
:style="{
color: rightElevator.is_online == 1 ? '#26D591' : '',
}"
>
{{ rightElevator.is_online_text }}
</div>
<img
......@@ -434,7 +446,7 @@ export default {
display: flex;
justify-content: space-between;
padding-bottom: 0;
height: 100%;
height: calc(100% - 12px);
}
.side-area {
width: 25%;
......@@ -545,9 +557,9 @@ export default {
font-size: 16px;
color: #ffffff;
line-height: 24px;
text-shadow: 0 0 5px rgba(99, 226, 253, 0.6),
0 0 5px rgba(99, 226, 253, 0.6), 0 0 6px rgba(99, 226, 253, 0.6),
0 0 40px rgba(99, 226, 253, 0.6);
text-shadow: 0 0 5px rgba(31, 129, 239, 0.6),
0 0 5px rgba(31, 129, 239, 0.6), 0 0 6px rgba(31, 129, 239, 0.6),
0 0 40px rgba(31, 129, 239, 0.6);
}
.warning-info-num {
font-size: 24px;
......@@ -592,6 +604,9 @@ export default {
&:nth-child(2n) {
background: rgba(44, 96, 162, 0.1);
}
&:hover {
background: rgba(44, 96, 162, 0.5);
}
}
.warning-table-time {
width: 30%;
......@@ -734,9 +749,15 @@ export default {
height: calc(100% - 52px);
}
.short-container {
height: calc(50% - 112px);
height: calc(100% / 3 - 112px);
}
.short-2-container {
height: calc(100% / 3 * 2 - 112px);
}
#elevator-detail {
height: 100%;
}
.tower {
width: 60px;
}
</style>
\ No newline at end of file
......@@ -302,6 +302,7 @@ export default {
right: 30,
},
tooltip: {
appendToBody: true,
trigger: "axis",
},
xAxis: {
......@@ -555,9 +556,13 @@ export default {
margin-bottom: 16px;
background: url("@/assets/fallprotection/rect.png") no-repeat;
background-size: 100% 100%;
cursor: pointer;
&:nth-child(3n) {
margin-right: 0;
}
&:hover {
font-weight: bold;
}
img {
vertical-align: top;
width: 100%;
......@@ -588,9 +593,9 @@ export default {
font-size: 16px;
color: #ffffff;
line-height: 24px;
text-shadow: 0 0 5px rgba(99, 226, 253, 0.6),
0 0 5px rgba(99, 226, 253, 0.6), 0 0 6px rgba(99, 226, 253, 0.6),
0 0 40px rgba(99, 226, 253, 0.6);
text-shadow: 0 0 5px rgba(31, 129, 239, 0.6),
0 0 5px rgba(31, 129, 239, 0.6), 0 0 6px rgba(31, 129, 239, 0.6),
0 0 40px rgba(31, 129, 239, 0.6);
}
.warning-info-num {
font-size: 24px;
......@@ -628,6 +633,9 @@ export default {
&:nth-child(2n) {
background: rgba(44, 96, 162, 0.1);
}
&:hover {
background: rgba(44, 96, 162, 0.5);
}
}
.warning-table-run-time {
width: 40%;
......@@ -674,7 +682,7 @@ export default {
width: 50%;
}
.building-description {
margin-bottom: 20px;
margin-bottom: 14px;
line-height: 32px;
font-size: 18px;
color: #c6def9;
......@@ -710,7 +718,7 @@ export default {
left: 0;
top: 0;
z-index: 999;
box-shadow: #1f81ef 0px 0px 8px inset;
box-shadow: rgba(99, 226, 253, 0.6) 0px 0px 16px inset;
pointer-events: none;
}
</style>
\ No newline at end of file
......@@ -2,7 +2,7 @@
<el-dialog
:visible.sync="dialogVisible"
title="近三日预委托记录"
width="80vw"
width="1200px"
top="0"
>
<div>
......
......@@ -2,7 +2,7 @@
<el-dialog
:visible.sync="dialogVisible"
title="取样详情"
width="80vw"
width="1200px"
top="0"
>
<div id="sample-container">
......
......@@ -336,6 +336,7 @@ export default {
this.deviceTotal = total;
const option = {
tooltip: {
appendToBody: true,
trigger: "item",
},
series: [
......@@ -379,6 +380,7 @@ export default {
const chart = this.$echarts.init(this.$refs.noiseChart);
const option = {
tooltip: {
appendToBody: true,
trigger: "item",
},
......@@ -436,6 +438,7 @@ export default {
right: 30,
},
tooltip: {
appendToBody: true,
trigger: "axis",
},
xAxis: {
......@@ -659,7 +662,7 @@ export default {
}
#aqi-chart {
width: 100%;
height: calc(40% - 44px);
height: calc(100% / 3 - 44px);
}
.monitor {
display: flex;
......@@ -806,7 +809,7 @@ export default {
background: rgba(44, 96, 162, 0.2);
font-size: 14px;
color: #c6def9;
margin-bottom: 18px;
margin-bottom: 10px;
img {
width: 20px;
vertical-align: top;
......@@ -856,6 +859,9 @@ export default {
&:nth-child(2n) {
background: rgba(44, 96, 162, 0.1);
}
&:hover {
background: rgba(44, 96, 162, 0.5);
}
.warning-table-message {
text-overflow: ellipsis;
overflow: hidden;
......@@ -877,7 +883,7 @@ export default {
position: relative;
margin: 0 auto;
max-width: 840px;
height: 60%;
height: calc(100% / 3 * 2);
.text {
color: #ffffff;
font-size: 16px;
......@@ -999,8 +1005,8 @@ export default {
text-align: left;
}
.rect {
width: 14px;
height: 14px;
width: 8px;
height: 8px;
display: inline-block;
vertical-align: middle;
}
......
......@@ -2,7 +2,7 @@
<el-dialog
:visible.sync="dialogVisible"
title="整改详情"
width="70vw"
width="1200px"
top="0"
append-to-body
>
......
......@@ -420,6 +420,7 @@ export default {
this.monthCheckTotal = total;
const option = {
tooltip: {
appendToBody: true,
trigger: "item",
},
......@@ -565,6 +566,7 @@ export default {
// });
const option = {
tooltip: {
appendToBody: true,
trigger: "item",
},
......@@ -637,7 +639,8 @@ export default {
right: 0,
},
tooltip: {
trigger: "item",
appendToBody: true,
trigger: "axis",
},
legend: {
itemHeight: 12,
......@@ -745,7 +748,7 @@ export default {
display: flex;
justify-content: space-between;
padding-bottom: 0;
height: 100%;
height: calc(100% - 12px);
.side-area {
width: 25%;
min-width: 400px;
......@@ -837,6 +840,9 @@ export default {
&:nth-child(2n) {
background: rgba(44, 96, 162, 0.1);
}
&:hover {
background: rgba(44, 96, 162, 0.5);
}
}
.warning-table-index {
width: 15%;
......@@ -877,6 +883,9 @@ export default {
&:nth-child(2n) {
background: rgba(44, 96, 162, 0.1);
}
&:hover {
background: rgba(44, 96, 162, 0.5);
}
cursor: pointer;
}
.warning-table-no {
......@@ -945,8 +954,8 @@ export default {
white-space: nowrap;
}
.rect {
width: 14px;
height: 14px;
width: 8px;
height: 8px;
display: inline-block;
vertical-align: middle;
}
......@@ -976,8 +985,8 @@ export default {
}
.chart-small-container {
position: relative;
width: 150px;
height: 150px;
width: 120px;
height: 120px;
.title {
position: absolute;
top: 50%;
......
......@@ -229,6 +229,7 @@
).toFixed(2)
)
"
:format-tooltip="formatSlider"
disabled
></el-slider>
</div>
......@@ -273,6 +274,9 @@ export default {
};
},
methods: {
formatSlider(value) {
return `人数占总工程人数:${value}%`;
},
getTime() {
let date = new Date();
let year = date.getFullYear();
......@@ -294,6 +298,7 @@ export default {
this.areaTotal = total;
const option = {
tooltip: {
appendToBody: true,
trigger: "item",
},
......@@ -366,6 +371,7 @@ export default {
right: 30,
},
tooltip: {
appendToBody: true,
trigger: "axis",
},
xAxis: {
......@@ -508,6 +514,7 @@ export default {
},
},
tooltip: {
appendToBody: true,
trigger: "axis",
},
xAxis: {
......@@ -575,6 +582,7 @@ export default {
},
},
tooltip: {
appendToBody: true,
trigger: "axis",
},
xAxis: {
......@@ -784,6 +792,7 @@ export default {
};
</script>
<style lang="less" scoped>
@import "@/assets/common/element.less";
#realname {
padding: 12px 20px;
display: flex;
......@@ -827,10 +836,10 @@ export default {
text-align: right;
font-size: 44px;
font-weight: bold;
color: #c6eaf9;
color: #fff;
line-height: 60px;
letter-spacing: 4px;
text-shadow: 0 0 5px #c6eaf9;
text-shadow: 0 0 5px rgba(255, 255, 255, 0.6);
}
}
}
......@@ -868,6 +877,9 @@ export default {
border-radius: 4px;
margin-bottom: 12px;
display: flex;
&:hover {
background: rgba(20, 86, 144, 0.5);
}
.portrait {
position: relative;
.rect {
......@@ -1024,8 +1036,8 @@ export default {
text-align: left;
}
.rect {
width: 14px;
height: 14px;
width: 8px;
height: 8px;
display: inline-block;
vertical-align: middle;
}
......
......@@ -139,6 +139,7 @@
append-to-body
title="历史使用记录"
top="0"
width="1200px"
>
<el-form inline :model="searchForm">
<el-form-item label="使用日期">
......@@ -199,7 +200,8 @@
</el-pagination>
</el-dialog>
<map-dialog
:userId="currentUserId"
:deviceId="currentDeviceId"
:personId="currentPersonId"
:visible="mapVisible"
@changeVisible="(val) => (mapVisible = val)"
></map-dialog>
......@@ -240,7 +242,8 @@ export default {
currentPage: 1,
tableData: [],
mapCenter: [],
currentUserId: "",
currentDeviceId: "",
currentPersonId: "",
mapVisible: false,
};
},
......@@ -337,7 +340,8 @@ export default {
},
showRoute(scope) {
this.historyRouteVisible = false;
this.currentUserId = scope.row.person_device_bind_id;
this.currentPersonId = scope.row.person_id;
this.currentDeviceId = scope.row.device_id;
this.mapVisible = true;
},
getSafeCapDeviceList() {
......@@ -349,9 +353,13 @@ export default {
getSafeCapArea() {
getSafeCapArea().then((res) => {
res.data.map((area) => {
console.log(area);
area.points.map((item) => {
console.log(item);
new this.AMap.Polyline({
path: item.points.map((point) => {
path:
item.points &&
item.points.map((point) => {
return [Number(point.lng), Number(point.lat)];
}),
map: this.map,
......@@ -378,7 +386,9 @@ export default {
if (this.windowData.is_online != 1) {
return;
}
this.currentUserId = this.windowData.id;
console.log(this.windowData);
this.currentPersonId = this.windowData.person_id;
this.currentDeviceId = this.windowData.id;
this.mapVisible = true;
},
showHistory() {
......@@ -428,7 +438,7 @@ export default {
left: 0;
top: 0;
z-index: 999;
box-shadow: #1f81ef 0px 0px 8px inset;
box-shadow: rgba(99, 226, 253, 0.6) 0px 0px 16px inset;
pointer-events: none;
}
}
......
......@@ -47,7 +47,11 @@ export default {
type: Boolean,
default: false,
},
userId: {
deviceId: {
type: [String, Number],
default: "",
},
personId: {
type: [String, Number],
default: "",
},
......@@ -71,8 +75,7 @@ export default {
day = day < 10 ? "0" + day : day;
let today = year + "-" + month + "-" + day;
this.date = today;
this.hour =
date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
this.hour = Number(date.getHours());
},
init() {
getBaseInfo().then((res) => {
......@@ -107,12 +110,14 @@ export default {
search() {
this.map.clearMap();
getSafeCapRoute({
bind_id: this.userId,
device_id: this.deviceId,
person_id: this.personId,
start_time: `${this.date} ${this.hour}:00:00`,
}).then((res) => {
const paths = res.data.line.map((point) => {
return [point.longitude, point.latitude];
});
console.log(paths);
new this.AMap.Polyline({
path: paths,
map: this.map,
......
<template>
<div id="tower">
<div class="side-area">
<Title text="设备总览"></Title>
<Title text="设备列表"></Title>
<ShadowContainer class="short-container">
<div class="monitor-list">
<div
class="noise-monitor"
v-for="(monitor, index) in monitors"
:key="index"
@click="moveToMonitor(monitor)"
>
<img
:src="
monitor.is_online == 1
? require('@/assets/zhongji_online.png')
: require('@/assets/zhongji.png')
"
alt=""
/>
{{ monitor.device_no }}
<span
:style="{
color: monitor.is_online_text == '在线' ? '#3eec6f' : '',
}"
>{{ monitor.is_online_text }}</span
>
</div>
</div>
</ShadowContainer>
<!-- <Title text="设备总览"></Title> -->
<!-- <ShadowContainer class="short-container">
<div
style="
display: flex;
......@@ -43,7 +70,7 @@
</div>
</div>
</div>
</ShadowContainer>
</ShadowContainer> -->
<Title text="各塔吊24h力矩百分比统计"></Title>
<ShadowContainer class="short-container">
<div id="force-chart" ref="forceChart"></div>
......@@ -89,33 +116,6 @@
</div>
</div>
<div class="side-area">
<Title text="设备列表"></Title>
<ShadowContainer class="short-container">
<div class="monitor-list">
<div
class="noise-monitor"
v-for="(monitor, index) in monitors"
:key="index"
@click="moveToMonitor(monitor)"
>
<img
:src="
monitor.is_online == 1
? require('@/assets/zhongji_online.png')
: require('@/assets/zhongji.png')
"
alt=""
/>
{{ monitor.device_no }}
<span
:style="{
color: monitor.is_online_text == '在线' ? '#3eec6f' : '',
}"
>{{ monitor.is_online_text }}</span
>
</div>
</div>
</ShadowContainer>
<Title text="报警信息"></Title>
<ShadowContainer class="long-container">
<div class="warning-table">
......@@ -227,6 +227,7 @@ export default {
this.deviceTotal = total;
const option = {
tooltip: {
appendToBody: true,
trigger: "item",
},
series: [
......@@ -296,6 +297,7 @@ export default {
},
},
tooltip: {
appendToBody: true,
trigger: "axis",
},
xAxis: {
......@@ -371,6 +373,7 @@ export default {
},
tooltip: {
trigger: "axis",
appendToBody: true,
},
xAxis: {
type: "category",
......@@ -415,7 +418,7 @@ export default {
getTowerData() {
getTowerDevice({ top_cat: 1, child_cat: 1 }).then((res) => {
this.pieChartData = res.data;
this.renderDeviceChart();
// this.renderDeviceChart();
});
get24hTowerStatis().then((res) => {
this.towerData = res.data;
......@@ -904,7 +907,7 @@ export default {
}
.towerwindow {
width: 460px;
cursor: pointer;
position: absolute;
left: 50%;
top: 50%;
......@@ -957,6 +960,9 @@ export default {
&:nth-child(2n) {
background: rgba(44, 96, 162, 0.1);
}
&:hover {
background: rgba(44, 96, 162, 0.5);
}
}
.warning-table-run-time {
width: 40%;
......@@ -977,7 +983,7 @@ export default {
height: calc(33% - 106px);
}
.long-container {
height: calc(66% - 98px);
height: calc(100% - 98px);
}
.cover-area {
position: absolute;
......@@ -986,7 +992,7 @@ export default {
left: 0;
top: 0;
z-index: 999;
box-shadow: #1f81ef 0px 0px 8px inset;
box-shadow: rgba(99, 226, 253, 0.6) 0px 0px 16px inset;
pointer-events: none;
}
.chart-legends {
......@@ -1004,8 +1010,8 @@ export default {
text-align: left;
}
.rect {
width: 14px;
height: 14px;
width: 8px;
height: 8px;
display: inline-block;
vertical-align: middle;
}
......
......@@ -3,7 +3,7 @@
:visible.sync="dialogVisible"
:title="deviceData.device_sn"
@opened="openedEvents"
width="1820px"
width="1200px"
top="0"
>
<div id="device-container">
......@@ -210,7 +210,7 @@
:visible.sync="deviceVisible"
title="设备巡查情况"
custom-class="inner-dialog"
width="900px"
width="1200px"
append-to-body
>
<div>
......@@ -307,6 +307,7 @@ export default {
},
},
tooltip: {
appendToBody: true,
trigger: "item",
},
xAxis: {
......
......@@ -4,7 +4,7 @@
title="设备详情"
append-to-body
@opened="openedEvents"
width="1100px"
width="1200px"
>
<div>
<div class="title-label">
......@@ -137,6 +137,7 @@ export default {
},
},
tooltip: {
appendToBody: true,
trigger: "item",
},
xAxis: {
......
......@@ -303,6 +303,7 @@ export default {
right: 30,
},
tooltip: {
appendToBody: true,
trigger: "axis",
},
xAxis: {
......@@ -377,6 +378,7 @@ export default {
right: 30,
},
tooltip: {
appendToBody: true,
trigger: "axis",
},
xAxis: {
......@@ -670,9 +672,9 @@ export default {
font-size: 16px;
color: #ffffff;
line-height: 24px;
text-shadow: 0 0 5px rgba(99, 226, 253, 0.6),
0 0 5px rgba(99, 226, 253, 0.6), 0 0 6px rgba(99, 226, 253, 0.6),
0 0 40px rgba(99, 226, 253, 0.6);
text-shadow: 0 0 5px rgba(31, 129, 239, 0.6),
0 0 5px rgba(31, 129, 239, 0.6), 0 0 6px rgba(31, 129, 239, 0.6),
0 0 40px rgba(31, 129, 239, 0.6);
}
.warning-info-num {
font-size: 24px;
......@@ -710,6 +712,9 @@ export default {
&:nth-child(2n) {
background: rgba(44, 96, 162, 0.1);
}
&:hover {
background: rgba(44, 96, 162, 0.5);
}
}
.warning-table-run-time {
width: 30%;
......@@ -760,7 +765,7 @@ export default {
font-size: 18px;
color: #c6def9;
padding-bottom: 16px;
margin-bottom: 20px;
margin-bottom: 14px;
border-bottom: 1px solid #7a8fad;
img {
width: 32px;
......@@ -862,7 +867,7 @@ export default {
left: 0;
top: 0;
z-index: 999;
box-shadow: #1f81ef 0px 0px 8px inset;
box-shadow: rgba(99, 226, 253, 0.6) 0px 0px 16px inset;
pointer-events: none;
}
</style>
\ No newline at end of file
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