From f2a74b0b28b74dc29be85ec8e6328bdd262f84b9 Mon Sep 17 00:00:00 2001
From: zhongrj <646384940@qq.com>
Date: Fri, 24 May 2024 14:35:58 +0800
Subject: [PATCH] 地址配置修改
---
src/views/dispatch/components/OlMapBox.vue | 41 ++++++++++++++++++++++++++++++++++++-----
1 files changed, 36 insertions(+), 5 deletions(-)
diff --git a/src/views/dispatch/components/OlMapBox.vue b/src/views/dispatch/components/OlMapBox.vue
index 2292e3d..8fba147 100644
--- a/src/views/dispatch/components/OlMapBox.vue
+++ b/src/views/dispatch/components/OlMapBox.vue
@@ -9,7 +9,7 @@
* Copyright (c) 2023 by shuishen, All Rights Reserved.
-->
<template>
- <div class="w100 h100">
+ <div class="w100 h100" style="position: relative;">
<div id="OlMapBoxElement" class="w100 h100">
</div>
<div id="popup" class="ol-popup" v-show="isShowUnitInfoPopover">
@@ -20,6 +20,12 @@
<p>派遣保安员数:{{ unitData.num }}</p>
<p>派遣单位行业:{{ unitData.professionName }}</p>
</div>
+ </div>
+ <div class="unit-select">
+ <el-select v-model="industryValue" multiple collapse-tags placeholder="请选择行业" clearable @change="industryChange">
+ <el-option v-for="item in industryOptions" :key="item.value" :label="item.label" :value="item.value">
+ </el-option>
+ </el-select>
</div>
</div>
</template>
@@ -37,7 +43,7 @@
import Feature from 'ol/Feature.js'
import Point from 'ol/geom/Point.js'
import { Icon, Style, Fill, Text, Stroke, Circle } from 'ol/style.js'
-import { getAlldata } from "@/api/dispatch/dispatch"
+import { getAlldata, ProfessionList } from "@/api/dispatch/dispatch"
import { mapGetters } from "vuex"
import { mapState } from "vuex"
@@ -70,7 +76,9 @@
return {
publicPath: process.env.BASE_URL,
unitData: {},
- isShowUnitInfoPopover: false
+ isShowUnitInfoPopover: false,
+ industryOptions: [],
+ industryValue: [],
}
},
@@ -91,7 +99,7 @@
view: new OlView({
// 初始化中心点坐标，经纬度一会自己换一下
center: [112.85857823133, 35.496284586473],
- zoom: 18,
+ zoom: 13,
projection: "EPSG:4326"
}),
})
@@ -109,12 +117,28 @@
// console.log('mapView地图缩放事件')
})
- that.getAlldata()
+ that.getAlldata()//图标列表
+ that.ProfessionList()//行业列表
that.baseInitLayer(that.mapType)
})
},
methods: {
+ // 行业下拉选择值改变
+ industryChange () {
+ this.getAlldata()
+ },
+
+ // 获取派遣单位行业列表
+ ProfessionList () {
+ ProfessionList().then(res => {
+ this.industryOptions = []
+ res.data.data.forEach(item => {
+ this.industryOptions.push({ value: item.dictKey, label: item.dictValue })
+ })
+ })
+ },
+
// 图标点击事件
pqfwIconClick (e) {
this.generateMapPopup(e)
@@ -133,6 +157,7 @@
} else if (roleName == "公安管理员" || roleName == "administrator" || roleName == "民警") {
params.jurisdiction = this.userInfo.jurisdiction
}
+ params.profession = this.industryValue.length > 0 ? this.industryValue.join() : ''
getAlldata(params).then(res => {
this.$nextTick(() => {
this.mapRemoveLayer(['pqfwLayer'])
@@ -425,4 +450,10 @@
.ol-popup-closer:after {
content: "✖";
}
+
+.unit-select {
+ position: absolute;
+ top: 10px;
+ right: 20px;
+}
</style>
--
Gitblit v1.9.3