This commit is contained in:
duanxiaohai 2024-07-29 18:57:32 +08:00
parent 3bf1274572
commit 4a21aac784
11 changed files with 131 additions and 58 deletions

BIN
dist.zip

Binary file not shown.

Binary file not shown.

After

Width:  |  Height:  |  Size: 752 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 720 B

View File

@ -1,8 +1,11 @@
<template> <template>
<teleport to="body"> <teleport to="body">
<div class="header_content" style="position: absolute;z-index: 999;width: 1920px;"> <div
class="header_content"
style="position: absolute; z-index: 999; width: 1920px"
>
<div class="header"> <div class="header">
<div class="headerGo" @click="to('/guide')"></div>
<!-- <img class="title" src="../assets/img_07.png" alt="" /> --> <!-- <img class="title" src="../assets/img_07.png" alt="" /> -->
<!-- <div class="time"> <!-- <div class="time">
<div id="date-display"></div> <div id="date-display"></div>
@ -11,14 +14,20 @@
<div class="header-menu"> <div class="header-menu">
<div class="header-menu-item header-menu-left"> <div class="header-menu-item header-menu-left">
<div :class="data.nowTab == item.url ? 'leftItemC' : 'leftItem'" v-for="item in data.urlLeft.slice(0, 4)" <div
:key="item.name"> :class="data.nowTab == item.url ? 'leftItemC' : 'leftItem'"
v-for="item in data.urlLeft.slice(0, 4)"
:key="item.name"
>
<div class="itemText" @click="to(item.url)">{{ item.name }}</div> <div class="itemText" @click="to(item.url)">{{ item.name }}</div>
</div> </div>
</div> </div>
<div class="header-menu-item header-menu-right"> <div class="header-menu-item header-menu-right">
<div :class="data.nowTab == item.url ? 'rightItemC' : 'rightItem'" v-for="item in data.urlLeft.slice(4, 8)" <div
:key="item.name"> :class="data.nowTab == item.url ? 'rightItemC' : 'rightItem'"
v-for="item in data.urlLeft.slice(4, 8)"
:key="item.name"
>
<div class="itemText" @click="to(item.url)">{{ item.name }}</div> <div class="itemText" @click="to(item.url)">{{ item.name }}</div>
</div> </div>
</div> </div>
@ -27,7 +36,6 @@
<img src="../assets/RightLine.gif" class="leftLineClass" /> <img src="../assets/RightLine.gif" class="leftLineClass" />
</div> </div>
</div> </div>
</teleport> </teleport>
</template> </template>
@ -114,7 +122,17 @@ onMounted(() => {
}); });
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.headerGo {
cursor: pointer;
position: absolute;
top: 0;
right: 50%;
width: 700px;
height: 80px;
transform: translate(50%, 8%);
}
.header { .header {
position: relative;
background-image: url(../assets/headerBg.png); background-image: url(../assets/headerBg.png);
background-size: 100% 100%; background-size: 100% 100%;
display: flex; display: flex;
@ -251,7 +269,7 @@ onMounted(() => {
} }
} }
.header_content{ .header_content {
background: url("../assets/bgImg.png") no-repeat 0/100% 100%; background: url("../assets/bgImg.png") no-repeat 0/100% 100%;
} }
</style> </style>

View File

@ -11,11 +11,11 @@ const chart = ref(); // 创建DOM引用
const dataList = [ const dataList = [
{ {
name: "2.0收件数", name: "2.0收件数",
value: 33044, value: 42277,
}, },
{ {
name: "总收件数", name: "总收件数",
value: 33295, value: 42632,
}, },
]; ];
// //

View File

@ -11,11 +11,11 @@ const chart = ref(); // 创建DOM引用
const dataList = [ const dataList = [
{ {
name: "超期受理数", name: "超期受理数",
value: 9, value: 3,
}, },
{ {
name: "应受理数", name: "应受理数",
value: 32561, value: 41341,
}, },
]; ];
var data = [ var data = [

View File

@ -11,11 +11,11 @@ const chart = ref(); // 创建DOM引用
const dataList = [ const dataList = [
{ {
name: "超期办理数", name: "超期办理数",
value: 7, value: 0,
}, },
{ {
name: "应办理数", name: "应办理数",
value: 31615, value: 39196,
}, },
]; ];
var data = [ var data = [

View File

@ -396,7 +396,7 @@
<div class="right"> <div class="right">
<div class="name">平均受理时长</div> <div class="name">平均受理时长</div>
<img class="line" src="@/assets/images/sy/zwfw_line.png" /> <img class="line" src="@/assets/images/sy/zwfw_line.png" />
<div class="time"><span>0.22</span>小时</div> <div class="time"><span>0.28</span>小时</div>
</div> </div>
</div> </div>
<div class="fgx"></div> <div class="fgx"></div>
@ -405,7 +405,7 @@
<div class="right"> <div class="right">
<div class="name">平均办理时长</div> <div class="name">平均办理时长</div>
<img class="line" src="@/assets/images/sy/zwfw_line.png" /> <img class="line" src="@/assets/images/sy/zwfw_line.png" />
<div class="time"><span>0.54</span>小时</div> <div class="time"><span>0.78</span>小时</div>
</div> </div>
</div> </div>
</div> </div>

View File

@ -20,9 +20,9 @@
:row-style="rowState" :row-style="rowState"
:header-cell-style="tableHeaderColor" :header-cell-style="tableHeaderColor"
> >
<el-table-column prop="xm" label="姓名" width="60" /> <el-table-column prop="xm" label="姓名" width="90" />
<el-table-column prop="dz" label="地址" /> <el-table-column prop="dz" label="地址" />
<el-table-column prop="nl" label="年龄" /> <el-table-column prop="nl" label="年龄" width="60" />
<!-- <el-table-column prop="sfzhm" label="身份证号" /> --> <!-- <el-table-column prop="sfzhm" label="身份证号" /> -->
<el-table-column prop="bq" label="人口标签" /> <el-table-column prop="bq" label="人口标签" />
</el-table> </el-table>
@ -113,9 +113,9 @@
:row-style="rowState" :row-style="rowState"
:header-cell-style="tableHeaderColor" :header-cell-style="tableHeaderColor"
> >
<el-table-column prop="fullName" label="姓名" width="60" /> <el-table-column prop="fullName" label="姓名" width="90" />
<el-table-column prop="address" label="地址" /> <el-table-column prop="address" label="地址" />
<el-table-column prop="age" label="年龄" /> <el-table-column prop="age" label="年龄" width="60"/>
<!-- <el-table-column prop="IDNumber" label="身份证号" /> --> <!-- <el-table-column prop="IDNumber" label="身份证号" /> -->
<el-table-column prop="PopulationLabel" label="人口标签" /> <el-table-column prop="PopulationLabel" label="人口标签" />
</el-table> </el-table>
@ -513,7 +513,7 @@ const data = reactive({
// //
const pagination = reactive({ const pagination = reactive({
total: 10, total: 10,
pageSize: 10, pageSize: 20,
currentPage: 1, currentPage: 1,
}); });
const pagination1 = reactive({ const pagination1 = reactive({
@ -523,7 +523,7 @@ const pagination1 = reactive({
}); });
const pagination2 = reactive({ const pagination2 = reactive({
total: 10, total: 10,
pageSize: 10, pageSize: 20,
currentPage: 1, currentPage: 1,
}); });
// //

View File

@ -142,6 +142,13 @@ import b6 from "@/assets/images/map/b6.png";
import xcbg from "@/assets/images/map/xcbg.png"; import xcbg from "@/assets/images/map/xcbg.png";
import AED from "@/assets/images/map/AED.png"; import AED from "@/assets/images/map/AED.png";
const data = reactive({
serviceCircleList: [],
fwqCoordinates: "", //
fwqCoordinates1: [], //
fwqCoordinates2: [], //
});
//() //()
const jdm_arr = ref([]); const jdm_arr = ref([]);
const jdm_number_arr = ref([]); const jdm_number_arr = ref([]);
@ -459,9 +466,11 @@ const BMAP = () => {
// //
var circle; var circle;
const drawACircle = (v) => { const drawACircle = (v) => {
console.log(data.fwqCoordinates);
// forEach;
if (!circle) { if (!circle) {
var point = new BMapGL.Point(119.184803, 28.853725); var point = new BMapGL.Point(data.fwqCoordinates1, data.fwqCoordinates2);
circle = new BMapGL.Circle(point, 900, { circle = new BMapGL.Circle(point, 1000, {
strokeColor: "yellow", strokeColor: "yellow",
strokeWeight: 2, strokeWeight: 2,
@ -480,7 +489,7 @@ const drawACircle = (v) => {
circle.show(); circle.show();
map.addOverlay(circle); map.addOverlay(circle);
map.setViewport({ map.setViewport({
center: new BMapGL.Point(119.184803, 28.853725), center: new BMapGL.Point(data.fwqCoordinates1, data.fwqCoordinates2),
zoom: 14, zoom: 14,
}); });
} }
@ -560,7 +569,7 @@ const addPolygonCounty = () => {
choose.value.person == "tyjr" || choose.value.person == "tyjr" ||
choose.value.person == "kjer" choose.value.person == "kjer"
) { ) {
console.log(5555555555555555); // console.log(5555555555555555);
// getDataBq(cfJd.value, ""); // getDataBq(cfJd.value, "");
getDataBqs2(cfJd.value, cfCs.value, choose.value.person, false); getDataBqs2(cfJd.value, cfCs.value, choose.value.person, false);
} else { } else {
@ -834,7 +843,7 @@ const addCsUnChoose = () => {
map.removeOverlay(cs_qk_arr.value[index]); map.removeOverlay(cs_qk_arr.value[index]);
}); });
getDataBqs(cfJd.value, cfCs.value); getDataBqs(cfJd.value, cfCs.value);
getDataBq(cfJd.value, cfCs.value); getDataBq(cfJd.value, cfCs.value);
getDatas2(cfJd.value, choose.value.person, cfCs.value); getDatas2(cfJd.value, choose.value.person, cfCs.value);
if ( if (
choose.value.person == "cjr" || choose.value.person == "cjr" ||
@ -962,7 +971,7 @@ const createCustomOverlayJd2 = (polygon, indexx) => {
} }
let num = ""; let num = "";
if (choose.value.person == "6666") { if (choose.value.person == "6666") {
console.log(1); // console.log(1);
num = "swrs"; num = "swrs";
} else if ( } else if (
choose.value.person == "cjr" || choose.value.person == "cjr" ||
@ -1268,14 +1277,29 @@ const DGcreateCs2 = (polygon, indexx) => {
// //
const addggfwq = () => { const addggfwq = () => {
if (fwqList.value) { if (fwqList.value) {
data.fwqCoordinates1 = [];
data.fwqCoordinates1 = [];
// console.log(fwqList.value,444);
fwqList.value.map((item, index) => { fwqList.value.map((item, index) => {
data.fwqCoordinates1.push(item.point[0]);
data.fwqCoordinates2.push(item.point[1]);
createCustomOverlay(item, index); createCustomOverlay(item, index);
}); });
function calculateAverage(coordinates) {
const numericCoordinates = coordinates.map(Number); //
const sum = numericCoordinates.reduce((acc, val) => acc + val, 0); //
return sum / numericCoordinates.length; //
}
data.fwqCoordinates1 = calculateAverage(data.fwqCoordinates1);
data.fwqCoordinates2 = calculateAverage(data.fwqCoordinates2);
// console.log(average1,average2, 555);
drawACircle();
} }
}; };
// //
const createCustomOverlay = (polygon, indexx) => { const createCustomOverlay = (polygon, indexx) => {
drawACircle(); data.fwqCoordinates = polygon.point;
function createLabelDOM() { function createLabelDOM() {
var content = document.createElement("div"); var content = document.createElement("div");
content.style.display = "flex"; content.style.display = "flex";
@ -1455,16 +1479,15 @@ const changeFwq = async (id, list, center, name, names) => {
fwq_list_arr.value.forEach((item, index) => { fwq_list_arr.value.forEach((item, index) => {
map.removeOverlay(fwq_list_arr.value[index]); // map.removeOverlay(fwq_list_arr.value[index]); //
}); });
drawACircle("hide"); // drawACircle("hide"); //
} else { } else {
await getServiceCircle(names, name); await getServiceCircle(names, name);
choose.value.fwq = id; choose.value.fwq = id;
map.clearOverlays(); // map.clearOverlays(); //
choose.value.person='' choose.value.person = "";
addggfwq(); // addggfwq(); //
setTimeout(() => { setTimeout(() => {
goMapCenter(center, 16); // goMapCenter([data.fwqCoordinates1,data.fwqCoordinates2], 16); //
}, 500); }, 500);
} }
}; };
@ -2605,14 +2628,16 @@ const getDataBqJD = async (bq) => {
await http.get(`/api/ggfwyth/ysyzt/getTsbqByXzjdOrCsq`, data).then((res) => { await http.get(`/api/ggfwyth/ysyzt/getTsbqByXzjdOrCsq`, data).then((res) => {
if (res.code == 200) { if (res.code == 200) {
mapTownCount.map((item) => { if (res?.data) {
item.numbers = 0; mapTownCount.map((item) => {
res.data.map((items) => { item.numbers = 0;
if (items.xzjd == item.name) { res.data.map((items) => {
item.numbers = items.rs; if (items.xzjd == item.name) {
} item.numbers = items.rs;
}
});
}); });
}); }
} }
}); });
}; };
@ -2889,11 +2914,12 @@ onMounted(() => {
.jbggfwq { .jbggfwq {
.jbggfwq_content { .jbggfwq_content {
height: 550px; height: 500px;
overflow: auto; overflow: auto;
margin-top: 15px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
margin-top: 15px;
margin-bottom: 34px;
.jbggfwq_content_item { .jbggfwq_content_item {
margin-bottom: 5px; margin-bottom: 5px;
@ -2912,8 +2938,8 @@ onMounted(() => {
width: 370px; width: 370px;
display: flex; display: flex;
flex-flow: row wrap; flex-flow: row wrap;
border-radius: 6px;
overflow: hidden; overflow: hidden;
// border-radius: 6px;
.jbggfwq_content_item_right_item { .jbggfwq_content_item_right_item {
cursor: pointer; cursor: pointer;
@ -2968,7 +2994,7 @@ onMounted(() => {
} }
.zyys { .zyys {
margin-top: 25px; // margin-top: 25px;
.zyys_content { .zyys_content {
margin-top: 20px; margin-top: 20px;
box-sizing: border-box; box-sizing: border-box;
@ -2977,14 +3003,14 @@ onMounted(() => {
flex-flow: row wrap; flex-flow: row wrap;
.zyys_content_item { .zyys_content_item {
width: 110px;
height: 54px;
cursor: pointer; cursor: pointer;
margin-bottom: 15px; margin-bottom: 20px;
color: #ffffff; color: #ffffff;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
width: 110px;
height: 42px;
background: rgba(124, 151, 180, 0.8); background: rgba(124, 151, 180, 0.8);
.zyys_content_item_left { .zyys_content_item_left {

View File

@ -6,9 +6,15 @@
<div class="menuBar"> <div class="menuBar">
<div class="tabPosition" v-for="(item, index) in data.tabPosition"> <div class="tabPosition" v-for="(item, index) in data.tabPosition">
<div class="tabPositionBox" @click="toggleVisibility(item)"> <div class="tabPositionBox" @click="toggleVisibility(item)">
<div class="img"><img :src="item.img" alt="" /></div> <div style="display: flex;text-align: center;" >
<div class="tabsItem"> <div class="img"><img :src="item.img" alt="" /></div>
{{ item.name }} <div class="tabsItem">
{{ item.name }}
</div>
</div>
<div class="img1">
<img src="@/assets/sy-table/sy-table21.png" v-if="item.visible" />
<img src="@/assets/sy-table/sy-table20.png" v-else />
</div> </div>
</div> </div>
<transition name="fade-scale"> <transition name="fade-scale">
@ -506,21 +512,25 @@ const rowState = (row) => {
color: #ffffff; color: #ffffff;
text-align: left; text-align: left;
font-style: normal; font-style: normal;
font-family: YouSheBiaoTiHei; // font-family: YouSheBiaoTiHei;
font-family: titleNore;
text-shadow: 0px 2px 4px rgba(56, 50, 50, 0.5); text-shadow: 0px 2px 4px rgba(56, 50, 50, 0.5);
padding: 19px 0 0 17px;
} }
.lineEnd { .lineEnd {
height: 3px; height: 3px;
border-top: 1px solid #fff; border-top: 1px solid #fff;
border-bottom: 1px dashed #fff; border-bottom: 1px dashed #fff;
width: 180px;
margin: 17px 0; margin: 17px 0;
margin-left: 16px;
} }
.menuBar::-webkit-scrollbar { .menuBar::-webkit-scrollbar {
display: none; /* Chrome Safari */ display: none; /* Chrome Safari */
} }
.menuBar { .menuBar {
height: 100vh; height: 100%;
overflow-y: auto; overflow-y: auto;
} }
.tabPosition { .tabPosition {
@ -537,9 +547,18 @@ const rowState = (row) => {
margin-right: 10px; margin-right: 10px;
vertical-align: middle; vertical-align: middle;
} }
.tabPosition .img1 {
img {
width: 20px;
height: 10px;
margin-right: 24px;
vertical-align: middle;
}
}
.tabPositionBox { .tabPositionBox {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between;
margin: 12px 0 12px 19px; margin: 12px 0 12px 19px;
cursor: pointer; cursor: pointer;
} }
@ -547,10 +566,20 @@ const rowState = (row) => {
font-size: 18px; font-size: 18px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; // justify-content: center;
width: 200px; padding-left: 30px;
height: 50px; height: 50px;
border-radius: 4px; background-color: #032862;
white-space: nowrap;
}
.tabPositionminBox::before {
content: "";
display: block;
width: 4px;
height: 4px;
border-radius: 50%;
background-color: #ffffff;
margin-right: 6px;
} }
.tabPositionminBoxBgc { .tabPositionminBoxBgc {
background: rgba(73, 121, 191); background: rgba(73, 121, 191);
@ -570,14 +599,13 @@ const rowState = (row) => {
width: 270px; width: 270px;
height: 943px; height: 943px;
box-sizing: border-box; box-sizing: border-box;
padding: 19px 17px; // padding: 19px 17px;
// margin-right: 28px; // margin-right: 28px;
background: linear-gradient( background: linear-gradient(
270deg, 270deg,
rgba(3, 56, 127, 0.77) 0%, rgba(3, 56, 127, 0.77) 0%,
rgba(3, 56, 127, 0.74) 100% rgba(3, 56, 127, 0.74) 100%
); );
box-shadow: inset 0px 0px 56px 0px rgba(173, 221, 255, 0.5);
border-radius: 0px 24px 24px 0px; border-radius: 0px 24px 24px 0px;
backdrop-filter: blur(3px); backdrop-filter: blur(3px);
} }
@ -665,6 +693,7 @@ const rowState = (row) => {
font-size: 26px; font-size: 26px;
color: #ffffff; color: #ffffff;
letter-spacing: 2px; letter-spacing: 2px;
font-family: titleNore;
} }
.tableBoxCenter1 { .tableBoxCenter1 {
width: 70px; width: 70px;