You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
58 lines
1.4 KiB
58 lines
1.4 KiB
<template>
|
|
<!-- 校园轨迹组件 -->
|
|
<view class="card radius shadow-warp bg-white">
|
|
<view class="card-head solid-bottom">
|
|
<view class="card-head-avatar bg-purple">
|
|
<view class="cuIcon-circle"></view>
|
|
</view>
|
|
<view class="card-head-title">校园打卡</view>
|
|
<!-- <view class="card-head-action">icon</view> -->
|
|
</view>
|
|
|
|
<view class="card-content">
|
|
<view class="map-wrap">
|
|
<history-map :markers="markers" />
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapState } from 'vuex';
|
|
|
|
export default {
|
|
name: 'LocationMap',
|
|
|
|
computed: {
|
|
...mapState('statistics', ['schoolSigns']),
|
|
|
|
// 坐标标注点
|
|
markers() {
|
|
if (!this.schoolSigns) return null;
|
|
const result = [];
|
|
this.schoolSigns.forEach(item => {
|
|
const content = `${item.siteName}\n${item.number}人`;
|
|
const obj = {
|
|
id: Math.random(),
|
|
latitude: item.latitude,
|
|
longitude: item.longitude,
|
|
iconPath: '/static/location.png',
|
|
callout: {
|
|
content,
|
|
display: 'ALWAYS',
|
|
color: '#fff',
|
|
padding: 4,
|
|
bgColor: '#0A97C6',
|
|
borderRadius: 2,
|
|
textAlign: 'center',
|
|
},
|
|
};
|
|
result.push(obj);
|
|
});
|
|
console.log('result: ', result);
|
|
|
|
return result;
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|