BusinessBenchmark/src/App.vue

<template>
   <div id="app" :class="pcOrMobeil === 'PC' ? 'appClass' : '' " v-loading="loading">
    <!-- <img src="./assets/logo.png"> -->
    <router-view v-if="isRouterAlive"/>
  </div>
</template>

<script>
// import commonHeader from '@/components/commonHeaders.vue'
import DevicePixelRatio from '@/utils/device'
export default {
    name: 'App',
    provide() {
        return {
            reload: this.reload
        }
    },
    components:{
        // commonHeader
    },
    data() {
        return {
            showHeader:false,
            pcOrMobeil: '',
            loading: true,
            isRouterAlive: true
        }
    },
    watch:{
        $route: {
            handler: function(route) {
                // route.path === '/index' || route.path === '/weather'
                this.showHeader = route.path === '/login' ? false : true
            },
            immediate: true
        }
    },
    created() {
        // new DevicePixelRatio().init()
    },
    mounted() {
        window.workSpaceVo = {}
        this.loadPage()
        this.isMobile()
    },
    methods:{
        loadPage() {
            setTimeout(() => {
                this.loading = false;
            }, 1000);
        },
        reload() {
            this.isRouterAlive = false
            this.$nextTick(() =>{
                this.isRouterAlive = true
            })
        },
        isMobile() {
            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)
            if (flag) {
                window.localStorage.setItem('isMobile', 'Mobile')
                this.pcOrMobeil = 'Mobile'
            } else {
                window.localStorage.setItem('isMobile', 'PC')
                this.pcOrMobeil = 'PC'
            }
        }
    }
}
</script>

<style lang="less">
@import "./assets/css/main.css";
.el-overlay{
    .el-dialog{
        .el-dialog__header{
            .el-dialog__title{
                font-size: 14px;
            }
        }
    }
}
/* @import "./assets/css/color-dark.css"; */
#app{
    /* background: #184FB4; */
    /* background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#005777), to(#005777), color-stop(0.2, #007aab),color-stop(0.8, #007aab)); */
}
.appClass{
    width: 100% ;
    height: 100%;
    overflow: hidden;
}
</style>