From 23c9b531f6adc73655869cdef0d6e8f6d6cbbe54 Mon Sep 17 00:00:00 2001
From: spring <2396852758@qq.com>
Date: 星期二, 27 一月 2026 16:24:35 +0800
Subject: [PATCH] fix: 基础大屏添加同比
---
src/views/reportAnalysis/dataDashboard/components/basic/center-top.vue | 54 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 54 insertions(+), 0 deletions(-)
diff --git a/src/views/reportAnalysis/dataDashboard/components/basic/center-top.vue b/src/views/reportAnalysis/dataDashboard/components/basic/center-top.vue
index 2c0ebe5..40ac9da 100644
--- a/src/views/reportAnalysis/dataDashboard/components/basic/center-top.vue
+++ b/src/views/reportAnalysis/dataDashboard/components/basic/center-top.vue
@@ -7,6 +7,11 @@
<div class="card-content">
<span class="card-label">鍛樺伐鎬绘暟</span>
<span class="card-value">{{ totalStaff }}</span>
+ <div class="card-compare" :class="compareClass(staffYoY)">
+ <span>鍚屾瘮</span>
+ <span class="compare-value">{{ formatPercent(staffYoY) }}</span>
+ <span class="compare-icon">{{ staffYoY >= 0 ? '鈫�' : '鈫�' }}</span>
+ </div>
</div>
</div>
<div class="stat-card">
@@ -14,6 +19,11 @@
<div class="card-content">
<span class="card-label">瀹㈡埛鎬绘暟</span>
<span class="card-value">{{ totalCustomers }}</span>
+ <div class="card-compare" :class="compareClass(customersYoY)">
+ <span>鍚屾瘮</span>
+ <span class="compare-value">{{ formatPercent(customersYoY) }}</span>
+ <span class="compare-icon">{{ customersYoY >= 0 ? '鈫�' : '鈫�' }}</span>
+ </div>
</div>
</div>
<div class="stat-card">
@@ -21,6 +31,11 @@
<div class="card-content">
<span class="card-label">渚涘簲鍟嗘�绘暟</span>
<span class="card-value">{{ totalSuppliers }}</span>
+ <div class="card-compare" :class="compareClass(suppliersYoY)">
+ <span>鍚屾瘮</span>
+ <span class="compare-value">{{ formatPercent(suppliersYoY) }}</span>
+ <span class="compare-icon">{{ suppliersYoY >= 0 ? '鈫�' : '鈫�' }}</span>
+ </div>
</div>
</div>
</div>
@@ -109,6 +124,10 @@
const totalStaff = ref(0)
const totalCustomers = ref(0)
const totalSuppliers = ref(0)
+// 鍚屾瘮锛堝崰浣嶅�硷紝鍙帴鍏ョ湡瀹炴帴鍙ｏ級
+const staffYoY = ref(-0.52) // 绀轰緥锛�-0.52%
+const customersYoY = ref(0.82) // 绀轰緥锛�0.82%
+const suppliersYoY = ref(0.1) // 绀轰緥锛�0.10%
const equipmentNum = ref(0)
const equipmentRepair = ref(0)
const equipmentMaintain = ref(0)
@@ -117,6 +136,13 @@
// 寰呭姙浜嬮」
const todoList = ref([])
const refTodoList = ref(null)
+
+const formatPercent = (val) => {
+ const num = Number(val) || 0
+ return `${Math.abs(num).toFixed(2)}%`
+}
+
+const compareClass = (val) => (val >= 0 ? 'compare-up' : 'compare-down')
// 鑾峰彇鍛樺伐銆佸鎴枫�佷緵搴斿晢鏁伴噺
const getNum = () => {
@@ -314,6 +340,34 @@
color: rgba(208, 231, 255, 0.7);
}
+.card-compare {
+ display: flex;
+ align-items: center;
+ gap: 6px;
+ font-size: 15px;
+ color: #d0e7ff;
+}
+
+.compare-value {
+ font-weight: 600;
+}
+
+.compare-icon {
+ font-size: 14px;
+ position: relative;
+ top: -1px; /* 杞诲井涓婄Щ锛岃绠ご涓庢枃瀛楀瀭鐩村眳涓榻� */
+}
+
+.compare-up .compare-value,
+.compare-up .compare-icon {
+ color: #00c853;
+}
+
+.compare-down .compare-value,
+.compare-down .compare-icon {
+ color: #ff5252;
+}
+
.equipment-stats {
border: 1px solid #1a58b0;
padding: 18px;
--
Gitblit v1.9.3