workApp/pages/materialCollection/index.vue

<template>
	<view class="page_body">
		<!-- 任务总览 -->
		<task-overview v-if="state.tabBarValue=='task'"></task-overview>
		<!-- 提交材料 -->
		<submit-material v-if="state.tabBarValue=='target'"></submit-material>
		<!-- 审核材料 -->
		<review-material v-if="state.tabBarValue=='review'"></review-material>
		<!-- 底部tabbar -->
		<pageTabbar :tabBarValue="state.tabBarValue" :tabBarList="state.tabBarList" @ChangeTabBarValue="ChangeTabBarValue"></pageTabbar>
	</view>
</template>

<script setup>
	import pageTabbar from '@/components/pageTabbar.vue';//底部tabbar
	import taskOverview from './taskOverview/index.vue';//任务总览
	import submitMaterial from './submitMaterial/index.vue';//提交材料
	import reviewMaterial from './reviewMaterial/index.vue';//审核材料
	import { queryTaskMenu } from '@/reqApi/notification.js';
	import { reactive, onMounted } from 'vue';
	import { useStore } from 'vuex';
	const store = useStore();
	const state = reactive({
		tabBarValue:'task',
		tabBarList:[]
	})
	//切换tabBar
	const ChangeTabBarValue = (name) => {
		state.tabBarValue = name;
	}
	onMounted(()=>{
		GetTaskMenu();
	})
	const GetTaskMenu = () => {
		queryTaskMenu().then(res=>{
			if(res.code == 200){
				const menuList = res?.data || [];
				if(menuList.indexOf('task') > -1){
					state.tabBarList.push({
						"pathName":"task",
						"iconPath": "/static/image/overview/zonglan.png",
						"selectedIconPath": "/static/image/overview/zonglanIcon.png",
						"text": "任务总览"
					})
				}
				if(menuList.indexOf('target') > -1){
					state.tabBarList.push({
						"pathName":"target",
						"iconPath": "/static/image/materialCollection/tijiao.png",
						"selectedIconPath": "/static/image/materialCollection/tijiaoIcon.png",
						"text": "提交材料"
					})
				}
				if(menuList.indexOf('review') > -1){
					state.tabBarList.push({
						"pathName":"review",
						"iconPath": "/static/image/materialCollection/shenhe.png",
						"selectedIconPath": "/static/image/materialCollection/shenheIcon.png",
						"text": "审核材料"
					})
				}
				state.tabBarValue = state.tabBarList?.[0]?.pathName || '';
			}
		})
	}
</script>

<style lang="scss" scoped>
	.page_body{
		height: 100%;
		min-height: auto;
	}
</style>