无锡大屏添加变电站名称绑定

2025-11-04 14:06:39 +08:00
parent 1a0a42c5a5
commit b396686b61
5 changed files with 134 additions and 113 deletions
--- a/src/api/statistics/index.ts
+++ b/src/api/statistics/index.ts
@@ -303,3 +303,12 @@ export function exportLineData() {
    responseType: "blob",
  });
 }
+
+// 无锡地图查询
+export function stationMap(data: object) {
+  return service({
+    url: "/scale/stationMap",
+    method: "post",
+    data,
+  });
+}
--- a/src/assets/bdz.png
+++ b/src/assets/bdz.png
--- a/src/views/SagTraceResult_WX/components/bdMap.vue
+++ b/src/views/SagTraceResult_WX/components/bdMap.vue
@@ -2,14 +2,14 @@
  <div v-loading="loading" element-loading-background="#343849c7">
    <div class="iconBox">
      <div class="div">
-        <img src="@/assets/jcd.png" alt="" />
+        <img src="@/assets/bdz.png" alt="" />
        <span>变电站</span>
      </div>

-      <div class="div">
+      <!-- <div class="div">
        <img src="@/assets/img/txzcwzj.png" alt="" />
        <span>监测点</span>
-      </div>
+      </div> -->
    </div>
    <div class="bmSelect">
      <el-select
@@ -45,26 +45,26 @@
        :double-click-zoom="false"
      >
        <!--  线-->
-        <div v-if="zoom > 13">
+        <!-- <div v-if="zoom > 13">
          <bm-polyline
            :path="path"
            v-for="(path, index) in polyline"
            :key="index"
          ></bm-polyline>
-        </div>
+        </div> -->

        <!-- 变电站-->
-        <template v-if="zoom > 13">
+        <template>
          <bm-marker
            :position="path"
            v-for="path in siteList"
            :key="path.subId"
            :icon="path.icon"
-            @click="markerClick(path)"
+            @click="pointClick(path)"
          ></bm-marker>
        </template>
        <!-- 点 -->
-        <div maxZoom="12">
+        <!-- <div maxZoom="12">
          <bm-marker
            :position="path"
            v-for="path in areaLineInfo"
@@ -72,7 +72,7 @@
            :icon="path.icon"
            @click="pointClick(path)"
          ></bm-marker>
-        </div>
+        </div> -->
        <bm-marker
          :position="infoWindowPoint"
          :icon="{ url: '1', size: { width: 0, height: 0 } }"
@@ -89,7 +89,7 @@
 </template>
 <script setup lang="ts">
 import { ref, reactive, nextTick, onMounted } from "vue";
-import { substationCount } from "@/api/statistics/index";
+import { stationMap } from "@/api/statistics/index";
 import { useStore } from "vuex";
 // import { BmlMarkerClusterer } from "vue-baidu-map-3x";
 const emit = defineEmits(["pointClick"]);
@@ -150,87 +150,87 @@ const init = () => {
  polyline.value = [];
  dataList.value = [];
  areaLineInfo.value = [];
-  // substationCount({
-  //   deptId: store.state.deptId,
-  //   type: store.state.timeType,
-  //   startTime: store.state.timeValue[0],
-  //   endTime: store.state.timeValue[1],
-  // }).then((res: any) => {
-  // dataList.value = res.data;
-  dataList.value = [
-    {
-      stationId: 156,
-      stationName: "110kV北京电视台变",
-      gdName: "检修分公司",
-      longitude: 120.33,
-      latitude: 31.52,
-      lineCount: 1,
-      eventCount: 1,
-      lineEventDetails: [
-        // {
-        //   gdName: "检修分公司",
-        //   pictureId: "5debb8bd0ce26527675eedffd74a3198",
-        //   pictureName: "无锡线上",
-        // },
-        {
-          gdName: "检修分公司",
-          pictureId: "35b1301833e3fdfc872b1a27a17c7245",
-          pictureName: "无锡修改1011--工程部",
-        },
-      ],
-    },
-  ];
+  stationMap({
+    deptId: store.state.deptId,
+    type: store.state.timeType,
+    startTime: store.state.timeValue[0],
+    endTime: store.state.timeValue[1],
+  }).then((res: any) => {
+  dataList.value = res.data;
+  // dataList.value = [
+  //   {
+  //     stationId: 156,
+  //     stationName: "110kV北京电视台变",
+  //     gdName: "检修分公司",
+  //     longitude: 120.33,
+  //     latitude: 31.52,
+  //     lineCount: 1,
+  //     eventCount: 1,
+  //     lineEventDetails: [
+  //       // {
+  //       //   gdName: "检修分公司",
+  //       //   pictureId: "5debb8bd0ce26527675eedffd74a3198",
+  //       //   pictureName: "无锡线上",
+  //       // },
+  //       {
+  //         gdName: "检修分公司",
+  //         pictureId: "35b1301833e3fdfc872b1a27a17c7245",
+  //         pictureName: "无锡修改1011--工程部",
+  //       },
+  //     ],
+  //   },
+  // ];
  let data = dataList.value;
  let r = 0.0035;
-  let list = data.filter((item: any) => item.latitude != 0);
+  let list = data.filter((item: any) => item.lat != 0);
  list.forEach((item: any) => {
    // 变电站图标
    item.icon = {
-      url: new URL("@/assets/jcd.png", import.meta.url).href,
+      url: new URL("@/assets/bdz.png", import.meta.url).href,
      size: {
        width: 40,
        height: 40,
      },
    };
-    if (
-      item.lineEventDetails?.length > 10 &&
-      item.lineEventDetails?.length < 100
-    ) {
-      r = 0.0055;
-    } else if (item.lineEventDetails.length >= 100) {
-      r = 0.01055;
-    }
-    item.lng = item.longitude;
-    item.lat = item.latitude;
-    item.lineEventDetails.forEach((val: any, i: number) => {
-      val.lng =
-        item.longitude +
-        r * Math.cos((2 * Math.PI * i) / item.lineEventDetails.length);
-      val.lat =
-        item.latitude +
-        r * Math.sin((2 * Math.PI * i) / item.lineEventDetails.length);
-      // 监测点图标
-      val.icon = {
-        url: new URL("@/assets/img/txzcwzj.png", import.meta.url).href,
-        size: {
-          width: 40,
-          height: 40,
-        },
-      };
+    // if (
+    //   item.lineEventDetails?.length > 10 &&
+    //   item.lineEventDetails?.length < 100
+    // ) {
+    //   r = 0.0055;
+    // } else if (item.lineEventDetails.length >= 100) {
+    //   r = 0.01055;
+    // }
+    // item.lng = item.longitude;
+    // item.lat = item.latitude;
+    // item.lineEventDetails.forEach((val: any, i: number) => {
+    //   val.lng =
+    //     item.longitude +
+    //     r * Math.cos((2 * Math.PI * i) / item.lineEventDetails.length);
+    //   val.lat =
+    //     item.latitude +
+    //     r * Math.sin((2 * Math.PI * i) / item.lineEventDetails.length);
+    //   // 监测点图标
+    //   val.icon = {
+    //     url: new URL("@/assets/img/txzcwzj.png", import.meta.url).href,
+    //     size: {
+    //       width: 40,
+    //       height: 40,
+    //     },
+    //   };

-      polyline.value.push([
-        {
-          lng: item.lng,
-          lat: item.lat,
-        },
-        {
-          lng: val.lng,
-          lat: val.lat,
-        },
-      ]);
-    });
+    //   polyline.value.push([
+    //     {
+    //       lng: item.lng,
+    //       lat: item.lat,
+    //     },
+    //     {
+    //       lng: val.lng,
+    //       lat: val.lat,
+    //     },
+    //   ]);
+    // });

-    areaLineInfo.value.push(...item.lineEventDetails);
+    // areaLineInfo.value.push(...item.lineEventDetails);
  });

  siteList.value = list;
@@ -239,7 +239,7 @@ const init = () => {
  setTimeout(() => {
    loading.value = false;
  }, 0);
-  // });
+   });
 };
 const moveenFlag = ref(true);

@@ -364,7 +364,7 @@ defineExpose({
  left: 10px;
  z-index: 1;
  width: 110px;
-  height: 70px;
+  height: 40px;
  padding: 10px;
  background: #ffffff10 !important;
  border: 1px solid #ccc;
--- a/src/views/SagTraceResult_WX/components/manage/index.vue
+++ b/src/views/SagTraceResult_WX/components/manage/index.vue
@@ -65,22 +65,9 @@
                    <Edit @click="editd(item)" />
                  </el-icon>
                </el-tooltip>
-
-                <!-- <el-tooltip
-                  class="item"
-                  effect="dark"
-                  content="修改项目"
-                  placement="top"
-                >
-                  <Edit
-                    style="margin-left: 5px; width: 16px"
-                    class="xiaoshou color"
-                    @click="editd(item)"
-                  /> </el-tooltip
-              > -->
              </span>
              <div style="display: flex; justify-content: end">
-                <el-button
+                <!-- <el-button
                  v-if="item.active == 0"
                  class="color"
                  :icon="Compass"
@@ -95,7 +82,7 @@
                  style="padding: 3px 0; color: #82bd51"
                  type="text"
                  >已激活</el-button
-                >
+                > -->
                <el-button
                  class="color"
                  :icon="Share"
@@ -163,17 +150,21 @@
          placeholder="请输入项目名称"
        />
      </el-form-item>
-      <!-- <el-form-item label="工程项目" prop="projectIds">
+      <el-form-item label="变电站名称">
        <el-select
-          v-model="ruleForm.projectIds"
+          v-model="ruleForm.substionIds"
          placeholder="请选择"
-          :popper-append-to-body="false"
-          popper-class="custom-select-dropdown"
+          multiple
        >
-          <el-option label="Zone one111" value="shanghai" />
-          <el-option label="Zone two" value="beijing" />
+          <el-option
+            v-for="item in dataList"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+            :disabled="item.bindFlag==true"
+          />
        </el-select>
-      </el-form-item> -->
+      </el-form-item>
      <el-form-item label="项目排序" prop="orderBy">
        <el-input v-model="ruleForm.orderBy" placeholder="请输入" />
      </el-form-item>
@@ -218,11 +209,14 @@ import {
  active,
  getActive,
 } from "@/api/manage_wx/index";
+import { stationMap } from "@/api/statistics/index";
+import { useStore } from "vuex";

 const emit = defineEmits<{
  (e: "project-change", project: { id: string; name: string }): void;
 }>();

+const store = useStore();
 const projectData = ref([]);

 // 系统配置弹框
@@ -240,6 +234,8 @@ const firstForm = ref({
  id: "",
 });

+const dataList = ref([]); //变电站
+
 const params = reactive({
  pageNum: 1,
  pageSize: 10,
@@ -251,6 +247,7 @@ interface RuleForm {
  projectIds: [];
  orderBy: string;
  remark: string;
+  substionIds:[];
 }

 const formSize = ref("default");
@@ -260,17 +257,18 @@ const ruleForm = reactive<RuleForm>({
  projectIds: [],
  orderBy: "100",
  remark: "",
+  substionIds:[],
 });

 const rules = reactive<FormRules<RuleForm>>({
  name: [{ required: true, message: "请输入项目名称", trigger: "blur" }],
-  projectIds: [
-    {
-      required: true,
-      message: "请选择",
-      trigger: "change",
-    },
-  ],
+  // projectIds: [
+  //   {
+  //     required: true,
+  //     message: "请选择",
+  //     trigger: "change",
+  //   },
+  // ],
  orderBy: [
    {
      required: true,
@@ -280,6 +278,17 @@ const rules = reactive<FormRules<RuleForm>>({
  ],
 });

+const init = () => {
+  stationMap({
+    deptId: store.state.deptId,
+    type: store.state.timeType,
+    startTime: store.state.timeValue[0],
+    endTime: store.state.timeValue[1],
+  }).then((res: any) => {
+    dataList.value = res.data;
+  });
+};
+
 onMounted(() => {
  fetachData();
 });
@@ -342,6 +351,7 @@ const onSubmitadd = () => {
    orderBy: "100",
    projectIds: ["1dd1b076e104f15459ac401fc1b902c4"],
    remark: "",
+    substionIds:[],
  });
  //Object.keys(ruleForm).forEach((key) => delete ruleForm[key]); //生效，但是有默认值的，一进去会直接报校验
 };
@@ -359,6 +369,7 @@ const editd = (row: any) => {
    orderBy: row.orderBy,
    projectIds: row.projectIds,
    remark: row.remark,
+    substionIds:row.substionIds,
  });
 };

@@ -526,6 +537,7 @@ const activeItem = (item: any) => {

 const open = () => {
  dialogVisible.value = true;
+  init();
 };
 defineExpose({
  open,
--- a/src/views/SagTraceResult_WX/components/plan.vue
+++ b/src/views/SagTraceResult_WX/components/plan.vue
@@ -57,7 +57,7 @@ watch(
 );
 // 点击监测点传入 接线图id
 const pointClick = (row: any) => {
-  setUrl(row.pictureId, row.pictureName);
+  setUrl(row.configId, row.configName);
  keyof.value += 1;
 };

@@ -73,8 +73,8 @@ onMounted(() => {
 });
 const setUrl = (url: string, nam: string) => {
  iframeSrc.value =
-    // window.location.origin +
-    "http://192.168.1.179:4001" +
+    window.location.origin +
+    // "http://192.168.1.179:4001" +
    `/zutai/?id=${url}&&name=${encodeURIComponent(
      nam
    )}&&preview=true&&display=true&&graphicDisplay=wx#/preview`;