原模块修改能源

src/views/energy/monitoring/energyOverlimitLog/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="app-container">
+  <div class="app-container energyOverlimitLog">
 
     <!-- 搜索工作栏 -->
     <search-bar
@@ -7,14 +7,29 @@
       ref="searchBarForm"
       @headBtnClick="buttonClick"
     />
+    <el-tabs v-model="activeName" @tab-click="toggleTab">
+      <el-tab-pane label="自动抄表" name="auto"></el-tab-pane>
+      <el-tab-pane label="手动抄表" name="manual"></el-tab-pane>
+    </el-tabs>
     <!-- 列表 -->
-    <base-table
-      :page="queryParams.pageNo"
-      :limit="queryParams.pageSize"
-      :table-props="tableProps"
-      :table-data="list"
-      :max-height="tableH"
-    />
+    <div v-if="activeName === 'auto'">
+      <base-table
+        :page="queryParams.pageNo"
+        :limit="queryParams.pageSize"
+        :table-props="tableProps"
+        :table-data="list"
+        :max-height="tableH"
+      />
+    </div>
+    <div v-if="activeName === 'manual'">
+      <base-table
+        :page="queryParams.pageNo"
+        :limit="queryParams.pageSize"
+        :table-props="tableProps2"
+        :table-data="list2"
+        :max-height="tableH"
+      />
+    </div>
     <pagination
       :page.sync="queryParams.pageNo"
       :limit.sync="queryParams.pageSize"
@@ -65,6 +80,41 @@ const tableProps = [
   {
     prop: 'overValue',
     label: '超出值'
+  },
+  {
+    prop: 'time',
+    label: '提醒时间',
+    filter: parseTime,
+    minWidth: 160
+  }
+]
+const tableProps2 = [
+  {
+    prop: 'energyType',
+    label: '能源类型'
+  },
+  {
+    prop: 'limitType',
+    label: '指标类型',
+    filter: publicFormatter('monitor_index_type')
+  },
+  {
+    prop: 'realityValue',
+    label: '实际值'
+  },
+  {
+    prop: 'limitValue',
+    label: '阈值'
+  },
+  {
+    prop: 'overValue',
+    label: '超出值'
+  },
+  {
+    prop: 'time',
+    label: '提醒时间',
+    filter: parseTime,
+    minWidth: 160
   }
 ]
 export default {
@@ -93,18 +143,20 @@ export default {
           color: 'primary'
         }
       ],
+      activeName: 'auto',
       tableProps,
+      tableProps2,
       tableH: this.tableHeight(260),
-      // 总条数
       total: 0,
-      // 班次基础信息列表
       list: [],
+      list2: [],
       // 查询参数
       queryParams: {
         pageNo: 1,
         pageSize: 20,
         energyTypeId: '',
-        indexType: ''
+        indexType: '',
+        method: '1'
       },
       typeList: [
         {id: 1, name: '合并'},
@@ -155,7 +207,47 @@ export default {
         console.log(res)
         this.formConfig[0].selectOptions = res.data || []
       })
+    },
+    toggleTab() {
+      if (this.activeName === 'auto') {
+        this.queryParams.method = '1'
+      }else{
+        this.queryParams.method = '2'
+      }
+      this.queryParams.pageNo = 1
+      this.getList()
     }
   }
 };
 </script>
+<style lang='scss'>
+.energyOverlimitLog {
+  .el-tabs__nav::after {
+    content: "";
+    position: absolute;
+    left: 0;
+    bottom: 0;
+    width: 100%;
+    height: 2px;
+    background-color: #e4e7ed;
+  }
+  .el-tabs__nav-wrap::after {
+    width: 0;
+  }
+  .el-tabs__item {
+    padding: 0 10px;
+  }
+  .el-tabs__item:hover {
+    color: rgba(0, 0, 0, 0.85);
+  }
+  .el-tabs__item.is-active {
+    color: rgba(0, 0, 0, 0.85);
+  }
+  .el-tabs__item {
+    color: rgba(0, 0, 0, 0.45);
+  }
+  .searchBarBox {
+    margin-bottom: 0;
+  }
+}
+</style>