zy_oyj/sgxt_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

lcw

Browse Source
This commit is contained in:
lcw
2025-10-26 12:25:50 +08:00
parent 5e18952b55
commit ea3022c3f6
617 changed files with 86322 additions and 185615 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/ChooseList/ChooseCl/index.vue
View File

@ -1,5 +1,5 @@
<template>
<el-dialog width="1400px" :model-value="modelValue" append-to-body @close="closed">
<el-dialog width="1400px" :model-value="props.modelValue" append-to-body @close="closed">
<template #title>
<span class="mr10 f16">选择布控车辆</span>
<el-button type="primary" size="small" @click="zdyaddPerson">添加其他车辆</el-button>

156
src/components/ChooseList/ChooseGzy/index.vue Normal file
View File

@ -0,0 +1,156 @@
<template>
<el-dialog v-model="props.modelValue" width="60%" custom-class="container" @close="close" :title="title" align-center>
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"
@chooseData="chooseData" >
<template #sblx="{ row }">
<dict-tag :options="D_BZ_SBLX" :value="row.sblx" :tag="false" />
</template>
<template #sblxdm="{ row }">
<dict-tag :options="D_BZ_GZSBLX" :value="row.sblxdm" :tag="false" />
</template>
</MyTable>
<div class="footInfoBtn flex just-between align-center">
<Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="550"
:pageConfiger="{...pageData.pageConfiger,
total: pageData.total}" />
<el-button type="primary" @click="submitDate">确定选择</el-button>
</div>
</el-dialog>
</template>
<script setup>
import { reactive, ref,watch,getCurrentInstance } from 'vue'
import MyTable from '@/components/aboutTable/MyTable.vue'
import Pages from "@/components/aboutTable/Pages.vue";
import { ysSxtgetPageList } from "@/api/yszx";
const { proxy } = getCurrentInstance();
const { D_BZ_SBLX,D_BZ_GZSBLX } = proxy.$dict(
"D_BZ_SBLX",
"D_BZ_GZSBLX"
);
const props = defineProps({
modelValue: {
type: Boolean,
default: false,
},
title: {
type: String,
default: '选择感知源'
},roleIds:{
type: Array,
default: () => [],
}
})
const emit = defineEmits(["update:modelValue", "choose"])
const dataLsit= ref();
const pageData = reactive({
tableData: [], //表格数据
keyCount: 0,
tableHeight: 500,
tableConfiger: {
rowHeight: 61,
showSelectType: "checkBox",
loading: false,
haveControls: false,
rowKey: "id", // 设置行的唯一标识为id
defaultSelectKeys: [] // 用于存储默认选中的ID
},
total: 0,
pageConfiger: {
pageSize: 20,
pageCurrent: 1
}, //分页
controlsWidth: 180, //操作栏宽度
tableColumn: [
{ label: "所属部门", prop: "ssbm", showOverflowTooltip: true },
{ label: "设备名称", prop: "sbmc", showOverflowTooltip: true },
{ label: "设备编码", prop: "sbbh", showOverflowTooltip: true },
{ label: "厂商名称", prop: "csmc", showOverflowTooltip: true },
{ label: "地址", prop: "dzmc", showOverflowTooltip: true },
{ label: "感知源类型", prop: "sblx", showOverflowTooltip: true, showSolt: true, },
{ label: "摄像机类型", prop: "sblxdm", showOverflowTooltip: true,showSolt: true, },
]
})
// 监听roleIds变化，更新默认选中的ID
watch(() => props.roleIds, (newVal) => {
if (newVal && newVal.length > 0) {
pageData.tableConfiger.defaultSelectKeys = [...newVal];
// 如果表格数据已加载，根据选中的ID设置dataLsit
if (pageData.tableData.length > 0) {
dataLsit.value = pageData.tableData.filter(item => newVal.includes(item.id));
}
} else {
pageData.tableConfiger.defaultSelectKeys = [];
}
}, { immediate: true })
// 监听表格数据变化，当数据加载后，根据默认选中的ID设置dataLsit
watch(() => pageData.tableData, (newVal) => {
if (newVal && newVal.length > 0 && props.roleIds.length > 0) {
dataLsit.value = newVal.filter(item => props.roleIds.includes(item.id));
}
})
const getList = () => {
pageData.tableConfiger.loading = true;
const promes={
// ssbm: propsGzyList.ssbm,
pageSize: pageData.pageConfiger.pageSize,
pageCurrent: pageData.pageConfiger.pageCurrent,
}
ysSxtgetPageList(promes).then((res) => {
pageData.tableData = res.records || []
pageData.total = res.total || 0
// 数据加载完成后，更新key以触发表格重新渲染，确保选中状态正确显示
pageData.keyCount++;
}).finally(() => {
pageData.tableConfiger.loading = false;
})
}
// 监听对话框显示状态变化
watch(() => props.modelValue, (newVal) => {
if (newVal) {
// 每次打开对话框时，重新获取数据
getList();
} else {
// 关闭对话框时清空选中数据
dataLsit.value = null;
}
})
const changeNo = (val) => {
pageData.pageConfiger.pageCurrent=val
getList()
}
const changeSize = (val) => {
pageData.pageConfiger.pageSize=val
getList()
}
const chooseData = (val) => {
dataLsit.value = val;
}
const close = () => {
emit("update:modelValue", false);
}
const submitDate = () => {
emit("choose", dataLsit.value);
close()
}
</script>
<style lang="scss" scoped>
.container {
color: #000000;
}
</style>

395
src/components/GdMap/index copy 2.vue Normal file
View File

@ -0,0 +1,395 @@
<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-carousel type="card" height="75px" :autoplay="false" indicator-position="none" :initial-index="3" @change="onMapImageChange">
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/slt.jpg')" alt="" />
<div>栅格浅色</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/yxt.jpg')" alt="" />
<div>影像图</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/yst.jpg')" alt="" />
<div>栅格深色</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/shy.png')" alt="" />
<div>三合一</div>
</div>
</el-carousel-item>
</el-carousel> -->
<!-- 地图缩放 -->
<div class="zoomTargetBox">
<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 { 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 props = defineProps({
mapid: {
type: String,
default: "mapDiv"
},
//是否显示可以切换地图底图
isShow: {
type: Boolean,
default: false
},
//是否显示实时路况
isShowMvt: {
type: Boolean,
default: false
},
//是否显示地图层级
isShowZoom: {
type: Boolean,
default: false
},
//是否显示绘制控件
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) {}
let map;
let mapLayer;
let mapLayer1;
onMounted(() => {
emitter.on("followUp", (res) => {
let box = document.getElementsByClassName("changeMap_box");
if (!box) return;
box[0].style.right = !res ? "4px" : "398px";
box[0].style.transition = "0.5s";
});
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;
// 将地图实例存储在组件内
mMap.value = 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
}
);
zoomTarget.value = map.mapboxGLMap.getZoom();
});
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);
}
});
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);
}
});
// 鼠标滑过提示文字的点位
emitter.on("showPoint", (obj) => {
mapUtil.value.showPoint(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);
}
}
});
// 清除某个覆盖物的单个
emitter.on("deletePointAreaOne", (obj) => {
if (obj.flag === uniqueMapKey.value || obj.flag.includes(uniqueMapKey.value)) {
mapUtil.value.removeElementOne(obj.flag, obj.id);
}
});
// 清除某个覆盖物的单个
emitter.on("showSquire", (obj) => {
mapUtil.value.zdySquire(obj);
});
// 绘制图形 - 回显区域
emitter.on("drawShape", (res) => {
mapUtil.value.plot(res, resFun);
});
emitter.on("removeEara", (flag) => {
mapUtil.value.removeEara(flag);
});
// 回显图形
emitter.on("echoPlane", (res) => {
mapUtil.value.echoPlane(res);
});
//移除绘制区域
emitter.on("removeEara", (flag) => {
mapUtil.value.removeEara(flag);
});
// 回显线
emitter.on("echoLine", (res) => {
mapUtil.value.createLine(res, res.flag);
});
//创建边界面（geojson）
emitter.on("setBoundarys", (res) => {
mapUtil.value.createBoundarys(res);
});
// 移除边界
emitter.on("removeBj", (res) => {
mapUtil.value.removeBj(res);
});
// 轨迹回放
emitter.on("drawLineAnimation", (res) => {
mapUtil.value.displayLineAnimation(res);
});
// 聚合撒点
emitter.on("addPoint", (obj) => {
mapUtil.value.aggregateScatteringPoint(obj);
});
// 热力图显示
emitter.on("thermodynamicChart", (res) => {
mapUtil.value.showHeatDrawing(res);
});
// 扩散圆
emitter.on("diffusionCircle", (res) => {
mapUtil.value.diffusionCircle(res);
});
// 展示盘曲
emitter.on("showGapText", (obj) => {
mapUtil.value.gapText(obj);
});
// 获取当前地图中心点
emitter.on("getCurrentCenter", (res) => {
let centerPoint = map.mapboxGLMap.getCenter();
let coords = [centerPoint.lng, centerPoint.lat];
emitter.emit("getcentercoord", coords);
});
});
//切换地图底图
const onMapImageChange = (val) => {
//清除已经存在胡地图图层
if (map.mapboxGLMap.getLayer("SGQS_ID"))
map.mapboxGLMap.removeLayer("SGQS_ID");
if (map.mapboxGLMap.getLayer("YX_ID")) map.mapboxGLMap.removeLayer("YX_ID");
if (map.mapboxGLMap.getLayer("SGSG_ID"))
map.mapboxGLMap.removeLayer("SGSG_ID");
if (map.mapboxGLMap.getLayer("TDT_TITLE_ID"))
map.mapboxGLMap.removeLayer("TDT_TITLE_ID");
if (map.mapboxGLMap.getLayer("TDT_ROAD_ID"))
map.mapboxGLMap.removeLayer("TDT_ROAD_ID");
if (map.mapboxGLMap.getLayer("TDT_POI_ID"))
map.mapboxGLMap.removeLayer("TDT_POI_ID");
//设置图层
switch (val) {
case 0:
mapSetLayer("SGQS_ID", "SGQS");
break;
case 1:
mapSetLayer("YX_ID", "YX");
break;
case 2:
mapSetLayer("SGSG_ID", "SGSG");
break;
case 3:
mapSetLayer("TDT_TITLE_ID", "TDT_TITLE_SOURCES");
mapSetLayer("TDT_ROAD_ID", "TDT_ROAD_SOURCES");
mapSetLayer("TDT_POI_ID", "TDT_POI_SOURCES");
break;
}
if (map.mapboxGLMap.getLayer("realTimeTrafficlevelOne"))
map.mapboxGLMap.moveLayer("realTimeTrafficlevelOne");
if (map.mapboxGLMap.getLayer("map_id")) map.mapboxGLMap.moveLayer("map_id");
if (map.mapboxGLMap.getLayer("map_ids")) map.mapboxGLMap.moveLayer("map_ids");
};
//设置图层函数
const mapSetLayer = (id, source) => {
map.mapboxGLMap.addLayer({ id, type: "raster", source });
};
//获取地图绘制的数据
const resFun = (coord, type, flag, data) => {
emitter.emit("coordString", {
coord: coord,
type: type,
flag: flag,
data: data
});
};
// 地图层级
const handleZoom = (val) => {
map.mapboxGLMap.setZoom(val);
};
// 是否打开或者关闭路况
const handleSwitch = (val) => {
if (val) {
// 打开
} else {
// 关闭
}
};
onUnmounted(() => {
emitter.off("removePlot");
emitter.off("setMapCenter");
emitter.off("addPointArea");
emitter.off("showPoint");
emitter.off("deletePointArea");
emitter.off("deletePointAreaOne");
emitter.off("drawShape");
emitter.off("echoPlane");
emitter.off("removeEara");
emitter.off("echoLine");
emitter.off("addPoint");
emitter.off("thermodynamicChart");
emitter.off("drawLineAnimation");
emitter.off("aggregateScatteringPoint");
emitter.off("hotmap");
emitter.off("setBoundarys");
emitter.off("diffusionCircle");
emitter.off("SsCircle");
emitter.off("ClearssCircle");
});
</script>
<style lang="scss" scoped>
.map {
width: 100%;
height: 100%;
background-color: aliceblue;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
margin: auto;
z-index: 1;
}
.changeMap_box {
position: absolute;
right: 398px;
bottom: 4px;
z-index: 9;
.mapImageItem {
border: 1px solid #08aae8;
background: rgb(9, 26, 70);
& > img {
width: 100%;
height: 50px;
}
& > 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;
}
}
</style>

359
src/components/GdMap/index copy.vue Normal file
View File

@ -0,0 +1,359 @@
<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-carousel type="card" height="75px" :autoplay="false" indicator-position="none" :initial-index="3" @change="onMapImageChange">
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/slt.jpg')" alt="" />
<div>栅格浅色</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/yxt.jpg')" alt="" />
<div>影像图</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/yst.jpg')" alt="" />
<div>栅格深色</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/shy.png')" alt="" />
<div>三合一</div>
</div>
</el-carousel-item>
</el-carousel> -->
<!-- 地图缩放 -->
<div class="zoomTargetBox">
<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 } 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 props = defineProps({
mapid: {
type: String,
default: "mapDiv"
},
//是否显示可以切换地图底图
isShow: {
type: Boolean,
default: false
},
//是否显示实时路况
isShowMvt: {
type: Boolean,
default: false
},
//是否显示地图层级
isShowZoom: {
type: Boolean,
default: false
},
//是否显示绘制控件
isShowDraw: {
type: Boolean,
default: false
}
});
try {
const userInfo = getItem("deptId")[0].deptCode;
} catch (error) { }
let map;
let mapLayer;
let mapLayer1;
onMounted(() => {
emitter.on("followUp", (res) => {
let box = document.getElementsByClassName("changeMap_box");
if (!box) return;
box[0].style.right = !res ? "4px" : "398px";
box[0].style.transition = "0.5s";
});
map = new EliMap({
id: props.mapid,
crs: "EPSG:4490",
style: {
glyphs: "./fonts/{fontstack}/{range}.pbf",
center: [94.36057012, 29.64276831],
zoom: 15
},
minZoom: 5,
maxZoom: 18,
});
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
}
);
zoomTarget.value = map.mapboxGLMap.getZoom();
});
mapUtil.value = new MapUtil(map);
mapUtil.value.Drawplot(); //初始化加载绘制工具
// 设置地图中心点及图层
emitter.on("setMapCenter", (res) => {
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) => {
mapUtil.value.makerSki(obj);
});
// 鼠标滑过提示文字的点位
emitter.on("showPoint", (obj) => {
mapUtil.value.showPoint(obj);
});
// 清除覆盖物
emitter.on("deletePointArea", (res) => {
mapUtil.value.removeElement(res);
});
// 清除某个覆盖物的单个
emitter.on("deletePointAreaOne", (obj) => {
mapUtil.value.removeElementOne(obj.flag, obj.id);
});
// 清除某个覆盖物的单个
emitter.on("showSquire", (obj) => {
mapUtil.value.zdySquire(obj);
});
// 绘制图形 - 回显区域
emitter.on("drawShape", (res) => {
mapUtil.value.plot(res, resFun);
});
emitter.on("removeEara", (flag) => {
mapUtil.value.removeEara(flag);
});
// 回显图形
emitter.on("echoPlane", (res) => {
mapUtil.value.echoPlane(res);
});
//移除绘制区域
emitter.on("removeEara", (flag) => {
mapUtil.value.removeEara(flag);
});
// 回显线
emitter.on("echoLine", (res) => {
mapUtil.value.createLine(res, res.flag);
});
//创建边界面（geojson）
emitter.on("setBoundarys", (res) => {
mapUtil.value.createBoundarys(res);
});
// 移除边界
emitter.on("removeBj", (res) => {
mapUtil.value.removeBj(res);
});
// 轨迹回放
emitter.on("drawLineAnimation", (res) => {
mapUtil.value.displayLineAnimation(res);
});
// 聚合撒点
emitter.on("addPoint", (obj) => {
mapUtil.value.aggregateScatteringPoint(obj);
});
// 热力图显示
emitter.on("thermodynamicChart", (res) => {
mapUtil.value.showHeatDrawing(res);
});
// 扩散圆
emitter.on("diffusionCircle", (res) => {
mapUtil.value.diffusionCircle(res);
});
// 展示盘曲
emitter.on("showGapText", (obj) => {
mapUtil.value.gapText(obj);
});
// 获取当前地图中心点
emitter.on("getCurrentCenter", (res) => {
let centerPoint = map.mapboxGLMap.getCenter();
let coords = [centerPoint.lng, centerPoint.lat];
emitter.emit("getcentercoord", coords);
});
});
//切换地图底图
const onMapImageChange = (val) => {
//清除已经存在胡地图图层
if (map.mapboxGLMap.getLayer("SGQS_ID"))
map.mapboxGLMap.removeLayer("SGQS_ID");
if (map.mapboxGLMap.getLayer("YX_ID")) map.mapboxGLMap.removeLayer("YX_ID");
if (map.mapboxGLMap.getLayer("SGSG_ID"))
map.mapboxGLMap.removeLayer("SGSG_ID");
if (map.mapboxGLMap.getLayer("TDT_TITLE_ID"))
map.mapboxGLMap.removeLayer("TDT_TITLE_ID");
if (map.mapboxGLMap.getLayer("TDT_ROAD_ID"))
map.mapboxGLMap.removeLayer("TDT_ROAD_ID");
if (map.mapboxGLMap.getLayer("TDT_POI_ID"))
map.mapboxGLMap.removeLayer("TDT_POI_ID");
//设置图层
switch (val) {
case 0:
mapSetLayer("SGQS_ID", "SGQS");
break;
case 1:
mapSetLayer("YX_ID", "YX");
break;
case 2:
mapSetLayer("SGSG_ID", "SGSG");
break;
case 3:
mapSetLayer("TDT_TITLE_ID", "TDT_TITLE_SOURCES");
mapSetLayer("TDT_ROAD_ID", "TDT_ROAD_SOURCES");
mapSetLayer("TDT_POI_ID", "TDT_POI_SOURCES");
break;
}
if (map.mapboxGLMap.getLayer("realTimeTrafficlevelOne"))
map.mapboxGLMap.moveLayer("realTimeTrafficlevelOne");
if (map.mapboxGLMap.getLayer("map_id")) map.mapboxGLMap.moveLayer("map_id");
if (map.mapboxGLMap.getLayer("map_ids")) map.mapboxGLMap.moveLayer("map_ids");
};
//设置图层函数
const mapSetLayer = (id, source) => {
map.mapboxGLMap.addLayer({ id, type: "raster", source });
};
//获取地图绘制的数据
const resFun = (coord, type, flag, data) => {
emitter.emit("coordString", {
coord: coord,
type: type,
flag: flag,
data: data
});
};
// 地图层级
const handleZoom = (val) => {
map.mapboxGLMap.setZoom(val);
};
// 是否打开或者关闭路况
const handleSwitch = (val) => {
if (val) {
// 打开
} else {
// 关闭
}
};
onUnmounted(() => {
emitter.off("removePlot");
emitter.off("setMapCenter");
emitter.off("addPointArea");
emitter.off("showPoint");
emitter.off("deletePointArea");
emitter.off("deletePointAreaOne");
emitter.off("drawShape");
emitter.off("echoPlane");
emitter.off("removeEara");
emitter.off("echoLine");
emitter.off("addPoint");
emitter.off("thermodynamicChart");
emitter.off("drawLineAnimation");
emitter.off("aggregateScatteringPoint");
emitter.off("hotmap");
emitter.off("setBoundarys");
emitter.off("diffusionCircle");
emitter.off("SsCircle");
emitter.off("ClearssCircle");
});
</script>
<style lang="scss" scoped>
.map {
width: 100%;
height: 100%;
background-color: aliceblue;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
margin: auto;
z-index: 1;
}
.changeMap_box {
position: absolute;
right: 398px;
bottom: 4px;
z-index: 9;
.mapImageItem {
border: 1px solid #08aae8;
background: rgb(9, 26, 70);
&>img {
width: 100%;
height: 50px;
}
&>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;
}
}
</style>

2
src/components/GdMap/index.vue
View File

@ -94,7 +94,7 @@ onMounted(() => {
center: [94.36057012, 29.64276831],
zoom: 15
},
minZoom: 7,
minZoom: 5,
maxZoom: 18,
});
window.map = map;

87
src/components/GdMap/indexww.vue
View File

@ -37,7 +37,7 @@
</template>
<script setup>
import { ref, onMounted, onUnmounted, defineProps, nextTick } from "vue";
import { ref, onMounted, onUnmounted, defineProps, nextTick, computed } from "vue";
import { MapUtil } from "./mapUtil";
import emitter from "@/utils/eventBus.js";
import { getItem } from "@/utils/storage";
@ -70,8 +70,16 @@ 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) {}
@ -104,7 +112,12 @@ onMounted(() => {
}
});
window.map = map;
// 移除全局挂载，避免不同地图实例冲突
// window.map = map;
// 将地图实例存储在组件内
mMap.value = 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}',
@ -113,56 +126,42 @@ onMounted(() => {
// 地图加载完成后发出事件
// 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(); //初始化加载绘制工具
// 为每个事件添加唯一标识过滤，确保只处理与当前地图实例相关的操作
// 设置地图中心点及图层
emitter.on("setMapCenter", (res) => {
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);
}
});
emitter.on("removePlot", (flag) => {
mapUtil.value.removePlot(flag);
});
emitter.on("removeAll", (flag) => {
mapUtil.value.removeAll(flag);
});
// 撒点
emitter.on("addPointArea", (obj) => {
mapUtil.value.makerSki(obj);
// 只处理与当前地图相关的标记点
if (!obj.baseFlag || obj.baseFlag === uniqueMapKey.value ||
obj.flag && obj.flag.includes(uniqueMapKey.value)) {
mapUtil.value.makerSki(obj);
}
});
// 鼠标滑过提示文字的点位
emitter.on("showPoint", (obj) => {
mapUtil.value.showPoint(obj);
@ -170,11 +169,23 @@ onMounted(() => {
// 清除覆盖物
emitter.on("deletePointArea", (res) => {
mapUtil.value.removeElement(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);
}
}
});
// 清除某个覆盖物的单个
emitter.on("deletePointAreaOne", (obj) => {
mapUtil.value.removeElementOne(obj.flag, obj.id);
if (obj.flag === uniqueMapKey.value || obj.flag.includes(uniqueMapKey.value)) {
mapUtil.value.removeElementOne(obj.flag, obj.id);
}
});
// 清除某个覆盖物的单个

123
src/components/GdMap/mapUtil.js
View File

@ -71,7 +71,7 @@ export function MapUtil(map) {
*/
MapUtil.prototype.makerSki = (res) => {
let { coords, icon, flag, showTitle } = res
let { coords, icon, flag, showTitle, size, offset } = res
if (!coords) return;
if (!_that._self[flag]) _that._self[flag] = []; //存储地图标识的容器
if (!_that.idsBox[flag]) _that.idsBox[flag] = []; //存储id的容器
@ -81,9 +81,9 @@ export function MapUtil(map) {
coords.forEach(item => {
let el = document.createElement("img");
el.src = item.icon || icon;
el.style.width = flag == 'kfd' ? '32px' : "25px";
el.style.width = size ? size : "25px";
if (flag.includes('jczMap_')) el.style.width = '45px';
if (showTitle) _that.makerShowTitle(item, [item.jd, item.wd], flag) //展示标题
if (showTitle) _that.makerShowTitle(item, [item.jd, item.wd], flag, '', offset) //展示标题
const marker = map.Marker(el, [item.jd, item.wd], { anchor: 'bottom', offset: [0, 0] })
el.addEventListener("click", () => {
_that.openInfoDetail(flag, item) //点击打开详情
@ -141,7 +141,8 @@ export function MapUtil(map) {
}
// 信息框展示
MapUtil.prototype.makerShowTitle = (item, points, flag, text) => {
MapUtil.prototype.makerShowTitle = (item, points, flag, text, offset) => {
let T = flag == 'rx' ? 'rxTitle' : 'Title'
let flagT = flag + T;
if (!_that._self[flagT]) _that._self[flagT] = [];
@ -150,11 +151,25 @@ export function MapUtil(map) {
let textTitle = item.jzMc ? item.jzMc : item.fzrXm + '警组';
if (flag == 'sbwz_car' || flag == 'sbwz_sb' || flag == 'sbwz_zfjly') textTitle = item.sbmc;
if (flag == 'gapText') textTitle = text;
if (flag == 'bxd' || flag == "search_bxd") textTitle = item.bxdMc;
// 设置样式
const el = document.createElement('div');
if (flag == 'hm') {
// 直接设置元素样式属性，避免对象赋值的兼容性问题
el.style.fontSize = '12px';
el.style.color = '#ffffffff';
el.style.fontWeight = 'bold';
el.style.textAlign = 'center';
el.style.backgroundColor = '#1891ff82';
el.style.padding = '2px';
// 添加额外的样式属性以确保良好的显示效果
el.style.borderRadius = '4px';
el.style.boxShadow = '0 2px 8px rgba(0, 0, 0, 0.3)';
el.style.zIndex = '1000';
}
el.className = 'makerTitle';
if (flag == 'sbwz_car' || flag == 'sbwz_sb' || flag == 'sbwz_zfjly') el.className = 'makerTitlezb';
if (flag == 'sbwz_car' || flag == 'sbwz_sb' || flag == 'sbwz_zfjly' || flag == 'bxd' || flag == "search_bxd") el.className = 'makerTitlezb';
if (flag == 'rx') {
if (item.xfzt == '0') el.classList.add('makerTitleLine');
else if (item.xfzt == '1') el.classList.add('makerTitlecj');
@ -164,7 +179,7 @@ export function MapUtil(map) {
// 渲染
el.innerHTML = textTitle;
const marker = map.Marker(el, points, { anchor: 'bottom', offset: [0, -50] })
const marker = map.Marker(el, points, { anchor: 'bottom', offset: offset ? offset : [0, -50] })
_that._self[flagT].push(marker)
}
@ -186,7 +201,7 @@ export function MapUtil(map) {
let list = []
let cl = (pbcl && pbcl.length > 0) ? true : false; // 车辆
let zb = (txzb && txzb.length > 0) ? true : false; // 智能装备
let qx = (jyqx && jyqx.length > 0) ? true : false; // 警用器械
let qx = (jyqx && jyqx.length > 0) ? true : false; // 常用装备
if (zb) {
let el = document.createElement("img");
el.style.width = "15px"
@ -316,11 +331,14 @@ export function MapUtil(map) {
// 清除所有
MapUtil.prototype.removeAll = () => {
for (let key in _that._self) {
console.log(key, 'key');
if (key != 'rx' && key != 'gpsZb' && !key.includes('rxTitle')) {
let list = _that._self[key]
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)
}
_that._self[key] = [];
}
@ -686,31 +704,90 @@ export function MapUtil(map) {
* ]
};
*/
// MapUtil.prototype.createBoundarys = (res) => {
// let { data } = res
// if (!data) return false;
// if (_that.polygonGeo) _that.removeBj();
// _that.polygonGeo = map.createPolygon(data, {
// color: 'rgba(20,237,245,0.3)',
// outLineColor: '#cf1010',
// outLineWidth: 6,
// highlightColor: 'red',
// type: 'solid',
// labelOption: {
// pixelOffset: [2, 0],
// allShow: false,
// fontColor: '#ffffff'
// }
// })
// _that.polygonGeo.flyTo()
// }
// 移除边界
MapUtil.prototype.createBoundarys = (res) => {
let { data } = res
let { data, color, fillColor, borderColor, label, text, labelPosition } = res
if (!data) return false;
if (_that.polygonGeo) _that.removeBj();
_that.polygonGeo = map.createPolygon(data, {
color: 'rgba(20,237,245,0.3)',
outLineColor: '#cf1010',
outLineWidth: 6,
highlightColor: 'red',
// 使用传入的颜色参数，如果没有则使用默认值
const fillColorValue = fillColor || 'rgba(27, 205, 211, 0.3)';
const borderColorValue = borderColor || '#cf1010';
const highlightColorValue = color || 'red';
// 创建多边形
const polygon = map.createPolygon(data, {
color: fillColorValue,
outLineColor: borderColorValue,
outLineWidth: 5,
highlightColor: highlightColorValue,
type: 'solid',
labelOption: {
content: label || text || '222222', // 标签文字内容
position: labelPosition || 'center', // 标签位置
pixelOffset: [2, 0],
allShow: false,
fontColor: '#ffffff'
allShow: true, // 设置为true以显示所有标签
fontColor: '#ffffff',
fontSize: 14,
fontWeight: 'bold',
backgroundColor: 'rgba(0, 0, 0, 0.5)',
padding: [5, 10],
borderRadius: 4
}
})
_that.polygonGeo.flyTo()
// 将多边形添加到已创建的边界列表中
if (!_that.boundaryList) {
_that.boundaryList = [];
}
_that.boundaryList.push(polygon);
// 如果是第一个添加的区域，则飞过去
if (_that.boundaryList.length === 1) {
polygon.flyTo();
}
}
// 移除边界
MapUtil.prototype.removeBj = (res) => {
_that.polygonGeo.destroy()
// 移除单个polygonGeo（为了向后兼容）
if (_that.polygonGeo) {
_that.polygonGeo.destroy();
_that.polygonGeo = null;
}
// 移除所有添加到boundaryList中的多边形
if (_that.boundaryList && _that.boundaryList.length > 0) {
_that.boundaryList.forEach(polygon => {
polygon.destroy();
});
_that.boundaryList = [];
}
}
// 打开详情弹窗
MapUtil.prototype.openInfoDetail = (flag, data) => {
console.log(flag, data);
switch (flag) {
case 'home_yj_map':
console.log(data);
@ -720,6 +797,14 @@ export function MapUtil(map) {
console.log(data);
emitter.emit("showHomeWarning", data);
break;
case 'jczMap_hm':
console.log(data);
emitter.emit("showJcz", data);
break;
case 'sp':
console.log(data);
emitter.emit("showGzyInfo", data);
break;
}
}
}

173
src/components/MyComponents/Upload/index.vue
View File

@ -1,20 +1,33 @@
<template>
<div class="form-item-box" :class="props.showBtn ? 'showBtn-upload' : ''" :style="{ width: width }">
<el-upload v-bind="$attrs" :headers="headers" :multiple="false" class="avatar-uploader" :limit="props.limit"
:action="actionUrl" :list-type="props.showBtn ? '' : 'picture-card'" :file-list="fileList" show-file-list
:on-exceed="handleExceed" :on-success="handlerSuccess" :before-upload="beforeImgUpload">
<el-upload
v-bind="$attrs"
:headers="headers"
:multiple="false"
class="avatar-uploader"
:limit="props.limit"
:action="actionUrl"
:list-type="props.showBtn ? '' : 'picture-card'"
:file-list="fileList"
show-file-list
:before-remove="beforeRemove"
:on-exceed="handleExceed"
:on-success="handlerSuccess"
:before-upload="beforeImgUpload">
<template #default>
<el-button v-if="props.showBtn" size="small" type="primary">上传文件</el-button>
<el-icon v-else>
<Plus />
</el-icon>
<el-icon v-else><Plus /></el-icon>
</template>
<template #file="{ file }" v-if="!props.showBtn">
<div v-if="props.isImg">
<img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
<span class="el-upload-list__item-actions">
<span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)"><el-icon> <zoom-in /></el-icon></span>
<span v-if="!disabled" class="el-upload-list__item-delete" @click="handleRemove(file, fileList)"><el-icon><Delete /></el-icon></span>
<span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
<el-icon> <zoom-in /></el-icon>
</span>
<span v-if="!disabled" class="el-upload-list__item-delete" @click="handleRemove(file, fileList)">
<el-icon><Delete /></el-icon>
</span>
</span>
</div>
<div v-else>
@ -24,14 +37,10 @@
</div>
<span class="el-upload-list__item-actions">
<span v-if="!disabled" class="el-upload-list__item-delete" @click="handleDownload(file)">
<el-icon>
<Download />
</el-icon>
<el-icon><Download /></el-icon>
</span>
<span v-if="!disabled" class="el-upload-list__item-delete" @click="handleRemove(file, fileList)">
<el-icon>
<Delete />
</el-icon>
<el-icon><Delete /></el-icon>
</span>
</span>
</div>
@ -45,7 +54,7 @@
<script setup>
import { COMPONENT_WIDTH } from "@/constant";
import { ref, defineProps, defineEmits, computed, watch, onMounted } from "vue";
import { ref, defineProps, defineEmits, computed, watch, onMounted, onUnmounted } from "vue";
import { ElMessage } from "element-plus";
import { useStore } from "vuex";
const props = defineProps({
@ -72,9 +81,30 @@ const props = defineProps({
},
isAll: {
type: Boolean,
default: false
default: true //所有类型都可以用这个接口，接口返回的是id
}
});
const emits = defineEmits(["update:modelValue"]);
const store = useStore();
const dialogImageUrl = ref("");
const dialogVisible = ref(false);
const disabled = ref(false);
const headers = ref({
Authorization: store.getters.token
});
const fileList = ref([]);
watch(() => props.modelValue,(val) => {
let arr = val ? (Array.isArray(val) ? val :[val]): [];
if(arr.length == 0 ) return fileList.value = [];
fileList.value = arr.map((el) => {
if (Object.prototype.toString.call(el) === "[object Object]") {
return props.isAll ? { url: `/mosty-api/mosty-base/minio/image/download/` + el.id, name: el.name ,id : el } : { url:el,name:el.name , id : el};
} else {
return { url: `/mosty-api/mosty-base/minio/image/download/` + el,id : el };
}
});
},{ immediate: true,deep:true });
const actionUrl = computed(() => {
if (props.isAll) {
@ -84,8 +114,6 @@ const actionUrl = computed(() => {
}
});
const emits = defineEmits(["update:modelValue", "handleChange"]);
//获取后缀
const getSuffix = (fileName) => {
let suffix = "";
@ -108,101 +136,37 @@ const getSuffix = (fileName) => {
//excel XLS
const excelist = ["xls", "xlsx"];
if (excelist.includes(suffix)) return "XLS";
// 匹配 word
var wordlist = ["doc", "docx"];
if (wordlist.includes(suffix)) return "DOC";
//pdf
if (suffix === "pdf") return "PDF";
//视频 音频
var videolist = [
"mp4",
"m2v",
"mkv",
"rmvb",
"wmv",
"avi",
"flv",
"mov",
"m4v"
];
var videolist = ["mp4","m2v","mkv","rmvb","wmv","avi","flv","mov","m4v"];
if (videolist.includes(suffix)) return "VIDEO";
var musiclist = ["mp3", "wav", "wmv"];
if (musiclist.includes(suffix)) return "MUSIC";
var pptlist = ["ppt", "pptx"];
if (pptlist.includes(suffix)) return "PPT";
//压缩包
var yslist = ["7z", "rar", "zip", "apz", "ar", "hpk", "hyp", "hbc2"];
if (yslist.includes(suffix)) return "YS";
//否则返回other
return "OTHER";
};
const store = useStore();
const dialogImageUrl = ref("");
const dialogVisible = ref(false);
const disabled = ref(false);
const headers = ref({
Authorization: store.getters.token
});
const fileList = ref([]);
watch(
() => props.modelValue,
(val) => {
let arr = val ? val : [];
if (arr && arr.length > 0) {
if (!props.sfUrl) {
if (Array.isArray(arr)) {
fileList.value = arr.map((el) => {
if (Object.prototype.toString.call(el) === "[object Object]") {
return {
url: `/mosty-api/mosty-base/minio/image/download/` + el,
name: el.name
};
} else {
return { url: `/mosty-api/mosty-base/minio/image/download/` + el };
}
});
} else {
const fjListData=arr.split(',')
fileList.value = fjListData.map((el) => {
if (Object.prototype.toString.call(el) === "[object Object]") {
return {
url: `/mosty-api/mosty-base/minio/image/download/` + el,
name: el.name
};
} else {
return { url: `/mosty-api/mosty-base/minio/image/download/` + el };
}
});
}
} else {
fileList.value = arr.map((el) => {
if (Object.prototype.toString.call(el) === "[object Object]") {
return { url: el, name: el.name };
} else {
return { url: el };
}
});
}
}
},
{ immediate: true }
);
const handlerSuccess = (res, file) => {
file.url = `/mosty-api/mosty-base/minio/image/download/` + res.data;
// file.url = `/mosty-api/mosty-base/minio/image/download/` + res.data;
file.id = res.data;
fileList.value.push(file);
let arr = props.modelValue ? props.modelValue : [];
arr.push(res.data);
let arr = []
if(props.isImg){
arr = fileList.value.map((el) => el.id)
}else{
arr = fileList.value.map((el) => ({ id:el.id, name:el.name}))
}
emits("update:modelValue", arr);
emits("handleChange", props.modelValue);
};
const handleExceed = (files, fileList) => {
@ -212,16 +176,10 @@ const handleExceed = (files, fileList) => {
const beforeImgUpload = (file) => {
if (props.isImg) {
let isIMG = false;
if (getSuffix(file.name) === "IMG") {
isIMG = true;
}
if (getSuffix(file.name) === "IMG") isIMG = true;
const isLt5M = file.size / 1024 / 1024 < 5;
if (!isIMG) {
ElMessage.error("上传图片只能是jpg/png/jpeg/bmp/gif格式!");
}
if (!isLt5M) {
ElMessage.error("上传图片大小不能超过 5MB!");
}
if (!isIMG) ElMessage.error("上传图片只能是jpg/png/jpeg/bmp/gif格式!");
if (!isLt5M) ElMessage.error("上传图片大小不能超过 5MB!");
return isIMG && isLt5M;
} else {
return true;
@ -235,16 +193,25 @@ const handlePictureCardPreview = (file) => {
const handleDownload = (file) => {
window.open(file.response.data);
};
// 删除文件 触发父组件更新
const beforeRemove = (file) => {
let index = fileList.value.findIndex(function (item) {
return item.id === file.id;
});
props.modelValue.splice(index, 1);
emits("update:modelValue", props.modelValue);
}
const handleRemove = (file) => {
let index = fileList.value.findIndex(function (item) {
return item.url === file.url;
return item.id === file.id;
});
fileList.value.splice(index, 1);
props.modelValue.splice(index, 1);
emits("handleChange", props.modelValue);
emits("update:modelValue", props.modelValue);
};
const propsModelValue = ref();
</script>
<style lang="scss" scoped>

201
src/components/SwitchSysDialog.vue Normal file
View File

@ -0,0 +1,201 @@
<!--
* @Date: 2025-08-06 14:49:49
* @Description: 系统切换窗口
-->
<template>
<el-dialog
v-model="model"
class="switch-sys-dialog"
modal-class="switch-sys-dialog-modal"
:show-close="false"
width="1600"
align-center
append-to-body
destroy-on-close
custom-class="switch-sys-dialog-modal"
>
<div class="switch-sys-dialog__content">
<div class="nav prev" @click="prev">
<el-icon>
<ArrowLeftBold />
</el-icon>
</div>
<div class="carousel">
<div
:class="['card-item', { active: currentIndex === index }]"
v-for="(item, index) in list"
:key="item.value"
:style="getCardStyle(index)"
@click="goPage(item, index)"
>
<img :src="item.icon" class="card-item__img" />
<div class="card-item__label">{{ item.label }}</div>
</div>
</div>
<div class="nav next" @click="next">
<el-icon>
<ArrowRightBold />
</el-icon>
</div>
</div>
</el-dialog>
</template>
<script setup>
import {ref} from 'vue'
// 引入的本地图片
import fk from '@/assets/images/fk.png'
import ty from '@/assets/images/ty.png'
import pcs from '@/assets/images/pcs.png'
// 控制弹框显示或者隐藏
// const model = defineModel({ type: Boolean, default: false })
const props = defineProps({
model: {
type:Boolean,
default:false
}
})
const emit=defineEmits(['update:model'])
const list = [
{ label: '俯瞰系统', value: 1, url: `https://tyyy.lz.dsj.xz/overlooking/home`, icon: fk },
{ label: '统一门户', value: 2, url: 'https://tyyy.lz.dsj.xz/portal/home', icon: ty },
{ label: '智慧派出所', value: 3, url: 'https://pcs.lz.dsj.xz:9020/index.html', icon: pcs },
]
const currentIndex = ref(1)
const prev = () => {
currentIndex.value = (currentIndex.value - 1 + list.length) % list.length
}
const next = () => {
currentIndex.value = (currentIndex.value + 1) % list.length
}
const getCardStyle = index => {
const total = list.length
const offset = index - currentIndex.value
let style = {
opacity: 1,
zIndex: 1,
transform: '',
left: '50%',
}
// 循环时计算偏移
let relativeOffset = offset
if (offset < -1) relativeOffset += total
if (offset > 1) relativeOffset -= total
if (relativeOffset === 0) {
// 中间
style.zIndex = 3
style.transform = 'translateX(0) translateY(-50%) scale(1) rotateY(0deg) translateX(-50%)'
} else if (relativeOffset === -1) {
// 左边
style.zIndex = 2
style.transform = 'translateX(-500px) translateY(-50%) scale(0.8) rotateY(25deg) translateX(-50%)'
} else if (relativeOffset === 1) {
// 右边
style.zIndex = 2
style.transform = 'translateX(360px) translateY(-50%) scale(0.8) rotateY(-25deg) translateX(-50%)'
} else {
style.opacity = 0
style.transform = 'translate(-50%, -50%) scale(0.5)'
}
return style
}
const goPage = (item, index) => {
if (index === currentIndex.value) {
if (item.url) {
window.open(item.url, '_blank')
}
}
}
</script>
<style lang="scss">
.switch-sys-dialog {
--el-bg-color: transparent;
--el-box-shadow: none;
}
.switch-sys-dialog-modal {
background-color: #ffffff00 ;
}
</style>
<style lang="scss" scoped>
.switch-sys-dialog {
&__content {
display: grid;
grid-template-columns: auto 1fr auto;
width: inherit;
height: 335px;
align-items: center;
.carousel {
position: relative;
width: 100%;
height: 100%;
.card-item {
position: absolute;
top: 50%;
transition: all 0.5s ease;
transform-origin: center center;
opacity: 0;
border-radius: 10px;
overflow: hidden;
user-select: none;
cursor: pointer;
&.active {
box-shadow: 0 0 80px 50px rgba(var(--text-color-black-rgb), 0.6);
.card-item__label {
padding: 5px 0;
color: var(--theme-text-color);
font-weight: bold;
}
}
&__img {
width: 520px;
height: 293px;
object-fit: cover;
}
&__label {
background-color: #ffffff;
text-align: center;
color: var(--text-color-black);
transition: all 0.5s ease;
}
}
}
.nav {
display: flex;
justify-content: center;
align-items: center;
font-size: 32px;
color: var(--text-color);
cursor: pointer;
}
}
}
.iframe-container {
::v-deep .el-dialog__header {
background-color: rgb(4 35 74) !important;
height: 50px;
padding: 0 !important;
}
::v-deep .el-dialog__body {
padding: 0 !important;
}
}
</style>

2
src/components/aboutTable/FormMessage.vue
View File

@ -20,7 +20,7 @@
</template>
<!-- 上传 upload -->
<MOSTY.Upload v-else-if="item.type == 'upload'" width="100%" v-model="listQuery[item.prop]" :isImg="item.isImg" :disabled="item.disabled" />
<MOSTY.Upload v-else-if="item.type == 'upload'" width="100%" v-model="listQuery[item.prop]" :isImg="item.isImg" :limit="item.limit" :disabled="item.disabled" />
<!--选择checkbox -->
<MOSTY.CheckBox v-else-if="item.type == 'checkbox'" width="100%" clearable v-model="listQuery[item.prop]" :checkList="item.options" :placeholder="`请选择${item.label}`" :disabled="item.disabled" />

3
src/components/aboutTable/MyTable.vue
View File

@ -8,7 +8,8 @@
:highlight-current-row="getConfiger.showSelectType === 'radio'"
:row-style="{ height: getConfiger.rowHeight === 'auto' ? getConfiger.rowHeight : getConfiger.rowHeight + 'px' }">
<el-table-column style="width: 55px" type="selection" width="55" v-if="getConfiger.showSelectType" :class="getConfiger.showSelectType === 'radio' ? 'tabBoxRadio' : ''" />
<!-- 修改v-if条件，让showSelectType为null时也能显示选择列，默认为复选框 -->
<el-table-column style="width: 55px" type="selection" width="55" v-if="getConfiger.showSelectType !='null'" :class="getConfiger.showSelectType === 'radio' ? 'tabBoxRadio' : ''" />
<el-table-column type="index" label="序号" v-if="getConfiger.showIndex" width="60" :align="getConfiger?.align" />

2
src/components/aboutTable/TagSelectorDialog.vue
View File

@ -1,5 +1,5 @@
<template>
<el-dialog :title="titleValue" width="1500px" :model-value="modelValue" append-to-body @close="closed">
<el-dialog :title="titleValue" width="1500px" :model-value="props.modelValue" append-to-body @close="closed">
<div class="table_class">
<div style="width: 48%">
<el-tabs v-model="activeTab" type="card" @tab-click="handleTabClick">

2
src/components/addPerson/index.vue
View File

@ -1,5 +1,5 @@
<template>
<el-dialog v-model="modelValue" :destroy-on-close="true" :title="title+'人员'" @close="close" :close-on-click-modal="false">
<el-dialog v-model="props.modelValue" :destroy-on-close="true" :title="title+'人员'" @close="close" :close-on-click-modal="false">
<FormMessage v-model="listQuery" :formList="formData" labelWidth="120px" ref="elform" :rules="rules">
<template #bqList>
<div class="marks pointer" @click="chooseMarksVisible = true">

24
src/components/flowPath/SelectingPeople.vue
View File

@ -241,7 +241,6 @@ const qcckPostList = async () => {
const data = {}
const listError = []
for (let i = 0; i < checkListData.value.length; i++) {
if (Array.isArray(checkListData.value[i].userList)) {
for (let j = 0; j < checkListData.value[i].userList.length; j++) {
const item = checkListData.value[i].userList[j]
@ -318,7 +317,6 @@ const endpoints = [
const queryModel = async () => {
try {
loading.value = true
// 查询模型信息
const params = {
modelId: props.radioData,
@ -341,8 +339,11 @@ const queryModel = async () => {
const eventNode = resData[1].rows.find(item =>
item.nodeType === '1' && item.nodeId === sequenceNode.targetNodeId
)
const orgId = 'a8aa5ed229724b278faa7abd0f0cceb6'
// getItem('userOrg').parentid
const orgId = getItem('deptId')[0].fzOrgId
if (!orgId) {
proxy.$message({ type: "error", message: "查询模型失败，请重试" })
return
}
if (eventNode) {
// 处理事件节点
await handleEventNode(eventNode, orgId)
@ -360,7 +361,6 @@ const queryModel = async () => {
const optional=ref(false)
// 处理事件节点
const handleEventNode = async (eventNode, orgId) => {
const nodeExtension = JSON.parse(eventNode.nodeExtension)
modelData.value = [eventNode]
checkList.value = [eventNode.nodeId]
@ -372,13 +372,20 @@ const handleEventNode = async (eventNode, orgId) => {
orgid: ""
}
if (nodeExtension.flwsUserNode.orgType == 'brothers') {
console.log(1);
orgData = await queryListByEntity({ id: orgId })
} else if (nodeExtension.flwsUserNode.orgType == 'parent') {
console.log(2);
orgData = await querysingleByEntity({ id: orgId })
} else if (nodeExtension.flwsUserNode.orgType == 'parents') {
console.log(3);
orgData = await queryUporgsByEntity({ id: orgId })
} else if (nodeExtension.flwsUserNode.orgType == 'appoint') {
console.log(4);
// orgData = await queryUporgsByEntity({ orgcode: orgId })
console.log(orgData);
}
if (nodeExtension.flwsUserNode.orgType == 'appoint') {
promes.roles = roles
@ -424,7 +431,6 @@ const handleEventNode = async (eventNode, orgId) => {
// 处理普通节点
const handleNormalNodes = async (resData, sequenceNode, orgId) => {
const targetNodeIds = resData[2].rows
.filter(item => item.sourceNodeId === sequenceNode.targetNodeId)
.map(item => item.targetNodeId)
@ -468,6 +474,7 @@ const handleNormalNodes = async (resData, sequenceNode, orgId) => {
})
promesList[modelData.value[i].nodeId] = list
} else if (str.flwsUserNode.orgType == 'appoint') {
list = [{
posts: str.flwsUserNode.post[0] ? str.flwsUserNode.post[0] : '',
roles: str.flwsUserNode.role[0] ? str.flwsUserNode.role[0] : '',
@ -543,14 +550,11 @@ function filterUsersWithOrgInfo(orgsData, checkList) {
const sendMessage = (gzlid) => {
let letDataCheck = []
let userList = []
console.log(checkListData.value);
for (let i = 0; i < checkListData.value.length; i++) {
letDataCheck = [...letDataCheck, ...checkListData.value[i].checkList]
userList.push(checkListData.value[i].userList)
}
console.log(letDataCheck);
console.log(userList);
const bkshrSfzh = filterUsersWithOrgInfo(userList, letDataCheck).map(item => {
return {
bkshrXm: item.username,

15
src/components/flowPath/submissionProcess.vue
View File

@ -67,7 +67,6 @@ const lyquery = reactive({
promes: {
page: 1,
rows: 100,
// orgCode:deptId[0].orgCode
modelName: props.userData.modelName
}
@ -78,7 +77,7 @@ const qcckGetList = () => {
const prrmes = {
...lyquery.promes
}
splGet(prrmes, '/model/queryModel').then(res => {
splPost(prrmes, '/model/queryModel').then(res => {
lyquery.rows = lyquery.promes.page == 1 ? res.rows : lyquery.rows.concat(res.rows)
lyquery.total = res.total
})
@ -87,12 +86,18 @@ const Sfzh = getItem('idEntityCard')
const qcckGetCount = () => {
if (!getItem('cookie')) {
qcckGet({ sfzh: Sfzh }, '/mosty-base/fzmsg/getCokie', true).then(res => {
setCookie('clientKey', res.cookie.substring(10, res.length))
if (res.cookie) {
setCookie('clientKey', res.cookie.substring(10, res.length))
} else {
setCookie('clientKey', res.substring(10, res.length))
}
qcckGetList()
})
} else { qcckGetList() }
}
watch(() => props.modelValue, (newVal) => {
if (newVal) {
qcckGetCount()
@ -102,8 +107,8 @@ const createProcess = ref({})
const radioData = ref('')
// const InterfaceAddress = 'http://192.168.0.231:8006/mosty-api/mosty-gsxt/'
// const InterfaceAddress = 'http://192.168.0.231:8006/mosty-api/mosty-gsxt/'
// const InterfaceAddress = 'http://155.540.22.30:50037/mosty-api/mosty-gsxt/'
const InterfaceAddress = 'http://192.168.1.32:8006/mosty-api/mosty-gsxt/'
const InterfaceAddress = 'http://155.540.22.30:50037/mosty-api/mosty-gsxt/'
// const InterfaceAddress = 'http://192.168.1.32:8006/mosty-api/mosty-gsxt/'
const changeRadio = (e) => {
radioData.value = e
const item = lyquery.rows.find(item => item.modelId == e)

2
src/components/ypModel/index.vue
View File

@ -7,7 +7,7 @@
<Editor :style="`height: ${props.heightNumber}px; overflow-y: hidden`" v-model="textContent" :defaultConfig="editorConfig" :mode="mode" @onCreated="handleCreated" @onChange="handChange" />
</div>
<template #footer>
<el-button type="primary" @click="SaveReport">保存</el-button>
<!-- <el-button type="primary" @click="SaveReport">保存</el-button> -->
<!-- <el-button type="primary" @click="downloadWithStyles">历史报告</el-button> -->
<el-button type="primary" @click="downloadWithStyles">下载</el-button>
<el-button type="primary" @click="close">取消</el-button>