From 48a30fd50879c76f87ed2814f0451f7c6a2f1bf7 Mon Sep 17 00:00:00 2001
From: fengsen <2548667232@qq.com>
Date: Thu, 21 Aug 2025 17:34:02 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B5=84=E9=87=91=E7=9C=8B=E6=9D=BF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .env.development                              |  2 +-
 .../components/ProgressComponent.vue          |  2 +-
 src/views/largeScreen/components/leftPage.vue | 38 +++++++++++++++----
 3 files changed, 33 insertions(+), 9 deletions(-)

diff --git a/.env.development b/.env.development
index 8849f99..b59befd 100644
--- a/.env.development
+++ b/.env.development
@@ -5,7 +5,7 @@ VITE_APP_TITLE = 煤科建管平台
 VITE_APP_ENV = 'development'
 
 # 开发环境
-VITE_APP_BASE_API = 'http://192.168.110.213:8899'
+VITE_APP_BASE_API = 'http://192.168.110.180:8899'
 
 # 无人机接口地址
 
diff --git a/src/views/largeScreen/components/ProgressComponent.vue b/src/views/largeScreen/components/ProgressComponent.vue
index 8620b37..2d7ec49 100644
--- a/src/views/largeScreen/components/ProgressComponent.vue
+++ b/src/views/largeScreen/components/ProgressComponent.vue
@@ -72,7 +72,7 @@ const percentageClass = computed(() => {
 .progress_component {
     width: 100%;
     height: 100%;
-
+    margin-bottom: 10px;
     :deep(.el-progress-bar__outer) {
         background-color: transparent;
     }
diff --git a/src/views/largeScreen/components/leftPage.vue b/src/views/largeScreen/components/leftPage.vue
index 804ea76..c664040 100644
--- a/src/views/largeScreen/components/leftPage.vue
+++ b/src/views/largeScreen/components/leftPage.vue
@@ -2,22 +2,45 @@
   <div class="leftPage">
     <!--  -->
     <div class="kpi_box">
-      <TitleComponent :title="'支付KPI'"/>
-      <div style="height: 100px;"></div>
+      <TitleComponent :title="'支付KPI'" style="margin-bottom: 20px;"/>
       <ProgressComponent 
-        title="营业收入" 
+        title="应收账款" 
         value="123,456.78" 
         percentageChange="+25.30%" 
         progressPercentage="75" 
+        progressColor="rgba(255, 77, 79, 1)"
+      />
+      <ProgressComponent 
+        title="应付账款" 
+        value="123,456.78" 
+        percentageChange="+25.30%" 
+        progressPercentage="25" 
+        progressColor="rgba(29, 214, 255, 1)"
+      />
+      <ProgressComponent 
+        title="本月付款" 
+        value="123,456.78" 
+        percentageChange="+25.30%" 
+        progressPercentage="45" 
         progressColor="rgba(0, 227, 150, 1)"
       />
+      <ProgressComponent 
+        title="本月收款" 
+        value="123,456.78" 
+        percentageChange="+25.30%" 
+        progressPercentage="10" 
+        progressColor="rgba(255, 147, 42, 1)"
+      />
     </div>
+    <div class="contract_box">
 
+    </div>
   </div>
 </template>
 
 <script setup>
 import { ref, reactive, onMounted, computed, toRefs, getCurrentInstance, nextTick } from 'vue';
+import echarts from 'echarts';
 import TitleComponent  from './TitleComponent.vue';
 import ProgressComponent from './ProgressComponent.vue';
 </script>
@@ -26,12 +49,13 @@ import ProgressComponent from './ProgressComponent.vue';
 .leftPage {
   width: 100%;
   height: 100%;
-  background: #0c1e35;
-
-  .kpi_box {
+  .kpi_box{
+    margin-bottom: 10px;
+  }
+  .kpi_box,.contract_box {
     padding: 10px;
     box-sizing: border-box;
+    border: 1px solid rgba(29, 214, 255, 0.3);
   }
-
 }
 </style>