pinganxiaoyuan/monitorMobile/pages/attendanceCall/index.vue

<template>
	<view style="height: 100%;">
		<u-tabs :list="tabsList" @click="tabsClick" :activeStyle="{
		    color: '#000000',
		}" itemStyle="height:84rpx;width:33.33%;box-sizing:border-box;background:#fff;border-top:1rpx solid rgba(0,0,0,0.03)"></u-tabs>
		<view style="height: calc(100% - 84rpx);">
			<component :is="componentName" ref="pageComponent"/>
		</view>
	</view>
</template>

<script>
	import passengerFlow from "./passengerFlow/index.vue"
	import returnBed from "./returnBed/index.vue"
	import rollCall from "./rollCall/index.vue"
	export default {
		components:{
			passengerFlow,returnBed,rollCall
		},
		data() {
			return {
				tabsList: [{
						name: "点名",
						value: 'rollCall'
					},
					{
						name: "归寝",
						value: 'returnBed'
					},
					{
						name: "客流",
						value: 'passengerFlow'
					},
				],
				componentName:'rollCall'
			}
		},
		methods: {
			tabsClick(item) {
				this.componentName = item.value
			}
		},
		
		onPullDownRefresh(){
			this.$refs['pageComponent'].pullDownRefresh()
			uni.stopPullDownRefresh()
		}
	}
</script>

<style>

</style>