This commit is contained in:
duanxiaohai 2024-07-24 10:07:37 +08:00
commit cf47ab9da9
1 changed files with 64 additions and 50 deletions

View File

@ -8,13 +8,8 @@
<div class="title_line"></div> <div class="title_line"></div>
</div> </div>
<div class="content"> <div class="content">
<div <div class="content_item" v-for="(item, index) in personTotal" :class="{ choose: item.id == choose.person }"
class="content_item" @click="changeRs(item.id)" :key="index">
v-for="(item, index) in personTotal"
:class="{ choose: item.id == choose.person }"
@click="changeRs(item.id)"
:key="index"
>
<div class="content_item_name">{{ item.name }}</div> <div class="content_item_name">{{ item.name }}</div>
<div class="content_item_value">{{ item.value }}</div> <div class="content_item_value">{{ item.value }}</div>
</div> </div>
@ -26,13 +21,8 @@
<div class="title_line"></div> <div class="title_line"></div>
</div> </div>
<div class="content"> <div class="content">
<div <div class="content_item" v-for="(item, index) in tsbqTotal" :class="{ choose: item.id == choose.bq }"
class="content_item" @click="changebq(item.id)" :key="index">
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_name">{{ item.name }}</div>
<div class="content_item_value">{{ item.value }}</div> <div class="content_item_value">{{ item.value }}</div>
</div> </div>
@ -46,19 +36,11 @@
<div class="title_line"></div> <div class="title_line"></div>
</div> </div>
<div class="jbggfwq_content"> <div class="jbggfwq_content">
<div <div class="jbggfwq_content_item" v-for="(item, index) in jbfwqTotal" :key="index">
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_left">{{ item.name }}</div>
<div class="jbggfwq_content_item_right"> <div class="jbggfwq_content_item_right">
<div <div class="jbggfwq_content_item_right_item" v-for="itemm in item.child"
class="jbggfwq_content_item_right_item" :class="{ choose: itemm.id == choose.fwq }" @click="changeFwq(itemm.id, itemm.fwqList, itemm.center)">
v-for="itemm in item.child"
:class="{ choose: itemm.id == choose.fwq }"
@click="changeFwq(itemm.id, itemm.fwqList, itemm.center)"
>
{{ itemm.name }} {{ itemm.name }}
</div> </div>
</div> </div>
@ -71,13 +53,8 @@
<div class="title_line"></div> <div class="title_line"></div>
</div> </div>
<div class="zyys_content"> <div class="zyys_content">
<div <div class="zyys_content_item" v-for="(item, index) in yaosuTotal"
class="zyys_content_item" :class="{ choose: item.id == choose.yaosu, wz: item.wz == true }" @click="changeys(item.id)" :key="index">
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" /> <img :src="item.img" class="zyys_content_item_left" />
<div class="zyys_content_item_right">{{ item.name }}</div> <div class="zyys_content_item_right">{{ item.name }}</div>
</div> </div>
@ -96,6 +73,7 @@ import {
computed, computed,
defineProps, defineProps,
watch, watch,
nextTick,
} from "vue"; } from "vue";
import mapTown from "@/assets/json/ly.json"; import mapTown from "@/assets/json/ly.json";
import xkz from "@/assets/json/xkz.json"; import xkz from "@/assets/json/xkz.json";
@ -301,15 +279,21 @@ const addPolygonCounty = () => {
}; };
// //
const addJd = () => { const addJd = () => {
goMapCenter([119.178783, 29.034581], 12);
mapTownCount.map((item) => { mapTownCount.map((item) => {
createCustomOverlayJd(item); createCustomOverlayJd(item);
}); });
goMapCenter([119.178783, 29.034583], 12);
}; };
//2 //2
const addJd2 = () => { const addJd2 = () => {
goMapCenter([119.178783, 29.034581], 12);
mapTownCount.map((item) => { mapTownCount.map((item) => {
createCustomOverlayJd2(item); createCustomOverlayJd2(item);
}); });
goMapCenter([119.178783, 29.034583], 12);
}; };
// //
const loadCs = () => { const loadCs = () => {
@ -550,6 +534,7 @@ const goMapCenter = (point, zoom) => {
map.centerAndZoom(new BMapGL.Point(point[0], point[1]), zoom); map.centerAndZoom(new BMapGL.Point(point[0], point[1]), zoom);
}; };
const removeAllPolygon = (e) => { const removeAllPolygon = (e) => {
let allOverlay = map.getOverlays(); let allOverlay = map.getOverlays();
console.log("allOverlay", allOverlay); console.log("allOverlay", allOverlay);
for (let i = 0; i < allOverlay.length; i++) { for (let i = 0; i < allOverlay.length; i++) {
@ -557,10 +542,14 @@ const removeAllPolygon = (e) => {
} }
if (e == "fwq") { if (e == "fwq") {
addPolygonCounty(); addPolygonCounty();
nextTick(() => {
addJd(); addJd();
})
} else { } else {
addPolygonCounty(); addPolygonCounty();
nextTick(() => {
addJd2(); addJd2();
})
} }
}; };
// //
@ -1240,15 +1229,18 @@ onMounted(() => {
::v-deep .anchorBL { ::v-deep .anchorBL {
display: none; display: none;
} }
.module { .module {
display: flex; display: flex;
width: 100%; width: 100%;
height: 100%; height: 100%;
position: relative; position: relative;
} }
#id { #id {
z-index: 10; z-index: 10;
} }
// //
.left { .left {
box-sizing: border-box; box-sizing: border-box;
@ -1257,17 +1249,13 @@ onMounted(() => {
bottom: 0; bottom: 0;
width: 520px; width: 520px;
height: 960px; height: 960px;
background: linear-gradient( background: linear-gradient(270deg,
270deg,
rgba(0, 52, 131, 0.69) 0%, rgba(0, 52, 131, 0.69) 0%,
rgba(0, 32, 83, 0.77) 50%, rgba(0, 32, 83, 0.77) 50%,
rgba(0, 60, 131, 0.74) 100% rgba(0, 60, 131, 0.74) 100%),
), radial-gradient(128% 99% at 100% 46%,
radial-gradient(
128% 99% at 100% 46%,
rgba(0, 48, 125, 0.29) 0%, 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); box-shadow: inset 0px 0px 56px 0px rgba(173, 221, 255, 0.5);
backdrop-filter: blur(3px); backdrop-filter: blur(3px);
padding: 30px 26px; padding: 30px 26px;
@ -1275,6 +1263,7 @@ onMounted(() => {
flex-direction: column; flex-direction: column;
z-index: 12; z-index: 12;
overflow: hidden; overflow: hidden;
// //
.lyx { .lyx {
.content { .content {
@ -1286,6 +1275,7 @@ onMounted(() => {
color: #ffffff; color: #ffffff;
height: 450px; height: 450px;
overflow: auto; overflow: auto;
.content_item { .content_item {
cursor: pointer; cursor: pointer;
box-sizing: border-box; box-sizing: border-box;
@ -1300,6 +1290,7 @@ onMounted(() => {
background-size: 100% 100%; background-size: 100% 100%;
margin-bottom: 12px; margin-bottom: 12px;
} }
.content_item:first-child { .content_item:first-child {
box-sizing: border-box; box-sizing: border-box;
display: flex; display: flex;
@ -1313,9 +1304,11 @@ onMounted(() => {
background-size: 100% 100%; background-size: 100% 100%;
margin-bottom: 12px; margin-bottom: 12px;
} }
.content_item_name { .content_item_name {
position: relative; position: relative;
} }
.content_item_name::before { .content_item_name::before {
content: ""; content: "";
position: absolute; position: absolute;
@ -1327,19 +1320,23 @@ onMounted(() => {
top: 7.5px; top: 7.5px;
left: -13px; left: -13px;
} }
.choose { .choose {
background-image: url(@/assets/images/map/choose.png) !important; background-image: url(@/assets/images/map/choose.png) !important;
background-repeat: no-repeat !important; background-repeat: no-repeat !important;
background-size: 100% 100% !important; background-size: 100% 100% !important;
} }
} }
.content::-webkit-scrollbar { .content::-webkit-scrollbar {
display: none; display: none;
} }
} }
// //
.tsbq { .tsbq {
margin-top: 40px; margin-top: 40px;
.content { .content {
box-sizing: border-box; box-sizing: border-box;
margin-top: 20px; margin-top: 20px;
@ -1364,6 +1361,7 @@ onMounted(() => {
background-size: 100% 100%; background-size: 100% 100%;
margin-bottom: 12px; margin-bottom: 12px;
} }
.content_item:last-child { .content_item:last-child {
box-sizing: border-box; box-sizing: border-box;
display: flex; display: flex;
@ -1377,9 +1375,11 @@ onMounted(() => {
background-size: 100% 100%; background-size: 100% 100%;
margin-bottom: 12px; margin-bottom: 12px;
} }
.content_item_name { .content_item_name {
position: relative; position: relative;
} }
.content_item_name::before { .content_item_name::before {
content: ""; content: "";
position: absolute; position: absolute;
@ -1391,17 +1391,20 @@ onMounted(() => {
top: 7.5px; top: 7.5px;
left: -13px; left: -13px;
} }
.choose { .choose {
background-image: url(@/assets/images/map/choose.png) !important; background-image: url(@/assets/images/map/choose.png) !important;
background-repeat: no-repeat !important; background-repeat: no-repeat !important;
background-size: 100% 100% !important; background-size: 100% 100% !important;
} }
} }
.content::-webkit-scrollbar { .content::-webkit-scrollbar {
display: none; display: none;
} }
} }
} }
// //
.right { .right {
box-sizing: border-box; box-sizing: border-box;
@ -1410,17 +1413,13 @@ onMounted(() => {
bottom: 0; bottom: 0;
width: 520px; width: 520px;
height: 960px; height: 960px;
background: linear-gradient( background: linear-gradient(270deg,
270deg,
rgba(0, 52, 131, 0.69) 0%, rgba(0, 52, 131, 0.69) 0%,
rgba(0, 32, 83, 0.77) 50%, rgba(0, 32, 83, 0.77) 50%,
rgba(0, 60, 131, 0.74) 100% rgba(0, 60, 131, 0.74) 100%),
), radial-gradient(128% 99% at 100% 46%,
radial-gradient(
128% 99% at 100% 46%,
rgba(0, 48, 125, 0.29) 0%, 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); box-shadow: inset 0px 0px 56px 0px rgba(173, 221, 255, 0.5);
backdrop-filter: blur(3px); backdrop-filter: blur(3px);
padding: 30px 26px; padding: 30px 26px;
@ -1428,6 +1427,7 @@ onMounted(() => {
flex-direction: column; flex-direction: column;
z-index: 12; z-index: 12;
overflow: hidden; overflow: hidden;
.jbggfwq { .jbggfwq {
.jbggfwq_content { .jbggfwq_content {
height: 550px; height: 550px;
@ -1435,21 +1435,25 @@ onMounted(() => {
margin-top: 15px; margin-top: 15px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.jbggfwq_content_item { .jbggfwq_content_item {
margin-bottom: 5px; margin-bottom: 5px;
display: flex; display: flex;
// align-items: center; // align-items: center;
color: #ffffff; color: #ffffff;
.jbggfwq_content_item_left { .jbggfwq_content_item_left {
margin-right: 10px; margin-right: 10px;
width: 80px; width: 80px;
height: 48px; height: 48px;
line-height: 48px; line-height: 48px;
} }
.jbggfwq_content_item_right { .jbggfwq_content_item_right {
width: 370px; width: 370px;
display: flex; display: flex;
flex-flow: row wrap; flex-flow: row wrap;
.jbggfwq_content_item_right_item { .jbggfwq_content_item_right_item {
cursor: pointer; cursor: pointer;
box-sizing: border-box; box-sizing: border-box;
@ -1460,6 +1464,7 @@ onMounted(() => {
background: rgba(124, 151, 180, 0.8); background: rgba(124, 151, 180, 0.8);
padding: 10px; padding: 10px;
} }
.choose { .choose {
background-image: url(@/assets/images/map/choose.png); background-image: url(@/assets/images/map/choose.png);
background-repeat: no-repeat; background-repeat: no-repeat;
@ -1468,10 +1473,12 @@ onMounted(() => {
} }
} }
} }
.jbggfwq_content::-webkit-scrollbar { .jbggfwq_content::-webkit-scrollbar {
display: none; display: none;
} }
} }
.zyys { .zyys {
.zyys_content { .zyys_content {
margin-top: 20px; margin-top: 20px;
@ -1479,6 +1486,7 @@ onMounted(() => {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
flex-flow: row wrap; flex-flow: row wrap;
.zyys_content_item { .zyys_content_item {
cursor: pointer; cursor: pointer;
margin-bottom: 15px; margin-bottom: 15px;
@ -1489,19 +1497,23 @@ onMounted(() => {
width: 110px; width: 110px;
height: 42px; height: 42px;
background: rgba(124, 151, 180, 0.8); background: rgba(124, 151, 180, 0.8);
.zyys_content_item_left { .zyys_content_item_left {
width: 18px; width: 18px;
height: 18px; height: 18px;
margin-right: 3px; margin-right: 3px;
} }
.zyys_content_item_right { .zyys_content_item_right {
font-weight: 500; font-weight: 500;
font-size: 16px; font-size: 16px;
} }
} }
.wz { .wz {
width: 150px; width: 150px;
} }
.choose { .choose {
background-image: url(@/assets/images/map/choose.png); background-image: url(@/assets/images/map/choose.png);
background-repeat: no-repeat; background-repeat: no-repeat;
@ -1510,6 +1522,7 @@ onMounted(() => {
} }
} }
} }
.title { .title {
.title_name { .title_name {
font-family: YouSheBiaoTiHei; font-family: YouSheBiaoTiHei;
@ -1525,6 +1538,7 @@ onMounted(() => {
-webkit-background-clip: text; -webkit-background-clip: text;
-webkit-text-fill-color: transparent; -webkit-text-fill-color: transparent;
} }
.title_line { .title_line {
height: 4px; height: 4px;
width: 100%; width: 100%;