App.vue 2.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889
  1. <template>
  2. <div id="app" :class="pcOrMobeil === 'PC' ? 'appClass' : '' " v-loading="loading">
  3. <!-- <img src="./assets/logo.png"> -->
  4. <router-view v-if="isRouterAlive"/>
  5. </div>
  6. </template>
  7. <script>
  8. // import commonHeader from '@/components/commonHeaders.vue'
  9. export default {
  10. name: 'App',
  11. provide() {
  12. return {
  13. reload: this.reload
  14. }
  15. },
  16. components:{
  17. // commonHeader
  18. },
  19. data() {
  20. return {
  21. showHeader:false,
  22. pcOrMobeil: '',
  23. loading: true,
  24. isRouterAlive: true
  25. }
  26. },
  27. watch:{
  28. $route: {
  29. handler: function(route) {
  30. // route.path === '/index' || route.path === '/weather'
  31. this.showHeader = route.path === '/login' ? false : true
  32. },
  33. immediate: true
  34. }
  35. },
  36. mounted() {
  37. window.workSpaceVo = {}
  38. this.loadPage()
  39. this.isMobile()
  40. },
  41. methods:{
  42. loadPage() {
  43. setTimeout(() => {
  44. this.loading = false;
  45. }, 1000);
  46. },
  47. reload() {
  48. this.isRouterAlive = false
  49. this.$nextTick(() =>{
  50. this.isRouterAlive = true
  51. })
  52. },
  53. isMobile() {
  54. let flag = navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i)
  55. if (flag) {
  56. window.localStorage.setItem('isMobile', 'Mobile')
  57. this.pcOrMobeil = 'Mobile'
  58. } else {
  59. window.localStorage.setItem('isMobile', 'PC')
  60. this.pcOrMobeil = 'PC'
  61. }
  62. }
  63. }
  64. }
  65. </script>
  66. <style lang="less">
  67. @import "./assets/css/main.css";
  68. .el-overlay{
  69. .el-dialog{
  70. .el-dialog__header{
  71. .el-dialog__title{
  72. font-size: 14px;
  73. }
  74. }
  75. }
  76. }
  77. /* @import "./assets/css/color-dark.css"; */
  78. #app{
  79. /* background: #184FB4; */
  80. /* background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#005777), to(#005777), color-stop(0.2, #007aab),color-stop(0.8, #007aab)); */
  81. }
  82. .appClass{
  83. width: 100% ;
  84. height: 100%;
  85. overflow: hidden;
  86. }
  87. </style>