diff --git a/src/components/DownloadTemplate/index.vue b/src/components/DownloadTemplate/index.vue
index 228bf65..4e0d8a7 100644
--- a/src/components/DownloadTemplate/index.vue
+++ b/src/components/DownloadTemplate/index.vue
@@ -49,8 +49,4 @@
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
-  .edit_btn{
-    float:right;
-    margin:7px 3px;//为了需要居中显示margin-top和bottom要用$tableTitleHeight减去按钮原高度除以2
-  }
 </style>

diff --git a/src/components/DownloadTemplate/index.vue b/src/components/DownloadTemplate/index.vue
index 228bf65..4e0d8a7 100644
--- a/src/components/DownloadTemplate/index.vue
+++ b/src/components/DownloadTemplate/index.vue
@@ -49,8 +49,4 @@
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
-  .edit_btn{
-    float:right;
-    margin:7px 3px;//为了需要居中显示margin-top和bottom要用$tableTitleHeight减去按钮原高度除以2
-  }
 </style>
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 918c857..c3d9a5c 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -159,3 +159,14 @@
 .el-table td{
   padding: 4px 0px !important;
 }
+
+.upload-btn{
+  display: inline-block;
+}
+.el-button + .upload-btn {
+  margin-left: 3px;
+}
+.upload-btn+ .el-button {
+  margin-left: 3px;
+}
+

diff --git a/src/components/DownloadTemplate/index.vue b/src/components/DownloadTemplate/index.vue
index 228bf65..4e0d8a7 100644
--- a/src/components/DownloadTemplate/index.vue
+++ b/src/components/DownloadTemplate/index.vue
@@ -49,8 +49,4 @@
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
-  .edit_btn{
-    float:right;
-    margin:7px 3px;//为了需要居中显示margin-top和bottom要用$tableTitleHeight减去按钮原高度除以2
-  }
 </style>
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 918c857..c3d9a5c 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -159,3 +159,14 @@
 .el-table td{
   padding: 4px 0px !important;
 }
+
+.upload-btn{
+  display: inline-block;
+}
+.el-button + .upload-btn {
+  margin-left: 3px;
+}
+.upload-btn+ .el-button {
+  margin-left: 3px;
+}
+
diff --git a/src/views/dataManage/deviceData/listGasData.vue b/src/views/dataManage/deviceData/listGasData.vue
index 2a0b33e..e24a94b 100644
--- a/src/views/dataManage/deviceData/listGasData.vue
+++ b/src/views/dataManage/deviceData/listGasData.vue
@@ -21,31 +21,30 @@
       </search-item>
     </search-area>
     <!--查询结果Table显示-->
-    <div>
-      <normal-table
-        ref="normalTable"
-        :data="list"
-        :total="total"
-        :query="listQuery"
-        :list-loading="listLoading"
-        :options="options"
-        size="small"
-      >
-        <template slot="btns">
-          <el-button v-if="hasPerm('/gasdata/export')" size="small" @click="batchExport">
-            导出记录
-          </el-button>
-        </template>
-        <template slot="columns">
-          <el-table-column v-for="column in columns" :key="column.value" :label="column.text" :width="column.width" :align="column.align" show-overflow-tooltip>
-            <template slot-scope="scope">
-              <span v-if="column.checkCell" :class="checkCell(scope.row.cell)">{{ scope.row[column.value] }}</span>
-              <span v-else>{{ scope.row[column.value] }}</span>
-            </template>
-          </el-table-column>
-        </template>
-      </normal-table>
-    </div>
+    <normal-table
+      ref="normalTable"
+      :data="list"
+      :total="total"
+      :query="listQuery"
+      :list-loading="listLoading"
+      :options="options"
+      size="small"
+      @change="changePage"
+    >
+      <template slot="btns">
+        <el-button v-if="hasPerm('/gasdata/export')" size="small" @click="batchExport">
+          导出记录
+        </el-button>
+      </template>
+      <template slot="columns">
+        <el-table-column v-for="column in columns" :key="column.value" :label="column.text" :width="column.width" :align="column.align" show-overflow-tooltip>
+          <template slot-scope="scope">
+            <span v-if="column.checkCell" :class="checkCell(scope.row.cell)">{{ scope.row[column.value] }}</span>
+            <span v-else>{{ scope.row[column.value] }}</span>
+          </template>
+        </el-table-column>
+      </template>
+    </normal-table>
   </app-container>
 </template>
 
@@ -136,7 +135,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -146,7 +145,7 @@
       })
       batchExportGasData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
-        let fileName = `${this.name}数据_${this.listQuery.beginTime}_${this.listQuery.endTime}.xlsx`
+        let fileName = `${this.name}数据-${this.listQuery.beginTime}-${this.listQuery.endTime}.xlsx`
         fileName = fileName.replace(/-|:| /g, '')
         const blob = new Blob([res.data])
         exportFile(blob, fileName)
@@ -202,36 +201,7 @@
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
-  .app-container{
-    padding: 10px;
-  }
-  $tableTitleHeight:46px;
-  .table{
-    margin-bottom: 20px;
-  }
-  .pagination-container{
-    margin-bottom: 50px;
-  }
-  .table-title{
-    background-color:rgba(243, 243, 243, 1);
-    height: $tableTitleHeight;
-    .title-header{
-      line-height:$tableTitleHeight;
-      color: #606266;
-      font-size: 15px;
-      i{
-        margin-left: 5px;
-        margin-right: 5px;
-      }
-    }
-  }
-  .edit_btns{
-    .edit_btn{
-      float:right;
-      margin:7px 3px;//为了需要居中显示margin-top和bottom要用$tableTitleHeight减去按钮原高度除以2
-    }
-  }
-  .warning-state{
-    color:red
-  }
+.warning-state{
+  color:red
+}
 </style>

diff --git a/src/components/DownloadTemplate/index.vue b/src/components/DownloadTemplate/index.vue
index 228bf65..4e0d8a7 100644
--- a/src/components/DownloadTemplate/index.vue
+++ b/src/components/DownloadTemplate/index.vue
@@ -49,8 +49,4 @@
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
-  .edit_btn{
-    float:right;
-    margin:7px 3px;//为了需要居中显示margin-top和bottom要用$tableTitleHeight减去按钮原高度除以2
-  }
 </style>
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 918c857..c3d9a5c 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -159,3 +159,14 @@
 .el-table td{
   padding: 4px 0px !important;
 }
+
+.upload-btn{
+  display: inline-block;
+}
+.el-button + .upload-btn {
+  margin-left: 3px;
+}
+.upload-btn+ .el-button {
+  margin-left: 3px;
+}
+
diff --git a/src/views/dataManage/deviceData/listGasData.vue b/src/views/dataManage/deviceData/listGasData.vue
index 2a0b33e..e24a94b 100644
--- a/src/views/dataManage/deviceData/listGasData.vue
+++ b/src/views/dataManage/deviceData/listGasData.vue
@@ -21,31 +21,30 @@
       </search-item>
     </search-area>
     <!--查询结果Table显示-->
-    <div>
-      <normal-table
-        ref="normalTable"
-        :data="list"
-        :total="total"
-        :query="listQuery"
-        :list-loading="listLoading"
-        :options="options"
-        size="small"
-      >
-        <template slot="btns">
-          <el-button v-if="hasPerm('/gasdata/export')" size="small" @click="batchExport">
-            导出记录
-          </el-button>
-        </template>
-        <template slot="columns">
-          <el-table-column v-for="column in columns" :key="column.value" :label="column.text" :width="column.width" :align="column.align" show-overflow-tooltip>
-            <template slot-scope="scope">
-              <span v-if="column.checkCell" :class="checkCell(scope.row.cell)">{{ scope.row[column.value] }}</span>
-              <span v-else>{{ scope.row[column.value] }}</span>
-            </template>
-          </el-table-column>
-        </template>
-      </normal-table>
-    </div>
+    <normal-table
+      ref="normalTable"
+      :data="list"
+      :total="total"
+      :query="listQuery"
+      :list-loading="listLoading"
+      :options="options"
+      size="small"
+      @change="changePage"
+    >
+      <template slot="btns">
+        <el-button v-if="hasPerm('/gasdata/export')" size="small" @click="batchExport">
+          导出记录
+        </el-button>
+      </template>
+      <template slot="columns">
+        <el-table-column v-for="column in columns" :key="column.value" :label="column.text" :width="column.width" :align="column.align" show-overflow-tooltip>
+          <template slot-scope="scope">
+            <span v-if="column.checkCell" :class="checkCell(scope.row.cell)">{{ scope.row[column.value] }}</span>
+            <span v-else>{{ scope.row[column.value] }}</span>
+          </template>
+        </el-table-column>
+      </template>
+    </normal-table>
   </app-container>
 </template>
 
@@ -136,7 +135,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -146,7 +145,7 @@
       })
       batchExportGasData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
-        let fileName = `${this.name}数据_${this.listQuery.beginTime}_${this.listQuery.endTime}.xlsx`
+        let fileName = `${this.name}数据-${this.listQuery.beginTime}-${this.listQuery.endTime}.xlsx`
         fileName = fileName.replace(/-|:| /g, '')
         const blob = new Blob([res.data])
         exportFile(blob, fileName)
@@ -202,36 +201,7 @@
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
-  .app-container{
-    padding: 10px;
-  }
-  $tableTitleHeight:46px;
-  .table{
-    margin-bottom: 20px;
-  }
-  .pagination-container{
-    margin-bottom: 50px;
-  }
-  .table-title{
-    background-color:rgba(243, 243, 243, 1);
-    height: $tableTitleHeight;
-    .title-header{
-      line-height:$tableTitleHeight;
-      color: #606266;
-      font-size: 15px;
-      i{
-        margin-left: 5px;
-        margin-right: 5px;
-      }
-    }
-  }
-  .edit_btns{
-    .edit_btn{
-      float:right;
-      margin:7px 3px;//为了需要居中显示margin-top和bottom要用$tableTitleHeight减去按钮原高度除以2
-    }
-  }
-  .warning-state{
-    color:red
-  }
+.warning-state{
+  color:red
+}
 </style>
diff --git a/src/views/dataManage/deviceData/listWellCoverData.vue b/src/views/dataManage/deviceData/listWellCoverData.vue
index 4b199c4..3d349df 100644
--- a/src/views/dataManage/deviceData/listWellCoverData.vue
+++ b/src/views/dataManage/deviceData/listWellCoverData.vue
@@ -5,11 +5,12 @@
       <search-item>
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
-      <search-item size="small">
+      <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,43 +27,30 @@
       </search-item>
     </search-area>
     <!--查询结果Table显示-->
-    <div>
-      <el-row class="table-title">
-        <el-col :span="6">
-          <div class="title-header">
-            <i class="el-icon-menu" />数据列表
-          </div>
-        </el-col>
-        <el-col :span="12" :offset="6" class="edit_btns">
-          <el-button v-if="hasPerm('/welldata/export')" class="edit_btn" size="small" @click="batchExport">
-            导出记录
-          </el-button>
-        </el-col>
-      </el-row>
-      <el-table v-loading="listLoading" :data="list" class="table" border @selection-change="handleSelectionChange">
-        <el-table-column :index="indexMethod" align="center" type="index" />
+    <normal-table
+      ref="normalTable"
+      :data="list"
+      :total="total"
+      :query="listQuery"
+      :list-loading="listLoading"
+      :options="options"
+      size="small"
+      @change="changePage"
+    >
+      <template slot="btns">
+        <el-button v-if="hasPerm('/welldata/export')" size="small" @click="batchExport">
+          导出记录
+        </el-button>
+      </template>
+      <template slot="columns">
         <el-table-column v-for="column in columns" :key="column.value" :label="column.text" :width="column.width" :align="column.align" show-overflow-tooltip>
-          <template v-slot="scope">
-            <span v-if="column.checkState" :class="checkState(scope.row)">{{ scope.row[column.value] }}</span>
+          <template slot-scope="scope">
+            <span v-if="column.checkCell" :class="checkCell(scope.row.cell)">{{ scope.row[column.value] }}</span>
             <span v-else>{{ scope.row[column.value] }}</span>
           </template>
         </el-table-column>
-      </el-table>
-    </div>
-    <!--分页-->
-    <div class="pagination-container">
-      <el-pagination
-        v-show="total>9"
-        :current-page="listQuery.offset"
-        :page-sizes="[20,30,50]"
-        :page-size="listQuery.limit"
-        :total="total"
-        align="center"
-        layout="total, sizes, prev, pager, next"
-        @size-change="handleSizeChange"
-        @current-change="handleCurrentChange"
-      />
-    </div>
+      </template>
+    </normal-table>
   </app-container>
 </template>
 
@@ -71,6 +59,7 @@
 import DeptSelect from '../../../components/DeptSelect/index'
 import { parseUrl } from '@/utils/parseutils'
 import { getSearchLastWeekTime } from '@/utils/dateutils'
+import { exportFile } from '@/utils/exportutils'
 
 export default {
   name: 'ListWellCoverData',
@@ -82,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -132,24 +121,15 @@
           align: 'center'
         }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
       list: [], // 列表数据
       total: 0, // 数据总数
-      deviceTypeList: [], // 井盖类型列表
-      deptProps: {
-        parent: 'pid',
-        value: 'id',
-        label: 'name',
-        children: 'children'
-      }, // 权属单位树形下拉菜单
-      deptTreeList: null, // 组织树列表数据
-      showDeptTree: 0, // 是否显示权属单位下拉
-      showDeviceType: true, // 是否显示设备类型下拉
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      editShow: false, // 是否显示编辑框
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -177,6 +157,7 @@
   methods: {
     // 批量导出
     batchExport() {
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -186,16 +167,10 @@
       })
       batchExportWellData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
-        console.log('download===', res)
+        let fileName = `${this.name}数据-${this.listQuery.beginTime}-${this.listQuery.endTime}.xlsx`
+        fileName = fileName.replace(/-|:| /g, '')
         const blob = new Blob([res.data])
-        const downloadElement = document.createElement('a')
-        const href = window.URL.createObjectURL(blob) // 创建下载的链接
-        downloadElement.href = href
-        downloadElement.download = `井盖状态监测仪数据.xlsx` // 下载后文件名
-        document.body.appendChild(downloadElement)
-        downloadElement.click() // 点击下载
-        document.body.removeChild(downloadElement) // 下载完成移除元素
-        window.URL.revokeObjectURL(href) // 释放blob对象
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
       })
@@ -210,6 +185,15 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
+      getWellData(this.listQuery).then(response => {
+        this.list = response.data.rows
+        this.total = response.data.total
+        this.listLoading = false
+      })
+    },
+    // 处理时间
+    handleDateTime() {
       if (this.timeRange && this.timeRange.length > 0) {
         this.listQuery.beginTime = this.timeRange[0]
         this.listQuery.endTime = this.timeRange[1]
@@ -217,69 +201,28 @@
         this.listQuery.beginTime = ''
         this.listQuery.endTime = ''
       }
-      getWellData(this.listQuery).then(response => {
-        this.list = response.data.rows
-        this.total = response.data.total
-        this.listLoading = false
-      })
     },
     checkState(row) {
       if (row.status !== '0') {
         return 'warning-state'
       }
     },
-    indexMethod(index) {
-      return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
-    },
-    // 改变页容量
-    handleSizeChange(val) {
-      this.listQuery.limit = val
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
       this.fetchData()
-    },
-    // 改变当前页
-    handleCurrentChange(val) {
-      this.listQuery.offset = val
-      this.fetchData()
-    },
-    // 多选触发方法
-    handleSelectionChange(val) {
-      this.multipleSelection = val
     }
   }
 }
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
-  .app-container{
-    padding: 10px;
-  }
-  $tableTitleHeight:46px;
-  .table{
-    margin-bottom: 20px;
-  }
-  .pagination-container{
-    margin-bottom: 50px;
-  }
-  .table-title{
-    background-color:rgba(243, 243, 243, 1);
-    height: $tableTitleHeight;
-    .title-header{
-      line-height:$tableTitleHeight;
-      color: #606266;
-      font-size: 15px;
-      i{
-        margin-left: 5px;
-        margin-right: 5px;
-      }
-    }
-  }
-  .edit_btns{
-    .edit_btn{
-      float:right;
-      margin:7px 3px;//为了需要居中显示margin-top和bottom要用$tableTitleHeight减去按钮原高度除以2
-    }
-  }
-  .warning-state{
-    color:red
-  }
+.warning-state{
+  color:red
+}
 </style>

diff --git a/src/components/DownloadTemplate/index.vue b/src/components/DownloadTemplate/index.vue
index 228bf65..4e0d8a7 100644
--- a/src/components/DownloadTemplate/index.vue
+++ b/src/components/DownloadTemplate/index.vue
@@ -49,8 +49,4 @@
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
-  .edit_btn{
-    float:right;
-    margin:7px 3px;//为了需要居中显示margin-top和bottom要用$tableTitleHeight减去按钮原高度除以2
-  }
 </style>
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 918c857..c3d9a5c 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -159,3 +159,14 @@
 .el-table td{
   padding: 4px 0px !important;
 }
+
+.upload-btn{
+  display: inline-block;
+}
+.el-button + .upload-btn {
+  margin-left: 3px;
+}
+.upload-btn+ .el-button {
+  margin-left: 3px;
+}
+
diff --git a/src/views/dataManage/deviceData/listGasData.vue b/src/views/dataManage/deviceData/listGasData.vue
index 2a0b33e..e24a94b 100644
--- a/src/views/dataManage/deviceData/listGasData.vue
+++ b/src/views/dataManage/deviceData/listGasData.vue
@@ -21,31 +21,30 @@
       </search-item>
     </search-area>
     <!--查询结果Table显示-->
-    <div>
-      <normal-table
-        ref="normalTable"
-        :data="list"
-        :total="total"
-        :query="listQuery"
-        :list-loading="listLoading"
-        :options="options"
-        size="small"
-      >
-        <template slot="btns">
-          <el-button v-if="hasPerm('/gasdata/export')" size="small" @click="batchExport">
-            导出记录
-          </el-button>
-        </template>
-        <template slot="columns">
-          <el-table-column v-for="column in columns" :key="column.value" :label="column.text" :width="column.width" :align="column.align" show-overflow-tooltip>
-            <template slot-scope="scope">
-              <span v-if="column.checkCell" :class="checkCell(scope.row.cell)">{{ scope.row[column.value] }}</span>
-              <span v-else>{{ scope.row[column.value] }}</span>
-            </template>
-          </el-table-column>
-        </template>
-      </normal-table>
-    </div>
+    <normal-table
+      ref="normalTable"
+      :data="list"
+      :total="total"
+      :query="listQuery"
+      :list-loading="listLoading"
+      :options="options"
+      size="small"
+      @change="changePage"
+    >
+      <template slot="btns">
+        <el-button v-if="hasPerm('/gasdata/export')" size="small" @click="batchExport">
+          导出记录
+        </el-button>
+      </template>
+      <template slot="columns">
+        <el-table-column v-for="column in columns" :key="column.value" :label="column.text" :width="column.width" :align="column.align" show-overflow-tooltip>
+          <template slot-scope="scope">
+            <span v-if="column.checkCell" :class="checkCell(scope.row.cell)">{{ scope.row[column.value] }}</span>
+            <span v-else>{{ scope.row[column.value] }}</span>
+          </template>
+        </el-table-column>
+      </template>
+    </normal-table>
   </app-container>
 </template>
 
@@ -136,7 +135,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -146,7 +145,7 @@
       })
       batchExportGasData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
-        let fileName = `${this.name}数据_${this.listQuery.beginTime}_${this.listQuery.endTime}.xlsx`
+        let fileName = `${this.name}数据-${this.listQuery.beginTime}-${this.listQuery.endTime}.xlsx`
         fileName = fileName.replace(/-|:| /g, '')
         const blob = new Blob([res.data])
         exportFile(blob, fileName)
@@ -202,36 +201,7 @@
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
-  .app-container{
-    padding: 10px;
-  }
-  $tableTitleHeight:46px;
-  .table{
-    margin-bottom: 20px;
-  }
-  .pagination-container{
-    margin-bottom: 50px;
-  }
-  .table-title{
-    background-color:rgba(243, 243, 243, 1);
-    height: $tableTitleHeight;
-    .title-header{
-      line-height:$tableTitleHeight;
-      color: #606266;
-      font-size: 15px;
-      i{
-        margin-left: 5px;
-        margin-right: 5px;
-      }
-    }
-  }
-  .edit_btns{
-    .edit_btn{
-      float:right;
-      margin:7px 3px;//为了需要居中显示margin-top和bottom要用$tableTitleHeight减去按钮原高度除以2
-    }
-  }
-  .warning-state{
-    color:red
-  }
+.warning-state{
+  color:red
+}
 </style>
diff --git a/src/views/dataManage/deviceData/listWellCoverData.vue b/src/views/dataManage/deviceData/listWellCoverData.vue
index 4b199c4..3d349df 100644
--- a/src/views/dataManage/deviceData/listWellCoverData.vue
+++ b/src/views/dataManage/deviceData/listWellCoverData.vue
@@ -5,11 +5,12 @@
       <search-item>
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
-      <search-item size="small">
+      <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,43 +27,30 @@
       </search-item>
     </search-area>
     <!--查询结果Table显示-->
-    <div>
-      <el-row class="table-title">
-        <el-col :span="6">
-          <div class="title-header">
-            <i class="el-icon-menu" />数据列表
-          </div>
-        </el-col>
-        <el-col :span="12" :offset="6" class="edit_btns">
-          <el-button v-if="hasPerm('/welldata/export')" class="edit_btn" size="small" @click="batchExport">
-            导出记录
-          </el-button>
-        </el-col>
-      </el-row>
-      <el-table v-loading="listLoading" :data="list" class="table" border @selection-change="handleSelectionChange">
-        <el-table-column :index="indexMethod" align="center" type="index" />
+    <normal-table
+      ref="normalTable"
+      :data="list"
+      :total="total"
+      :query="listQuery"
+      :list-loading="listLoading"
+      :options="options"
+      size="small"
+      @change="changePage"
+    >
+      <template slot="btns">
+        <el-button v-if="hasPerm('/welldata/export')" size="small" @click="batchExport">
+          导出记录
+        </el-button>
+      </template>
+      <template slot="columns">
         <el-table-column v-for="column in columns" :key="column.value" :label="column.text" :width="column.width" :align="column.align" show-overflow-tooltip>
-          <template v-slot="scope">
-            <span v-if="column.checkState" :class="checkState(scope.row)">{{ scope.row[column.value] }}</span>
+          <template slot-scope="scope">
+            <span v-if="column.checkCell" :class="checkCell(scope.row.cell)">{{ scope.row[column.value] }}</span>
             <span v-else>{{ scope.row[column.value] }}</span>
           </template>
         </el-table-column>
-      </el-table>
-    </div>
-    <!--分页-->
-    <div class="pagination-container">
-      <el-pagination
-        v-show="total>9"
-        :current-page="listQuery.offset"
-        :page-sizes="[20,30,50]"
-        :page-size="listQuery.limit"
-        :total="total"
-        align="center"
-        layout="total, sizes, prev, pager, next"
-        @size-change="handleSizeChange"
-        @current-change="handleCurrentChange"
-      />
-    </div>
+      </template>
+    </normal-table>
   </app-container>
 </template>
 
@@ -71,6 +59,7 @@
 import DeptSelect from '../../../components/DeptSelect/index'
 import { parseUrl } from '@/utils/parseutils'
 import { getSearchLastWeekTime } from '@/utils/dateutils'
+import { exportFile } from '@/utils/exportutils'
 
 export default {
   name: 'ListWellCoverData',
@@ -82,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -132,24 +121,15 @@
           align: 'center'
         }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
       list: [], // 列表数据
       total: 0, // 数据总数
-      deviceTypeList: [], // 井盖类型列表
-      deptProps: {
-        parent: 'pid',
-        value: 'id',
-        label: 'name',
-        children: 'children'
-      }, // 权属单位树形下拉菜单
-      deptTreeList: null, // 组织树列表数据
-      showDeptTree: 0, // 是否显示权属单位下拉
-      showDeviceType: true, // 是否显示设备类型下拉
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      editShow: false, // 是否显示编辑框
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -177,6 +157,7 @@
   methods: {
     // 批量导出
     batchExport() {
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -186,16 +167,10 @@
       })
       batchExportWellData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
-        console.log('download===', res)
+        let fileName = `${this.name}数据-${this.listQuery.beginTime}-${this.listQuery.endTime}.xlsx`
+        fileName = fileName.replace(/-|:| /g, '')
         const blob = new Blob([res.data])
-        const downloadElement = document.createElement('a')
-        const href = window.URL.createObjectURL(blob) // 创建下载的链接
-        downloadElement.href = href
-        downloadElement.download = `井盖状态监测仪数据.xlsx` // 下载后文件名
-        document.body.appendChild(downloadElement)
-        downloadElement.click() // 点击下载
-        document.body.removeChild(downloadElement) // 下载完成移除元素
-        window.URL.revokeObjectURL(href) // 释放blob对象
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
       })
@@ -210,6 +185,15 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
+      getWellData(this.listQuery).then(response => {
+        this.list = response.data.rows
+        this.total = response.data.total
+        this.listLoading = false
+      })
+    },
+    // 处理时间
+    handleDateTime() {
       if (this.timeRange && this.timeRange.length > 0) {
         this.listQuery.beginTime = this.timeRange[0]
         this.listQuery.endTime = this.timeRange[1]
@@ -217,69 +201,28 @@
         this.listQuery.beginTime = ''
         this.listQuery.endTime = ''
       }
-      getWellData(this.listQuery).then(response => {
-        this.list = response.data.rows
-        this.total = response.data.total
-        this.listLoading = false
-      })
     },
     checkState(row) {
       if (row.status !== '0') {
         return 'warning-state'
       }
     },
-    indexMethod(index) {
-      return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
-    },
-    // 改变页容量
-    handleSizeChange(val) {
-      this.listQuery.limit = val
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
       this.fetchData()
-    },
-    // 改变当前页
-    handleCurrentChange(val) {
-      this.listQuery.offset = val
-      this.fetchData()
-    },
-    // 多选触发方法
-    handleSelectionChange(val) {
-      this.multipleSelection = val
     }
   }
 }
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
-  .app-container{
-    padding: 10px;
-  }
-  $tableTitleHeight:46px;
-  .table{
-    margin-bottom: 20px;
-  }
-  .pagination-container{
-    margin-bottom: 50px;
-  }
-  .table-title{
-    background-color:rgba(243, 243, 243, 1);
-    height: $tableTitleHeight;
-    .title-header{
-      line-height:$tableTitleHeight;
-      color: #606266;
-      font-size: 15px;
-      i{
-        margin-left: 5px;
-        margin-right: 5px;
-      }
-    }
-  }
-  .edit_btns{
-    .edit_btn{
-      float:right;
-      margin:7px 3px;//为了需要居中显示margin-top和bottom要用$tableTitleHeight减去按钮原高度除以2
-    }
-  }
-  .warning-state{
-    color:red
-  }
+.warning-state{
+  color:red
+}
 </style>
diff --git a/src/views/system/area/listArea.vue b/src/views/system/area/listArea.vue
index f93cd14..2b75380 100644
--- a/src/views/system/area/listArea.vue
+++ b/src/views/system/area/listArea.vue
@@ -9,7 +9,7 @@
     <!--查询结果Table显示-->
     <normal-table :data="list" :total="total" :query="listQuery" :list-loading="listLoading" @change="changePage">
       <template slot="btns">
-        <el-button v-if="hasPerm('/area/add')" size="small" class="filter-item" icon="el-icon-plus" @click="add">
+        <el-button v-if="hasPerm('/sys/area/add')" size="small" class="filter-item" icon="el-icon-plus" @click="add">
           新增
         </el-button>
       </template>
@@ -21,10 +21,10 @@
         </el-table-column>
         <el-table-column v-if="showOperate" label="操作" width="160" align="center">
           <template slot-scope="scope">
-            <el-button v-if="hasPerm('/area/update')" type="text" size="small" @click="edit(scope.row)">
+            <el-button v-if="hasPerm('/sys/area/update')" type="text" size="small" @click="edit(scope.row)">
               修改
             </el-button>
-            <el-button v-if="hasPerm('/area/delete')" type="text" size="small" @click="del(scope.row)">
+            <el-button v-if="hasPerm('/sys/area/delete')" type="text" size="small" @click="del(scope.row)">
               删除
             </el-button>
           </template>
@@ -167,30 +167,5 @@
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
-  $tableTitleHeight:46px;
-  .table{
-    margin-bottom: 20px;
-  }
-  .pagination-container{
-    margin-bottom: 50px;
-  }
-  .table-title{
-    background-color:rgba(243, 243, 243, 1);
-    height: $tableTitleHeight;
-    .title-header{
-      line-height:$tableTitleHeight;
-      color: #606266;
-      font-size: 15px;
-      i{
-        margin-left: 5px;
-        margin-right: 5px;
-      }
-    }
-  }
-  .edit_btns{
-    .edit_btn{
-      float:right;
-      margin:7px 3px;//为了需要居中显示margin-top和bottom要用$tableTitleHeight减去按钮原高度除以2
-    }
-  }
+
 </style>

diff --git a/src/components/DownloadTemplate/index.vue b/src/components/DownloadTemplate/index.vue
index 228bf65..4e0d8a7 100644
--- a/src/components/DownloadTemplate/index.vue
+++ b/src/components/DownloadTemplate/index.vue
@@ -49,8 +49,4 @@
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
-  .edit_btn{
-    float:right;
-    margin:7px 3px;//为了需要居中显示margin-top和bottom要用$tableTitleHeight减去按钮原高度除以2
-  }
 </style>
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 918c857..c3d9a5c 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -159,3 +159,14 @@
 .el-table td{
   padding: 4px 0px !important;
 }
+
+.upload-btn{
+  display: inline-block;
+}
+.el-button + .upload-btn {
+  margin-left: 3px;
+}
+.upload-btn+ .el-button {
+  margin-left: 3px;
+}
+
diff --git a/src/views/dataManage/deviceData/listGasData.vue b/src/views/dataManage/deviceData/listGasData.vue
index 2a0b33e..e24a94b 100644
--- a/src/views/dataManage/deviceData/listGasData.vue
+++ b/src/views/dataManage/deviceData/listGasData.vue
@@ -21,31 +21,30 @@
       </search-item>
     </search-area>
     <!--查询结果Table显示-->
-    <div>
-      <normal-table
-        ref="normalTable"
-        :data="list"
-        :total="total"
-        :query="listQuery"
-        :list-loading="listLoading"
-        :options="options"
-        size="small"
-      >
-        <template slot="btns">
-          <el-button v-if="hasPerm('/gasdata/export')" size="small" @click="batchExport">
-            导出记录
-          </el-button>
-        </template>
-        <template slot="columns">
-          <el-table-column v-for="column in columns" :key="column.value" :label="column.text" :width="column.width" :align="column.align" show-overflow-tooltip>
-            <template slot-scope="scope">
-              <span v-if="column.checkCell" :class="checkCell(scope.row.cell)">{{ scope.row[column.value] }}</span>
-              <span v-else>{{ scope.row[column.value] }}</span>
-            </template>
-          </el-table-column>
-        </template>
-      </normal-table>
-    </div>
+    <normal-table
+      ref="normalTable"
+      :data="list"
+      :total="total"
+      :query="listQuery"
+      :list-loading="listLoading"
+      :options="options"
+      size="small"
+      @change="changePage"
+    >
+      <template slot="btns">
+        <el-button v-if="hasPerm('/gasdata/export')" size="small" @click="batchExport">
+          导出记录
+        </el-button>
+      </template>
+      <template slot="columns">
+        <el-table-column v-for="column in columns" :key="column.value" :label="column.text" :width="column.width" :align="column.align" show-overflow-tooltip>
+          <template slot-scope="scope">
+            <span v-if="column.checkCell" :class="checkCell(scope.row.cell)">{{ scope.row[column.value] }}</span>
+            <span v-else>{{ scope.row[column.value] }}</span>
+          </template>
+        </el-table-column>
+      </template>
+    </normal-table>
   </app-container>
 </template>
 
@@ -136,7 +135,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -146,7 +145,7 @@
       })
       batchExportGasData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
-        let fileName = `${this.name}数据_${this.listQuery.beginTime}_${this.listQuery.endTime}.xlsx`
+        let fileName = `${this.name}数据-${this.listQuery.beginTime}-${this.listQuery.endTime}.xlsx`
         fileName = fileName.replace(/-|:| /g, '')
         const blob = new Blob([res.data])
         exportFile(blob, fileName)
@@ -202,36 +201,7 @@
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
-  .app-container{
-    padding: 10px;
-  }
-  $tableTitleHeight:46px;
-  .table{
-    margin-bottom: 20px;
-  }
-  .pagination-container{
-    margin-bottom: 50px;
-  }
-  .table-title{
-    background-color:rgba(243, 243, 243, 1);
-    height: $tableTitleHeight;
-    .title-header{
-      line-height:$tableTitleHeight;
-      color: #606266;
-      font-size: 15px;
-      i{
-        margin-left: 5px;
-        margin-right: 5px;
-      }
-    }
-  }
-  .edit_btns{
-    .edit_btn{
-      float:right;
-      margin:7px 3px;//为了需要居中显示margin-top和bottom要用$tableTitleHeight减去按钮原高度除以2
-    }
-  }
-  .warning-state{
-    color:red
-  }
+.warning-state{
+  color:red
+}
 </style>
diff --git a/src/views/dataManage/deviceData/listWellCoverData.vue b/src/views/dataManage/deviceData/listWellCoverData.vue
index 4b199c4..3d349df 100644
--- a/src/views/dataManage/deviceData/listWellCoverData.vue
+++ b/src/views/dataManage/deviceData/listWellCoverData.vue
@@ -5,11 +5,12 @@
       <search-item>
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
-      <search-item size="small">
+      <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,43 +27,30 @@
       </search-item>
     </search-area>
     <!--查询结果Table显示-->
-    <div>
-      <el-row class="table-title">
-        <el-col :span="6">
-          <div class="title-header">
-            <i class="el-icon-menu" />数据列表
-          </div>
-        </el-col>
-        <el-col :span="12" :offset="6" class="edit_btns">
-          <el-button v-if="hasPerm('/welldata/export')" class="edit_btn" size="small" @click="batchExport">
-            导出记录
-          </el-button>
-        </el-col>
-      </el-row>
-      <el-table v-loading="listLoading" :data="list" class="table" border @selection-change="handleSelectionChange">
-        <el-table-column :index="indexMethod" align="center" type="index" />
+    <normal-table
+      ref="normalTable"
+      :data="list"
+      :total="total"
+      :query="listQuery"
+      :list-loading="listLoading"
+      :options="options"
+      size="small"
+      @change="changePage"
+    >
+      <template slot="btns">
+        <el-button v-if="hasPerm('/welldata/export')" size="small" @click="batchExport">
+          导出记录
+        </el-button>
+      </template>
+      <template slot="columns">
         <el-table-column v-for="column in columns" :key="column.value" :label="column.text" :width="column.width" :align="column.align" show-overflow-tooltip>
-          <template v-slot="scope">
-            <span v-if="column.checkState" :class="checkState(scope.row)">{{ scope.row[column.value] }}</span>
+          <template slot-scope="scope">
+            <span v-if="column.checkCell" :class="checkCell(scope.row.cell)">{{ scope.row[column.value] }}</span>
             <span v-else>{{ scope.row[column.value] }}</span>
           </template>
         </el-table-column>
-      </el-table>
-    </div>
-    <!--分页-->
-    <div class="pagination-container">
-      <el-pagination
-        v-show="total>9"
-        :current-page="listQuery.offset"
-        :page-sizes="[20,30,50]"
-        :page-size="listQuery.limit"
-        :total="total"
-        align="center"
-        layout="total, sizes, prev, pager, next"
-        @size-change="handleSizeChange"
-        @current-change="handleCurrentChange"
-      />
-    </div>
+      </template>
+    </normal-table>
   </app-container>
 </template>
 
@@ -71,6 +59,7 @@
 import DeptSelect from '../../../components/DeptSelect/index'
 import { parseUrl } from '@/utils/parseutils'
 import { getSearchLastWeekTime } from '@/utils/dateutils'
+import { exportFile } from '@/utils/exportutils'
 
 export default {
   name: 'ListWellCoverData',
@@ -82,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -132,24 +121,15 @@
           align: 'center'
         }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
       list: [], // 列表数据
       total: 0, // 数据总数
-      deviceTypeList: [], // 井盖类型列表
-      deptProps: {
-        parent: 'pid',
-        value: 'id',
-        label: 'name',
-        children: 'children'
-      }, // 权属单位树形下拉菜单
-      deptTreeList: null, // 组织树列表数据
-      showDeptTree: 0, // 是否显示权属单位下拉
-      showDeviceType: true, // 是否显示设备类型下拉
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      editShow: false, // 是否显示编辑框
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -177,6 +157,7 @@
   methods: {
     // 批量导出
     batchExport() {
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -186,16 +167,10 @@
       })
       batchExportWellData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
-        console.log('download===', res)
+        let fileName = `${this.name}数据-${this.listQuery.beginTime}-${this.listQuery.endTime}.xlsx`
+        fileName = fileName.replace(/-|:| /g, '')
         const blob = new Blob([res.data])
-        const downloadElement = document.createElement('a')
-        const href = window.URL.createObjectURL(blob) // 创建下载的链接
-        downloadElement.href = href
-        downloadElement.download = `井盖状态监测仪数据.xlsx` // 下载后文件名
-        document.body.appendChild(downloadElement)
-        downloadElement.click() // 点击下载
-        document.body.removeChild(downloadElement) // 下载完成移除元素
-        window.URL.revokeObjectURL(href) // 释放blob对象
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
       })
@@ -210,6 +185,15 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
+      getWellData(this.listQuery).then(response => {
+        this.list = response.data.rows
+        this.total = response.data.total
+        this.listLoading = false
+      })
+    },
+    // 处理时间
+    handleDateTime() {
       if (this.timeRange && this.timeRange.length > 0) {
         this.listQuery.beginTime = this.timeRange[0]
         this.listQuery.endTime = this.timeRange[1]
@@ -217,69 +201,28 @@
         this.listQuery.beginTime = ''
         this.listQuery.endTime = ''
       }
-      getWellData(this.listQuery).then(response => {
-        this.list = response.data.rows
-        this.total = response.data.total
-        this.listLoading = false
-      })
     },
     checkState(row) {
       if (row.status !== '0') {
         return 'warning-state'
       }
     },
-    indexMethod(index) {
-      return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
-    },
-    // 改变页容量
-    handleSizeChange(val) {
-      this.listQuery.limit = val
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
       this.fetchData()
-    },
-    // 改变当前页
-    handleCurrentChange(val) {
-      this.listQuery.offset = val
-      this.fetchData()
-    },
-    // 多选触发方法
-    handleSelectionChange(val) {
-      this.multipleSelection = val
     }
   }
 }
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
-  .app-container{
-    padding: 10px;
-  }
-  $tableTitleHeight:46px;
-  .table{
-    margin-bottom: 20px;
-  }
-  .pagination-container{
-    margin-bottom: 50px;
-  }
-  .table-title{
-    background-color:rgba(243, 243, 243, 1);
-    height: $tableTitleHeight;
-    .title-header{
-      line-height:$tableTitleHeight;
-      color: #606266;
-      font-size: 15px;
-      i{
-        margin-left: 5px;
-        margin-right: 5px;
-      }
-    }
-  }
-  .edit_btns{
-    .edit_btn{
-      float:right;
-      margin:7px 3px;//为了需要居中显示margin-top和bottom要用$tableTitleHeight减去按钮原高度除以2
-    }
-  }
-  .warning-state{
-    color:red
-  }
+.warning-state{
+  color:red
+}
 </style>
diff --git a/src/views/system/area/listArea.vue b/src/views/system/area/listArea.vue
index f93cd14..2b75380 100644
--- a/src/views/system/area/listArea.vue
+++ b/src/views/system/area/listArea.vue
@@ -9,7 +9,7 @@
     <!--查询结果Table显示-->
     <normal-table :data="list" :total="total" :query="listQuery" :list-loading="listLoading" @change="changePage">
       <template slot="btns">
-        <el-button v-if="hasPerm('/area/add')" size="small" class="filter-item" icon="el-icon-plus" @click="add">
+        <el-button v-if="hasPerm('/sys/area/add')" size="small" class="filter-item" icon="el-icon-plus" @click="add">
           新增
         </el-button>
       </template>
@@ -21,10 +21,10 @@
         </el-table-column>
         <el-table-column v-if="showOperate" label="操作" width="160" align="center">
           <template slot-scope="scope">
-            <el-button v-if="hasPerm('/area/update')" type="text" size="small" @click="edit(scope.row)">
+            <el-button v-if="hasPerm('/sys/area/update')" type="text" size="small" @click="edit(scope.row)">
               修改
             </el-button>
-            <el-button v-if="hasPerm('/area/delete')" type="text" size="small" @click="del(scope.row)">
+            <el-button v-if="hasPerm('/sys/area/delete')" type="text" size="small" @click="del(scope.row)">
               删除
             </el-button>
           </template>
@@ -167,30 +167,5 @@
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
-  $tableTitleHeight:46px;
-  .table{
-    margin-bottom: 20px;
-  }
-  .pagination-container{
-    margin-bottom: 50px;
-  }
-  .table-title{
-    background-color:rgba(243, 243, 243, 1);
-    height: $tableTitleHeight;
-    .title-header{
-      line-height:$tableTitleHeight;
-      color: #606266;
-      font-size: 15px;
-      i{
-        margin-left: 5px;
-        margin-right: 5px;
-      }
-    }
-  }
-  .edit_btns{
-    .edit_btn{
-      float:right;
-      margin:7px 3px;//为了需要居中显示margin-top和bottom要用$tableTitleHeight减去按钮原高度除以2
-    }
-  }
+
 </style>
diff --git a/src/views/wellManage/listWell.vue b/src/views/wellManage/listWell.vue
index 2392699..9c9e892 100644
--- a/src/views/wellManage/listWell.vue
+++ b/src/views/wellManage/listWell.vue
@@ -19,53 +19,53 @@
       </search-item>
     </search-area>
     <!--查询结果Table显示-->
-    <div>
-      <el-row class="table-title">
-        <el-col :span="6">
-          <div class="title-header">
-            <i class="el-icon-menu" />数据列表
-          </div>
-        </el-col>
-        <el-col :span="18" class="edit_btns">
-          <el-button v-if="hasPerm('/well/batchExport')" :disabled="total===0" class="edit_btn" size="small" @click="batchExport">
+    <normal-table
+      ref="normalTable"
+      :data="list"
+      :total="total"
+      :query="listQuery"
+      :list-loading="listLoading"
+      :options="options"
+      size="small"
+      @change="changePage"
+      @selection-change="handleSelectionChange"
+    >
+      <template slot="btns">
+        <el-button v-if="hasPerm('/well/add')" size="small" @click="add">
+          新增
+        </el-button>
+        <el-button v-if="hasPerm('/well/delete')" size="small" @click="del">
+          删除
+        </el-button>
+        <el-button v-if="hasPerm('/well/batchBfcf')" size="small" @click="batchBf">
+          一键布防
+        </el-button>
+        <el-button v-if="hasPerm('/well/batchBfcf')" size="small" @click="batchCf">
+          一键撤防
+        </el-button>
+        <download-template v-if="hasPerm('/well/batchImport')" :filename="filename" />
+        <el-upload
+          v-if="hasPerm('/well/batchImport')"
+          :limit="1"
+          :show-file-list="false"
+          :http-request="uploadFile"
+          :file-list="fileList"
+          action="string"
+          accept=".xls,.xlsx"
+          class="upload-btn"
+        >
+          <el-button slot="trigger" size="small">
+            批量导入
+          </el-button>
+          <el-button v-if="hasPerm('/well/batchExport')" :disabled="total===0" size="small" @click="batchExport">
             导出记录
           </el-button>
-          <!--<el-button v-if="hasPerm('/template/download')" class="edit_btn" size="small" @click="downloadTemplate">批量导入模板下载</el-button>-->
-          <download-template v-if="hasPerm('/well/batchImport')" :filename="filename" />
-          <el-upload
-            v-if="hasPerm('/well/batchImport')"
-            :limit="1"
-            :show-file-list="false"
-            :http-request="uploadFile"
-            :file-list="fileList"
-            action="string"
-            accept=".xls,.xlsx"
-            class="edit_btn"
-          >
-            <el-button slot="trigger" size="small">
-              批量导入
-            </el-button>
-          </el-upload>
-          <el-button v-if="hasPerm('/well/batchBfcf')" class="edit_btn" size="small" @click="batchBf">
-            一键布防
-          </el-button>
-          <el-button v-if="hasPerm('/well/batchBfcf')" class="edit_btn" size="small" @click="batchCf">
-            一键撤防
-          </el-button>
-          <el-button v-if="hasPerm('/well/delete')" class="edit_btn" size="small" @click="del">
-            删除
-          </el-button>
-          <el-button v-if="hasPerm('/well/add')" class="edit_btn" size="small" @click="add">
-            新增
-          </el-button>
-        </el-col>
-      </el-row>
-      <el-table v-loading="listLoading" :data="list" class="table" size="small" border @selection-change="handleSelectionChange">
-        <el-table-column align="center" type="selection" width="55" />
-        <el-table-column :index="indexMethod" align="center" type="index" />
+        </el-upload>
+      </template>
+      <template slot="columns">
         <el-table-column v-for="column in columns" :key="column.value" :label="column.text" :width="column.width" :align="column.align" show-overflow-tooltip>
           <template slot-scope="scope">
-            <el-button v-if="column.type=='Button' && scope.row.deviceCount>0" type="text" @click="goDeviceList(scope.row)">
+            <el-button v-if="column.type=='Button' && scope.row.deviceCount>0" type="text" size="mini" @click="goDeviceList(scope.row)">
               {{ scope.row[column.value] }}
             </el-button>
             <span v-else :class="column.class">{{ scope.row[column.value] }}</span>
@@ -91,24 +91,11 @@
             </el-button>
           </template>
         </el-table-column>
-      </el-table>
-    </div>
-    <!--分页-->
-    <div class="pagination-container">
-      <el-pagination
-        v-show="total>listQuery.limit"
-        :current-page="listQuery.offset"
-        :page-sizes="[20,30,50]"
-        :page-size="listQuery.limit"
-        :total="total"
-        align="center"
-        layout="total, sizes, prev, pager, next"
-        @size-change="handleSizeChange"
-        @current-change="handleCurrentChange"
-      />
-    </div>
-
+      </template>
+    </normal-table>
+    <!--编辑井组件-->
     <edit-well ref="editwell" @watchChild="fetchData" />
+    <!--井详情组件-->
     <detail-well ref="detailwell" />
   </app-container>
 </template>
@@ -135,60 +122,20 @@
         order: 'asc'
       }, // 筛选条件
       columns: [
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '点位名称',
-          value: 'wellName',
-          align: 'center'
-        },
-        {
-          text: '井深(m)',
-          value: 'deep',
-          align: 'center'
-        },
-        {
-          text: '详细地址',
-          value: 'position',
-          align: 'center'
-        },
-        {
-          text: '点位类型',
-          value: 'wellTypeName',
-          align: 'center'
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '设备数量',
-          value: 'deviceCount',
-          align: 'center',
-          type: 'Button'
-        },
-        {
-          text: '布防状态',
-          value: 'bfztName',
-          align: 'center'
-        }
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '点位名称', value: 'wellName', align: 'center' },
+        { text: '井深(m)', value: 'deep', align: 'center' },
+        { text: '详细地址', value: 'position', align: 'center' },
+        { text: '点位类型', value: 'wellTypeName', align: 'center' },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '设备数量', value: 'deviceCount', align: 'center', type: 'Button' },
+        { text: '布防状态', value: 'bfztName', align: 'center' }
       ], // 显示列
       multipleSelection: [], // 多选选中项
       list: [], // 列表数据
       total: 0, // 数据总数
       showWellType: true, // 是否显示点位类型下拉
-      wellTypeList: null, // 点位类型列表
-      deptProps: {
-        parent: 'pid',
-        value: 'id',
-        label: 'name',
-        children: 'children'
-      }, // 权属单位树形下拉菜单
-      deptTreeList: null, // 组织树列表数据
+      wellTypeList: [], // 点位类型列表
       deptShowTop: false, // 权属单位下拉是否显示顶级
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
@@ -217,7 +164,6 @@
   methods: {
     // 打开详情对话框
     detail(row) {
-      console.log(row, '============++++')
       this.detailShow = true
       this.$refs.detailwell.initDialog(true, row)
     },
@@ -234,7 +180,6 @@
     },
     // 编辑井信息
     edit(row) {
-      console.log(row, '===row====')
       this.dialogFormVisible = true
       this.editShow = true
       this.$refs.editwell.initDialog(this.dialogFormVisible, row)
@@ -468,23 +413,18 @@
     goDeviceList(row) {
       this.$router.push({ name: 'DeviceList', query: { wellCode: row.wellCode }})
     },
+    // 去报警记录页
     goAlarmRecords(row) {
       this.$router.push({ name: 'AlarmRecords', query: { wellCode: row.wellCode }})
     },
-    handleSuccess() {
-      console.log('handleSuccess')
-    },
-    indexMethod(index) {
-      return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
-    },
-    // 改变页容量
-    handleSizeChange(val) {
-      this.listQuery.limit = val
-      this.fetchData()
-    },
-    // 改变当前页
-    handleCurrentChange(val) {
-      this.listQuery.offset = val
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
       this.fetchData()
     },
     // 多选触发方法
@@ -496,30 +436,5 @@
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
-  $tableTitleHeight:46px;
-  .table{
-    margin-bottom: 20px;
-  }
-  .pagination-container{
-    margin-bottom: 50px;
-  }
-  .table-title{
-    background-color:rgba(243, 243, 243, 1);
-    height: $tableTitleHeight;
-    .title-header{
-      line-height:$tableTitleHeight;
-      color: #606266;
-      font-size: 15px;
-      i{
-        margin-left: 5px;
-        margin-right: 5px;
-      }
-    }
-  }
-  .edit_btns{
-    .edit_btn{
-      float:right;
-      margin:7px 3px;//为了需要居中显示margin-top和bottom要用$tableTitleHeight减去按钮原高度除以2
-    }
-  }
+
 </style>