Skip to content

D
digital-construction
Commit 85388a32 authored by 张牧越's avatar 张牧越
Browse files
Options

styleFix

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