<template> 
 | 
    <div class="box"> 
 | 
        <!--    头部导航    --> 
 | 
        <template v-if="env == 'H5' || env == 'XCX'"> 
 | 
            <v-Header :pathList="pathLists"> 
 | 
                <template v-slot:title>{{title}}</template> 
 | 
            </v-Header> 
 | 
        </template> 
 | 
  
 | 
        <!--    主题内容    --> 
 | 
        <div class="index_content" :style="store.state.type ? 'min-height: 100%' : 'min-height: calc(100% - 44px)'"> 
 | 
            <router-view v-slot="{ Component }"> 
 | 
                <keep-alive> 
 | 
                    <component :is="Component" :key="route.meta.name" v-if="route.meta.keepAlive" /> 
 | 
                </keep-alive> 
 | 
                <component :is="Component" :key="route.meta.name" v-if="!route.meta.keepAlive" /> 
 | 
            </router-view> 
 | 
        </div> 
 | 
    </div> 
 | 
</template> 
 | 
  
 | 
<script setup lang="ts"> 
 | 
    import { getCurrentInstance, onMounted, reactive, ref, watch, computed } from 'vue' 
 | 
    import { useRoute } from 'vue-router' 
 | 
    const { proxy }: any = getCurrentInstance() 
 | 
    import { useStore } from "vuex" 
 | 
    import vHeader from '@/components/common/Header.vue' 
 | 
  
 | 
    const env = computed(() => store.state.env) 
 | 
  
 | 
    const store = useStore() 
 | 
  
 | 
    const route = useRoute() 
 | 
  
 | 
    const isShow = ref<boolean>(false) 
 | 
  
 | 
    const title = ref<string>('') 
 | 
  
 | 
    // alert(window.document.title) 
 | 
    const pathLists = reactive<string[]>([ 
 | 
        '/index', 
 | 
        '/workbench', 
 | 
        '/bulletinboard', 
 | 
        '/my' 
 | 
    ]) 
 | 
  
 | 
    onMounted(() => { 
 | 
        if (proxy.$dd.env.platform !== 'notInDingTalk') {   // 判断是否显示头部导航栏 
 | 
            isShow.value = false 
 | 
        } else { 
 | 
            isShow.value = true 
 | 
        } 
 | 
    }) 
 | 
  
 | 
    watch(() => route.meta.title, (newsPath, oldPath): void => { 
 | 
        title.value = newsPath as string 
 | 
    }, { immediate: true }) 
 | 
</script> 
 | 
  
 | 
<style lang="scss" scoped> 
 | 
.box { 
 | 
    height: 100%; 
 | 
    .index_content { 
 | 
        position: relative; 
 | 
        background: #F7F7F7; 
 | 
    } 
 | 
} 
 | 
</style> 
 |