预警信息调整

src/types/components.d.ts

@@ -48,6 +48,8 @@ declare module 'vue' {
     ElRow: typeof import('element-plus/es')['ElRow']
     ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
     ElSelect: typeof import('element-plus/es')['ElSelect']
+    ElSkeleton: typeof import('element-plus/es')['ElSkeleton']
+    ElSkeletonItem: typeof import('element-plus/es')['ElSkeletonItem']
     ElSlider: typeof import('element-plus/es')['ElSlider']
     ElStep: typeof import('element-plus/es')['ElStep']
     ElSteps: typeof import('element-plus/es')['ElSteps']
@@ -61,6 +63,7 @@ declare module 'vue' {
     ElTimeline: typeof import('element-plus/es')['ElTimeline']
     ElTimelineItem: typeof import('element-plus/es')['ElTimelineItem']
     ElTooltip: typeof import('element-plus/es')['ElTooltip']
+    ElTree: typeof import('element-plus/es')['ElTree']
     ElUpload: typeof import('element-plus/es')['ElUpload']
     FileUpload: typeof import('./../components/FileUpload/index.vue')['default']
     FooterSection: typeof import('./../components/FooterSection/index.vue')['default']
@@ -99,6 +102,10 @@ declare module 'vue' {
     UserSelect: typeof import('./../components/UserSelect/index.vue')['default']
     VideoContainer: typeof import('./../components/HKVideo/video-container.vue')['default']
     YMap: typeof import('./../components/Map/YMap.vue')['default']
+    YMapold: typeof import('./../components/Map/YMapold.vue')['default']
     YztMap: typeof import('./../components/Map/YztMap/index.vue')['default']
   }
+  export interface ComponentCustomProperties {
+    vLoading: typeof import('element-plus/es')['ElLoadingDirective']
+  }
 }

src/views/globalMap/RightMenu/RainMonitor.vue

@@ -609,7 +609,10 @@ initData();
     flex: 1;
     .item-right {
       .text-box {
+        display: flex;
+        .text1 {
 
+        }
       }
     }
     .icon1,

src/views/globalMap/RightMenu/UAV.vue

@@ -1,28 +1,30 @@
 <template>
-  <div class="gradient-text title">无人机资源</div>
-  <div class="flex-box">
-    <el-form-item style="width: 200px" label="行政区选择" prop="planType">
-      <el-select v-model="planForm.planType" placeholder="请选择" clearable>
-        <el-option v-for="item in plan_type" :key="item.value" :label="item.label" :value="item.value"></el-option>
-      </el-select>
-    </el-form-item>
-  </div>
-  <div class="custom-table">
-    <div class="th">
-      <div class="td">无人机名称</div>
-      <div class="td">
-        <span>类型</span>
-        <select>
-          <!-- 下拉框选项 -->
-          <option value="option1">选项1</option>
-          <option value="option2">选项2</option>
-        </select>
-      </div>
+  <div class="menu-content">
+    <div class="gradient-text title">无人机资源</div>
+    <div class="flex-box">
+      <el-form-item style="width: 200px" label="行政区选择" prop="planType">
+        <el-select v-model="planForm.planType" placeholder="请选择" clearable>
+          <el-option v-for="item in plan_type" :key="item.value" :label="item.label" :value="item.value"></el-option>
+        </el-select>
+      </el-form-item>
     </div>
-    <div class="table-content">
-      <div v-for="(item, index) in droneResourcesData.listData" :key="index" class="tr">
-        <div class="td">{{ item.drone_name }}</div>
-        <div class="td">{{ item.drone_type }}</div>
+    <div class="custom-table">
+      <div class="th">
+        <div class="td">无人机名称</div>
+        <div class="td">
+          <span>类型</span>
+          <select>
+            <!-- 下拉框选项 -->
+            <option value="option1">选项1</option>
+            <option value="option2">选项2</option>
+          </select>
+        </div>
+      </div>
+      <div class="table-content">
+        <div v-for="(item, index) in droneResourcesData.listData" :key="index" class="tr">
+          <div class="td">{{ item.drone_name }}</div>
+          <div class="td">{{ item.drone_type }}</div>
+        </div>
       </div>
     </div>
   </div>
@@ -150,11 +152,29 @@ const plan_type = [
   }
 }
 
+.menu-content {
+  width: 1579px;
+  height: 1394px;
+  background: url('@/assets/images/map/rightMenu/content.png') no-repeat;
+  padding: 130px 20px 20px 20px;
+  font-size: 36px;
+  position: relative;
+  color: #000000;
+}
+.menu-content {
+  width: 1579px;
+  height: 1394px;
+  background: url('@/assets/images/map/rightMenu/content.png') no-repeat;
+  padding: 130px 20px 20px 20px;
+  font-size: 36px;
+  position: relative;
+  color: #000000;
+}
 .title {
   font-size: 60px;
   position: absolute;
-  top: 12px;
-  left: 210px;
+  top: 20px;
+  left: 160px;
 }
 
 .flex-box {

src/views/globalMap/RightMenu/WarningInfo.vue

@@ -1,49 +1,50 @@
 <template>
-  <div class="warning-info">
-    <div class="gradient-text title">预警信号</div>
-
-    <!-- 当前时间显示 -->
-    <div class="current-time" :style="{ backgroundImage: `url(${dateTimeBg})` }">日期 {{ formattedTime }}</div>
-    <!-- 生效预警列表 -->
-    <div class="alert-boxes">
-      <div class="section-title">生效预警</div>
-      <div class="alert-items">
-        <div class="data-box1">
-          <img src="@/assets/images/map/warningInfo/ic_ty.png" alt="台风图标" class="alert-icon" />
-          <div class="box-text1">台风</div>
-        </div>
-        <div class="data-box2">
-          <img src="@/assets/images/map/warningInfo/ic_tr.png" alt="暴雨图标" class="alert-icon" />
-          <div class="box-text1">暴雨</div>
-        </div>
-        <div class="data-box3">
-          <img src="@/assets/images/map/warningInfo/ic_tstorm.png" alt="雷雨大风图标" class="alert-icon" />
-          <div class="box-text1">雷雨大风</div>
-        </div>
-        <div class="data-box4">
-          <img src="@/assets/images/map/warningInfo/ic_ht.png" alt="高温图标" class="alert-icon" />
-          <div class="box-text1">高温</div>
+  <div class="menu-content">
+    <div class="warning-info">
+      <div class="gradient-text title">预警信号</div>
+
+      <!-- 当前时间显示 -->
+      <div class="current-time" :style="{ backgroundImage: `url(${dateTimeBg})` }">日期 {{ formattedTime }}</div>
+      <!-- 生效预警列表 -->
+      <div class="alert-boxes">
+        <div class="section-title">生效预警</div>
+        <div class="alert-items">
+          <div class="data-box1">
+            <img src="@/assets/images/map/warningInfo/ic_ty.png" alt="台风图标" class="alert-icon" />
+            <div class="box-text1">台风</div>
+          </div>
+          <div class="data-box2">
+            <img src="@/assets/images/map/warningInfo/ic_tr.png" alt="暴雨图标" class="alert-icon" />
+            <div class="box-text1">暴雨</div>
+          </div>
+          <div class="data-box3">
+            <img src="@/assets/images/map/warningInfo/ic_tstorm.png" alt="雷雨大风图标" class="alert-icon" />
+            <div class="box-text1">雷雨大风</div>
+          </div>
+          <div class="data-box4">
+            <img src="@/assets/images/map/warningInfo/ic_ht.png" alt="高温图标" class="alert-icon" />
+            <div class="box-text1">高温</div>
+          </div>
         </div>
       </div>
-    </div>
 
-    <!-- 发布数量统计 -->
-    <div class="alert-count">
-      <h3 class="section-title">发布数量统计</h3>
-      <div class="alert-count-items">
-        <img src="@/assets/images/map/warningInfo/ic_发布数量统计.png" alt="发布数量统计" class="count-icon" />
-        <div v-for="(count, index) in alertCounts" :key="index" class="count-item">
-          <span class="count-num">{{ count.num }}</span>
-          <img :src="getLevelImage(count.level)" :alt="`${getLevelName(count.level)}预警图标`" class="count-icon" />
-          <span :class="['count-level', `level-${getLevelName(count.level).toLowerCase()}`]">{{ getLevelName(count.level) }}预警</span>
+      <!-- 发布数量统计 -->
+      <div class="alert-count">
+        <h3 class="section-title">发布数量统计</h3>
+        <div class="alert-count-items">
+          <img src="@/assets/images/map/warningInfo/ic_发布数量统计.png" alt="发布数量统计" class="count-icon" />
+          <div v-for="(count, index) in alertCounts" :key="index" class="count-item">
+            <span class="count-num">{{ count.num }}</span>
+            <img :src="getLevelImage(count.level)" :alt="`${getLevelName(count.level)}预警图标`" class="count-icon" />
+            <span :class="['count-level', `level-${getLevelName(count.level).toLowerCase()}`]">{{ getLevelName(count.level) }}预警</span>
+          </div>
         </div>
       </div>
-    </div>
 
-    <!-- 预警明细列表 -->
-    <div class="alert-details">
-      <table class="alert-table">
-        <thead>
+      <!-- 预警明细列表 -->
+      <div class="alert-details">
+        <table class="alert-table">
+          <thead>
           <tr>
             <th>
               类型
@@ -84,8 +85,8 @@
             <th>区域</th>
             <th>发布时间</th>
           </tr>
-        </thead>
-        <tbody>
+          </thead>
+          <tbody>
           <tr v-for="(alert, index) in alertDetails" :key="index" class="alert-row">
             <td>{{ alert.type }}</td>
             <td>
@@ -94,8 +95,9 @@
             <td>{{ alert.area }}</td>
             <td>{{ alert.release_time }}</td>
           </tr>
-        </tbody>
-      </table>
+          </tbody>
+        </table>
+      </div>
     </div>
   </div>
 </template>
@@ -297,11 +299,20 @@ export default defineComponent({
 </script>
 
 <style scoped>
+.menu-content {
+  width: 1579px;
+  height: 1394px;
+  background: url('@/assets/images/map/rightMenu/content.png') no-repeat;
+  padding: 130px 20px 20px 20px;
+  font-size: 36px;
+  position: relative;
+  color: #000000;
+}
 .title {
   font-size: 60px;
   position: absolute;
-  top: 12px;
-  left: 210px;
+  top: 20px;
+  left: 160px;
 }
 
 .warning-info {