Merge pull request '在线地图' (#133) from lukeyan into master

Reviewed-on: #133
guomingxin
lukeyan 1 year ago
commit 1285d49585

@ -0,0 +1,35 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
#container {
width: 100vw;
height: 100vh;
/* border: 0.1px solid #495e70; */
}
</style>
<script src="https://api.map.baidu.com/api?v=1.0&type=webgl&ak=CSfWwqFqSVkQaqcAAMxKyXg6Moe9UUqA"></script>
</head>
<body>
<div id="container"></div>
<script>
// 创建地图实例
var map = new BMapGL.Map("container"); // 创建地图实例
var point = new BMapGL.Point(121.619401, 30.046348); // 创建点坐标
map.centerAndZoom(point, 15); // 初始化地图,设置中心点坐标和地图级别
map.enableScrollWheelZoom(true);
map.setMapType(BMAP_SATELLITE_MAP);
// 禁止地图旋转和倾斜可以通过配置项进行设置
var map = new BMapGL.Map("allmap", {
enableRotate: false,
enableTilt: false
});
</script>
</body>
</html>

@ -97,7 +97,7 @@ export default {
if (res.code === 200) { if (res.code === 200) {
sessionStorage.setItem('activeIndex', '1') sessionStorage.setItem('activeIndex', '1')
this.$router.push({ this.$router.push({
path: '/home/safetyIndex' path: '/home/compositeIndex'
}) })
} else { } else {
this.$message.error(res.msg) this.$message.error(res.msg)

@ -18,7 +18,7 @@ const routes = [
name: 'home', name: 'home',
component: () => import('@/views/head'), component: () => import('@/views/head'),
children: [ children: [
// 待用首页 // 首页
{ {
path: 'compositeIndex', path: 'compositeIndex',
name: 'compositeIndex', name: 'compositeIndex',

@ -7,8 +7,8 @@ const request = axios.create({
//baseURL: 'http://172.18.113.50:8080/zhapi', //baseURL: 'http://172.18.113.50:8080/zhapi',
//baseURL: 'http://172.18.113.13:8080/zhapi', // 孙强 //baseURL: 'http://172.18.113.13:8080/zhapi', // 孙强
//baseURL: 'http://192.168.0.188:8888/zhapi', //baseURL: 'http://192.168.0.188:8888/zhapi',
//baseURL: 'http://121.41.91.94:12002/zhapi', baseURL: 'http://121.41.91.94:12002/zhapi',
baseURL: `http://${window.location.host}/zhapi`, //baseURL: `http://${window.location.host}/zhapi`,
timeout: 50000, timeout: 50000,
headers: { 'content-type': 'application/json' }, headers: { 'content-type': 'application/json' },
}) })

@ -3,6 +3,18 @@
<div> <div>
<!-- 最底层地图框 --> <!-- 最底层地图框 -->
<div class="map_box"> <div class="map_box">
<!-- 嵌入在线地图 -->
<iframe
name="zhenhaimap"
id="iframeMap"
class="iframeMap"
:src="getPageUrl"
width="100%"
height="100%"
frameborder="0"
scrolling="no"
ref="iframeDom"
></iframe>
<div class="left_box"> <div class="left_box">
<!-- 园区企业 --> <!-- 园区企业 -->
<CompanyNum ref="companyNum"></CompanyNum> <CompanyNum ref="companyNum"></CompanyNum>
@ -11,6 +23,22 @@
<!-- 园区车辆 --> <!-- 园区车辆 -->
<CompanyCar ref="companyCar"></CompanyCar> <CompanyCar ref="companyCar"></CompanyCar>
</div> </div>
<!-- 点击切换 -->
<div class="select_box">
<el-select
v-model="select_value"
placeholder="请选择"
@change="change_map"
>
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</div>
<div class="right_box"> <div class="right_box">
<!-- 惠企服务 --> <!-- 惠企服务 -->
<CompanyService ref="companyService"></CompanyService> <CompanyService ref="companyService"></CompanyService>
@ -28,7 +56,7 @@ import Employee from "./components/employee";
import CompanyCar from "./components/companyCar"; import CompanyCar from "./components/companyCar";
import CompanyService from "./components/companyService"; import CompanyService from "./components/companyService";
import Notification from "./components/notification"; import Notification from "./components/notification";
import Endanger from "./components/endanger" import Endanger from "./components/endanger";
export default { export default {
name: "CompositeIndex", name: "CompositeIndex",
components: { components: {
@ -37,12 +65,35 @@ export default {
CompanyCar, CompanyCar,
CompanyService, CompanyService,
Notification, Notification,
Endanger Endanger,
}, },
data() { data() {
return {}; return {
getPageUrl:'static/map.html', // 线
options: [
{
value: "1",
label: "地图",
},
{
value: "2",
label: "排名",
},
],
select_value: "地图",
};
},
methods: {
change_map(val) {
console.log("22222", val);
if (val == "2") {
console.log("789");
this.$router.push({
path: "/home/safetyIndex",
});
}
},
}, },
methods: {},
}; };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
@ -52,15 +103,42 @@ export default {
box-sizing: border-box; box-sizing: border-box;
position: relative; position: relative;
// border: 0.1px solid #495e70; // border: 0.1px solid #495e70;
.iframeMap {
margin-top: 1vh;
z-index: 0;
height: 90vh;
}
.left_box { .left_box {
position: absolute; position: absolute;
width: 24vw; width: 24vw;
left: 20px; left: 20px;
top: 0vh;
} }
.right_box { .right_box {
position: absolute; position: absolute;
width: 24vw; width: 24vw;
right: 20px; right: 20px;
top: 0vh;
}
.select_box {
position: absolute;
width: 6vw;
height: 4vh;
top: 0.8vh;
right: 26vw;
/deep/.el-input__inner {
background: #223335;
color: aliceblue;
}
/deep/.el-select .el-input__inner {
border-color: #37fdc7;
}
/deep/.el-select .el-input__inner:focus {
border-color: #37fdc7;
}
// /deep/.el-select-dropdown {
// background-color: rgb(19, 19, 21) !important;
// }
} }
} }
</style> </style>

@ -13,7 +13,7 @@
:router="true" :router="true"
> >
<div class="shu"></div> <div class="shu"></div>
<el-menu-item index="1" route="/home/safetyIndex" <el-menu-item index="1" route="/home/compositeIndex"
>综合指数</el-menu-item >综合指数</el-menu-item
> >
<div class="shu"></div> <div class="shu"></div>

@ -44,7 +44,8 @@ export default {
styleJson, styleJson,
}, },
}); });
console.log('this.dongtaiPoint[0]',this.dongtaiPoint[0]);
console.log('this.dongtaiPoint[1]',this.dongtaiPoint[1]);
// console.log(this.WaringList, 'waringList'); // console.log(this.WaringList, 'waringList');
let that = this; let that = this;
map.centerAndZoom( map.centerAndZoom(

@ -113,11 +113,12 @@
placeholder="请选择" placeholder="请选择"
class="topSelect" class="topSelect"
v-if="Selectvalue == '排名'" v-if="Selectvalue == '排名'"
@change="change_map"
> >
<el-option label="排名" value="排名"> </el-option> <el-option label="排名" value="排名"> </el-option>
<el-option label="地图" value="地图"> </el-option> <el-option label="地图" value="地图"> </el-option>
</el-select> </el-select>
<el-select <!-- <el-select
v-model="Selectvalue" v-model="Selectvalue"
placeholder="请选择" placeholder="请选择"
class="topSelect1" class="topSelect1"
@ -125,7 +126,7 @@
> >
<el-option label="排名" value="排名"> </el-option> <el-option label="排名" value="排名"> </el-option>
<el-option label="地图" value="地图"> </el-option> <el-option label="地图" value="地图"> </el-option>
</el-select> </el-select> -->
<div class="middleBox" v-if="Selectvalue == '排名'"> <div class="middleBox" v-if="Selectvalue == '排名'">
<el-tabs <el-tabs
type="border-card" type="border-card"
@ -243,7 +244,7 @@ export default {
}, },
getstatisticsDanger() { getstatisticsDanger() {
statisticsDanger().then((res) => { statisticsDanger().then((res) => {
console.log('ressss',res.data); console.log("ressss", res.data);
this.statisticsDangerData = res.data; this.statisticsDangerData = res.data;
}); });
}, },
@ -278,6 +279,13 @@ export default {
path: "/home/companyCanban", path: "/home/companyCanban",
}); });
}, },
change_map(val) {
if (val == "地图") {
this.$router.push({
path: "/home/compositeIndex",
});
}
},
}, },
}; };
</script> </script>

Loading…
Cancel
Save