synthesize-upkeep-app/src/components/dj-tabbar.vue

<template>
	<view class="d-flex w-100 tabbar">
		<view class="flex-1 d-flex a-center j-center" v-show="!commitInfo.name" @click="submit">主保养人</view>
		<view class="flex-1 d-flex a-center j-center flex-column" v-show="commitInfo.name" @click="submit">
			<view class="u-m-b-8">保养人:{{ commitInfo.name }}</view>
			<view>日期: {{ commitInfo.time | slice_time }}</view>
		</view>
		<view class="flex-1 d-flex a-center j-center" v-show="!squadInfo.name" @click="Squad">跟线人员</view>
		<view class="flex-1 d-flex a-center j-center flex-column" v-show="squadInfo.name" @click="Squad">
			<view class="u-m-b-8">跟线人:{{ squadInfo.name }}</view>
			<view>日期: {{ squadInfo.time | slice_time }}</view>
		</view>
		<view class="flex-1 d-flex a-center j-center" v-show="!supervisorInfo.name" @click="Supervisor">班长确认</view>
		<view class="flex-1 d-flex a-center j-center flex-column" v-show="supervisorInfo.name" @click="Supervisor">
			<view class="u-m-b-8">班长:{{ supervisorInfo.name }}</view>
			<view>日期: {{ supervisorInfo.time | slice_time}}</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			// 是否需要提交 0不要 1要
			// needCommit: {
			// 	type: Number,
			// 	default: 0
			// },
			// // 是否需要班组长确认 0不要 1要
			// needSquad: {
			// 	type: Number,
			// 	default: 0
			// },
			// // 是是否需要领导确认 0不要 1要
			// needSupervisor: {
			// 	type: Number,
			// 	default: 0
			// },
			// 主保养人
			commitInfo: {
				type: Object,
				default: function() {
					return {}
				}
			},
			// 根线人员信息
			squadInfo: {
				type: Object,
				default: function() {
					return {}
				}
			},
			// 班长确认信息
			supervisorInfo: {
				type: Object,
				default: function() {
					return {}
				}
			}
		},
		methods: {
			submit() {
				console.log(this.noTap());
				if(!this.noTap()) return uni.showToast({
						title: '班长已确认,不能操作',
						duration: 2000,
						icon: 'none',
						position: 'top'
					});
				this.$emit('submit')
			},
			Squad() {
				if(!this.noTap()) return uni.showToast({
						title: '班长已确认,不能操作',
						duration: 2000,
						icon: 'none',
						position: 'top'
					});
				this.$emit('Squad')
			},
			Supervisor() {
				if(!this.noTap()) return uni.showToast({
						title: '班长已确认,不能操作',
						duration: 2000,
						icon: 'none',
						position: 'top'
					});
				this.$emit('Supervisor')
			},
			// 班长确认了就不能点击了
			noTap(){
				return this.supervisorInfo.name ? false : true
			}
		},
		filters: {
			slice_time(time) {
				if(!time) return
				return time.slice(0,10)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.tabbar {
		height: 55px;
		background: $dj-white-color;
		border-top: 5px solid #F1F2F6;
		color: $dj-primary-color;
	}
	.tabbar>view+view {
		border-left: 1px solid #DCDCDC;
	}
</style>