Web/bigscreenWeb
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
stt
2025-11-04 14:06:39 +08:00
parent 1a0a42c5a5
commit b396686b61
5 changed files with 134 additions and 113 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/api/statistics/index.ts
View File

@@ -303,3 +303,12 @@ export function exportLineData() {
responseType: "blob", responseType: "blob",
}); });
} }
// 无锡地图查询
export function stationMap(data: object) {
return service({
url: "/scale/stationMap",
method: "post",
data,
});
}

BIN
src/assets/bdz.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

162
src/views/SagTraceResult_WX/components/bdMap.vue
View File

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

70
src/views/SagTraceResult_WX/components/manage/index.vue
View File

@@ -65,22 +65,9 @@
<Edit @click="editd(item)" /> <Edit @click="editd(item)" />
</el-icon> </el-icon>
</el-tooltip> </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> </span>
<div style="display: flex; justify-content: end"> <div style="display: flex; justify-content: end">
<el-button <!-- <el-button
v-if="item.active == 0" v-if="item.active == 0"
class="color" class="color"
:icon="Compass" :icon="Compass"
@@ -95,7 +82,7 @@
style="padding: 3px 0; color: #82bd51" style="padding: 3px 0; color: #82bd51"
type="text" type="text"
>已激活</el-button >已激活</el-button
> > -->
<el-button <el-button
class="color" class="color"
:icon="Share" :icon="Share"
@@ -163,17 +150,21 @@
placeholder="请输入项目名称" placeholder="请输入项目名称"
/> />
</el-form-item> </el-form-item>
<!-- <el-form-item label="工程项目" prop="projectIds"> <el-form-item label="变电站名称">
<el-select <el-select
v-model="ruleForm.projectIds" v-model="ruleForm.substionIds"
placeholder="请选择" placeholder="请选择"
:popper-append-to-body="false" multiple
popper-class="custom-select-dropdown"
> >
<el-option label="Zone one111" value="shanghai" /> <el-option
<el-option label="Zone two" value="beijing" /> v-for="item in dataList"
:key="item.id"
:label="item.name"
:value="item.id"
:disabled="item.bindFlag==true"
/>
</el-select> </el-select>
</el-form-item> --> </el-form-item>
<el-form-item label="项目排序" prop="orderBy"> <el-form-item label="项目排序" prop="orderBy">
<el-input v-model="ruleForm.orderBy" placeholder="请输入" /> <el-input v-model="ruleForm.orderBy" placeholder="请输入" />
</el-form-item> </el-form-item>
@@ -218,11 +209,14 @@ import {
active, active,
getActive, getActive,
} from "@/api/manage_wx/index"; } from "@/api/manage_wx/index";
import { stationMap } from "@/api/statistics/index";
import { useStore } from "vuex";
const emit = defineEmits<{ const emit = defineEmits<{
(e: "project-change", project: { id: string; name: string }): void; (e: "project-change", project: { id: string; name: string }): void;
}>(); }>();
const store = useStore();
const projectData = ref([]); const projectData = ref([]);
// 系统配置弹框 // 系统配置弹框
@@ -240,6 +234,8 @@ const firstForm = ref({
id: "", id: "",
}); });
const dataList = ref([]); //变电站
const params = reactive({ const params = reactive({
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
@@ -251,6 +247,7 @@ interface RuleForm {
projectIds: []; projectIds: [];
orderBy: string; orderBy: string;
remark: string; remark: string;
substionIds:[];
} }
const formSize = ref("default"); const formSize = ref("default");
@@ -260,17 +257,18 @@ const ruleForm = reactive<RuleForm>({
projectIds: [], projectIds: [],
orderBy: "100", orderBy: "100",
remark: "", remark: "",
substionIds:[],
}); });
const rules = reactive<FormRules<RuleForm>>({ const rules = reactive<FormRules<RuleForm>>({
name: [{ required: true, message: "请输入项目名称", trigger: "blur" }], name: [{ required: true, message: "请输入项目名称", trigger: "blur" }],
projectIds: [ // projectIds: [
{ // {
required: true, // required: true,
message: "请选择", // message: "请选择",
trigger: "change", // trigger: "change",
}, // },
], // ],
orderBy: [ orderBy: [
{ {
required: true, 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(() => { onMounted(() => {
fetachData(); fetachData();
}); });
@@ -342,6 +351,7 @@ const onSubmitadd = () => {
orderBy: "100", orderBy: "100",
projectIds: ["1dd1b076e104f15459ac401fc1b902c4"], projectIds: ["1dd1b076e104f15459ac401fc1b902c4"],
remark: "", remark: "",
substionIds:[],
}); });
//Object.keys(ruleForm).forEach((key) => delete ruleForm[key]); //生效，但是有默认值的，一进去会直接报校验 //Object.keys(ruleForm).forEach((key) => delete ruleForm[key]); //生效，但是有默认值的，一进去会直接报校验
}; };
@@ -359,6 +369,7 @@ const editd = (row: any) => {
orderBy: row.orderBy, orderBy: row.orderBy,
projectIds: row.projectIds, projectIds: row.projectIds,
remark: row.remark, remark: row.remark,
substionIds:row.substionIds,
}); });
}; };
@@ -526,6 +537,7 @@ const activeItem = (item: any) => {
const open = () => { const open = () => {
dialogVisible.value = true; dialogVisible.value = true;
init();
}; };
defineExpose({ defineExpose({
open, open,

6
src/views/SagTraceResult_WX/components/plan.vue
View File

@@ -57,7 +57,7 @@ watch(
); );
// 点击监测点传入 接线图id // 点击监测点传入 接线图id
const pointClick = (row: any) => { const pointClick = (row: any) => {
setUrl(row.pictureId, row.pictureName); setUrl(row.configId, row.configName);
keyof.value += 1; keyof.value += 1;
}; };
@@ -73,8 +73,8 @@ onMounted(() => {
}); });
const setUrl = (url: string, nam: string) => { const setUrl = (url: string, nam: string) => {
iframeSrc.value = iframeSrc.value =
// window.location.origin + window.location.origin +
"http://192.168.1.179:4001" + // "http://192.168.1.179:4001" +
`/zutai/?id=${url}&&name=${encodeURIComponent( `/zutai/?id=${url}&&name=${encodeURIComponent(
nam nam
)}&&preview=true&&display=true&&graphicDisplay=wx#/preview`; )}&&preview=true&&display=true&&graphicDisplay=wx#/preview`;