From 93d04e35d6ff02470687b73ff7494b62bdc85f2c Mon Sep 17 00:00:00 2001
From: yangfeng <wanwan926_4@163.com>
Date: 星期三, 06 十二月 2023 16:32:38 +0800
Subject: [PATCH] 页面背景图及饼图显示优化
---
src/components/cockpitPage/BackgroundBoardLayout.vue | 11 +++++++----
src/views/cockpitPage/components/PerSonnelProductivity.vue | 10 +++++++---
2 files changed, 14 insertions(+), 7 deletions(-)
diff --git a/src/components/cockpitPage/BackgroundBoardLayout.vue b/src/components/cockpitPage/BackgroundBoardLayout.vue
index 08c04fc..721dd56 100644
--- a/src/components/cockpitPage/BackgroundBoardLayout.vue
+++ b/src/components/cockpitPage/BackgroundBoardLayout.vue
@@ -53,7 +53,7 @@
// 鏁翠綋鍐呰竟璺�
$layoutPadding: 12px;
// 涓婅竟鍥哄畾楂�
-$topBlockHeight: 100px;
+$topBlockHeight: 90px;
// 宸︿晶澶撮儴鏁版嵁楂樺害
$leftHeaderHeight: 8%;
// 宸︿晶鍏叡鍙宠竟璺�
@@ -67,7 +67,7 @@
// 鍙充晶甯冨眬鍧楅珮搴�
$rightBlockHeight: calc(100vh - 120px);
// 宸︿笅涓婅竟璺�
-$leftBottomMarginTop: 40px;
+$leftBottomMarginTop: 30px;
// 宸︿笅宸︿晶鍖哄煙瀹�
$leftBottomLeftWidth: 37%;
// 宸︿笅鍙充晶鍖哄煙瀹�
@@ -77,6 +77,9 @@
background-image: url("/cockpit-bg.jpg");
background-position-x: center;
background-repeat: no-repeat;
+ background-position: center center;
+ background-attachment: fixed;
+ background-size: cover;
display: flex;
align-items: center;
justify-content: space-between;
@@ -86,7 +89,7 @@
width: 100%;
text-align: center;
position: absolute;
- top: 10px;
+ top: 0px;
font-size: 32px;
color: #01f5fe;
font-weight: 700;
@@ -142,7 +145,7 @@
.left-bottom-right-block {
width: $leftBottomRightWidth;
height: 100%;
- padding-right:20px;
+ padding-right: 20px;
.right-bottom-top-block {
height: 60%;
}
diff --git a/src/views/cockpitPage/components/PerSonnelProductivity.vue b/src/views/cockpitPage/components/PerSonnelProductivity.vue
index 54a1eb7..f9ef786 100644
--- a/src/views/cockpitPage/components/PerSonnelProductivity.vue
+++ b/src/views/cockpitPage/components/PerSonnelProductivity.vue
@@ -285,7 +285,11 @@
borderWidth: 5,
borderRadius: 4,
formatter: function (params) {
- return `{a|${params.name}} {b|${params.value + "%"}}`;
+ let label =
+ params.name.length > 5
+ ? `${params.name.slice(0, 4)}...`
+ : params.name;
+ return `{a|${label}} {b|${params.value + "%"}}`;
},
rich: {
a: {
@@ -310,7 +314,7 @@
labelLine: {
show: true,
length: 4,
- length2: 80,
+ length2: 70,
lineStyle: {
color: "#dcb018",
},
@@ -337,7 +341,7 @@
<style scoped lang="scss">
.bar-chart {
width: 100%;
- height: calc(100% - 20px);
+ height: calc(100% - 10px);
padding: 20px 0 0;
.bar-contents {
--
Gitblit v1.8.0