<template>
|
<div class="index">
|
<!-- 头部导航 -->
|
<template v-if="env == 'H5'">
|
<v-Header :pathList="pathLists">
|
<template v-slot:title>{{ title }}</template>
|
</v-Header>
|
</template>
|
<!-- 主题内容 -->
|
<div class="index_content" :style="store.state.type ? 'min-height: calc(100% - 64px)' : 'min-height: calc(100% - 108px)'">
|
<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>
|
<!-- 底部导航栏 -->
|
<v-TabBar></v-TabBar>
|
</div>
|
</template>
|
|
<script setup lang="ts">
|
import { getCurrentInstance, reactive, ref, onMounted, computed } from 'vue'
|
import { watch } from 'vue'
|
import { useStore } from "vuex"
|
import { useRoute } from 'vue-router'
|
const { proxy }: any = getCurrentInstance()
|
import vTabBar from '@/components/common/TabBar.vue'
|
import vHeader from '@/components/common/Header.vue'
|
|
const store = useStore()
|
const route = useRoute()
|
const title = ref<string>('')
|
const isShow = ref<boolean>(false)
|
const pathLists = reactive<string[]>([ '/index', '/workbench', '/bulletinboard', '/my' ])
|
const env = computed(() => store.state.env)
|
|
onMounted(() => {
|
isShow.value = proxy.$dd.env.platform === 'notInDingTalk';
|
})
|
|
watch(() => route.meta.title, (newsPath, oldPath): void => {
|
title.value = newsPath as string
|
}, { immediate: true })
|
</script>
|
|
<style lang="scss" scoped>
|
.index {
|
width: 100%;
|
height: 100%;
|
.index_content {
|
position: relative;
|
}
|
}
|
</style>
|
