背景色

Signed-off-by: xiexingan <748626312@qq.com>

src/assets/style/public.scss

@@ -129,6 +129,9 @@ $el-bg-color-4: #F2F6FC;
 
 
 }
+
+
+// ~~~
 .margin-lr-20 {
   margin: 0 20px;
 }
@@ -145,4 +148,46 @@ $el-bg-color-4: #F2F6FC;
 .color-green {
   color: #4ECB74;
 
-}
\ No newline at end of file
+}
+// 首页菜单选中
+.theme-d2 .d2-theme-container .d2-theme-container-aside .d2-layout-header-aside-menu-side>.el-menu> .el-menu-item:first-child{
+  background: transparent ;
+  }
+
+
+
+
+.en-tabs {
+  .el-tabs__header {
+    margin: 0;
+  }
+  .el-tabs__active-bar{
+    bottom:-1px ;
+  }
+  .el-tabs__nav-wrap::after {
+    height: 0;
+  }
+  .el-tabs__nav-wrap {
+    background: #f2f4f5;
+
+    .el-tabs__nav {
+      border-bottom: 1px solid #e5e9ec;
+    }
+  }
+  .el-tabs__header {
+    border: 1px solid #e5e9ec;
+  }
+  .el-tabs__item:nth-child(2) {
+    padding: 0 30px !important;
+  }
+
+  .el-tabs__item:last-child {
+    padding: 0 30px !important;
+  }
+  .el-tabs__item.is-active {
+    background: #fff;
+  }
+}
+
+
+

src/assets/style/theme/d2/setting.scss

@@ -50,16 +50,19 @@ $theme-header-item-background-color-active: transparent;
 
 // 侧边栏上的文字颜色
 $theme-aside-item-color: $color-text-normal;
-$theme-aside-item-background-color: transparent;
+// $theme-aside-item-background-color: transparent;
+$theme-aside-item-background-color: #F2FAFF;
 // 侧边栏上的项目在 hover 时
-$theme-aside-item-color-hover: #2f74ff;
-$theme-aside-item-background-color-hover: rgba(#FFF, .5);
+$theme-aside-item-color-hover: rgba(#fff,1);
+$theme-aside-item-background-color-hover: rgba(#21ACFC, .9);
 // 侧边栏上的项目在 focus 时
-$theme-aside-item-color-focus: #2f74ff;
+$theme-aside-item-color-focus: #21ACFC;
 $theme-aside-item-background-color-focus: rgba(#FFF, .5);
 // 侧边栏上的项目在 active 时
-$theme-aside-item-color-active: #2f74ff;
-$theme-aside-item-background-color-active: rgba(#FFF, .5);
+$theme-aside-item-color-active: #fff;
+// $theme-aside-item-background-color-active: rgba(#FFF, .5);
+$theme-aside-item-background-color-active: #21ACFC; 
+
 
 // 侧边栏菜单为空的时候显示的元素
 $theme-aside-menu-empty-icon-color: $color-text-normal;

src/assets/style/theme/theme-base.scss

@@ -93,7 +93,7 @@
           bottom: 0px;
           left: 0px;
           right: 0px;
-          background: #E6EAEE;
+          // background: #E6EAEE;
           overflow: auto;
 
         }

src/assets/style/theme/theme.scss

@@ -206,7 +206,7 @@
           }
           &:hover {
             color: $theme-aside-item-color-hover;
-            background: $theme-aside-item-background-color-hover;
+            background: $theme-aside-item-background-color-hover !important;
             i {
               color: $theme-aside-item-color-hover;
             }
@@ -220,7 +220,7 @@
           }
           &.is-active {
             color: $theme-aside-item-color-active;
-            background: $theme-aside-item-background-color-active;
+            background: $theme-aside-item-background-color-active !important;
             i {
               color: $theme-aside-item-color-active;
             }
@@ -230,7 +230,7 @@
       .el-submenu {
         .el-submenu__title {
           color: $theme-aside-item-color;
-          background: $theme-aside-item-background-color;
+          background:$theme-aside-item-color-active;
           i {
             color: $theme-aside-item-color;
           }

src/layout/header-aside/components/header-user/index.vue

 <template>
-  <div >
-   <div title="修改密码" class="msg-img user-warp" @click="editPasword" style="display:flex;">
-    <div class="user-info">
-      <span class="item" style='margin-top:2px;'>{{info.userName}}</span>
-      <span class="item">{{info.name}}</span>
-    </div>
+  <div>
+    <div title="修改密码" class="msg-img user-warp" @click="editPasword" style="display:flex;">
+      <img src="../../imgs/user.png" alt="">
+      <div class="user-info">
+        <span class="item" style='margin-top:2px;'>{{info.userName}}</span>
+        <span class="item">{{info.name}}</span>
+      </div>
 
-     <img src="../../imgs/user.png" alt="">
-   </div>
+    </div>
     <!-- <span class="btn-text">你好， {{info.name}}</span>
     <el-dropdown-menu slot="dropdown">
       <el-dropdown-item @click.native="editPasword">
@@ -19,27 +19,25 @@
         注销
       </el-dropdown-item>
     </el-dropdown-menu> -->
-    <el-dialog title="修改密码"
-               :visible.sync="editPaswDialog" @close="closeEditPasw"
-               width="50%">
+    <el-dialog title="修改密码" :visible.sync="editPaswDialog" @close="closeEditPasw" width="50%">
       <div slot='title' class="title-bold">
         <span>修改密码</span>
       </div>
-       <el-form :model="editPasForm" :rules="fromrule" ref="editPasRef">
-            <el-form-item label="用户名" :label-width="formLabelWidth">
-                <el-input v-model="editPasForm.username" disabled></el-input>
-            </el-form-item>
-            <el-form-item label="原密码" prop="oldpsw" :label-width="formLabelWidth" >
-                <el-input v-model="editPasForm.oldpsw" autocomplete="off" type='password' placeholder='请输入原密码' @input='e => editPasForm.oldpsw = inputMe(e)'></el-input>
-            </el-form-item>
-            <el-form-item label="新密码" prop="newpas" :label-width="formLabelWidth" >
-                <el-input v-model="editPasForm.newpas" autocomplete="off" type='password' placeholder='请输入新密码' @input='e => editPasForm.newpas = inputMe(e)'></el-input>
-            </el-form-item>
-            <el-form-item label="密码确认" prop="pwd" :label-width="formLabelWidth" >
-                <el-input v-model="editPasForm.pwd" autocomplete="off" type='password' placeholder='请再次输入新密码' @input='e => editPasForm.pwd = inputMe(e)'></el-input>
-            </el-form-item>
-        </el-form>
-      <div slot="footer"   align='center'>
+      <el-form :model="editPasForm" :rules="fromrule" ref="editPasRef">
+        <el-form-item label="用户名" :label-width="formLabelWidth">
+          <el-input v-model="editPasForm.username" disabled></el-input>
+        </el-form-item>
+        <el-form-item label="原密码" prop="oldpsw" :label-width="formLabelWidth">
+          <el-input v-model="editPasForm.oldpsw" autocomplete="off" type='password' placeholder='请输入原密码' @input='e => editPasForm.oldpsw = inputMe(e)'></el-input>
+        </el-form-item>
+        <el-form-item label="新密码" prop="newpas" :label-width="formLabelWidth">
+          <el-input v-model="editPasForm.newpas" autocomplete="off" type='password' placeholder='请输入新密码' @input='e => editPasForm.newpas = inputMe(e)'></el-input>
+        </el-form-item>
+        <el-form-item label="密码确认" prop="pwd" :label-width="formLabelWidth">
+          <el-input v-model="editPasForm.pwd" autocomplete="off" type='password' placeholder='请再次输入新密码' @input='e => editPasForm.pwd = inputMe(e)'></el-input>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" align='center'>
         <el-button type="primary" @click="cancel" size="medium">取 消</el-button>
         <el-button type="primary" @click="saveEditPas" size="medium">确 定</el-button>
       </div>
@@ -78,12 +76,15 @@ export default {
       },
       fromrule: {
         newpas: [
-            { validator: validatePassword, trigger: 'blur' },
-            { min: 1, max: 30, message: '长度在 1 到 50 个字符', trigger: 'blur' }
+          { validator: validatePassword, trigger: 'blur' },
+          {
+            min: 1,
+            max: 30,
+            message: '长度在 1 到 50 个字符',
+            trigger: 'blur'
+          }
         ],
-        pwd: [
-            { validator: validateComfirmPassword, trigger: 'blur' }
-        ]
+        pwd: [{ validator: validateComfirmPassword, trigger: 'blur' }]
       }
     }
   },
@@ -91,18 +92,14 @@ export default {
     this.editPasForm.username = this.info.name
   },
   computed: {
-    ...mapState('d2admin/user', [
-      'info'
-    ])
+    ...mapState('d2admin/user', ['info'])
   },
   methods: {
-    ...mapActions('d2admin/account', [
-      'logout'
-    ]),
+    ...mapActions('d2admin/account', ['logout']),
     /**
      * @description 登出
      */
-    logOff () {
+    logOff() {
       this.logout({
         vm: this,
         confirm: true
@@ -118,7 +115,7 @@ export default {
       })
     },
     saveEditPas() {
-      this.$refs.editPasRef.validate(valid => {
+      this.$refs.editPasRef.validate((valid) => {
         if (valid) {
           this.$http({
             url: this.$http.adornUrl('/sys/user/password'),
@@ -146,7 +143,7 @@ export default {
       })
     },
     closeEditPasw() {
-       this.editPaswDialog = false
+      this.editPaswDialog = false
     },
     cancel() {
       this.$confirm('确认取消?', '修改密码', {
@@ -155,7 +152,7 @@ export default {
         type: 'warning'
       })
         .then(() => {
-           this.editPaswDialog = false
+          this.editPaswDialog = false
         })
         .catch(() => {
           this.$message({
@@ -168,29 +165,31 @@ export default {
 }
 </script>
 <style lang="scss" scoped>
-.user-warp{
-
-  .user-info{
-    width: 84px;
+.user-warp {
+  .user-info {
+    width: 93px;
     height: 36px;
-    background: url(../../imgs/subwayBg.png);
-    background-size: 100% 100%;
-    text-align:center;
+    border: 1px solid;
+    border-color: #a0a8b4 #a0a8b4 #a0a8b4 transparent;
+    border-top-right-radius: 5px;
+    border-bottom-right-radius: 5px;
+    transform: translateX(-19px);
+    text-align: center;
+    text-indent: 10px;
     opacity: 0;
     float: right;
     z-index: -3;
     margin-right:-84px;
-    transition:all .3s ease;
-    -webkit-transition: all .3s ease;
-    .item{
+    transition: all 0.3s ease;
+    -webkit-transition: all 0.3s ease;
+    .item {
       display: block;
-      padding-right:10px;
       font-size: 12px;
       font-family: Microsoft YaHei;
       font-weight: 400;
       color: rgba(255, 255, 255, 0.75);
     }
-}
+  }
 }
 .user-warp:hover .user-info{
     opacity: 1;
@@ -198,5 +197,4 @@ export default {
     z-index: 1;
 
 }
-
 </style>

src/pages/analysis/energy/page.vue

@@ -2,27 +2,53 @@
   <div class="energy-page">
     <cardList cardListTitle="能耗数据分析">
         <div slot="right" >
-             <span
+             <!-- <span
           :class="activeIndex === index ? 'active-hight-linght' : ''"
           class="date-text"
           @click="activehandle(item, index)"
           v-for="(item, index) in dateList"
           :key="item.value"
           >{{ item.label }}</span
-        >
-        <el-date-picker
+        > -->
+        <!-- <el-date-picker
+        size="mini"
+          type="daterange"
+          range-separator="～"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+        > -->
+        <!-- </el-date-picker> -->
+        <!-- <i style=" padding-left:20px;padding-right: 20px;color:#21acfc" class="el-icon-s-unfold"></i> -->
+        <!-- <i class="el-icon-printer" style="color:#21acfc"></i> -->
+        <el-button size="mini" type="primary" @click="toPowerPage">图形/列表</el-button>
+        </div>
+      <div slot="content" >
+        <div >
+            <!-- <enTabs :tabList="energyTabList"></enTabs> -->
+             <el-tabs class="en-tabs" v-model="activetap" >
+               <el-row style="padding-top:15px">
+                 <el-col :span="10">
+                   <span>时间范围：</span>
+                     <el-date-picker
+           size="mini"
           type="daterange"
           range-separator="～"
           start-placeholder="开始日期"
           end-placeholder="结束日期"
         >
         </el-date-picker>
-        <i style=" padding-left:20px;padding-right: 20px;color:#21acfc" class="el-icon-s-unfold"></i>
-        <i class="el-icon-printer" style="color:#21acfc"></i>
-        </div>
-      <div slot="content" style="padding: 24px 28px 20px 23px">
-        <div style="margin-bottom: 20px">
-            <enTabs :tabList="energyTabList"></enTabs>
+                 </el-col>
+                <el-col :span="4">
+                  <el-button type="primary" size="mini" icon="el-icon-search">查询</el-button>
+                </el-col>
+               </el-row>
+            <el-tab-pane
+              :label="item.label"
+              :name="item.value"
+              v-for="(item, index) in energyTabList"
+              :key="index"
+            ></el-tab-pane>
+          </el-tabs>
         </div>
         <el-row>
             <el-col :span="24">
@@ -35,21 +61,22 @@
 </template>
 
 <script>
-import cardList from "../../home/compontents/cardList";
-import enTabs from '../../eq/hall/components/enTabs'
+import cardList from "../../components/cardList";
+import enTabs from "../../components/enTabs";
 // import enTable from '../../eq/hall/components/enTable'
-import energyChart from '../../home/compontents/energyTotalCharts'
+import energyChart from "../../components/energyTotalCharts";
 export default {
   name: "energypage",
   components: {
     cardList,
     enTabs,
-    energyChart
+    energyChart,
   },
   data() {
     return {
-        activeIndex: 1,
-         dateList: [
+      activeIndex: 1,
+      activetap: "01",
+      dateList: [
         // {
         //   value: "01",
         //   label: "时段",
@@ -71,8 +98,8 @@ export default {
           label: "全年",
         },
       ],
-      energyTabList:[
-           {
+      energyTabList: [
+        {
           value: "01",
           label: "全部",
         },
@@ -88,33 +115,37 @@ export default {
           value: "04",
           label: " 多联新风",
         },
-      ]
+      ],
     };
   },
-   methods: {
+  methods: {
     activehandle(item, index) {
       this.activeIndex = index;
     },
+    toPowerPage(){
+      this.$router.push({
+       path:'/kb/power'
+     })
+    },
   },
 };
 </script>
 
 <style lang="scss">
-  .energy-page{
-     padding:10px 10px 40px 10px;
-      .el-input__inner {
-    // height: 30px;
+.energy-page {
+  height: 100%;
+  padding: 0px 0px 40px 0px;
+
+  .date-text {
+    padding-right: 20px;
+    font-size: 14px;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    color: #1d1d1d;
+    cursor: pointer;
   }
-       .date-text {
-      padding-right: 20px;
-      font-size: 14px;
-      font-family: Microsoft YaHei;
-      font-weight: 400;
-      color: #1d1d1d;
-      cursor: pointer;
-    }
-    .active-hight-linght {
-      color: #21acfc;
-    }
+  .active-hight-linght {
+    color: #21acfc;
   }
+}
 </style>

src/pages/analysis/fault/index.vue

 <template lang='pug'>
-card-warp(title="故障报警分析")
-    div(slot="right")
-        span 时间范围：
-        el-date-picker.margin-lr-20(
-            size='mini'
-            v-model="dateValue",
-            type="daterange",
-            align="right",
-            unlink-panels,
-            range-separator="至",
-            start-placeholder="开始日期",
-            end-placeholder="结束日期",
-            :picker-options="pickerOptions"
-        )
-        el-button(size='mini' type='primary') 查询
+card-warp(title="故障报警分析"  height='45px' showBackground)
     div(slot="content")
+        el-form(:inline='true' size="mini" )
+            el-form-item(label='时间范围：')
+                el-date-picker(
+                    size='mini'
+                    v-model="dateValue",
+                    type="daterange",
+                    align="right",
+                    unlink-panels,
+                    range-separator="至",
+                    start-placeholder="开始日期",
+                    end-placeholder="结束日期",
+                    :picker-options="pickerOptions"
+                )
+            el-button(size='mini' type='primary') 查询
         .echartsWarp(width="100%", flex)
             //- div
             //-     .title 设备故障统计
@@ -98,7 +98,7 @@ export default {
     display: flex;
     justify-content: space-between;
     flex-wrap: wrap;
-    height: calc(100vh - 260px);
+    height: calc(100vh - 280px);
     > div {
         width: 47%;
         // height: calc(90% / 2);

src/pages/analysis/indoor/index.vue

 <template lang="pug">
-card-warp(title="室内气象分析" height='45px' )
+card-warp(title="室内气象分析" height='45px' showBackground)
     div(slot="right")
         //- span 时间范围：
         //- el-date-picker.margin-lr-20(

src/pages/analysis/outdoor/index.vue

 <template lang="pug">
-card-warp(title="室外气象分析" height='45px' )
+card-warp(title="室外气象分析" height='45px' showBackground)
     div(slot="right")
-        router-link.margin-lr-20(:to="{name:'kb-indoor'}")
-             el-button(size='mini' type='primary') 图形 / 列表
+        //- router-link.margin-lr-20(:to="{name:'kb-indoor'}")
+        //-      el-button(size='mini' type='primary') 图形 / 列表
     div(slot="content", style="height: 90%")
         el-tabs.myTabs(v-model="activeName", @tab-click="tabClick")
             el-tab-pane(label="候车室区域", name="1")

src/pages/home/compontents/cardList.vue → src/pages/components/cardList.vue

@@ -6,8 +6,10 @@
         <slot name="right" />
       </div>
     </div>
-
+   <div class="card-list-content">
     <slot name="content" />
+   </div>
+   
   </div>
 </template>
 
@@ -30,6 +32,7 @@ export default {
   width: 100%;
   height: 100%;
   background: #fff;
+    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
   &-line {
     display: flex;
     justify-content: space-between;
@@ -60,5 +63,9 @@ export default {
   //      height: 16px;
   //      background: #1890ff;
   //  }
+  .card-list-content{
+    padding:20px;
+    height: calc( 155 - 40px );
+  }
 }
 </style>

src/pages/eq/hall/components/enTable.vue → src/pages/components/enTable.vue

@@ -26,13 +26,14 @@
 
         </el-table-column>
       </template>
-      <el-table-column align="center" label="操作" width="100" v-if="isShowOp">
-        <template slot-scope="scope">
-          <el-button type="text" size="small">编辑</el-button>
+      <el-table-column align="center" label="操作" width="150" >
+        <template slot-scope="scope" >
+            <slot name='operation' :scope='scope'></slot>
         </template>
       </el-table-column>
     </el-table>
     <div
+     v-if="isShowPage"
       style="
         display: flex;
         justify-content: flex-end;
@@ -40,10 +41,11 @@
         line-height: 3;
       "
     >
-      <div style=" ;" class="record-color marg_r_18">共34860条记录</div>
+      <div  class="record-color marg_r_18">共34860条记录</div>
       <div class="record-color marg_r_8">共20页</div>
       <div class="record-color">每页显示</div>
-      <el-pagination layout="sizes, prev, pager, next" background :total="1000">
+      <!-- background -->
+      <el-pagination layout="sizes, prev, pager, next"  :total="1000">
       </el-pagination>
     </div>
   </div>
@@ -52,10 +54,35 @@
 <script >
 export default {
   name: "enTable",
-  props: ["tableData", "tableColums",'isShowOp'],
+  props: {
+    // ["", "tableColums",'isShowOp'.toString
+    tableData:{
+      type:Array,
+    },
+    tableColums:{
+      type:Array,
+    },
+    isShowOp:{
+      type:Boolean,
+      defaul:false,
+    },
+    isShowPage:{
+     
+      defaul:true,
+    },
+    isEdit:{
+       defaul:true,
+    }
+
+  },
   data() {
     return {};
   },
+  methods:{
+    handleClick(){
+      this.$emit('handleBtnClick')
+    }
+  }
 };
 </script>
 <style  lang="scss">
@@ -72,5 +99,9 @@ export default {
   .el-pagination.is-background .btn-next, .el-pagination.is-background .btn-prev, .el-pagination.is-background .el-pager li{
     margin: 0 !important;
   }
+ /deep/.el-pagination.is-background .el-pager li:not(.disabled).active {
+  color: #32a5ea !important;
+  background-color: red !important;
+}
 }
 </style>

src/pages/eq/hall/components/enTabs.vue → src/pages/components/enTabs.vue

-<template>
+<template >
   <div class="en-tabs">
     <ul class="ul-wrap">
       <li
@@ -11,24 +11,35 @@
           {{ item.label }}
         </p>
       </li>
+
     </ul>
+
+  
+
+
+
+
+  
+
   </div>
 </template>
 
-<script lang="ts">
+<script >
+import { Tabs } from 'element-ui';
 export default {
   name: "elTabs",
-  props:['tabList'],
+  props: ["tabList"],
   data() {
     return {
-        isActiveIndex:0,
-      
+      isActiveIndex: 0,
+       activeName: 'second',
+     
     };
   },
-   methods: {
+  methods: {
     tabHandle(item, index) {
       this.isActiveIndex = index;
-      this.$emit('tabHandle')
+      // this.$emit("tabHandle");
     },
   },
 };
@@ -36,40 +47,37 @@ export default {
 
 
 <style scoped lang="scss">
-
-.en-tabs{
-
-    .show-bar-border {
-  border-bottom: 2px solid #0097ff;
-}
-
-.ul-wrap {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  display: flex;
-  color: #666;
-  background: rgba(229, 233, 236, 0.5);
-  border: 1px solid #e5e9ec;
-  font-size: 14px;
-  li {
-    position: relative;
-    padding: 0 71px;
-    cursor: pointer;
-    p {
-      margin: 0;
-      padding: 0;
-      padding-bottom: 14px;
-      padding-top: 15px;
-      box-sizing: border-box;
-    }
-  }
-  .isActive {
-    background: #fff;
-    color: #0097ff;
+.en-tabs {
+  .show-bar-border {
+    border-bottom: 2px solid #0097ff;
   }
-}
 
+  // .ul-wrap {
+  //   list-style: none;
+  //   margin: 0;
+  //   padding: 0;
+  //   display: flex;
+  //   color: #666;
+  //   background: rgba(229, 233, 236, 0.5);
+  //   border: 1px solid #e5e9ec;
+  //   font-size: 14px;
+  //   li {
+  //     position: relative;
+  //     padding: 0 71px;
+  //     cursor: pointer;
+  //     p {
+  //       margin: 0;
+  //       padding: 0;
+  //       padding-bottom: 14px;
+  //       padding-top: 15px;
+  //       box-sizing: border-box;
+  //     }
+  //   }
+  //   .isActive {
+  //     background: #fff;
+  //     color: #0097ff;
+  //   }
+  // }
 }
 
 

src/pages/home/compontents/myPies.vue → src/pages/components/myPies.vue

@@ -13,6 +13,7 @@ export default {
     };
   },
 
+
   mounted() {
     this.initPie();
   },

src/pages/eq/hall/components/hallModal.vue

+<template>
+  <el-dialog title="编辑" :visible.sync="hallModalVisible" :append-to-body="true">
+    <el-form >
+      <el-form-item label="设定频率：" :label-width="formLabelWidth">
+        <el-input size="mini" autocomplete="off"></el-input>
+      </el-form-item>
+      <el-form-item label="启动控制：" :label-width="formLabelWidth">
+             <el-switch ></el-switch>
+      </el-form-item>
+    </el-form>
+    <div slot="footer" >
+      <el-button @click="cancelhandle">取 消</el-button>
+      <el-button type="primary" @click="cancelhandle">确 定</el-button>
+    </div>
+  </el-dialog>
+  
+</template>
+<script lang="ts">
+export default {
+  name: "hallModal",
+  props: ["hallModalVisible"],
+  data() {
+    return {
+        formLabelWidth:'120px',
+    };
+  },
+  methods:{
+    cancelhandle(){
+        this.$emit('cancelhandle')
+    }
+  }
+};
+</script>

src/pages/eq/hall/page.vue

 <template>
   <div class="hall full-height">
     <cardList cardListTitle="候车大厅控制">
-      <div slot="content" style="padding: 24px 28px 20px 23px">
+      <div slot="content" >
         <div>
-          <el-row>
+        
             <el-form :inline="true" :model="formData" label-width="100">
-              <el-col :md="14" :lg="13">
+                <el-row>
+              <el-col :span="12">
                 <el-form-item label="定时功能启止时间：">
                   <el-date-picker
+                  size="mini"
                     style="width: 200px"
                     type="date"
                     placeholder=""
@@ -15,6 +17,7 @@
                   </el-date-picker>
                   <span style="padding: 0 10px">至</span>
                   <el-date-picker
+                    size="mini"
                     style="width: 200px"
                     type="date"
                     placeholder=""
@@ -22,14 +25,13 @@
                   </el-date-picker>
                 </el-form-item>
               </el-col>
-              <el-col :md="12" :lg="4">
+              <el-col :span="4">
                 <el-form-item label="定时设定按钮：">
                   <el-switch active-color="#0097FF" inactive-color="#ff4949">
                   </el-switch>
                 </el-form-item>
               </el-col>
-
-              <el-col :md="12" :lg="5">
+              <el-col :span="5">
                 <el-form-item label="温度设定：">
                   <el-input
                     style="width: 124px"
@@ -40,7 +42,10 @@
                   <!-- <el-button type="primary" >查询</el-button> -->
                 </el-form-item>
               </el-col>
-              <el-col :md="12" :lg="4">
+             
+               </el-row>
+               <el-row>
+                  <el-col :md="12" :lg="4">
                 <el-form-item label="节能模式：">
                   <el-switch
                     active-color="#13ce66"
@@ -51,41 +56,60 @@
 
               <el-col :md="12" :lg="10">
                 <el-form-item label="">
-                  <el-button type="" size="small">编辑</el-button>
-                  <el-button type="" size="small">自然通风</el-button>
-                  <el-button type="" size="small">机械通风</el-button>
-                  <el-button type="" size="small">供暖</el-button>
+                  <el-button type="primary" size="mini">编辑</el-button>
+                  <el-button type="primary" size="mini">自然通风</el-button>
+                  <el-button type="primary" size="mini">机械通风</el-button>
+                  <el-button type="primary" size="mini">供暖</el-button>
                 </el-form-item>
               </el-col>
+               </el-row>
             </el-form>
-          </el-row>
+         
         </div>
         <!-- tabs -->
         <div style="margin-bottom: 20px">
-           <en-tabs :tabList="tabList"></en-tabs>
+           <!-- <en-tabs :tabList="tabList"></en-tabs> -->
+            <div>
+          <el-tabs class="en-tabs" v-model="activeTab" >
+            <el-tab-pane
+              :label="item.label"
+              :name="item.value"
+              v-for="(item, index) in tabList"
+              :key="index"
+            ></el-tab-pane>
+          </el-tabs>
+        </div>
         </div>
         <!-- table  -->
-        <enTable :tableData="tableData" :tableColums="tableColums" isShowOp="true"></enTable>
+        <enTable v-on:handleBtnClick="handleBtnClick" :tableData="tableData" :tableColums="tableColums" :isShowOp="true" isShowPage="true">
+          <template v-slot:operation='scope'>
+           <el-button type="text" @click="hallModalVisible=true">编辑</el-button>
+         
+         </template>
+        </enTable>
       </div>
     </cardList>
+  <hall-modal v-on:cancelhandle="cancelhandle" :hallModalVisible="hallModalVisible"></hall-modal>
+    hallModalVisible
   </div>
 </template>
 <script>
-import cardList from "../../home/compontents/cardList";
-import enTable from "./components/enTable";
-import enTabs from './components/enTabs'
+import cardList from "../../components/cardList";
+import enTable from "../../components/enTable";
+import enTabs from '../../components/enTabs'
+import hallModal from './components/hallModal'
 const tableColums = [
   {
     align: "center",
     prop: "A",
     label: "设备名称",
-    width: 132,
+    width: 112,
   },
   {
     align: "center",
     prop: "B",
     label: "设备描述",
-    width: 112,
+    // width: 112,
   },
   {
     align: "center",
@@ -224,12 +248,13 @@ export default {
     cardList,
     enTable,
     enTabs,
+    hallModal,
   },
   data() {
     return {
       tableColums,
       tableData,
-     
+     activeTab:'01',
       formData: {},
       tabList: [
         {
@@ -249,21 +274,32 @@ export default {
           label: " 水泵",
         },
       ],
-      
+      hallModalVisible:false,
     };
   },
   methods: {
-   
+     cancelhandle(){
+        this.$nextTick(()=>{
+           this.hallModalVisible = false
+        })
+      
+     },
+     handleBtnClick(){
+       this.hallModalVisible = true
+     }
   },
 };
 </script>
 <style lang="scss" >
 .hall {
   height: 100%;
-   padding:10px 10px 40px 10px;
+   padding:0px 0 40px 0px;
   .el-input__inner {
     height: 30px;
   }
+  .el-form-item{
+    margin-bottom: 10px;
+  }
   .el-form-item__label {
     padding: 0;
   }

src/pages/eq/office/config.js

+ export const  tableColumsOne = [
+    {
+      align: "center",
+      prop: "A",
+      label: "设备名称",
+      width: 132,
+    },
+    {
+      align: "center",
+      prop: "B",
+      label: "设备位置",
+      // width: 112,
+    },
+    {
+      align: "center",
+      prop: "C",
+      label: "控制方式",
+      width: 132,
+    },
+    {
+      align: "center",
+      prop: "D",
+      label: "能耗统计",
+      width: 182,
+    },
+    
+    {
+      align: "center",
+      prop: "E",
+      label: "设备编号",
+      width: 132,
+    },
+  ];
+
+  export const tableDataOne = [
+    {
+      A: "多联空调A1",
+      B: "左侧办公房屋",
+      C: "开/关/设定温度",
+      D: "今日用电量/本月用电量",
+      E:'DLW-A1'
+    },
+    {
+      A: "多联空调A2",
+      B: "左侧办公房屋",
+      C: "开/关/设定温度",
+      D: "今日用电量/本月用电量",
+      E:'DLW-A1'
+    },
+    {
+      A: "多联空调A3",
+      B: "左侧办公房屋",
+      C: "开/关/设定温度",
+      D: "今日用电量/本月用电量",
+      E:'DLW-A1'
+    },
+    {
+      A: "多联空调A4",
+      B: "左侧办公房屋",
+      C: "开/关/设定温度",
+      D: "今日用电量/本月用电量",
+      E:'DLW-A1'
+    },
+    {
+      A: "多联空调A5",
+      B: "左侧办公房屋",
+      C: "开/关/设定温度",
+      D: "今日用电量/本月用电量",
+      E:'DLW-A1'
+    },
+    {
+      A: " 多联空调A4",
+      B: "左侧办公房屋",
+      C: "开/关/设定温度",
+      D: "今日用电量/本月用电量",
+      E:'DLW-A1'
+    },
+    {
+      A: " 多联空调A4",
+      B: "左侧办公房屋",
+      C: "开/关/设定温度",
+      D: "今日用电量/本月用电量",
+      E:'DLW-A1'
+    },
+    {
+      A: " 多联空调A4",
+      B: "右侧办公房屋",
+      C: "开/关/设定温度",
+      D: "今日用电量/本月用电量",
+      E:'DLW-A1'
+    },
+    {
+      A: " 多联空调A4",
+      B: "右侧办公房屋",
+      C: "开/关/设定温度",
+      D: "今日用电量/本月用电量",
+      E:'DLW-A1'
+    },
+    {
+      A: "多联空调A10",
+      B: "右侧办公房屋",
+      C: "开/关/设定温度",
+      D: "今日用电量/本月用电量",
+      E:'DLW-A1'
+    },
+    {
+      A: "多联空调A",
+      B: "左侧办公房屋",
+      C: "开/关/设定温度",
+      D: "今日用电量/本月用电量",
+      E:'DLW-A1'
+    },
+  ];
+
+  export const tableDataTwo = [
+    {
+      A: "多联新风",
+      B: "屋面",
+      C: "开/关/设定温度",
+      D: "今日用电量/本月用电量",
+      E:'DLX-1'
+    },
+    {
+      A: "多联新风",
+      B: "屋面",
+      C: "开/关/设定温度",
+      D: "今日用电量/本月用电量",
+      E:'DLX-1'
+    },
+    {
+      A: "多联新风",
+      B: "屋面",
+      C: "开/关/设定温度",
+      D: "今日用电量/本月用电量",
+      E:'DLX-1'
+    },
+    {
+      A: "多联新风",
+      B: "屋面",
+      C: "开/关/设定温度",
+      D: "今日用电量/本月用电量",
+      E:'DLX-1'
+    },
+    {
+      A: "多联新风",
+      B: "屋面",
+      C: "开/关/设定温度",
+      D: "今日用电量/本月用电量",
+      E:'DLX-1'
+    },
+    {
+      A: " 多联新风",
+      B: "屋面",
+      C: "开/关/设定温度",
+      D: "今日用电量/本月用电量",
+      E:'DLW-A1'
+    },
+    {
+      A: " 多联新风",
+      B: "屋面",
+      C: "开/关/设定温度",
+      D: "今日用电量/本月用电量",
+      E:'DLX-1'
+    },
+    {
+      A: " 多联新风",
+      B: "屋面",
+      C: "开/关/设定温度",
+      D: "今日用电量/本月用电量",
+      E:'DLX-1'
+    },
+    {
+      A: " 多联新风",
+      B: "屋面",
+      C: "开/关/设定温度",
+      D: "今日用电量/本月用电量",
+      E:'DLX-1'
+    },
+    {
+      A: "多联新风",
+      B: "屋面",
+      C: "开/关/设定温度",
+      D: "今日用电量/本月用电量",
+      E:'DLX-1'
+    },
+    {
+      A: "多联新风",
+      B: "屋面",
+      C: "开/关/设定温度",
+      D: "今日用电量/本月用电量",
+      E:'DLX-1'
+    },
+  ];
+
+ 
+  export const tableDataThree = [
+    {
+      A: "机房空调",
+      B: "通信机械室",
+      C: "显示状态",
+      D: "今日用电量/本月用电量",
+      E:'JK-1'
+    },
+    {
+      A: "机房空调",
+      B: "通信机械室",
+      C: "显示状态",
+      D: "今日用电量/本月用电量",
+      E:'JK-1'
+    },
+    {
+      A: "机房空调",
+      B: "通信机械室",
+      C: "显示状态",
+      D: "今日用电量/本月用电量",
+      E:'JK-1'
+    },
+    {
+      A: "机房空调",
+      B: "通信机械室",
+      C: "显示状态",
+      D: "今日用电量/本月用电量",
+      E:'JK-1'
+    },
+    {
+      A: "机房空调",
+      B: "通信机械室",
+      C: "显示状态",
+      D: "今日用电量/本月用电量",
+      E:'JK-1'
+    },
+    {
+      A: " 机房空调",
+      B: "通信机械室",
+      C: "显示状态",
+      D: "今日用电量/本月用电量",
+      E:'JK-1'
+    },
+    {
+      A: " 机房空调",
+      B: "通信机械室",
+      C: "显示状态",
+      D: "今日用电量/本月用电量",
+      E:'JK-1'
+    },
+    {
+      A: " 机房空调",
+      B: "通信机械室",
+      C: "显示状态",
+      D: "今日用电量/本月用电量",
+      E:'JK-1'
+    },
+    {
+      A: " 机房空调",
+      B: "右侧办公房屋",
+      C: "显示状态",
+      D: "今日用电量/本月用电量",
+      E:'JK-1'
+    },
+    {
+      A: "信息机房",
+      B: "右侧办公房屋",
+      C: "显示状态",
+      D: "今日用电量/本月用电量",
+      E:'JK-1'
+    },
+    {
+      A: "信息机房",
+      B: "左侧办公房屋",
+      C: "显示状态",
+      D: "今日用电量/本月用电量",
+      E:'JK-1'
+    },
+  ];
+  
+  export const tableDataFour = [
+    {
+      A: "排风机",
+      B: "售票厅",
+      C: "开/关",
+      D: "今日用电量/本月用电量",
+      E:'PF-B5'
+    },
+    {
+      A: "排风机",
+      B: "消防泵房",
+      C: "开/关",
+      D: "今日用电量/本月用电量",
+      E:'PF-B4'
+    },
+    {
+      A: "排风机",
+      B: "车站备品间",
+      C: "开/关",
+      D: "今日用电量/本月用电量",
+      E:'厕所排风机1#'
+    },
+    {
+      A: "排风机",
+      B: "候车厅公共卫生间",
+      C: "开/关",
+      D: "今日用电量/本月用电量",
+      E:'厕所排风机2#'
+    },
+    {
+      A: "排风机",
+      B: "出站通道公共卫生间",
+      C: "开/关",
+      D: "今日用电量/本月用电量",
+      E:'厕所排风机3#'
+    },
+    {
+      A: " 换气扇",
+      B: "吸氧间",
+      C: "开/关",
+      D: "今日用电量/本月用电量",
+      E:'JK-1'
+    },
+    {
+      A: " 换气扇",
+      B: "吸氧间",
+      C: "开/关",
+      D: "今日用电量/本月用电量",
+      E:'JK-1'
+    },
+    {
+      A: " 换气扇",
+      B: "吸氧间",
+      C: "开/关",
+      D: "今日用电量/本月用电量",
+      E:'JK-1'
+    },
+    {
+      A: " 换气扇",
+      B: "吸氧间",
+      C: "开/关",
+      D: "今日用电量/本月用电量",
+      E:'JK-1'
+    },
+    {
+      A: "换气扇",
+      B: "站长室",
+      C: "开/关",
+      D: "今日用电量/本月用电量",
+      E:'JK-1'
+    },
+    {
+      A: "换气扇",
+      B: "VIP候车室",
+      C: "开/关",
+      D: "今日用电量/本月用电量",
+      E:'JK-1'
+    },
+  ];
+  
\ No newline at end of file

src/pages/eq/office/page.vue

 <template>
-  <div class="office-area-control" style=" padding:10px 10px 40px 10px;">
+  <div class="office-area-control" style="padding:0 0 40px 0">
     <cardList cardListTitle="办公区域控制">
-      <div slot="content" style="padding: 24px 28px 20px 23px">
-        <enTabs :tabList="officeTabList"></enTabs>
+      <div slot="content" >
+        <!-- <enTabs :tabList="officeTabList"></enTabs> -->
+         <el-tabs class="en-tabs" v-model="activeTab" >
+            <el-tab-pane
+              :label="item.label"
+              :name="item.value"
+              v-for="(item, index) in officeTabList"
+              :key="index"
+            ></el-tab-pane>
+          </el-tabs>
         <div style="margin-top: 20px"></div>
-        <en-table :tableData="tableData" :tableColums="tableColums" isShowOp="true"> </en-table>
+        <en-table :tableData="tableData" :tableColums="tableColums" :isShowOp="true" isShowPage="true"> 
+          <template v-slot:operation='scope'>
+           <el-button type="text">编辑</el-button>
+         </template>
+        </en-table>
       </div>
     </cardList>
   </div>
 </template>
 <script >
-const tableColums = [
-  {
-    align: "center",
-    prop: "A",
-    label: "设备名称",
-    width: 132,
-  },
-  {
-    align: "center",
-    prop: "B",
-    label: "设备描述",
-    width: 112,
-  },
-  {
-    align: "center",
-    prop: "C",
-    label: "运行状态",
-    width: 132,
-  },
-  {
-    align: "center",
-    prop: "D",
-    label: "当前频率",
-    width: 132,
-  },
-  {
-    align: "center",
-    prop: "E",
-    label: "故障报警",
-    width: 132,
-  },
-  {
-    align: "center",
-    prop: "F",
-    label: "说明",
-    width: 132,
-  },
-  {
-    align: "center",
-    prop: "G",
-    label: "设备编号",
-    width: 132,
-  },
-];
-const tableData = [
-  {
-    A: "A",
-    B: "YA01254N51",
-    C: "正常",
-    D: "110Hz",
-    E: "",
-    F: "说明",
-    G: "QY0001",
-  },
-  {
-    A: "A",
-    B: "YA01254N51",
-    C: "正常",
-    D: "110Hz",
-    E: "",
-    F: "说明",
-    G: "QY0001",
-  },
-  {
-    A: "A",
-    B: "YA01254N51",
-    C: "正常",
-    D: "110Hz",
-    E: "",
-    F: "说明",
-    G: "QY0001",
-  },
-  {
-    A: "A",
-    B: "YA01254N51",
-    C: "正常",
-    D: "110Hz",
-    E: "",
-    F: "说明",
-    G: "QY0001",
-  },
-  {
-    A: "A",
-    B: "YA01254N51",
-    C: "正常",
-    D: "110Hz",
-    E: "",
-    F: "说明",
-    G: "QY0001",
-  },
-  {
-    A: "A",
-    B: "YA01254N51",
-    C: "正常",
-    D: "110Hz",
-    E: "",
-    F: "说明",
-    G: "QY0001",
-  },
-  {
-    A: "A",
-    B: "YA01254N51",
-    C: "正常",
-    D: "110Hz",
-    E: "",
-    F: "说明",
-    G: "QY0001",
-  },
-  {
-    A: "A",
-    B: "YA01254N51",
-    C: "正常",
-    D: "110Hz",
-    E: "",
-    F: "说明",
-    G: "QY0001",
-  },
-  {
-    A: "A",
-    B: "YA01254N51",
-    C: "正常",
-    D: "110Hz",
-    E: "",
-    F: "说明",
-    G: "QY0001",
-  },
-  {
-    A: "A",
-    B: "YA01254N51",
-    C: "正常",
-    D: "110Hz",
-    E: "",
-    F: "说明",
-    G: "QY0001",
-  },
-  {
-    A: "A",
-    B: "YA01254N51",
-    C: "正常",
-    D: "110Hz",
-    E: "",
-    F: "说明",
-    G: "QY0001",
-  },
-];
-import cardList from "../../home/compontents/cardList";
-import enTabs from "../hall/components/enTabs";
-import enTable from "../hall/components/enTable";
+// const tableColums = [
+//   {
+//     align: "center",
+//     prop: "A",
+//     label: "设备名称",
+//     width: 132,
+//   },
+//   {
+//     align: "center",
+//     prop: "B",
+//     label: "设备位置",
+//     // width: 112,
+//   },
+//   {
+//     align: "center",
+//     prop: "C",
+//     label: "控制方式",
+//     width: 132,
+//   },
+//   {
+//     align: "center",
+//     prop: "D",
+//     label: "能耗统计",
+//     width: 132,
+//   },
+//   // {
+//   //   align: "center",
+//   //   prop: "E",
+//   //   label: "故障报警",
+//   //   width: 132,
+//   // },
+//   // {
+//   //   align: "center",
+//   //   prop: "F",
+//   //   label: "说明",
+//   //   width: 132,
+//   // },
+//   {
+//     align: "center",
+//     prop: "G",
+//     label: "设备编号",
+//     width: 132,
+//   },
+// ];
+// const tableData = [
+//   {
+//     A: "A",
+//     B: "YA01254N51",
+//     C: "正常",
+//     D: "110Hz",
+//     E: "",
+//     F: "说明",
+//     G: "QY0001",
+//   },
+//   {
+//     A: "A",
+//     B: "YA01254N51",
+//     C: "正常",
+//     D: "110Hz",
+//     E: "",
+//     F: "说明",
+//     G: "QY0001",
+//   },
+//   {
+//     A: "A",
+//     B: "YA01254N51",
+//     C: "正常",
+//     D: "110Hz",
+//     E: "",
+//     F: "说明",
+//     G: "QY0001",
+//   },
+//   {
+//     A: "A",
+//     B: "YA01254N51",
+//     C: "正常",
+//     D: "110Hz",
+//     E: "",
+//     F: "说明",
+//     G: "QY0001",
+//   },
+//   {
+//     A: "A",
+//     B: "YA01254N51",
+//     C: "正常",
+//     D: "110Hz",
+//     E: "",
+//     F: "说明",
+//     G: "QY0001",
+//   },
+//   {
+//     A: "A",
+//     B: "YA01254N51",
+//     C: "正常",
+//     D: "110Hz",
+//     E: "",
+//     F: "说明",
+//     G: "QY0001",
+//   },
+//   {
+//     A: "A",
+//     B: "YA01254N51",
+//     C: "正常",
+//     D: "110Hz",
+//     E: "",
+//     F: "说明",
+//     G: "QY0001",
+//   },
+//   {
+//     A: "A",
+//     B: "YA01254N51",
+//     C: "正常",
+//     D: "110Hz",
+//     E: "",
+//     F: "说明",
+//     G: "QY0001",
+//   },
+//   {
+//     A: "A",
+//     B: "YA01254N51",
+//     C: "正常",
+//     D: "110Hz",
+//     E: "",
+//     F: "说明",
+//     G: "QY0001",
+//   },
+//   {
+//     A: "A",
+//     B: "YA01254N51",
+//     C: "正常",
+//     D: "110Hz",
+//     E: "",
+//     F: "说明",
+//     G: "QY0001",
+//   },
+//   {
+//     A: "A",
+//     B: "YA01254N51",
+//     C: "正常",
+//     D: "110Hz",
+//     E: "",
+//     F: "说明",
+//     G: "QY0001",
+//   },
+// ];
+import cardList from "../../components/cardList";
+import enTabs from "../../components/enTabs";
+import enTable from "../../components/enTable";
+import { tableDataOne,tableColumsOne ,tableDataTwo,tableDataThree,tableDataFour} from './config'
+
 export default {
   name: "officeAreaControl",
   components: {
@@ -165,10 +179,12 @@ export default {
     enTabs,
     enTable,
   },
+  
   data() {
     return {
-      tableData,
-      tableColums,
+      activeTab:'01',
+      tableData:tableDataOne,
+      tableColums:tableColumsOne,
       officeTabList: [
         {
           value: "01",
@@ -189,5 +205,27 @@ export default {
       ],
     };
   },
+  watch:{
+    activeTab(val){
+       switch (val){
+         case '01':
+         this.tableColums = tableColumsOne
+         this.tableData = tableDataOne
+         break;
+          case '02':
+         this.tableColums = tableColumsOne
+         this.tableData = tableDataTwo
+         break;
+          case '03':
+         this.tableColums = tableColumsOne
+         this.tableData = tableDataThree
+         break;
+          case '04':
+         this.tableColums = tableColumsOne
+         this.tableData = tableDataFour
+         break;
+       }
+    }
+  }
 };
 </script>

src/pages/home/page.vue

@@ -22,7 +22,7 @@
       </div>
     </div>
      <div class="home-page-content" >
-<el-row :gutter="14" >
+<el-row :gutter="12" >
   <el-col :span="16" >
     <card-list :cardListTitle="cardListLeftTitle">
       <div slot="right">
@@ -107,7 +107,7 @@
       </div>
     </card-list>
   </el-col>
-  <el-col :span="8">
+  <el-col :span="8" style="padding-left:0">
     <card-list :cardListTitle="cardListRightTitle" >
       <div slot="content">
           <my-pies></my-pies>  
@@ -120,9 +120,9 @@
 </template>
 
 <script>
-import cardList from "./compontents/cardList";
-import energyTotalCharts from "./compontents/energyTotalCharts";
-import myPies from "./compontents/myPies";
+import cardList from "../components/cardList";
+import energyTotalCharts from "../components/energyTotalCharts";
+import myPies from "../components/myPies";
 // import CardList from './compontents/cardList.vue';
 export default {
   name: "home",
@@ -194,29 +194,30 @@ export default {
   },
 };
 </script>
-
 <style lang="scss" scoped>
 @import "~@/assets/style/public.scss";
 .home-page {
   height: 100%;
   width: 100%;
-  padding:10px 10px 40px 10px;
+  padding:0px 0px 40px 0px;
   // overflow: auto;
   &-top {
+      margin: 20px;
     margin-bottom: 24px;
     .f-group {
       width: 100%;
       display: flex;
           .f-item {
             box-sizing: border-box;
-      width: calc(20% - 19px);
+      width: calc(20% - 18px);
         height: 216px;
       margin-right: 24px;
       padding-top: 40px;
       background-color: #fff;
       text-align: center;
     
-      box-shadow: 4px 0px 4px 0px rgba(0, 0, 0, 0.05);
+      // box-shadow: 4px 0px 4px 0px rgba(0, 0, 0, 0.05);
+        box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
       img {
         width: 50px;
         height: 50px;
@@ -246,6 +247,7 @@ export default {
 
   }
   .home-page-content {
+    margin: 20px;
     .date-text {
       padding-right: 20px;
       font-size: 14px;
@@ -259,6 +261,7 @@ export default {
     }
 
     .content-wrap {
+      // margin: 20px;
       .energy-save-mode-wrap {
         // width: ;
         box-sizing: border-box;

src/pages/kb/indoor/index.vue

 <template lang="pug">
 card-warp(title="室内气象数据" height='45px' showBackground )
     div(slot='right')
-        router-link.margin-lr-20(:to="{name:'analysis-indoor'}")
+        router-link(:to="{name:'analysis-indoor'}")
             el-button(size='mini' type='primary') 综合图形
     div(slot="content", style="height: 90%")
         el-tabs.myTabs(v-model="activeName", @tab-click="tabClick")
@@ -14,18 +14,18 @@ card-warp(title="室内气象数据" height='45px' showBackground )
                 el-button(type='primary' size='mini') 查询
         .data-warp
             div.data-item
-                p.type 温度
-                p.color-blue
+                div.type 温度
+                div.color-blue
                     span.num 37
                     span.unit ℃
             div.data-item
-                p.type 湿度
-                p.color-cyan
+                div.type 湿度
+                div.color-cyan
                     span.num 25
                     span.unit %RH
             div.data-item()
-                p.type   CO2
-                p.color-green
+                div.type   CO2
+                div.color-green
                     span.num 17
                     span.unit PPM
         el-table(size="mini" :data='dataList'   stripe v-loading='dataListLoading'  style='width: 100%;' :header-cell-style="{ background: '#EEF8FF', color: '#333333' }")
@@ -113,21 +113,19 @@ components: {
         border: 1px solid #ECECEC;
         box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.08);
         .type{
-            height: 19px;
             font-size: 18px;
             font-family: Microsoft YaHei;
             font-weight: 400;
             color: #333333;
-            line-height: 60px;
-
+            padding-top: 38px;
         }
         .num{
-            height: 28px;
             font-size: 36px;
             font-family: PingFang SC;
             font-weight: 600;
             color: #21ACFC;
-            line-height: 60px;
+            padding-top: 12px;
+
         }
         .unit{
             height: 15px;

src/router/routes.js

@@ -42,7 +42,8 @@ const frameIn = [
     component: layoutHeaderAside,
     children: (pre => [
       { path: 'hall', name: `${pre}hall`, component: () => import('@/pages/eq/hall'), meta: { ...meta, title: '候车大厅控制' } },
-      { path: 'office', name: `${pre}office`, component: () => import('@/pages/eq/office'), meta: { ...meta, title: '办公区域控制' } }
+      { path: 'office', name: `${pre}office`, component: () => import('@/pages/eq/office'), meta: { ...meta, title: '办公区域控制' } },
+      { path: 'view', name: `${pre}view`, component: () => import('@/pages/eq/view'), meta: { ...meta, title: '设备概览' } }
     ])('eq-')
   },