From a04ff48322d7b4fbe1c56821dbc7405519f3bfe3 Mon Sep 17 00:00:00 2001
From: yangfeng <wanwan926_4@163.com>
Date: 星期六, 02 十二月 2023 17:32:21 +0800
Subject: [PATCH] 统计优化
---
src/views/cockpitPage/components/StatisticalBox.vue | 14 +++++++++++++-
src/views/cockpitPage/components/OrderCompleteRadio.vue | 15 +++++++++++----
2 files changed, 24 insertions(+), 5 deletions(-)
diff --git a/src/views/cockpitPage/components/OrderCompleteRadio.vue b/src/views/cockpitPage/components/OrderCompleteRadio.vue
index a5c2d3d..11066c7 100644
--- a/src/views/cockpitPage/components/OrderCompleteRadio.vue
+++ b/src/views/cockpitPage/components/OrderCompleteRadio.vue
@@ -14,6 +14,7 @@
:percentage="item.radio"
:define-back-color="'#083f55'"
:text-color="'#fec718'"
+ :class="item.radio < 90 ? 'setTitle-right' : 'setTitle-left'"
></el-progress>
</div>
</div>
@@ -33,8 +34,8 @@
return {
tableList: [
{ title: "DD19070047", radio: 50.6 },
- { title: "DD19070048", radio: 70 },
- { title: "DD19070049", radio: 85 },
+ { title: "DD19070048", radio: 89 },
+ { title: "DD19070049", radio: 100 },
{ title: "DD19070050", radio: 30 },
],
};
@@ -63,6 +64,7 @@
height: calc(20% - 10px);
width: 100%;
border-radius: 50px;
+ transition: all 1s ease-in-out 0s;
.left {
width: 20%;
margin: 0 10px;
@@ -86,13 +88,18 @@
background: url("../../../../public/cockpitPage/order-bg.png") no-repeat
center center / cover;
}
- .el-progress-bar__innerText {
+ .setTitle-right .el-progress-bar__innerText {
position: absolute;
top: 2px;
- right: -70px;
+ right: -66px;
text-align: left;
font-size: 18px;
width: 60px;
}
+ .setTitle-left .el-progress-bar__innerText {
+ color: rgb(226, 146, 27) !important;
+ font-size: 18px;
+ width: 60px;
+ }
}
</style>
diff --git a/src/views/cockpitPage/components/StatisticalBox.vue b/src/views/cockpitPage/components/StatisticalBox.vue
index 934dd76..f456aaa 100644
--- a/src/views/cockpitPage/components/StatisticalBox.vue
+++ b/src/views/cockpitPage/components/StatisticalBox.vue
@@ -3,7 +3,16 @@
<div v-for="item in allList" class="all-bg">
<div class="box">
<div class="commom-title">{{ item.title }}</div>
- <div class="commom-value">{{ item.value }}</div>
+ <div
+ class="commom-value"
+ :class="
+ item.title == '寤舵湡浜や粯' || item.title == '鐗╂枡涓嶈冻'
+ ? 'redColor'
+ : ''
+ "
+ >
+ {{ item.value }}
+ </div>
</div>
</div>
</div>
@@ -59,6 +68,9 @@
font-family: "Arial Negreta", "Arial Normal", "Arial";
font-weight: 700;
}
+ .redColor {
+ color: #ff0000;
+ }
}
}
}
--
Gitblit v1.8.0