61 lines
2.2 KiB
HTML
61 lines
2.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
|
|
<title>Title</title>
|
|
<link rel="stylesheet" href="css/reset.css">
|
|
<link rel="stylesheet" href="css/style.css">
|
|
<script src="js/rem.js"></script>
|
|
<script type="text/javascript" src="https://api.map.baidu.com/api?v=1.0&&type=webgl&ak=aFhfSbQy2GVc92I4ue7i5w8WiQjouRYF"></script>
|
|
</head>
|
|
<body>
|
|
<div id="app" v-cloak>
|
|
<div class="toilet-top">
|
|
<h1 class="toilet-name">{{toiletDetail.name}}</h1>
|
|
<p class="toilet-address">{{toiletDetail.address}}</p>
|
|
</div>
|
|
|
|
<div id="map"></div>
|
|
</div>
|
|
<script src="js/vue.js"></script>
|
|
<script src="js/jquery-2.1.4.min.js"></script>
|
|
<script src="js/ajax.js"></script>
|
|
<script src="js/layer/layer.js"></script>
|
|
<script>
|
|
var vue = new Vue({
|
|
el: '#app',
|
|
data: {
|
|
requestUrl: 'http://219.159.20.131:8081/',
|
|
toiletDetail: {},
|
|
token: sessionStorage.getItem('token'),
|
|
uid: ''
|
|
},
|
|
methods: {
|
|
getToiletDetail: function () {
|
|
var self = this
|
|
doGetForm('http://www.wlcbsyzl.cn/systemetl/app/datacensus/sql/CS00002', {
|
|
uid: self.uid
|
|
},null, function (code, data) {
|
|
console.log(data)
|
|
var result = data.dataList[0]
|
|
self.toiletDetail = result
|
|
var map = new BMapGL.Map("map");
|
|
var point = new BMapGL.Point(result.lng, result.lat);
|
|
var marker = new BMapGL.Marker(point); // 创建标注
|
|
map.enableScrollWheelZoom();
|
|
map.addOverlay(marker);
|
|
map.centerAndZoom(point, 12);
|
|
}, null, function (res) {
|
|
res.setRequestHeader('token',self.token)
|
|
})
|
|
}
|
|
},
|
|
mounted: function () {
|
|
this.uid = window.location.search.replace('?','').split('=')[1]
|
|
this.getToiletDetail()
|
|
}
|
|
})
|
|
</script>
|
|
</body>
|
|
</html> |