lcw

src/views/home/dialog/components/home_yj.vue

@@ -8,7 +8,6 @@
       </li>
       <MOSTY.Empty :show="props.data.length <= 0" :imgSize="150"></MOSTY.Empty>
     </ul>
-
     <!-- :style="{height: `calc(100vh - ${handleHs}px)`}" -->
 
     <div style="position:relative;width: 100%;" :style="{ height: `calc(100vh - ${handleHs}px)` }">

src/views/home/dialog/components/popupWarning.vue

@@ -0,0 +1,43 @@
+<template>
+  <div style="position: absolute;top: 34%;left: 42%;transform: translate(-50%, -50%);z-index: 1;" v-if="show">
+    <div style="width: 100%;background: #1d5db4e3;padding: 8px 5px;" class="flex align-center just-between ">
+      <span >详情</span><el-icon size="20px" @click="close" style="cursor: pointer;">
+        <Close />
+      </el-icon>
+    </div>
+    <YjItem :item="data" :track="false" />
+  </div>
+
+</template>
+<script setup>
+import YjItem from "@/views/backOfficeSystem/IntelligentControl/warningControl/components/yjItem.vue";
+import { ref, defineProps, onMounted, watch } from "vue";
+import emitter from "@/utils/eventBus.js";
+//参数传递
+const props = defineProps({
+  //某条预警详情
+  data: {
+    type: Array,
+    default: []
+  },
+  show: {
+    type: Boolean,
+    default: false
+  },
+});
+console.log(props.show);
+
+//关闭
+function close() {
+  emitter.emit('deletePointArea', 'home_yj_detail');
+  emitter.emit("showHomeWarning", false);
+}
+onMounted(() => {
+
+})
+
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/css/homeScreen.scss";
+</style>

src/views/home/dialog/leftDialog.vue

@@ -2,19 +2,23 @@
   <div class="noScollLine">
     <!-- 预警信息弹框 -->
     <Home_YJ v-if="isShow.showYj" :show="isShow.showYj" :data="list.Info_YJ" />
+    <PopupWarning v-if="isShow.showWarning" :show="isShow.showWarning" :data="list.Info_Warning" />
   </div>
 </template>
 
 <script setup>
 import emitter from "@/utils/eventBus.js";
 import Home_YJ from "./components/home_yj.vue";
+import PopupWarning from './components/popupWarning'
 import { ref, onMounted, onUnmounted, reactive, getCurrentInstance } from "vue";
 const { proxy } = getCurrentInstance();
 const isShow = ref({
   showYj: false, //预警弹窗
+  showWarning: false
 });
 const list = reactive({
   Info_YJ: [], //预警数据
+  Info_Warning: [],
 });
 
 onMounted(() => {
@@ -23,11 +27,16 @@ onMounted(() => {
     isShow.value.showYj = res ? true : false;
     if (res) list.Info_YJ = res;
   });
+  // 展示预警
+  emitter.on("showHomeWarning", (res) => {
+    isShow.value.showWarning = res ? true : false;
+    if (res) list.Info_Warning = res;
+  });
 });
 onUnmounted(() => {
   emitter.off("showHomeYJ");
+  emitter.off("showHomeWarning");
 });
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>

src/views/home/layout/dialogDragger.vue

@@ -1,7 +1,7 @@
 <template>
   <div style="pointer-events: none" :class="props.parentClass">
     <el-dialog :top="props.top" style="pointer-events: auto !important;" :modal="false" draggable v-model="props.modelValue" :destroy-on-close="true"
-      :show-close="false" :close-on-click-modal="false" :width="width"  :custom-class="coumClass">
+      :show-close="false" :close-on-click-modal="false" :width="width"  :custom-class="coumClass" :append-to-body="true">
       <template #title>
         <div class="my-header">
           <span class="imgIcon"> {{props.title}}</span>
@@ -82,9 +82,8 @@ function closeDialog(params) {
   padding: 8px 10px;
   box-sizing: border-box;
   pointer-events: auto !important;
-  height:calc(100% - 300px);
+  /* height:calc(100% - 300px); */
   overflow: auto;
-
 }
 .zdy-model-dialog .el-dialog__header {
   padding: 0 !important;