xiangshan
/
ggfwjsc
22
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'main' of https://git.cityme.com.cn/xiangshan/ggfwjsc

This commit is contained in:
duanxiaohai 2024-08-14 16:24:10 +08:00
parent d1cc12fe6e 51cc8868e7
commit 8e3e92823a
7 changed files with 363 additions and 123 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/images/map/j11.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
src/assets/images/map/j11_map.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.0 KiB

BIN
src/assets/images/sxt_detail.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 8.9 KiB

BIN
src/assets/images/sxt_map.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.6 KiB

24
src/view/dialog/dialogMapDp.vue
View File

@ -41,6 +41,7 @@
</div> </div>
<div style="width: 100%; height: calc(100% - 110px)"> <div style="width: 100%; height: calc(100% - 110px)">
<el-table <el-table
v-loading="loadT"
:data="data.tableData" :data="data.tableData"
height="100%" height="100%"
:header-cell-style="{ background: '#008FCD' }" :header-cell-style="{ background: '#008FCD' }"
@ -143,14 +144,21 @@ const props = defineProps({
}, },
pagination: { pagination: {
type: Object, type: Object,
required: true, default: () => {
return {};
},
},
loadTable: {
type: Boolean,
default: () => {
return false;
},
}, },
}); });
const emit = defineEmits(["close", "handle"]); const emit = defineEmits(["close", "handle", "loadTables"]);
const handleRowClick = (row, column, event) => { const handleRowClick = (row, column, event) => {
// row 是当前行的数据 // row 是当前行的数据
console.log(row); emit("openMessage", { nm: row.nm, identNo: row.identNo });
emit("openMessage", {nm: row.nm, identNo: row.identNo});
// router.push({ // router.push({
// path: `/home/index/person`, // path: `/home/index/person`,
// query: {nm: row.nm, identNo: row.identNo,type:'map'}, // query: {nm: row.nm, identNo: row.identNo,type:'map'},
@ -158,6 +166,7 @@ const handleRowClick = (row, column, event) => {
}; };
// 详情弹框 // 详情弹框
const dialogShow = ref(); const dialogShow = ref();
const loadT = ref();
const data = reactive({ const data = reactive({
title: "", title: "",
columns: [], columns: [],
@ -173,7 +182,7 @@ watch(
() => props.dialogShow, () => props.dialogShow,
(newVal, oldVal) => { (newVal, oldVal) => {
dialogShow.value = newVal; dialogShow.value = newVal;
// data.tableData = props.tableData; loadT.value = newVal;
data.columns = props.columns; data.columns = props.columns;
} }
); );
@ -181,6 +190,7 @@ watch(
() => props.tableData, () => props.tableData,
(newVal, oldVal) => { (newVal, oldVal) => {
data.tableData = props.tableData; data.tableData = props.tableData;
loadT.value = false;
tableKey.value = Math.random(); tableKey.value = Math.random();
} }
); );
@ -319,10 +329,10 @@ const handle = (current) => {
.custom-table-font { .custom-table-font {
font-size: 10px; font-size: 10px;
} }
:deep(.el-table:not(.el-table--border) .el-table__cell){ :deep(.el-table:not(.el-table--border) .el-table__cell) {
padding: 3px 0px; padding: 3px 0px;
} }
:deep(.el-pagination ){ :deep(.el-pagination) {
transform: scale(0.8); transform: scale(0.8);
} }
</style> </style>

12
src/view/person/index.vue
View File

@ -98,10 +98,8 @@
<p>返回</p> <p>返回</p>
</div> </div>
<!-- v-if="dataMyTag.camera" --> <!-- v-if="dataMyTag.camera" -->
<div class="videoCamera"> <div class="videoCamera" v-if="dataMyTag.camera">
<el-icon size="26" color="#fff" @click="openCamera"> <img src="@/assets/images/sxt_detail.png" alt="">
<VideoCamera />
</el-icon>
</div> </div>
</div> </div>
<div class="person-side"> <div class="person-side">
@ -1206,9 +1204,13 @@ onMounted(() => {
} }
.videoCamera { .videoCamera {
position: absolute; position: absolute;
top: 8px; top: -10px;
right: 30px; right: 30px;
cursor: pointer; cursor: pointer;
img{
width: 46px;
height: 46px;
}
} }
.widu { .widu {
min-width: 40px !important; min-width: 40px !important;

450
src/view/sy_map.vue
View File

@ -169,11 +169,14 @@
<div v-else>未居住</div> <div v-else>未居住</div>
</template> </template>
<template #sxt="{ currentCol, currentData }"> <template #sxt="{ currentCol, currentData }">
<el-icon size="24" color="#fff" v-if="currentData.camera" <img
><VideoCamera src="@/assets/images/sxt_map.png"
/></el-icon> style="widht: 20px; height: 20px"
v-if="currentData.camera"
/>
</template> </template>
</Dialog> </Dialog>
<!-- 详情 -->
<personDetail <personDetail
class="detail" class="detail"
style="width: 1920px; height: 1080px" style="width: 1920px; height: 1080px"
@ -181,6 +184,24 @@
:message="message" :message="message"
@closeDetail="closeDetail" @closeDetail="closeDetail"
></personDetail> ></personDetail>
<!-- 加载动画 -->
<div class="loadBody" v-show="loadingss">
<div class="load">
<div class="icon">
<div class="loading">
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</div>
<div class="text">数据加载中...</div>
</div>
</div>
</teleport> </teleport>
</div> </div>
</template> </template>
@ -215,6 +236,8 @@ import j7 from "@/assets/images/map/j7.png";
import j8 from "@/assets/images/map/j8.png"; import j8 from "@/assets/images/map/j8.png";
import j9 from "@/assets/images/map/j9.png"; import j9 from "@/assets/images/map/j9.png";
import j10 from "@/assets/images/map/j10.png"; import j10 from "@/assets/images/map/j10.png";
import j11 from "@/assets/images/map/j11.png";
import j11_map from "@/assets/images/map/j11_map.png";
import dwd from "@/assets/images/map/dwd.png"; import dwd from "@/assets/images/map/dwd.png";
import fwqbg1 from "@/assets/images/map/qlv.png"; import fwqbg1 from "@/assets/images/map/qlv.png";
import fwqbg2 from "@/assets/images/map/qlan.png"; import fwqbg2 from "@/assets/images/map/qlan.png";
@ -233,6 +256,9 @@ import AED from "@/assets/images/map/AED.png";
import Dialog from "./dialog/dialogMapDp.vue"; import Dialog from "./dialog/dialogMapDp.vue";
import personDetail from "./person/index.vue"; import personDetail from "./person/index.vue";
//--------定义参数------- //--------定义参数-------
//加载
const loadingss = ref(false);
const loadTable = ref(false);
//是否打开人物详情 //是否打开人物详情
const openD = ref(true); const openD = ref(true);
const message = ref({}); const message = ref({});
@ -670,7 +696,8 @@ const yaosuTotal = ref([
{ {
id: 11, id: 11,
name: "摄像头", name: "摄像头",
img: j0, img: j11,
img_map:j11_map,
wz: false, wz: false,
url: "/api/ggfwyth/ysyzt/getJashsxt", url: "/api/ggfwyth/ysyzt/getJashsxt",
}, },
@ -818,6 +845,7 @@ const tableType = reactive({
{ {
label: "", label: "",
property: "sxt", property: "sxt",
width: "50px",
type: "slot", type: "slot",
}, },
], ],
@ -847,7 +875,7 @@ const initMap = () => {
//点击龙游县初始化 //点击龙游县初始化
const csh = () => { const csh = () => {
clear(); clear();
xkzDk.length = 0;
map.removeEventListener("click", markera); map.removeEventListener("click", markera);
if (currentMarker !== null) { if (currentMarker !== null) {
map.removeOverlay(currentMarker); map.removeOverlay(currentMarker);
@ -890,6 +918,8 @@ const clear = () => {
cs_choose_arr.value = []; cs_choose_arr.value = [];
cs_un_choose_arr.value = []; cs_un_choose_arr.value = [];
cs_dd_arr.value = []; cs_dd_arr.value = [];
xkzCenter.length = 0;
xkzDk.length = 0;
}; };
//定义地图中点 //定义地图中点
const goMapCenter = (point, zoom) => { const goMapCenter = (point, zoom) => {
@ -958,8 +988,10 @@ const buten = async (item) => {
} }
} }
} else { } else {
getData(item.age); loadingss.value = true;
getDatas(cfJd.value, item.age); await getData(item.age);
await getDatas(cfJd.value, item.age);
loadingss.value = false;
} }
}; };
//点击特殊标签(关键字存name) //点击特殊标签(关键字存name)
@ -996,7 +1028,9 @@ const buten2 = async (item) => {
} }
} }
} else { } else {
getDataBqs(cfJd.value, cfCs.value, item.id); loadingss.value = true;
await getDataBqs(cfJd.value, cfCs.value, item.id);
loadingss.value = false;
} }
}; };
//人口 //人口
@ -1092,7 +1126,7 @@ const getDatas = async (e, i, y = true) => {
if (i == "9999") { if (i == "9999") {
i = ""; i = "";
} }
await http http
.get(`/api/ggfwyth/ysyzt/getCssrksl?town=${e}&age=${i || ""}`) .get(`/api/ggfwyth/ysyzt/getCssrksl?town=${e}&age=${i || ""}`)
.then((res) => { .then((res) => {
if (res.code == 200) { if (res.code == 200) {
@ -1213,8 +1247,12 @@ const getDatas = async (e, i, y = true) => {
} else { } else {
if (y) { if (y) {
if (choose.value.person == "") { if (choose.value.person == "") {
console.log(1111111111);
addCs(); addCs();
} else { } else {
console.log(2222222222);
addCs2(); addCs2();
} }
} }
@ -1420,7 +1458,10 @@ const getDataBq = async (jd, cs) => {
}; };
const getDataBqs = async (jd, cs, bq) => { const getDataBqs = async (jd, cs, bq) => {
await getDataBqJD(bq); await getDataBqJD(bq);
getDataBqs2(cfJd.value, cfCs.value, bq); if (cfJd.value == "") {
} else {
await getDataBqs2(cfJd.value, cfCs.value, bq);
}
}; };
//特殊标签获取街道内部人数 //特殊标签获取街道内部人数
const getDataBqs2 = async (jd, cs, bq) => { const getDataBqs2 = async (jd, cs, bq) => {
@ -1565,6 +1606,90 @@ const getDataBqs3 = async (jd, cs, bq) => {
} }
}); });
}; };
//点击地图区块进入社区取消await的影响
const getDataBqs4 = async (jd, cs, bq) => {
//f用来判断执不执行changeRs2
let data = {};
let vv = 0;
let tagIdBq;
tsbq_id_total.value.forEach((item, index) => {
if (bq == item.name) {
tagIdBq = item.tagId;
}
});
if (cs == "" && jd == "") {
data = {
tagId: tagIdBq,
};
vv = 1;
} else if (cs == "") {
data = {
town: jd,
tagId: tagIdBq,
};
vv = 2;
} else {
data = {
town: jd,
tagId: tagIdBq,
committee: cs,
};
vv = 3;
}
http.get(`/api/ggfwyth/ysyzt/getBqRsByTownAndCommittee`, data).then((res) => {
if (res.code == 200) {
if (cfJd.value != "") {
xkzCenter.map((item) => {
item.numbers = 0;
res.data.map((items) => {
if (items.committee == item.name) {
item.numbers = items.rs;
}
});
});
}
cs_name_arr.value.forEach((item, index) => {
map.removeOverlay(cs_name_arr.value[index]);
});
cs_number_name_arr.value.forEach((item, index) => {
map.removeOverlay(cs_number_name_arr.value[index]);
});
cs_dd_arr.value.forEach((item, index) => {
map.removeOverlay(cs_dd_arr.value[index]);
});
if (title_jd.value == "") {
} else {
if (sfdd.value) {
if (choose.value.person == "") {
cs_dd_arr.value.forEach((item, index) => {
map.removeOverlay(cs_dd_arr.value[index]);
});
cs_dd_arr.value = [...xuanzhongCs.value];
cs_dd_arr.value.map((item, index) => {
DGcreateCs(item, index);
});
} else {
cs_dd_arr.value.forEach((item, index) => {
map.removeOverlay(cs_dd_arr.value[index]);
});
cs_dd_arr.value = [...xuanzhongCs.value];
cs_dd_arr.value.map((item, index) => {
DGcreateCs2(item, index);
});
}
} else {
if (choose.value.person == "") {
addCs();
} else {
addCs2();
}
}
}
loadingss.value = false;
}
});
};
//特殊标签单独获取各个街道人数 //特殊标签单独获取各个街道人数
const getDataBqJD = async (bq) => { const getDataBqJD = async (bq) => {
let data = {}; let data = {};
@ -1641,23 +1766,26 @@ const changeys = (name) => {
yaosuList.value.push(name); yaosuList.value.push(name);
let url; let url;
let img; let img;
let img_map;
yaosuTotal.value.forEach((item, index) => { yaosuTotal.value.forEach((item, index) => {
if (item.name == name) { if (item.name == name) {
url = item.url; url = item.url;
img = item.img; img = item.img;
img_map=item.img_map;
} }
}); });
if (name == "摄像头") { if (name == "摄像头") {
getZyys(url, name, img); getZyys(url, name, img,img_map);
} }
} }
}; };
const getZyys = (url, name, img) => { const getZyys = (url, name, img,img_map) => {
http.get(url).then((res) => { http.get(url).then((res) => {
if (res.code == 200) { if (res.code == 200) {
yaosuIcon.value[name].sj = res.data; yaosuIcon.value[name].sj = res.data;
yaosuIcon.value[name].sj.forEach((item, index) => { yaosuIcon.value[name].sj.forEach((item, index) => {
item.img = img; item.img = img;
item.img_map = img_map;
item.overlay = null; item.overlay = null;
item.center = []; item.center = [];
item.center.push(Number(item.jd)); item.center.push(Number(item.jd));
@ -1693,7 +1821,7 @@ const createZyys = (polygon, indexx, name) => {
opacity: 0.5, opacity: 0.5,
offsetY: -10, offsetY: -10,
properties: { properties: {
imgSrc2: polygon.img, imgSrc2: polygon.img_map,
type: "customOverlay", type: "customOverlay",
}, },
} }
@ -1702,26 +1830,29 @@ const createZyys = (polygon, indexx, name) => {
}; };
//----------资源要素------------ //----------资源要素------------
//点击街道，回到街道 //点击街道，回到街道
const to_jd = (item_name) => { const to_jd = async (item_name) => {
loadingss.value = true;
clear(); clear();
title_jd.value = item_name; title_jd.value = item_name;
map.removeEventListener("click", markera); map.removeEventListener("click", markera);
if (currentMarker !== null) { if (currentMarker !== null) {
map.removeOverlay(currentMarker); map.removeOverlay(currentMarker);
} }
// townName.value = item_name;
// if (item_name == cfJd.value) {
// } else {
// console.log(111, choose.value.person);
cfJd.value = item_name; cfJd.value = item_name;
let jdCenter = []; let jdCenter = [];
BMAP(); BMAP();
loadCs(item_name); loadCs(item_name);
addPolygonCountyCs(); addPolygonCountyCs();
mapTownCount.map((itemm) => {
if (itemm.name == item_name) {
jdCenter = itemm.center;
}
});
goMapCenter(jdCenter, 13);
getDataBq(cfJd.value, ""); getDataBq(cfJd.value, "");
if (choose.value.person == "") { if (choose.value.person == "") {
getDatas(cfJd.value, ""); await getDatas(cfJd.value, "");
loadingss.value = false;
} }
if ( if (
choose.value.person == "残疾人" || choose.value.person == "残疾人" ||
@ -1734,33 +1865,17 @@ const to_jd = (item_name) => {
choose.value.person == "孤儿" || choose.value.person == "孤儿" ||
choose.value.person == "特困" choose.value.person == "特困"
) { ) {
getDataBqs2(cfJd.value, cfCs.value, choose.value.person); await getDatas(cfJd.value, "", false);
getDatas(cfJd.value, "", false); getDataBqs4(cfJd.value, cfCs.value, choose.value.person);
} else if (choose.value.person != "") { } else if (choose.value.person != "") {
if (choose.value.person == "9999") { if (choose.value.person == "9999") {
getDatas(cfJd.value, ""); await getDatas(cfJd.value, "");
loadingss.value = false;
} else { } else {
// if (choose.value.person == 1) { await getDatas(cfJd.value, choose.value.person);
// getDatas(cfJd.value, "0"); //0岁传字符串 loadingss.value = false;
// } else {
// getDatas(cfJd.value, choose.value.person);
// }
getDatas(cfJd.value, choose.value.person);
} }
} }
// if (title_jd.value == item.name) {
// } else {
// title_jd.value = item.name;
// }
mapTownCount.map((itemm) => {
if (itemm.name == item_name) {
jdCenter = itemm.center;
}
});
goMapCenter(jdCenter, 13);
// }
}; };
//详情 //详情
const open_detail = () => { const open_detail = () => {
@ -1768,8 +1883,8 @@ const open_detail = () => {
let tagId; let tagId;
if (choose.value.person == "9999") { if (choose.value.person == "9999") {
age = ""; age = "";
person_detail(age);
dialogShow.value = true; dialogShow.value = true;
person_detail(age);
} else if (choose.value.person == "6666") { } else if (choose.value.person == "6666") {
age = ""; age = "";
} else if ( } else if (
@ -1789,12 +1904,14 @@ const open_detail = () => {
tagId = item.tagId; tagId = item.tagId;
} }
}); });
person_detail(age, tagId);
dialogShow.value = true; dialogShow.value = true;
person_detail(age, tagId);
} else { } else {
dialogShow.value = true;
age = choose.value.person; age = choose.value.person;
person_detail(age); person_detail(age);
dialogShow.value = true;
} }
}; };
const close = () => { const close = () => {
@ -2269,21 +2386,28 @@ const addPolygonCounty = () => {
}); });
map.addOverlay(polygon); map.addOverlay(polygon);
polygon.addEventListener("click", () => { polygon.addEventListener("click", async () => {
// townName.value = item.name; // townName.value = item.name;
if (item.name == cfJd.value) { if (item.name == cfJd.value) {
} else { } else {
loadingss.value = true;
clear(); clear();
xkzDk.length = 0; xkzDk.length = 0;
cfJd.value = item.name; cfJd.value = item.name;
let jdCenter = []; let jdCenter = [];
// if (item.name == "溪口镇") {
BMAP(); BMAP();
loadCs(item.name); loadCs(item.name);
addPolygonCountyCs(); addPolygonCountyCs();
getDataBq(cfJd.value, ""); mapTownCount.map((itemm) => {
if (itemm.name == item.name) {
jdCenter = itemm.center;
}
});
goMapCenter(jdCenter, 13);
await getDataBq(cfJd.value, "");
if (choose.value.person == "") { if (choose.value.person == "") {
getDatas(cfJd.value, ""); await getDatas(cfJd.value, "");
loadingss.value = false;
} }
if ( if (
choose.value.person == "残疾人" || choose.value.person == "残疾人" ||
@ -2296,38 +2420,22 @@ const addPolygonCounty = () => {
choose.value.person == "孤儿" || choose.value.person == "孤儿" ||
choose.value.person == "特困" choose.value.person == "特困"
) { ) {
getDataBqs2(cfJd.value, cfCs.value, choose.value.person); await getDatas(cfJd.value, "", false);
getDatas(cfJd.value, "", false); //使用await把loading放外面，没效果，所以把loading放接口里面
getDataBqs4(cfJd.value, cfCs.value, choose.value.person);
} else if (choose.value.person != "") { } else if (choose.value.person != "") {
if (choose.value.person == "9999") { if (choose.value.person == "9999") {
getDatas(cfJd.value, ""); await getDatas(cfJd.value, "");
loadingss.value = false;
} else { } else {
getDatas(cfJd.value, choose.value.person); await getDatas(cfJd.value, choose.value.person);
loadingss.value = false;
} }
} }
if (title_jd.value == item.name) { if (title_jd.value == item.name) {
} else { } else {
title_jd.value = item.name; title_jd.value = item.name;
} }
mapTownCount.map((itemm) => {
if (itemm.name == item.name) {
jdCenter = itemm.center;
}
});
goMapCenter(jdCenter, 13);
// }
// else {
// loadCs(item.name);
// addPolygonCountyCs();
// // map.removeEventListener("click", markera);
// // if (currentMarker !== null) {
// // map.removeOverlay(currentMarker);
// // }
// // clear();
// // getData();
// // getDataBq();
// }
} }
}); });
} }
@ -2479,6 +2587,7 @@ const createCustomOverlayJd2 = (polygon, indexx) => {
//加载村社信息 //加载村社信息
const loadCs = (name) => { const loadCs = (name) => {
xkzCenter.length = 0; xkzCenter.length = 0;
xkzDk.length = 0;
cssj.forEach((item, index) => { cssj.forEach((item, index) => {
if (item.name == name) { if (item.name == name) {
csqk.value = item.sj; csqk.value = item.sj;
@ -2525,13 +2634,13 @@ const addPolygonCountyCs = () => {
strokeWeight: 2, strokeWeight: 2,
strokeOpacity: 0.8, strokeOpacity: 0.8,
fillColor: fillColor, fillColor: fillColor,
fillOpacity: 0.5, fillOpacity: 0.3,
name: item.name, name: item.name,
zIndex: 99, zIndex: 99,
}); });
map.addOverlay(cs_qk_arr.value[index]); map.addOverlay(cs_qk_arr.value[index]);
cs_qk_arr.value[index].addEventListener("click", () => { cs_qk_arr.value[index].addEventListener("click", async () => {
// console.log("名字", item.name); loadingss.value = true;
cs_dd_arr.value = []; cs_dd_arr.value = [];
cfCs.value = item.name; cfCs.value = item.name;
title_cs.value = item.name; title_cs.value = item.name;
@ -2551,6 +2660,8 @@ const addPolygonCountyCs = () => {
unChooseList.value.push(itemm); unChooseList.value.push(itemm);
} }
}); });
addCsChoose();
addCsUnChoose();
cs_qk_arr.value.forEach((item, index) => { cs_qk_arr.value.forEach((item, index) => {
map.removeOverlay(cs_qk_arr.value[index]); map.removeOverlay(cs_qk_arr.value[index]);
}); });
@ -2560,7 +2671,7 @@ const addPolygonCountyCs = () => {
cs_number_name_arr.value.forEach((item, index) => { cs_number_name_arr.value.forEach((item, index) => {
map.removeOverlay(cs_number_name_arr.value[index]); map.removeOverlay(cs_number_name_arr.value[index]);
}); });
getDataBq(cfJd.value, cfCs.value); await getDataBq(cfJd.value, cfCs.value);
if ( if (
choose.value.person == "残疾人" || choose.value.person == "残疾人" ||
choose.value.person == "低边" || choose.value.person == "低边" ||
@ -2572,29 +2683,13 @@ const addPolygonCountyCs = () => {
choose.value.person == "孤儿" || choose.value.person == "孤儿" ||
choose.value.person == "特困" choose.value.person == "特困"
) { ) {
getDataBqs3(cfJd.value, cfCs.value, choose.value.person); await getDataBqs3(cfJd.value, cfCs.value, choose.value.person);
} else { } else {
// getDataBqs(cfJd.value, cfCs.value);
} }
//这段注意
// if (choose.value.person == 1) { await getDatas2(cfJd.value, choose.value.person, cfCs.value);
// getDatas2(cfJd.value, "0", cfCs.value); //0岁传字符串
// } else { loadingss.value = false;
// getDatas2(cfJd.value, choose.value.person - 1, cfCs.value);
// }
getDatas2(cfJd.value, choose.value.person, cfCs.value);
// getDatas2(cfJd.value, choose.value.person, cfCs.value);
addCsChoose();
addCsUnChoose();
// if (choose.value.person == "") {
// cs_dd_arr.value.map((item, index) => {
// DGcreateCs(item, index);
// });
// } else {
// cs_dd_arr.value.map((item, index) => {
// DGcreateCs2(item, index);
// });
// }
}); });
} }
}); });
@ -2614,7 +2709,7 @@ const addCsChoose = () => {
strokeWeight: 2, strokeWeight: 2,
strokeOpacity: 0.8, strokeOpacity: 0.8,
fillColor: fillColor, fillColor: fillColor,
fillOpacity: 0.4, fillOpacity: 0.3,
name: item.name, name: item.name,
zIndex: 99, zIndex: 99,
}); });
@ -2636,12 +2731,13 @@ const addCsUnChoose = () => {
strokeWeight: 2, strokeWeight: 2,
strokeOpacity: 0.8, strokeOpacity: 0.8,
fillColor: fillColor, fillColor: fillColor,
fillOpacity: 0.5, fillOpacity: 0.3,
name: item.name, name: item.name,
zIndex: 99, zIndex: 99,
}); });
map.addOverlay(cs_un_choose_arr.value[index]); map.addOverlay(cs_un_choose_arr.value[index]);
cs_un_choose_arr.value[index].addEventListener("click", () => { cs_un_choose_arr.value[index].addEventListener("click", async () => {
loadingss.value = true;
cfCs.value = item.name; cfCs.value = item.name;
title_cs.value = cfCs.value; title_cs.value = cfCs.value;
sfdd.value = true; sfdd.value = true;
@ -2671,11 +2767,10 @@ const addCsUnChoose = () => {
unChooseList.value.push(itemm); unChooseList.value.push(itemm);
} }
}); });
addCsChoose();
getDataBq(cfJd.value, cfCs.value); addCsUnChoose();
await getDataBq(cfJd.value, cfCs.value);
getDatas2(cfJd.value, choose.value.person, cfCs.value); await getDatas2(cfJd.value, choose.value.person, cfCs.value);
if ( if (
choose.value.person == "残疾人" || choose.value.person == "残疾人" ||
choose.value.person == "低边" || choose.value.person == "低边" ||
@ -2687,11 +2782,9 @@ const addCsUnChoose = () => {
choose.value.person == "孤儿" || choose.value.person == "孤儿" ||
choose.value.person == "特困" choose.value.person == "特困"
) { ) {
getDataBqs3(cfJd.value, cfCs.value, choose.value.person); await getDataBqs3(cfJd.value, cfCs.value, choose.value.person);
} }
loadingss.value = false;
addCsChoose();
addCsUnChoose();
}); });
} }
}); });
@ -3008,14 +3101,16 @@ const reset_font2 = () => {
document.querySelector(".detail").style.transform = document.querySelector(".detail").style.transform =
"scale(" + width / 1920 + "," + height / 1080 + ")"; "scale(" + width / 1920 + "," + height / 1080 + ")";
}; };
onMounted(() => { onMounted(async () => {
// tools.data.set("token", "6b0e380b4a8f46baae4923f83faf670d"); // tools.data.set("token", "6b0e380b4a8f46baae4923f83faf670d");
loadingss.value = true;
reset_font(); reset_font();
initMap(); initMap();
getData(); getData();
getDataBq();
BMAP(); BMAP();
getFwq(); getFwq();
await getDataBq();
loadingss.value = false;
}); });
</script> </script>
@ -3435,6 +3530,138 @@ onMounted(() => {
} }
} }
} }
//加载动画
.loadBody {
width: 100%;
height: 100%;
z-index: 999;
background: rgba(0, 0, 0, 0);
position: absolute;
.load {
box-sizing: border-box;
position: absolute;
left: 50%;
top: 50%;
width: 120px;
height: 120px;
background: rgba(0, 0, 0, 0.3);
border-radius: 8px;
backdrop-filter: blur(2px);
transform: translate(-50%, -50%);
z-index: 99999;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.icon {
//加载
.loading,
.loading > div {
position: relative;
box-sizing: border-box;
}
.loading {
display: block;
font-size: 0;
color: #ffffff;
}
.loading > div {
display: inline-block;
float: none;
background-color: currentColor;
border: 0 solid currentColor;
}
.loading {
width: 50px;
height: 50px;
}
.loading > div {
position: absolute;
width: 8px;
height: 8px;
margin-top: -4px;
margin-left: -4px;
border-radius: 100%;
animation: ball-spin-clockwise-fade 1s infinite linear;
}
.loading > div:nth-child(1) {
top: 5%;
left: 50%;
animation-delay: -0.875s;
}
.loading > div:nth-child(2) {
top: 18.1801948466%;
left: 81.8198051534%;
animation-delay: -0.75s;
}
.loading > div:nth-child(3) {
top: 50%;
left: 95%;
animation-delay: -0.625s;
}
.loading > div:nth-child(4) {
top: 81.8198051534%;
left: 81.8198051534%;
animation-delay: -0.5s;
}
.loading > div:nth-child(5) {
top: 94.9999999966%;
left: 50.0000000005%;
animation-delay: -0.375s;
}
.loading > div:nth-child(6) {
top: 81.8198046966%;
left: 18.1801949248%;
animation-delay: -0.25s;
}
.loading > div:nth-child(7) {
top: 49.9999750815%;
left: 5.0000051215%;
animation-delay: -0.125s;
}
.loading > div:nth-child(8) {
top: 18.179464974%;
left: 18.1803700518%;
animation-delay: 0s;
}
@keyframes ball-spin-clockwise-fade {
50% {
opacity: 0.25;
transform: scale(0.5);
}
100% {
opacity: 1;
transform: scale(1);
}
}
}
.text {
margin-top: 10px;
font-family: PingFangSC, PingFang SC;
font-weight: 600;
font-size: 12px;
color: #ffffff;
line-height: 22px;
letter-spacing: 2px;
text-align: center;
}
}
}
.title { .title {
background-image: url(@/assets/images/map/map_title_bg.png); background-image: url(@/assets/images/map/map_title_bg.png);
@ -3639,3 +3866,4 @@ onMounted(() => {
z-index: 9998; z-index: 9998;
} }
</style> </style>