合并代码

src/views/right/components/handleProcess/comp/RightLegend.vue

@@ -0,0 +1,48 @@
+<template>
+  <div class="right-legend">
+    <div class="legend-item">
+      <div class="icon-box"></div>
+      <div class="text-box">B级风险</div>
+      <div class="switch-box"></div>
+    </div>
+  </div>
+</template>
+<script setup></script>
+
+<style lang="scss">
+.right-legend {
+  padding: 20px;
+  width: 237px;
+  height: 743px;
+  background-image: url("../../../../../assets/img/撒点弹窗.png");
+  background-size: 100% 100%;
+  .legend-item {
+    display: flex;
+    .icon-box {
+    }
+    .text-box {
+      font-family: Alibaba PuHuiTi;
+      font-weight: normal;
+      font-size: 18px;
+      line-height: 24px;
+      text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+      text-align: left;
+      font-style: normal;
+      text-transform: none;
+      background: linear-gradient(to bottom, #ffffff 0%, #88eaff 100%);
+      -webkit-background-clip: text;
+      -webkit-text-fill-color: transparent;
+      margin: 0 10px;
+    }
+    .switch-box {
+      width: 47px;
+      height: 26px;
+      background-image: url("../../../../../assets/img/Component 14.png");
+      background-size: 100% 100%;
+    }
+    .switch-box-no {
+      background-image: url("../../../../../assets/img/Component 14.png");
+    }
+  }
+}
+</style>

src/views/right/components/handleProcess/index.vue

@@ -128,13 +128,13 @@
       </div>
     </div>
   </div>
-  <EmergencyManage />
 
   <EmergencyManage v-if="rightPanelStore.rightPanelVisible == '应急管理'" />
   <PeopleCd v-if="rightPanelStore.rightPanelVisible == '出动人员'" />
   <CarCd v-if="rightPanelStore.rightPanelVisible == '出动车辆'" />
   <MedicalReport v-if="rightPanelStore.rightPanelVisible == '病例报告'" />
   <ProruptionCase v-if="rightPanelStore.rightPanelVisible == '突发事件'" />
+  <!-- <RightLegend class="right-legend"></RightLegend> -->
 </template>
 
 <script setup>
@@ -147,6 +147,7 @@ import PeopleCd from "./comp/PeopleCd.vue";
 import CarCd from "./comp/CarCd.vue";
 import MedicalReport from "./comp/MedicalReport.vue";
 import ProruptionCase from "./comp/ProruptionCase.vue";
+import RightLegend from "./comp/RightLegend.vue";
 import { WordColudOption } from "../../echarts/echartsOption";
 import { useRightPanelStore } from "@/store/rightPanel";
 
@@ -565,4 +566,10 @@ onMounted(() => {
     }
   }
 }
+.right-legend{
+  position: fixed;
+  top: 160px;
+  right: 620px;
+
+}
 </style>