修改地图没有经纬度报错问题

This commit is contained in:
GGJ
2025-04-27 10:17:19 +08:00
parent feea39915a
commit a68283c296
5 changed files with 206 additions and 104 deletions

View File

@@ -181,10 +181,7 @@ const updateTab = function (newRoute: RouteLocationNormalized) {
}
onBeforeRouteUpdate(async to => {
updateTab(to)
updateTab(to)
})
onMounted(() => {
@@ -215,6 +212,9 @@ onMounted(() => {
&::-webkit-scrollbar {
height: 5px;
}
&:hover {
scrollbar-width: auto;
}
//
//&::-webkit-scrollbar-thumb {

View File

@@ -23,7 +23,7 @@
:title="dialogTitle"
v-model="dialogFormVisible"
:close-on-click-modal="false"
class="cn-operate-dialog"
width="700px"
:before-close="resetForm"
>
<el-form :model="formData" label-width="120px" :rules="rules" ref="ruleFormRef">
@@ -51,6 +51,22 @@
placeholder="请输入最大终端数"
></el-input>
</el-form-item>
<el-form-item label="最大进程数:" prop="maxProcessNum" class="top">
<el-input
v-model="formData.maxProcessNum"
onkeyup="value = value.replace(/[^0-9]/g,'')"
maxlength="5"
placeholder="请输入最大进程数"
></el-input>
<!-- <el-select v-model="formData.maxProcessNum" placeholder="请选择等级" style="width: 100%">
<el-option
v-for="item in NumList"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select> -->
</el-form-item>
<el-form-item label="排序:" prop="sort" class="top">
<el-input v-model="formData.sort" placeholder="请输入排序"></el-input>
</el-form-item>
@@ -91,6 +107,7 @@ const statusoption: any = ref([
{ id: 1, name: '启用' }
])
const ruleFormRef = ref()
const formData: any = ref({
@@ -99,13 +116,15 @@ const formData: any = ref({
nodeGrade: '',
nodeDevNum: '',
sort: '',
remark: ''
remark: '',
maxProcessNum: ''
})
const rules = reactive({
name: [{ required: true, message: '名称不可为空', trigger: 'blur' }],
ip: [{ required: true, message: 'ip不可为空', trigger: 'blur' }],
nodeGrade: [{ required: true, message: '等级不可为空', trigger: 'blur' }],
nodeDevNum: [{ required: true, message: '最大终端数不可为空', trigger: 'blur' }],
maxProcessNum: [{ required: true, message: '最大进程数不可为空', trigger: 'blur' }],
sort: [{ required: true, message: '排序不可为空', trigger: 'blur' }],
remark: [{ required: true, message: '描述不可为空', trigger: 'blur' }]
})
@@ -138,6 +157,10 @@ const tableStore = new TableStore({
title: '最大监测点数量',
field: 'nodeDevNum'
},
{
title: '最大进程数',
field: 'maxProcessNum'
},
{
title: '排序',
field: 'sort'

View File

@@ -542,6 +542,7 @@
? pageStatus == 3 || pageStatus == 2
: pageStatus == 1
"
@change="item.processNum = ''"
>
<el-option
v-for="option in affiliatiedFrontArr"
@@ -551,6 +552,34 @@
></el-option>
</el-select>
</el-form-item>
<el-form-item
class="form-item"
label="进程号:"
:prop="'deviceParam.' + index + '.processNum'"
:rules="[
{ required: true, message: '请选择进程号', trigger: 'change' }
]"
>
<el-select
filterable
v-model="item.processNum"
placeholder="请选择进程号"
:disabled="
nodeLevel > 500 && (pageStatus == 3 || pageStatus == 2)
? pageStatus == 3 || pageStatus == 2
: pageStatus == 1
"
>
<el-option
v-for="item in affiliatiedFrontArr.find(
k => k.id == item.nodeId
).maxProcessNum"
:key="item"
:label="item"
:value="item"
></el-option>
</el-select>
</el-form-item>
<el-form-item
class="form-item"
label="召唤标志:"
@@ -1903,6 +1932,8 @@ const deviceBODetail: any = ref({
zhan: '',
/**所属前置机 */
nodeId: '',
// 进程号
processNum: '',
/**终端模型 */
devModel: 1,
/**本次定检时间 */
@@ -2514,7 +2545,7 @@ const queryNodeContent = () => {
return
}
if (nodeData.value.level>= 400) {
if (nodeData.value.level >= 400) {
setDown()
}
let data = {
@@ -2974,11 +3005,10 @@ onMounted(() => {
size.value = Math.round((180 / dom.offsetHeight) * 100)
}
if (VITE_FLAG) {
getYwZtSubstation({ orgId: '' }).then(res => {
powerStationList.value = res.data
})
}else{
} else {
getDevTypeList().then(res => {
typeArr.value = res.data
})

View File

@@ -1,11 +1,14 @@
<template>
<div class="default-main">
<DatePicker ref="datePickerRef" theCurrentTime style="display: none" />
<!-- 搜索框 -->
<div class="query-box-wrap">
<el-input v-model.trim="inputQuery" style="height: 46px; width: 334px" @keyup.enter="DeviceQ"
placeholder="请输入终端名称">
<el-input
v-model.trim="inputQuery"
style="height: 46px; width: 334px"
@keyup.enter="DeviceQ"
placeholder="请输入终端名称"
>
<template #prefix>
<div class="Icon"></div>
</template>
@@ -27,9 +30,12 @@
<span class="ml10" style="color: #0d867f">{{ item.count }}</span>
</template>
<div class="collapseBox">
<div class="group-list__item"
<div
class="group-list__item"
:style="colorKey == k.coordinate ? 'background-color: #009ea81a;' : ''"
v-for="k in item.psrList" @click="flyTo(k)">
v-for="k in item.psrList"
@click="flyTo(k)"
>
<p>{{ k.psrName }}</p>
<p>{{ k.vlevelName }}|{{ k.maintOrgName }}</p>
</div>
@@ -37,112 +43,169 @@
</el-collapse-item>
</el-collapse>
<div v-if="QueryList.length > 0 && !showCollapse" class="collapse_none" style="color: #009ea8"
@click="showCollapse = true">
<div
v-if="QueryList.length > 0 && !showCollapse"
class="collapse_none"
style="color: #009ea8"
@click="showCollapse = true"
>
展开搜索结果
</div>
<div class="collapse_none" style="color: red;cursor: pointer" @click="showWrap = false">关闭</div>
<div class="collapse_none" style="color: red; cursor: pointer" @click="showWrap = false">关闭</div>
</div>
<baidu-map class="map" :style="height" @ready="initMap" @zoomend='syncCenterAndZoom' :center="center"
:zoom="zoomMap" :scroll-wheel-zoom='true' >
<baidu-map
class="map"
:style="height"
@ready="initMap"
@zoomend="syncCenterAndZoom"
:center="center"
:zoom="zoomMap"
:scroll-wheel-zoom="true"
>
<!-- 线-->
<div v-if='zoom > 13'>
<bm-polyline :path='path' v-for='(path, index) in polyline' :key='index'></bm-polyline>
<div v-if="zoom > 13">
<bm-polyline :path="path" v-for="(path, index) in polyline" :key="index"></bm-polyline>
</div>
<!-- 变电站-->
<template v-if='zoom > 13'>
<bm-marker :position='path' v-for='path in siteList' :key='path.subId' :icon='path.icon'
@click='markerClick(path)'></bm-marker>
<template v-if="zoom > 13">
<bm-marker
:position="path"
v-for="path in siteList"
:key="path.subId"
:icon="path.icon"
@click="markerClick(path)"
></bm-marker>
</template>
<!-- -->
<div :maxZoom='12' v-if='zoom > 9'>
<bm-marker :position='path' v-for='path in areaLineInfo' :key='path.lineId' :icon='path.icon'
@click='markerClick(path)' :zIndex="1">
<bm-label v-if='zoom > 14' :content="path.lineName"
:labelStyle="{ color: '#fff', border: '0px solid #fff', backgroundColor: 'rgba(0, 0, 0, 0.5)', borderRadius: '10px', padding: '2px 5px', fontSize: '12px', lineHeight: '15px', transform: 'translateX(-30%)' }"
:offset="{ height: 33 }" />
<div :maxZoom="12" v-if="zoom > 9">
<bm-marker
:position="path"
v-for="path in areaLineInfo"
:key="path.lineId"
:icon="path.icon"
@click="markerClick(path)"
:zIndex="1"
>
<bm-label
v-if="zoom > 14"
:content="path.lineName"
:labelStyle="{
color: '#fff',
border: '0px solid #fff',
backgroundColor: 'rgba(0, 0, 0, 0.5)',
borderRadius: '10px',
padding: '2px 5px',
fontSize: '12px',
lineHeight: '15px',
transform: 'translateX(-30%)'
}"
:offset="{ height: 33 }"
/>
</bm-marker>
</div>
<!-- 详情 -->
<bm-marker :position='infoWindowPoint' :icon="{ url: '1', size: { width: 0, height: 0 } }">
<bm-info-window :show='infoWindowPoint.show' @close='infoWindowPoint.show = false'>
<el-descriptions :title='infoWindowPoint.lineName' :column='1' v-if='infoWindowPoint.lineId'>
<el-descriptions-item label='供电公司'>{{ infoWindowPoint.gdName }}</el-descriptions-item>
<el-descriptions-item label='变电站'>{{ infoWindowPoint.subName }}</el-descriptions-item>
<el-descriptions-item label='母线'>{{ infoWindowPoint.voltageName }}</el-descriptions-item>
<el-descriptions-item label='网络参数'>
<bm-marker :position="infoWindowPoint" :icon="{ url: '1', size: { width: 0, height: 0 } }">
<bm-info-window :show="infoWindowPoint.show" @close="infoWindowPoint.show = false">
<el-descriptions :title="infoWindowPoint.lineName" :column="1" v-if="infoWindowPoint.lineId">
<el-descriptions-item label="供电公司">{{ infoWindowPoint.gdName }}</el-descriptions-item>
<el-descriptions-item label="变电站">{{ infoWindowPoint.subName }}</el-descriptions-item>
<el-descriptions-item label="母线">{{ infoWindowPoint.voltageName }}</el-descriptions-item>
<el-descriptions-item label="网络参数">
{{ infoWindowPoint.ip }}
</el-descriptions-item>
<el-descriptions-item label='PT变化'>{{ infoWindowPoint.pt2 }}</el-descriptions-item>
<el-descriptions-item label='CT变化'>{{ infoWindowPoint.ct2 }}</el-descriptions-item>
<el-descriptions-item label='生产厂家'>
<el-descriptions-item label="PT变化">{{ infoWindowPoint.pt2 }}</el-descriptions-item>
<el-descriptions-item label="CT变化">{{ infoWindowPoint.ct2 }}</el-descriptions-item>
<el-descriptions-item label="生产厂家">
{{ infoWindowPoint.manufacturer }}
</el-descriptions-item>
<el-descriptions-item label='终端状态'>
<el-descriptions-item label="终端状态">
{{
infoWindowPoint.runFlag == 0 ? '投运' : infoWindowPoint.runFlag == 1 ? '热备用' : '停运'
}}
</el-descriptions-item>
<el-descriptions-item label='通讯状态'>
<el-descriptions-item label="通讯状态">
{{ infoWindowPoint.comFlag == 0 ? '中断' : '正常' }}
</el-descriptions-item>
<el-descriptions-item>
<el-button type='primary' size='small' @click='lookPoint(infoWindowPoint)'>查看详情</el-button>
<el-button type="primary" size="small" @click="lookPoint(infoWindowPoint)">
查看详情
</el-button>
</el-descriptions-item>
</el-descriptions>
<el-descriptions :title='infoWindowPoint.subName' :column='1' v-else-if='infoWindowPoint.subId'
style='padding-top: 10px'></el-descriptions>
<el-descriptions
:title="infoWindowPoint.subName"
:column="1"
v-else-if="infoWindowPoint.subId"
style="padding-top: 10px"
></el-descriptions>
</bm-info-window>
</bm-marker>
<!-- 行政区划 -->
<div v-if='zoom <= 11'>
<div v-if="zoom <= 11">
<div v-for="item in AreaData">
<bm-polygon v-for="timeK in item.boundary" :path="timeK" :strokeWeight="2" strokeColor="#0e8780"
:strokeOpacity="1" :fillColor="item.background || ''" :fillOpacity="0.5"></bm-polygon>
<bm-polygon
v-for="timeK in item.boundary"
:path="timeK"
:strokeWeight="2"
strokeColor="#0e8780"
:strokeOpacity="1"
:fillColor="item.background || ''"
:fillOpacity="0.5"
></bm-polygon>
</div>
</div>
<!-- 信息弹框 -->
<div v-if='zoom <= 9'>
<bm-overlay v-for="item in AreaData" pane="labelPane" :class="{ sample: true, }"
@draw="draw($event, item.LngLat)">
<div v-if="zoom <= 9">
<bm-overlay
v-for="item in AreaData"
pane="labelPane"
:class="{ sample: true }"
@draw="draw($event, item.LngLat)"
>
<div class="my-radiusPop" :style="{ background: item.background }">
<img :src="PopKey == 2 ? imgUrl2 : PopKey == 1 ? imgUrl1 : PopKey == 0 ? imgUrl0 : ''" />
<div class="infoBox">
<div>
总数<br />{{ PopKey == 2 ? item.lineNum : PopKey == 1 ? item.deviceNum : PopKey == 0 ?
item.subNum :
'/' }}
总数
<br />
{{
PopKey == 2
? item.lineNum
: PopKey == 1
? item.deviceNum
: PopKey == 0
? item.subNum
: '/'
}}
</div>
<div>
{{ PopKey == 2 ? '在线' : PopKey == 1 ? '在运' : '告警' }}<br />{{ PopKey == 2 ?
item.onlineNum :
PopKey
== 1
?
item.alarmSubNum : PopKey == 0 ?
item.onDevice : '/' }}
{{ PopKey == 2 ? '在线' : PopKey == 1 ? '在运' : '告警' }}
<br />
{{
PopKey == 2
? item.onlineNum
: PopKey == 1
? item.alarmSubNum
: PopKey == 0
? item.onDevice
: '/'
}}
</div>
<div v-if="PopKey == 2">
告警<br />{{ PopKey == 2 ? item.alarm : PopKey == 1 ? item.xx : PopKey == 0 ? item.xx :
'/' }}
告警
<br />
{{ PopKey == 2 ? item.alarm : PopKey == 1 ? item.xx : PopKey == 0 ? item.xx : '/' }}
</div>
</div>
</div>
</bm-overlay>
</div>
</baidu-map>
</div>
</template>
<script setup lang='ts'>
<script setup lang="ts">
import { mainHeight } from '@/utils/layout'
import { getAreaLineInfo } from '@/api/event-boot/areaInfo'
import { ref, reactive, onMounted } from 'vue'
@@ -153,7 +216,7 @@ import { BaiduMap, BmOverlay } from 'vue-baidu-map-3x'
import { getAssessOverview } from '@/api/device-boot/panorama'
import { getGridDiagramAreaData } from '@/api/device-boot/panorama'
const emit = defineEmits(['changeValue', 'drop', 'show'])
import mapJson from './boundary';
import mapJson from './boundary'
const datePickerRef = ref()
const height = mainHeight(20)
// 页面中直接引入就可以
@@ -207,7 +270,8 @@ const siteList = ref<any>([])
const polyline = ref<any>([])
const lineId = ref('')
const center = ref({
lng: 116.84428600000001, lat: 40.57707185292256
lng: 116.84428600000001,
lat: 40.57707185292256
})
const infoWindowPoint = ref<anyObj>({
lng: 0,
@@ -215,11 +279,9 @@ const infoWindowPoint = ref<anyObj>({
show: false
})
// 地图实例
const initMap = async ({ BMap, map }: any) => {
}
const initMap = async ({ BMap, map }: any) => {}
// 加载点
const addMarkers = async (row?: any, key?: any, num?: any) => {
let params = {
deptIndex: deptIndex.value,
monitorFlag: 2,
@@ -310,15 +372,12 @@ const addMarkers = async (row?: any, key?: any, num?: any) => {
siteList.value = list
// center.value.lng = areaLineInfo.value[0].lng
// center.value.lat = areaLineInfo.value[0].lat
}
// 获取zoom
const syncCenterAndZoom = (e: any) => {
zoom.value = e.target.getZoom()
}
const locatePositions = (e: any) => {
deptIndex.value = e.data.id
// 加载点
addMarkers()
@@ -339,20 +398,18 @@ const markerClick = (e: any) => {
const lookPoint = (e: any) => {
emit('drop', e.lineId)
emit('show', true)
}
// 搜索
const DeviceQ = () => {
showCollapse.value = true
if (inputQuery.value.length == 0) return
let list = []
let regex = new RegExp(inputQuery.value, 'i')
let data = areaLineInfo.value.filter((item: any) => regex.test(item.lineName))
let data = areaLineInfo.value
.filter((item: any) => regex.test(item.lineName))
.map((item: any) => {
return {
psrName: item.lineName,
vlevelName: item.voltageScale,
maintOrgName: item.gdName,
@@ -361,7 +418,6 @@ const DeviceQ = () => {
})
// data.replace(//s/g,',')
if (data.length > 0) {
list.push({
count: data.length,
@@ -375,21 +431,18 @@ const DeviceQ = () => {
// 定位
const flyTo = (e: any, zoom?: number) => {
let regex = new RegExp(e.psrName, 'i')
center.value.lng = e.coordinate[0]
center.value.lat = e.coordinate[1]
if (zoom) { zoomMap.value = zoom }
else {
if (zoom) {
zoomMap.value = zoom
} else {
zoomMap.value = 15
let data = areaLineInfo.value.filter((item: any) => regex.test(item.lineName))[0]
if (data) {
markerClick(data)
}
}
}
// 市级统计数据
const grids = (row: any) => {
@@ -403,8 +456,8 @@ const grids = (row: any) => {
isUpToGrid: row.isUpToGrid,
monitorFlag: row.isUpToGrid == 0 ? null : row.isUpToGrid
}
AreaData.value=[]
assessList.value=[]
AreaData.value = []
assessList.value = []
// 综合评估
getAssessOverview(form).then(res => {
assessList.value = res.data?.children
@@ -417,15 +470,13 @@ const grids = (row: any) => {
})
}
const radiusPop = (k: any) => {
console.log("🚀 ~ radiusPop ~ k:", k)
console.log('🚀 ~ radiusPop ~ k:', k)
if (k != undefined) PopKey.value = k
}
const GridDiagramArea = () => {
boundaryList.value.forEach((item: any) => {
assessList.value.forEach((y: any) => {
if (item.orgName == y.name) {
if (y.score == 3.14159) {
} else if (y.score > 4.5) {
item.background = '#33996699'
@@ -454,7 +505,7 @@ const GridDiagramArea = () => {
}, 0)
}
// 市级统计
const draw = ({ el, BMap, map }, val) => {
const draw = ({ el, BMap, map }, val = [0, 0]) => {
const pixel = map.pointToOverlayPixel(new BMap.Point(val[0], val[1]))
el.style.left = pixel.x - 60 + 'px'
el.style.top = pixel.y - 20 + 'px'
@@ -464,8 +515,7 @@ const reset = () => {
inputQuery.value = ''
showWrap.value = false
}
onMounted(() => {
})
onMounted(() => {})
defineExpose({ addMarkers, locatePositions, reset, grids, radiusPop, flyTo })
</script>
<style lang="scss" scoped>
@@ -473,7 +523,6 @@ defineExpose({ addMarkers, locatePositions, reset, grids, radiusPop, flyTo })
.map {
width: 100%;
}
.query-box-wrap {
@@ -515,7 +564,6 @@ defineExpose({ addMarkers, locatePositions, reset, grids, radiusPop, flyTo })
}
}
}
}
</style>
./cds.js./boundary
./cds.js./boundary

View File

@@ -267,7 +267,7 @@ const dictData = useDictData()
const show = ref(false)
const height = mainHeight(30)
const boxHeight: any = mainHeight(420, 2)
const EchHeight: any = mainHeight(490, 2)
const EchHeight: any = mainHeight(510, 2)
const evaluateRef = ref()
const steadyStateRef = ref()
const formRow: any = ref({})
@@ -491,7 +491,8 @@ defineExpose({ info, show })
}
}
.evaluate {
margin: 10px 0;
white-space: nowrap;
margin: 0px 0;
display: flex;
justify-content: space-around;
text-align: center;