定位轨迹

src/projects/pension/apis/Master/health.js

@@ -36,3 +36,12 @@ export function getChartList(params) {
 		method: 'post',
 	})
 }
+
+//获取定位轨迹列表
+export function getLbsList(params) {
+	return request({
+		url: '/mobile/watchApi/getLbsData',
+		data: Qs.stringify(params),
+		method: 'post',
+	})
+}

src/projects/pension/views/Master/Health/Chart.vue

@@ -44,7 +44,7 @@
 
 				pageTitle: this.$route.query.title,
 
-				listFrom: {
+				listForm: {
 					names: this.$route.query.type,
 				},
 
@@ -60,7 +60,7 @@
 			//获取图表数据
 			getChartList() {
 				this.isLoading = true;
-				API_Health.getChartList(this.listFrom).then(response => {
+				API_Health.getChartList(this.listForm).then(response => {
 					this.isLoading = false;
 					this.chartsList = response;
 

src/projects/pension/views/Master/Health/ChartMap.vue

@@ -4,8 +4,14 @@
 		<top-header :pageTitle="pageTitle"></top-header>
 
 		<div class="mui-content vongi-yjcsdat">
-			<div class="lifeMap" id="container">
-				<amap ref="amap"></amap>
+			<div class="lifeRecord">
+				<div class="lifeTime" @click="selectDate" style="z-index: 100;">
+					<div id='result' class="ui-alert"></div>
+					<span v-text="listForm.day"></span>
+				</div>
+				<div class="lifeMap" id="container">
+					<amap ref="amap"></amap>
+				</div>
 			</div>
 		</div>
 
@@ -14,6 +20,7 @@
 </template>
 
 <script>
+	require('$project/assets/js/mui.picker.min.js');
 	import * as API_Health from '@/apis/Master/health'
 	import Common from '$project/components/Common.vue'
 	import Loading from '$project/components/Loading.vue'
@@ -37,10 +44,11 @@
 			return {
 				isLoading: false,
 
-				pageTitle: this.$route.query.title,
+				pageTitle: '',
 
-				listFrom: {
-					names: this.$route.query.type,
+				listForm: {
+					//names: this.$route.query.type,
+					day: '2020-10-17'
 				},
 
 				typeList: '',
@@ -49,13 +57,18 @@
 			}
 		},
 		created() {
-			this.typeList = this.$route.query.type.split(',');
+			if (this.$route.query.title) {
+				this.pageTitle = this.$route.query.title;
+			} else {
+				this.pageTitle = '活动轨迹';
+			}
+			this.typeList = ['lbs'];
 		},
 		methods: {
 			//获取图表数据
 			getChartList() {
 				this.isLoading = true;
-				API_Health.getChartList(this.listFrom).then(response => {
+				API_Health.getLbsList(this.listForm).then(response => {
 					this.isLoading = false;
 					this.chartsList = response;
 
@@ -68,7 +81,7 @@
 			//设置echart数据
 			setEcharts() {
 				var mapList = [];
-				var list = this.chartsList[this.typeList[0]].list;
+				var list = this.chartsList[this.typeList[0]];
 				for (var j = 0; j < list.length; j++) {
 					mapList.push({
 						longtitude: list[j]['value'].split(',')[0],
@@ -87,6 +100,22 @@
 				//触发组件显示地图
 				this.$refs.amap.init(this.pointArr.reverse());
 			},
+			//选择时间
+			selectDate() {
+				var _this = this;
+				var picker = new mui.DtPicker({
+					"type": "date",
+					"beginYear": 2020,
+					"endYear": 2040,
+					"endDate": new Date(),
+					"value": _this.listForm.day
+				});
+				picker.show(function(rs) {
+					_this.listForm.day = rs.text;
+					_this.getChartList();
+					picker.dispose();
+				});
+			},
 			asynCallBack() {},
 		},
 		mounted() {
@@ -113,6 +142,7 @@
 <style scoped src="$project/assets/css/pension.css"></style>
 <style scoped src="$project/assets/css/xpwyfyy.css"></style>
 <style src="$project/assets/css/iconfont.css"></style>
+<style src="$project/assets/css/mui.picker.min.css"></style>
 <style scoped>
 	.lifeMap {
 		height: calc(100vh - 44px);
@@ -122,4 +152,23 @@
 		width: 100%;
 		height: auto;
 	}
+
+	.lifeRecord {
+		height: calc(100vh - 44px);
+	}
+
+	.lifeTime {
+		background: #fff;
+		width: 160px;
+		height: 40px;
+		position: absolute;
+		border-radius: 20px;
+		line-height: 40px;
+		text-align: center;
+		box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
+		left: 50%;
+		margin-left: -80px;
+		font-size: 16px;
+		top: 80px;
+	}
 </style>