<template>
  <div id="app">
    <router-view class="page" />
    <ChatWidget />
  </div>
</template>
<script  >
import ChatWidget from '../src/components/ChatWidget.vue';
import { Debounce, throttle } from '@/utils/publicMethods';
import Vue from 'vue'
   export default {
    name: 'App',

    components: {
    ChatWidget
  },
   
    data() {
      return {
        flag: false,
        isMobile: false,
      };
    },



    created() {
      window.addEventListener("resize",  Debounce( this.updateWindowWidth,10)); 
    },
    beforeDestroy() {
    window.removeEventListener("resize", this.updateWindowWidth); // 移除监听器
  },
    methods:{
      updateWindowWidth(){
        console.log(window.innerWidth ||
        document.documentElement.clientWidth ||
        document.body.clientWidth)
        //取到了屏幕宽度  

        const screenWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
        const isNarrowScreen = screenWidth < 1280;
        Vue.prototype.$isMobile = isNarrowScreen
        location.reload();
      
      }
  
    }



    }
</script>

<style lang="scss">

:root {
  --background-color: #ffffff;
  --text-color: #000000;
}
 
.dark-mode {
  --background-color: #000000;
  --text-color: #ffffff;
}
*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
html,body{
       //隐藏滚动条
       scrollbar-width: none;
    -ms-overflow-style: none;
    border-right: none;
    box-sizing: border-box;
    overflow: hidden;
  
   
    
}
#app {
  // font-family: Avenir, Helvetica, Arial, sans-serif;
  // -webkit-font-smoothing: antialiased;
  // -moz-osx-font-smoothing: grayscale;
  // text-align: center;
  // color: #2c3e50;
  overflow-x: hidden;

  // font-size: 1.1em;
  /* 滚动条整体部分 */
  font-size: 1rem;
::-webkit-scrollbar {
  width: 5PX; /* 宽度 */
  height: 6px; /* 高度 */


}
 
/* 滚动条滑块 */
::-webkit-scrollbar-thumb {
  background-color: #D2C3E9; /* 滑块颜色 */
  border-radius: 20PX; /* 圆角 */
}
 
/* 滚动条轨道 */
::-webkit-scrollbar-track {
  background-color: #f0f0f0; /* 轨道颜色 */
}

/* input type="number" 时去除上下按钮样式 */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
}
input[type="number"] {
  -moz-appearance: textfield;
}

}


.el-message{ //提示信息的层级设置
 
  z-index: 99999 !important;
  min-width: 300px !important;
}


</style>
