jp-car-phone/pages/route/index.js

 import * as API from '@/apis/route.js'
  import * as API_index from '@/apis/index.js'
 import * as WxJsApi from '@/utils/wxJsApi.js'
 
import Carmap from '@/components/Carmap.vue'

export default {
	data() {
		return {
			wxinit:false,
			mapopen:false,
			initBl: false,
			title: '乘车人',
			show: false,
			id: 0, // 使用 marker点击事件 需要填写id
			upid:'',
			downid:'',
			downItem:{},
			//地图居中后的位置
			longitude: 112.276527,
			latitude: 30.306427,
			show1: false,
			show2: false,
			shiftInfo: {

			},
			remindList:[],
			list: [{}, {}],
			 carList:[],
			caritem:{
				driverInfo:{}
			},
			caritemBl:false,
			stationList: [],
			dis:'',
			//个人
			info: {
				obj: null,
				init: false,
				longitude: '',
				latitude: '',
			},
			reverseInit:false,
			myinterval: '',
			routeInfo:{},
			popid:0,
			radiolist: [
					{
						name: '不提醒',
						isRemind: "0",
					},
					{
						name: '提前1站',
						isRemind: "1",
					},
					{
						name: '提前2站',
						isRemind: "2",
					}
				]

		}
	},
	components: {
		Carmap
	},

	methods: {
		selectBtn(i){
			
			this.popid=i;
			
			this.$forceUpdate()
		},
		makePhoneCall(tel){
			uni.makePhoneCall({
			    phoneNumber: tel //仅为示例
			});
		},
		radioChange(e){
			console.log(e)
		},
		vehicleStationDis(){
			var obj={
				startStationId:this.stationList[0].id,
				currentStationId :this.downItem.id,
				routeId:this.routeInfo.id,
			}
			if(this.stationList[0].id==this.downItem.id&&this.routeInfo.interval){
				
				
				var nowDate =new Date();
				var curDay=nowDate.getFullYear()+"-"+(nowDate.getMonth()+1)+"-"+nowDate.getDate();
				var startDate =new Date(curDay+" "+this.routeInfo.startTime+":00");
				var endDate =new Date(curDay+" "+this.routeInfo.endTime+":00");
				if(nowDate.getTime()>endDate.getTime()){
					this.dis=""
				}else{
					var d=this.routeInfo.interval - parseInt((nowDate.getTime()-startDate.getTime())/1000/60)%this.routeInfo.interval
					this.dis="等待发车... 大约"+d+"分钟发车"
				}
				
			}else{
				this.$refs.common.showLoading();
				API.vehicleStationDis(obj).then((res) => {
					this.dis=res.data;
					this.$refs.common.showLoading(false);
				}).catch(error => {
						this.$refs.common.showLoading(false,error);			
				}) 
			}
			
		},
		radioGroupChange(){
			
			this.downItem.isRemind=this.popid;
			var item= this.downItem
			
			if(item.isRemind==0){
				if(this.downItem.remindId){
					this.del(item.remindId,item.isRemind!=0)
				}else{
					this.show1 = false
					this.$forceUpdate()
				}
				return
			}
			if(item.remindId){
				this.del(item.remindId,item.isRemind!=0)
			}else{
				this.remindAdd()	
			}
			
		},del(id,bl){
				API_index.cancelRemind(id).then((res) => {
					this.downItem.remindId=""
					if(bl){
						this.remindAdd()	
					}else{
						this.show1 = false
						this.$forceUpdate()
						this.$refs.common.alert( "设置成功");
					}
				}).catch(error => {
						this.$refs.common.alert( error);
				}) 
			},
			 
		remind(){
			 var myBtn = document.getElementById("subscribe-btn").tap();
			 myBtn.tap();
		},
		showCar(item){
			for(var i in this.carList){
				var car= this.carList[i]
				if(car.currentStationId==item.id){
					return true;
				}
			}
			return false;
		},
		showname(name){
			if(!name){
				return "";
			}
		
			return name.substring(0,1)+'师傅';
		},
		getCar(){
			if(this.stationList.length==0){
				return;
			}
			var obj={
				routeId:this.id,
				startStationId:this.stationList[0].id,
			}
			API.routeShiftList(obj).then((response) => {
				this.carList=response.data;
				this.$refs.amap.setCarList(response.data);
				this.vehicleStationDis();
			}).catch(error => {
				this.$refs.common.showLoading(false,error)
			})
		},
		mapopenBtn(){
			this.mapopen=!this.mapopen;
			if(this.mapopen){
				this.$refs.amap.setMyStyle("width: 100%; height: 340px;")
			}else{
				this.$refs.amap.setMyStyle("width: 100%; height: 140px;")
				
			}
		},
		downBtn(item) {
			this.$refs.amap.setSite(item);
			this.$refs.amap.setCenter(item);
			this.downid=item.id;
			this.downItem=item;
			this.vehicleStationDis();
			this.$forceUpdate()
		},
		remindAdd(){
			if(this.downItem.id){
			
				var obj={
					startStationId:this.stationList[0].id,
					endStationId:this.stationList[this.stationList.length-1].id,
					remindStationId :this.downItem.id,
					stopInAdvance:this.downItem.isRemind,
					remindType:"1",
					routeId:this.routeInfo.id,
					openId:this.carhelp.getOpenId()
				}
				API_index.saveRemind(obj).then((res) => {
					this.downItem.remindId=res.data.id
					this.$refs.common.alert( "设置成功");
					this.show1 = false
					this.$forceUpdate()
				}).catch(error => {
						this.$refs.common.alert( error);
				}) 
			}
		},
		
		drawing(point, startend) {
			if (this.$refs.amap) {
				this.$refs.amap.initMap(point, this.stationList,startend);
			}
		},
		carShow(item){
			
			var caritem =null;
			for(var i in this.carList){
				var car= this.carList[i]
				if(car.currentStationId==item.id){
					var caritem=car;
					break
				}
			}
			this.caritem=caritem;
			this.caritemBl=true;
			
			
		},
		reverse(){
			
			this.stationList.reverse();
			this.getCar()
			 this.passengerShiftRemindList();
			
			this.$refs.amap.setStartend(this.stationList);
			document.getElementById('map-route-main').scrollLeft = 0
			this.$nextTick(function() {
				const query = uni.createSelectorQuery().in(this);
				query.select('.map-down').boundingClientRect(data => {
					if(data){
						document.getElementById('map-route-main').scrollLeft = data.left-20;
					}
					this.$refs.common.showLoading(false);
					//this.downBtn()
				}).exec();
			});
			
		},
		 setRemind(){
			 for(var i in this.stationList){
			 	var item=this.stationList[i];
				item.isRemind=0;
				item.remindId="";
			 	for(var j in this.remindList){
			 			var obj=this.remindList[j];	
						if(this.stationList[0].id==obj.startStationId&&obj.remindType==1){
							if(obj.remindStationId==item.id){
								item.remindId=obj.id;
								item.isRemind=obj.stopInAdvance;
							}
						}
			 	}
			 
			 }
			 this.$forceUpdate()
		 },
		 passengerShiftRemindList(){
			 	this.$refs.common.showLoading()
			 API.passengerShiftRemindList({
			 	routeId:this.id,
			 	openId:this.carhelp.getOpenId(),
			 }).then((response) => {
			 	this.remindList=response.data;
			 	this.setRemind();
					this.$refs.common.showLoading(false)
			 })
		 },
		getPassengerInfo() {
			
			this.$refs.common.showLoading()
				
			API.routeDetail(this.id).then((response) => {
				 
				var  list=response.data.stationInfoList;
				if(this.upid&&list.length){
					
					if(this.upid==list[list.length-1].id){
						list.reverse();
					}
					this.upid="";
				}
				this.stationList=list;
				for(var i in list){
					list[i].isRemind=0;
					if(list[i].id==this.downid){
						this.downItem=list[i];
					}			
				}
				this.passengerShiftRemindList();
				
				this.$refs.common.showLoading(false)
				
				var point = [];
				this.routeInfo=response.data.routeInfo;
				this.title=this.routeInfo.name;
				if(!response.data.routeInfo.mapPath){
					this.$refs.common.showLoading(false,"路线加载失败！")
					return;
				}
				response.data.routeInfo.mapPath.split("|").forEach((item) => {
					var sz = item.split(",");
				
					point.push({
						longitude: sz[0],
						latitude: sz[1],
					})
				})
				var startend = [{
					longitude: this.stationList[0].longitude,
					latitude: this.stationList[0].latitude,
					name: this.stationList[0].name
				}, {
					longitude: this.stationList[this.stationList.length-1].longitude,
					latitude: this.stationList[this.stationList.length-1].latitude,
					name: this.stationList[this.stationList.length-1].name
				}];
				
				this.drawing(point,startend);
				this.$refs.common.showLoading(false)
				
				this.getPoint()
				
				this.$nextTick(function() {
					const query = uni.createSelectorQuery().in(this);
					query.select('.map-down').boundingClientRect(data => {
						if(data){
							document.getElementById('map-route-main').scrollLeft = data.left-20;
						}
						this.$refs.common.showLoading(false);
						//this.downBtn()
					}).exec();
				});
				
			}).catch(error => {
				this.$refs.common.showLoading(false,error)
			})
		},
		mapdown(){
		
				if(this.downid=="null"){
					this.downid="";
				}
			if(this.downid){
				this.downBtn(this.downItem)
			}
			
		},
		getPoint() {


			
		
			if (!this.info.init) {
				WxJsApi.getWxConfig([ 'getLocation','getSetting']).then(() => {
					// this.$refs.common.showLoading(false)
					this.getLocation()
				});
			}else{
					this.getLocation()
			}
			this.getCar();
			var pages = getCurrentPages();
			var page = (pages[pages.length - 1]).route;
			if (page == "pages/route/index") {
				setTimeout(this.getPoint, 10000);
			}
		},
		getLocation(){
			WxJsApi.getLocation().then((res) => {
				console.log("----getLocation ok-----")
				var latitude = parseFloat(res.latitude);
				var longitude = parseFloat(res.longitude);
			
				if (!this.info.init) {
					this.latitude = latitude;
					this.longitude = longitude;
				}
				this.info.init = true
				this.info.latitude = latitude;
				this.info.longitude = longitude;
			
				this.$refs.amap.setPerson(this.info);
			
			}).catch(error => {
				console.log(error)
			})
		}

	},
	onLoad(op) {
		this.upid=op.upid;
		this.id = op.id
		this.downid=op.downid;
	},
	onUnload() {
		if (this.myinterval) {
			clearInterval(this.myinterval)
		}
	},
	onReady() {
		WxJsApi.getWxConfig([ 'getLocation','getSetting']).then(() => {
					// this.$refs.common.showLoading(false)
					this.wxinit=true;
				
					
				});	
		
		this.getPassengerInfo()
		
	}
}