lcw/xzlz_JczWeb
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

xiug

Browse Source
This commit is contained in:
13684185576
2025-07-21 21:17:45 +08:00
parent 30d5a663ef
commit ad1b52a960
407 changed files with 87 additions and 125398 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -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">
@ -75,7 +74,7 @@ const props = defineProps({
});
try {
const userInfo = getItem("deptId")[0].deptCode;
} catch (error) { }
} catch (error) {}
let map;
let mapLayer;
let mapLayer1;
@ -89,32 +88,27 @@ 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: 10
},
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_SL/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();
});
mapUtil.value = new MapUtil(map);
@ -134,6 +128,8 @@ onMounted(() => {
});
// 撒点
emitter.on("addPointArea", (obj) => {
console.log(obj);
mapUtil.value.makerSki(obj);
});
// 鼠标滑过提示文字的点位
@ -172,7 +168,7 @@ onMounted(() => {
});
// 回显线
emitter.on("echoLine", (res) => {
mapUtil.value.createLine(res, res.flag);
mapUtil.value.createLine(res);
});
//创建边界面（geojson）
emitter.on("setBoundarys", (res) => {
@ -203,6 +199,11 @@ onMounted(() => {
mapUtil.value.diffusionCircle(res);
});
// 清除全部覆盖物
emitter.on("removeElementAll", () => {
mapUtil.value.removeElementAll();
});
// 展示盘曲
emitter.on("showGapText", (obj) => {
mapUtil.value.gapText(obj);
@ -301,6 +302,7 @@ onUnmounted(() => {
emitter.off("diffusionCircle");
emitter.off("SsCircle");
emitter.off("ClearssCircle");
emitter.off("removeElementAll");
});
</script>
@ -323,35 +325,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;
}

60
src/components/GdMap/index copy2.vue → src/components/GdMap/indexnw.vue
View File

@ -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">
@ -74,7 +75,7 @@ const props = defineProps({
});
try {
const userInfo = getItem("deptId")[0].deptCode;
} catch (error) {}
} catch (error) { }
let map;
let mapLayer;
let mapLayer1;
@ -88,27 +89,32 @@ 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: 7,
maxZoom: 18,
});
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_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);
@ -128,8 +134,6 @@ onMounted(() => {
});
// 撒点
emitter.on("addPointArea", (obj) => {
console.log(obj);
mapUtil.value.makerSki(obj);
});
// 鼠标滑过提示文字的点位
@ -168,7 +172,7 @@ onMounted(() => {
});
// 回显线
emitter.on("echoLine", (res) => {
mapUtil.value.createLine(res);
mapUtil.value.createLine(res, res.flag);
});
//创建边界面（geojson）
emitter.on("setBoundarys", (res) => {
@ -199,11 +203,6 @@ onMounted(() => {
mapUtil.value.diffusionCircle(res);
});
// 清除全部覆盖物
emitter.on("removeElementAll", () => {
mapUtil.value.removeElementAll();
});
// 展示盘曲
emitter.on("showGapText", (obj) => {
mapUtil.value.gapText(obj);
@ -302,7 +301,6 @@ onUnmounted(() => {
emitter.off("diffusionCircle");
emitter.off("SsCircle");
emitter.off("ClearssCircle");
emitter.off("removeElementAll");
});
</script>
@ -325,29 +323,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;
}

8
src/views/home/components/PeoWarning.vue
View File

@ -19,12 +19,12 @@
<span class="tag">{{ item.yjBt }}</span>
</div>
<div class="info-item flex">
<span class="label">性别：</span>
<dict-tag
<span class="label">性别：{{ IdCard(item.yjRysfzh, 'all').sex }}</span>
<!-- <dict-tag
:options="D_BZ_XB"
:value="IdCard(item.yjRysfzh, 3)"
:value="IdCard(item.yjRysfzh, 'all').sex"
:tag="false"
></dict-tag>
></dict-tag> -->
</div>
<div class="info-item">
<span class="label">相似度：</span>

67
src/views/home/components/wanringAnyse.vue
View File

@ -21,14 +21,13 @@ const vehicleChartRef = ref(null);
const personChartRef = ref(null);
let vehicleChart = null;
let personChart = null;
const createChartOption = (data, colors) => {
const createChartOption = (data, colors, total) => {
return {
title: {
text: "100",
text: `${total}`,
subtext: "总数",
left: "20%",
top: "center",
left: 'center',
top: 'center', //top待调整
textStyle: {
color: "#fff",
fontSize: 24,
@ -43,9 +42,9 @@ const createChartOption = (data, colors) => {
trigger: "item"
},
legend: {
orient: "vertical",
left: "60%",
top: "center",
orient: "horizontal",
top: 0,
bottom: '50px',
textStyle: {
color: "#fff",
rich: {
@ -71,14 +70,14 @@ const createChartOption = (data, colors) => {
},
formatter: (name) => {
const item = data.find((d) => d.name === name);
return `${name} ${item.value} {${item.colorType}|(${item.value}%)}`;
return `${name} ${item.value}`;
}
},
series: [
{
type: "pie",
radius: ["55%", "70%"],
center: ["28%", "50%"],
center: ["50%", "55%"],
data: data.map((item) => ({
...item,
itemStyle: {
@ -100,7 +99,7 @@ const createChartOption = (data, colors) => {
{
type: "pie",
radius: ["65%", "85%"],
center: ["28%", "50%"],
center: ["50%", "55%"],
data: data.map((item) => ({
...item,
itemStyle: {
@ -128,13 +127,20 @@ const randomHexColor = () => {
};
const initCharts = async () => {
let clTotal = 0;
let ryTotal = 0;
vehicleChart = echarts.init(vehicleChartRef.value);
personChart = echarts.init(personChartRef.value);
const colors = ["#00f0ff", "#0066ff", "#ff9900", "#00cc66"];
// 车辆预警数据
const res = await jczgetYjbqtj({ yjLx: 1 });
const res2 = await jczgetYjbqtj({ yjLx: 2 });
console.log(res);
console.log(res, 'res');
console.log(res2, 'res2');
clTotal = res2.map((el) => el.sl).reduce((accumulator, currentValue) => accumulator + currentValue, 0);
ryTotal = res.map((el) => el.sl).reduce((accumulator, currentValue) => accumulator + currentValue, 0);
console.log(clTotal, 'clTotal');
const vehicleData = res.map((item) => {
const color = randomHexColor();
const color2 = randomHexColor();
@ -147,37 +153,6 @@ const initCharts = async () => {
};
});
// [
// {
// value: 25,
// name: "盗窃车辆",
// colorType: "blue",
// color: ["#00f0ff", "#00a0cc"],
// color1: [choseRbgb("#00f0ff", 0.3), choseRbgb("#00a0cc", 0.3)]
// },
// {
// value: 30,
// name: "车牌与车辆不符",
// colorType: "lightBlue",
// color: ["#0066ff", "#0044cc"],
// color1: [choseRbgb("#0066ff", 0.3), choseRbgb("#0044cc", 0.3)]
// },
// {
// value: 17,
// name: "车辆超高",
// colorType: "orange",
// color: ["#ff9900", "#cc7a00"],
// color1: [choseRbgb("#ff9900", 0.3), choseRbgb("#cc7a00", 0.3)]
// },
// {
// value: 28,
// name: "车辆超限",
// colorType: "green",
// color: ["#00cc66", "#009944"],
// color1: [choseRbgb("#00cc66", 0.3), choseRbgb("#009944", 0.3)]
// }
// ];
// 人员预警数据
const personData = res2.map((item) => {
const color = randomHexColor();
@ -220,8 +195,8 @@ const initCharts = async () => {
// color1: [choseRbgb("#00cc66", 0.3), choseRbgb("#009944", 0.3)]
// }
// ];
vehicleChart.setOption(createChartOption(vehicleData, colors));
personChart.setOption(createChartOption(personData, colors));
vehicleChart.setOption(createChartOption(vehicleData, colors, ryTotal));
personChart.setOption(createChartOption(personData, colors, clTotal));
};
const handleResize = () => {
@ -253,7 +228,7 @@ onUnmounted(() => {
.section-title {
font-size: 18px;
margin-bottom: 20px;
// margin-bottom: 20px;
position: relative;
padding-left: 12px;
background: linear-gradient(0deg, #59a6f4 0%, #ffffff 90%);

4
src/views/home/layout/head.vue
View File

@ -5,10 +5,10 @@
<div class="f18 pl104">{{ hour + ":" + minute + ":" + second }}</div>
</div>
<div class="title absolute" @click="goPath">{{ props.title }}</div>
<div class="wd absolute">
<!-- <div class="wd absolute">
<el-icon size="25px" style="top: 6px" color="#86C8EB"><Sunny /></el-icon>
<span> 温度 1~7°C </span>
</div>
</div> -->
<div class="zbbb" v-if="query" @click="show = true">值班报备</div>
</div>
<el-dialog v-model="show" title="Shipping address">