Skip to content

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

样式调整问题修正

parent 0b123c81
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 831 additions and 236 deletions
src/api/index.js
View file @ bf602083
......@@ -170,7 +170,7 @@ export function get24hTowerStatis() {
}
export function getTowerWarnings() {
return request({
return noLoadingrequest({
url: '/pweb/s/towercrane/warning/list',
method: 'get',
})
......@@ -332,7 +332,7 @@ export function getFallWarningStatus() {
}
export function getFallWarningTableList(params) {
return request({
return noLoadingrequest({
url: '/pweb/s/linbian/warning',
method: 'get',
params
......@@ -378,7 +378,7 @@ export function getPlatformWarningStatus() {
})
}
export function getPlatformWarningList(params) {
return request({
return noLoadingrequest({
url: '/pweb/s/unload/warning',
method: 'get',
params
......@@ -394,7 +394,7 @@ export function getElevatorList() {
})
}
export function getElevatorWarningList(params) {
return request({
return noLoadingrequest({
url: '/pweb/s/elevator/warning',
method: 'get',
params
......@@ -426,7 +426,7 @@ export function getCurrentMonthCheckStats() {
})
}
export function getBlackspotRankingList(params) {
return request({
return noLoadingrequest({
url: '/pweb/s/check/item/sort',
method: 'get',
params
......
src/assets/common/element.less
View file @ bf602083
......@@ -6,6 +6,7 @@
.el-dialog__title {
color: #fff !important;
font-weight: bold;
}
.el-dialog__headerbtn {
......@@ -45,6 +46,7 @@
::v-deep .el-table td.el-table__cell,
::v-deep .el-table th.el-table__cell.is-leaf {
border-color: transparent;
font-weight: 400 !important;
}
::v-deep .el-table__empty-text {
......
src/assets/iconfont/iconfont.css 0 → 100644
View file @ bf602083
@font-face {
font-family: "iconfont";
/* Project id 4100703 */
src: url('iconfont.woff2?t=1685676784641') format('woff2'),
url('iconfont.woff?t=1685676784641') format('woff'),
url('iconfont.ttf?t=1685676784641') format('truetype');
}
.iconfont {
font-family: "iconfont" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-anquanmao:before {
content: "\e9cb";
}
.icon-you-21:before {
content: "\e7b7";
}
.icon-shanchu-2:before {
content: "\e7b8";
}
.icon-you-23:before {
content: "\e7c4";
}
.icon-you-22:before {
content: "\e7d3";
}
.icon-you-2-2:before {
content: "\e7d4";
}
.icon-shang-01:before {
content: "\e8e3";
}
.icon-shang-02:before {
content: "\e8e4";
}
.icon-shanghun-2:before {
content: "\e9d0";
}
.icon-shanghun-3:before {
content: "\e9d1";
}
.icon-shanghun-1:before {
content: "\e9d2";
}
.icon-linbianfanghu-liebiao-2:before {
content: "\e9c9";
}
.icon-anquanmao-dangqianshiyong:before {
content: "\e9c1";
}
.icon-icon_ss:before {
content: "\e9c2";
}
.icon-shipinjiankong-1:before {
content: "\e9c3";
}
.icon-anquanmao-lishiguiji:before {
content: "\e9c4";
}
.icon-bofang:before {
content: "\e9c5";
}
.icon-tadiao:before {
content: "\e9c6";
}
.icon-shigongshengjiangji:before {
content: "\e9c7";
}
.icon-shipinjiankong-2:before {
content: "\e9c8";
}
.icon-linbianfanghu-liebiao-1:before {
content: "\e9ca";
}
.icon-yangchenzaoyin:before {
content: "\e9cc";
}
.icon-linbianfanghu-dingwei:before {
content: "\e9cd";
}
.icon-xieliaopingtai:before {
content: "\e9ce";
}
\ No newline at end of file
src/assets/iconfont/iconfont.js 0 → 100644
View file @ bf602083
This diff is collapsed.
src/assets/iconfont/iconfont.json 0 → 100644
View file @ bf602083
{
"id": "4100703",
"name": "智慧工地",
"font_family": "font_family",
"css_prefix_text": "icon-",
"description": "",
"glyphs": [
{
"icon_id": "35798422",
"name": "安全帽",
"font_class": "anquanmao",
"unicode": "e9cb",
"unicode_decimal": 59851
},
{
"icon_id": "15937967",
"name": "ico_xiaj",
"font_class": "you-21",
"unicode": "e7b7",
"unicode_decimal": 59319
},
{
"icon_id": "15937969",
"name": "ico_guanbi",
"font_class": "shanchu-2",
"unicode": "e7b8",
"unicode_decimal": 59320
},
{
"icon_id": "16040674",
"name": "ico_shang",
"font_class": "you-23",
"unicode": "e7c4",
"unicode_decimal": 59332
},
{
"icon_id": "16111497",
"name": "ico_zuo",
"font_class": "you-22",
"unicode": "e7d3",
"unicode_decimal": 59347
},
{
"icon_id": "16111498",
"name": "ico_you",
"font_class": "you-2-2",
"unicode": "e7d4",
"unicode_decimal": 59348
},
{
"icon_id": "28202666",
"name": "shang-01",
"font_class": "shang-01",
"unicode": "e8e3",
"unicode_decimal": 59619
},
{
"icon_id": "28202667",
"name": "shang-02",
"font_class": "shang-02",
"unicode": "e8e4",
"unicode_decimal": 59620
},
{
"icon_id": "35798148",
"name": "商混-2",
"font_class": "shanghun-2",
"unicode": "e9d0",
"unicode_decimal": 59856
},
{
"icon_id": "35798149",
"name": "商混-3",
"font_class": "shanghun-3",
"unicode": "e9d1",
"unicode_decimal": 59857
},
{
"icon_id": "35798150",
"name": "商混-1",
"font_class": "shanghun-1",
"unicode": "e9d2",
"unicode_decimal": 59858
},
{
"icon_id": "35798104",
"name": "临边防护-列表-2",
"font_class": "linbianfanghu-liebiao-2",
"unicode": "e9c9",
"unicode_decimal": 59849
},
{
"icon_id": "35798047",
"name": "安全帽-当前使用",
"font_class": "anquanmao-dangqianshiyong",
"unicode": "e9c1",
"unicode_decimal": 59841
},
{
"icon_id": "35798048",
"name": "icon_ss",
"font_class": "icon_ss",
"unicode": "e9c2",
"unicode_decimal": 59842
},
{
"icon_id": "35798049",
"name": "视频监控-1",
"font_class": "shipinjiankong-1",
"unicode": "e9c3",
"unicode_decimal": 59843
},
{
"icon_id": "35798050",
"name": "安全帽-历史轨迹",
"font_class": "anquanmao-lishiguiji",
"unicode": "e9c4",
"unicode_decimal": 59844
},
{
"icon_id": "35798051",
"name": "播放",
"font_class": "bofang",
"unicode": "e9c5",
"unicode_decimal": 59845
},
{
"icon_id": "35798052",
"name": "塔吊",
"font_class": "tadiao",
"unicode": "e9c6",
"unicode_decimal": 59846
},
{
"icon_id": "35798053",
"name": "施工升降机",
"font_class": "shigongshengjiangji",
"unicode": "e9c7",
"unicode_decimal": 59847
},
{
"icon_id": "35798054",
"name": "视频监控-2",
"font_class": "shipinjiankong-2",
"unicode": "e9c8",
"unicode_decimal": 59848
},
{
"icon_id": "35798056",
"name": "临边防护-列表-1",
"font_class": "linbianfanghu-liebiao-1",
"unicode": "e9ca",
"unicode_decimal": 59850
},
{
"icon_id": "35798058",
"name": "扬尘噪音",
"font_class": "yangchenzaoyin",
"unicode": "e9cc",
"unicode_decimal": 59852
},
{
"icon_id": "35798059",
"name": "临边防护-定位",
"font_class": "linbianfanghu-dingwei",
"unicode": "e9cd",
"unicode_decimal": 59853
},
{
"icon_id": "35798060",
"name": "卸料平台",
"font_class": "xieliaopingtai",
"unicode": "e9ce",
"unicode_decimal": 59854
}
]
}
src/components/Index.vue
View file @ bf602083
......@@ -160,16 +160,28 @@ export default {
},
bodyScale() {
var deviceHeight = window.screen.height;
var scale = deviceHeight / 1230;
// var deviceWidth = window.screen.width;
var scale = deviceHeight / 1250; // height:550=2100 height:720=1680 height:940=1250 height:2160=1080
// var canvasScale = deviceWidth / 1920;
// 1.777778 16:9 1080
//1.6 16:10 1100
// 1.547 1728:890 1350
console.log(window.screen.width / window.screen.height);
document.body.style.zoom = scale;
document.styleSheets[document.styleSheets.length - 1].insertRule(
"canvas {zoom: " + 1 / scale + "}"
"canvas:not(.amap-layer):not(.amap-labels) {zoom: " +
Number(1 / scale).toFixed(2) +
"!important}"
);
document.styleSheets[document.styleSheets.length - 1].insertRule(
"canvas {transform: scale(" + scale + ")}"
"canvas:not(.amap-layer):not(.amap-labels) {transform: scale(" +
scale +
")!important}"
);
document.styleSheets[document.styleSheets.length - 1].insertRule(
"canvas {transform-origin: 0 0}"
"canvas:not(.amap-layer):not(.amap-labels) {transform-origin: 0 0}"
);
},
jumpBack() {
......@@ -260,6 +272,9 @@ export default {
}
}
}
.parent-router {
margin-right: 0 !important;
}
a,
.parent-router {
cursor: pointer;
......@@ -267,7 +282,7 @@ a,
text-align: center;
display: inline-block;
text-decoration: none;
margin-right: 16px;
margin-right: 8px;
color: #80a1c6;
padding: 9px 12px;
border: 1px solid #0f5da6;
......@@ -337,9 +352,13 @@ a,
.weather-img {
vertical-align: top;
width: 50px;
height: 50px;
margin-right: 6px;
}
}
.el-dropdown {
margin-right: 8px;
}
.el-dropdown-menu {
padding: 0;
border: none;
......
src/components/construction/Index.vue
View file @ bf602083
......@@ -136,14 +136,22 @@
<div class="count" style="color: rgba(254, 186, 1, 1)">
{{ screenDetail.today_manage_attendance_rate }} <span>%</span>
</div>
<img src="@/assets/icon-person.png" alt="" />
<img
style="width: 120px; transform: translateY(-30px)"
src="@/assets/icon-person.png"
alt=""
/>
</div>
<div class="checks">
<div class="title">普通工人/考勤率</div>
<div class="count" style="color: rgba(24, 215, 185, 1)">
{{ screenDetail.today_normal_attendance_rate }} <span>%</span>
</div>
<img src="@/assets/icon-person.png" alt="" />
<img
style="width: 120px; transform: translateY(-30px)"
src="@/assets/icon-person.png"
alt=""
/>
</div>
</div>
</ShadowContainer>
......@@ -235,7 +243,6 @@
<Title text="AI预警"> </Title>
<ShadowContainer>
<div class="chart-container">
<img class="custom-chart" src="@/assets/chart.png" />
<div ref="qualityChart" id="quality-chart"></div>
</div>
</ShadowContainer>
......@@ -360,7 +367,7 @@ export default {
const option = {
title: {
x: "49%", //X坐标
y: "30%",
y: "27%",
text: total,
subtext: "AI预警",
textAlign: "center",
......@@ -384,7 +391,7 @@ export default {
itemHeight: 12,
itemWidth: 12,
icon: "rect",
bottom: "5%",
bottom: "0%",
left: "center",
itemGap: 40,
textStyle: {
......@@ -431,7 +438,14 @@ export default {
position: "center",
},
data: this.aiwarningData,
data: this.aiwarningData.map((item) => {
return {
...item,
itemStyle: {
color: item.name == "已处理" ? "#AEE4F8" : "#FF754C",
},
};
}),
},
],
};
......@@ -662,7 +676,7 @@ table {
position: relative;
.custom-chart {
position: absolute;
width: 160px;
width: 20%;
left: 50%;
transform: translateX(-50%);
top: 18%;
......@@ -671,7 +685,7 @@ table {
#security-chart,
#quality-chart {
width: 100%;
height: 370px;
height: 220px;
}
.steps {
padding-top: 40px;
......@@ -764,6 +778,8 @@ table {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
height: 528px;
overflow-y: auto;
.status-count {
width: calc(100% / 3);
padding: 30px 0px;
......@@ -809,7 +825,7 @@ table {
}
}
.table-scroll {
max-height: 300px;
max-height: 366px;
overflow-y: auto;
}
.check-in {
......
src/components/earlywarning/Index.vue
View file @ bf602083
......@@ -90,11 +90,9 @@
<ShadowContainer>
<div class="total-chart">
<div class="chart-container">
<img class="custom-chart" src="@/assets/chart.png" />
<div ref="todayChart" id="today-chart"></div>
</div>
<div class="chart-container">
<img class="custom-chart" src="@/assets/chart.png" />
<div ref="historyChart" id="history-chart"></div>
</div>
</div>
......@@ -301,7 +299,14 @@ export default {
position: "center",
},
data: chartData,
data: chartData.map((item) => {
return {
...item,
itemStyle: {
color: item.name == "未处理" ? "#FFAF51" : "#0CDEE3",
},
};
}),
},
],
};
......@@ -395,7 +400,14 @@ export default {
position: "center",
},
data: chartData,
data: chartData.map((item) => {
return {
...item,
itemStyle: {
color: item.name == "未处理" ? "#FCFF11" : "#2980FF",
},
};
}),
},
],
};
......
src/components/elevator/Index.vue
View file @ bf602083
This diff is collapsed.
src/components/fallprotection/Index.vue
View file @ bf602083
......@@ -10,7 +10,7 @@
:key="index"
>
<div class="level-title" @click="showDeviceStatus(building)">
<img src="@/assets/fallprotection/building-2.png" alt="" />
<i class="iconfont icon-linbianfanghu-liebiao-1"></i>
{{ building.area_name }}
<span>{{ building.total }}</span>
</div>
......@@ -21,7 +21,7 @@
:key="i"
@click="showDeviceInfo(device)"
>
<img src="@/assets/fallprotection/device.png" alt="" />
<i class="iconfont icon-linbianfanghu-liebiao-2"></i>
{{ device.device_no }}
<span
:style="{ color: device.is_online == 1 ? '#26D591' : '' }"
......@@ -73,7 +73,6 @@
v-for="(warn, index) in fallWarningList"
:key="index"
>
<img src="@/assets/fallprotection/rect.png" alt="" />
<div class="warning-info">
<div class="warning-num">{{ warn.num }}</div>
<div class="warning-text">{{ warn.alarm_type_text }}</div>
......@@ -124,6 +123,7 @@
class="warning-table-list"
v-infinite-scroll="load"
:infinite-scroll-distance="1"
id="table-scroll"
>
<div
class="warning-table-column"
......@@ -213,6 +213,11 @@ export default {
resizeEnable: true,
mapStyle: "amap://styles/darkblue",
});
this.$nextTick(() => {
var scale = window.screen.height / 1250;
console.log(document.getElementById("amap-container").style);
document.getElementById("amap-container").style.zoom = 1 / scale;
});
this.map.on("click", () => {
this.buildingWindowVisible = false;
});
......@@ -355,9 +360,39 @@ export default {
getFallWarningTableList({ page: 1 }).then((res) => {
this.page = 1;
this.fallwarningTableData = res.data.data;
this.$nextTick(() => {
const element = document.getElementById("table-scroll");
this.autoScroll(1, 50, 1500, element);
});
});
}
},
autoScroll(stepLength, speed, delay, element) {
let interval;
//let step = 1
element.scrollTop = 0;
function start() {
interval = setInterval(scrolling, speed);
element.scrollTop += stepLength;
}
function scrolling() {
var sTop = element.scrollTop;
element.scrollTop += stepLength;
if (
sTop === element.scrollTop ||
sTop == 0 ||
element.scrollTop === element.scrollHeight - element.offsetHeight
) {
element.scrollTop = 0;
clearInterval(interval);
setTimeout(start, delay);
}
}
if (element.offsetHeight !== element.scrollHeight) {
// 元素内容没有溢出时，不触发
setTimeout(start, delay);
}
},
},
mounted() {
getBaseInfo().then((res) => {
......@@ -445,6 +480,10 @@ export default {
}
.level-title {
line-height: 22px;
&:hover {
color: #27acfb;
background: rgba(44, 96, 162, 0.5);
}
img {
width: 22px;
vertical-align: top;
......@@ -460,7 +499,10 @@ export default {
}
.level-info {
line-height: 22px;
&:hover {
color: #27acfb;
background: rgba(44, 96, 162, 0.5);
}
img {
width: 22px;
vertical-align: top;
......@@ -468,7 +510,7 @@ export default {
background: rgba(44, 96, 162, 0.1);
font-size: 14px;
color: #c6def9;
padding: 10px 12px;
padding: 10px 30px;
border-top: 1px solid rgba(122, 143, 173, 0.2);
cursor: pointer;
span {
......@@ -483,10 +525,13 @@ export default {
.warning-count {
display: inline-block;
vertical-align: top;
width: 49%;
position: relative;
padding: 20px 0;
width: 32%;
margin-right: 2%;
&:nth-child(2n) {
margin-bottom: 16px;
background: url("@/assets/fallprotection/rect.png") no-repeat;
background-size: 100% 100%;
&:nth-child(3n) {
margin-right: 0;
}
img {
......@@ -494,10 +539,6 @@ export default {
width: 100%;
}
.warning-info {
position: absolute;
left: 50%;
top: 50%;
transform: translateX(-50%) translateY(-50%);
text-align: center;
.warning-num {
font-size: 24px;
......@@ -506,6 +547,7 @@ export default {
.warning-text {
font-size: 14px;
color: #27acfb;
white-space: nowrap;
}
}
}
......@@ -569,7 +611,7 @@ export default {
}
}
.warning-scroll {
height: 370px;
height: 346px;
overflow-y: auto;
}
......@@ -586,9 +628,9 @@ export default {
}
.recent-open,
.building-info-text {
font-size: 16px;
font-size: 14px;
color: #c6def9;
line-height: 45px;
line-height: 36px;
}
.building-info {
display: flex;
......
src/components/management/Index.vue
View file @ bf602083
......@@ -240,7 +240,12 @@ export default {
mapStyle: "amap://styles/darkblue",
});
this.map.on("click", () => {});
this.$nextTick(() => {
var scale = window.screen.height / 1250;
document.getElementById("amap-container").style.zoom = 1 / scale;
});
})
.catch((e) => {
console.log(e);
});
......
src/components/management/sampleDialog.vue
View file @ bf602083
......@@ -87,6 +87,11 @@ export default {
resizeEnable: true,
mapStyle: "amap://styles/darkblue",
});
this.$nextTick(() => {
var scale = window.screen.height / 1250;
document.getElementById("sample-map-container").style.zoom =
1 / scale;
});
});
},
search() {
......
src/components/noise/Index.vue
View file @ bf602083
......@@ -10,7 +10,7 @@
:key="index"
@click="changeMonitor(monitor, index)"
>
<img src="@/assets/noise/icon_device.png" alt="" />
<i class="iconfont icon-yangchenzaoyin"></i>
{{ monitor.device_name }} / {{ monitor.device_no }}
</div>
</div>
......@@ -18,14 +18,12 @@
<Title text="设备总览"></Title>
<ShadowContainer>
<div class="chart-container">
<img class="custom-chart" src="@/assets/chart.png" />
<div ref="deviceChart" id="device-chart"></div>
</div>
</ShadowContainer>
<Title text="近30日噪音"></Title>
<ShadowContainer>
<div class="chart-container">
<img class="custom-chart" src="@/assets/chart.png" />
<div ref="noiseChart" id="noise-chart"></div>
</div>
</ShadowContainer>
......@@ -132,6 +130,7 @@
class="warning-table-list"
v-infinite-scroll="load"
:infinite-scroll-distance="1"
id="table-scroll"
>
<div
class="warning-table-column"
......@@ -250,8 +249,8 @@ export default {
itemHeight: 12,
itemWidth: 12,
icon: "rect",
right: "10%",
top: "20%",
right: "15%",
top: "35%",
orient: "vertical",
itemGap: 20,
textStyle: {
......@@ -283,7 +282,7 @@ export default {
series: [
{
type: "pie",
radius: ["80%", "90%"],
radius: ["60%", "70%"],
center: ["28%", "50%"],
avoidLabelOverlap: false,
itemStyle: {
......@@ -295,7 +294,14 @@ export default {
position: "center",
},
data: pieData,
data: pieData.map((item) => {
return {
...item,
itemStyle: {
color: item.name == "在线总数" ? "#18D7B9" : "#FEBA01",
},
};
}),
},
],
};
......@@ -334,10 +340,10 @@ export default {
itemHeight: 12,
itemWidth: 12,
icon: "rect",
right: "10%",
top: "30%",
right: "15%",
top: "35%",
orient: "vertical",
itemGap: 40,
itemGap: 20,
textStyle: {
color: "inherit",
rich: {
......@@ -367,7 +373,7 @@ export default {
series: [
{
type: "pie",
radius: ["80%", "90%"],
radius: ["60%", "70%"],
center: ["28%", "50%"],
avoidLabelOverlap: false,
itemStyle: {
......@@ -379,7 +385,14 @@ export default {
position: "center",
},
data: chartData,
data: chartData.map((item) => {
return {
...item,
itemStyle: {
color: item.name == "达标" ? "#18D7B9" : "#FF754C",
},
};
}),
},
],
};
......@@ -529,9 +542,39 @@ export default {
}).then((res) => {
this.page = 1;
this.warnings = res.data.data;
this.$nextTick(() => {
const element = document.getElementById("table-scroll");
this.autoScroll(1, 50, 1500, element);
});
});
}
},
autoScroll(stepLength, speed, delay, element) {
let interval;
//let step = 1
element.scrollTop = 0;
function start() {
interval = setInterval(scrolling, speed);
element.scrollTop += stepLength;
}
function scrolling() {
var sTop = element.scrollTop;
element.scrollTop += stepLength;
if (
sTop === element.scrollTop ||
sTop == 0 ||
element.scrollTop === element.scrollHeight - element.offsetHeight
) {
element.scrollTop = 0;
clearInterval(interval);
setTimeout(start, delay);
}
}
if (element.offsetHeight !== element.scrollHeight) {
// 元素内容没有溢出时，不触发
setTimeout(start, delay);
}
},
},
mounted() {
this.getNoiseData();
......@@ -549,6 +592,7 @@ export default {
.mid-area {
width: calc(44% - 40px);
margin: 0 20px;
min-width: 840px;
}
}
.chart-container {
......@@ -597,7 +641,7 @@ export default {
}
#aqi-chart {
width: 100%;
height: 154px;
height: 200px;
}
.monitor {
display: flex;
......@@ -809,9 +853,12 @@ export default {
}
#stats-container {
position: relative;
margin-bottom: 60px;
margin-bottom: 10px;
border-bottom: 4px solid #114e70;
img {
width: 100%;
vertical-align: top;
}
.text {
color: #ffffff;
......
src/components/projectcheck/Index.vue
View file @ bf602083
......@@ -4,7 +4,6 @@
<Title text="本月检查统计"></Title>
<ShadowContainer>
<div class="chart-container" id="current-chart">
<img class="custom-chart" src="@/assets/chart.png" />
<div id="current-check-stats" ref="currentCheckStatsChart"></div>
</div>
</ShadowContainer>
......@@ -20,6 +19,7 @@
class="warning-table-list"
v-infinite-scroll="load"
:infinite-scroll-distance="1"
id="table-scroll"
>
<div
class="warning-table-column"
......@@ -70,28 +70,24 @@
<div class="chart-angle">
<div class="chart-title">项目自查</div>
<div class="chart-container">
<img class="custom-chart" src="@/assets/chart.png" />
<div id="project-check-chart" ref="projectCheck"></div>
</div>
</div>
<div class="chart-angle">
<div class="chart-title">企业检查</div>
<div class="chart-container">
<img class="custom-chart" src="@/assets/chart.png" />
<div id="enterprise-check" ref="enterpriseCheck"></div>
</div>
</div>
<div class="chart-angle">
<div class="chart-title">监督检测</div>
<div class="chart-container">
<img class="custom-chart" src="@/assets/chart.png" />
<div id="supervise-check" ref="superviseCheck"></div>
</div>
</div>
<div class="chart-angle">
<div class="chart-title">移动巡查</div>
<div class="chart-container">
<img class="custom-chart" src="@/assets/chart.png" />
<div id="move-check" ref="moveCheck"></div>
</div>
</div>
......@@ -275,7 +271,23 @@ export default {
position: "center",
},
data: chartData,
data: chartData.map((item) => {
return {
...item,
itemStyle: {
color:
item.name == "无问题"
? "#18D7B9"
: item.name == "待整改"
? "#E39B36"
: item.name == "复查中"
? "#5399F7"
: item.name == "已整改"
? "#E25E80"
: "",
},
};
}),
},
],
};
......@@ -291,19 +303,15 @@ export default {
});
},
load() {
if (this.blackspotRanking.length == this.blackSpotPage * 10) {
getBlackspotRankingList({
page: this.blackSpotPage + 1,
}).then((res) => {
this.blackSpotPage += 1;
this.blackspotRanking = [...this.blackspotRanking, ...res.data.data];
this.$forceUpdate();
});
} else if (this.blackspotRanking.length == 0) {
if (this.blackspotRanking.length == 0) {
getBlackspotRankingList({ page: 1 }).then((res) => {
this.blackSpotPage = 1;
this.blackspotRanking = res.data.data;
this.$forceUpdate();
this.$nextTick(() => {
const element = document.getElementById("table-scroll");
this.autoScroll(1, 50, 1500, element);
});
});
}
},
......@@ -334,23 +342,31 @@ export default {
this.renderSmallChart(
"project-check-chart",
"projectCheck",
res.data.project_data
res.data.project_data,
"#FEBA01"
);
this.renderSmallChart(
"enterprise-check",
"enterpriseCheck",
res.data.company_data
res.data.company_data,
"#FC6E03"
);
this.renderSmallChart(
"supervise-check",
"superviseCheck",
res.data.supervise_data
res.data.supervise_data,
"#E86365"
);
this.renderSmallChart(
"move-check",
"moveCheck",
res.data.move_data,
"#CD4091"
);
this.renderSmallChart("move-check", "moveCheck", res.data.move_data);
this.renderQuestionBarChart(res.data);
});
},
renderSmallChart(id, ref, data) {
renderSmallChart(id, ref, data, pColor) {
const chartData = [...data];
const chart = this.$echarts.init(this.$refs[`${ref}`]);
let total = 0;
......@@ -428,7 +444,14 @@ export default {
position: "center",
},
data: chartData,
data: chartData.map((item) => {
return {
...item,
itemStyle: {
color: item.name == "有隐患" ? pColor : "#18D7B9",
},
};
}),
},
],
};
......@@ -458,6 +481,14 @@ export default {
})[0].value;
}),
barWidth: 15,
itemStyle: {
color:
item.name == "质量问题"
? "#B16400"
: item.name == "安全问题"
? "#CF2C16"
: "",
},
};
});
const option = {
......@@ -521,6 +552,32 @@ export default {
this.correctDialogVisible = true;
});
},
autoScroll(stepLength, speed, delay, element) {
let interval;
//let step = 1
element.scrollTop = 0;
function start() {
interval = setInterval(scrolling, speed);
element.scrollTop += stepLength;
}
function scrolling() {
var sTop = element.scrollTop;
element.scrollTop += stepLength;
if (
sTop === element.scrollTop ||
sTop == 0 ||
element.scrollTop === element.scrollHeight - element.offsetHeight
) {
element.scrollTop = 0;
clearInterval(interval);
setTimeout(start, delay);
}
}
if (element.offsetHeight !== element.scrollHeight) {
// 元素内容没有溢出时，不触发
setTimeout(start, delay);
}
},
},
mounted() {
getCurrentMonthCheckStats().then((res) => {
......@@ -590,8 +647,8 @@ export default {
}
.custom-chart {
position: absolute;
width: 25%;
left: 15.5%;
width: 20%;
left: 18%;
transform: translateY(-50%);
top: 50%;
}
......
src/components/realname/Index.vue
View file @ bf602083
......@@ -124,7 +124,6 @@
<Title text="人员地域分布"></Title>
<ShadowContainer>
<div class="chart-container" id="reset-area2">
<img class="custom-chart" src="@/assets/chart.png" />
<div ref="areaChart" id="area-chart"></div>
</div>
</ShadowContainer>
......
src/components/safecap/Index.vue
View file @ bf602083
......@@ -27,7 +27,10 @@
/>
</div>
<div class="device-description">
<div>{{ device.person_type }} / {{ device.person_name }}</div>
<div>
{{ device.person_type ? device.person_type : "---" }} /
{{ device.person_name ? device.person_name : "---" }}
</div>
<div>绑定设备：{{ device.name }}</div>
</div>
<div
......@@ -65,7 +68,10 @@
>{{ windowData.is_online_text }}</span
>
<span class="name"
>{{ windowData.person_type }} / {{ windowData.person_name }}</span
>{{ windowData.person_type ? windowData.person_type : "---" }} /
{{
windowData.person_name ? windowData.person_name : "---"
}}</span
>
</div>
<div class="recent-open">最近使用:{{ windowData.last_use_time }}</div>
......@@ -265,6 +271,10 @@ export default {
console.log(e);
this.capWindowVisible = false;
});
this.$nextTick(() => {
var scale = window.screen.height / 1250;
document.getElementById("amap-container").style.zoom = 1 / scale;
});
this.getSafeCapDeviceList();
this.getSafeCapArea();
})
......@@ -461,7 +471,6 @@ export default {
}
.cap-window {
width: 460px;
height: 170px;
position: absolute;
left: 50%;
top: 50%;
......
src/components/safecap/mapDialog.vue
View file @ bf602083
......@@ -2,7 +2,7 @@
<el-dialog
:visible.sync="dialogVisible"
title="使用轨迹"
width="80vw"
width="1200px"
top="10vh"
append-to-body
>
......@@ -97,6 +97,10 @@ export default {
resizeEnable: true,
mapStyle: "amap://styles/darkblue",
});
this.$nextTick(() => {
var scale = window.screen.height / 1250;
document.getElementById("route-map-container").style.zoom = 1 / scale;
});
this.search();
});
},
......
src/components/supervisory/Index.vue
View file @ bf602083
......@@ -134,13 +134,14 @@ export default {
on-click={() => this.selectNode(node, data)}
>
<span>
<img
src={
<span
class={
node.level == 1
? require("@/assets/visor.png")
: require("@/assets/camera.png")
? "iconfont icon-shipinjiankong-1"
: "iconfont icon-shipinjiankong-2"
}
/>
style="margin-right:6px"
></span>
{node.label}
</span>
{node.level == 1 && <span>{data.device_count}</span>}
......@@ -308,6 +309,7 @@ export default {
</script>
<style lang="less" scoped>
@import "@/assets/common/element.less";
#supervisory {
padding: 12px 20px;
display: flex;
......
src/components/tower/Index.vue
View file @ bf602083
......@@ -4,7 +4,6 @@
<Title text="设备总览"></Title>
<ShadowContainer>
<div class="chart-container">
<img class="custom-chart" src="@/assets/chart.png" />
<div ref="deviceChart" id="device-chart"></div>
</div>
</ShadowContainer>
......@@ -96,6 +95,7 @@
class="warning-table-list"
v-infinite-scroll="load"
:infinite-scroll-distance="1"
id="table-scroll"
>
<div
class="warning-table-column"
......@@ -212,8 +212,8 @@ export default {
itemHeight: 12,
itemWidth: 12,
icon: "rect",
right: "10%",
top: "15%",
right: "15%",
top: "30%",
orient: "vertical",
itemGap: 40,
textStyle: {
......@@ -245,7 +245,7 @@ export default {
series: [
{
type: "pie",
radius: ["80%", "90%"],
radius: ["60%", "70%"],
center: ["28%", "50%"],
avoidLabelOverlap: false,
itemStyle: {
......@@ -256,7 +256,14 @@ export default {
show: false,
position: "center",
},
data: pieData,
data: pieData.map((item) => {
return {
...item,
itemStyle: {
color: item.name == "在线总数" ? "#2980FF" : "#AEE4F8",
},
};
}),
},
],
};
......@@ -453,6 +460,10 @@ export default {
resizeEnable: true,
mapStyle: "amap://styles/darkblue",
});
this.$nextTick(() => {
var scale = window.screen.height / 1250;
document.getElementById("amap-container").style.zoom = 1 / scale;
});
this.map.on("click", (e) => {
console.log(e);
this.towerWindowVisible = false;
......@@ -664,9 +675,39 @@ export default {
getTowerWarnings({ page: 1, limit: 20 }).then((res) => {
this.page = 1;
this.warnings = res.data.data;
this.$nextTick(() => {
const element = document.getElementById("table-scroll");
this.autoScroll(1, 50, 1500, element);
});
});
}
},
autoScroll(stepLength, speed, delay, element) {
let interval;
//let step = 1
element.scrollTop = 0;
function start() {
interval = setInterval(scrolling, speed);
element.scrollTop += stepLength;
}
function scrolling() {
var sTop = element.scrollTop;
element.scrollTop += stepLength;
if (
sTop === element.scrollTop ||
sTop == 0 ||
element.scrollTop === element.scrollHeight - element.offsetHeight
) {
element.scrollTop = 0;
clearInterval(interval);
setTimeout(start, delay);
}
}
if (element.offsetHeight !== element.scrollHeight) {
// 元素内容没有溢出时，不触发
setTimeout(start, delay);
}
},
},
mounted() {
this.getTowerData();
......@@ -821,15 +862,15 @@ export default {
}
}
.monitor-list {
height: 320px;
height: 210px;
overflow-y: auto;
}
.noise-monitor {
font-size: 14px;
color: #c6def9;
line-height: 72px;
background: rgba(44, 96, 162, 0.05);
padding: 0 12px;
padding: 10px 12px;
line-height: 22px;
margin-bottom: 12px;
cursor: pointer;
&:last-child {
......@@ -840,10 +881,7 @@ export default {
background: rgba(44, 96, 162, 0.2);
}
img {
width: 30px;
height: 30px;
margin-top: 20px;
margin-right: 12px;
width: 20px;
vertical-align: top;
}
.device-description {
......@@ -909,7 +947,7 @@ export default {
text-align: center;
color: #c6def9;
.warning-table-list {
height: 380px;
height: 500px;
overflow-y: auto;
}
.warning-table-header {
......
src/components/unloadingplatform/Index.vue
View file @ bf602083
......@@ -11,7 +11,7 @@
@click="showDeviceInfo(platform)"
>
<div class="platform-title">
<img src="@/assets/unloadingplatform/platform.png" alt="" />
<i class="iconfont icon-xieliaopingtai"></i>
{{ platform.device_no }}
<span
:style="{ color: platform.is_online == 1 ? '#66cab9' : '' }"
......@@ -38,6 +38,7 @@
</div>
</div>
<div id="battery-chart" ref="batteryChart"></div>
<div class="separate-chart-line"></div>
<div id="weight-chart" ref="weightChart"></div>
</ShadowContainer>
</div>
......@@ -110,6 +111,7 @@
class="warning-table-list"
v-infinite-scroll="load"
:infinite-scroll-distance="1"
id="table-scroll"
>
<div
class="warning-table-column"
......@@ -201,6 +203,11 @@ export default {
resizeEnable: true,
mapStyle: "amap://styles/darkblue",
});
this.$nextTick(() => {
var scale = window.screen.height / 1250;
document.getElementById("amap-container").style.zoom = 1 / scale;
});
this.map.on("click", () => {
this.platformWindowVisible = false;
});
......@@ -431,9 +438,39 @@ export default {
getPlatformWarningList({ page: 1, limit: 20 }).then((res) => {
this.page = 1;
this.platformWarningList = res.data.data;
this.$nextTick(() => {
const element = document.getElementById("table-scroll");
this.autoScroll(1, 50, 1500, element);
});
});
}
},
autoScroll(stepLength, speed, delay, element) {
let interval;
//let step = 1
element.scrollTop = 0;
function start() {
interval = setInterval(scrolling, speed);
element.scrollTop += stepLength;
}
function scrolling() {
var sTop = element.scrollTop;
element.scrollTop += stepLength;
if (
sTop === element.scrollTop ||
sTop == 0 ||
element.scrollTop === element.scrollHeight - element.offsetHeight
) {
element.scrollTop = 0;
clearInterval(interval);
setTimeout(start, delay);
}
}
if (element.offsetHeight !== element.scrollHeight) {
// 元素内容没有溢出时，不触发
setTimeout(start, delay);
}
},
},
mounted() {
......@@ -535,6 +572,7 @@ export default {
}
&:hover {
background: rgba(44, 96, 162, 0.5);
color: #16c0ff;
}
&.active {
background: rgba(44, 96, 162, 0.5);
......@@ -561,7 +599,7 @@ export default {
}
#battery-chart,
#weight-chart {
height: 250px;
height: 230px;
}
.warning-count {
display: inline-block;
......@@ -669,9 +707,9 @@ export default {
}
.recent-open,
.building-info-text {
font-size: 16px;
font-size: 14px;
color: #c6def9;
line-height: 45px;
line-height: 36px;
}
.building-info {
display: flex;
......@@ -742,8 +780,9 @@ export default {
.filters {
display: flex;
justify-content: space-between;
justify-content: center;
margin-bottom: 10px;
.filter {
font-size: 14px;
color: rgba(198, 222, 249, 1);
......@@ -751,6 +790,7 @@ export default {
padding: 6px;
text-align: center;
cursor: pointer;
margin: 0 40px;
background: linear-gradient(
90deg,
rgba(8, 36, 71, 0) 0%,
......@@ -762,4 +802,10 @@ export default {
}
}
}
.separate-chart-line {
background: #114e70;
height: 4px;
width: 100%;
margin: 20px 0;
}
</style>
\ No newline at end of file
src/main.js
View file @ bf602083
......@@ -8,7 +8,7 @@ import Title from "@/components/Title"
import ShadowContainer from "@/components/ShadowContainer"
import * as echarts from "echarts"
import scroll from 'vue-seamless-scroll'
import "@/assets/iconfont/iconfont.css";
Vue.use(scroll)
......
vue.config.js
View file @ bf602083
......@@ -7,11 +7,11 @@ module.exports = defineConfig({
postcss: {
postcssOptions: {
plugins: [
// require('postcss-plugin-px2rem')({
// rootValue: 100,
// mediaQuery: false, //（布尔值）允许在媒体查询中转换px。
// minPixelValue: 5 //设置要替换的最小像素值(3px会被转rem)。 默认 0
// }),
require('postcss-plugin-px2rem')({
rootValue: 54,
mediaQuery: false, //（布尔值）允许在媒体查询中转换px。
minPixelValue: 5 //设置要替换的最小像素值(3px会被转rem)。 默认 0
}),
]
}
......
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