From e602e7229a696cf50bc9e9e971a2d8f40ea9017a Mon Sep 17 00:00:00 2001
From: 张含笑 <zhx18749296735@163.com>
Date: Thu, 10 Apr 2025 18:06:38 +0800
Subject: [PATCH] feat: 修改首页机场详情样式效果
---
src/views/Home/HomeLeft/OverviewNext.vue | 22 ++++++++++++++++++----
1 files changed, 18 insertions(+), 4 deletions(-)
diff --git a/src/views/Home/HomeLeft/OverviewNext.vue b/src/views/Home/HomeLeft/OverviewNext.vue
index c208113..fc539e6 100644
--- a/src/views/Home/HomeLeft/OverviewNext.vue
+++ b/src/views/Home/HomeLeft/OverviewNext.vue
@@ -19,7 +19,10 @@
<img width="13" height="15" src="../../../assets/images/home/homeLeft/table-icon.png" alt="" />
{{ item.nickname }}
</div>
- <div class="status" :class="item.status==='WORKING'?'atcive':''" @click="signMachineNestClick(item)">
+ <div class="status" :class="{
+ 'active': item.status === 'WORKING',
+ 'idle-active': item.status === 'LEISURE'
+ }" @click="signMachineNestClick(item)">
{{ item.status==='OFFLINE'?'离线中':(item.status==='WORKING'?'作业中':'空闲中') }}
</div>
</div>
@@ -150,14 +153,25 @@
top: 14px;
left: 10px;
}
+ .name {
+ display: flex;
+ align-items: center;
+ gap: 8px; // 添加图片和文字之间的间距
+ img {
+ vertical-align: middle;
+ }
+ }
.status {
- color: #6fc3ff;
+ color: #fff;
cursor: pointer;
}
- .atcive {
- color: #04f020;
+ .active {
+ color: #8EFFAC;
background: linear-gradient( 90deg, rgba(12,45,92,1) 0%, #154671 50%, rgba(12,45,92,1) 100%), linear-gradient( 90deg, rgba(12,45,92,1) 0%, rgba(12,45,92,1) 50%, rgba(12,45,92,1) 100%);
}
+ .idle-active {
+ color: #FFA768;
+ }
}
.custom-empty {
margin: 16px 0;
--
Gitblit v1.9.3