From 70bebe9dae89ebddd7e77543aac618e78d730fc9 Mon Sep 17 00:00:00 2001
From: gjj <Ganjj@probim.com.cn>
Date: Wed, 26 Feb 2025 16:39:32 +0800
Subject: [PATCH] 样式调整
---
src/views/EquipmentView.vue | 24 ++++++++++++------------
1 files changed, 12 insertions(+), 12 deletions(-)
diff --git a/src/views/EquipmentView.vue b/src/views/EquipmentView.vue
index b036fd5..c4dcaae 100644
--- a/src/views/EquipmentView.vue
+++ b/src/views/EquipmentView.vue
@@ -44,7 +44,7 @@
}">
</div>
<div class="equipment-status" :style="sectionStyle">
- <div class="w-full h-[30px] mb-[10px]" :style="{
+ <div class="w-full h-[30px]" :style="{
backgroundImage: `url(${bgImage})`,
backgroundRepeat: 'no-repeat',
backgroundPosition: 'center center',
@@ -71,10 +71,10 @@
<button class="control-btn" :class="{ 'active': currentTab === '升降机监控' }" @click="handleControlBtnClick('升降机监控')">升降机监控</button>
</div>
<div class="divider"></div>
- <div class="progress-bar">
+ <div class="progress-bar px-[10px]">
<div class="label">运行设备总数</div>
<div class="bar flex items-center">
- <div class="progress relative w-[80%] h-[24px]">
+ <div class="progress relative w-[90%] h-[24px]">
<div class="progress-inner" :style="{ width: `${deviceOnline / deviceTotal * 100}%` }"></div>
<div class="progress-blocks">
<div v-for="n in 28" :key="n" class="block" :class="{ 'active': (n-1)/28 * 100 <= (deviceOnline / deviceTotal * 100) }"></div>
@@ -236,14 +236,14 @@
},
},
data: [{
- value: 20,
+ value: 81.5,
name: '主隧洞掘进',
itemStyle: {
color: '#00FFFF'
}
},
{
- value: 80,
+ value: 18.5,
name: '',
itemStyle: {
color: 'transparent'
@@ -259,7 +259,7 @@
id: 'lixianChartBox',
name: '总离线',
value: 5,
- percentage: 81.5,
+ percentage: 33,
options: {
tooltip: {
trigger: 'item',
@@ -320,14 +320,14 @@
},
},
data: [{
- value: 20,
+ value: 33,
name: '主隧洞掘进',
itemStyle: {
color: '#00FFFF'
}
},
{
- value: 80,
+ value: 77,
name: '',
itemStyle: {
color: 'transparent'
@@ -343,7 +343,7 @@
id: 'baojingChartBox',
name: '总报警',
value: 0,
- percentage: 81.5,
+ percentage: 20,
options: {
tooltip: {
trigger: 'item',
@@ -560,7 +560,7 @@
}
.equipment-status {
- padding: 20px 10px;
+ padding: 10px 10px;
height: calc(100% - 5vh);
}
@@ -572,7 +572,7 @@
.status-circles {
display: flex;
justify-content: space-around;
- margin: 20px 0;
+ margin: 15px 0;
}
.progress-circle {
@@ -628,7 +628,7 @@
width: 100%;
height: 1px;
background: linear-gradient(270deg, rgba(94, 161, 209, 0.1) 0%, #4886BC 49%, rgba(48, 104, 165, 0.1) 100%);
- margin: 20px 0;
+ margin: 15px 0;
}
--
Gitblit v1.9.3