Skip to content

C
cloud-platform-ui
Commit 2da3606a authored by youjj's avatar youjj
Browse files
Options

地图标记，获取坐标

parent 548be0c9
Hide whitespace changes
Inline Side-by-side
Showing with 185 additions and 44 deletions
build/webpack.base.conf.js
View file @ 2da3606a
...@@ -36,7 +36,8 @@ module.exports = { ...@@ -36,7 +36,8 @@ module.exports = {
} }
}, },
externals: { externals: {
jquery: 'jQuery' jquery: 'jQuery',
// BMap: "BMap"
}, },
module: { module: {
rules: [ rules: [
......
index.html
View file @ 2da3606a
...@@ -10,6 +10,7 @@ ...@@ -10,6 +10,7 @@
<body> <body>
<script src=<%= htmlWebpackPlugin.options.path %>/jquery.min.js></script> <script src=<%= htmlWebpackPlugin.options.path %>/jquery.min.js></script>
<script src=<%= htmlWebpackPlugin.options.path %>/tinymce/tinymce.min.js></script> <script src=<%= htmlWebpackPlugin.options.path %>/tinymce/tinymce.min.js></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=gvQPveN9YrlPSgKUMPK2u2u2BA4yQFRm"></script>
<div id="app"></div> <div id="app"></div>
<!-- built files will be auto injected --> <!-- built files will be auto injected -->
</body> </body>
......
package-lock.json
View file @ 2da3606a
...@@ -169,7 +169,6 @@ ...@@ -169,7 +169,6 @@
"version": "1.0.9", "version": "1.0.9",
"resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.9.tgz", "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.9.tgz",
"integrity": "sha1-c9g7wmP4bpf4zE9rrhsOkKfSLIY=", "integrity": "sha1-c9g7wmP4bpf4zE9rrhsOkKfSLIY=",
"dev": true,
"requires": { "requires": {
"sprintf-js": "~1.0.2" "sprintf-js": "~1.0.2"
} }
...@@ -1193,6 +1192,34 @@ ...@@ -1193,6 +1192,34 @@
"integrity": "sha1-U0uQM8AiyVecVro7Plpcqvu2UOE=", "integrity": "sha1-U0uQM8AiyVecVro7Plpcqvu2UOE=",
"dev": true "dev": true
}, },
"bmaplib.curveline": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/bmaplib.curveline/-/bmaplib.curveline-1.0.0.tgz",
"integrity": "sha512-9wcFMVhiYxNPqpvsLDAADn3qDhNzXp2mA6VyHSHg2XOAgSooC7ZiujdFhy0sp+0QYjTfJ/MjmLuNoUg2HHxH4Q=="
},
"bmaplib.heatmap": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/bmaplib.heatmap/-/bmaplib.heatmap-1.0.4.tgz",
"integrity": "sha512-rmhqUARBpUSJ9jXzUI2j7dIOqnc38bqubkx/8a349U2qtw/ulLUwyzRD535OrA8G7w5cz4aPKm6/rNvUAarg/Q=="
},
"bmaplib.lushu": {
"version": "1.0.7",
"resolved": "https://registry.npmjs.org/bmaplib.lushu/-/bmaplib.lushu-1.0.7.tgz",
"integrity": "sha512-LVvgpESPii6xGxyjnQjq8u+ic4NjvhdCPV/RiSS/PGTUdZKeTDS7prSpleJLZH3ES0+oc0gYn8bw0LtPYUSz2w=="
},
"bmaplib.markerclusterer": {
"version": "1.0.13",
"resolved": "https://registry.npmjs.org/bmaplib.markerclusterer/-/bmaplib.markerclusterer-1.0.13.tgz",
"integrity": "sha512-VrLyWSiuDEVNi0yUfwOhFQ6z1oEEHS4w36GNu3iASu6p52QIx9uAXMUkuSCHReNR0bj2Cp9SA1dSx5RpojXajQ==",
"requires": {
"bmaplib.texticonoverlay": "^1.0.2"
}
},
"bmaplib.texticonoverlay": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/bmaplib.texticonoverlay/-/bmaplib.texticonoverlay-1.0.2.tgz",
"integrity": "sha512-4ZTWr4ZP3B6qEWput5Tut16CfZgII38YwM3bpyb4gFTQyORlKYryFp9WHWrwZZaHlOyYDAXG9SX0hka43jTADg=="
},
"bn.js": { "bn.js": {
"version": "4.11.8", "version": "4.11.8",
"resolved": "https://registry.npm.taobao.org/bn.js/download/bn.js-4.11.8.tgz", "resolved": "https://registry.npm.taobao.org/bn.js/download/bn.js-4.11.8.tgz",
...@@ -2678,8 +2705,7 @@ ...@@ -2678,8 +2705,7 @@
"entities": { "entities": {
"version": "1.1.1", "version": "1.1.1",
"resolved": "https://registry.npmjs.org/entities/-/entities-1.1.1.tgz", "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.1.tgz",
"integrity": "sha1-blwtClYhtdra7O+AuQ7ftc13cvA=", "integrity": "sha1-blwtClYhtdra7O+AuQ7ftc13cvA="
"dev": true
}, },
"errno": { "errno": {
"version": "0.1.4", "version": "0.1.4",
...@@ -5633,6 +5659,14 @@ ...@@ -5633,6 +5659,14 @@
"immediate": "~3.0.5" "immediate": "~3.0.5"
} }
}, },
"linkify-it": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/linkify-it/-/linkify-it-2.1.0.tgz",
"integrity": "sha512-4REs8/062kV2DSHxNfq5183zrqXMl7WP0WzABH9IeJI+NLm429FgE1PDecltYfnOoFDFlZGh2T8PfZn0r+GTRg==",
"requires": {
"uc.micro": "^1.0.1"
}
},
"load-json-file": { "load-json-file": {
"version": "2.0.0", "version": "2.0.0",
"resolved": "https://registry.npm.taobao.org/load-json-file/download/load-json-file-2.0.0.tgz", "resolved": "https://registry.npm.taobao.org/load-json-file/download/load-json-file-2.0.0.tgz",
...@@ -5826,6 +5860,18 @@ ...@@ -5826,6 +5860,18 @@
"integrity": "sha1-2TPOuSBdgr3PSIb2dCvcK03qFG0=", "integrity": "sha1-2TPOuSBdgr3PSIb2dCvcK03qFG0=",
"dev": true "dev": true
}, },
"markdown-it": {
"version": "8.4.2",
"resolved": "https://registry.npmjs.org/markdown-it/-/markdown-it-8.4.2.tgz",
"integrity": "sha512-GcRz3AWTqSUphY3vsUqQSFMbgR38a4Lh3GWlHRh/7MRwz8mcu9n2IO7HOh+bXHrR9kOPDl5RNCaEsrneb+xhHQ==",
"requires": {
"argparse": "^1.0.7",
"entities": "~1.1.1",
"linkify-it": "^2.0.0",
"mdurl": "^1.0.1",
"uc.micro": "^1.0.5"
}
},
"marked": { "marked": {
"version": "0.3.6", "version": "0.3.6",
"resolved": "https://registry.npmjs.org/marked/-/marked-0.3.6.tgz", "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.6.tgz",
...@@ -5859,6 +5905,11 @@ ...@@ -5859,6 +5905,11 @@
} }
} }
}, },
"mdurl": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/mdurl/-/mdurl-1.0.1.tgz",
"integrity": "sha1-/oWy7HWlkDfyrf7BAP1sYBdhFS4="
},
"media-typer": { "media-typer": {
"version": "0.3.0", "version": "0.3.0",
"resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz", "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
...@@ -9312,8 +9363,7 @@ ...@@ -9312,8 +9363,7 @@
"sprintf-js": { "sprintf-js": {
"version": "1.0.3", "version": "1.0.3",
"resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz", "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
"integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=", "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw="
"dev": true
}, },
"ssf": { "ssf": {
"version": "0.10.1", "version": "0.10.1",
...@@ -9683,6 +9733,11 @@ ...@@ -9683,6 +9733,11 @@
"resolved": "https://registry.npm.taobao.org/typo-js/download/typo-js-1.0.3.tgz", "resolved": "https://registry.npm.taobao.org/typo-js/download/typo-js-1.0.3.tgz",
"integrity": "sha1-VNjrx5SfGngQkItgAsaEFSbJnVo=" "integrity": "sha1-VNjrx5SfGngQkItgAsaEFSbJnVo="
}, },
"uc.micro": {
"version": "1.0.6",
"resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-1.0.6.tgz",
"integrity": "sha512-8Y75pvTYkLJW2hWQHXxoqRgV7qb9B+9vFEtidML+7koHUFapnVJAZ6cKs+Qjz5Aw3aZWHMC6u0wJE3At+nSGwA=="
},
"uglify-js": { "uglify-js": {
"version": "3.1.3", "version": "3.1.3",
"resolved": "https://registry.npm.taobao.org/uglify-js/download/uglify-js-3.1.3.tgz", "resolved": "https://registry.npm.taobao.org/uglify-js/download/uglify-js-3.1.3.tgz",
...@@ -9903,6 +9958,18 @@ ...@@ -9903,6 +9958,18 @@
"resolved": "https://registry.npmjs.org/vue/-/vue-2.4.2.tgz", "resolved": "https://registry.npmjs.org/vue/-/vue-2.4.2.tgz",
"integrity": "sha1-qYVSYfGRyXjMDcEVBTG40IFJtYw=" "integrity": "sha1-qYVSYfGRyXjMDcEVBTG40IFJtYw="
}, },
"vue-baidu-map": {
"version": "0.21.19",
"resolved": "https://registry.npmjs.org/vue-baidu-map/-/vue-baidu-map-0.21.19.tgz",
"integrity": "sha512-E2knd5nklYdRjGk53CsOklsueqdW9KUtHT+yLWO4L1woIEOya09et/S3+IEfcs0lsnL/ZG/Efpj3MIsQ0DEi2w==",
"requires": {
"bmaplib.curveline": "^1.0.0",
"bmaplib.heatmap": "^1.0.4",
"bmaplib.lushu": "^1.0.7",
"bmaplib.markerclusterer": "^1.0.13",
"markdown-it": "^8.4.0"
}
},
"vue-count-to": { "vue-count-to": {
"version": "1.0.5", "version": "1.0.5",
"resolved": "https://registry.npmjs.org/vue-count-to/-/vue-count-to-1.0.5.tgz", "resolved": "https://registry.npmjs.org/vue-count-to/-/vue-count-to-1.0.5.tgz",
......
src/main.js
View file @ 2da3606a
...@@ -23,15 +23,18 @@ import { getToken } from 'utils/auth'; ...@@ -23,15 +23,18 @@ import { getToken } from 'utils/auth';
import 'babel-polyfill';//支持IE执行原生script import 'babel-polyfill';//支持IE执行原生script
import XEUtils from 'xe-utils';//加入常用工具类 import XEUtils from 'xe-utils';//加入常用工具类
import VXEUtils from 'vxe-utils';//加入常用工具类 import VXEUtils from 'vxe-utils';//加入常用工具类
import BaiduMap from 'vue-baidu-map'
// register globally // register globally
Vue.component('multiselect', Multiselect); Vue.component('multiselect', Multiselect);
Vue.component('Sticky', Sticky); Vue.component('Sticky', Sticky);
Vue.component('icon-svg', IconSvg) Vue.component('icon-svg', IconSvg);
Vue.use(ElementUI); Vue.use(ElementUI);
Vue.use(vueWaves); Vue.use(vueWaves);
Vue.use(VXEUtils, XEUtils); Vue.use(VXEUtils, XEUtils);
Vue.use(BaiduMap, {
ak: 'gvQPveN9YrlPSgKUMPK2u2u2BA4yQFRm'
})
// register global utility filters. // register global utility filters.
Object.keys(filters).forEach(key => { Object.keys(filters).forEach(key => {
...@@ -39,7 +42,7 @@ Object.keys(filters).forEach(key => { ...@@ -39,7 +42,7 @@ Object.keys(filters).forEach(key => {
}); });
// register global progress. // register global progress.
const whiteList = ['/login', '/authredirect'];// 不重定向白名单 const whiteList = ['/login', '/authredirect', '/map'];// 不重定向白名单
router.beforeEach((to, from, next) => { router.beforeEach((to, from, next) => {
NProgress.start(); // 开启Progress NProgress.start(); // 开启Progress
if (getToken()) { // 判断是否有token if (getToken()) { // 判断是否有token
......
src/router/index.js
View file @ 2da3606a
...@@ -26,6 +26,12 @@ export const constantRouterMap = [{ ...@@ -26,6 +26,12 @@ export const constantRouterMap = [{
component: _import('login/authredirect'), component: _import('login/authredirect'),
hidden: true hidden: true
}, },
{
path: '/map',
component: _import('map'),
name: '地图',
hidden: true
},
{ {
path: '/404', path: '/404',
component: _import('error/404'), component: _import('error/404'),
...@@ -154,37 +160,4 @@ export const asyncRouterMap = [{ ...@@ -154,37 +160,4 @@ export const asyncRouterMap = [{
name: '服务状态监控', name: '服务状态监控',
authority: 'serviceZipkinManager' authority: 'serviceZipkinManager'
}] }]
}, { }];
path: '/baseInfo',
component: Layout,
name: '基础信息',
icon: 'fa-user',
authority: 'baseInfo',
children: [{
path: 'branchCompany',
component: _import('baseInfo/branchCompany/index'),
name: '分公司管理',
authority: 'branchCompany'
}]
}, {
path: '/vehicle',
component: Layout,
name: '车辆管理',
icon: 'setting',
authority: 'vehicle',
children: [
{
path: 'vehicleInfo',
component: _import('vehicle/vehicleInfo/index'),
name: '车辆信息管理',
authority: 'vehicleInfo'
},
{
path: 'bookRecord',
component: _import('vehicle/bookRecord/index'),
name: '车辆信息管理',
authority: 'bookRecord'
}
]
}
];
src/views/map.vue 0 → 100644
View file @ 2da3606a
<template>
<baidu-map class="map" :center="center" :zoom="zoom" @ready="handler" @click="mapClick(this, $event)">
<!-- 缩放 -->
<bm-navigation anchor="BMAP_ANCHOR_TOP_RIGHT"></bm-navigation>
</baidu-map>
</template>
<script>
export default {
data() {
return {
center: {
lng: 113.764742,
lat: 23.046996
}, // 经纬度
zoom: 12, // 地图展示级别
pointList: [],
pickPoint: null
}
},
methods: {
handler({map}) {
// 定位
this.geolocation(map);
// 产生随机点
const bounds = map.getBounds();
const sw = bounds.getSouthWest();
const ne = bounds.getNorthEast();
const lngSpan = Math.abs(sw.lng - ne.lng);
const latSpan = Math.abs(ne.lat - sw.lat);
for (let i = 0; i < 5; i++) {
const point = {
title: '分公司' + (i + 1),
point: {
lng: sw.lng + lngSpan * (Math.random() * 0.7),
lat: ne.lat - latSpan * (Math.random() * 0.7)
}
};
this.pointList.push(point);
}
this.addMarker(map);
},
mapClick(map, e) {
const point = e.point;
if (this.pickPoint) {
map.removeOverlay(this.pickPoint);
}
console.log(point.lng + ',' + point.lat);
const p = new BMap.Point(point.lng, point.lat);
this.pickPoint = new BMap.Marker(p);
map.addOverlay(this.pickPoint);
},
addMarker(map) {
for (const item of this.pointList) {
const point = new BMap.Point(item.point.lng, item.point.lat);
const mk = new BMap.Marker(point);
const label = new BMap.Label(item.title);
label.setOffset(new BMap.Size(15, -15));
label.setStyle({
'border-radius': '5px',
border: '0px',
'background-color': '#FFFFFF11',
color: 'red',
'font-family': '黑体',
'font-weight': 'bold',
'font-size': '16px'
});
mk.setLabel(label);
map.addOverlay(mk);
}
},
geolocation(map) {
const geolocation = new BMap.Geolocation();
geolocation.enableSDKLocation();
geolocation.getCurrentPosition(function (r) {
if (this.getStatus() === BMAP_STATUS_SUCCESS) {
// const mk = new BMap.Marker(r.point);
// map.addOverlay(mk);
map.panTo(r.point);
console.log('您的位置：' + r.point.lng + ',' + r.point.lat);
} else {
alert('failed' + this.getStatus());
}
});
}
}
}
</script>
<style scoped>
.map {
width: 100%;
height: 500px;
}
</style>
src/views/member/info/index.vue
View file @ 2da3606a
...@@ -337,7 +337,7 @@ ...@@ -337,7 +337,7 @@
}, },
{ {
key: 2, key: 2,
label: '砖石会员', label: '钻石会员',
value: 2 value: 2
} }
], ],
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment