From fab019a657d174fb8fc101cd5e0e6296004d12df Mon Sep 17 00:00:00 2001
From: chenyao <1219716595@qq.com>
Date: Thu, 27 Mar 2025 11:23:13 +0800
Subject: [PATCH] feat: 提交图片和增加组件

---
 src/views/Home/components/HomeLeft/HomeLeft.vue |   75 +++++++++++++++++++++++++++++++------
 1 files changed, 62 insertions(+), 13 deletions(-)

diff --git a/src/views/Home/components/HomeLeft/HomeLeft.vue b/src/views/Home/components/HomeLeft/HomeLeft.vue
index 9f306c4..33cddc5 100644
--- a/src/views/Home/components/HomeLeft/HomeLeft.vue
+++ b/src/views/Home/components/HomeLeft/HomeLeft.vue
@@ -1,35 +1,84 @@
 <template>
     <div class="home-left-index">
         <!--时间 天气-->
-        <div class="time-watch">
+        <div class="time-weather">
             <div class="time">2025.03.04 15:30:00</div>
-            <div>
-                <img src="" alt="">
-                <span>阴天</span>
-                <span>适合飞行</span>
+            <div class="line"></div>
+            <div class="weather">
+                <img src="@/assets/images/tq.png" alt="">
+                <span class="tq">阴天</span>
+                <span class="qk">适合飞行</span>
+            </div>
+        </div>
+        <!--机巢概况-->
+        <div class="overview-nest">
+            <common-title></common-title>
+            <div class="overview-warp">
+                <div></div>
             </div>
         </div>
     </div>
 </template>
 
-<script></script>
+<script setup>
+import { hToV, wToR } from '@/utils/pxConver';
+import CommonTitle from '@/components/CommonTitle.vue';
+
+
+</script>
 
 <style scoped lang="scss">
 .home-left-index {
     position: absolute;
+    
     top: 88px;
-    left: 45px;
-    width: 360px;
+    // left: 45px;
+    // width: 390px;
+    color: #E7F5FF;
 
-    .time-watch {
+    .time-weather {
+        margin-left: 45px;
+        width: 260px;
         font-size: 14px;
         height: hToV(36);
+        line-height: hToV(36);
         display: flex;
-        .time {
-            font-weight: 400;
-            font-size: 14px;
-            line-height: hToV(16);
+        justify-content: space-between;
+        align-items: center;
+        .line {
+            border: 1px solid #FFFFFF;
+            height: hToV(10);
+            opacity: 0.5;
         }
+        .weather {
+            img {
+                width: 20px;
+                height: hToV(20);
+            }
+            .tq {
+                margin: 0 5px;
+                color: #E7F5FF;
+            }
+            .qk {
+                margin-left: 5px;
+                color: #04F043;
+           }
+        }
+    }
+    .overview-nest {
+        // border: 1px solid red;
+        width: 404px;
+        
+       .overview-warp {
+            // border: 1px solid #04F043;
+            margin-left: 20px;
+            margin: 16px;
+            width: 390px;
+            height: hToV(415);
+            background: linear-gradient( 90deg, rgba(31,62,122,0) 0%, rgba(31,62,122,0.35) 21%, #1F3E7A 100%);
+            border-radius: 0px 0px 0px 0px;
+            opacity: 0.85;
+       }
     }
 }
 </style>

--
Gitblit v1.9.3