App.vue 2.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879
  1. <template>
  2. <div id="app" class="flex flex-center flex-col">
  3. <el-header v-if="$route.meta.layout === 'empty' && $route.name !== 'login'">
  4. <top :show-menu="false" />
  5. </el-header>
  6. <el-main class="single">
  7. <div v-if="$route.meta.layout === 'empty' && $route.name !== 'login'">
  8. <div class="wrapper mt-20" v-if="this.$route.meta.show === undefined">
  9. <tips />
  10. </div>
  11. </div>
  12. <router-view v-slot="{ Component, route }">
  13. <keep-alive :include="keepAlive.list">
  14. <component :is="Component" :key="route.fullPath" />
  15. </keep-alive>
  16. </router-view>
  17. </el-main>
  18. </div>
  19. </template>
  20. <script>
  21. // This starter template is using Vue 3 <script setup> SFCs
  22. // Check out https://vuejs.org/api/sfc-script-setup.html#script-setup
  23. import keepAliveStore from '@/store/keepAlive.js'
  24. import top from '@/layout/top.vue'
  25. import router from './router/index.js'
  26. import tips from '@/layout/tips.vue'
  27. export default {
  28. components: { tips, top },
  29. setup() {
  30. const keepAlive = keepAliveStore()
  31. return { keepAlive }
  32. },
  33. data() {
  34. return {
  35. data: '',
  36. type: '33'
  37. }
  38. },
  39. created() {
  40. console.info(
  41. '%c由%c梧桐研究院%c提供技术支持,版本号: v1.0.0',
  42. 'font-size: 14px; margin-bottom: 2px; padding: 6px 8px; color: #fff; background: #707070;',
  43. 'font-size: 14px; margin-bottom: 2px; padding: 6px 8px; color: #fff; background: orange;',
  44. 'font-size: 14px; margin-bottom: 2px; padding: 6px 8px; color: #fff; background: #707070;'
  45. )
  46. },
  47. mounted() {
  48. window.addEventListener('scroll', this.menu)
  49. },
  50. methods: {
  51. router,
  52. menu() {
  53. const scroll =
  54. document.documentElement.scrollTop || document.body.scrollTop
  55. this.$bus.emit('scorll', scroll)
  56. }
  57. }
  58. }
  59. </script>
  60. <style lang="scss" scoped>
  61. #app {
  62. background-color: #f6f7f8;
  63. overflow: hidden;
  64. .single {
  65. height: 100%;
  66. }
  67. }
  68. :deep(.el-main) {
  69. --el-main-padding: 0 !important;
  70. padding: 0 !important;
  71. }
  72. :deep(.el-header) {
  73. padding: 0 !important;
  74. }
  75. </style>