<template>
	<section class="app-main">
		<navbar v-if="key !== '/dashboard'"/>
		<transition name="fade-transform" mode="out-in">
			<keep-alive :include="cachedViews">
				<router-view :key="key"/>
			</keep-alive>
		</transition>

		<!-- <div v-if="$store.state.settings.showFooter" id="el-main-footer">
		  <span v-html="$store.state.settings.footerTxt" />
		  <span> ⋅ </span>
		  <a href="https://beian.miit.gov.cn" target="_blank">{{ $store.state.settings.caseNumber }}</a>
		</div> -->
		<!-- <div class="page-inline">
		</div> -->
	</section>
</template>

<script>
import { default as Navbar } from './Navbar'
export default {
  name: 'AppMain',
  components: {
    Navbar,
  },
  computed: {
    cachedViews() {
      return this.$store.state.tagsView.cachedViews
    },
    key() {
      return this.$route.path
    }
  }
}
</script>

<style lang="scss">
	.app-main {
		/* 50= navbar  50  */
		//min-height: calc(100vh - 50px);
		width: 100%;
		position: relative;
		overflow: hidden;
		/* overflow-y: auto; */
		flex:1;
		display:flex;
		flex-direction:column;
		//padding:.925vh 0;
		background-color:#00154e;
	}

	//.page-inline{height:100%;width:100%;display:flex;}

	.el-popup-parent--hidden {
	  .fixed-header {
		padding-right: 15px;
	  }
	}
</style>