From 5870c66161f716cfc672c7de9ddcc4125d0c7f92 Mon Sep 17 00:00:00 2001 From: tcy <1193318383@qq.com> Date: Thu, 21 Aug 2025 20:21:03 +0800 Subject: [PATCH] =?UTF-8?q?refactor(largeScreen):=20=E9=87=8D=E6=9E=84?= =?UTF-8?q?=E5=A4=A7=E5=B1=8F=E5=B1=95=E7=A4=BA=E7=BB=84=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 修改 ProgressComponent 组件,增加 isShowPrice 属性控制是否显示价格 - 更新 rightPage 组件,添加新的 ProgressComponent 实例 - 优化 tender/plan/index.vue 页面结构,简化代码 --- .../components/ProgressComponent.vue | 21 +- .../largeScreen/components/rightPage.vue | 23 +- src/views/tender/plan/index.vue | 789 ++---------------- 3 files changed, 105 insertions(+), 728 deletions(-) diff --git a/src/views/largeScreen/components/ProgressComponent.vue b/src/views/largeScreen/components/ProgressComponent.vue index 2d7ec49..da1b86c 100644 --- a/src/views/largeScreen/components/ProgressComponent.vue +++ b/src/views/largeScreen/components/ProgressComponent.vue @@ -4,16 +4,12 @@ {{ title }} {{ percentageChange }} -
+
{{ value }} {{ unit }}
- +
@@ -56,14 +52,19 @@ const props = defineProps({ progressColor: { type: String, default: 'rgba(255, 77, 79, 1)' + }, + // 是否显示价格 + isShowPrice: { + type: Boolean, + default: true } }); // 计算百分比变化的样式类(红色或绿色) const percentageClass = computed(() => { // 检查变化值是否为正数 - const isPositive = props.percentageChange.startsWith('+') || - (!props.percentageChange.startsWith('-') && props.percentageChange !== '0.00%'); + const isPositive = props.percentageChange.startsWith('+') || + (!props.percentageChange.startsWith('-') && props.percentageChange !== '0.00%'); return isPositive ? 'green' : 'red'; }); @@ -73,6 +74,7 @@ const percentageClass = computed(() => { width: 100%; height: 100%; margin-bottom: 10px; + :deep(.el-progress-bar__outer) { background-color: transparent; } @@ -116,5 +118,4 @@ const percentageClass = computed(() => { color: rgba(0, 227, 150, 1); } } - - \ No newline at end of file + \ No newline at end of file diff --git a/src/views/largeScreen/components/rightPage.vue b/src/views/largeScreen/components/rightPage.vue index 0df2f6d..8ffd7cd 100644 --- a/src/views/largeScreen/components/rightPage.vue +++ b/src/views/largeScreen/components/rightPage.vue @@ -29,10 +29,12 @@
-
+ +
@@ -42,6 +44,7 @@ import TitleComponent from './TitleComponent.vue'; import EchartBox from '@/components/EchartBox/index.vue'; import { getLineOption, getBarOptions } from './optionList'; +import ProgressComponent from './ProgressComponent.vue'; const lineOption = ref(); const barOption = ref(); @@ -94,6 +97,7 @@ onMounted(() => { box-sizing: border-box; // padding: 5px; } + .funds { width: 100%; // height: 40%; @@ -101,11 +105,13 @@ onMounted(() => { box-sizing: border-box; padding: 10px 5px; } + .funds_echarts { width: 100%; height: 25vh; padding: 10px 0 0 0; } + .cashFlow { width: 100%; // height: 50%; @@ -114,6 +120,7 @@ onMounted(() => { padding: 10px 5px; margin-top: 20px; } + .inflowData { width: 100%; height: 12vh; @@ -122,6 +129,7 @@ onMounted(() => { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 10px; + .inflow { width: 100%; height: 100%; @@ -141,12 +149,14 @@ onMounted(() => { color: #fff; padding-bottom: 10px; } + .number { font-size: 24px; // font-weight: 500; color: #fff; padding-bottom: 10px; } + .unit { font-size: 12px; // font-weight: 500; @@ -154,12 +164,21 @@ onMounted(() => { } } } + .inflow_echarts { width: 100%; height: 25vh; margin-top: 20px; } + .progress { width: 100%; + margin-top: 20px; +} + +:deep(.progress_text) { + .roboto { + color: #fff; + } } diff --git a/src/views/tender/plan/index.vue b/src/views/tender/plan/index.vue index bb7f880..75c3732 100644 --- a/src/views/tender/plan/index.vue +++ b/src/views/tender/plan/index.vue @@ -1,230 +1,22 @@ -<<<<<<< HEAD - - - - - - - - - - - - - - - - - - - - - - - - - - 一键展开 - - - 一键收起 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - >>>>>>> aab67593ebb8d9116738d0d867a6119ba61615c8 - + + + + + + + + + + + + + + + + - - \ No newline at end of file +