From 94358fffa5a8e089e3fe56b8ca0818ecfc694f12 Mon Sep 17 00:00:00 2001 From: yaoyuhao Date: Wed, 14 Aug 2024 14:51:18 +0800 Subject: [PATCH] loading --- src/assets/images/sxt_detail.png | Bin 0 -> 9100 bytes src/assets/images/sxt_map.png | Bin 0 -> 1653 bytes src/view/dialog/dialogMapDp.vue | 24 +- src/view/person/index.vue | 12 +- src/view/sy_map.vue | 419 +++++++++++++++++++++++++------ 5 files changed, 364 insertions(+), 91 deletions(-) create mode 100644 src/assets/images/sxt_detail.png create mode 100644 src/assets/images/sxt_map.png diff --git a/src/assets/images/sxt_detail.png b/src/assets/images/sxt_detail.png new file mode 100644 index 0000000000000000000000000000000000000000..a1dedf10361ad8c0534fa2e8ae723164a31d0416 GIT binary patch literal 9100 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 literal 0 HcmV?d00001 diff --git a/src/view/dialog/dialogMapDp.vue b/src/view/dialog/dialogMapDp.vue index e351c81..3df0c0d 100644 --- a/src/view/dialog/dialogMapDp.vue +++ b/src/view/dialog/dialogMapDp.vue @@ -41,6 +41,7 @@
{ + return {}; + }, + }, + loadTable: { + type: Boolean, + default: () => { + return false; + }, }, }); -const emit = defineEmits(["close", "handle"]); +const emit = defineEmits(["close", "handle", "loadTables"]); const handleRowClick = (row, column, event) => { // row 是当前行的数据 - console.log(row); - emit("openMessage", {nm: row.nm, identNo: row.identNo}); + emit("openMessage", { nm: row.nm, identNo: row.identNo }); // router.push({ // path: `/home/index/person`, // query: {nm: row.nm, identNo: row.identNo,type:'map'}, @@ -158,6 +166,7 @@ const handleRowClick = (row, column, event) => { }; // 详情弹框 const dialogShow = ref(); +const loadT = ref(); const data = reactive({ title: "", columns: [], @@ -173,7 +182,7 @@ watch( () => props.dialogShow, (newVal, oldVal) => { dialogShow.value = newVal; - // data.tableData = props.tableData; + loadT.value = newVal; data.columns = props.columns; } ); @@ -181,6 +190,7 @@ watch( () => props.tableData, (newVal, oldVal) => { data.tableData = props.tableData; + loadT.value = false; tableKey.value = Math.random(); } ); @@ -319,10 +329,10 @@ const handle = (current) => { .custom-table-font { 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; } -:deep(.el-pagination ){ +:deep(.el-pagination) { transform: scale(0.8); } diff --git a/src/view/person/index.vue b/src/view/person/index.vue index cf0e93e..c9ab514 100644 --- a/src/view/person/index.vue +++ b/src/view/person/index.vue @@ -98,10 +98,8 @@

返回

-
- - - +
+
@@ -1206,9 +1204,13 @@ onMounted(() => { } .videoCamera { position: absolute; - top: 8px; + top: -10px; right: 30px; cursor: pointer; + img{ + width: 46px; + height: 46px; + } } .widu { min-width: 40px !important; diff --git a/src/view/sy_map.vue b/src/view/sy_map.vue index 6f4aa22..e11dc4b 100644 --- a/src/view/sy_map.vue +++ b/src/view/sy_map.vue @@ -169,11 +169,14 @@
未居住
+ + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
数据加载中...
+
+
@@ -215,6 +236,7 @@ import j7 from "@/assets/images/map/j7.png"; import j8 from "@/assets/images/map/j8.png"; import j9 from "@/assets/images/map/j9.png"; import j10 from "@/assets/images/map/j10.png"; +import j11 from "@/assets/images/sxt_map.png"; import dwd from "@/assets/images/map/dwd.png"; import fwqbg1 from "@/assets/images/map/qlv.png"; import fwqbg2 from "@/assets/images/map/qlan.png"; @@ -232,10 +254,10 @@ import xcbg from "@/assets/images/map/xcbg.png"; import AED from "@/assets/images/map/AED.png"; import Dialog from "./dialog/dialogMapDp.vue"; import personDetail from "./person/index.vue"; -import { ElLoading } from "element-plus"; //--------定义参数------- //加载 -var loading; +const loadingss = ref(false); +const loadTable = ref(false); //是否打开人物详情 const openD = ref(true); const message = ref({}); @@ -673,7 +695,7 @@ const yaosuTotal = ref([ { id: 11, name: "摄像头", - img: j0, + img: j11, wz: false, url: "/api/ggfwyth/ysyzt/getJashsxt", }, @@ -821,6 +843,7 @@ const tableType = reactive({ { label: "", property: "sxt", + width: "50px", type: "slot", }, ], @@ -961,14 +984,10 @@ const buten = async (item) => { } } } else { - loading = ElLoading.service({ - lock: true, - text: "加载中...", - background: "rgba(0, 0, 0, 0)", - }); + loadingss.value = true; await getData(item.age); await getDatas(cfJd.value, item.age); - loading.close(); + loadingss.value = false; } }; //点击特殊标签(关键字存name) @@ -1005,12 +1024,9 @@ const buten2 = async (item) => { } } } else { - loading = ElLoading.service({ - lock: true, - text: "加载中...", - background: "rgba(0, 0, 0, 0)", - }); - getDataBqs(cfJd.value, cfCs.value, item.id); + loadingss.value = true; + await getDataBqs(cfJd.value, cfCs.value, item.id); + loadingss.value = false; } }; //人口 @@ -1106,7 +1122,7 @@ const getDatas = async (e, i, y = true) => { if (i == "9999") { i = ""; } - await http + http .get(`/api/ggfwyth/ysyzt/getCssrksl?town=${e}&age=${i || ""}`) .then((res) => { if (res.code == 200) { @@ -1227,8 +1243,12 @@ const getDatas = async (e, i, y = true) => { } else { if (y) { if (choose.value.person == "") { + console.log(1111111111); + addCs(); } else { + console.log(2222222222); + addCs2(); } } @@ -1434,8 +1454,10 @@ const getDataBq = async (jd, cs) => { }; const getDataBqs = async (jd, cs, bq) => { await getDataBqJD(bq); - await getDataBqs2(cfJd.value, cfCs.value, bq); - loading.close(); + if (cfJd.value == "") { + } else { + await getDataBqs2(cfJd.value, cfCs.value, bq); + } }; //特殊标签获取街道内部人数 const getDataBqs2 = async (jd, cs, bq) => { @@ -1580,6 +1602,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) => { let data = {}; @@ -1717,26 +1823,28 @@ const createZyys = (polygon, indexx, name) => { }; //----------资源要素------------ //点击街道,回到街道 -const to_jd = (item_name) => { +const to_jd = async (item_name) => { + loadingss.value = true; clear(); title_jd.value = item_name; map.removeEventListener("click", markera); if (currentMarker !== null) { map.removeOverlay(currentMarker); } - - // townName.value = item_name; - // if (item_name == cfJd.value) { - // } else { - // console.log(111, choose.value.person); cfJd.value = item_name; let jdCenter = []; BMAP(); loadCs(item_name); addPolygonCountyCs(); + mapTownCount.map((itemm) => { + if (itemm.name == item_name) { + jdCenter = itemm.center; + } + }); + goMapCenter(jdCenter, 13); getDataBq(cfJd.value, ""); if (choose.value.person == "") { - getDatas(cfJd.value, ""); + await getDatas(cfJd.value, ""); } if ( choose.value.person == "残疾人" || @@ -1749,33 +1857,17 @@ const to_jd = (item_name) => { choose.value.person == "孤儿" || choose.value.person == "特困" ) { - getDataBqs2(cfJd.value, cfCs.value, choose.value.person); - getDatas(cfJd.value, "", false); + await getDatas(cfJd.value, "", false); + getDataBqs4(cfJd.value, cfCs.value, choose.value.person); } else if (choose.value.person != "") { if (choose.value.person == "9999") { - getDatas(cfJd.value, ""); + await getDatas(cfJd.value, ""); + loadingss.value = false; } else { - // if (choose.value.person == 1) { - // getDatas(cfJd.value, "0"); //0岁传字符串 - // } else { - // getDatas(cfJd.value, choose.value.person); - // } - getDatas(cfJd.value, choose.value.person); + await getDatas(cfJd.value, choose.value.person); + loadingss.value = false; } } - // 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 = () => { @@ -1783,8 +1875,8 @@ const open_detail = () => { let tagId; if (choose.value.person == "9999") { age = ""; - person_detail(age); dialogShow.value = true; + person_detail(age); } else if (choose.value.person == "6666") { age = ""; } else if ( @@ -1804,12 +1896,14 @@ const open_detail = () => { tagId = item.tagId; } }); - person_detail(age, tagId); dialogShow.value = true; + + person_detail(age, tagId); } else { + dialogShow.value = true; + age = choose.value.person; person_detail(age); - dialogShow.value = true; } }; const close = () => { @@ -1892,6 +1986,7 @@ const person_detail = (age, tagId) => { index + 1 + (pagination.currentPage - 1) * pagination.pageSize; }); pagination.total = res.count; + } }); }; @@ -2288,11 +2383,7 @@ const addPolygonCounty = () => { // townName.value = item.name; if (item.name == cfJd.value) { } else { - loading = ElLoading.service({ - lock: true, - text: "加载中...", - background: "rgba(0, 0, 0, 0)", - }); + loadingss.value = true; clear(); xkzDk.length = 0; cfJd.value = item.name; @@ -2309,6 +2400,7 @@ const addPolygonCounty = () => { await getDataBq(cfJd.value, ""); if (choose.value.person == "") { await getDatas(cfJd.value, ""); + loadingss.value = false; } if ( choose.value.person == "残疾人" || @@ -2321,21 +2413,22 @@ const addPolygonCounty = () => { choose.value.person == "孤儿" || choose.value.person == "特困" ) { - getDataBqs2(cfJd.value, cfCs.value, choose.value.person); - getDatas(cfJd.value, "", false); + await getDatas(cfJd.value, "", false); + //使用await把loading放外面,没效果,所以把loading放接口里面 + getDataBqs4(cfJd.value, cfCs.value, choose.value.person); } else if (choose.value.person != "") { if (choose.value.person == "9999") { await getDatas(cfJd.value, ""); + loadingss.value = false; } else { await getDatas(cfJd.value, choose.value.person); + loadingss.value = false; } } if (title_jd.value == item.name) { } else { title_jd.value = item.name; } - - loading.close(); } }); } @@ -2533,17 +2626,13 @@ const addPolygonCountyCs = () => { strokeWeight: 2, strokeOpacity: 0.8, fillColor: fillColor, - fillOpacity: 0.5, + fillOpacity: 0.3, name: item.name, zIndex: 99, }); map.addOverlay(cs_qk_arr.value[index]); cs_qk_arr.value[index].addEventListener("click", async () => { - loading = ElLoading.service({ - lock: true, - text: "数据加载中...", - background: "rgba(0, 0, 0, 0)", - }); + loadingss.value = true; cs_dd_arr.value = []; cfCs.value = item.name; title_cs.value = item.name; @@ -2592,7 +2681,7 @@ const addPolygonCountyCs = () => { await getDatas2(cfJd.value, choose.value.person, cfCs.value); - loading.close(); + loadingss.value = false; }); } }); @@ -2612,7 +2701,7 @@ const addCsChoose = () => { strokeWeight: 2, strokeOpacity: 0.8, fillColor: fillColor, - fillOpacity: 0.4, + fillOpacity: 0.3, name: item.name, zIndex: 99, }); @@ -2634,17 +2723,13 @@ const addCsUnChoose = () => { strokeWeight: 2, strokeOpacity: 0.8, fillColor: fillColor, - fillOpacity: 0.5, + fillOpacity: 0.3, name: item.name, zIndex: 99, }); map.addOverlay(cs_un_choose_arr.value[index]); cs_un_choose_arr.value[index].addEventListener("click", async () => { - loading = ElLoading.service({ - lock: true, - text: "数据加载中...", - background: "rgba(0, 0, 0, 0)", - }); + loadingss.value = true; cfCs.value = item.name; title_cs.value = cfCs.value; sfdd.value = true; @@ -2691,7 +2776,7 @@ const addCsUnChoose = () => { ) { await getDataBqs3(cfJd.value, cfCs.value, choose.value.person); } - loading.close(); + loadingss.value = false; }); } }); @@ -3008,14 +3093,16 @@ const reset_font2 = () => { document.querySelector(".detail").style.transform = "scale(" + width / 1920 + "," + height / 1080 + ")"; }; -onMounted(() => { +onMounted(async () => { // tools.data.set("token", "6b0e380b4a8f46baae4923f83faf670d"); + loadingss.value = true; reset_font(); initMap(); getData(); - getDataBq(); BMAP(); getFwq(); + await getDataBq(); + loadingss.value = false; }); @@ -3435,6 +3522,179 @@ 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.la-dark { + color: #333; + } + + .loading > div { + display: inline-block; + float: none; + background-color: currentColor; + border: 0 solid currentColor; + } + + .loading { + width: 50px; + height: 50px; + } + + .loading > div { + position: absolute; + top: 50%; + left: 50%; + 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; + } + + .loading.la-sm { + width: 16px; + height: 16px; + } + + .loading.la-sm > div { + width: 4px; + height: 4px; + margin-top: -2px; + margin-left: -2px; + } + + .loading.la-2x { + width: 64px; + height: 64px; + } + + .loading.la-2x > div { + width: 16px; + height: 16px; + margin-top: -8px; + margin-left: -8px; + } + + .loading.la-3x { + width: 96px; + height: 96px; + } + + .loading.la-3x > div { + width: 24px; + height: 24px; + margin-top: -12px; + margin-left: -12px; + } + + @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 { background-image: url(@/assets/images/map/map_title_bg.png); @@ -3639,3 +3899,4 @@ onMounted(() => { z-index: 9998; } +