<template>
  <div id="app" v-resize="windowResize">
    <router-view />
  </div>
</template>

<script>
import { breadcrumb } from './settings'
import store from '@/store'
export default {
  name: 'App',
  mounted() {
    this.windowResize(window.innerHeight, window.innerWidth)
  },
  methods: {
    // 窗口变化
    windowResize(height, width) {
      // 查找header高度
      const el_header = document.getElementById('app-header')
      let bodyHeight = height - (el_header ? el_header.clientHeight : 56)
      if (store.getters.tagsView) {
        const el_tagsView = document.getElementById('tags-view-container')
        bodyHeight -= el_tagsView ? el_tagsView.clientHeight : 34
      }
      if (breadcrumb) {
        const el_navbar = document.getElementsByClassName('navbar')
        bodyHeight -= el_navbar ? el_navbar[0].clientHeight : 48
      }
      // 减去2个padding
      // bodyHeight -= 20
      store.dispatch('settings/ChangeHeight', bodyHeight)
    }
  }
}
</script>
<style>
/*.el-form-item__label{*/
/*  width: 115px;*/
/*  text-align: inherit;*/
/*  line-height: 21px !important;*/
/*}*/
.el-message-box{
  width: auto !important;
}

.el-table .el-table__cell {
  text-align: center !important;
}

.el-submenu__title i {
  color: #fff !important;
}

.dialog {
  padding: 10px;
  box-sizing: content-box;
  position: absolute;
  z-index: 999;
  transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
  border-radius: 20px;
  background: #f9f9f9;
  /* max-height: 700px;  */
}
.text_red {
  color: red;
}
.bgred {
  background: #9f1919;
  border: #9f1919ed;
}
.bggreen {
  background: #248a53;
  border: #248a53;
}
.inputWidth {
  flex: 1;
}
.el-upload-dragger{
  width: 300px !important;
}
.el-button--primary{
  color: #FFF;
  background-color: #2483b3 !important;
  border-color: #2483b3  !important;;
}
</style>