xiangshan
/
ggfwjsc
22
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

11

This commit is contained in:
汪汇 2024-07-24 14:58:07 +08:00
parent ff2d2f4817
commit 70989cc779
12 changed files with 93 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/assets/css/common.css
View File

@ -64,5 +64,5 @@ body {
height: 1080px !important; height: 1080px !important;
overflow: hidden; overflow: hidden;
position: absolute; position: absolute;
z-index: 101; z-index: -1;
} }

56
src/components/header.vue
View File

@ -1,39 +1,39 @@
<template> <template>
<div class="header">
<!-- <img class="title" src="../assets/img_07.png" alt="" /> --> <teleport to="body">
<!-- <div class="time"> <div class="header_content" style="position: absolute;z-index: 999;width: 1920px;">
<div class="header">
<!-- <img class="title" src="../assets/img_07.png" alt="" /> -->
<!-- <div class="time">
<div id="date-display"></div> <div id="date-display"></div>
<div id="clock" style="margin-top: 4px">加载中...</div> <div id="clock" style="margin-top: 4px">加载中...</div>
</div> --> </div> -->
<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 <div :class="data.nowTab == item.url ? 'leftItemC' : 'leftItem'" v-for="item in data.urlLeft.slice(0, 4)"
:class="data.nowTab == item.url ? 'leftItemC' : 'leftItem'" :key="item.name">
v-for="item in data.urlLeft.slice(0, 4)" <div class="itemText" @click="to(item.url)">{{ item.name }}</div>
:key="item.name" </div>
> </div>
<div class="itemText" @click="to(item.url)">{{ item.name }}</div> <div class="header-menu-item header-menu-right">
</div> <div :class="data.nowTab == item.url ? 'rightItemC' : 'rightItem'" v-for="item in data.urlLeft.slice(4, 8)"
</div> :key="item.name">
<div class="header-menu-item header-menu-right"> <div class="itemText" @click="to(item.url)">{{ item.name }}</div>
<div </div>
:class="data.nowTab == item.url ? 'rightItemC' : 'rightItem'" </div>
v-for="item in data.urlLeft.slice(4, 8)"
:key="item.name"
>
<div class="itemText" @click="to(item.url)">{{ item.name }}</div>
</div> </div>
<img src="../assets/RightLine.gif" class="rightLineClass" />
<img src="../assets/RightLine.gif" class="leftLineClass" />
</div> </div>
</div> </div>
<img src="../assets/RightLine.gif" class="rightLineClass" />
<img src="../assets/RightLine.gif" class="leftLineClass" /> </teleport>
</div>
</template> </template>
<script setup> <script setup>
import { ref, reactive, toRefs, onMounted, inject, nextTick, watch } from "vue"; import { ref, reactive, toRefs, onMounted, inject, nextTick, watch } from "vue";
import { useRouter, useRoute } from "vue-router"; import { useRouter, useRoute } from "vue-router";
const updateClock = () => { const updateClock = () => {
//获取当前时间 //获取当前时间
const now = new Date(); const now = new Date();
@ -102,8 +102,7 @@ const data = reactive({
}, },
], ],
nowTab: "/home/index", nowTab: "/home/index",
}); });
onMounted(() => { onMounted(() => {
// 初始调用 updateClock 以立即显示时间 // 初始调用 updateClock 以立即显示时间
updateClock(); updateClock();
@ -241,6 +240,7 @@ onMounted(() => {
right: -70px; right: -70px;
bottom: -50px; bottom: -50px;
} }
.leftLineClass { .leftLineClass {
position: absolute; position: absolute;
transform: scaleX(-1); transform: scaleX(-1);
@ -248,4 +248,8 @@ onMounted(() => {
bottom: -50px; bottom: -50px;
} }
} }
.header_content{
background: url("../assets/bgImg.png") no-repeat 0/100% 100%;
}
</style> </style>

1
src/view/analyze.vue
View File

@ -828,6 +828,7 @@ onBeforeUnmount(() => {
.module { .module {
display: flex; display: flex;
width: 100%; width: 100%;
margin-top: 112px;
} }
.left_bg { .left_bg {

1
src/view/education.vue
View File

@ -756,6 +756,7 @@ onMounted(() => {
.module { .module {
display: flex; display: flex;
width: 100%; width: 100%;
margin-top: 112px;
} }
.left_bg { .left_bg {

4
src/view/guide.vue
View File

@ -351,9 +351,12 @@ body {
height: 100%; height: 100%;
transform-style: preserve-3d; transform-style: preserve-3d;
transition: transform 0.1s ease-in-out; transition: transform 0.1s ease-in-out;
// background-color: skyblue;
} }
.image-wall { .image-wall {
// background-color: skyblue;
z-index: 99;
width: 80%; width: 80%;
height: 80%; height: 80%;
position: absolute; position: absolute;
@ -571,4 +574,5 @@ body {
} }
} }
} }
</style> </style>

23
src/view/home.vue
View File

@ -19,9 +19,23 @@ const reset_font = () => {
let width = document.documentElement.clientWidth || document.body.clientWidth; let width = document.documentElement.clientWidth || document.body.clientWidth;
let height = let height =
document.documentElement.clientHeight || document.body.clientHeight; document.documentElement.clientHeight || document.body.clientHeight;
console.log(width, height)
document.querySelector("#m").style.transformOrigin = "top left"; document.querySelector("#m").style.transformOrigin = "top left";
document.querySelector("#m").style.transform = document.querySelector("#m").style.transform =
"scale(" + width / 1920 + "," + height / 1080 + ")"; "scale(" + width / 1920 + "," + height / 1080 + ")";
document.querySelector(".header_content").style.transformOrigin = "top left";
document.querySelector(".header_content").style.transform =
"scale(" + width / 1920 + "," + height / 1080 + ")";
document.querySelector(".left").style.transformOrigin = "bottom left";
document.querySelector(".left").style.transform =
"scale(" + width / 1920 + "," + height / 1080 + ")";
document.querySelector(".right").style.transformOrigin = "bottom right";
document.querySelector(".right").style.transform =
"scale(" + width / 1920 + "," + height / 1080 + ")";
}; };
onMounted(() => { onMounted(() => {
reset_font(); reset_font();
@ -43,28 +57,33 @@ window.addEventListener("resize", function () {
// width: 100vw; // width: 100vw;
// overflow: hidden; // overflow: hidden;
} }
* { * {
padding: 0; padding: 0;
margin: 0; margin: 0;
box-sizing: border-box; box-sizing: border-box;
// color: #ccffff; // color: #ccffff;
} }
html { html {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
body { body {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
#m { #m {
width: 100%; width: 100%;
height: 100%; height: 100%;
overflow: hidden; overflow: hidden;
// position: absolute; // position: absolute;
z-index: 101; z-index: -1;
} }
#emap { #emap {
width: 100%; width: 100%;
height: 980px; height: 980px;
@ -73,6 +92,7 @@ body {
left: 0; left: 0;
z-index: 100; z-index: 100;
} }
#container { #container {
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -81,6 +101,7 @@ body {
position: relative; position: relative;
overflow: hidden; overflow: hidden;
} }
.main { .main {
* { * {
pointer-events: all; pointer-events: all;

1
src/view/hygiene.vue
View File

@ -407,6 +407,7 @@ const getData = async () => {
.module { .module {
display: flex; display: flex;
width: 100%; width: 100%;
margin-top: 112px;
} }
.yd_title { .yd_title {

1
src/view/sy.vue
View File

@ -1833,6 +1833,7 @@ onBeforeMount(async () => {
.module { .module {
display: flex; display: flex;
width: 100%; width: 100%;
margin-top: 112px;
} }
.yd_title { .yd_title {

36
src/view/sy_map.vue
View File

@ -1,7 +1,8 @@
<template> <template>
<div class="module"> <div class="module">
<div id="map" style="width: 100%; height: 100%"></div> <teleport to="body">
<div class="left"> <div id="map" style="width: 100vw; height: 100vh; "></div>
<div class="left" style="width: 517px;">
<div class="lyx"> <div class="lyx">
<div class="title"> <div class="title">
<div class="title_name">{{ title_choose }}</div> <div class="title_name">{{ title_choose }}</div>
@ -39,7 +40,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="right"> <div class="right" style="width: 517px;" >
<div class="jbggfwq"> <div class="jbggfwq">
<div class="title"> <div class="title">
<div class="title_name">基本公共服务圈</div> <div class="title_name">基本公共服务圈</div>
@ -84,7 +85,10 @@
</div> </div>
</div> </div>
</div> </div>
</teleport>
</div> </div>
</template> </template>
<script setup> <script setup>
import { import {
@ -321,9 +325,10 @@ const xkzCenter = reactive([
var map = null; var map = null;
const initMap = () => { const initMap = () => {
map = new BMapGL.Map("map", { minZoom: 11, maxZoom: 20 }); map = new BMapGL.Map("map", { minZoom: 11, maxZoom: 20 });
map.setMapType(BMAP_SATELLITE_MAP);
map.enableScrollWheelZoom(true); map.enableScrollWheelZoom(true);
map.setMapType(BMAP_EARTH_MAP);
goMapCenter([119.178783, 29.034583], 12); goMapCenter([119.178783, 29.034583], 12);
//加载乡镇信息 //加载乡镇信息
loadTown(); loadTown();
//渲染地块 //渲染地块
@ -368,14 +373,30 @@ const addPolygonCounty = () => {
fillOpacity: 0.7, fillOpacity: 0.7,
name: item.name, name: item.name,
}); });
map.addOverlay(polygon); map.addOverlay(polygon);
polygon.addEventListener("click", () => {
console.log(item.name);
let jdCenter = [];
if (item.name == "溪口镇") {
title_choose.value = '龙游县'
title_choose.value = title_choose.value + `>${item.name}`;
console.log(title_choose.value);
loadCs();
addPolygonCountyCs();
mapTownCount.map((item) => {
if (item.name == "溪口镇") {
jdCenter = item.center;
}
});
goMapCenter(jdCenter, 14);
}
});
} }
}); });
// mapTownCount.map((item) => {
// createCustomOverlayJd(item);
// });
}; };
//添加街道名 //添加街道名
const addJd = () => { const addJd = () => {
mapTownCount.map((item) => { mapTownCount.map((item) => {
createCustomOverlayJd(item); createCustomOverlayJd(item);
@ -1559,6 +1580,7 @@ onMounted(() => {
width: 100%; width: 100%;
height: 100%; height: 100%;
position: relative; position: relative;
margin-top: 112px;
} }
#id { #id {

1
src/view/sy_table.vue
View File

@ -316,6 +316,7 @@ const rowState = (row) => {
.module { .module {
width: 100%; width: 100%;
display: flex; display: flex;
margin-top: 112px;
.displayFlex { .displayFlex {
height: 100%; height: 100%;
display: flex; display: flex;

1
src/view/work.vue
View File

@ -495,6 +495,7 @@ onBeforeUnmount(() => {
.module { .module {
display: flex; display: flex;
width: 100%; width: 100%;
margin-top: 112px;
} }
.left_bg { .left_bg {

1
src/view/yl.vue
View File

@ -703,6 +703,7 @@ const getData = () => {
.module { .module {
display: flex; display: flex;
width: 100%; width: 100%;
margin-top: 112px;
} }
.yd_title { .yd_title {