From bdfadd4548b83e3218c6775bb6234e29f4996292 Mon Sep 17 00:00:00 2001
From: yuzongping <835949940@qq.com>
Date: Wed, 11 Jun 2025 14:03:58 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B5=84=E6=BA=90=E4=B8=80=E5=BC=A0=E5=9B=BE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../resources/comps/left/top/1/index.html     | 12 ++++++--
 src/views/resources/comps/left/top/1/index.js | 17 +++++++++++
 .../resources/comps/left/top/1/index.scss     | 30 +++++++++++++++++++
 src/views/resources/index.js                  |  2 +-
 src/views/resources/index.scss                |  1 -
 5 files changed, 58 insertions(+), 4 deletions(-)

diff --git a/src/views/resources/comps/left/top/1/index.html b/src/views/resources/comps/left/top/1/index.html
index 804e4a2..f1b24d5 100644
--- a/src/views/resources/comps/left/top/1/index.html
+++ b/src/views/resources/comps/left/top/1/index.html
@@ -1,7 +1,15 @@
 <Pannel title="资源概况分析" height="232">
   <div class="full colbox">
-    <div class="top border"></div>
-    <div class="buttom border">
+    <div class="top">
+      <div v-for="item in data"  class="item">
+          <p class="top_line">
+            <span class="value">{{item.value}}</span>
+            <span class="unit">{{item.unit}}</span>
+          </p>
+          <p class="name">{{item.name}}</p>
+      </div>
+    </div>
+    <div class="buttom">
       <HorizontalBar></HorizontalBar>
     </div>
   </div>
diff --git a/src/views/resources/comps/left/top/1/index.js b/src/views/resources/comps/left/top/1/index.js
index 9ad101c..b5a7671 100644
--- a/src/views/resources/comps/left/top/1/index.js
+++ b/src/views/resources/comps/left/top/1/index.js
@@ -7,6 +7,23 @@ export default {
   },
   data () {
     return {
+      data: [
+        {
+          name: '农用地',
+          value: '500',
+          unit: '亩'
+        },
+        {
+          name: '建设用地',
+          value: '500',
+          unit: '亩'
+        },
+        {
+          name: '未利用地及林木',
+          value: '500',
+          unit: '亩'
+        }
+      ]
     };
   }
 };
diff --git a/src/views/resources/comps/left/top/1/index.scss b/src/views/resources/comps/left/top/1/index.scss
index 0812b5a..5851de3 100644
--- a/src/views/resources/comps/left/top/1/index.scss
+++ b/src/views/resources/comps/left/top/1/index.scss
@@ -3,8 +3,38 @@
   flex-direction: column;
 
   .top {
+    display: flex;
+    justify-content: space-between;
     width: 100%;
     flex: 1;
+
+    .item {
+      width: 150px;
+      height: 100px;
+      background: url('./bk.png');
+      background-size: 100% 100%;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+
+      .top_line {
+        margin-top: 15px;
+
+        .value {
+          font-size: 20px;
+          font-weight: 600;
+        }
+
+        .unit {
+          font-size: 12px;
+        }
+      }
+
+      .name {
+        font-weight: 600;
+        font-size: 12px;
+      }
+    }
   }
 
   .buttom {
diff --git a/src/views/resources/index.js b/src/views/resources/index.js
index 819cf8b..51ed9e7 100644
--- a/src/views/resources/index.js
+++ b/src/views/resources/index.js
@@ -51,7 +51,7 @@ export default {
       tabData: [
         {
           id: '1',
-          name: '统计分析'
+          name: '资源分析'
         },
         {
           id: '2',
diff --git a/src/views/resources/index.scss b/src/views/resources/index.scss
index 11352e6..1b7aaf4 100644
--- a/src/views/resources/index.scss
+++ b/src/views/resources/index.scss
@@ -1,5 +1,4 @@
 .map {
-  border: 1px solid red;
   position: absolute;
   top: 0;
   left: 0;