This commit is contained in:
parent
f0f8d78d9e
commit
c58ef6c6b9
|
|
@ -11,8 +11,13 @@
|
|||
<div class="title_line"></div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div class="content_item" v-for="(item, index) in personTotal" :class="{ choose: item.id == choose.person }"
|
||||
@click="getData(item.id, item.age)" :key="index">
|
||||
<div
|
||||
class="content_item"
|
||||
v-for="(item, index) in personTotal"
|
||||
:class="{ choose: item.id == choose.person }"
|
||||
@click="getData(item.id, item.age)"
|
||||
:key="index"
|
||||
>
|
||||
<div class="content_item_name">{{ item.ages }}</div>
|
||||
<div class="content_item_value">{{ item.rksl }}</div>
|
||||
</div>
|
||||
|
|
@ -24,8 +29,13 @@
|
|||
<div class="title_line"></div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div class="content_item" v-for="(item, index) in tsbqTotal" :class="{ choose: item.id == choose.bq }"
|
||||
@click="changebq(item.id)" :key="index">
|
||||
<div
|
||||
class="content_item"
|
||||
v-for="(item, index) in tsbqTotal"
|
||||
:class="{ choose: item.id == choose.bq }"
|
||||
@click="changebq(item.id)"
|
||||
:key="index"
|
||||
>
|
||||
<div class="content_item_name">{{ item.name }}</div>
|
||||
<div class="content_item_value">{{ item.value }}</div>
|
||||
</div>
|
||||
|
|
@ -39,11 +49,19 @@
|
|||
<div class="title_line"></div>
|
||||
</div>
|
||||
<div class="jbggfwq_content">
|
||||
<div class="jbggfwq_content_item" v-for="(item, index) in jbfwqTotal" :key="index">
|
||||
<div
|
||||
class="jbggfwq_content_item"
|
||||
v-for="(item, index) in jbfwqTotal"
|
||||
:key="index"
|
||||
>
|
||||
<div class="jbggfwq_content_item_left">{{ item.name }}</div>
|
||||
<div class="jbggfwq_content_item_right">
|
||||
<div class="jbggfwq_content_item_right_item" v-for="itemm in item.child"
|
||||
:class="{ choose: itemm.id == choose.fwq }" @click="changeFwq(itemm.id, itemm.fwqList, itemm.center)">
|
||||
<div
|
||||
class="jbggfwq_content_item_right_item"
|
||||
v-for="itemm in item.child"
|
||||
:class="{ choose: itemm.id == choose.fwq }"
|
||||
@click="changeFwq(itemm.id, itemm.fwqList, itemm.center)"
|
||||
>
|
||||
{{ itemm.name }}
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -56,8 +74,13 @@
|
|||
<div class="title_line"></div>
|
||||
</div>
|
||||
<div class="zyys_content">
|
||||
<div class="zyys_content_item" v-for="(item, index) in yaosuTotal"
|
||||
:class="{ choose: item.id == choose.yaosu, wz: item.wz == true }" @click="changeys(item.id)" :key="index">
|
||||
<div
|
||||
class="zyys_content_item"
|
||||
v-for="(item, index) in yaosuTotal"
|
||||
:class="{ choose: item.id == choose.yaosu, wz: item.wz == true }"
|
||||
@click="changeys(item.id)"
|
||||
:key="index"
|
||||
>
|
||||
<img :src="item.img" class="zyys_content_item_left" />
|
||||
<div class="zyys_content_item_right">{{ item.name }}</div>
|
||||
</div>
|
||||
|
|
@ -119,6 +142,8 @@ const cs_name_arr = ref([]);
|
|||
const cs_number_name_arr = ref([]);
|
||||
const cs_choose_arr = ref([]);
|
||||
const cs_un_choose_arr = ref([]);
|
||||
const cs_dd_arr = ref([]);
|
||||
|
||||
const cfjiedao = ref("");
|
||||
const jrcs = ref(false);
|
||||
const title_choose = ref("");
|
||||
|
|
@ -171,6 +196,9 @@ const csh = () => {
|
|||
cs_qk_arr.value.forEach((item, index) => {
|
||||
map.removeOverlay(cs_qk_arr.value[index]);
|
||||
});
|
||||
cs_dd_arr.value.forEach((item, index) => {
|
||||
map.removeOverlay(cs_dd_arr.value[index]);
|
||||
});
|
||||
goMapCenter([119.178783, 29.034583], 11);
|
||||
};
|
||||
//选中社区
|
||||
|
|
@ -452,7 +480,12 @@ const addPolygonCounty = () => {
|
|||
}
|
||||
});
|
||||
console.log(jrcs.value);
|
||||
if ((choose.value.person = 9999)) {
|
||||
addCs2();
|
||||
} else {
|
||||
addCs();
|
||||
}
|
||||
|
||||
goMapCenter(jdCenter, 13);
|
||||
} else {
|
||||
title_choose.value = "";
|
||||
|
|
@ -468,6 +501,9 @@ const addPolygonCounty = () => {
|
|||
cs_un_choose_arr.value.forEach((item, index) => {
|
||||
map.removeOverlay(cs_un_choose_arr.value[index]);
|
||||
});
|
||||
cs_dd_arr.value.forEach((item, index) => {
|
||||
map.removeOverlay(cs_dd_arr.value[index]);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -538,6 +574,11 @@ const addPolygonCountyCs = () => {
|
|||
cs_qk_arr.value[index].addEventListener("click", () => {
|
||||
console.log(item.name);
|
||||
console.log(111, xkzDk);
|
||||
xkzCenter.forEach((a, b) => {
|
||||
if (a.name == item.name) {
|
||||
cs_dd_arr.value.push(a);
|
||||
}
|
||||
});
|
||||
chooseCsList.value.length = 0;
|
||||
unChooseList.value.length = 0;
|
||||
xkzDk.forEach((itemm, indexx) => {
|
||||
|
|
@ -551,6 +592,15 @@ const addPolygonCountyCs = () => {
|
|||
cs_qk_arr.value.forEach((item, index) => {
|
||||
map.removeOverlay(cs_qk_arr.value[index]);
|
||||
});
|
||||
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.map((item, index) => {
|
||||
DGcreateCs(item, index);
|
||||
});
|
||||
console.log("chooseCsList.value", chooseCsList.value);
|
||||
console.log("unChooseList.value", unChooseList.value);
|
||||
addCsChoose();
|
||||
|
|
@ -602,6 +652,9 @@ const addCsUnChoose = () => {
|
|||
});
|
||||
map.addOverlay(cs_un_choose_arr.value[index]);
|
||||
cs_un_choose_arr.value[index].addEventListener("click", () => {
|
||||
cs_dd_arr.value.forEach((item, index) => {
|
||||
map.removeOverlay(cs_dd_arr.value[index]);
|
||||
});
|
||||
cs_un_choose_arr.value.forEach((item, index) => {
|
||||
map.removeOverlay(cs_un_choose_arr.value[index]);
|
||||
});
|
||||
|
|
@ -611,6 +664,12 @@ const addCsUnChoose = () => {
|
|||
title_choose.value = title_choose.value.slice(0, -4);
|
||||
chooseCsList.value.length = 0;
|
||||
unChooseList.value.length = 0;
|
||||
cs_dd_arr.value = [];
|
||||
xkzCenter.forEach((a, b) => {
|
||||
if (a.name == item.name) {
|
||||
cs_dd_arr.value.push(a);
|
||||
}
|
||||
});
|
||||
xkzDk.forEach((itemm, indexx) => {
|
||||
if (itemm.name == item.name) {
|
||||
chooseCsList.value.push(itemm);
|
||||
|
|
@ -622,6 +681,9 @@ const addCsUnChoose = () => {
|
|||
cs_un_choose_arr.value.forEach((item, index) => {
|
||||
map.removeOverlay(cs_qk_arr.value[index]);
|
||||
});
|
||||
cs_dd_arr.value.map((item1, index1) => {
|
||||
DGcreateCs(item1, index1);
|
||||
});
|
||||
addCsChoose();
|
||||
addCsUnChoose();
|
||||
});
|
||||
|
|
@ -728,21 +790,21 @@ const createCustomOverlayJd2 = (polygon, indexx) => {
|
|||
div.appendChild(number);
|
||||
number.appendChild(document.createTextNode(this.properties.number));
|
||||
content.appendChild(div);
|
||||
// div.onclick = function () {
|
||||
// let jdCenter = [];
|
||||
// if (polygon.name == "溪口镇") {
|
||||
// title_choose.value = title_choose.value + `>${polygon.name}`;
|
||||
// loadCs();
|
||||
// addPolygonCountyCs();
|
||||
// mapTownCount.map((item) => {
|
||||
// if (item.name == "溪口镇") {
|
||||
// jdCenter = item.center;
|
||||
// }
|
||||
// });
|
||||
// addCs2();
|
||||
// goMapCenter(jdCenter, 14);
|
||||
// }
|
||||
// };
|
||||
div.onclick = function () {
|
||||
let jdCenter = [];
|
||||
if (polygon.name == "溪口镇") {
|
||||
title_choose.value = title_choose.value + `>${polygon.name}`;
|
||||
loadCs();
|
||||
addPolygonCountyCs();
|
||||
mapTownCount.map((item) => {
|
||||
if (item.name == "溪口镇") {
|
||||
jdCenter = item.center;
|
||||
}
|
||||
});
|
||||
addCs2();
|
||||
goMapCenter(jdCenter, 14);
|
||||
}
|
||||
};
|
||||
return content;
|
||||
}
|
||||
jdm_number_arr.value[indexx] = new BMapGL.CustomOverlay(createLabelDOM, {
|
||||
|
|
@ -814,20 +876,6 @@ const createCs2 = (polygon, indexx) => {
|
|||
|
||||
content.appendChild(div);
|
||||
content.appendChild(img2);
|
||||
// div.onclick = function () {
|
||||
// let jdCenter = [];
|
||||
// if (polygon.name == "溪口镇") {
|
||||
// title_choose.value = title_choose.value + `>${polygon.name}`;
|
||||
// loadCs();
|
||||
// addPolygonCountyCs();
|
||||
// mapTownCount.map((item) => {
|
||||
// if (item.name == "溪口镇") {
|
||||
// jdCenter = item.center;
|
||||
// }
|
||||
// });
|
||||
// goMapCenter(jdCenter, 14);
|
||||
// }
|
||||
// };
|
||||
return content;
|
||||
}
|
||||
cs_number_name_arr.value[indexx] = new BMapGL.CustomOverlay(createLabelDOM, {
|
||||
|
|
@ -894,6 +942,58 @@ const createCs = (polygon, indexx) => {
|
|||
});
|
||||
map.addOverlay(cs_name_arr.value[indexx]);
|
||||
};
|
||||
//添加单个村社
|
||||
const DGcreateCs = (polygon, indexx) => {
|
||||
console.log("ppppppppp", polygon);
|
||||
function createLabelDOM() {
|
||||
var content = document.createElement("div");
|
||||
content.style.display = "flex";
|
||||
content.style.flexDirection = "column";
|
||||
content.style.alignItems = "center";
|
||||
content.style.zIndex = BMapGL.Overlay.getZIndex(this.point.lat);
|
||||
|
||||
var div = document.createElement("div");
|
||||
div.style.color = "#333";
|
||||
div.style.whiteSpace = "nowrap";
|
||||
div.style.MozUserSelect = "none";
|
||||
div.style.display = "flex";
|
||||
div.style.justifyContent = "center";
|
||||
div.style.alignItems = "center";
|
||||
div.style.cursor = "pointer";
|
||||
div.style.padding = "5px";
|
||||
div.style.minWidth = "60px";
|
||||
div.style.background = `url(${xcbg}) no-repeat 0/100% 100%`;
|
||||
div.style.transform = "translateY(50px)";
|
||||
div.setAttribute("name", this.properties.title);
|
||||
|
||||
var title = document.createElement("div");
|
||||
title.style.fontSize = "10px";
|
||||
title.style.fontWeight = "600";
|
||||
title.style.color = "#000000";
|
||||
div.appendChild(title);
|
||||
title.appendChild(document.createTextNode(this.properties.title));
|
||||
content.appendChild(div);
|
||||
let img2 = document.createElement("img");
|
||||
img2.style.width = "20px";
|
||||
img2.style.height = "26px";
|
||||
img2.src = this.properties.imgSrc2;
|
||||
|
||||
content.appendChild(div);
|
||||
content.appendChild(img2);
|
||||
return content;
|
||||
}
|
||||
cs_dd_arr.value[indexx] = new BMapGL.CustomOverlay(createLabelDOM, {
|
||||
point: new BMapGL.Point(...polygon.center),
|
||||
opacity: 0.5,
|
||||
offsetY: 0,
|
||||
properties: {
|
||||
title: polygon.name,
|
||||
imgSrc2: dwd,
|
||||
type: "customOverlay",
|
||||
},
|
||||
});
|
||||
map.addOverlay(cs_dd_arr.value[indexx]);
|
||||
};
|
||||
//创建公共服务圈
|
||||
const addggfwq = () => {
|
||||
fwqList.value.map((item, index) => {
|
||||
|
|
@ -1056,7 +1156,6 @@ const changeRs = (id) => {
|
|||
// addJd();
|
||||
// }
|
||||
} else {
|
||||
console.log(8888);
|
||||
// if(chooseArr.value.includes("jd_number")){
|
||||
// chooseArr.value = chooseArr.value.filter((item) => item !== "jd_number");
|
||||
// chooseArr.value.push("jd_noNumber");
|
||||
|
|
@ -1830,6 +1929,7 @@ const yaosuTotal = ref([
|
|||
},
|
||||
]);
|
||||
const getData = async (i, e) => {
|
||||
console.log('iiii',i);
|
||||
await http
|
||||
.get(`/api/ggfwyth/ysyzt/getXzjdrksl?age=${e || ""}`)
|
||||
.then((res) => {
|
||||
|
|
@ -1871,16 +1971,13 @@ const getDatas = async (e) => {
|
|||
res.data.committee.map((item) => {
|
||||
xkzCenter.map((items) => {
|
||||
if (item.committee == items.name) {
|
||||
items.number = item.rksl
|
||||
items.number = item.rksl;
|
||||
}
|
||||
});
|
||||
});
|
||||
console.log(xkzCenter);
|
||||
}
|
||||
})
|
||||
})
|
||||
console.log(xkzCenter);
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
};
|
||||
const reset_font = () => {
|
||||
let width = document.documentElement.clientWidth || document.body.clientWidth;
|
||||
|
|
@ -1902,7 +1999,7 @@ onMounted(() => {
|
|||
reset_font();
|
||||
initMap();
|
||||
getData();
|
||||
getDatas('溪口镇')
|
||||
getDatas("溪口镇");
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
|
|
@ -1930,13 +2027,17 @@ onMounted(() => {
|
|||
bottom: 0;
|
||||
width: 520px;
|
||||
height: 960px;
|
||||
background: linear-gradient(270deg,
|
||||
background: linear-gradient(
|
||||
270deg,
|
||||
rgba(0, 52, 131, 0.69) 0%,
|
||||
rgba(0, 32, 83, 0.77) 50%,
|
||||
rgba(0, 60, 131, 0.74) 100%),
|
||||
radial-gradient(128% 99% at 100% 46%,
|
||||
rgba(0, 60, 131, 0.74) 100%
|
||||
),
|
||||
radial-gradient(
|
||||
128% 99% at 100% 46%,
|
||||
rgba(0, 48, 125, 0.29) 0%,
|
||||
rgba(0, 61, 134, 0.42) 100%);
|
||||
rgba(0, 61, 134, 0.42) 100%
|
||||
);
|
||||
box-shadow: inset 0px 0px 56px 0px rgba(173, 221, 255, 0.5);
|
||||
backdrop-filter: blur(3px);
|
||||
padding: 30px 26px;
|
||||
|
|
@ -2094,13 +2195,17 @@ onMounted(() => {
|
|||
bottom: 0;
|
||||
width: 520px;
|
||||
height: 960px;
|
||||
background: linear-gradient(270deg,
|
||||
background: linear-gradient(
|
||||
270deg,
|
||||
rgba(0, 52, 131, 0.69) 0%,
|
||||
rgba(0, 32, 83, 0.77) 50%,
|
||||
rgba(0, 60, 131, 0.74) 100%),
|
||||
radial-gradient(128% 99% at 100% 46%,
|
||||
rgba(0, 60, 131, 0.74) 100%
|
||||
),
|
||||
radial-gradient(
|
||||
128% 99% at 100% 46%,
|
||||
rgba(0, 48, 125, 0.29) 0%,
|
||||
rgba(0, 61, 134, 0.42) 100%);
|
||||
rgba(0, 61, 134, 0.42) 100%
|
||||
);
|
||||
box-shadow: inset 0px 0px 56px 0px rgba(173, 221, 255, 0.5);
|
||||
backdrop-filter: blur(3px);
|
||||
padding: 30px 26px;
|
||||
|
|
@ -2252,10 +2357,12 @@ onMounted(() => {
|
|||
// line-height: 44px;
|
||||
letter-spacing: 4px;
|
||||
margin-bottom: 15px;
|
||||
background: linear-gradient(180deg,
|
||||
background: linear-gradient(
|
||||
180deg,
|
||||
#ffffff 0%,
|
||||
#ffffff 40%,
|
||||
#00ffff 100%);
|
||||
#00ffff 100%
|
||||
);
|
||||
/* 使文字没有背景颜色的背景 */
|
||||
background-clip: text;
|
||||
/* 为了兼容性，添加渐变背景到IE */
|
||||
|
|
|
|||
Loading…
Reference in New Issue