警报

2025-07-16 19:44:39 +08:00
parent 224fddb6af
commit 46fb5f3ce5
1122 changed files with 243510 additions and 0 deletions
--- a/src/views/backOfficeSystem/AlarmLinkage/PatrolLine/components/detailForm.vue
+++ b/src/views/backOfficeSystem/AlarmLinkage/PatrolLine/components/detailForm.vue
@ -0,0 +1,236 @@
+<template>
+  <div class="dialog" v-if="dialogForm">
+    <div class="head_box">
+      <span class="title">必巡线{{ title }}</span>
+      <div>
+        <el-button size="small" @click="save" type="primary" :loading="loading">保存</el-button>
+        <el-button size="small" @click="close">关闭</el-button>
+      </div>
+    </div>
+    <div class="cntinfo">
+      <FormMessage ref="FormRef" v-model="listQuery" :rules="rules" :formList="formList">
+        <template #zb>
+          <el-input v-model="listQuery.zb" placeholder="请选择必巡线">
+            <template #append><el-button type="primary" @click="chackLat">开始绘制</el-button></template>
+          </el-input>
+        </template>
+        <div class="mapBox relative mb10">
+          <GdMap></GdMap>
+        </div>
+        <template #bxds>
+          <el-input v-model="listQuery.bxdsl" placeholder="关联点位数量">
+            <template #append><el-button type="primary" @click="addEditPoint('add', row)">新增点位</el-button></template>
+          </el-input>
+        </template>
+      </FormMessage>
+      <div style="padding: 0 12rem;">
+        <MyTable :tableData="listQuery.bxds" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
+          :key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
+          <template #ewm="{ row }">
+            <el-image :src="`${baseUrl}${row.ewm}`" preview-teleported>
+            </el-image>
+          </template>
+          <template #bxdLx="{ row }">
+            <DictTag :value="row.bxdLx" :tag="false" :options="dic.D_BZ_BXDLX" />
+          </template>
+          <template #controls="{ row }">
+            <el-link type="primary" @click="addEditPoint('edit', row)">编辑</el-link>
+            <el-link type="primary" @click="chooseJwd(row)">选择经纬度</el-link>
+            <el-link type="danger" @click="deleteRow(row)">删除</el-link>
+          </template>
+        </MyTable>
+      </div>
+    </div>
+  </div>
+  <DetectionPoints ref="addPoint" v-if="showMap" @changeDxd="changeDxd" :dic="{ D_BZ_BXDLX: dic.D_BZ_BXDLX }"></DetectionPoints>
+</template>
+
+<script setup>
+import DetectionPoints from "./detectionPoints";
+import GdMap from "@/components/GdMap/index.vue";
+import emitter from "@/utils/eventBus.js";
+import MyTable from "@/components/aboutTable/MyTable.vue";
+import { qcckPost, qcckGet } from "@/api/qcckApi.js";
+import FormMessage from "@/components/aboutTable/FormMessage.vue";
+import { ref, defineProps, reactive, defineEmits, getCurrentInstance, nextTick, onMounted, onUnmounted, watch } from 'vue';
+const emit = defineEmits(["refresh"]);
+const { proxy } = getCurrentInstance();
+const baseUrl = 'data:image/jpeg;base64,'
+const props = defineProps({
+  dic: {
+    type: Object,
+    default: () => ({})
+  }
+});
+const showMap = ref(false); // 控制地图显示
+const addPoint = ref();
+const dialogForm = ref(false);
+const title = ref('');
+const FormRef = ref();
+const loading = ref(false);
+const changeItem = ref({}); 
+
+const listQuery = ref({
+  bxds: []
+});
+const rules = reactive({
+  bxxMc: [{ required: true, message: "请输入必巡线名称", trigger: "blur" }],
+  bxxLx: [{ required: true, message: "请选择必巡线类型", trigger: "blur" }],
+});
+
+const formList = reactive([
+  [
+    { label: "必巡线名称", prop: "bxxMc", type: "input" },
+    { label: "必巡线类型", prop: "bxxLx", type: "select", options: props.dic.D_BZ_BXDLX },
+    { label: "所属辖区", prop: "ssxq", type: "select", options: props.dic.D_BZ_XZQHDM },
+  ],
+  [
+    { label: "必巡线", prop: "zb", type: "slot",width:'100%' },
+  ],
+  { label: "", prop: "map", type: "slot",width:'100%' },
+  [
+    { label: "必巡点", prop: "bxds", type: "slot",width:'100%' },
+  ]
+])
+const pageData = reactive({
+  keyCount: 0,
+  tableConfiger: {
+    rowHieght: 61,
+    showSelectType: "null",
+  },
+  tableHeight: 400,
+  controlsWidth: 200,
+  tableColumn: [
+    { label: "必巡点名称", prop: "bxdMc"},
+    { label: "经度", prop: "jd"},
+    { label: "纬度", prop: "wd"},
+    { label: "二维码", prop: "ewm",showSolt: true },
+    { label: "必巡点类型", prop: "bxdLx", showSolt: true },
+  ]
+});
+
+// 初始化数据
+const init = (type, row,) => {
+  title.value = type == "add" ? "新增" : "编辑";
+  dialogForm.value = true;
+  if (row) getDateById(row.id) ;
+};
+
+// 获取详情
+const getDateById = (id) => {
+  qcckGet({ id }, `/mosty-jbld/jbldBxx/selectById`).then((res) => {
+    emitter.emit("echoLine", { coords: [{coords:[res.zb]}],type:'solid', flag: 'bxx'});
+    res.bxds = res.bxds ? res.bxds : [];
+    res.bxds.forEach((item) => {
+      let icon = require('@/assets/point/zsdw.png');
+      emitter.emit("addPointArea", { coords: [item], icon, flag: 'bxd'+item.id });
+    });
+    listQuery.value = res || {};
+  })
+};
+
+// 详情
+const addEditPoint = (type, row) => {
+  if(!listQuery.value.zb) return proxy.$message.warning("请先选择必巡线");
+  showMap.value = true;
+  nextTick(() => {
+    addPoint.value.init(type, row,listQuery.value.zb);
+  });
+};
+
+// 新增或者编辑比巡店
+const changeDxd = (val) => {
+  if(val.type == 'add') {
+    listQuery.value.bxds.push(val.data);
+  } else {
+    let index = listQuery.value.bxds.findIndex(item => item.id == val.data.id);
+    listQuery.value.bxds.splice(index, 1, val.data);
+  }
+  listQuery.bxdsl = listQuery.value.bxds.length;
+  pageData.keyCount++;
+  if(val.data.jd && val.data.wd) {
+    emitter.emit("deletePointArea", 'bxd' + val.data.id);
+    let icon = require('@/assets/point/zsdw.png');
+    emitter.emit("addPointArea", { coords: [{jd:val.data.jd,wd:val.data.wd}], icon, flag: 'bxd'+val.data.id });
+  }
+};
+
+// 选择经纬度
+const chooseJwd = (row) => {
+  changeItem.value = row;
+  emitter.emit("deletePointArea", 'bxd' + row.id);
+  emitter.emit("removePlot", 'point'+row.id);
+  emitter.emit("drawShape", { type: 'point', flag: 'point'+row.id});
+};
+// 选择必巡线
+const chackLat = () => {
+  emitter.emit("removeAll");
+  listQuery.value.zb = [];
+  emitter.emit("drawShape", { type: 'line', flag: 'bxx', isclear: true })
+}
+
+// 保存
+const save = () => {
+  FormRef.value.submit(() => {
+    loading.value = true;
+    let url = title.value == '新增' ? `/mosty-jbld/jbldBxx/addBxx` : `/mosty-jbld/jbldBxx/updateBxx`;
+    qcckPost(listQuery.value, url).then(() => {
+      loading.value = false;
+      proxy.$message.success("保存成功");
+      emit("refresh");
+      close();
+    }).catch(() => {
+      loading.value = false;
+    })
+  });
+}
+
+// 删除
+const deleteRow = (row) => {
+  listQuery.value.bxds.splice(row, 1);
+  emitter.emit("deletePointArea", 'bxd' + row.id);
+  emitter.emit("removePlot", 'point' + row.id);
+};
+
+// 关闭
+const close = () => {
+  dialogForm.value = false;
+  FormRef.value.reset()
+};
+
+
+onMounted(() => {
+  emitter.on("coordString", (res => {
+    if (res?.flag == 'bxx') listQuery.value.zb = res.coord;
+    if(res.type == 'point') {
+      listQuery.value.bxds.forEach((item) => {
+        if (item.id == changeItem.value.id) {
+          item.jd = res.coord[0];
+          item.wd = res.coord[1];
+        }
+      });
+      let icon = require('@/assets/point/zsdw.png');
+      emitter.emit("showPoint", { coords: [{jd:res.coord[0],wd:res.coord[1]}], icon, flag: 'bxd'+changeItem.value.id });
+    }
+  }))
+})
+
+defineExpose({ init })
+onUnmounted(() => {
+  emitter.off("coordString")
+})
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/css/layout.scss";
+  .cntinfo{
+    height: calc(100% - 70px);
+    overflow: hidden;
+    overflow-y: auto;
+  }
+.mapBox {
+  width: 100%;
+  height: 400px;
+  overflow: hidden;
+}
+</style>
--- a/src/views/backOfficeSystem/AlarmLinkage/PatrolLine/components/detectionPoints.vue
+++ b/src/views/backOfficeSystem/AlarmLinkage/PatrolLine/components/detectionPoints.vue
@ -0,0 +1,107 @@
+<template>
+  <div>
+    <el-dialog custom-class="zdy-dialog-bbd" :destroy-on-close="true" v-model="dialogForm" :title="`比巡点${title}`" width="80%" @close="close">
+      <FormMessage ref="FormRef" v-model="listQuery" :rules="rules" :formList="formList">
+      </FormMessage>
+      <div class="tc mt10">
+        <el-button type="primary" @click="save">保存</el-button>
+        <el-button @click="close">关闭</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import FormMessage from "@/components/aboutTable/FormMessage.vue";
+import { ref, defineProps, reactive, defineEmits } from 'vue';
+const emit = defineEmits(["refresh"]);
+const props = defineProps({
+  dic: {
+    type: Object,
+    default: () => ({})
+  }
+});
+const dialogForm = ref(false);
+const title = ref('');
+const FormRef = ref();
+const listQuery = ref({});
+const rules = reactive({
+  bxdMc: [{ required: true, message: "请输入必巡点名称", trigger: "blur" }],
+  bxdLx: [{ required: true, message: "请输入必巡点类型", trigger: "blur" }],
+});
+const formList = reactive([
+  { label: "必巡点名称", prop: "bxdMc", type: "input" },
+  { label: "必巡点类型", prop: "bxdLx", type: "select", options: props.dic.D_BZ_BXDLX },
+  { label: "经度", prop: "jd",type: "input" },
+  { label: "纬度", prop: "wd", type: "input"},
+])
+
+// 初始化数据
+const init = (type, row) => {
+  dialogForm.value = true;
+  title.value = type == "add" ? "新增" : "编辑";
+  listQuery.value = row ? { ...row } : {};
+  console.log(listQuery.value,'===listQuery.value');
+  
+};
+
+const save = () => {
+  FormRef.value.submit(() => {
+    let data = JSON.parse(JSON.stringify(listQuery.value));
+    data.id = data.id || new Date().getTime();
+    let obj = {
+      data: data,
+      type: title.value == "新增" ? "add" : "edit"
+    }
+    emit("changeDxd", obj);
+    close();
+  });
+}
+
+const close = () => {
+  dialogForm.value = false;
+  FormRef.value.reset()
+};;
+
+defineExpose({ init })
+
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/css/layout.scss";
+
+.mapBox {
+  width: 100%;
+  height: 400px;
+}
+
+::v-deep .el-form--inline .el-form-item {
+  margin-right: 0;
+}
+
+::v-deep .el-dialog {
+  --el-dialog-bg-color: #fff;
+}
+
+::v-deep .el-dialog__title {
+  color: #333;
+  font-size: 16px;
+}
+</style>
+<style lang="scss" scoped>
+::v-deep .zdy-dialog-bbd {
+  width: 30%!important;
+  --el-dialog-bg-color: #fff !important;
+  background: #fff !important;
+
+  ::v-deep .el-dialog__header {
+    background-color: #f7fafb;
+    border-bottom: 1px solid #e3e7ed;
+  }
+
+  .el-dialog__title {
+    color: #333;
+    font-size: 16px;
+  }
+}
+</style>
--- a/src/views/backOfficeSystem/AlarmLinkage/PatrolLine/index.vue
+++ b/src/views/backOfficeSystem/AlarmLinkage/PatrolLine/index.vue
@ -0,0 +1,157 @@
+<template>
+  <div>
+    <div class="titleBox">
+      <PageTitle title="必巡线管理" />
+      <el-button type="primary" @click="addEdit('add', row)">新增</el-button>
+    </div>
+    <!-- 搜索 -->
+    <div ref="searchBox">
+      <Search :searchArr="searchConfiger" @submit="onSearch"></Search>
+    </div>
+    <!-- 表格 -->
+    <div class="tabBox">
+      <MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
+        :key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
+        <template #bxxLx="{ row }">
+          <DictTag :value="row.bxxLx" :tag="false" :options="D_BZ_BXDLX" />
+        </template>
+        <template #bxds="{ row }">
+          <div>{{ row.bxds?.length }}</div>
+        </template>
+        <!-- 操作 -->
+        <template #controls="{ row }">
+          <el-link type="primary" @click="addEdit('edit', row)">编辑</el-link>
+          <el-link type="danger" @click="handleDelete([row.id])">删除</el-link>
+        </template>
+      </MyTable>
+      <Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight" :pageConfiger="{
+        ...pageData.pageConfiger,
+        total: pageData.total
+      }"></Pages>
+    </div>
+    <!-- 详情 -->
+    <DetailForm ref="detailDiloag" v-if="showDetail" @refresh="getList" :dic="{D_BZ_BXDLX,D_BZ_XZQHDM}" />
+  </div>
+</template>
+
+<script setup>
+import PageTitle from "@/components/aboutTable/PageTitle.vue";
+import MyTable from "@/components/aboutTable/MyTable.vue";
+import Pages from "@/components/aboutTable/Pages.vue";
+import Search from "@/components/aboutTable/Search.vue";
+import DetailForm from "./components/detailForm.vue";
+import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
+import { reactive, ref, onMounted, getCurrentInstance, nextTick } from "vue";
+const { proxy } = getCurrentInstance();
+const { D_BZ_BXDLX,D_BZ_XZQHDM } = proxy.$dict("D_BZ_BXDLX","D_BZ_XZQHDM");
+const detailDiloag = ref();
+const searchBox = ref(); //搜索框
+const showDetail = ref(false); // 控制详情弹窗显示
+const searchConfiger = ref([
+  {
+    label: "必巡线名称",
+    prop: "bxxmc",
+    placeholder: "必巡线名称",
+    showType: "input"
+  },
+
+  {
+    label: "所属辖区",
+    prop: "ssbmdm",
+    placeholder: "分县局",
+    showType: "department"
+  }
+]);
+
+const queryFrom = ref({});
+const pageData = reactive({
+  tableData: [],
+  keyCount: 0,
+  tableConfiger: {
+    rowHieght: 61,
+    showSelectType: "null",
+    loading: false
+  },
+  total: 5,
+  pageConfiger: {
+    pageSize: 20,
+    pageCurrent: 1
+  },
+  controlsWidth: 200,
+  tableColumn: [
+    { label: "必巡线名称", prop: "bxxMc" },
+    { label: "所属辖区", prop: "ssbm" },
+    { label: "必巡线类型", prop: "bxxLx", showSolt: true },
+    { label: "必巡点数量", prop: "bxds", showSolt: true }
+  ]
+});
+
+onMounted(() => {
+  getList();
+  tabHeightFn();
+});
+
+// 搜索
+const onSearch = (val) => {
+  queryFrom.value = { ...val };
+  pageData.pageConfiger.pageCurrent = 1;
+  getList();
+};
+
+const changeNo = (val) => {
+  pageData.pageConfiger.pageNum = val;
+  getList();
+};
+const changeSize = (val) => {
+  pageData.pageConfiger.pageSize = val;
+  getList();
+};
+
+// 获取列表
+const getList = () => {
+  pageData.tableConfiger.loading = true;
+  let data = { ...pageData.pageConfiger, ...queryFrom.value };
+  qcckGet(data, "/mosty-jbld/jbldBxx/queryList").then((res) => {
+    pageData.tableData = res.records || [];
+    pageData.total = res.total;
+    pageData.tableConfiger.loading = false;
+  }).catch(() => {
+    pageData.tableConfiger.loading = false;
+  });
+};
+
+// 详情
+const addEdit = (type, row) => {
+  showDetail.value = true;
+  nextTick(() => {
+    detailDiloag.value.init(type, row);
+  });
+};
+
+// 删除
+const handleDelete = (ids) => {
+  proxy.$confirm("确认删除该记录吗?", "提示", { confirmButtonText: "确定", cancelButtonText: "取消", type: "warning"}).then(() => {
+    qcckPost(ids, "/mosty-jbld/jbldBxx/deleteBxx").then((res) => {
+      proxy.$message({ type: "success", message: "删除成功!"  });
+      getList();
+    }).catch(() => {
+      pageData.tableConfiger.loading = false;
+    });
+  });
+};
+
+// 表格高度计算
+const tabHeightFn = () => {
+  pageData.tableHeight =
+    window.innerHeight - searchBox.value.offsetHeight - 250;
+  window.onresize = function () {
+    tabHeightFn();
+  };
+};
+</script>
+
+<style>
+.el-loading-mask {
+  background: rgba(0, 0, 0, 0.5) !important;
+}
+</style>