student-assessment/src/layout/index.vue

<template>
  <div class="layout">
    <component :is="finalHeader" 
      :horizontalNavList="horizontalNavList" 
      :showBack="showBack" 
    />
    <AppMain :menuItems="menuList"/>
  </div>
</template>

<!-- vue3 setup -->
<script setup lang="ts">
import {computed,ref} from 'vue'
import Header from './components/header.vue'
import AppHeader from './components/AppHeader.vue'
import AppMain from './components/AppMain.vue'
import { useStore } from 'vuex'
import { useRoute } from 'vue-router'
const store = useStore()
const route = useRoute()

// 此处要根据登录用户的权限 分条件展示 不同的内容
const menuList =  computed(()=>{
  return []
})


const horizontalNavList = computed(()=>{
  return []
})

const showBack = computed(()=>{
  if(route.path.startsWith('/app') && route.path !== '/app' 
      && route.path !== '/app/' && !route.path.startsWith('/app/questionnaireTaskListPage')){
    return true
  }else{
    return false
  }
})

const finalHeader = computed(()=>{
  if(route.path.startsWith('/main')){
    return Header
  }else if(route.path.startsWith('/app') 
          && route.path !== '/app' 
          && route.path !== '/app/' 
        ){
    return AppHeader
  }
})

</script>