yangjunjing 5 yıl önce
ebeveyn
işleme
264d74c2ae

+ 2 - 2
src/api/scan/httpUtil.js

@@ -32,7 +32,7 @@ function errorResponse(vm, response, err) {
 
 export default {
     getJson: function(url, data, success, failed, err) {
-        let ProjectId = storage.get("global_project_selected")
+        let ProjectId = localStorage.getItem("projectId")
         let userName = storage.get("user_name")
         let vm = this;
         fetch({ url: url, method: 'get', params: data, headers: {'ProjectId': ProjectId, 'Comming': 'adm' ,'Account': userName}}).then((response) => {
@@ -42,7 +42,7 @@ export default {
         });
     },
     postJson: function(url, data, success, failed, err) {
-        let ProjectId = storage.get("global_project_selected")
+        let ProjectId = localStorage.getItem("projectId")
         let userName = storage.get("user_name")
         let vm = this;
         fetch({ url: url, method: 'post', data: data, headers: {'ProjectId': ProjectId, 'Comming': 'adm' ,'Account': userName} }).then((response) => {

+ 0 - 10
src/api/scan/request.js

@@ -1550,14 +1550,4 @@ export function addTabFunNum(param, success) {
 export function tableFuncRelatedOverview(param, success) {
     let url = `/pointconfig/report/meter-related`
     http.postJson(url, param, success)
-}
-//实例中查询设备信息
-export function getEquipByEqID(param, success) {
-    let url = `${baseUrl}/datacenter/equip/query`
-    http.postJson(url, param, success)
-}
-//获取楼层信息
-export function getFloorMsgByFloorID(param, success) {
-    let url = `${baseUrl}/datacenter/floor/query`
-    http.postJson(url, param, success)
 }

+ 2 - 0
src/components/business_space/business/handsontable.vue

@@ -33,6 +33,7 @@
 import "@/assets/js/chosen.jquery.min";
 import tools from "@/utils/scan/tools";
 import "@/assets/js/handsontable-chosen-editor";
+import lStorage from '@/utils/localStorage'
 import myPagination from "@/components/common/myPagination";
 import addBusiness from "@/components/business_space/dialogs/addDialog/businessDialog"
 import showTools from "@/utils/handsontable/notShow"
@@ -251,6 +252,7 @@ export default {
     },
     getInfors(infos, row) {
       let val = this.hot.colToProp(row.col);
+      lStorage.set('screen_data', {path: this.$route.path, data: {RoomID: infos.RoomID, zone: this.zoneCode}})
       if (val == "point") {
         this.$router.push({
           path: "/ledger/spaceDetail",

+ 0 - 4
src/components/ledger/handsontables/system.vue

@@ -393,11 +393,7 @@ export default {
         columnSorting: true, //添加排序
         sortIndicator: true, //添加排序
         renderAllRows: true,
-<<<<<<< HEAD
-        // observeChanges: false, //启用observeChanges插件
-=======
         observeChanges: false,
->>>>>>> 48591ac128a8a8afb10aaeee8316d8df9b5bbe15
         // colWidths: 200,
         autoColumnSize: true,
         language: "zh-CN",

+ 3 - 5
src/components/point/report/objectInstance.vue

@@ -38,9 +38,7 @@ import { SGraphyView } from "@saga-web/graphy/lib";
 import { LocationPointScene, DivideFloorScene } from "@saga-web/cad-engine"
 import { SColor } from "@saga-web/draw/lib";
 
-import {
-  getTabFunNumObjInstance, getEquipByEqID, getFloorMsgByFloorID, queryZone
-} from '@/api/scan/request'
+import { getTabFunNumObjInstance, queryEquip, floorQuery, queryZone } from '@/api/scan/request'
 
 export default {
   data() {
@@ -76,7 +74,7 @@ export default {
                 Filters: `EquipID='${item.TypeCode + this.projectId.substring(2) + item.ObjectID}'`
               }
               //获取设备信息
-              getEquipByEqID(pa, equipMsg => {
+              queryEquip(pa, equipMsg => {
                 if (equipMsg.Content[0] && equipMsg.Content[0].LocationJson && equipMsg.Content[0].FloorId) {
                   let canvasOption = {
                     /** 标记的id  */
@@ -124,7 +122,7 @@ export default {
       }
       let that = this;
       //获取楼层信息
-      getFloorMsgByFloorID(param, floorMsg => {
+      floorQuery(param, floorMsg => {
         //刷新canvas
         that.refreshCanvas = new Date().getTime();
         if (!that.views[key]) {

+ 6 - 1
src/components/point/report/tabFunNumOverview.vue

@@ -11,7 +11,7 @@
     </div>
     <!-- 数据表格 -->
     <div class="table-area">
-      <el-table :data="tableData" style="width: 100%" height="calc(100% - 32px)" v-loading="loading" :header-cell-style="headerStyle" >
+      <el-table :data="tableData" style="width: 100%" height="calc(100% - 32px)" v-loading="loading" :header-cell-style="headerStyle" @row-click="handleClickRow">
         <el-table-column prop='' label='' show-overflow-tooltip width="35" header-align='center'>
           <template slot-scope="scope">
             <el-tooltip v-if="scope.row.DataQuality!=0" content="已断数,请检查" effect="dark" placement="top">
@@ -86,6 +86,7 @@ import historyChart from './historyChart'
 import dataSource from './dataSource'
 import objectInstance from './objectInstance'
 import addTabFunNum from './addTabFunNum'
+import lStorage from '@/utils/localStorage'
 export default {
   data() {
     return {
@@ -127,6 +128,9 @@ export default {
         this.drawers[index].drawer = true;
       }
     },
+    handleClickRow(row,column,event){//点击表格行
+      lStorage.set('screen_data', {path: this.$route.path, data: {MeterFunc: row.MeterFunc, RelatedInstance: row.RelatedInstance}})
+    },
     //获取统计数据
     getOverViewList() {
       this.loading = true;
@@ -216,6 +220,7 @@ export default {
 }
 /deep/ .el-drawer__body {
   height: 90%;
+  overflow-y: auto;
 }
 /deep/ .el-table__body-wrapper tr:hover{
   .dialog-btn{

+ 43 - 0
src/components/screen/integrateresults/buildfloorList.vue

@@ -0,0 +1,43 @@
+<template>
+  <div class="buildfloor-list" v-loading="loading">
+    <el-scrollbar style="height:100%;">
+
+    </el-scrollbar>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import { getTabFunNumObjInstance } from '@/api/scan/request'
+
+export default {
+  computed: {
+    ...mapGetters('layout', ['userInfo', 'projectId', 'projects', 'userId'])
+  },
+  props: {
+    queryParams: {
+      type: Object
+    }
+  },
+  data() {
+    return {
+      loading: false,
+    }
+  },
+  methods:{
+    
+  },
+  watch: {
+    
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.buildfloor-list{
+  height: 100%;
+  /deep/ .el-scrollbar__wrap {
+    overflow-x: hidden;
+  }
+}
+</style>

+ 71 - 0
src/components/screen/integrateresults/realtimeData.vue

@@ -0,0 +1,71 @@
+<template>
+  <div class="data-box" v-loading="loading">
+    <p class="meter-func">表号-功能号:{{queryParams.MeterFunc || '--'}}</p>
+    <p style="margin-top:17px;">当前读数:{{newData || '--'}}</p>
+    <p style="margin-bottom:17px;">最后获取时间:{{lastTime || '--'}}</p>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import { getTabFunNumOverview } from '@/api/scan/request'
+
+export default {
+  computed: {
+    ...mapGetters('layout', ['userInfo', 'projectId', 'projects', 'userId'])
+  },
+  props: {
+    queryParams: {
+      type: Object
+    }
+  },
+  data() {
+    return {
+      loading: false,
+      newData: '',
+      lastTime: '',
+    }
+  },
+  methods:{
+    getNewData() {
+      this.loading = true
+      if(this.queryParams.MeterFunc){
+        getTabFunNumOverview({MeterFunc: this.queryParams.MeterFunc}, res => {
+          this.loading = false
+          if(res.Content[0] && res.Content[0].Data){
+            let data = res.Content[0].Data
+            this.newData = data.Data==null?data.Data:'' + (data.Unit?data.Unit:'')
+            this.lastTime = data.Time
+          }
+        })
+      } else {
+        this.loading = false
+      }
+    },
+  },
+  watch: {
+    'queryParams.MeterFunc': {
+      handler(newdata, olddata) {
+        this.newData = ''
+        this.lastTime = ''
+        this.getNewData()
+      },
+      immediate: true
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+$borderColor: rgba(201, 201, 201, 1);
+.data-box{
+  border: 1px solid $borderColor;
+  .meter-func{
+    border-bottom: 1px solid $borderColor;
+  }
+  p{
+    line-height: 35px;
+    padding-left: 10px;
+  }
+}
+</style>

+ 27 - 2
src/framework/layout/PageHeader.vue

@@ -27,6 +27,9 @@
                 </el-dropdown-menu>
             </el-dropdown>
             <ul class="header-nav">
+                <li class="header-nav-Splitscreen">
+                    <a href="/splitScreen" target="_blank"><i class="el-icon-s-platform"></i></a>
+                </li>
                 <li class="header-nav-notification">
                     <message-sever></message-sever>
                 </li>
@@ -38,6 +41,7 @@
 import frameworkApi from '@/api/framework'
 import { mapGetters, mapMutations } from 'vuex'
 import MessageSever from '../components/messagesever/index'
+import lStorage from '@/utils/localStorage'
 export default {
     name: 'PageHeader',
     props: [],
@@ -72,7 +76,7 @@ export default {
         }
     },
     created() {
-        let cacheInfo = JSON.parse(localStorage.getItem('_sagacloud_admin_store_cacheInfo'))?JSON.parse(localStorage.getItem('_sagacloud_admin_store_cacheInfo')):{}
+        let cacheInfo = lStorage.get('cacheInfo')?lStorage.get('cacheInfo'):{}
         if(cacheInfo[this.userInfo.userName] && 
             cacheInfo[this.userInfo.userName].projectId && 
             this.projects.some((item) => {return item.id == cacheInfo[this.userInfo.userName].projectId})
@@ -87,4 +91,25 @@ export default {
         MessageSever
     }
 }
-</script>
+</script>
+<style lang="scss" scoped>
+.header-nav-Splitscreen>a{
+    display: flex;
+    width: 100%;
+    height: 100%;
+    position: relative;
+    padding: 16px 10px 10px;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    color: #79869a;
+    font-size: 24px;
+    text-decoration: none;
+    cursor: pointer;
+    i{transition:all 0ms ease 0ms}
+}
+.header-nav-Splitscreen>a:hover{
+    text-decoration: none;
+    color: #d3d8e2;
+    background-color: #3f4f62;
+}
+</style>

+ 5 - 3
src/framework/layout/layout-store.js

@@ -1,5 +1,6 @@
 import frameworkApi from '@/api/framework'
 import storage from '@/framework/utils/storage'
+import lStorage from '@/utils/localStorage'
 import axios from 'axios'
 import authutils from '../../utils/authutils'
 
@@ -61,17 +62,18 @@ export default {
         setSidebarSelected: (state, val) => {
             state.sidebarSelected = val
             storage.set(KEY_MENU_SELECTED, val)
+            lStorage.set('screen_data', { path: val, data: {} })
         },
         setprojectId: (state, val) => {
-            let cacheInfo = JSON.parse(localStorage.getItem('_sagacloud_admin_store_cacheInfo')) ? JSON.parse(localStorage.getItem('_sagacloud_admin_store_cacheInfo')) : {}
+            let cacheInfo = lStorage.get('cacheInfo') ? lStorage.get('cacheInfo') : {}
             state.projectId = val
             localStorage.setItem('projectId', val)
             if (cacheInfo[state.userInfo.userName]) {
                 cacheInfo[state.userInfo.userName].projectId = val
-                localStorage.setItem('_sagacloud_admin_store_cacheInfo', JSON.stringify(cacheInfo))
+                lStorage.set('cacheInfo', cacheInfo)
             } else {
                 cacheInfo[state.userInfo.userName] = { projectId: val }
-                localStorage.setItem('_sagacloud_admin_store_cacheInfo', JSON.stringify(cacheInfo))
+                lStorage.set('cacheInfo', cacheInfo)
             }
             storage.set(KEY_PROJECT_SELECTED, val)
             state.projects.map((item) => {

+ 20 - 6
src/router/system.js

@@ -77,6 +77,11 @@ import overView from '@/views/relation/overview'
 /**  厂家库 */
 import supplier from '@/views/manufactor/supplier'
 
+/**  辅助屏 */
+import splitScreen from '@/views/screen/splitScreen'
+import spaceLedger from '@/views/screen/splitScreen/spaceledger'
+import integrateResults from '@/views/screen/splitScreen/integrateresults'
+
 /**  业务空间数据导入工具 */
 import dataUtil from '@/views/business_space/dataUtil'
 
@@ -84,21 +89,30 @@ import dataUtil from '@/views/business_space/dataUtil'
 const OwnerManage = () =>
     import ('@/views/market/owner/manage')
 
-export default [
-    { 
-        path: '/', 
-        name: '', 
-        component: LayoutMain, 
+export default [{
+        path: '/',
+        name: '',
+        component: LayoutMain,
         children: [
             { path: '', name: 'blank', component: Dasboard },
             { path: 'allDetails', name: "allDetails", component: MsgAllDetails, meta: { keepAlive: false, breadcrumbs: [{ label: '消息中心' }] } }
-        ] 
+        ]
     },
     //{ path: '/login', name: 'Login', component: Login },
     { path: '/auth', name: 'auth', component: auth },
     { path: '/noUser', name: 'noUser', component: noUser },
     // 业务空间数据导入工具
     { path: '/dataUtil', name: 'dataUtil', component: LayoutMain, children: [{ path: 'index', component: dataUtil }] },
+    // 辅助屏
+    {
+        path: '/splitScreen',
+        name: 'splitScreen',
+        component: splitScreen,
+        children: [
+            { path: 'spaceledger', name: 'spaceLedger', component: spaceLedger },
+            { path: 'integrateresults', name: 'integrateResults', component: integrateResults }
+        ]
+    },
     // 平台管理
     {
         path: '/platform',

+ 33 - 0
src/utils/localStorage.js

@@ -0,0 +1,33 @@
+const PREFIX = '_sagacloud_admin_store_'
+const loaclStorage = window.localStorage
+
+export default {
+    set(key, value, fn) {
+        let _value = null
+        try {
+            _value = JSON.stringify(value)
+        } catch (e) {
+            _value = value
+        }
+        loaclStorage.setItem(PREFIX + key, _value)
+        fn && fn()
+    },
+    get(key, fn) {
+        if (!key) {
+            return null
+        }
+        if (typeof key === 'object') {
+            throw new Error('key不能是一个对象。')
+        }
+        var _value = loaclStorage.getItem(PREFIX + key)
+        if (_value !== null) {
+            try {
+                return JSON.parse(_value)
+            } catch (e) {}
+        }
+        return _value
+    },
+    remove(key) {
+        loaclStorage.removeItem(PREFIX + key)
+    }
+}

+ 106 - 0
src/views/screen/splitscreen/index.vue

@@ -0,0 +1,106 @@
+<!--
+ * @Author: zhangyu
+ * @Date: 2019-11-05 15:36:21
+ * @Info: 
+ * @LastEditTime: 2019-11-14 15:46:27
+ -->
+<template>
+  <div id="screenBox">
+    <div class="mian-icon" v-show="$route.name == 'splitScreen'">
+      <div class="main-content">
+        <img src="@/assets/image/uncultivated.svg">
+        <h2>功能设计中。。。</h2>
+      </div>
+    </div>
+    <router-view v-show="$route.name != 'splitScreen'" class="screen-router"></router-view>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import lStorage from '@/utils/localStorage'
+
+export default {
+  data() {
+    return {
+      
+    }
+  },
+  created() {
+    lStorage.set('screen_data', {})
+  },
+  mounted() {
+    window.addEventListener("storage", event =>{
+      if(event.key == '_sagacloud_admin_store_screen_data'){
+        let data
+        try {
+          data = JSON.parse(event.newValue)
+        } catch (error) {
+          data = event.newValue
+        }
+        this.handleChangeRouter(data)
+      }
+    });
+  },
+  destroyed() {
+    window.removeEventListener("storage", event => {})
+    lStorage.remove('screen_data')
+  },
+  computed: {
+    ...mapGetters('layout', ['userInfo', 'projectId', 'projects', 'userId'])
+  },
+  methods:{
+    handleChangeRouter(data) {
+      console.log(data)
+      if(data.path && data.path == '/ledger/spacelist'){//业务空间台账
+        this.$router.push({
+          path:'/splitScreen/spaceledger',
+          query: data.data
+        })
+      } else if (data.path && data.path == '/point/report') {//系统集成成果管理
+        this.$router.push({
+          path:'/splitScreen/integrateresults',
+          query: data.data
+        })
+      } else {
+        this.$router.push({
+          path:'/splitScreen'
+        })
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+#screenBox{
+  width: 100%;
+  height: 100%;
+  .mian-icon{
+    width: 100%;
+    height: 100%;
+    text-align: center;
+    position: relative;
+    .main-content{
+      position: absolute;
+      top: 25%;
+      left: 50%;
+      transform: translate(-50%, 0);
+      h2{
+        text-align: center;
+        margin-top: 30px;
+      }
+    }
+  }
+  .screen-router{
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+    padding: 10px;
+    width: 100%;
+    height: 100%;
+    box-sizing: border-box;
+    overflow: hidden;
+  }
+}
+</style>

+ 106 - 0
src/views/screen/splitscreen/integrateresults/index.vue

@@ -0,0 +1,106 @@
+<!--
+ * @Author: zhangyu
+ * @Date: 2019-11-13 17:00:59
+ * @Info: 系统集成成果辅助屏
+ * @LastEditTime: 2019-11-15 11:10:58
+ -->
+<template>
+  <div>
+    <div class='page-bar'>
+      <el-breadcrumb separator='/'>
+      <el-breadcrumb-item>系统集成</el-breadcrumb-item>
+      <el-breadcrumb-item>系统集成成果管理</el-breadcrumb-item>                       
+      </el-breadcrumb>
+    </div>
+    <div class="page-content">
+      <div class="content-left">
+        <div class="data-box">
+          <realtime-data :queryParams="queryParams"></realtime-data>
+        </div>
+        <div class="buildFloor-box">
+          <buildfloor-list :queryParams="queryParams"></buildfloor-list>
+        </div>
+      </div>
+      <div class="content-right"></div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import realtimeData from '@/components/screen/integrateresults/realtimeData'
+import buildfloorList from '@/components/screen/integrateresults/buildfloorList'
+
+export default {
+  components: {
+    realtimeData,
+    buildfloorList
+  },
+  computed: {
+    ...mapGetters('layout', ['userInfo', 'projectId', 'projects', 'userId'])
+  },
+  created() {
+    
+  },
+  mounted() {
+
+  },
+  data() {
+    return {
+      queryParams: this.$route.query
+    }
+  },
+  methods:{
+    
+  },
+  watch: {
+    $route(to,from){
+      this.queryParams = this.$route.query
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+$borderColor: rgba(201, 201, 201, 1);
+.page-bar{
+  flex-grow: 0;
+  flex-shrink: 0;
+  height: 24px;
+  padding: 0 10px;
+  margin-bottom: 10px;
+  border-bottom: 1px solid $borderColor;
+  /deep/ .el-breadcrumb {
+    font-size: 14px;
+  }
+}
+.page-content{
+  display: flex;
+  flex-grow: 1;
+  flex-shrink: 1;
+  flex-direction: row;
+  justify-content: flex-start;
+  overflow-y: auto;
+  .content-left{
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+    width: 260px;
+    margin-right: 15px;
+    .data-box{
+      height: 140px;
+      margin-bottom: 15px;
+    }
+    .buildFloor-box{
+      flex-grow: 1;
+      flex-shrink: 1;
+      border: 1px solid $borderColor;
+    }
+  }
+  .content-right{
+    flex-grow: 1;
+    flex-shrink: 1;
+    border: 1px solid $borderColor;
+  }
+}
+</style>

+ 144 - 0
src/views/screen/splitscreen/spaceledger/index.vue

@@ -0,0 +1,144 @@
+
+<template>
+  <div class="box">
+    <el-container>
+      <el-header>
+        <div class="boxName">
+          第二屏详情
+        </div>
+        <div class="spaceName">
+          空间名称:{{spaceDetails.RoomLocalName}}
+        </div>
+      </el-header>
+      <el-container>
+        <el-aside width="500px">
+          Aside
+        </el-aside>
+        <el-main>
+          <el-tabs v-model="activeTab" type='card'>
+            <template v-for="(item,index) in tabsList">
+              <el-tab-pane :name="item.Code" :key="index" :label="item.Name">
+                <!-- 静态数据 -->
+                <div v-if="activeTab === 'staticData'" style="width:100%">
+                  <iframe height="100%" width="100%" :src="iframeSrc"></iframe>
+                </div>
+                <!-- 动态数据 -->
+                <div v-if="activeTab === 'dynamicData'" style="width:100%">
+                  <iframe height="100%" width="100%" :src="iframeSrc"></iframe>
+                </div>
+                <!-- 对象关系 -->
+                <div v-if="activeTab === 'objectRelationship'" style="width:100%">
+                  <iframe height="100%" width="100%" :src="iframeSrc"></iframe>
+                  <iframe height="100%" width="100%" :src="iframeSrc"></iframe>
+                  <iframe height="100%" width="100%" :src="iframeSrc"></iframe>
+                </div>
+              </el-tab-pane>
+            </template>
+          </el-tabs>
+        </el-main>
+      </el-container>
+    </el-container>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import { queryZone } from '@/api/scan/request'
+
+export default {
+  data() {
+    return {
+      tabsList: [
+        { Code: 'staticData', Name: '静态数据' },
+        { Code: 'dynamicData', Name: '动态数据' },
+        { Code: 'objectRelationship', Name: '对象关系' }
+      ],
+      activeTab: 'staticData',
+      spaceDetails: {},
+      iframeSrc: '',
+      projectId: ''
+    }
+  },
+  created() {
+    if (this.$route.query.RoomID && this.$route.query.zone) {
+      this.getData();
+    }
+    this.setFrame();
+  },
+  updated() { },
+  mounted() { },
+  computed: {
+    ...mapGetters('layout', ['userInfo', 'projects', 'userId', 'secret'])
+  },
+  methods: {
+    getData() {
+      // 获取空间本地名称
+      let params = {
+        data: {
+          Filters: `RoomID="${this.$route.query.RoomID}"`
+        },
+        zone: this.$route.query.zone
+      }
+      queryZone(params, res => {
+        this.spaceDetails = res.Content[0];
+      })
+    },
+    // 设置静态数据tab的iframe
+    setFrame() {
+      this.projectId = localStorage.getItem('projectId');
+      this.iframeSrc = `${process.env.BASE_URL}:8889/#/details?perjectId=${this.projectId}&secret=${this.secret}&FmId=${this.$route.query.RoomID}&type=0&code=${this.$route.query.zone}`
+    },
+  },
+  watch: {
+    $route(to, from) {
+      // 监听路由变化就重新获取空间名称
+      this.getData();
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+#screenBox .screen-router[data-v-6c06ede0] {
+  padding: 0;
+}
+.el-header {
+  padding: 0;
+  height: 80px !important;
+  .boxName {
+    color: #fff;
+    font-size: 16px;
+    line-height: 50px;
+    height: 50px !important;
+    padding: 0 20px;
+    background-color: #3f4f62;
+  }
+  .spaceName {
+    font-size: 14px;
+    line-height: 30px;
+    padding: 0 20px;
+    border-bottom: 1px solid black;
+    box-sizing: border-box;
+  }
+}
+.el-aside {
+  // background-color: #d3dce6;
+  color: #333;
+  text-align: center;
+  line-height: 200px;
+}
+.el-main {
+  // background-color: #e9eef3;
+  color: #333;
+  text-align: center;
+}
+.el-tabs__content {
+  height: 750px;
+}
+#pane-staticData {
+  height: 750px;
+  div {
+    height: 100%;
+  }
+}
+</style>