lcw
This commit is contained in:
@ -159,9 +159,9 @@ onMounted(() => {
|
||||
emitter.on("drawShape", (res) => {
|
||||
mapUtil.value.plot(res, resFun);
|
||||
});
|
||||
emitter.on("removeEara", (flag) => {
|
||||
mapUtil.value.removeEara(flag);
|
||||
});
|
||||
// emitter.on("removeEara", (flag) => {
|
||||
// mapUtil.value.removeEara(flag);
|
||||
// });
|
||||
// 回显图形
|
||||
emitter.on("echoPlane", (res) => {
|
||||
mapUtil.value.echoPlane(res);
|
||||
|
||||
@ -1,8 +1,7 @@
|
||||
<template>
|
||||
<div :id="mapid" class="map"></div>
|
||||
<div class="changeMap_box" v-if="props.isShow">
|
||||
<el-switch v-model="conditionRoute" @change="handleSwitch" active-text="打开路况" inactive-text="关闭路况"
|
||||
style="--el-switch-color: #13ce66; --el-switch-off-color: #ff4949" />
|
||||
<!-- <el-switch v-model="conditionRoute" @change="handleSwitch" active-text="打开路况" inactive-text="关闭路况" style="--el-switch-color:#13ce66;--el-switch-off-color:#ff4949;" /> -->
|
||||
<!-- <el-carousel type="card" height="75px" :autoplay="false" indicator-position="none" :initial-index="3" @change="onMapImageChange">
|
||||
<el-carousel-item>
|
||||
<div class="mapImageItem">
|
||||
@ -31,7 +30,8 @@
|
||||
</el-carousel> -->
|
||||
<!-- 地图缩放 -->
|
||||
<div class="zoomTargetBox">
|
||||
<el-input-number :min="7" :max="18" v-model="zoomTarget" :step="1" step-strictly @change="handleZoom"></el-input-number>
|
||||
<el-input-number :min="7" :max="18" v-model="zoomTarget" :step="1" step-strictly @change="handleZoom">
|
||||
</el-input-number>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -44,7 +44,7 @@ import { getItem } from "@/utils/storage";
|
||||
const conditionRoute = ref(true); //路况
|
||||
const mMap = ref(null); //地图对象
|
||||
const mapUtil = ref(null); //地图工具对象
|
||||
const zoomTarget = ref(15);
|
||||
const zoomTarget = ref(6);
|
||||
|
||||
const props = defineProps({
|
||||
mapid: {
|
||||
@ -70,11 +70,12 @@ const props = defineProps({
|
||||
isShowDraw: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
|
||||
});
|
||||
try {
|
||||
const userInfo = getItem("deptId")[0].deptCode;
|
||||
} catch (error) { }
|
||||
} catch (error) {}
|
||||
let map;
|
||||
let mapLayer;
|
||||
let mapLayer1;
|
||||
@ -88,37 +89,66 @@ onMounted(() => {
|
||||
|
||||
map = new EliMap({
|
||||
id: props.mapid,
|
||||
crs: "EPSG:4490",
|
||||
crs: "EPSG:3857",
|
||||
style: {
|
||||
glyphs: "./fonts/{fontstack}/{range}.pbf",
|
||||
center: [94.36057012, 29.64276831],
|
||||
zoom: 15
|
||||
center: [94.36,29.65],
|
||||
zoom: 11
|
||||
},
|
||||
minZoom: 5,
|
||||
minZoom: 7,
|
||||
maxZoom: 18,
|
||||
transformRequest: (url) => {
|
||||
if (url.indexOf("TileMatrix=") != -1) {
|
||||
const arr = url.split("TileMatrix=");
|
||||
const arr1 = arr[1].split("&");
|
||||
const nurl = `${arr[0]}&TileMatrix=${Number(arr1[0])}&${arr1[1]}&${arr1[2]}`;
|
||||
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
window.map = map;
|
||||
map.mapboxGLMap.on("load", () => {
|
||||
map.addWMTSLayer(
|
||||
"/PGIS_S_TileMapServer/Maps/XZDJ_DJ/EzMap"
|
||||
,
|
||||
{
|
||||
Service: "getImage",
|
||||
Type: "RGB",
|
||||
ZoomOffset: "0",
|
||||
V: "0.3",
|
||||
Zoom: "{z}",
|
||||
Row: "{y}",
|
||||
Col: "{x}"
|
||||
},
|
||||
{
|
||||
tileSize: 300
|
||||
}
|
||||
);
|
||||
map.addGaudLayer({
|
||||
url: 'http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}',
|
||||
})
|
||||
zoomTarget.value = map.mapboxGLMap.getZoom();
|
||||
// 地图加载完成后发出事件
|
||||
// emit('mapLoaded')
|
||||
});
|
||||
mapUtil.value = new MapUtil(map);
|
||||
|
||||
// map = new EliMap({
|
||||
// id: props.mapid,
|
||||
// crs: "EPSG:4490",
|
||||
// style: {
|
||||
// glyphs: "./fonts/{fontstack}/{range}.pbf",
|
||||
// center: [94.36057012, 29.64276831],
|
||||
// zoom: 15
|
||||
// },
|
||||
// minZoom: 7,
|
||||
// maxZoom: 18,
|
||||
// });
|
||||
// window.map = map;
|
||||
// map.mapboxGLMap.on("load", () => {
|
||||
// map.addWMTSLayer(
|
||||
// "/PGIS_S_TileMapServer/Maps/XZDJ_SL/EzMap"
|
||||
// ,
|
||||
// {
|
||||
// Service: "getImage",
|
||||
// Type: "RGB",
|
||||
// ZoomOffset: "0",
|
||||
// V: "0.3",
|
||||
// Zoom: "{z}",
|
||||
// Row: "{y}",
|
||||
// Col: "{x}"
|
||||
// },
|
||||
// {
|
||||
// tileSize: 300
|
||||
// }
|
||||
// );
|
||||
// zoomTarget.value = map.mapboxGLMap.getZoom();
|
||||
// });
|
||||
// mapUtil.value = new MapUtil(map);
|
||||
mapUtil.value.Drawplot(); //初始化加载绘制工具
|
||||
|
||||
// 设置地图中心点及图层
|
||||
@ -154,10 +184,6 @@ onMounted(() => {
|
||||
emitter.on("showSquire", (obj) => {
|
||||
mapUtil.value.zdySquire(obj);
|
||||
});
|
||||
// 展示气泡框
|
||||
emitter.on("makerPopup", (obj) => {
|
||||
mapUtil.value.makerPopup(obj);
|
||||
});
|
||||
|
||||
// 绘制图形 - 回显区域
|
||||
emitter.on("drawShape", (res) => {
|
||||
@ -263,6 +289,7 @@ const mapSetLayer = (id, source) => {
|
||||
|
||||
//获取地图绘制的数据
|
||||
const resFun = (coord, type, flag, data) => {
|
||||
|
||||
emitter.emit("coordString", {
|
||||
coord: coord,
|
||||
type: type,
|
||||
@ -276,6 +303,12 @@ const handleZoom = (val) => {
|
||||
map.mapboxGLMap.setZoom(val);
|
||||
};
|
||||
|
||||
emitter.on("map-resize", () => {
|
||||
if (map && map.mapboxGLMap) {
|
||||
map.mapboxGLMap.resize();
|
||||
}
|
||||
});
|
||||
|
||||
// 是否打开或者关闭路况
|
||||
const handleSwitch = (val) => {
|
||||
if (val) {
|
||||
@ -292,7 +325,6 @@ onUnmounted(() => {
|
||||
emitter.off("showPoint");
|
||||
emitter.off("deletePointArea");
|
||||
emitter.off("deletePointAreaOne");
|
||||
emitter.off("makerPopup");
|
||||
emitter.off("drawShape");
|
||||
emitter.off("echoPlane");
|
||||
emitter.off("removeEara");
|
||||
@ -306,6 +338,7 @@ onUnmounted(() => {
|
||||
emitter.off("diffusionCircle");
|
||||
emitter.off("SsCircle");
|
||||
emitter.off("ClearssCircle");
|
||||
emitter.off("map-resize");
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -328,35 +361,29 @@ onUnmounted(() => {
|
||||
right: 398px;
|
||||
bottom: 4px;
|
||||
z-index: 9;
|
||||
|
||||
.mapImageItem {
|
||||
border: 1px solid #08aae8;
|
||||
background: rgb(9, 26, 70);
|
||||
|
||||
&>img {
|
||||
& > img {
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
&>div {
|
||||
& > div {
|
||||
text-align: center;
|
||||
position: relative;
|
||||
top: -3px;
|
||||
}
|
||||
}
|
||||
|
||||
.zoomTargetBox {
|
||||
margin-top: 10px;
|
||||
margin-left: 23px;
|
||||
}
|
||||
|
||||
::v-deep .el-input-number__decrease,
|
||||
::v-deep .el-input-number__increase {
|
||||
background: #133362;
|
||||
color: #fff;
|
||||
border: none;
|
||||
}
|
||||
|
||||
::v-deep .el-input__inner {
|
||||
background: #0c1641;
|
||||
}
|
||||
|
||||
@ -1,7 +1,8 @@
|
||||
<template>
|
||||
<div :id="mapid" class="map"></div>
|
||||
<div class="changeMap_box" v-if="props.isShow">
|
||||
<el-switch v-model="conditionRoute" @change="handleSwitch" active-text="打开路况" inactive-text="关闭路况" style="--el-switch-color:#13ce66;--el-switch-off-color:#ff4949;" />
|
||||
<el-switch v-model="conditionRoute" @change="handleSwitch" active-text="打开路况" inactive-text="关闭路况"
|
||||
style="--el-switch-color: #13ce66; --el-switch-off-color: #ff4949" />
|
||||
<!-- <el-carousel type="card" height="75px" :autoplay="false" indicator-position="none" :initial-index="3" @change="onMapImageChange">
|
||||
<el-carousel-item>
|
||||
<div class="mapImageItem">
|
||||
@ -30,21 +31,20 @@
|
||||
</el-carousel> -->
|
||||
<!-- 地图缩放 -->
|
||||
<div class="zoomTargetBox">
|
||||
<el-input-number :min="7" :max="18" v-model="zoomTarget" :step="1" step-strictly @change="handleZoom">
|
||||
</el-input-number>
|
||||
<el-input-number :min="7" :max="18" v-model="zoomTarget" :step="1" step-strictly @change="handleZoom"></el-input-number>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted, onUnmounted, defineProps, nextTick, computed } from "vue";
|
||||
import { ref, onMounted, onUnmounted, defineProps, nextTick } from "vue";
|
||||
import { MapUtil } from "./mapUtil";
|
||||
import emitter from "@/utils/eventBus.js";
|
||||
import { getItem } from "@/utils/storage";
|
||||
const conditionRoute = ref(true); //路况
|
||||
const mMap = ref(null); //地图对象
|
||||
const mapUtil = ref(null); //地图工具对象
|
||||
const zoomTarget = ref(6);
|
||||
const zoomTarget = ref(15);
|
||||
|
||||
const props = defineProps({
|
||||
mapid: {
|
||||
@ -70,19 +70,11 @@ const props = defineProps({
|
||||
isShowDraw: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
// 地图唯一标识,用于隔离不同地图实例的操作
|
||||
mapKey: {
|
||||
type: String,
|
||||
default: null
|
||||
}
|
||||
});
|
||||
|
||||
// 计算地图唯一标识,如果没有传入则使用mapid
|
||||
const uniqueMapKey = computed(() => props.mapKey || props.mapid);
|
||||
try {
|
||||
const userInfo = getItem("deptId")[0].deptCode;
|
||||
} catch (error) {}
|
||||
} catch (error) { }
|
||||
let map;
|
||||
let mapLayer;
|
||||
let mapLayer1;
|
||||
@ -96,107 +88,76 @@ onMounted(() => {
|
||||
|
||||
map = new EliMap({
|
||||
id: props.mapid,
|
||||
crs: "EPSG:3857",
|
||||
crs: "EPSG:4490",
|
||||
style: {
|
||||
glyphs: "./fonts/{fontstack}/{range}.pbf",
|
||||
center: [94.36,29.65],
|
||||
zoom: 10
|
||||
center: [94.36057012, 29.64276831],
|
||||
zoom: 15
|
||||
},
|
||||
transformRequest: (url) => {
|
||||
if (url.indexOf("TileMatrix=") != -1) {
|
||||
const arr = url.split("TileMatrix=");
|
||||
const arr1 = arr[1].split("&");
|
||||
const nurl = `${arr[0]}&TileMatrix=${Number(arr1[0])}&${arr1[1]}&${arr1[2]}`;
|
||||
|
||||
}
|
||||
}
|
||||
minZoom: 5,
|
||||
maxZoom: 18,
|
||||
});
|
||||
|
||||
// 移除全局挂载,避免不同地图实例冲突
|
||||
// window.map = map;
|
||||
|
||||
// 将地图实例存储在组件内
|
||||
mMap.value = map;
|
||||
|
||||
window.map = map;
|
||||
map.mapboxGLMap.on("load", () => {
|
||||
map.addGaudLayer({
|
||||
url: 'http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}',
|
||||
})
|
||||
map.addWMTSLayer(
|
||||
"/PGIS_S_TileMapServer/Maps/XZDJ_DJ/EzMap"
|
||||
,
|
||||
{
|
||||
Service: "getImage",
|
||||
Type: "RGB",
|
||||
ZoomOffset: "0",
|
||||
V: "0.3",
|
||||
Zoom: "{z}",
|
||||
Row: "{y}",
|
||||
Col: "{x}"
|
||||
},
|
||||
{
|
||||
tileSize: 300
|
||||
}
|
||||
);
|
||||
zoomTarget.value = map.mapboxGLMap.getZoom();
|
||||
// 地图加载完成后发出事件
|
||||
// emit('mapLoaded')
|
||||
});
|
||||
|
||||
mapUtil.value = new MapUtil(map);
|
||||
|
||||
mapUtil.value.Drawplot(); //初始化加载绘制工具
|
||||
|
||||
// 为每个事件添加唯一标识过滤,确保只处理与当前地图实例相关的操作
|
||||
|
||||
// 设置地图中心点及图层
|
||||
emitter.on(`setMapCenter_${uniqueMapKey.value}`, (res) => {
|
||||
mapUtil.value.setMapCenter(res.location, res.zoomLevel);
|
||||
});
|
||||
|
||||
// 也保留原始事件,但添加条件判断
|
||||
emitter.on("setMapCenter", (res) => {
|
||||
// 如果事件包含flag并且与当前地图的唯一标识匹配,或者没有指定flag,则处理
|
||||
if (!res.flag || res.flag === uniqueMapKey.value) {
|
||||
mapUtil.value.setMapCenter(res.location, res.zoomLevel);
|
||||
}
|
||||
mapUtil.value.setMapCenter(res.location, res.zoomLevel);
|
||||
});
|
||||
|
||||
emitter.on("removePlot", (flag) => {
|
||||
mapUtil.value.removePlot(flag);
|
||||
});
|
||||
|
||||
emitter.on("removeAll", (flag) => {
|
||||
mapUtil.value.removeAll(flag);
|
||||
});
|
||||
|
||||
// 撒点
|
||||
emitter.on("addPointArea", (obj) => {
|
||||
// 只处理与当前地图相关的标记点
|
||||
if (!obj.baseFlag || obj.baseFlag === uniqueMapKey.value ||
|
||||
obj.flag && obj.flag.includes(uniqueMapKey.value)) {
|
||||
mapUtil.value.makerSki(obj);
|
||||
}
|
||||
mapUtil.value.makerSki(obj);
|
||||
});
|
||||
|
||||
// 鼠标滑过提示文字的点位
|
||||
emitter.on("showPoint", (obj) => {
|
||||
mapUtil.value.showPoint(obj);
|
||||
});
|
||||
|
||||
// 展示气泡框
|
||||
emitter.on("makerPopup", (obj) => {
|
||||
mapUtil.value.makerPopup(obj);
|
||||
});
|
||||
|
||||
// 清除覆盖物
|
||||
emitter.on("deletePointArea", (res) => {
|
||||
// 只清除与当前地图相关的覆盖物
|
||||
if (typeof res === 'object' && res.baseFlag) {
|
||||
if (res.baseFlag === uniqueMapKey.value) {
|
||||
mapUtil.value.removeElement(res.baseFlag);
|
||||
}
|
||||
} else if (typeof res === 'string') {
|
||||
if (res === uniqueMapKey.value || res.includes(uniqueMapKey.value)) {
|
||||
mapUtil.value.removeElement(res);
|
||||
}
|
||||
}
|
||||
mapUtil.value.removeElement(res);
|
||||
});
|
||||
|
||||
// 清除某个覆盖物的单个
|
||||
emitter.on("deletePointAreaOne", (obj) => {
|
||||
if (obj.flag === uniqueMapKey.value || obj.flag.includes(uniqueMapKey.value)) {
|
||||
mapUtil.value.removeElementOne(obj.flag, obj.id);
|
||||
}
|
||||
mapUtil.value.removeElementOne(obj.flag, obj.id);
|
||||
});
|
||||
|
||||
// 清除某个覆盖物的单个
|
||||
emitter.on("showSquire", (obj) => {
|
||||
mapUtil.value.zdySquire(obj);
|
||||
});
|
||||
// 展示气泡框
|
||||
emitter.on("makerPopup", (obj) => {
|
||||
mapUtil.value.makerPopup(obj);
|
||||
});
|
||||
|
||||
// 绘制图形 - 回显区域
|
||||
emitter.on("drawShape", (res) => {
|
||||
@ -302,7 +263,6 @@ const mapSetLayer = (id, source) => {
|
||||
|
||||
//获取地图绘制的数据
|
||||
const resFun = (coord, type, flag, data) => {
|
||||
|
||||
emitter.emit("coordString", {
|
||||
coord: coord,
|
||||
type: type,
|
||||
@ -330,9 +290,9 @@ onUnmounted(() => {
|
||||
emitter.off("setMapCenter");
|
||||
emitter.off("addPointArea");
|
||||
emitter.off("showPoint");
|
||||
emitter.off("makerPopup");
|
||||
emitter.off("deletePointArea");
|
||||
emitter.off("deletePointAreaOne");
|
||||
emitter.off("makerPopup");
|
||||
emitter.off("drawShape");
|
||||
emitter.off("echoPlane");
|
||||
emitter.off("removeEara");
|
||||
@ -368,29 +328,35 @@ onUnmounted(() => {
|
||||
right: 398px;
|
||||
bottom: 4px;
|
||||
z-index: 9;
|
||||
|
||||
.mapImageItem {
|
||||
border: 1px solid #08aae8;
|
||||
background: rgb(9, 26, 70);
|
||||
& > img {
|
||||
|
||||
&>img {
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
}
|
||||
& > div {
|
||||
|
||||
&>div {
|
||||
text-align: center;
|
||||
position: relative;
|
||||
top: -3px;
|
||||
}
|
||||
}
|
||||
|
||||
.zoomTargetBox {
|
||||
margin-top: 10px;
|
||||
margin-left: 23px;
|
||||
}
|
||||
|
||||
::v-deep .el-input-number__decrease,
|
||||
::v-deep .el-input-number__increase {
|
||||
background: #133362;
|
||||
color: #fff;
|
||||
border: none;
|
||||
}
|
||||
|
||||
::v-deep .el-input__inner {
|
||||
background: #0c1641;
|
||||
}
|
||||
@ -72,7 +72,7 @@ export function MapUtil(map) {
|
||||
*/
|
||||
|
||||
MapUtil.prototype.makerSki = (res) => {
|
||||
let { coords, icon, flag, showTitle, size, offset } = res
|
||||
let { coords, icon, flag, showTitle, size, offset, flash } = res
|
||||
if (!coords) return;
|
||||
if (!_that._self[flag]) _that._self[flag] = []; //存储地图标识的容器
|
||||
if (!_that.idsBox[flag]) _that.idsBox[flag] = []; //存储id的容器
|
||||
@ -81,13 +81,19 @@ export function MapUtil(map) {
|
||||
} else {
|
||||
coords.forEach(item => {
|
||||
let el = document.createElement("img");
|
||||
el.src = item.icon || icon;
|
||||
if (!flash) {
|
||||
el.src = item.icon ? item.icon : icon;
|
||||
} else {
|
||||
el.className = 'blink-animation'
|
||||
}
|
||||
el.style.width = size ? size : "25px";
|
||||
if (flag.includes('jczMap_')) el.style.width = '45px';
|
||||
if (showTitle) _that.makerShowTitle(item, [item.jd, item.wd], flag, '', offset) //展示标题
|
||||
// if (flag == 'hm') _that.makerPopup({data:item,flag:'hm_pop',type:'Custom'}) //展示气泡框
|
||||
|
||||
|
||||
// 确保坐标格式正确,使用对象格式传递坐标
|
||||
const marker = map.Marker(el, { lng: item.jd, lat: item.wd }, { anchor: 'bottom', offset: [0, 0] })
|
||||
const marker = map.Marker(el, { lng: item.jd, lat: item.wd }, { anchor: 'bottom', offset: offset ? offset : [0, 0] })
|
||||
el.addEventListener("click", () => {
|
||||
_that.openInfoDetail(flag, item) //点击打开详情
|
||||
})
|
||||
@ -321,7 +327,9 @@ export function MapUtil(map) {
|
||||
MapUtil.prototype.diffusionCircle = (obj) => {
|
||||
let { coords, flag, isClear } = obj
|
||||
if (!_that._self[flag]) _that._self[flag] = {}
|
||||
if (isClear) _that._self[flag].destroy() //destroy销毁,show(false) 移除
|
||||
if (isClear && _that._self[flag] && typeof _that._self[flag].destroy === 'function') {
|
||||
_that._self[flag].destroy() //destroy销毁,show(false) 移除
|
||||
}
|
||||
let data = [{ position: coords }]
|
||||
_that._self[flag] = map.DiffuseCircle(data, {
|
||||
radius: 10,
|
||||
@ -412,8 +420,11 @@ export function MapUtil(map) {
|
||||
for (let i = 0; i < list.length; i++) {
|
||||
const el = list[i];
|
||||
console.log(el, 'el');
|
||||
if (el && typeof el == 'object') el.destroy() //destory()销毁 , show(false) false:隐藏 true :展示
|
||||
else _that.removePlot(key)
|
||||
if (el && typeof el === 'object' && typeof el.destroy === 'function') {
|
||||
el.destroy() //destory()销毁 , show(false) false:隐藏 true :展示
|
||||
} else {
|
||||
_that.removePlot(key)
|
||||
}
|
||||
}
|
||||
_that._self[key] = [];
|
||||
}
|
||||
@ -430,7 +441,11 @@ export function MapUtil(map) {
|
||||
for (let key in _that._self.gpsZb) {
|
||||
let item = _that._self.gpsZb[key]
|
||||
if (item && item.length > 0) {
|
||||
for (let child in item) { item[child].destroy() }
|
||||
for (let child in item) {
|
||||
if (item[child] && typeof item[child].destroy === 'function') {
|
||||
item[child].destroy()
|
||||
}
|
||||
}
|
||||
_that._self.gpsZb[key] = []
|
||||
}
|
||||
}
|
||||
@ -442,7 +457,9 @@ export function MapUtil(map) {
|
||||
if (layer !== 'gpsZb') {
|
||||
for (let i = 0; i < _that._self[layer].length; i++) {
|
||||
const el = _that._self[layer][i];
|
||||
el.destroy()//destory()销毁 , show(false) false:隐藏 true :展示
|
||||
if (el && typeof el.destroy === 'function') {
|
||||
el.destroy()//destory()销毁 , show(false) false:隐藏 true :展示
|
||||
}
|
||||
}
|
||||
_that._self[layer] = [];
|
||||
|
||||
@ -452,7 +469,9 @@ export function MapUtil(map) {
|
||||
if (!_that._self[flagT]) return false;
|
||||
for (let i = 0; i < _that._self[flagT].length; i++) {
|
||||
const el = _that._self[flagT][i];
|
||||
el.destroy()//destory()销毁 , show(false) false:隐藏 true :展示
|
||||
if (el && typeof el.destroy === 'function') {
|
||||
el.destroy()//destory()销毁 , show(false) false:隐藏 true :展示
|
||||
}
|
||||
}
|
||||
_that._self[flagT] = []
|
||||
}
|
||||
@ -467,11 +486,15 @@ export function MapUtil(map) {
|
||||
list.forEach((el, index) => {
|
||||
if (el == id) {
|
||||
_that.idsBox[layer].splice(index, 1);
|
||||
if (_that._self[layer][index]) _that._self[layer][index].destroy()
|
||||
if (_that._self[layer][index] && typeof _that._self[layer][index].destroy === 'function') {
|
||||
_that._self[layer][index].destroy()
|
||||
}
|
||||
_that._self[layer].splice(index, 1)
|
||||
if (layer == 'rx') {
|
||||
let flagT = layer + 'rxTitle';
|
||||
if (_that._self[flagT][index]) _that._self[flagT][index].destroy()
|
||||
if (_that._self[flagT][index] && typeof _that._self[flagT][index].destroy === 'function') {
|
||||
_that._self[flagT][index].destroy()
|
||||
}
|
||||
_that._self[flagT].splice(index, 1)
|
||||
_that.removeGpsZbOverlayById(id) //删除图标
|
||||
}
|
||||
@ -485,7 +508,11 @@ export function MapUtil(map) {
|
||||
try {
|
||||
let info = _that._self.gpsZb[id]
|
||||
if (info) {
|
||||
info.forEach(element => { element.destroy() });
|
||||
info.forEach(element => {
|
||||
if (element && typeof element.destroy === 'function') {
|
||||
element.destroy()
|
||||
}
|
||||
});
|
||||
delete _that._self.gpsZb[id]
|
||||
}
|
||||
} catch (err) { }
|
||||
@ -759,7 +786,7 @@ export function MapUtil(map) {
|
||||
|
||||
// 移除轨迹
|
||||
MapUtil.prototype.removeTrajectory = (flag) => {
|
||||
if (_that._self[flag]) {
|
||||
if (_that._self[flag] && typeof _that._self[flag].destroy === 'function') {
|
||||
_that._self[flag].destroy();
|
||||
_that._self[flag] = null
|
||||
}
|
||||
@ -848,7 +875,7 @@ export function MapUtil(map) {
|
||||
// 移除边界
|
||||
MapUtil.prototype.removeBj = (res) => {
|
||||
// 移除单个polygonGeo(为了向后兼容)
|
||||
if (_that.polygonGeo) {
|
||||
if (_that.polygonGeo && typeof _that.polygonGeo.destroy === 'function') {
|
||||
_that.polygonGeo.destroy();
|
||||
_that.polygonGeo = null;
|
||||
}
|
||||
@ -856,7 +883,9 @@ export function MapUtil(map) {
|
||||
// 移除所有添加到boundaryList中的多边形
|
||||
if (_that.boundaryList && _that.boundaryList.length > 0) {
|
||||
_that.boundaryList.forEach(polygon => {
|
||||
polygon.destroy();
|
||||
if (polygon && typeof polygon.destroy === 'function') {
|
||||
polygon.destroy();
|
||||
}
|
||||
});
|
||||
_that.boundaryList = [];
|
||||
}
|
||||
@ -882,6 +911,12 @@ export function MapUtil(map) {
|
||||
case 'yj':
|
||||
emitter.emit('yjShow', data);
|
||||
break;
|
||||
case 'jq':
|
||||
emitter.emit('showJqXq', data);
|
||||
break;
|
||||
case 'sj':
|
||||
emitter.emit('showZdsjXq', data);
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,18 +1,8 @@
|
||||
<template>
|
||||
<div class="form-item-box" :style="{ width: width }">
|
||||
<el-cascader
|
||||
style="width: 100%"
|
||||
class="el-cascader-zj"
|
||||
:show-all-levels="false"
|
||||
clearable
|
||||
filterable
|
||||
:disabled="props.disabled"
|
||||
:placeholder="modelValue ? placeholder : '请选择部门'"
|
||||
:options="tableData"
|
||||
v-model="oldmodelValue"
|
||||
@change="handleChange"
|
||||
:props="endProps"
|
||||
/>
|
||||
<el-cascader style="width: 100%" class="el-cascader-zj" :show-all-levels="false" clearable filterable
|
||||
:disabled="props.disabled" :placeholder="modelValue ? placeholder : '请选择部门'" :options="tableData"
|
||||
v-model="oldmodelValue" @change="handleChange" :props="endProps" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -41,14 +31,14 @@ const props = defineProps({
|
||||
default: []
|
||||
},
|
||||
width: {
|
||||
default: COMPONENT_WIDTH,
|
||||
default: '',
|
||||
type: String
|
||||
},
|
||||
isAll:{
|
||||
isAll: {
|
||||
default: false,
|
||||
type: Boolean
|
||||
},
|
||||
disabled:{
|
||||
disabled: {
|
||||
default: false,
|
||||
type: Boolean
|
||||
},
|
||||
@ -72,7 +62,7 @@ const endProps = {
|
||||
lazyLoad(node, resolve) {
|
||||
listQuery.value.parentid = node.data.id;
|
||||
let params = { ...listQuery.value };
|
||||
if(props.isAll && firstLoad.value) {
|
||||
if (props.isAll && firstLoad.value) {
|
||||
params.parentid = 1;
|
||||
firstLoad.value = false;
|
||||
}
|
||||
@ -89,7 +79,7 @@ const endProps = {
|
||||
const tableData = ref([]);
|
||||
const getSysMenuTree = async () => {
|
||||
let params = { ...listQuery.value }
|
||||
if(props.isAll) params.parentid = 1;
|
||||
if (props.isAll) params.parentid = 1;
|
||||
const res = await selectDeptPage(params);
|
||||
tableData.value = res;
|
||||
depList.value = res
|
||||
@ -101,29 +91,29 @@ onMounted(() => {
|
||||
watch(
|
||||
() => props.modelValue,
|
||||
(val) => {
|
||||
console.log(val,'val');
|
||||
console.log(val, 'val');
|
||||
oldmodelValue.value = val;
|
||||
},
|
||||
{ deep: true, immediate: true }
|
||||
);
|
||||
const emits = defineEmits(["update:modelValue",'getDepValue']);
|
||||
const emits = defineEmits(["update:modelValue", 'getDepValue']);
|
||||
const handleChange = (e) => {
|
||||
if (props.multiple === true) {
|
||||
const data = e.map((item) => {return item[item.length - 1];});
|
||||
const data = e.map((item) => { return item[item.length - 1]; });
|
||||
emits("update:modelValue", data);
|
||||
const obj= data.map(items=>{
|
||||
const obj = data.map(items => {
|
||||
return {
|
||||
... depList.value.find(item=>{ return item.orgCode == items})
|
||||
...depList.value.find(item => { return item.orgCode == items })
|
||||
}
|
||||
})
|
||||
console.log(obj);
|
||||
|
||||
|
||||
emits("getDepValue", obj);
|
||||
|
||||
|
||||
} else {
|
||||
const data = e ? e[e.length - 1] : "";
|
||||
emits("update:modelValue", data);
|
||||
let obj = depList.value.find(item=>{ return item.orgCode == data})
|
||||
let obj = depList.value.find(item => { return item.orgCode == data })
|
||||
emits("getDepValue", obj);
|
||||
}
|
||||
};
|
||||
|
||||
@ -173,7 +173,8 @@ const props = defineProps({
|
||||
const emit = defineEmits([
|
||||
"chooseData",
|
||||
"rowdbClickHland",
|
||||
"rowcontextmenuHland"
|
||||
"rowcontextmenuHland",
|
||||
"changePage"
|
||||
]);
|
||||
const multipleTableRef = ref();
|
||||
const currentRow = ref();
|
||||
|
||||
@ -31,7 +31,7 @@
|
||||
</el-radio-group>
|
||||
|
||||
<!-- 时间选择 -->
|
||||
<el-time-picker v-else-if="item.type == 'time'" v-model="listQuery[item.prop]" placeholder="选择时间" style="width: 100%" :disabled="item.disabled" />
|
||||
<el-time-picker v-else-if="item.type == 'time'" v-model="listQuery[item.prop]" placeholder="选择时间" style="width: 100%" :disabled="item.disabled" value-format="HH:mm:ss"/>
|
||||
<el-date-picker v-else-if="item.type == 'date'" v-model="listQuery[item.prop]" type="date" value-format="YYYY-MM-DD" placeholder="请选择日期" style="width: 100%" :disabled="item.disabled" />
|
||||
<el-date-picker v-else-if="item.type == 'datetime'" v-model="listQuery[item.prop]" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择时间" style="width: 100%" :disabled="item.disabled" />
|
||||
<el-date-picker v-else-if="item.type == 'datetimerange'" v-model="listQuery[item.prop]" type="datetimerange" :shortcuts="shortcuts" range-separator="To" value-format="YYYY-MM-DD HH:mm:ss" start-placeholder="选择开始时间" end-placeholder="选择结束时间" style="width: 100%" :disabled="item.disabled" />
|
||||
|
||||
Reference in New Issue
Block a user