<template>
	<view>
		<view class="item" v-for="(item, index) in items" :key="index" @click="onEnqueue(item)">{{item}}入列</view>
	</view>
</template>

<script>
	import Queue from '@/public/queue'
	let queue = new Queue()
	export default {
		data() {
			return {
				items: [0,1,2,3,4,5,6,7,8,9],
				start: false
			};
		},
		created() {
			
		},
		
		methods:{
			onEnqueue(e){
				let startTime
				queue.enqueue(e)
				if(!this.start){
					this.start = true
					this.startQueue(queue, startTime)
				}
			},
			startQueue(outTime){
				outTime = setInterval(() => {
					if(queue.isNull()){
						clearInterval(outTime)
						this.start = false
						return
					}
					queue.front().then(val => {
						console.log(val)
						// 此处处理对接接口请求
					})
					queue.dequeue()
				}, 1000)
			}
		}
	}
</script>

<style lang="scss">
	.item{
		margin: $margin;
		background: white;
		text-align: center;
		color: $mian-color;
		line-height: 90rpx;
		font-weight: bold;
	}
	.button{
		background: white;
		margin: $margin;
		height: 90rpx;
		line-height: 90rpx;
		text-align: center;
	}
</style>
