diff --git a/src/assets/images/map/xqwy.png b/src/assets/images/map/xqwy.png new file mode 100644 index 0000000..d09a38f Binary files /dev/null and b/src/assets/images/map/xqwy.png differ diff --git a/src/assets/images/map/xqwy_map.png b/src/assets/images/map/xqwy_map.png new file mode 100644 index 0000000..e57195a Binary files /dev/null and b/src/assets/images/map/xqwy_map.png differ diff --git a/src/view/img_map/map.js b/src/view/img_map/map.js index 8dd9975..b8d20da 100644 --- a/src/view/img_map/map.js +++ b/src/view/img_map/map.js @@ -14,6 +14,8 @@ import gc from "@/assets/images/map/gc.png"; import whlt from "@/assets/images/map/whlt.png"; import njsw from "@/assets/images/map/njsw.png"; import xxg from "@/assets/images/map/xxg.png"; +import xqwy from "@/assets/images/map/xqwy.png"; +import xqwy_map from "@/assets/images/map/xqwy_map.png"; import j0 from "@/assets/images/map/j0.png"; import j1 from "@/assets/images/map/j1.png"; import j2 from "@/assets/images/map/j2.png"; @@ -64,6 +66,7 @@ export { j9, j10, j11, + xqwy, j1_map, j2_map, j3_map, @@ -73,4 +76,5 @@ export { j9_map, j10_map, j11_map, + xqwy_map, } \ No newline at end of file diff --git a/src/view/sy_map.vue b/src/view/sy_map.vue index bf9f317..f72afe5 100644 --- a/src/view/sy_map.vue +++ b/src/view/sy_map.vue @@ -456,6 +456,7 @@ import { j9, j10, j11, + xqwy, j1_map, j2_map, j3_map, @@ -465,6 +466,7 @@ import { j9_map, j10_map, j11_map, + xqwy_map, } from "./img_map/map.js"; //--------定义参数------- //测绘模式等 @@ -1141,11 +1143,14 @@ const yaosuTotal = ref([ }, { - id: 25, - name: "菜市场", - img: csc, + id: 12, + name: "小区物业", + url: "/api/ggfwyth/ysyzt/getXqWyXx", + img: xqwy, + tooltip: "sssq", + img_map: xqwy_map, wz: true, - click: false, + click: true, }, { id: 26, @@ -1257,10 +1262,11 @@ const yaosuTotal = ref([ }, { id: 36, - name: "小区物业", - img: xxg, - wz: false, + name: "菜市场", + img: csc, + wz: true, click: false, + }, ]); //选中的资源要素 @@ -1474,6 +1480,31 @@ const table_column_list = reactive({ type: "slot", }, ], + xqwy:[ + { + label: "序号", + property: "index", + width: "50", + type: "index", + align: "center", + }, + { + label: "企业名称", + property: "qymc", + }, + { + label: "所在街道", + property: "ssjd", + }, + { + label: "所在社区", + property: "sssq", + }, + { + label: "管辖小区", + property: "xmmc", + }, + ], }); // 表格分页 @@ -3191,12 +3222,14 @@ const changeys = (name) => { name == "初中" || name == "高中" || name == "医院" || - name == "卫生服务中心" + name == "卫生服务中心" || + name == "养老机构" ) { getZyys(url, name, img, img_map, tooltip); } else if (name == "养老机构") { getZyys2(name, img, img_map, tooltip); } else if (name == "小区物业") { + getZyys3(url, name, img, img_map, tooltip); } else { loadingss.value = false; } @@ -3257,13 +3290,50 @@ const getZyys2 = (name, img, img_map, tooltip) => { loadingss.value = false; } }; +//线上接口资源要素(无坐标,需自己匹配) +const zyys_data_xqwy = ref([]); +const getZyys3 = (url, name, img, img_map, tooltip) => { + http.get(url).then((res) => { + if (res.code == 200) { + let zyys_jd = []; + res.data.forEach((itemN) => { + if (!zyys_jd.includes(itemN.ssjd)) { + zyys_jd.push(itemN.ssjd); + } + }); + zyys_jd.forEach((item) => { + loadCs_zyys2(item); + }); + yaosuIcon.value[name] = {}; + yaosuIcon.value[name]["sj"] = []; + yaosuIcon.value[name]["sj"] = res.data; + yaosuIcon.value[name]["sj"].forEach((item, index) => { + + item.img = img; + item.img_map = img_map; + item.overlay = null; + item.center = []; + zyysCenter_xqwy.forEach((center) => { + if (item.sssq == center.name) { + item.center=[...center.center]; + } + }); + }); + yaosuIcon.value[name].sj.forEach((itemm, indexx) => { + createZyys(itemm, indexx, name, tooltip); + }); + } + loadingss.value = false; + }); +}; // 添加资源要素的图标(overlay存放标记点) const createZyys = (polygon, indexx, name, tooltip) => { let properties_change = {}; if (name == "小区物业") { properties_change = { - xqs: "100/", - wys: "100", + xqs: `${polygon.xqsl}/`, + wys: polygon.wysl, + title:polygon.sssq, imgSrc2: polygon.img_map, type: "customOverlay", }; @@ -3294,20 +3364,36 @@ const createZyys = (polygon, indexx, name, tooltip) => { div.style.cursor = "pointer"; div.style.padding = "5px"; div.style.minWidth = "60px"; - div.style.transform = "translateY(5px)"; + div.style.transform = "translateY(30px)"; var xqs = document.createElement("div"); - xqs.style.fontSize = "10px"; + xqs.style.fontSize = "13px"; xqs.style.fontWeight = "600"; - xqs.style.color = "blue"; + xqs.style.color = "#16aaf2"; var wys = document.createElement("div"); - wys.style.fontSize = "10px"; + wys.style.fontSize = "13px"; wys.style.fontWeight = "600"; - wys.style.color = "yellow"; + wys.style.color = "#cebb0e"; xqs.appendChild(document.createTextNode(this.properties.xqs)); wys.appendChild(document.createTextNode(this.properties.wys)); div.appendChild(xqs); div.appendChild(wys); content.appendChild(div); + + var title = document.createElement("div"); + title.style.color = "#333"; + title.style.whiteSpace = "nowrap"; + title.style.MozUserSelect = "none"; + title.style.display = "flex"; + title.style.justifyContent = "center"; + title.style.alignItems = "center"; + title.style.padding = "5px"; + title.style.minWidth = "60px"; + title.style.transform = "translateY(40px)"; + title.style.fontSize = "10px"; + title.style.fontWeight = "600"; + title.style.color = "black"; + title.appendChild(document.createTextNode(this.properties.title)); + content.appendChild(title); } let img2 = document.createElement("img"); img2.style.width = "20px"; @@ -3350,14 +3436,18 @@ const createZyys = (polygon, indexx, name, tooltip) => { break; case "汽车充电桩": break; + case "小区物业": + console.log(polygon); + open_detail_zyys_xqwy(polygon.ssjd,polygon.sssq) + break; default: zyys_choose_cs.value = name; if (zyys_dk.value.length) { zyys_dk.value.forEach((item, index) => { - map.removeOverlay(item); // 清空服务圈 图标 + map.removeOverlay(item); // 清空资源要素地块 }); zyys_center.value.forEach((item, index) => { - map.removeOverlay(item); // 清空服务圈 图标 + map.removeOverlay(item); // 清空资源要素中心点 }); } if (polygon.fgfwrs.length == 0) { @@ -3376,14 +3466,36 @@ const createZyys = (polygon, indexx, name, tooltip) => { } ); }; +const open_detail_zyys_xqwy = (xzjd,csq) => { + tableType.title='小区物业'; + tableType.columns=table_column_list.xqwy + dialogShow.value = true; + http + .get( + `/api/ggfwyth/ysyzt/listXqWyxx?page=${pagination.currentPage}&size=${pagination.pageSize}&xzjd=${xzjd}&csq=${csq}` + ) + .then((res) => { + if (res.code == 200) { + + tableType.data = res.data; + res.data.forEach((item, index) => { + item.index = + index + 1 + (pagination.currentPage - 1) * pagination.pageSize; + }); + pagination.total = res.count; + } + }); +}; //资源要素(获取对应村社的地块) const zyys_data = ref({ point: [], center: [], }); -//资源要素(学校,医院)获取对应街道村社 +//资源要素(学校,医院,小区物业)获取对应街道村社 const zyysCenter = reactive([]); const zyysDk = reactive([]); +const zyysCenter_xqwy = reactive([]); +//小学,初中等 const loadCs_zyys = async (jdname) => { cssj.forEach((item, index) => { if (item.name == jdname) { @@ -3420,6 +3532,27 @@ const loadCs_zyys = async (jdname) => { } } }; +//小区物业等 +const loadCs_zyys2 = async (jdname) => { + cssj.forEach((item, index) => { + if (item.name == jdname) { + csqk.value = item.sj; + } + }); + console.log(22222,csqk.value.features); + + for (let v of csqk.value.features) { + if (v.geometry.coordinates.length > 1) { + } else { + zyysCenter_xqwy.push({ + id: v.id, + name: v.properties.name, + jdname: jdname, + center: v.properties.center, + }); + } + } +}; const get_dk_zyys = async (sj, xd, ssly) => { zyys_dk.value.length = 0; zyys_center.value.length = 0; @@ -3538,7 +3671,7 @@ const xr_dk_center_zyys = async () => { const zyys_table = reactive({ town: "", committee: "", - xd: "",//表示请求的类型 + xd: "", //表示请求的类型 }); const Xr_zyysNum = (polygon, indexx) => { function createLabelDOM() { @@ -3610,6 +3743,7 @@ const Xr_zyysNum = (polygon, indexx) => { console.log(polygon); // cfCsZs.value = polygon.name; tableType.type = false; + tableType.title='人员列表'; tableType.columns = table_column_list.zxs; zyys_table.town = polygon.town; zyys_table.committee = polygon.committee; @@ -3712,6 +3846,7 @@ const to_jd = async (item_name) => { //详情 const open_detail = () => { tableType.type = true; + tableType.title='人员列表'; tableType.columns = table_column_list.sxt; let age = ""; let tagId; @@ -3800,6 +3935,9 @@ const openCamera = () => { }; //打开人物详情页面 const openMessage = (e) => { + if(tableType.title=='小区物业'){ + return + } message.value = e; openD.value = true; reset_font2();