更新数据

src/components/GdMap/mapUtil.js

@@ -712,50 +712,8 @@ export function MapUtil(map) {
   // 打开详情弹窗
   MapUtil.prototype.openInfoDetail = (flag, data) => {
     switch (flag) {
-      case "rx":
+      case 'home_yj_map':
-        emitter.emit('showJzInfo', data);
+        emitter.emit("showHomeYJ", data);
-        break;
-      case 'gaj':
-      case 'pcs':
-      case 'jwz':
-      case 'xfq':
-      case 'zdfkd':
-        emitter.emit('showGazy', data);
-        break;
-      case 'kfd':
-        emitter.emit("changeGroupPoint", { lx: 'kfd', xffwlx: '2', xffwid: data.kfdId });
-        emitter.emit('showGazy', [data]);
-        break;
-      case 'sp':
-        emitter.emit('showGzy', data);
-        emitter.emit("showGzyInfo", data);
-        break;
-      case 'kk':
-        emitter.emit('showGzy', data);
-        break;
-      case 'aj':
-      case 'jqMap':
-        emitter.emit('showAj', data);
-        break;
-      case 'yj':
-      case 'yjMap':
-        emitter.emit("showYjxq", data);
-        break;
-      case 'dzjg':
-      case 'school':
-      case 'hospital':
-      case 'banck':
-      case 'shop':
-        emitter.emit("showShzy", data);
-        break;
-      case 'qchzc_map':
-      case 'jczMap_hm':
-      case 'jczMap_hhx':
-        emitter.emit("showJcz", [data]);
-        break;
-      case 'cyryMap':
-        console.log(data, '从业人员');
-        emitter.emit("showCyry", [data]);
         break;
     }
   }

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

@@ -0,0 +1,76 @@
+<template>
+  <DialogDragger :title="props.data.type" top="150px" v-model="props.show" @close="close">
+    <ul class="warningList" ref="gjyjList" v-loading="loading">
+      <li v-for="item in warningList" :key="item.id">
+        <YjItem :data="item"/> 
+      </li>
+      <MOSTY.Empty :show="!loading && warningList.length <= 0" :imgSize="150"></MOSTY.Empty>
+    </ul>
+  </DialogDragger>
+</template>
+<script setup>
+import * as MOSTY from "@/components/MyComponents/index";
+import DialogDragger from "@/views/home/layout/dialogDragger.vue";
+import YjItem from "@/views/home/components/yjItem.vue";
+import { ref,  onMounted, getCurrentInstance, defineProps, watch } from "vue";
+import emitter from "@/utils/eventBus.js";
+const { proxy } = getCurrentInstance();
+const warningList = ref([]); //预警列表数据
+const pageCurrent = ref(1);
+const gjyjList = ref(null); //预警列表数据
+const loading = ref(false);
+//参数传递
+const props = defineProps({
+  //某条预警详情
+  data: {
+    type:Object,
+    default:{}
+  },
+  show: {
+    type:Boolean,
+    default:false
+  },
+  //标题数据
+  title: String
+});
+onMounted(() => {
+ 
+});
+// 监听视频地址变化
+watch(() => props.data,(val) => {
+  pageCurrent.value = 1;
+},{ immediate: true, deep: true });
+//关闭
+function close() {
+  emitter.emit('deletePointArea','home_yj_map');
+  emitter.emit("showHomeYJ",false);
+}
+
+
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/css/homeScreen.scss";
+.dialogBox {
+  ul.warningList{
+    height: calc(100vh - 198px);
+    overflow: hidden;
+    overflow-y: auto;
+    padding: 7px 10px;
+    box-sizing: border-box;
+    .photo {
+      width: 60px;
+      height: 80px;
+      img {
+        width: 100%;
+        height: 100%;
+      }
+    }
+  }
+}
+//加载时 取消背景
+::v-deep .el-loading-mask {
+  background-color: transparent !important;
+}
+
+</style>

src/views/home/dialog/leftDialog.vue

@@ -0,0 +1,35 @@
+<template>
+  <div class="noScollLine">
+    <!-- 预警信息弹框 -->
+    <Home_YJ v-if="isShow.showYj" :show="isShow.showYj" :data="list.yjxqInfo" />
+  </div>
+</template>
+
+<script setup>
+import { qcckPost, qcckGet } from "@/api/qcckApi.js";
+import emitter from "@/utils/eventBus.js";
+import Home_YJ from "./components/home_yj.vue";
+import { ref, onMounted, onUnmounted, reactive, getCurrentInstance } from "vue";
+const { proxy } = getCurrentInstance();
+const isShow = ref({
+  showYj: false, //预警弹窗
+});
+const list = reactive({
+  Info_YJ: [], //预警数据
+});
+
+onMounted(() => {
+  // 展示预警
+  emitter.on("showHomeYJ", (res) => {
+    isShow.value.showYj = res ? true : false;
+    console.log(res,'====');
+    // if (res) list.Info_YJ = res;
+  });
+});
+onUnmounted(() => {
+  emitter.off("showHomeYJ");
+});
+</script>
+
+<style lang="scss" scoped>
+</style>

src/views/home/index.vue

@@ -28,9 +28,13 @@
       <Bkcz></Bkcz>
     </div>
   </div>
+
+  <!-- 左边弹窗 -->
+  <!-- <LeftDialog></LeftDialog> -->
 </template>
 
 <script setup>
+// import LeftDialog from './dialog/leftDialog'
 import GdMap from "@/components/GdMap/index.vue";
 import Head from './layout/head.vue'
 import DbCount from './model/dbCount.vue'

src/views/home/layout/dialogDragger.vue

@@ -0,0 +1,91 @@
+<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" custom-class="zdy-model-dialog">
+      <template #title>
+        <div class="my-header">
+          <span class="imgIcon"> {{props.title}}</span>
+          <el-icon color="#ffffff" size="20px" @click="closeDialog" style="cursor: pointer;">
+            <Close />
+          </el-icon>
+        </div>
+      </template>
+      <div class="contant-dragger-dialog mt5">
+        <slot></slot>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import emitter from "@/utils/eventBus.js";
+import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
+import Search from "@/components/aboutTable/Search.vue";
+import Pages from "@/components/aboutTable/Pages.vue";
+import { ref, defineProps, defineEmits, reactive, onMounted } from "vue";
+import { TRUE } from "ol/functions";
+const emits = defineEmits(["update:modelValue", "close"]);
+const props = defineProps({
+  title: {
+    type: String,
+    default: ""
+  },
+  parentClass: String,
+  top: {
+    type: String,
+    default: "110px"
+  },
+  modelValue: {
+    type: Boolean,
+    default: false
+  },
+ 
+});
+
+// 關閉
+function closeDialog(params) {
+  emits("update:modelValue", false);
+  emits("close", false);
+}
+</script>
+
+<style lang="scss" scoped>
+.my-header {
+  display: flex;
+  justify-content: space-between;
+  height: 40px;
+  align-items: center;
+  font-size: 16px;
+  color: #fff;
+  padding: 0 0 0 30px;
+  box-sizing: border-box;
+  background: url("~@/assets/images/bg44.png") no-repeat -14px -9px;
+  background-size: 268px;
+}
+.contant-dragger-dialog {
+  min-height: 80px;
+  overflow: hidden;
+  padding: 0px 8px;
+  box-sizing: border-box;
+  color: #fff;
+}
+</style>
+
+<style>
+.zdy-model-dialog {
+  background: url("~@/assets/images/bg46.png") no-repeat center center;
+  background-size: 100% 100%;
+  padding: 8px 10px;
+  box-sizing: border-box;
+  pointer-events: auto !important;
+  width: 400px;
+  left: -290px;
+  top: 34px;
+}
+.zdy-model-dialog .el-dialog__header {
+  padding: 0 !important;
+}
+.zdy-model-dialog .el-dialog__body {
+  padding: 0 !important;
+}
+</style>

src/views/home/model/zdryWarning.vue

@@ -7,20 +7,22 @@
      <CheckBox :data="checkData" @changeData="changeData"></CheckBox>
     </div>
     <ul class="ryBox" v-loading="loading" v-infinite-scroll="loadList" style="overflow: auto">
-      <li :class="item.isChecked ? 'active':''" v-for="item in personList" :key="item.id" >
+      <li v-for="item in personList" :key="item.id" @click="chooseItem(item)">
         <YjItem :item="item"></YjItem>
       </li>
-      <MOSTY.Empty :show="!loading && personList.length <= 0" :imgSize="120"></MOSTY.Empty>
+      <MOSTY.Empty :show="!loading && personList.length <= 0" :imgSize="100"></MOSTY.Empty>
     </ul>
   </div>
 </template>
 
 <script setup>
+import emitter from "@/utils/eventBus.js";
 import { qcckPost } from "@/api/qcckApi.js";
 import YjItem from "@/views/home/components/yjItem.vue";
 import * as MOSTY from "@/components/MyComponents/index";
 import CheckBox from "@/components/checkBox/index.vue";
-import { ref ,reactive, onMounted} from 'vue';
+import { ref ,reactive, onMounted,getCurrentInstance} from 'vue';
+const { proxy } = getCurrentInstance();
 const checkData = reactive({
   list: ["红", "橙", "黄", "蓝"],
   hasChoose: ["红"]
@@ -68,6 +70,18 @@ const getList = () =>{
     loading.value = false;
   })
 }
+
+const chooseItem = (item) =>{
+  emitter.emit('deletePointArea','home_yj_map');
+  console.log(item.jd,item.wd);
+  if(!item.jd || !item.jd) return proxy.$message({ type: "warning",  message: "该预警没有坐标！" });
+  let icon = require('@/assets/point/yj.png');
+  if(item.yjjb == '20') icon = require('@/assets/point/yj1.png');
+  if(item.yjjb == '30') icon = require('@/assets/point/yj2.png');
+  if(item.yjjb == '40') icon = require('@/assets/point/yj3.png');
+  emitter.emit('addPointArea',{flag:'home_yj_map',icon,coords:[item]});
+  emitter.emit('setMapCenter',{location:[item.jd,item.wd],zoomLevel:10});
+}
 </script>
 
 <style>