daijia/司机端/pages/home/index.vue

<template>
	<view class="bg min100 pb-20">
		<u-sticky h5-nav-height="0">
			<view class="status_bar bg-blue">
			</view>
			<view class="bg-blue white">
				<view class="center pd-20" @click="getCity" style="padding-top: 52rpx;">
					<view class="size-36 mr-10">{{city}}</view>
					<u-icon name="arrow-down"></u-icon>
				</view>
				<u-tabs v-if="tabList.length>1" :list="tabList" font-size="32" bg-color="#286ceb" height="90" active-color="#fff"
				 inactive-color="#eee" :is-scroll="false" :current="index" @change="change"></u-tabs>
			</view>
		</u-sticky>
		<view class="pd-30">
			<empty v-if="list.length==0" text="暂无订单"></empty>
			<view v-for="(item,i) in list" :key="i" class="mb-30">
				<orderItem v-if="current==0" :type="1" :item="item"></orderItem>
				<sfItem v-if="current==1" type="1" :item="item"></sfItem>
				<hyItem v-if="current==2" type="1" :item="item"></hyItem>
			</view>
			<u-loadmore v-show="list.length>9" :status="status" icon-type="flower" bg-color="transperant" margin-top="30"
			 margin-bottom="30" />
			<image @click="toPublish" type="1" v-if="current==1" src="../../static/sf-pub.png" style="width: 100rpx;height: 100rpx;position: fixed;bottom: 120rpx;right: 20rpx;"
			 mode=""></image>
		</view>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex'
	export default {
		computed: {
			...mapState(['city', 'tabList'])
		},
		data() {
			return {
				index: 0,
				current: '',
				page: 1,
				status: 'loadmore',
				list: [],
				timer1: null,
				timer2: null,
				timer3: null,
				flag: false
			}
		},
		onShow() {
			this.flag = false;
			this.page = 1
			this.list = []
			this.status = 'loadmore'
			this.timer3 = setInterval(() => {
				if (this.tabList && this.tabList[0]) {
					clearInterval(this.timer3)
					this.timer3 = null
					if (!this.current) {
						this.current = this.tabList[0].id
					}
					// 列表接口
					if (this.city) {
						console.log(666);
						if (this.current == 0) {
							this.getList1()
						}else if (this.current == 1) {
							this.getList2()
						}else if (this.current == 2) {
							this.getList3()
						} 
					} else {
						let _this = this
						uni.getLocation({
							type: 'gcj02',
							geocode: true,
							success(res) {
								let city = res.address ? res.address.city : '普洱市'
								_this.$store.commit('getCity', city)
								if (_this.current == 0) {
									_this.getList1()
								} else if (_this.current == 1) {
									_this.getList2()
								}else if (_this.current == 2) {
									_this.getList3()
								}
							},
							fail() {
								if (_this.current == 0) {
									_this.getList1()
								} else if (_this.current == 1) {
									_this.getList2()
								}else if (_this.current == 2) {
									_this.getList3()
								}
							}
						});
					}
					// 实时更新新下的单
					if (!this.timer1) {
						this.timer1 = setInterval(() => {
							if (this.current == 0 && this.flag) {
								this.$http('/addons/ddrive/order/order_refresh', {
									order_id: this.list.length > 0 ? this.list[0].id : '',
									city: this.city || ''
								}, "POST").then(data => {
									if (data.length > 0) {
										data.forEach(item => {
											this.list.unshift(item)
										})
									}
								})
							} else if (this.current == 1 && this.flag) {
								this.$http('/addons/ddrive/sforder/order_refresh', {
									order_type: 1,
									order_id: this.list.length > 0 ? this.list[0].id : '',
									city: this.city || ''
								}, "POST").then(data => {
									if (data.length > 0) {
										data.forEach(item => {
											this.list.unshift(item)
										})
									}
								})
							}else if (this.current == 2 && this.flag) {
								this.$http('/addons/ddrive/hyorder/order_refresh', {
									order_id: this.list.length > 0 ? this.list[0].id : '',
									city: this.city || ''
								}, "POST").then(data => {
									if (data.length > 0) {
										data.forEach(item => {
											this.list.unshift(item)
										})
									}
								})
							}
						}, 1000)
					}
					// 实时更新减少的单
					if (!this.timer2) {
						this.timer2 = setInterval(() => {
							if (this.list.length > 0 && this.current == 0) {
								this.$http('/addons/ddrive/order/order_eliminate', {
									city: this.city || ''
								}, "POST").then(data => {
									if (data.length > 0) {
										this.list.forEach((item, i) => {
											if (data.includes(item.id * 1)) {
												this.list.splice(i, 1)
											}
										})
									}
								})
							}else if (this.list.length > 0 && this.current == 1) {
								this.$http('/addons/ddrive/sforder/order_eliminate', {
									order_type: 1,
									city: this.city || ''
								}, "POST").then(data => {
									if (data.length > 0) {
										this.list.forEach((item, i) => {
											if (data.includes(item.id * 1)) {
												this.list.splice(i, 1)
											}
										})
									}
								})
							}else if (this.list.length > 0 && this.current == 2) {
								this.$http('/addons/ddrive/hyorder/order_eliminate', {
									city: this.city || ''
								}, "POST").then(data => {
									if (data.length > 0) {
										this.list.forEach((item, i) => {
											if (data.includes(item.id * 1)) {
												this.list.splice(i, 1)
											}
										})
									}
								})
							}
						}, 5000)
					}
				}
			}, 200)
		},
		onUnload() {
			clearInterval(this.timer1)
			clearInterval(this.timer2)
			clearInterval(this.timer3)
			this.timer1 = null
			this.timer2 = null
			this.timer3 = null
		},
		onHide() {
			clearInterval(this.timer1)
			clearInterval(this.timer2)
			clearInterval(this.timer3)
			this.timer1 = null
			this.timer2 = null
			this.timer3 = null
		},
		onPullDownRefresh() {
			this.page = 1
			this.flag = false
			this.list = []
			if (this.current == 0) {
				this.getList1()
			} else if (this.current == 1) {
				this.getList2()
			}else if (this.current == 2) {
				this.getList3()
			}
		},
		onReachBottom() {
			//避免多次触发
			if (this.status == 'loading' || this.status == 'nomore') {
				return;
			}
			if (this.current == 0) {
				this.getList1()
			} else if (this.current == 1) {
				this.getList2()
			}else if (this.current == 2) {
				this.getList3()
			}
		},
		components: {},
		methods: {
			//代驾
			getList1() {
				this.flag = false
				this.status = "loading";
				this.$http('/addons/ddrive/order/takingList', {
					page: this.page,
					city: this.city
				}, "POST").then(res => {
					let data = res.data
					if (data.length < 10) {
						this.status = "nomore"
					} else {
						this.page = this.page + 1
						this.status = "loadmore"
					}
					this.list = this.list.concat(data)
					this.flag = true
					uni.stopPullDownRefresh();
				})
			},
			//顺风车
			getList2() {
				this.flag = false
				this.status = "loading";
				this.$http('/addons/ddrive/sforder/order_index', {
					page: this.page,
					start_city: this.city,
					order_type: 1
				}, "POST").then(res => {
					let data = res
					if (data.length < 10) {
						this.status = "nomore"
					} else {
						this.page = this.page + 1
						this.status = "loadmore"
					}
					this.list = this.list.concat(data)
					this.flag = true
					uni.stopPullDownRefresh();
				})
			},
			//货运
			getList3(){
				this.flag = false
				this.status = "loading";
				this.$http('/addons/ddrive/hyorder/taskingList', {
					page: this.page,
					city: this.city,
				}, "POST").then(res => {
					let data = res.data
					if (data.length < 10) {
						this.status = "nomore"
					} else {
						this.page = this.page + 1
						this.status = "loadmore"
					}
					this.list = this.list.concat(data)
					this.flag = true
					uni.stopPullDownRefresh();
				})
			},
			change(index) {
				this.index = index;
				this.current = this.tabList[index].id;
				this.page = 1;
				this.flag = false;
				this.list = [];
				if (this.current == 0) {
					this.getList1()
				} else if (this.current == 1) {
					this.getList2()
				}else if (this.current == 2) {
					this.getList3()
				}
			},
			getCity() {
				uni.navigateTo({
					url: '/pages/home/city'
				})
			},
			// 顺风车发布
			toPublish() {
				uni.navigateTo({
					url: '/pages/shunfeng/publish'
				})
			}
		}
	}
</script>

<style scoped lang="scss">

</style>