调整

src/pages/eq/hall/page.vue

 <template>
   <div class="hall full-height">
     <cardList cardListTitle="候车大厅控制">
-      <div slot="content" >
+      <div slot="content">
         <div>
 
-            <el-form :inline="true" :model="formData" label-width="100">
-                <el-row>
-              <el-col :span="12">
+          <el-form :inline="true" :model="formData" label-width="100">
                 <el-form-item label="定时功能启止时间：">
-                  <el-date-picker
-                  size="mini"
-                    style="width: 200px"
-                    type="date"
-                    placeholder=""
-                  >
+                  <el-date-picker size="mini" style="width: 200px" type="date" placeholder="" v-model="formData.startTime">
                   </el-date-picker>
                   <span style="padding: 0 10px">至</span>
-                  <el-date-picker
-                    size="mini"
-                    style="width: 200px"
-                    type="date"
-                    placeholder=""
-                  >
+                  <el-date-picker size="mini" style="width: 200px" type="date" placeholder="" v-model="formData.endTime">
                   </el-date-picker>
                 </el-form-item>
-              </el-col>
-              <el-col :span="4">
                 <el-form-item label="定时设定按钮：">
-                  <el-switch active-color="#0097FF" inactive-color="#ff4949">
+                  <el-switch active-color="#47B320" v-model="formData.timing" inactive-color="#ff4949">
                   </el-switch>
                 </el-form-item>
-              </el-col>
-              <el-col :span="5">
-                <el-form-item label="温度设定：">
-                  <el-input
-                    style="width: 124px"
-                    v-model="formData.user"
-                    placeholder=""
-                  ></el-input>
-
-                  <!-- <el-button type="primary" >查询</el-button> -->
-                </el-form-item>
-              </el-col>
-
-               </el-row>
-               <el-row>
-                  <el-col :md="12" :lg="4">
                 <el-form-item label="节能模式：">
-                  <el-switch
-                    active-color="#13ce66"
-                    inactive-color="#ff4949"
-                  ></el-switch>
+                  <el-switch active-color="#47B320" v-model="formData.saving" inactive-color="#ff4949" ></el-switch>
                 </el-form-item>
-              </el-col>
-
-              <el-col :md="12" :lg="10" class="btn-group">
+              <span class="btn-group">
                 <el-form-item label="">
-                  <el-button type="primary" size="mini">编辑</el-button>
+                  <el-button type="primary" size="mini">温度设定</el-button>
                   <el-button type="primary" size="mini">
-                     <img src="../../home/image/sun_icon.png" alt="">
-                    自然通风</el-button>
+                    <img src="../../home/image/sun_icon.png" alt="">
+                    自然通风
+                  </el-button>
                   <el-button type="primary" size="mini">
-                     <img src="../../home/image/fan_icon.png" alt="">
-                    机械通风</el-button>
+                    <img src="../../home/image/fan_icon.png" alt="">
+                    机械通风
+                  </el-button>
                   <el-button type="primary" size="mini">
-                     <img src="../../home/image/nan_fan_icon.png" alt="">
-                    供暖</el-button>
+                    <img src="../../home/image/nan_fan_icon.png" alt="">
+                    供暖
+                  </el-button>
                 </el-form-item>
-              </el-col>
-               </el-row>
-            </el-form>
+              </span>
+            </el-row>
+
+          </el-form>
 
         </div>
         <!-- tabs -->
         <div style="margin-bottom: 20px">
-           <!-- <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>
+          <!-- <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 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>
+            <el-button type="text" @click="hallModalVisible=true">编辑</el-button>
 
-         </template>
+          </template>
         </enTable>
       </div>
     </cardList>
-  <hall-modal v-on:cancelhandle="cancelhandle" :hallModalVisible="hallModalVisible"></hall-modal>
+    <hall-modal v-on:cancelhandle="cancelhandle" :hallModalVisible="hallModalVisible"></hall-modal>
     hallModalVisible
   </div>
 </template>
@@ -104,7 +68,13 @@ import cardList from '../../components/cardList'
 import enTable from '../../components/enTable'
 import enTabs from '../../components/enTabs'
 import hallModal from './components/hallModal'
-import { tableDataOne, tableColumsOne, tableDataTwo, tableDataThree, tableDataFour } from './config'
+import {
+  tableDataOne,
+  tableColumsOne,
+  tableDataTwo,
+  tableDataThree,
+  tableDataFour
+} from './config'
 
 export default {
   components: {
@@ -115,24 +85,24 @@ 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
-       }
+      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
+      }
     }
   },
   data() {
@@ -163,36 +133,35 @@ export default {
     }
   },
   methods: {
-     cancelhandle() {
-        this.$nextTick(() => {
-           this.hallModalVisible = false
-        })
-     },
-     handleBtnClick() {
-       this.hallModalVisible = true
-     }
+    cancelhandle() {
+      this.$nextTick(() => {
+        this.hallModalVisible = false
+      })
+    },
+    handleBtnClick() {
+      this.hallModalVisible = true
+    }
   }
 }
 </script>
 <style lang="scss" >
 .hall {
   height: 100%;
-   padding:0px 0 40px 0px;
+  padding: 0px 0 40px 0px;
   .el-input__inner {
     height: 30px;
   }
-  .el-form-item{
+  .el-form-item {
     margin-bottom: 10px;
   }
   .el-form-item__label {
     padding: 0;
   }
-  .btn-group{
-    img{
+  .btn-group {
+    img {
       width: 10px;
       height: 9px;
     }
   }
-
 }
 </style>