diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index b9e5ee6..09fb191 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-card :body-style="{ padding: '0px' }" shadow="always">
-    <div class="card-panel" >
+  <el-card :body-style="{ padding: '0px' }" :shadow="shadow">
+    <div class="card-panel">
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
@@ -24,27 +24,31 @@
     title: {
       type: String,
       default: '标题'
-    },
+    }, // 标题
     flags: {
       type: String,
       default: '单位'
-    },
+    }, // 单位
     subtitle: {
       type: String,
       default: ''
-    },
+    }, // 小标题
     icon: {
       type: String,
       default: ''
-    },
+    }, // 图标
     context: {
       type: [String, Number],
       default: ''
-    },
+    }, // 内容
     color: {
       type: String,
       default: '#40c9c6'
-    }
+    }, // 图标颜色
+    shadow: {
+      type: String,
+      default: 'always'
+    } // 卡片阴影
   },
   computed: {
     backgroundColor() {

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index b9e5ee6..09fb191 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-card :body-style="{ padding: '0px' }" shadow="always">
-    <div class="card-panel" >
+  <el-card :body-style="{ padding: '0px' }" :shadow="shadow">
+    <div class="card-panel">
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
@@ -24,27 +24,31 @@
     title: {
       type: String,
       default: '标题'
-    },
+    }, // 标题
     flags: {
       type: String,
       default: '单位'
-    },
+    }, // 单位
     subtitle: {
       type: String,
       default: ''
-    },
+    }, // 小标题
     icon: {
       type: String,
       default: ''
-    },
+    }, // 图标
     context: {
       type: [String, Number],
       default: ''
-    },
+    }, // 内容
     color: {
       type: String,
       default: '#40c9c6'
-    }
+    }, // 图标颜色
+    shadow: {
+      type: String,
+      default: 'always'
+    } // 卡片阴影
   },
   computed: {
     backgroundColor() {
diff --git a/src/components/BigData/Card/panelCard.vue b/src/components/BigData/Card/panelCard.vue
new file mode 100644
index 0000000..d6a7b89
--- /dev/null
+++ b/src/components/BigData/Card/panelCard.vue
@@ -0,0 +1,51 @@
+<template>
+  <div class="panel-container">
+    <div class="panel-title">
+      {{ title }}
+      <div class="title-right">
+        <slot name="func" />
+      </div>
+    </div>
+    <div class="panel-body">
+      <slot />
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'PanelCard',
+  props: {
+    // 标题
+    title: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.panel-container{
+  width: 100%;
+  padding: 10px;
+  border: 1px solid #EBEEF5 ;
+  .panel-title{
+    width: 100%;
+    line-height: 2;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0px 10px;
+    border-left: 5px solid #66b1ff;
+    position: relative;
+    .title-right{
+      display: inline-block;
+      position: absolute;
+      right: 10px;
+    }
+  }
+  .panel-body{
+    padding: 5px 0px;
+    height:auto;
+  }
+}
+</style>

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index b9e5ee6..09fb191 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-card :body-style="{ padding: '0px' }" shadow="always">
-    <div class="card-panel" >
+  <el-card :body-style="{ padding: '0px' }" :shadow="shadow">
+    <div class="card-panel">
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
@@ -24,27 +24,31 @@
     title: {
       type: String,
       default: '标题'
-    },
+    }, // 标题
     flags: {
       type: String,
       default: '单位'
-    },
+    }, // 单位
     subtitle: {
       type: String,
       default: ''
-    },
+    }, // 小标题
     icon: {
       type: String,
       default: ''
-    },
+    }, // 图标
     context: {
       type: [String, Number],
       default: ''
-    },
+    }, // 内容
     color: {
       type: String,
       default: '#40c9c6'
-    }
+    }, // 图标颜色
+    shadow: {
+      type: String,
+      default: 'always'
+    } // 卡片阴影
   },
   computed: {
     backgroundColor() {
diff --git a/src/components/BigData/Card/panelCard.vue b/src/components/BigData/Card/panelCard.vue
new file mode 100644
index 0000000..d6a7b89
--- /dev/null
+++ b/src/components/BigData/Card/panelCard.vue
@@ -0,0 +1,51 @@
+<template>
+  <div class="panel-container">
+    <div class="panel-title">
+      {{ title }}
+      <div class="title-right">
+        <slot name="func" />
+      </div>
+    </div>
+    <div class="panel-body">
+      <slot />
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'PanelCard',
+  props: {
+    // 标题
+    title: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.panel-container{
+  width: 100%;
+  padding: 10px;
+  border: 1px solid #EBEEF5 ;
+  .panel-title{
+    width: 100%;
+    line-height: 2;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0px 10px;
+    border-left: 5px solid #66b1ff;
+    position: relative;
+    .title-right{
+      display: inline-block;
+      position: absolute;
+      right: 10px;
+    }
+  }
+  .panel-body{
+    padding: 5px 0px;
+    height:auto;
+  }
+}
+</style>
diff --git a/src/icons/svg/icon-database.svg b/src/icons/svg/icon-database.svg
new file mode 100644
index 0000000..d3dd1c8
--- /dev/null
+++ b/src/icons/svg/icon-database.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1658711872102" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1435" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M960 123.7C872.7 49.9 704.8 0 512 0S151.3 49.9 64 123.7C23.2 158.2 0 197.8 0 240V605.9c0 0.7 0 1.4 0.1 2H0v176c0 132.5 229.2 240 512 240s512-107.5 512-240V608h-0.1c0.1-1.8 0.1-3.5 0.1-5.3V240c0-42.2-23.2-81.8-64-116.3zM64 356.3C151.3 430.1 319.2 480 512 480s360.7-49.9 448-123.7v79.2c-17.9 11.5-37.5 22.2-58.8 32.2C796.2 516.9 658 544 512 544s-284.2-27.1-389.2-76.4c-21.3-10-40.9-20.7-58.8-32.2v-79.1z m0 181.3c87.3 73.8 255.2 123.7 448 123.7s360.7-49.9 448-123.7v79.2c-17.9 11.4-37.5 22.2-58.8 32.2-105 49.2-243.3 76.3-389.2 76.3S227.8 698.2 122.8 649c-21.3-10-40.9-20.7-58.8-32.2v-79.2z m837.2 292.7c-105 49.2-243.3 76.3-389.2 76.3s-284.2-27.1-389.2-76.3c-20.3-9.5-39.1-19.8-56.4-30.6-1.6-5.3-2.4-10.5-2.4-15.7v-65c87.3 73.8 255.2 123.7 448 123.7s360.7-50 448-123.7v65c0 5.1-0.8 10.4-2.4 15.7-17.3 10.9-36.1 21.1-56.4 30.6z" p-id="1436"></path></svg>
\ No newline at end of file

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index b9e5ee6..09fb191 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-card :body-style="{ padding: '0px' }" shadow="always">
-    <div class="card-panel" >
+  <el-card :body-style="{ padding: '0px' }" :shadow="shadow">
+    <div class="card-panel">
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
@@ -24,27 +24,31 @@
     title: {
       type: String,
       default: '标题'
-    },
+    }, // 标题
     flags: {
       type: String,
       default: '单位'
-    },
+    }, // 单位
     subtitle: {
       type: String,
       default: ''
-    },
+    }, // 小标题
     icon: {
       type: String,
       default: ''
-    },
+    }, // 图标
     context: {
       type: [String, Number],
       default: ''
-    },
+    }, // 内容
     color: {
       type: String,
       default: '#40c9c6'
-    }
+    }, // 图标颜色
+    shadow: {
+      type: String,
+      default: 'always'
+    } // 卡片阴影
   },
   computed: {
     backgroundColor() {
diff --git a/src/components/BigData/Card/panelCard.vue b/src/components/BigData/Card/panelCard.vue
new file mode 100644
index 0000000..d6a7b89
--- /dev/null
+++ b/src/components/BigData/Card/panelCard.vue
@@ -0,0 +1,51 @@
+<template>
+  <div class="panel-container">
+    <div class="panel-title">
+      {{ title }}
+      <div class="title-right">
+        <slot name="func" />
+      </div>
+    </div>
+    <div class="panel-body">
+      <slot />
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'PanelCard',
+  props: {
+    // 标题
+    title: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.panel-container{
+  width: 100%;
+  padding: 10px;
+  border: 1px solid #EBEEF5 ;
+  .panel-title{
+    width: 100%;
+    line-height: 2;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0px 10px;
+    border-left: 5px solid #66b1ff;
+    position: relative;
+    .title-right{
+      display: inline-block;
+      position: absolute;
+      right: 10px;
+    }
+  }
+  .panel-body{
+    padding: 5px 0px;
+    height:auto;
+  }
+}
+</style>
diff --git a/src/icons/svg/icon-database.svg b/src/icons/svg/icon-database.svg
new file mode 100644
index 0000000..d3dd1c8
--- /dev/null
+++ b/src/icons/svg/icon-database.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1658711872102" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1435" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M960 123.7C872.7 49.9 704.8 0 512 0S151.3 49.9 64 123.7C23.2 158.2 0 197.8 0 240V605.9c0 0.7 0 1.4 0.1 2H0v176c0 132.5 229.2 240 512 240s512-107.5 512-240V608h-0.1c0.1-1.8 0.1-3.5 0.1-5.3V240c0-42.2-23.2-81.8-64-116.3zM64 356.3C151.3 430.1 319.2 480 512 480s360.7-49.9 448-123.7v79.2c-17.9 11.5-37.5 22.2-58.8 32.2C796.2 516.9 658 544 512 544s-284.2-27.1-389.2-76.4c-21.3-10-40.9-20.7-58.8-32.2v-79.1z m0 181.3c87.3 73.8 255.2 123.7 448 123.7s360.7-49.9 448-123.7v79.2c-17.9 11.4-37.5 22.2-58.8 32.2-105 49.2-243.3 76.3-389.2 76.3S227.8 698.2 122.8 649c-21.3-10-40.9-20.7-58.8-32.2v-79.2z m837.2 292.7c-105 49.2-243.3 76.3-389.2 76.3s-284.2-27.1-389.2-76.3c-20.3-9.5-39.1-19.8-56.4-30.6-1.6-5.3-2.4-10.5-2.4-15.7v-65c87.3 73.8 255.2 123.7 448 123.7s360.7-50 448-123.7v65c0 5.1-0.8 10.4-2.4 15.7-17.3 10.9-36.1 21.1-56.4 30.6z" p-id="1436"></path></svg>
\ No newline at end of file
diff --git a/src/views/dataManage/dataManage.vue b/src/views/dataManage/dataManage.vue
index 71be03f..0564cdd 100644
--- a/src/views/dataManage/dataManage.vue
+++ b/src/views/dataManage/dataManage.vue
@@ -31,19 +31,19 @@
     return {
       activeName: 'wellcover',
       tabList: [
-        { permission: '/welldata/list', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
-        { permission: '/liquiddata/list', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
-        { permission: '/gasdata/list', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
-        { permission: '/digdata/list', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
-        { permission: '/noisedata/list', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
-        { permission: '/harmfuldata/list', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
-        { permission: '/tempdata/list', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
-        { permission: '/welllocadata/list', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
-        { permission: '/liquidGasData/list', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
-        { permission: '/tubedata/list', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
-        { permission: '/gasdector/listPage', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
-        { permission: '/pantilt/listPage', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
-        { permission: '/hydrantdata/list', label: '消防栓数据列表', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
+        { permission: '/welldata/list-page', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
+        { permission: '/liquiddata/list-page', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
+        { permission: '/gasdata/list-page', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
+        { permission: '/digdata/list-page', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
+        { permission: '/noisedata/list-page', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
+        { permission: '/harmfuldata/list-page', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
+        { permission: '/tempdata/list-page', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
+        { permission: '/welllocadata/list-page', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
+        { permission: '/liquidGasData/list-page', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
+        { permission: '/tubedata/list-page', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
+        { permission: '/gasdector/list-page', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
+        { permission: '/pantilt/list-page', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
+        { permission: '/hydrantdata/list-page', label: '消防栓防盗水监测仪', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
       ] // 所有tab列表
     }
   },

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index b9e5ee6..09fb191 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-card :body-style="{ padding: '0px' }" shadow="always">
-    <div class="card-panel" >
+  <el-card :body-style="{ padding: '0px' }" :shadow="shadow">
+    <div class="card-panel">
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
@@ -24,27 +24,31 @@
     title: {
       type: String,
       default: '标题'
-    },
+    }, // 标题
     flags: {
       type: String,
       default: '单位'
-    },
+    }, // 单位
     subtitle: {
       type: String,
       default: ''
-    },
+    }, // 小标题
     icon: {
       type: String,
       default: ''
-    },
+    }, // 图标
     context: {
       type: [String, Number],
       default: ''
-    },
+    }, // 内容
     color: {
       type: String,
       default: '#40c9c6'
-    }
+    }, // 图标颜色
+    shadow: {
+      type: String,
+      default: 'always'
+    } // 卡片阴影
   },
   computed: {
     backgroundColor() {
diff --git a/src/components/BigData/Card/panelCard.vue b/src/components/BigData/Card/panelCard.vue
new file mode 100644
index 0000000..d6a7b89
--- /dev/null
+++ b/src/components/BigData/Card/panelCard.vue
@@ -0,0 +1,51 @@
+<template>
+  <div class="panel-container">
+    <div class="panel-title">
+      {{ title }}
+      <div class="title-right">
+        <slot name="func" />
+      </div>
+    </div>
+    <div class="panel-body">
+      <slot />
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'PanelCard',
+  props: {
+    // 标题
+    title: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.panel-container{
+  width: 100%;
+  padding: 10px;
+  border: 1px solid #EBEEF5 ;
+  .panel-title{
+    width: 100%;
+    line-height: 2;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0px 10px;
+    border-left: 5px solid #66b1ff;
+    position: relative;
+    .title-right{
+      display: inline-block;
+      position: absolute;
+      right: 10px;
+    }
+  }
+  .panel-body{
+    padding: 5px 0px;
+    height:auto;
+  }
+}
+</style>
diff --git a/src/icons/svg/icon-database.svg b/src/icons/svg/icon-database.svg
new file mode 100644
index 0000000..d3dd1c8
--- /dev/null
+++ b/src/icons/svg/icon-database.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1658711872102" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1435" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M960 123.7C872.7 49.9 704.8 0 512 0S151.3 49.9 64 123.7C23.2 158.2 0 197.8 0 240V605.9c0 0.7 0 1.4 0.1 2H0v176c0 132.5 229.2 240 512 240s512-107.5 512-240V608h-0.1c0.1-1.8 0.1-3.5 0.1-5.3V240c0-42.2-23.2-81.8-64-116.3zM64 356.3C151.3 430.1 319.2 480 512 480s360.7-49.9 448-123.7v79.2c-17.9 11.5-37.5 22.2-58.8 32.2C796.2 516.9 658 544 512 544s-284.2-27.1-389.2-76.4c-21.3-10-40.9-20.7-58.8-32.2v-79.1z m0 181.3c87.3 73.8 255.2 123.7 448 123.7s360.7-49.9 448-123.7v79.2c-17.9 11.4-37.5 22.2-58.8 32.2-105 49.2-243.3 76.3-389.2 76.3S227.8 698.2 122.8 649c-21.3-10-40.9-20.7-58.8-32.2v-79.2z m837.2 292.7c-105 49.2-243.3 76.3-389.2 76.3s-284.2-27.1-389.2-76.3c-20.3-9.5-39.1-19.8-56.4-30.6-1.6-5.3-2.4-10.5-2.4-15.7v-65c87.3 73.8 255.2 123.7 448 123.7s360.7-50 448-123.7v65c0 5.1-0.8 10.4-2.4 15.7-17.3 10.9-36.1 21.1-56.4 30.6z" p-id="1436"></path></svg>
\ No newline at end of file
diff --git a/src/views/dataManage/dataManage.vue b/src/views/dataManage/dataManage.vue
index 71be03f..0564cdd 100644
--- a/src/views/dataManage/dataManage.vue
+++ b/src/views/dataManage/dataManage.vue
@@ -31,19 +31,19 @@
     return {
       activeName: 'wellcover',
       tabList: [
-        { permission: '/welldata/list', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
-        { permission: '/liquiddata/list', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
-        { permission: '/gasdata/list', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
-        { permission: '/digdata/list', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
-        { permission: '/noisedata/list', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
-        { permission: '/harmfuldata/list', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
-        { permission: '/tempdata/list', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
-        { permission: '/welllocadata/list', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
-        { permission: '/liquidGasData/list', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
-        { permission: '/tubedata/list', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
-        { permission: '/gasdector/listPage', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
-        { permission: '/pantilt/listPage', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
-        { permission: '/hydrantdata/list', label: '消防栓数据列表', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
+        { permission: '/welldata/list-page', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
+        { permission: '/liquiddata/list-page', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
+        { permission: '/gasdata/list-page', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
+        { permission: '/digdata/list-page', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
+        { permission: '/noisedata/list-page', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
+        { permission: '/harmfuldata/list-page', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
+        { permission: '/tempdata/list-page', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
+        { permission: '/welllocadata/list-page', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
+        { permission: '/liquidGasData/list-page', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
+        { permission: '/tubedata/list-page', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
+        { permission: '/gasdector/list-page', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
+        { permission: '/pantilt/list-page', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
+        { permission: '/hydrantdata/list-page', label: '消防栓防盗水监测仪', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
       ] // 所有tab列表
     }
   },
diff --git a/src/views/dataManage/deviceData/listDigData.vue b/src/views/dataManage/deviceData/listDigData.vue
index fa4bbc7..3cb74ad 100644
--- a/src/views/dataManage/deviceData/listDigData.vue
+++ b/src/views/dataManage/deviceData/listDigData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/digdata/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 align="center" type="selection" width="55"/>-->
-        <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('/digdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListDigData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -185,6 +116,8 @@
       if (params && params.deviceType === this.type && params.devcode) {
         this.listQuery.keywords = params.devcode
         this.fetchData()
+      } else {
+        this.fetchData()
       }
     }
   },
@@ -203,21 +136,16 @@
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
-        text: '数据处理中,请稍后...',
+        text: '下载中,请稍后...',
         spinner: 'el-icon-loading',
         background: 'rgba(0, 0, 0, 0.7)'
       })
       batchExportDigData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +160,50 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getDigData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         return 'warning-state'
       }
     },
-    indexMethod(index) {
-      return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
-    },
-    // 改变页容量
-    handleSizeChange(val) {
-      this.listQuery.limit = val
+    // checkState(row) {
+    //   if (row.status !== '0') {
+    //     return 'warning-state'
+    //   }
+    // },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    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
   }

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index b9e5ee6..09fb191 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-card :body-style="{ padding: '0px' }" shadow="always">
-    <div class="card-panel" >
+  <el-card :body-style="{ padding: '0px' }" :shadow="shadow">
+    <div class="card-panel">
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
@@ -24,27 +24,31 @@
     title: {
       type: String,
       default: '标题'
-    },
+    }, // 标题
     flags: {
       type: String,
       default: '单位'
-    },
+    }, // 单位
     subtitle: {
       type: String,
       default: ''
-    },
+    }, // 小标题
     icon: {
       type: String,
       default: ''
-    },
+    }, // 图标
     context: {
       type: [String, Number],
       default: ''
-    },
+    }, // 内容
     color: {
       type: String,
       default: '#40c9c6'
-    }
+    }, // 图标颜色
+    shadow: {
+      type: String,
+      default: 'always'
+    } // 卡片阴影
   },
   computed: {
     backgroundColor() {
diff --git a/src/components/BigData/Card/panelCard.vue b/src/components/BigData/Card/panelCard.vue
new file mode 100644
index 0000000..d6a7b89
--- /dev/null
+++ b/src/components/BigData/Card/panelCard.vue
@@ -0,0 +1,51 @@
+<template>
+  <div class="panel-container">
+    <div class="panel-title">
+      {{ title }}
+      <div class="title-right">
+        <slot name="func" />
+      </div>
+    </div>
+    <div class="panel-body">
+      <slot />
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'PanelCard',
+  props: {
+    // 标题
+    title: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.panel-container{
+  width: 100%;
+  padding: 10px;
+  border: 1px solid #EBEEF5 ;
+  .panel-title{
+    width: 100%;
+    line-height: 2;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0px 10px;
+    border-left: 5px solid #66b1ff;
+    position: relative;
+    .title-right{
+      display: inline-block;
+      position: absolute;
+      right: 10px;
+    }
+  }
+  .panel-body{
+    padding: 5px 0px;
+    height:auto;
+  }
+}
+</style>
diff --git a/src/icons/svg/icon-database.svg b/src/icons/svg/icon-database.svg
new file mode 100644
index 0000000..d3dd1c8
--- /dev/null
+++ b/src/icons/svg/icon-database.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1658711872102" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1435" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M960 123.7C872.7 49.9 704.8 0 512 0S151.3 49.9 64 123.7C23.2 158.2 0 197.8 0 240V605.9c0 0.7 0 1.4 0.1 2H0v176c0 132.5 229.2 240 512 240s512-107.5 512-240V608h-0.1c0.1-1.8 0.1-3.5 0.1-5.3V240c0-42.2-23.2-81.8-64-116.3zM64 356.3C151.3 430.1 319.2 480 512 480s360.7-49.9 448-123.7v79.2c-17.9 11.5-37.5 22.2-58.8 32.2C796.2 516.9 658 544 512 544s-284.2-27.1-389.2-76.4c-21.3-10-40.9-20.7-58.8-32.2v-79.1z m0 181.3c87.3 73.8 255.2 123.7 448 123.7s360.7-49.9 448-123.7v79.2c-17.9 11.4-37.5 22.2-58.8 32.2-105 49.2-243.3 76.3-389.2 76.3S227.8 698.2 122.8 649c-21.3-10-40.9-20.7-58.8-32.2v-79.2z m837.2 292.7c-105 49.2-243.3 76.3-389.2 76.3s-284.2-27.1-389.2-76.3c-20.3-9.5-39.1-19.8-56.4-30.6-1.6-5.3-2.4-10.5-2.4-15.7v-65c87.3 73.8 255.2 123.7 448 123.7s360.7-50 448-123.7v65c0 5.1-0.8 10.4-2.4 15.7-17.3 10.9-36.1 21.1-56.4 30.6z" p-id="1436"></path></svg>
\ No newline at end of file
diff --git a/src/views/dataManage/dataManage.vue b/src/views/dataManage/dataManage.vue
index 71be03f..0564cdd 100644
--- a/src/views/dataManage/dataManage.vue
+++ b/src/views/dataManage/dataManage.vue
@@ -31,19 +31,19 @@
     return {
       activeName: 'wellcover',
       tabList: [
-        { permission: '/welldata/list', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
-        { permission: '/liquiddata/list', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
-        { permission: '/gasdata/list', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
-        { permission: '/digdata/list', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
-        { permission: '/noisedata/list', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
-        { permission: '/harmfuldata/list', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
-        { permission: '/tempdata/list', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
-        { permission: '/welllocadata/list', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
-        { permission: '/liquidGasData/list', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
-        { permission: '/tubedata/list', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
-        { permission: '/gasdector/listPage', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
-        { permission: '/pantilt/listPage', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
-        { permission: '/hydrantdata/list', label: '消防栓数据列表', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
+        { permission: '/welldata/list-page', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
+        { permission: '/liquiddata/list-page', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
+        { permission: '/gasdata/list-page', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
+        { permission: '/digdata/list-page', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
+        { permission: '/noisedata/list-page', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
+        { permission: '/harmfuldata/list-page', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
+        { permission: '/tempdata/list-page', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
+        { permission: '/welllocadata/list-page', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
+        { permission: '/liquidGasData/list-page', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
+        { permission: '/tubedata/list-page', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
+        { permission: '/gasdector/list-page', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
+        { permission: '/pantilt/list-page', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
+        { permission: '/hydrantdata/list-page', label: '消防栓防盗水监测仪', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
       ] // 所有tab列表
     }
   },
diff --git a/src/views/dataManage/deviceData/listDigData.vue b/src/views/dataManage/deviceData/listDigData.vue
index fa4bbc7..3cb74ad 100644
--- a/src/views/dataManage/deviceData/listDigData.vue
+++ b/src/views/dataManage/deviceData/listDigData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/digdata/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 align="center" type="selection" width="55"/>-->
-        <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('/digdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListDigData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -185,6 +116,8 @@
       if (params && params.deviceType === this.type && params.devcode) {
         this.listQuery.keywords = params.devcode
         this.fetchData()
+      } else {
+        this.fetchData()
       }
     }
   },
@@ -203,21 +136,16 @@
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
-        text: '数据处理中,请稍后...',
+        text: '下载中,请稍后...',
         spinner: 'el-icon-loading',
         background: 'rgba(0, 0, 0, 0.7)'
       })
       batchExportDigData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +160,50 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getDigData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         return 'warning-state'
       }
     },
-    indexMethod(index) {
-      return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
-    },
-    // 改变页容量
-    handleSizeChange(val) {
-      this.listQuery.limit = val
+    // checkState(row) {
+    //   if (row.status !== '0') {
+    //     return 'warning-state'
+    //   }
+    // },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    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
   }
diff --git a/src/views/dataManage/deviceData/listGasdectorData.vue b/src/views/dataManage/deviceData/listGasdectorData.vue
index a78b8da..b4ecd07 100644
--- a/src/views/dataManage/deviceData/listGasdectorData.vue
+++ b/src/views/dataManage/deviceData/listGasdectorData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/gasdector/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('/liquidGasData/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index b9e5ee6..09fb191 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-card :body-style="{ padding: '0px' }" shadow="always">
-    <div class="card-panel" >
+  <el-card :body-style="{ padding: '0px' }" :shadow="shadow">
+    <div class="card-panel">
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
@@ -24,27 +24,31 @@
     title: {
       type: String,
       default: '标题'
-    },
+    }, // 标题
     flags: {
       type: String,
       default: '单位'
-    },
+    }, // 单位
     subtitle: {
       type: String,
       default: ''
-    },
+    }, // 小标题
     icon: {
       type: String,
       default: ''
-    },
+    }, // 图标
     context: {
       type: [String, Number],
       default: ''
-    },
+    }, // 内容
     color: {
       type: String,
       default: '#40c9c6'
-    }
+    }, // 图标颜色
+    shadow: {
+      type: String,
+      default: 'always'
+    } // 卡片阴影
   },
   computed: {
     backgroundColor() {
diff --git a/src/components/BigData/Card/panelCard.vue b/src/components/BigData/Card/panelCard.vue
new file mode 100644
index 0000000..d6a7b89
--- /dev/null
+++ b/src/components/BigData/Card/panelCard.vue
@@ -0,0 +1,51 @@
+<template>
+  <div class="panel-container">
+    <div class="panel-title">
+      {{ title }}
+      <div class="title-right">
+        <slot name="func" />
+      </div>
+    </div>
+    <div class="panel-body">
+      <slot />
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'PanelCard',
+  props: {
+    // 标题
+    title: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.panel-container{
+  width: 100%;
+  padding: 10px;
+  border: 1px solid #EBEEF5 ;
+  .panel-title{
+    width: 100%;
+    line-height: 2;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0px 10px;
+    border-left: 5px solid #66b1ff;
+    position: relative;
+    .title-right{
+      display: inline-block;
+      position: absolute;
+      right: 10px;
+    }
+  }
+  .panel-body{
+    padding: 5px 0px;
+    height:auto;
+  }
+}
+</style>
diff --git a/src/icons/svg/icon-database.svg b/src/icons/svg/icon-database.svg
new file mode 100644
index 0000000..d3dd1c8
--- /dev/null
+++ b/src/icons/svg/icon-database.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1658711872102" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1435" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M960 123.7C872.7 49.9 704.8 0 512 0S151.3 49.9 64 123.7C23.2 158.2 0 197.8 0 240V605.9c0 0.7 0 1.4 0.1 2H0v176c0 132.5 229.2 240 512 240s512-107.5 512-240V608h-0.1c0.1-1.8 0.1-3.5 0.1-5.3V240c0-42.2-23.2-81.8-64-116.3zM64 356.3C151.3 430.1 319.2 480 512 480s360.7-49.9 448-123.7v79.2c-17.9 11.5-37.5 22.2-58.8 32.2C796.2 516.9 658 544 512 544s-284.2-27.1-389.2-76.4c-21.3-10-40.9-20.7-58.8-32.2v-79.1z m0 181.3c87.3 73.8 255.2 123.7 448 123.7s360.7-49.9 448-123.7v79.2c-17.9 11.4-37.5 22.2-58.8 32.2-105 49.2-243.3 76.3-389.2 76.3S227.8 698.2 122.8 649c-21.3-10-40.9-20.7-58.8-32.2v-79.2z m837.2 292.7c-105 49.2-243.3 76.3-389.2 76.3s-284.2-27.1-389.2-76.3c-20.3-9.5-39.1-19.8-56.4-30.6-1.6-5.3-2.4-10.5-2.4-15.7v-65c87.3 73.8 255.2 123.7 448 123.7s360.7-50 448-123.7v65c0 5.1-0.8 10.4-2.4 15.7-17.3 10.9-36.1 21.1-56.4 30.6z" p-id="1436"></path></svg>
\ No newline at end of file
diff --git a/src/views/dataManage/dataManage.vue b/src/views/dataManage/dataManage.vue
index 71be03f..0564cdd 100644
--- a/src/views/dataManage/dataManage.vue
+++ b/src/views/dataManage/dataManage.vue
@@ -31,19 +31,19 @@
     return {
       activeName: 'wellcover',
       tabList: [
-        { permission: '/welldata/list', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
-        { permission: '/liquiddata/list', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
-        { permission: '/gasdata/list', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
-        { permission: '/digdata/list', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
-        { permission: '/noisedata/list', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
-        { permission: '/harmfuldata/list', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
-        { permission: '/tempdata/list', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
-        { permission: '/welllocadata/list', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
-        { permission: '/liquidGasData/list', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
-        { permission: '/tubedata/list', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
-        { permission: '/gasdector/listPage', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
-        { permission: '/pantilt/listPage', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
-        { permission: '/hydrantdata/list', label: '消防栓数据列表', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
+        { permission: '/welldata/list-page', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
+        { permission: '/liquiddata/list-page', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
+        { permission: '/gasdata/list-page', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
+        { permission: '/digdata/list-page', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
+        { permission: '/noisedata/list-page', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
+        { permission: '/harmfuldata/list-page', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
+        { permission: '/tempdata/list-page', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
+        { permission: '/welllocadata/list-page', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
+        { permission: '/liquidGasData/list-page', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
+        { permission: '/tubedata/list-page', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
+        { permission: '/gasdector/list-page', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
+        { permission: '/pantilt/list-page', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
+        { permission: '/hydrantdata/list-page', label: '消防栓防盗水监测仪', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
       ] // 所有tab列表
     }
   },
diff --git a/src/views/dataManage/deviceData/listDigData.vue b/src/views/dataManage/deviceData/listDigData.vue
index fa4bbc7..3cb74ad 100644
--- a/src/views/dataManage/deviceData/listDigData.vue
+++ b/src/views/dataManage/deviceData/listDigData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/digdata/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 align="center" type="selection" width="55"/>-->
-        <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('/digdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListDigData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -185,6 +116,8 @@
       if (params && params.deviceType === this.type && params.devcode) {
         this.listQuery.keywords = params.devcode
         this.fetchData()
+      } else {
+        this.fetchData()
       }
     }
   },
@@ -203,21 +136,16 @@
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
-        text: '数据处理中,请稍后...',
+        text: '下载中,请稍后...',
         spinner: 'el-icon-loading',
         background: 'rgba(0, 0, 0, 0.7)'
       })
       batchExportDigData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +160,50 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getDigData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         return 'warning-state'
       }
     },
-    indexMethod(index) {
-      return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
-    },
-    // 改变页容量
-    handleSizeChange(val) {
-      this.listQuery.limit = val
+    // checkState(row) {
+    //   if (row.status !== '0') {
+    //     return 'warning-state'
+    //   }
+    // },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    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
   }
diff --git a/src/views/dataManage/deviceData/listGasdectorData.vue b/src/views/dataManage/deviceData/listGasdectorData.vue
index a78b8da..b4ecd07 100644
--- a/src/views/dataManage/deviceData/listGasdectorData.vue
+++ b/src/views/dataManage/deviceData/listGasdectorData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/gasdector/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('/liquidGasData/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listHarmfulData.vue b/src/views/dataManage/deviceData/listHarmfulData.vue
index dde92b4..c29cb2e 100644
--- a/src/views/dataManage/deviceData/listHarmfulData.vue
+++ b/src/views/dataManage/deviceData/listHarmfulData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -27,44 +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('/harmfuldata/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 align="center" type="selection" width="55"/>-->
-        <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('/harmfuldata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,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: 'ListHarmfulData',
@@ -84,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,92 +88,32 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: 'CO浓度(ppm)',
-          value: 'CO',
-          align: 'center'
-        },
-        {
-          text: 'CH4浓度(%VOL)',
-          value: 'CH4',
-          align: 'center'
-        },
-        {
-          text: 'H2S浓度(ppm)',
-          value: 'H2S',
-          align: 'center'
-        },
-        {
-          text: 'O2浓度(ppm)',
-          value: 'O2',
-          align: 'center'
-        },
-        {
-          text: '液位开关',
-          value: 'switch',
-          align: 'center'
-        },
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: 'CO浓度(ppm)', value: 'CO', align: 'center' },
+        { text: 'CH4浓度(%VOL)', value: 'CH4', align: 'center' },
+        { text: 'H2S浓度(ppm)', value: 'H2S', align: 'center' },
+        { text: 'O2浓度(ppm)', value: 'O2', align: 'center' },
+        { text: '液位开关', value: 'switch', align: 'center' },
         // {
         //   text: '状态描述',
         //   value: 'descn',
         //   align: 'center'
         // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -221,15 +148,10 @@
       })
       batchExportHarmfulData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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 = `有害监测仪数s据.xlsx` // 下载后文件名
-        document.body.appendChild(downloadElement)
-        downloadElement.click() // 点击下载
-        document.body.removeChild(downloadElement) // 下载完成移除元素
-        window.URL.revokeObjectURL(href) // 释放blob对象
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
       })
@@ -244,69 +166,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getHarmfulData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index b9e5ee6..09fb191 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-card :body-style="{ padding: '0px' }" shadow="always">
-    <div class="card-panel" >
+  <el-card :body-style="{ padding: '0px' }" :shadow="shadow">
+    <div class="card-panel">
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
@@ -24,27 +24,31 @@
     title: {
       type: String,
       default: '标题'
-    },
+    }, // 标题
     flags: {
       type: String,
       default: '单位'
-    },
+    }, // 单位
     subtitle: {
       type: String,
       default: ''
-    },
+    }, // 小标题
     icon: {
       type: String,
       default: ''
-    },
+    }, // 图标
     context: {
       type: [String, Number],
       default: ''
-    },
+    }, // 内容
     color: {
       type: String,
       default: '#40c9c6'
-    }
+    }, // 图标颜色
+    shadow: {
+      type: String,
+      default: 'always'
+    } // 卡片阴影
   },
   computed: {
     backgroundColor() {
diff --git a/src/components/BigData/Card/panelCard.vue b/src/components/BigData/Card/panelCard.vue
new file mode 100644
index 0000000..d6a7b89
--- /dev/null
+++ b/src/components/BigData/Card/panelCard.vue
@@ -0,0 +1,51 @@
+<template>
+  <div class="panel-container">
+    <div class="panel-title">
+      {{ title }}
+      <div class="title-right">
+        <slot name="func" />
+      </div>
+    </div>
+    <div class="panel-body">
+      <slot />
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'PanelCard',
+  props: {
+    // 标题
+    title: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.panel-container{
+  width: 100%;
+  padding: 10px;
+  border: 1px solid #EBEEF5 ;
+  .panel-title{
+    width: 100%;
+    line-height: 2;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0px 10px;
+    border-left: 5px solid #66b1ff;
+    position: relative;
+    .title-right{
+      display: inline-block;
+      position: absolute;
+      right: 10px;
+    }
+  }
+  .panel-body{
+    padding: 5px 0px;
+    height:auto;
+  }
+}
+</style>
diff --git a/src/icons/svg/icon-database.svg b/src/icons/svg/icon-database.svg
new file mode 100644
index 0000000..d3dd1c8
--- /dev/null
+++ b/src/icons/svg/icon-database.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1658711872102" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1435" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M960 123.7C872.7 49.9 704.8 0 512 0S151.3 49.9 64 123.7C23.2 158.2 0 197.8 0 240V605.9c0 0.7 0 1.4 0.1 2H0v176c0 132.5 229.2 240 512 240s512-107.5 512-240V608h-0.1c0.1-1.8 0.1-3.5 0.1-5.3V240c0-42.2-23.2-81.8-64-116.3zM64 356.3C151.3 430.1 319.2 480 512 480s360.7-49.9 448-123.7v79.2c-17.9 11.5-37.5 22.2-58.8 32.2C796.2 516.9 658 544 512 544s-284.2-27.1-389.2-76.4c-21.3-10-40.9-20.7-58.8-32.2v-79.1z m0 181.3c87.3 73.8 255.2 123.7 448 123.7s360.7-49.9 448-123.7v79.2c-17.9 11.4-37.5 22.2-58.8 32.2-105 49.2-243.3 76.3-389.2 76.3S227.8 698.2 122.8 649c-21.3-10-40.9-20.7-58.8-32.2v-79.2z m837.2 292.7c-105 49.2-243.3 76.3-389.2 76.3s-284.2-27.1-389.2-76.3c-20.3-9.5-39.1-19.8-56.4-30.6-1.6-5.3-2.4-10.5-2.4-15.7v-65c87.3 73.8 255.2 123.7 448 123.7s360.7-50 448-123.7v65c0 5.1-0.8 10.4-2.4 15.7-17.3 10.9-36.1 21.1-56.4 30.6z" p-id="1436"></path></svg>
\ No newline at end of file
diff --git a/src/views/dataManage/dataManage.vue b/src/views/dataManage/dataManage.vue
index 71be03f..0564cdd 100644
--- a/src/views/dataManage/dataManage.vue
+++ b/src/views/dataManage/dataManage.vue
@@ -31,19 +31,19 @@
     return {
       activeName: 'wellcover',
       tabList: [
-        { permission: '/welldata/list', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
-        { permission: '/liquiddata/list', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
-        { permission: '/gasdata/list', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
-        { permission: '/digdata/list', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
-        { permission: '/noisedata/list', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
-        { permission: '/harmfuldata/list', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
-        { permission: '/tempdata/list', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
-        { permission: '/welllocadata/list', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
-        { permission: '/liquidGasData/list', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
-        { permission: '/tubedata/list', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
-        { permission: '/gasdector/listPage', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
-        { permission: '/pantilt/listPage', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
-        { permission: '/hydrantdata/list', label: '消防栓数据列表', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
+        { permission: '/welldata/list-page', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
+        { permission: '/liquiddata/list-page', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
+        { permission: '/gasdata/list-page', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
+        { permission: '/digdata/list-page', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
+        { permission: '/noisedata/list-page', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
+        { permission: '/harmfuldata/list-page', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
+        { permission: '/tempdata/list-page', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
+        { permission: '/welllocadata/list-page', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
+        { permission: '/liquidGasData/list-page', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
+        { permission: '/tubedata/list-page', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
+        { permission: '/gasdector/list-page', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
+        { permission: '/pantilt/list-page', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
+        { permission: '/hydrantdata/list-page', label: '消防栓防盗水监测仪', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
       ] // 所有tab列表
     }
   },
diff --git a/src/views/dataManage/deviceData/listDigData.vue b/src/views/dataManage/deviceData/listDigData.vue
index fa4bbc7..3cb74ad 100644
--- a/src/views/dataManage/deviceData/listDigData.vue
+++ b/src/views/dataManage/deviceData/listDigData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/digdata/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 align="center" type="selection" width="55"/>-->
-        <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('/digdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListDigData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -185,6 +116,8 @@
       if (params && params.deviceType === this.type && params.devcode) {
         this.listQuery.keywords = params.devcode
         this.fetchData()
+      } else {
+        this.fetchData()
       }
     }
   },
@@ -203,21 +136,16 @@
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
-        text: '数据处理中,请稍后...',
+        text: '下载中,请稍后...',
         spinner: 'el-icon-loading',
         background: 'rgba(0, 0, 0, 0.7)'
       })
       batchExportDigData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +160,50 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getDigData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         return 'warning-state'
       }
     },
-    indexMethod(index) {
-      return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
-    },
-    // 改变页容量
-    handleSizeChange(val) {
-      this.listQuery.limit = val
+    // checkState(row) {
+    //   if (row.status !== '0') {
+    //     return 'warning-state'
+    //   }
+    // },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    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
   }
diff --git a/src/views/dataManage/deviceData/listGasdectorData.vue b/src/views/dataManage/deviceData/listGasdectorData.vue
index a78b8da..b4ecd07 100644
--- a/src/views/dataManage/deviceData/listGasdectorData.vue
+++ b/src/views/dataManage/deviceData/listGasdectorData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/gasdector/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('/liquidGasData/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listHarmfulData.vue b/src/views/dataManage/deviceData/listHarmfulData.vue
index dde92b4..c29cb2e 100644
--- a/src/views/dataManage/deviceData/listHarmfulData.vue
+++ b/src/views/dataManage/deviceData/listHarmfulData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -27,44 +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('/harmfuldata/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 align="center" type="selection" width="55"/>-->
-        <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('/harmfuldata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,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: 'ListHarmfulData',
@@ -84,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,92 +88,32 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: 'CO浓度(ppm)',
-          value: 'CO',
-          align: 'center'
-        },
-        {
-          text: 'CH4浓度(%VOL)',
-          value: 'CH4',
-          align: 'center'
-        },
-        {
-          text: 'H2S浓度(ppm)',
-          value: 'H2S',
-          align: 'center'
-        },
-        {
-          text: 'O2浓度(ppm)',
-          value: 'O2',
-          align: 'center'
-        },
-        {
-          text: '液位开关',
-          value: 'switch',
-          align: 'center'
-        },
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: 'CO浓度(ppm)', value: 'CO', align: 'center' },
+        { text: 'CH4浓度(%VOL)', value: 'CH4', align: 'center' },
+        { text: 'H2S浓度(ppm)', value: 'H2S', align: 'center' },
+        { text: 'O2浓度(ppm)', value: 'O2', align: 'center' },
+        { text: '液位开关', value: 'switch', align: 'center' },
         // {
         //   text: '状态描述',
         //   value: 'descn',
         //   align: 'center'
         // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -221,15 +148,10 @@
       })
       batchExportHarmfulData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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 = `有害监测仪数s据.xlsx` // 下载后文件名
-        document.body.appendChild(downloadElement)
-        downloadElement.click() // 点击下载
-        document.body.removeChild(downloadElement) // 下载完成移除元素
-        window.URL.revokeObjectURL(href) // 释放blob对象
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
       })
@@ -244,69 +166,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getHarmfulData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listHydrantData.vue b/src/views/dataManage/deviceData/listHydrantData.vue
index 575345d..f968760 100644
--- a/src/views/dataManage/deviceData/listHydrantData.vue
+++ b/src/views/dataManage/deviceData/listHydrantData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -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('/hydrantdata/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('/hydrantdata/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>
 
@@ -59,15 +58,6 @@
 export default {
   name: 'ListHydrantData',
   components: { DeptSelect },
-  /* filters: {
-    dataFilter(val) {
-      if (val === '40%LEL' || val === '60%LEL') {
-        return '0%LEL'
-      } else {
-        return val
-      }
-    }
-  }, */
   props: {
     type: {
       type: String,
@@ -75,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -91,10 +81,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', width: 170, align: 'center' },
@@ -105,17 +91,16 @@
         { text: '状态描述', value: 'descn', align: 'center' },
         { text: '消防栓状态', value: 'status', align: 'center' },
         { text: '上传时间', value: 'logtime', align: 'center' }
-        // { text: '点位编号', value: 'wellCode', align: 'center' },
-        // { text: '燃气浓度(%LEL)', value: 'strength', align: 'center', filter: true },
-        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
-        // { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -141,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -163,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取消防栓配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -186,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -207,35 +192,6 @@
 </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
 }

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index b9e5ee6..09fb191 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-card :body-style="{ padding: '0px' }" shadow="always">
-    <div class="card-panel" >
+  <el-card :body-style="{ padding: '0px' }" :shadow="shadow">
+    <div class="card-panel">
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
@@ -24,27 +24,31 @@
     title: {
       type: String,
       default: '标题'
-    },
+    }, // 标题
     flags: {
       type: String,
       default: '单位'
-    },
+    }, // 单位
     subtitle: {
       type: String,
       default: ''
-    },
+    }, // 小标题
     icon: {
       type: String,
       default: ''
-    },
+    }, // 图标
     context: {
       type: [String, Number],
       default: ''
-    },
+    }, // 内容
     color: {
       type: String,
       default: '#40c9c6'
-    }
+    }, // 图标颜色
+    shadow: {
+      type: String,
+      default: 'always'
+    } // 卡片阴影
   },
   computed: {
     backgroundColor() {
diff --git a/src/components/BigData/Card/panelCard.vue b/src/components/BigData/Card/panelCard.vue
new file mode 100644
index 0000000..d6a7b89
--- /dev/null
+++ b/src/components/BigData/Card/panelCard.vue
@@ -0,0 +1,51 @@
+<template>
+  <div class="panel-container">
+    <div class="panel-title">
+      {{ title }}
+      <div class="title-right">
+        <slot name="func" />
+      </div>
+    </div>
+    <div class="panel-body">
+      <slot />
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'PanelCard',
+  props: {
+    // 标题
+    title: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.panel-container{
+  width: 100%;
+  padding: 10px;
+  border: 1px solid #EBEEF5 ;
+  .panel-title{
+    width: 100%;
+    line-height: 2;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0px 10px;
+    border-left: 5px solid #66b1ff;
+    position: relative;
+    .title-right{
+      display: inline-block;
+      position: absolute;
+      right: 10px;
+    }
+  }
+  .panel-body{
+    padding: 5px 0px;
+    height:auto;
+  }
+}
+</style>
diff --git a/src/icons/svg/icon-database.svg b/src/icons/svg/icon-database.svg
new file mode 100644
index 0000000..d3dd1c8
--- /dev/null
+++ b/src/icons/svg/icon-database.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1658711872102" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1435" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M960 123.7C872.7 49.9 704.8 0 512 0S151.3 49.9 64 123.7C23.2 158.2 0 197.8 0 240V605.9c0 0.7 0 1.4 0.1 2H0v176c0 132.5 229.2 240 512 240s512-107.5 512-240V608h-0.1c0.1-1.8 0.1-3.5 0.1-5.3V240c0-42.2-23.2-81.8-64-116.3zM64 356.3C151.3 430.1 319.2 480 512 480s360.7-49.9 448-123.7v79.2c-17.9 11.5-37.5 22.2-58.8 32.2C796.2 516.9 658 544 512 544s-284.2-27.1-389.2-76.4c-21.3-10-40.9-20.7-58.8-32.2v-79.1z m0 181.3c87.3 73.8 255.2 123.7 448 123.7s360.7-49.9 448-123.7v79.2c-17.9 11.4-37.5 22.2-58.8 32.2-105 49.2-243.3 76.3-389.2 76.3S227.8 698.2 122.8 649c-21.3-10-40.9-20.7-58.8-32.2v-79.2z m837.2 292.7c-105 49.2-243.3 76.3-389.2 76.3s-284.2-27.1-389.2-76.3c-20.3-9.5-39.1-19.8-56.4-30.6-1.6-5.3-2.4-10.5-2.4-15.7v-65c87.3 73.8 255.2 123.7 448 123.7s360.7-50 448-123.7v65c0 5.1-0.8 10.4-2.4 15.7-17.3 10.9-36.1 21.1-56.4 30.6z" p-id="1436"></path></svg>
\ No newline at end of file
diff --git a/src/views/dataManage/dataManage.vue b/src/views/dataManage/dataManage.vue
index 71be03f..0564cdd 100644
--- a/src/views/dataManage/dataManage.vue
+++ b/src/views/dataManage/dataManage.vue
@@ -31,19 +31,19 @@
     return {
       activeName: 'wellcover',
       tabList: [
-        { permission: '/welldata/list', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
-        { permission: '/liquiddata/list', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
-        { permission: '/gasdata/list', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
-        { permission: '/digdata/list', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
-        { permission: '/noisedata/list', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
-        { permission: '/harmfuldata/list', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
-        { permission: '/tempdata/list', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
-        { permission: '/welllocadata/list', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
-        { permission: '/liquidGasData/list', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
-        { permission: '/tubedata/list', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
-        { permission: '/gasdector/listPage', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
-        { permission: '/pantilt/listPage', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
-        { permission: '/hydrantdata/list', label: '消防栓数据列表', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
+        { permission: '/welldata/list-page', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
+        { permission: '/liquiddata/list-page', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
+        { permission: '/gasdata/list-page', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
+        { permission: '/digdata/list-page', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
+        { permission: '/noisedata/list-page', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
+        { permission: '/harmfuldata/list-page', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
+        { permission: '/tempdata/list-page', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
+        { permission: '/welllocadata/list-page', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
+        { permission: '/liquidGasData/list-page', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
+        { permission: '/tubedata/list-page', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
+        { permission: '/gasdector/list-page', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
+        { permission: '/pantilt/list-page', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
+        { permission: '/hydrantdata/list-page', label: '消防栓防盗水监测仪', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
       ] // 所有tab列表
     }
   },
diff --git a/src/views/dataManage/deviceData/listDigData.vue b/src/views/dataManage/deviceData/listDigData.vue
index fa4bbc7..3cb74ad 100644
--- a/src/views/dataManage/deviceData/listDigData.vue
+++ b/src/views/dataManage/deviceData/listDigData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/digdata/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 align="center" type="selection" width="55"/>-->
-        <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('/digdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListDigData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -185,6 +116,8 @@
       if (params && params.deviceType === this.type && params.devcode) {
         this.listQuery.keywords = params.devcode
         this.fetchData()
+      } else {
+        this.fetchData()
       }
     }
   },
@@ -203,21 +136,16 @@
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
-        text: '数据处理中,请稍后...',
+        text: '下载中,请稍后...',
         spinner: 'el-icon-loading',
         background: 'rgba(0, 0, 0, 0.7)'
       })
       batchExportDigData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +160,50 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getDigData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         return 'warning-state'
       }
     },
-    indexMethod(index) {
-      return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
-    },
-    // 改变页容量
-    handleSizeChange(val) {
-      this.listQuery.limit = val
+    // checkState(row) {
+    //   if (row.status !== '0') {
+    //     return 'warning-state'
+    //   }
+    // },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    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
   }
diff --git a/src/views/dataManage/deviceData/listGasdectorData.vue b/src/views/dataManage/deviceData/listGasdectorData.vue
index a78b8da..b4ecd07 100644
--- a/src/views/dataManage/deviceData/listGasdectorData.vue
+++ b/src/views/dataManage/deviceData/listGasdectorData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/gasdector/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('/liquidGasData/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listHarmfulData.vue b/src/views/dataManage/deviceData/listHarmfulData.vue
index dde92b4..c29cb2e 100644
--- a/src/views/dataManage/deviceData/listHarmfulData.vue
+++ b/src/views/dataManage/deviceData/listHarmfulData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -27,44 +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('/harmfuldata/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 align="center" type="selection" width="55"/>-->
-        <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('/harmfuldata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,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: 'ListHarmfulData',
@@ -84,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,92 +88,32 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: 'CO浓度(ppm)',
-          value: 'CO',
-          align: 'center'
-        },
-        {
-          text: 'CH4浓度(%VOL)',
-          value: 'CH4',
-          align: 'center'
-        },
-        {
-          text: 'H2S浓度(ppm)',
-          value: 'H2S',
-          align: 'center'
-        },
-        {
-          text: 'O2浓度(ppm)',
-          value: 'O2',
-          align: 'center'
-        },
-        {
-          text: '液位开关',
-          value: 'switch',
-          align: 'center'
-        },
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: 'CO浓度(ppm)', value: 'CO', align: 'center' },
+        { text: 'CH4浓度(%VOL)', value: 'CH4', align: 'center' },
+        { text: 'H2S浓度(ppm)', value: 'H2S', align: 'center' },
+        { text: 'O2浓度(ppm)', value: 'O2', align: 'center' },
+        { text: '液位开关', value: 'switch', align: 'center' },
         // {
         //   text: '状态描述',
         //   value: 'descn',
         //   align: 'center'
         // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -221,15 +148,10 @@
       })
       batchExportHarmfulData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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 = `有害监测仪数s据.xlsx` // 下载后文件名
-        document.body.appendChild(downloadElement)
-        downloadElement.click() // 点击下载
-        document.body.removeChild(downloadElement) // 下载完成移除元素
-        window.URL.revokeObjectURL(href) // 释放blob对象
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
       })
@@ -244,69 +166,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getHarmfulData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listHydrantData.vue b/src/views/dataManage/deviceData/listHydrantData.vue
index 575345d..f968760 100644
--- a/src/views/dataManage/deviceData/listHydrantData.vue
+++ b/src/views/dataManage/deviceData/listHydrantData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -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('/hydrantdata/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('/hydrantdata/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>
 
@@ -59,15 +58,6 @@
 export default {
   name: 'ListHydrantData',
   components: { DeptSelect },
-  /* filters: {
-    dataFilter(val) {
-      if (val === '40%LEL' || val === '60%LEL') {
-        return '0%LEL'
-      } else {
-        return val
-      }
-    }
-  }, */
   props: {
     type: {
       type: String,
@@ -75,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -91,10 +81,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', width: 170, align: 'center' },
@@ -105,17 +91,16 @@
         { text: '状态描述', value: 'descn', align: 'center' },
         { text: '消防栓状态', value: 'status', align: 'center' },
         { text: '上传时间', value: 'logtime', align: 'center' }
-        // { text: '点位编号', value: 'wellCode', align: 'center' },
-        // { text: '燃气浓度(%LEL)', value: 'strength', align: 'center', filter: true },
-        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
-        // { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -141,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -163,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取消防栓配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -186,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -207,35 +192,6 @@
 </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
 }
diff --git a/src/views/dataManage/deviceData/listLiquidData.vue b/src/views/dataManage/deviceData/listLiquidData.vue
index 96f28f6..d818684 100644
--- a/src/views/dataManage/deviceData/listLiquidData.vue
+++ b/src/views/dataManage/deviceData/listLiquidData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -26,45 +26,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('/liquiddata/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 align="center" type="selection" width="55"/>-->
-        <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('/liquiddata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,6 +58,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: 'ListLiquidData',
@@ -84,7 +70,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,74 +87,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '液位值(m)',
-          value: 'liquiddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '液位值(m)', value: 'liquiddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -204,16 +140,10 @@
       })
       batchExportLiquidData(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()
       })
@@ -228,69 +158,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index b9e5ee6..09fb191 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-card :body-style="{ padding: '0px' }" shadow="always">
-    <div class="card-panel" >
+  <el-card :body-style="{ padding: '0px' }" :shadow="shadow">
+    <div class="card-panel">
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
@@ -24,27 +24,31 @@
     title: {
       type: String,
       default: '标题'
-    },
+    }, // 标题
     flags: {
       type: String,
       default: '单位'
-    },
+    }, // 单位
     subtitle: {
       type: String,
       default: ''
-    },
+    }, // 小标题
     icon: {
       type: String,
       default: ''
-    },
+    }, // 图标
     context: {
       type: [String, Number],
       default: ''
-    },
+    }, // 内容
     color: {
       type: String,
       default: '#40c9c6'
-    }
+    }, // 图标颜色
+    shadow: {
+      type: String,
+      default: 'always'
+    } // 卡片阴影
   },
   computed: {
     backgroundColor() {
diff --git a/src/components/BigData/Card/panelCard.vue b/src/components/BigData/Card/panelCard.vue
new file mode 100644
index 0000000..d6a7b89
--- /dev/null
+++ b/src/components/BigData/Card/panelCard.vue
@@ -0,0 +1,51 @@
+<template>
+  <div class="panel-container">
+    <div class="panel-title">
+      {{ title }}
+      <div class="title-right">
+        <slot name="func" />
+      </div>
+    </div>
+    <div class="panel-body">
+      <slot />
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'PanelCard',
+  props: {
+    // 标题
+    title: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.panel-container{
+  width: 100%;
+  padding: 10px;
+  border: 1px solid #EBEEF5 ;
+  .panel-title{
+    width: 100%;
+    line-height: 2;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0px 10px;
+    border-left: 5px solid #66b1ff;
+    position: relative;
+    .title-right{
+      display: inline-block;
+      position: absolute;
+      right: 10px;
+    }
+  }
+  .panel-body{
+    padding: 5px 0px;
+    height:auto;
+  }
+}
+</style>
diff --git a/src/icons/svg/icon-database.svg b/src/icons/svg/icon-database.svg
new file mode 100644
index 0000000..d3dd1c8
--- /dev/null
+++ b/src/icons/svg/icon-database.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1658711872102" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1435" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M960 123.7C872.7 49.9 704.8 0 512 0S151.3 49.9 64 123.7C23.2 158.2 0 197.8 0 240V605.9c0 0.7 0 1.4 0.1 2H0v176c0 132.5 229.2 240 512 240s512-107.5 512-240V608h-0.1c0.1-1.8 0.1-3.5 0.1-5.3V240c0-42.2-23.2-81.8-64-116.3zM64 356.3C151.3 430.1 319.2 480 512 480s360.7-49.9 448-123.7v79.2c-17.9 11.5-37.5 22.2-58.8 32.2C796.2 516.9 658 544 512 544s-284.2-27.1-389.2-76.4c-21.3-10-40.9-20.7-58.8-32.2v-79.1z m0 181.3c87.3 73.8 255.2 123.7 448 123.7s360.7-49.9 448-123.7v79.2c-17.9 11.4-37.5 22.2-58.8 32.2-105 49.2-243.3 76.3-389.2 76.3S227.8 698.2 122.8 649c-21.3-10-40.9-20.7-58.8-32.2v-79.2z m837.2 292.7c-105 49.2-243.3 76.3-389.2 76.3s-284.2-27.1-389.2-76.3c-20.3-9.5-39.1-19.8-56.4-30.6-1.6-5.3-2.4-10.5-2.4-15.7v-65c87.3 73.8 255.2 123.7 448 123.7s360.7-50 448-123.7v65c0 5.1-0.8 10.4-2.4 15.7-17.3 10.9-36.1 21.1-56.4 30.6z" p-id="1436"></path></svg>
\ No newline at end of file
diff --git a/src/views/dataManage/dataManage.vue b/src/views/dataManage/dataManage.vue
index 71be03f..0564cdd 100644
--- a/src/views/dataManage/dataManage.vue
+++ b/src/views/dataManage/dataManage.vue
@@ -31,19 +31,19 @@
     return {
       activeName: 'wellcover',
       tabList: [
-        { permission: '/welldata/list', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
-        { permission: '/liquiddata/list', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
-        { permission: '/gasdata/list', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
-        { permission: '/digdata/list', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
-        { permission: '/noisedata/list', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
-        { permission: '/harmfuldata/list', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
-        { permission: '/tempdata/list', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
-        { permission: '/welllocadata/list', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
-        { permission: '/liquidGasData/list', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
-        { permission: '/tubedata/list', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
-        { permission: '/gasdector/listPage', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
-        { permission: '/pantilt/listPage', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
-        { permission: '/hydrantdata/list', label: '消防栓数据列表', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
+        { permission: '/welldata/list-page', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
+        { permission: '/liquiddata/list-page', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
+        { permission: '/gasdata/list-page', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
+        { permission: '/digdata/list-page', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
+        { permission: '/noisedata/list-page', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
+        { permission: '/harmfuldata/list-page', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
+        { permission: '/tempdata/list-page', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
+        { permission: '/welllocadata/list-page', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
+        { permission: '/liquidGasData/list-page', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
+        { permission: '/tubedata/list-page', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
+        { permission: '/gasdector/list-page', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
+        { permission: '/pantilt/list-page', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
+        { permission: '/hydrantdata/list-page', label: '消防栓防盗水监测仪', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
       ] // 所有tab列表
     }
   },
diff --git a/src/views/dataManage/deviceData/listDigData.vue b/src/views/dataManage/deviceData/listDigData.vue
index fa4bbc7..3cb74ad 100644
--- a/src/views/dataManage/deviceData/listDigData.vue
+++ b/src/views/dataManage/deviceData/listDigData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/digdata/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 align="center" type="selection" width="55"/>-->
-        <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('/digdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListDigData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -185,6 +116,8 @@
       if (params && params.deviceType === this.type && params.devcode) {
         this.listQuery.keywords = params.devcode
         this.fetchData()
+      } else {
+        this.fetchData()
       }
     }
   },
@@ -203,21 +136,16 @@
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
-        text: '数据处理中,请稍后...',
+        text: '下载中,请稍后...',
         spinner: 'el-icon-loading',
         background: 'rgba(0, 0, 0, 0.7)'
       })
       batchExportDigData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +160,50 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getDigData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         return 'warning-state'
       }
     },
-    indexMethod(index) {
-      return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
-    },
-    // 改变页容量
-    handleSizeChange(val) {
-      this.listQuery.limit = val
+    // checkState(row) {
+    //   if (row.status !== '0') {
+    //     return 'warning-state'
+    //   }
+    // },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    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
   }
diff --git a/src/views/dataManage/deviceData/listGasdectorData.vue b/src/views/dataManage/deviceData/listGasdectorData.vue
index a78b8da..b4ecd07 100644
--- a/src/views/dataManage/deviceData/listGasdectorData.vue
+++ b/src/views/dataManage/deviceData/listGasdectorData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/gasdector/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('/liquidGasData/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listHarmfulData.vue b/src/views/dataManage/deviceData/listHarmfulData.vue
index dde92b4..c29cb2e 100644
--- a/src/views/dataManage/deviceData/listHarmfulData.vue
+++ b/src/views/dataManage/deviceData/listHarmfulData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -27,44 +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('/harmfuldata/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 align="center" type="selection" width="55"/>-->
-        <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('/harmfuldata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,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: 'ListHarmfulData',
@@ -84,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,92 +88,32 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: 'CO浓度(ppm)',
-          value: 'CO',
-          align: 'center'
-        },
-        {
-          text: 'CH4浓度(%VOL)',
-          value: 'CH4',
-          align: 'center'
-        },
-        {
-          text: 'H2S浓度(ppm)',
-          value: 'H2S',
-          align: 'center'
-        },
-        {
-          text: 'O2浓度(ppm)',
-          value: 'O2',
-          align: 'center'
-        },
-        {
-          text: '液位开关',
-          value: 'switch',
-          align: 'center'
-        },
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: 'CO浓度(ppm)', value: 'CO', align: 'center' },
+        { text: 'CH4浓度(%VOL)', value: 'CH4', align: 'center' },
+        { text: 'H2S浓度(ppm)', value: 'H2S', align: 'center' },
+        { text: 'O2浓度(ppm)', value: 'O2', align: 'center' },
+        { text: '液位开关', value: 'switch', align: 'center' },
         // {
         //   text: '状态描述',
         //   value: 'descn',
         //   align: 'center'
         // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -221,15 +148,10 @@
       })
       batchExportHarmfulData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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 = `有害监测仪数s据.xlsx` // 下载后文件名
-        document.body.appendChild(downloadElement)
-        downloadElement.click() // 点击下载
-        document.body.removeChild(downloadElement) // 下载完成移除元素
-        window.URL.revokeObjectURL(href) // 释放blob对象
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
       })
@@ -244,69 +166,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getHarmfulData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listHydrantData.vue b/src/views/dataManage/deviceData/listHydrantData.vue
index 575345d..f968760 100644
--- a/src/views/dataManage/deviceData/listHydrantData.vue
+++ b/src/views/dataManage/deviceData/listHydrantData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -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('/hydrantdata/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('/hydrantdata/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>
 
@@ -59,15 +58,6 @@
 export default {
   name: 'ListHydrantData',
   components: { DeptSelect },
-  /* filters: {
-    dataFilter(val) {
-      if (val === '40%LEL' || val === '60%LEL') {
-        return '0%LEL'
-      } else {
-        return val
-      }
-    }
-  }, */
   props: {
     type: {
       type: String,
@@ -75,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -91,10 +81,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', width: 170, align: 'center' },
@@ -105,17 +91,16 @@
         { text: '状态描述', value: 'descn', align: 'center' },
         { text: '消防栓状态', value: 'status', align: 'center' },
         { text: '上传时间', value: 'logtime', align: 'center' }
-        // { text: '点位编号', value: 'wellCode', align: 'center' },
-        // { text: '燃气浓度(%LEL)', value: 'strength', align: 'center', filter: true },
-        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
-        // { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -141,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -163,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取消防栓配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -186,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -207,35 +192,6 @@
 </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
 }
diff --git a/src/views/dataManage/deviceData/listLiquidData.vue b/src/views/dataManage/deviceData/listLiquidData.vue
index 96f28f6..d818684 100644
--- a/src/views/dataManage/deviceData/listLiquidData.vue
+++ b/src/views/dataManage/deviceData/listLiquidData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -26,45 +26,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('/liquiddata/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 align="center" type="selection" width="55"/>-->
-        <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('/liquiddata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,6 +58,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: 'ListLiquidData',
@@ -84,7 +70,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,74 +87,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '液位值(m)',
-          value: 'liquiddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '液位值(m)', value: 'liquiddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -204,16 +140,10 @@
       })
       batchExportLiquidData(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()
       })
@@ -228,69 +158,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listLiquidGasData.vue b/src/views/dataManage/deviceData/listLiquidGasData.vue
index 160edde..f2801c2 100644
--- a/src/views/dataManage/deviceData/listLiquidGasData.vue
+++ b/src/views/dataManage/deviceData/listLiquidGasData.vue
@@ -9,7 +9,8 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
+          size="small"
           dept-type="03"
           placeholder="选择权属单位/使用单位"
         />
@@ -32,46 +33,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('/liquidGasData/export')" :disabled="list.length === 0" 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 align="center" type="selection" width="55"/>-->
-        <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('/liquidGasData/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-if="column.unitFilter">{{ scope.row[column.value]|unit }}</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>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>
   </app-container>
 </template>
 
@@ -80,6 +65,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: 'ListLiquidGasData',
@@ -104,7 +90,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -122,80 +108,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '燃气浓度',
-          value: 'data',
-          align: 'center',
-          unitFilter: true
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'companyName',
-          align: 'center'
-        },
-        {
-          text: '使用单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '燃气浓度', value: 'data', align: 'center', unitFilter: true },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'companyName', align: 'center' },
+        { text: '使用单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -235,20 +166,10 @@
       })
       batchExportLiquidGasData(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
-        if (this.listQuery.sensorType === 'liquid') {
-          downloadElement.download = `燃气智能终端（一体化）数据-液位.xlsx` // 下载后文件名
-        } else {
-          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()
       })
@@ -359,69 +280,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidGasData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index b9e5ee6..09fb191 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-card :body-style="{ padding: '0px' }" shadow="always">
-    <div class="card-panel" >
+  <el-card :body-style="{ padding: '0px' }" :shadow="shadow">
+    <div class="card-panel">
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
@@ -24,27 +24,31 @@
     title: {
       type: String,
       default: '标题'
-    },
+    }, // 标题
     flags: {
       type: String,
       default: '单位'
-    },
+    }, // 单位
     subtitle: {
       type: String,
       default: ''
-    },
+    }, // 小标题
     icon: {
       type: String,
       default: ''
-    },
+    }, // 图标
     context: {
       type: [String, Number],
       default: ''
-    },
+    }, // 内容
     color: {
       type: String,
       default: '#40c9c6'
-    }
+    }, // 图标颜色
+    shadow: {
+      type: String,
+      default: 'always'
+    } // 卡片阴影
   },
   computed: {
     backgroundColor() {
diff --git a/src/components/BigData/Card/panelCard.vue b/src/components/BigData/Card/panelCard.vue
new file mode 100644
index 0000000..d6a7b89
--- /dev/null
+++ b/src/components/BigData/Card/panelCard.vue
@@ -0,0 +1,51 @@
+<template>
+  <div class="panel-container">
+    <div class="panel-title">
+      {{ title }}
+      <div class="title-right">
+        <slot name="func" />
+      </div>
+    </div>
+    <div class="panel-body">
+      <slot />
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'PanelCard',
+  props: {
+    // 标题
+    title: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.panel-container{
+  width: 100%;
+  padding: 10px;
+  border: 1px solid #EBEEF5 ;
+  .panel-title{
+    width: 100%;
+    line-height: 2;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0px 10px;
+    border-left: 5px solid #66b1ff;
+    position: relative;
+    .title-right{
+      display: inline-block;
+      position: absolute;
+      right: 10px;
+    }
+  }
+  .panel-body{
+    padding: 5px 0px;
+    height:auto;
+  }
+}
+</style>
diff --git a/src/icons/svg/icon-database.svg b/src/icons/svg/icon-database.svg
new file mode 100644
index 0000000..d3dd1c8
--- /dev/null
+++ b/src/icons/svg/icon-database.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1658711872102" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1435" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M960 123.7C872.7 49.9 704.8 0 512 0S151.3 49.9 64 123.7C23.2 158.2 0 197.8 0 240V605.9c0 0.7 0 1.4 0.1 2H0v176c0 132.5 229.2 240 512 240s512-107.5 512-240V608h-0.1c0.1-1.8 0.1-3.5 0.1-5.3V240c0-42.2-23.2-81.8-64-116.3zM64 356.3C151.3 430.1 319.2 480 512 480s360.7-49.9 448-123.7v79.2c-17.9 11.5-37.5 22.2-58.8 32.2C796.2 516.9 658 544 512 544s-284.2-27.1-389.2-76.4c-21.3-10-40.9-20.7-58.8-32.2v-79.1z m0 181.3c87.3 73.8 255.2 123.7 448 123.7s360.7-49.9 448-123.7v79.2c-17.9 11.4-37.5 22.2-58.8 32.2-105 49.2-243.3 76.3-389.2 76.3S227.8 698.2 122.8 649c-21.3-10-40.9-20.7-58.8-32.2v-79.2z m837.2 292.7c-105 49.2-243.3 76.3-389.2 76.3s-284.2-27.1-389.2-76.3c-20.3-9.5-39.1-19.8-56.4-30.6-1.6-5.3-2.4-10.5-2.4-15.7v-65c87.3 73.8 255.2 123.7 448 123.7s360.7-50 448-123.7v65c0 5.1-0.8 10.4-2.4 15.7-17.3 10.9-36.1 21.1-56.4 30.6z" p-id="1436"></path></svg>
\ No newline at end of file
diff --git a/src/views/dataManage/dataManage.vue b/src/views/dataManage/dataManage.vue
index 71be03f..0564cdd 100644
--- a/src/views/dataManage/dataManage.vue
+++ b/src/views/dataManage/dataManage.vue
@@ -31,19 +31,19 @@
     return {
       activeName: 'wellcover',
       tabList: [
-        { permission: '/welldata/list', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
-        { permission: '/liquiddata/list', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
-        { permission: '/gasdata/list', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
-        { permission: '/digdata/list', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
-        { permission: '/noisedata/list', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
-        { permission: '/harmfuldata/list', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
-        { permission: '/tempdata/list', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
-        { permission: '/welllocadata/list', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
-        { permission: '/liquidGasData/list', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
-        { permission: '/tubedata/list', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
-        { permission: '/gasdector/listPage', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
-        { permission: '/pantilt/listPage', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
-        { permission: '/hydrantdata/list', label: '消防栓数据列表', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
+        { permission: '/welldata/list-page', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
+        { permission: '/liquiddata/list-page', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
+        { permission: '/gasdata/list-page', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
+        { permission: '/digdata/list-page', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
+        { permission: '/noisedata/list-page', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
+        { permission: '/harmfuldata/list-page', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
+        { permission: '/tempdata/list-page', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
+        { permission: '/welllocadata/list-page', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
+        { permission: '/liquidGasData/list-page', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
+        { permission: '/tubedata/list-page', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
+        { permission: '/gasdector/list-page', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
+        { permission: '/pantilt/list-page', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
+        { permission: '/hydrantdata/list-page', label: '消防栓防盗水监测仪', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
       ] // 所有tab列表
     }
   },
diff --git a/src/views/dataManage/deviceData/listDigData.vue b/src/views/dataManage/deviceData/listDigData.vue
index fa4bbc7..3cb74ad 100644
--- a/src/views/dataManage/deviceData/listDigData.vue
+++ b/src/views/dataManage/deviceData/listDigData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/digdata/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 align="center" type="selection" width="55"/>-->
-        <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('/digdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListDigData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -185,6 +116,8 @@
       if (params && params.deviceType === this.type && params.devcode) {
         this.listQuery.keywords = params.devcode
         this.fetchData()
+      } else {
+        this.fetchData()
       }
     }
   },
@@ -203,21 +136,16 @@
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
-        text: '数据处理中,请稍后...',
+        text: '下载中,请稍后...',
         spinner: 'el-icon-loading',
         background: 'rgba(0, 0, 0, 0.7)'
       })
       batchExportDigData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +160,50 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getDigData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         return 'warning-state'
       }
     },
-    indexMethod(index) {
-      return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
-    },
-    // 改变页容量
-    handleSizeChange(val) {
-      this.listQuery.limit = val
+    // checkState(row) {
+    //   if (row.status !== '0') {
+    //     return 'warning-state'
+    //   }
+    // },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    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
   }
diff --git a/src/views/dataManage/deviceData/listGasdectorData.vue b/src/views/dataManage/deviceData/listGasdectorData.vue
index a78b8da..b4ecd07 100644
--- a/src/views/dataManage/deviceData/listGasdectorData.vue
+++ b/src/views/dataManage/deviceData/listGasdectorData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/gasdector/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('/liquidGasData/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listHarmfulData.vue b/src/views/dataManage/deviceData/listHarmfulData.vue
index dde92b4..c29cb2e 100644
--- a/src/views/dataManage/deviceData/listHarmfulData.vue
+++ b/src/views/dataManage/deviceData/listHarmfulData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -27,44 +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('/harmfuldata/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 align="center" type="selection" width="55"/>-->
-        <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('/harmfuldata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,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: 'ListHarmfulData',
@@ -84,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,92 +88,32 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: 'CO浓度(ppm)',
-          value: 'CO',
-          align: 'center'
-        },
-        {
-          text: 'CH4浓度(%VOL)',
-          value: 'CH4',
-          align: 'center'
-        },
-        {
-          text: 'H2S浓度(ppm)',
-          value: 'H2S',
-          align: 'center'
-        },
-        {
-          text: 'O2浓度(ppm)',
-          value: 'O2',
-          align: 'center'
-        },
-        {
-          text: '液位开关',
-          value: 'switch',
-          align: 'center'
-        },
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: 'CO浓度(ppm)', value: 'CO', align: 'center' },
+        { text: 'CH4浓度(%VOL)', value: 'CH4', align: 'center' },
+        { text: 'H2S浓度(ppm)', value: 'H2S', align: 'center' },
+        { text: 'O2浓度(ppm)', value: 'O2', align: 'center' },
+        { text: '液位开关', value: 'switch', align: 'center' },
         // {
         //   text: '状态描述',
         //   value: 'descn',
         //   align: 'center'
         // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -221,15 +148,10 @@
       })
       batchExportHarmfulData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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 = `有害监测仪数s据.xlsx` // 下载后文件名
-        document.body.appendChild(downloadElement)
-        downloadElement.click() // 点击下载
-        document.body.removeChild(downloadElement) // 下载完成移除元素
-        window.URL.revokeObjectURL(href) // 释放blob对象
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
       })
@@ -244,69 +166,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getHarmfulData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listHydrantData.vue b/src/views/dataManage/deviceData/listHydrantData.vue
index 575345d..f968760 100644
--- a/src/views/dataManage/deviceData/listHydrantData.vue
+++ b/src/views/dataManage/deviceData/listHydrantData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -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('/hydrantdata/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('/hydrantdata/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>
 
@@ -59,15 +58,6 @@
 export default {
   name: 'ListHydrantData',
   components: { DeptSelect },
-  /* filters: {
-    dataFilter(val) {
-      if (val === '40%LEL' || val === '60%LEL') {
-        return '0%LEL'
-      } else {
-        return val
-      }
-    }
-  }, */
   props: {
     type: {
       type: String,
@@ -75,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -91,10 +81,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', width: 170, align: 'center' },
@@ -105,17 +91,16 @@
         { text: '状态描述', value: 'descn', align: 'center' },
         { text: '消防栓状态', value: 'status', align: 'center' },
         { text: '上传时间', value: 'logtime', align: 'center' }
-        // { text: '点位编号', value: 'wellCode', align: 'center' },
-        // { text: '燃气浓度(%LEL)', value: 'strength', align: 'center', filter: true },
-        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
-        // { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -141,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -163,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取消防栓配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -186,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -207,35 +192,6 @@
 </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
 }
diff --git a/src/views/dataManage/deviceData/listLiquidData.vue b/src/views/dataManage/deviceData/listLiquidData.vue
index 96f28f6..d818684 100644
--- a/src/views/dataManage/deviceData/listLiquidData.vue
+++ b/src/views/dataManage/deviceData/listLiquidData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -26,45 +26,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('/liquiddata/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 align="center" type="selection" width="55"/>-->
-        <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('/liquiddata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,6 +58,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: 'ListLiquidData',
@@ -84,7 +70,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,74 +87,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '液位值(m)',
-          value: 'liquiddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '液位值(m)', value: 'liquiddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -204,16 +140,10 @@
       })
       batchExportLiquidData(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()
       })
@@ -228,69 +158,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listLiquidGasData.vue b/src/views/dataManage/deviceData/listLiquidGasData.vue
index 160edde..f2801c2 100644
--- a/src/views/dataManage/deviceData/listLiquidGasData.vue
+++ b/src/views/dataManage/deviceData/listLiquidGasData.vue
@@ -9,7 +9,8 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
+          size="small"
           dept-type="03"
           placeholder="选择权属单位/使用单位"
         />
@@ -32,46 +33,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('/liquidGasData/export')" :disabled="list.length === 0" 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 align="center" type="selection" width="55"/>-->
-        <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('/liquidGasData/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-if="column.unitFilter">{{ scope.row[column.value]|unit }}</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>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>
   </app-container>
 </template>
 
@@ -80,6 +65,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: 'ListLiquidGasData',
@@ -104,7 +90,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -122,80 +108,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '燃气浓度',
-          value: 'data',
-          align: 'center',
-          unitFilter: true
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'companyName',
-          align: 'center'
-        },
-        {
-          text: '使用单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '燃气浓度', value: 'data', align: 'center', unitFilter: true },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'companyName', align: 'center' },
+        { text: '使用单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -235,20 +166,10 @@
       })
       batchExportLiquidGasData(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
-        if (this.listQuery.sensorType === 'liquid') {
-          downloadElement.download = `燃气智能终端（一体化）数据-液位.xlsx` // 下载后文件名
-        } else {
-          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()
       })
@@ -359,69 +280,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidGasData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listNoiseData.vue b/src/views/dataManage/deviceData/listNoiseData.vue
index 5e31021..ab4faf4 100644
--- a/src/views/dataManage/deviceData/listNoiseData.vue
+++ b/src/views/dataManage/deviceData/listNoiseData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/noisedata/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 align="center" type="selection" width="55"/>-->
-        <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('/noisedata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListNoiseData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        // { text: '状态描述', value: 'descn', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -209,15 +141,10 @@
       })
       batchExportNoiseData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +159,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getNoiseData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index b9e5ee6..09fb191 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-card :body-style="{ padding: '0px' }" shadow="always">
-    <div class="card-panel" >
+  <el-card :body-style="{ padding: '0px' }" :shadow="shadow">
+    <div class="card-panel">
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
@@ -24,27 +24,31 @@
     title: {
       type: String,
       default: '标题'
-    },
+    }, // 标题
     flags: {
       type: String,
       default: '单位'
-    },
+    }, // 单位
     subtitle: {
       type: String,
       default: ''
-    },
+    }, // 小标题
     icon: {
       type: String,
       default: ''
-    },
+    }, // 图标
     context: {
       type: [String, Number],
       default: ''
-    },
+    }, // 内容
     color: {
       type: String,
       default: '#40c9c6'
-    }
+    }, // 图标颜色
+    shadow: {
+      type: String,
+      default: 'always'
+    } // 卡片阴影
   },
   computed: {
     backgroundColor() {
diff --git a/src/components/BigData/Card/panelCard.vue b/src/components/BigData/Card/panelCard.vue
new file mode 100644
index 0000000..d6a7b89
--- /dev/null
+++ b/src/components/BigData/Card/panelCard.vue
@@ -0,0 +1,51 @@
+<template>
+  <div class="panel-container">
+    <div class="panel-title">
+      {{ title }}
+      <div class="title-right">
+        <slot name="func" />
+      </div>
+    </div>
+    <div class="panel-body">
+      <slot />
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'PanelCard',
+  props: {
+    // 标题
+    title: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.panel-container{
+  width: 100%;
+  padding: 10px;
+  border: 1px solid #EBEEF5 ;
+  .panel-title{
+    width: 100%;
+    line-height: 2;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0px 10px;
+    border-left: 5px solid #66b1ff;
+    position: relative;
+    .title-right{
+      display: inline-block;
+      position: absolute;
+      right: 10px;
+    }
+  }
+  .panel-body{
+    padding: 5px 0px;
+    height:auto;
+  }
+}
+</style>
diff --git a/src/icons/svg/icon-database.svg b/src/icons/svg/icon-database.svg
new file mode 100644
index 0000000..d3dd1c8
--- /dev/null
+++ b/src/icons/svg/icon-database.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1658711872102" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1435" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M960 123.7C872.7 49.9 704.8 0 512 0S151.3 49.9 64 123.7C23.2 158.2 0 197.8 0 240V605.9c0 0.7 0 1.4 0.1 2H0v176c0 132.5 229.2 240 512 240s512-107.5 512-240V608h-0.1c0.1-1.8 0.1-3.5 0.1-5.3V240c0-42.2-23.2-81.8-64-116.3zM64 356.3C151.3 430.1 319.2 480 512 480s360.7-49.9 448-123.7v79.2c-17.9 11.5-37.5 22.2-58.8 32.2C796.2 516.9 658 544 512 544s-284.2-27.1-389.2-76.4c-21.3-10-40.9-20.7-58.8-32.2v-79.1z m0 181.3c87.3 73.8 255.2 123.7 448 123.7s360.7-49.9 448-123.7v79.2c-17.9 11.4-37.5 22.2-58.8 32.2-105 49.2-243.3 76.3-389.2 76.3S227.8 698.2 122.8 649c-21.3-10-40.9-20.7-58.8-32.2v-79.2z m837.2 292.7c-105 49.2-243.3 76.3-389.2 76.3s-284.2-27.1-389.2-76.3c-20.3-9.5-39.1-19.8-56.4-30.6-1.6-5.3-2.4-10.5-2.4-15.7v-65c87.3 73.8 255.2 123.7 448 123.7s360.7-50 448-123.7v65c0 5.1-0.8 10.4-2.4 15.7-17.3 10.9-36.1 21.1-56.4 30.6z" p-id="1436"></path></svg>
\ No newline at end of file
diff --git a/src/views/dataManage/dataManage.vue b/src/views/dataManage/dataManage.vue
index 71be03f..0564cdd 100644
--- a/src/views/dataManage/dataManage.vue
+++ b/src/views/dataManage/dataManage.vue
@@ -31,19 +31,19 @@
     return {
       activeName: 'wellcover',
       tabList: [
-        { permission: '/welldata/list', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
-        { permission: '/liquiddata/list', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
-        { permission: '/gasdata/list', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
-        { permission: '/digdata/list', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
-        { permission: '/noisedata/list', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
-        { permission: '/harmfuldata/list', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
-        { permission: '/tempdata/list', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
-        { permission: '/welllocadata/list', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
-        { permission: '/liquidGasData/list', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
-        { permission: '/tubedata/list', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
-        { permission: '/gasdector/listPage', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
-        { permission: '/pantilt/listPage', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
-        { permission: '/hydrantdata/list', label: '消防栓数据列表', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
+        { permission: '/welldata/list-page', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
+        { permission: '/liquiddata/list-page', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
+        { permission: '/gasdata/list-page', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
+        { permission: '/digdata/list-page', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
+        { permission: '/noisedata/list-page', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
+        { permission: '/harmfuldata/list-page', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
+        { permission: '/tempdata/list-page', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
+        { permission: '/welllocadata/list-page', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
+        { permission: '/liquidGasData/list-page', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
+        { permission: '/tubedata/list-page', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
+        { permission: '/gasdector/list-page', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
+        { permission: '/pantilt/list-page', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
+        { permission: '/hydrantdata/list-page', label: '消防栓防盗水监测仪', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
       ] // 所有tab列表
     }
   },
diff --git a/src/views/dataManage/deviceData/listDigData.vue b/src/views/dataManage/deviceData/listDigData.vue
index fa4bbc7..3cb74ad 100644
--- a/src/views/dataManage/deviceData/listDigData.vue
+++ b/src/views/dataManage/deviceData/listDigData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/digdata/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 align="center" type="selection" width="55"/>-->
-        <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('/digdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListDigData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -185,6 +116,8 @@
       if (params && params.deviceType === this.type && params.devcode) {
         this.listQuery.keywords = params.devcode
         this.fetchData()
+      } else {
+        this.fetchData()
       }
     }
   },
@@ -203,21 +136,16 @@
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
-        text: '数据处理中,请稍后...',
+        text: '下载中,请稍后...',
         spinner: 'el-icon-loading',
         background: 'rgba(0, 0, 0, 0.7)'
       })
       batchExportDigData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +160,50 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getDigData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         return 'warning-state'
       }
     },
-    indexMethod(index) {
-      return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
-    },
-    // 改变页容量
-    handleSizeChange(val) {
-      this.listQuery.limit = val
+    // checkState(row) {
+    //   if (row.status !== '0') {
+    //     return 'warning-state'
+    //   }
+    // },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    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
   }
diff --git a/src/views/dataManage/deviceData/listGasdectorData.vue b/src/views/dataManage/deviceData/listGasdectorData.vue
index a78b8da..b4ecd07 100644
--- a/src/views/dataManage/deviceData/listGasdectorData.vue
+++ b/src/views/dataManage/deviceData/listGasdectorData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/gasdector/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('/liquidGasData/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listHarmfulData.vue b/src/views/dataManage/deviceData/listHarmfulData.vue
index dde92b4..c29cb2e 100644
--- a/src/views/dataManage/deviceData/listHarmfulData.vue
+++ b/src/views/dataManage/deviceData/listHarmfulData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -27,44 +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('/harmfuldata/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 align="center" type="selection" width="55"/>-->
-        <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('/harmfuldata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,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: 'ListHarmfulData',
@@ -84,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,92 +88,32 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: 'CO浓度(ppm)',
-          value: 'CO',
-          align: 'center'
-        },
-        {
-          text: 'CH4浓度(%VOL)',
-          value: 'CH4',
-          align: 'center'
-        },
-        {
-          text: 'H2S浓度(ppm)',
-          value: 'H2S',
-          align: 'center'
-        },
-        {
-          text: 'O2浓度(ppm)',
-          value: 'O2',
-          align: 'center'
-        },
-        {
-          text: '液位开关',
-          value: 'switch',
-          align: 'center'
-        },
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: 'CO浓度(ppm)', value: 'CO', align: 'center' },
+        { text: 'CH4浓度(%VOL)', value: 'CH4', align: 'center' },
+        { text: 'H2S浓度(ppm)', value: 'H2S', align: 'center' },
+        { text: 'O2浓度(ppm)', value: 'O2', align: 'center' },
+        { text: '液位开关', value: 'switch', align: 'center' },
         // {
         //   text: '状态描述',
         //   value: 'descn',
         //   align: 'center'
         // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -221,15 +148,10 @@
       })
       batchExportHarmfulData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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 = `有害监测仪数s据.xlsx` // 下载后文件名
-        document.body.appendChild(downloadElement)
-        downloadElement.click() // 点击下载
-        document.body.removeChild(downloadElement) // 下载完成移除元素
-        window.URL.revokeObjectURL(href) // 释放blob对象
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
       })
@@ -244,69 +166,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getHarmfulData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listHydrantData.vue b/src/views/dataManage/deviceData/listHydrantData.vue
index 575345d..f968760 100644
--- a/src/views/dataManage/deviceData/listHydrantData.vue
+++ b/src/views/dataManage/deviceData/listHydrantData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -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('/hydrantdata/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('/hydrantdata/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>
 
@@ -59,15 +58,6 @@
 export default {
   name: 'ListHydrantData',
   components: { DeptSelect },
-  /* filters: {
-    dataFilter(val) {
-      if (val === '40%LEL' || val === '60%LEL') {
-        return '0%LEL'
-      } else {
-        return val
-      }
-    }
-  }, */
   props: {
     type: {
       type: String,
@@ -75,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -91,10 +81,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', width: 170, align: 'center' },
@@ -105,17 +91,16 @@
         { text: '状态描述', value: 'descn', align: 'center' },
         { text: '消防栓状态', value: 'status', align: 'center' },
         { text: '上传时间', value: 'logtime', align: 'center' }
-        // { text: '点位编号', value: 'wellCode', align: 'center' },
-        // { text: '燃气浓度(%LEL)', value: 'strength', align: 'center', filter: true },
-        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
-        // { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -141,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -163,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取消防栓配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -186,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -207,35 +192,6 @@
 </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
 }
diff --git a/src/views/dataManage/deviceData/listLiquidData.vue b/src/views/dataManage/deviceData/listLiquidData.vue
index 96f28f6..d818684 100644
--- a/src/views/dataManage/deviceData/listLiquidData.vue
+++ b/src/views/dataManage/deviceData/listLiquidData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -26,45 +26,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('/liquiddata/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 align="center" type="selection" width="55"/>-->
-        <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('/liquiddata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,6 +58,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: 'ListLiquidData',
@@ -84,7 +70,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,74 +87,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '液位值(m)',
-          value: 'liquiddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '液位值(m)', value: 'liquiddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -204,16 +140,10 @@
       })
       batchExportLiquidData(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()
       })
@@ -228,69 +158,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listLiquidGasData.vue b/src/views/dataManage/deviceData/listLiquidGasData.vue
index 160edde..f2801c2 100644
--- a/src/views/dataManage/deviceData/listLiquidGasData.vue
+++ b/src/views/dataManage/deviceData/listLiquidGasData.vue
@@ -9,7 +9,8 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
+          size="small"
           dept-type="03"
           placeholder="选择权属单位/使用单位"
         />
@@ -32,46 +33,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('/liquidGasData/export')" :disabled="list.length === 0" 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 align="center" type="selection" width="55"/>-->
-        <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('/liquidGasData/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-if="column.unitFilter">{{ scope.row[column.value]|unit }}</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>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>
   </app-container>
 </template>
 
@@ -80,6 +65,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: 'ListLiquidGasData',
@@ -104,7 +90,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -122,80 +108,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '燃气浓度',
-          value: 'data',
-          align: 'center',
-          unitFilter: true
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'companyName',
-          align: 'center'
-        },
-        {
-          text: '使用单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '燃气浓度', value: 'data', align: 'center', unitFilter: true },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'companyName', align: 'center' },
+        { text: '使用单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -235,20 +166,10 @@
       })
       batchExportLiquidGasData(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
-        if (this.listQuery.sensorType === 'liquid') {
-          downloadElement.download = `燃气智能终端（一体化）数据-液位.xlsx` // 下载后文件名
-        } else {
-          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()
       })
@@ -359,69 +280,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidGasData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listNoiseData.vue b/src/views/dataManage/deviceData/listNoiseData.vue
index 5e31021..ab4faf4 100644
--- a/src/views/dataManage/deviceData/listNoiseData.vue
+++ b/src/views/dataManage/deviceData/listNoiseData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/noisedata/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 align="center" type="selection" width="55"/>-->
-        <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('/noisedata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListNoiseData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        // { text: '状态描述', value: 'descn', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -209,15 +141,10 @@
       })
       batchExportNoiseData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +159,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getNoiseData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listPantiltData.vue b/src/views/dataManage/deviceData/listPantiltData.vue
index c2030da..1609544 100644
--- a/src/views/dataManage/deviceData/listPantiltData.vue
+++ b/src/views/dataManage/deviceData/listPantiltData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/pantilt/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('/pantilt/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index b9e5ee6..09fb191 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-card :body-style="{ padding: '0px' }" shadow="always">
-    <div class="card-panel" >
+  <el-card :body-style="{ padding: '0px' }" :shadow="shadow">
+    <div class="card-panel">
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
@@ -24,27 +24,31 @@
     title: {
       type: String,
       default: '标题'
-    },
+    }, // 标题
     flags: {
       type: String,
       default: '单位'
-    },
+    }, // 单位
     subtitle: {
       type: String,
       default: ''
-    },
+    }, // 小标题
     icon: {
       type: String,
       default: ''
-    },
+    }, // 图标
     context: {
       type: [String, Number],
       default: ''
-    },
+    }, // 内容
     color: {
       type: String,
       default: '#40c9c6'
-    }
+    }, // 图标颜色
+    shadow: {
+      type: String,
+      default: 'always'
+    } // 卡片阴影
   },
   computed: {
     backgroundColor() {
diff --git a/src/components/BigData/Card/panelCard.vue b/src/components/BigData/Card/panelCard.vue
new file mode 100644
index 0000000..d6a7b89
--- /dev/null
+++ b/src/components/BigData/Card/panelCard.vue
@@ -0,0 +1,51 @@
+<template>
+  <div class="panel-container">
+    <div class="panel-title">
+      {{ title }}
+      <div class="title-right">
+        <slot name="func" />
+      </div>
+    </div>
+    <div class="panel-body">
+      <slot />
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'PanelCard',
+  props: {
+    // 标题
+    title: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.panel-container{
+  width: 100%;
+  padding: 10px;
+  border: 1px solid #EBEEF5 ;
+  .panel-title{
+    width: 100%;
+    line-height: 2;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0px 10px;
+    border-left: 5px solid #66b1ff;
+    position: relative;
+    .title-right{
+      display: inline-block;
+      position: absolute;
+      right: 10px;
+    }
+  }
+  .panel-body{
+    padding: 5px 0px;
+    height:auto;
+  }
+}
+</style>
diff --git a/src/icons/svg/icon-database.svg b/src/icons/svg/icon-database.svg
new file mode 100644
index 0000000..d3dd1c8
--- /dev/null
+++ b/src/icons/svg/icon-database.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1658711872102" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1435" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M960 123.7C872.7 49.9 704.8 0 512 0S151.3 49.9 64 123.7C23.2 158.2 0 197.8 0 240V605.9c0 0.7 0 1.4 0.1 2H0v176c0 132.5 229.2 240 512 240s512-107.5 512-240V608h-0.1c0.1-1.8 0.1-3.5 0.1-5.3V240c0-42.2-23.2-81.8-64-116.3zM64 356.3C151.3 430.1 319.2 480 512 480s360.7-49.9 448-123.7v79.2c-17.9 11.5-37.5 22.2-58.8 32.2C796.2 516.9 658 544 512 544s-284.2-27.1-389.2-76.4c-21.3-10-40.9-20.7-58.8-32.2v-79.1z m0 181.3c87.3 73.8 255.2 123.7 448 123.7s360.7-49.9 448-123.7v79.2c-17.9 11.4-37.5 22.2-58.8 32.2-105 49.2-243.3 76.3-389.2 76.3S227.8 698.2 122.8 649c-21.3-10-40.9-20.7-58.8-32.2v-79.2z m837.2 292.7c-105 49.2-243.3 76.3-389.2 76.3s-284.2-27.1-389.2-76.3c-20.3-9.5-39.1-19.8-56.4-30.6-1.6-5.3-2.4-10.5-2.4-15.7v-65c87.3 73.8 255.2 123.7 448 123.7s360.7-50 448-123.7v65c0 5.1-0.8 10.4-2.4 15.7-17.3 10.9-36.1 21.1-56.4 30.6z" p-id="1436"></path></svg>
\ No newline at end of file
diff --git a/src/views/dataManage/dataManage.vue b/src/views/dataManage/dataManage.vue
index 71be03f..0564cdd 100644
--- a/src/views/dataManage/dataManage.vue
+++ b/src/views/dataManage/dataManage.vue
@@ -31,19 +31,19 @@
     return {
       activeName: 'wellcover',
       tabList: [
-        { permission: '/welldata/list', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
-        { permission: '/liquiddata/list', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
-        { permission: '/gasdata/list', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
-        { permission: '/digdata/list', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
-        { permission: '/noisedata/list', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
-        { permission: '/harmfuldata/list', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
-        { permission: '/tempdata/list', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
-        { permission: '/welllocadata/list', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
-        { permission: '/liquidGasData/list', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
-        { permission: '/tubedata/list', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
-        { permission: '/gasdector/listPage', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
-        { permission: '/pantilt/listPage', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
-        { permission: '/hydrantdata/list', label: '消防栓数据列表', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
+        { permission: '/welldata/list-page', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
+        { permission: '/liquiddata/list-page', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
+        { permission: '/gasdata/list-page', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
+        { permission: '/digdata/list-page', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
+        { permission: '/noisedata/list-page', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
+        { permission: '/harmfuldata/list-page', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
+        { permission: '/tempdata/list-page', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
+        { permission: '/welllocadata/list-page', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
+        { permission: '/liquidGasData/list-page', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
+        { permission: '/tubedata/list-page', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
+        { permission: '/gasdector/list-page', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
+        { permission: '/pantilt/list-page', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
+        { permission: '/hydrantdata/list-page', label: '消防栓防盗水监测仪', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
       ] // 所有tab列表
     }
   },
diff --git a/src/views/dataManage/deviceData/listDigData.vue b/src/views/dataManage/deviceData/listDigData.vue
index fa4bbc7..3cb74ad 100644
--- a/src/views/dataManage/deviceData/listDigData.vue
+++ b/src/views/dataManage/deviceData/listDigData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/digdata/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 align="center" type="selection" width="55"/>-->
-        <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('/digdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListDigData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -185,6 +116,8 @@
       if (params && params.deviceType === this.type && params.devcode) {
         this.listQuery.keywords = params.devcode
         this.fetchData()
+      } else {
+        this.fetchData()
       }
     }
   },
@@ -203,21 +136,16 @@
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
-        text: '数据处理中,请稍后...',
+        text: '下载中,请稍后...',
         spinner: 'el-icon-loading',
         background: 'rgba(0, 0, 0, 0.7)'
       })
       batchExportDigData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +160,50 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getDigData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         return 'warning-state'
       }
     },
-    indexMethod(index) {
-      return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
-    },
-    // 改变页容量
-    handleSizeChange(val) {
-      this.listQuery.limit = val
+    // checkState(row) {
+    //   if (row.status !== '0') {
+    //     return 'warning-state'
+    //   }
+    // },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    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
   }
diff --git a/src/views/dataManage/deviceData/listGasdectorData.vue b/src/views/dataManage/deviceData/listGasdectorData.vue
index a78b8da..b4ecd07 100644
--- a/src/views/dataManage/deviceData/listGasdectorData.vue
+++ b/src/views/dataManage/deviceData/listGasdectorData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/gasdector/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('/liquidGasData/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listHarmfulData.vue b/src/views/dataManage/deviceData/listHarmfulData.vue
index dde92b4..c29cb2e 100644
--- a/src/views/dataManage/deviceData/listHarmfulData.vue
+++ b/src/views/dataManage/deviceData/listHarmfulData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -27,44 +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('/harmfuldata/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 align="center" type="selection" width="55"/>-->
-        <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('/harmfuldata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,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: 'ListHarmfulData',
@@ -84,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,92 +88,32 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: 'CO浓度(ppm)',
-          value: 'CO',
-          align: 'center'
-        },
-        {
-          text: 'CH4浓度(%VOL)',
-          value: 'CH4',
-          align: 'center'
-        },
-        {
-          text: 'H2S浓度(ppm)',
-          value: 'H2S',
-          align: 'center'
-        },
-        {
-          text: 'O2浓度(ppm)',
-          value: 'O2',
-          align: 'center'
-        },
-        {
-          text: '液位开关',
-          value: 'switch',
-          align: 'center'
-        },
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: 'CO浓度(ppm)', value: 'CO', align: 'center' },
+        { text: 'CH4浓度(%VOL)', value: 'CH4', align: 'center' },
+        { text: 'H2S浓度(ppm)', value: 'H2S', align: 'center' },
+        { text: 'O2浓度(ppm)', value: 'O2', align: 'center' },
+        { text: '液位开关', value: 'switch', align: 'center' },
         // {
         //   text: '状态描述',
         //   value: 'descn',
         //   align: 'center'
         // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -221,15 +148,10 @@
       })
       batchExportHarmfulData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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 = `有害监测仪数s据.xlsx` // 下载后文件名
-        document.body.appendChild(downloadElement)
-        downloadElement.click() // 点击下载
-        document.body.removeChild(downloadElement) // 下载完成移除元素
-        window.URL.revokeObjectURL(href) // 释放blob对象
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
       })
@@ -244,69 +166,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getHarmfulData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listHydrantData.vue b/src/views/dataManage/deviceData/listHydrantData.vue
index 575345d..f968760 100644
--- a/src/views/dataManage/deviceData/listHydrantData.vue
+++ b/src/views/dataManage/deviceData/listHydrantData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -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('/hydrantdata/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('/hydrantdata/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>
 
@@ -59,15 +58,6 @@
 export default {
   name: 'ListHydrantData',
   components: { DeptSelect },
-  /* filters: {
-    dataFilter(val) {
-      if (val === '40%LEL' || val === '60%LEL') {
-        return '0%LEL'
-      } else {
-        return val
-      }
-    }
-  }, */
   props: {
     type: {
       type: String,
@@ -75,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -91,10 +81,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', width: 170, align: 'center' },
@@ -105,17 +91,16 @@
         { text: '状态描述', value: 'descn', align: 'center' },
         { text: '消防栓状态', value: 'status', align: 'center' },
         { text: '上传时间', value: 'logtime', align: 'center' }
-        // { text: '点位编号', value: 'wellCode', align: 'center' },
-        // { text: '燃气浓度(%LEL)', value: 'strength', align: 'center', filter: true },
-        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
-        // { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -141,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -163,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取消防栓配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -186,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -207,35 +192,6 @@
 </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
 }
diff --git a/src/views/dataManage/deviceData/listLiquidData.vue b/src/views/dataManage/deviceData/listLiquidData.vue
index 96f28f6..d818684 100644
--- a/src/views/dataManage/deviceData/listLiquidData.vue
+++ b/src/views/dataManage/deviceData/listLiquidData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -26,45 +26,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('/liquiddata/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 align="center" type="selection" width="55"/>-->
-        <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('/liquiddata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,6 +58,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: 'ListLiquidData',
@@ -84,7 +70,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,74 +87,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '液位值(m)',
-          value: 'liquiddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '液位值(m)', value: 'liquiddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -204,16 +140,10 @@
       })
       batchExportLiquidData(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()
       })
@@ -228,69 +158,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listLiquidGasData.vue b/src/views/dataManage/deviceData/listLiquidGasData.vue
index 160edde..f2801c2 100644
--- a/src/views/dataManage/deviceData/listLiquidGasData.vue
+++ b/src/views/dataManage/deviceData/listLiquidGasData.vue
@@ -9,7 +9,8 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
+          size="small"
           dept-type="03"
           placeholder="选择权属单位/使用单位"
         />
@@ -32,46 +33,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('/liquidGasData/export')" :disabled="list.length === 0" 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 align="center" type="selection" width="55"/>-->
-        <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('/liquidGasData/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-if="column.unitFilter">{{ scope.row[column.value]|unit }}</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>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>
   </app-container>
 </template>
 
@@ -80,6 +65,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: 'ListLiquidGasData',
@@ -104,7 +90,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -122,80 +108,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '燃气浓度',
-          value: 'data',
-          align: 'center',
-          unitFilter: true
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'companyName',
-          align: 'center'
-        },
-        {
-          text: '使用单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '燃气浓度', value: 'data', align: 'center', unitFilter: true },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'companyName', align: 'center' },
+        { text: '使用单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -235,20 +166,10 @@
       })
       batchExportLiquidGasData(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
-        if (this.listQuery.sensorType === 'liquid') {
-          downloadElement.download = `燃气智能终端（一体化）数据-液位.xlsx` // 下载后文件名
-        } else {
-          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()
       })
@@ -359,69 +280,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidGasData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listNoiseData.vue b/src/views/dataManage/deviceData/listNoiseData.vue
index 5e31021..ab4faf4 100644
--- a/src/views/dataManage/deviceData/listNoiseData.vue
+++ b/src/views/dataManage/deviceData/listNoiseData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/noisedata/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 align="center" type="selection" width="55"/>-->
-        <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('/noisedata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListNoiseData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        // { text: '状态描述', value: 'descn', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -209,15 +141,10 @@
       })
       batchExportNoiseData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +159,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getNoiseData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listPantiltData.vue b/src/views/dataManage/deviceData/listPantiltData.vue
index c2030da..1609544 100644
--- a/src/views/dataManage/deviceData/listPantiltData.vue
+++ b/src/views/dataManage/deviceData/listPantiltData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/pantilt/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('/pantilt/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listTempData.vue b/src/views/dataManage/deviceData/listTempData.vue
index ceb3b61..33a3a93 100644
--- a/src/views/dataManage/deviceData/listTempData.vue
+++ b/src/views/dataManage/deviceData/listTempData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/tempdata//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 align="center" type="selection" width="55"/>-->
-        <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('/tempdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListTempData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,79 +88,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '温度(℃)',
-          value: 'temperature',
-          align: 'center'
-        },
-        {
-          text: '湿度(%RH)',
-          value: 'humidity',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '温度(℃)', value: 'temperature', align: 'center' },
+        { text: '湿度(%RH)', value: 'humidity', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -207,15 +141,10 @@
       })
       batchExportTempData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -230,69 +159,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getTempData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index b9e5ee6..09fb191 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-card :body-style="{ padding: '0px' }" shadow="always">
-    <div class="card-panel" >
+  <el-card :body-style="{ padding: '0px' }" :shadow="shadow">
+    <div class="card-panel">
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
@@ -24,27 +24,31 @@
     title: {
       type: String,
       default: '标题'
-    },
+    }, // 标题
     flags: {
       type: String,
       default: '单位'
-    },
+    }, // 单位
     subtitle: {
       type: String,
       default: ''
-    },
+    }, // 小标题
     icon: {
       type: String,
       default: ''
-    },
+    }, // 图标
     context: {
       type: [String, Number],
       default: ''
-    },
+    }, // 内容
     color: {
       type: String,
       default: '#40c9c6'
-    }
+    }, // 图标颜色
+    shadow: {
+      type: String,
+      default: 'always'
+    } // 卡片阴影
   },
   computed: {
     backgroundColor() {
diff --git a/src/components/BigData/Card/panelCard.vue b/src/components/BigData/Card/panelCard.vue
new file mode 100644
index 0000000..d6a7b89
--- /dev/null
+++ b/src/components/BigData/Card/panelCard.vue
@@ -0,0 +1,51 @@
+<template>
+  <div class="panel-container">
+    <div class="panel-title">
+      {{ title }}
+      <div class="title-right">
+        <slot name="func" />
+      </div>
+    </div>
+    <div class="panel-body">
+      <slot />
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'PanelCard',
+  props: {
+    // 标题
+    title: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.panel-container{
+  width: 100%;
+  padding: 10px;
+  border: 1px solid #EBEEF5 ;
+  .panel-title{
+    width: 100%;
+    line-height: 2;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0px 10px;
+    border-left: 5px solid #66b1ff;
+    position: relative;
+    .title-right{
+      display: inline-block;
+      position: absolute;
+      right: 10px;
+    }
+  }
+  .panel-body{
+    padding: 5px 0px;
+    height:auto;
+  }
+}
+</style>
diff --git a/src/icons/svg/icon-database.svg b/src/icons/svg/icon-database.svg
new file mode 100644
index 0000000..d3dd1c8
--- /dev/null
+++ b/src/icons/svg/icon-database.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1658711872102" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1435" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M960 123.7C872.7 49.9 704.8 0 512 0S151.3 49.9 64 123.7C23.2 158.2 0 197.8 0 240V605.9c0 0.7 0 1.4 0.1 2H0v176c0 132.5 229.2 240 512 240s512-107.5 512-240V608h-0.1c0.1-1.8 0.1-3.5 0.1-5.3V240c0-42.2-23.2-81.8-64-116.3zM64 356.3C151.3 430.1 319.2 480 512 480s360.7-49.9 448-123.7v79.2c-17.9 11.5-37.5 22.2-58.8 32.2C796.2 516.9 658 544 512 544s-284.2-27.1-389.2-76.4c-21.3-10-40.9-20.7-58.8-32.2v-79.1z m0 181.3c87.3 73.8 255.2 123.7 448 123.7s360.7-49.9 448-123.7v79.2c-17.9 11.4-37.5 22.2-58.8 32.2-105 49.2-243.3 76.3-389.2 76.3S227.8 698.2 122.8 649c-21.3-10-40.9-20.7-58.8-32.2v-79.2z m837.2 292.7c-105 49.2-243.3 76.3-389.2 76.3s-284.2-27.1-389.2-76.3c-20.3-9.5-39.1-19.8-56.4-30.6-1.6-5.3-2.4-10.5-2.4-15.7v-65c87.3 73.8 255.2 123.7 448 123.7s360.7-50 448-123.7v65c0 5.1-0.8 10.4-2.4 15.7-17.3 10.9-36.1 21.1-56.4 30.6z" p-id="1436"></path></svg>
\ No newline at end of file
diff --git a/src/views/dataManage/dataManage.vue b/src/views/dataManage/dataManage.vue
index 71be03f..0564cdd 100644
--- a/src/views/dataManage/dataManage.vue
+++ b/src/views/dataManage/dataManage.vue
@@ -31,19 +31,19 @@
     return {
       activeName: 'wellcover',
       tabList: [
-        { permission: '/welldata/list', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
-        { permission: '/liquiddata/list', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
-        { permission: '/gasdata/list', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
-        { permission: '/digdata/list', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
-        { permission: '/noisedata/list', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
-        { permission: '/harmfuldata/list', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
-        { permission: '/tempdata/list', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
-        { permission: '/welllocadata/list', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
-        { permission: '/liquidGasData/list', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
-        { permission: '/tubedata/list', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
-        { permission: '/gasdector/listPage', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
-        { permission: '/pantilt/listPage', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
-        { permission: '/hydrantdata/list', label: '消防栓数据列表', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
+        { permission: '/welldata/list-page', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
+        { permission: '/liquiddata/list-page', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
+        { permission: '/gasdata/list-page', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
+        { permission: '/digdata/list-page', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
+        { permission: '/noisedata/list-page', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
+        { permission: '/harmfuldata/list-page', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
+        { permission: '/tempdata/list-page', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
+        { permission: '/welllocadata/list-page', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
+        { permission: '/liquidGasData/list-page', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
+        { permission: '/tubedata/list-page', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
+        { permission: '/gasdector/list-page', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
+        { permission: '/pantilt/list-page', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
+        { permission: '/hydrantdata/list-page', label: '消防栓防盗水监测仪', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
       ] // 所有tab列表
     }
   },
diff --git a/src/views/dataManage/deviceData/listDigData.vue b/src/views/dataManage/deviceData/listDigData.vue
index fa4bbc7..3cb74ad 100644
--- a/src/views/dataManage/deviceData/listDigData.vue
+++ b/src/views/dataManage/deviceData/listDigData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/digdata/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 align="center" type="selection" width="55"/>-->
-        <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('/digdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListDigData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -185,6 +116,8 @@
       if (params && params.deviceType === this.type && params.devcode) {
         this.listQuery.keywords = params.devcode
         this.fetchData()
+      } else {
+        this.fetchData()
       }
     }
   },
@@ -203,21 +136,16 @@
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
-        text: '数据处理中,请稍后...',
+        text: '下载中,请稍后...',
         spinner: 'el-icon-loading',
         background: 'rgba(0, 0, 0, 0.7)'
       })
       batchExportDigData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +160,50 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getDigData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         return 'warning-state'
       }
     },
-    indexMethod(index) {
-      return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
-    },
-    // 改变页容量
-    handleSizeChange(val) {
-      this.listQuery.limit = val
+    // checkState(row) {
+    //   if (row.status !== '0') {
+    //     return 'warning-state'
+    //   }
+    // },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    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
   }
diff --git a/src/views/dataManage/deviceData/listGasdectorData.vue b/src/views/dataManage/deviceData/listGasdectorData.vue
index a78b8da..b4ecd07 100644
--- a/src/views/dataManage/deviceData/listGasdectorData.vue
+++ b/src/views/dataManage/deviceData/listGasdectorData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/gasdector/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('/liquidGasData/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listHarmfulData.vue b/src/views/dataManage/deviceData/listHarmfulData.vue
index dde92b4..c29cb2e 100644
--- a/src/views/dataManage/deviceData/listHarmfulData.vue
+++ b/src/views/dataManage/deviceData/listHarmfulData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -27,44 +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('/harmfuldata/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 align="center" type="selection" width="55"/>-->
-        <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('/harmfuldata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,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: 'ListHarmfulData',
@@ -84,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,92 +88,32 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: 'CO浓度(ppm)',
-          value: 'CO',
-          align: 'center'
-        },
-        {
-          text: 'CH4浓度(%VOL)',
-          value: 'CH4',
-          align: 'center'
-        },
-        {
-          text: 'H2S浓度(ppm)',
-          value: 'H2S',
-          align: 'center'
-        },
-        {
-          text: 'O2浓度(ppm)',
-          value: 'O2',
-          align: 'center'
-        },
-        {
-          text: '液位开关',
-          value: 'switch',
-          align: 'center'
-        },
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: 'CO浓度(ppm)', value: 'CO', align: 'center' },
+        { text: 'CH4浓度(%VOL)', value: 'CH4', align: 'center' },
+        { text: 'H2S浓度(ppm)', value: 'H2S', align: 'center' },
+        { text: 'O2浓度(ppm)', value: 'O2', align: 'center' },
+        { text: '液位开关', value: 'switch', align: 'center' },
         // {
         //   text: '状态描述',
         //   value: 'descn',
         //   align: 'center'
         // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -221,15 +148,10 @@
       })
       batchExportHarmfulData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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 = `有害监测仪数s据.xlsx` // 下载后文件名
-        document.body.appendChild(downloadElement)
-        downloadElement.click() // 点击下载
-        document.body.removeChild(downloadElement) // 下载完成移除元素
-        window.URL.revokeObjectURL(href) // 释放blob对象
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
       })
@@ -244,69 +166,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getHarmfulData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listHydrantData.vue b/src/views/dataManage/deviceData/listHydrantData.vue
index 575345d..f968760 100644
--- a/src/views/dataManage/deviceData/listHydrantData.vue
+++ b/src/views/dataManage/deviceData/listHydrantData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -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('/hydrantdata/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('/hydrantdata/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>
 
@@ -59,15 +58,6 @@
 export default {
   name: 'ListHydrantData',
   components: { DeptSelect },
-  /* filters: {
-    dataFilter(val) {
-      if (val === '40%LEL' || val === '60%LEL') {
-        return '0%LEL'
-      } else {
-        return val
-      }
-    }
-  }, */
   props: {
     type: {
       type: String,
@@ -75,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -91,10 +81,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', width: 170, align: 'center' },
@@ -105,17 +91,16 @@
         { text: '状态描述', value: 'descn', align: 'center' },
         { text: '消防栓状态', value: 'status', align: 'center' },
         { text: '上传时间', value: 'logtime', align: 'center' }
-        // { text: '点位编号', value: 'wellCode', align: 'center' },
-        // { text: '燃气浓度(%LEL)', value: 'strength', align: 'center', filter: true },
-        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
-        // { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -141,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -163,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取消防栓配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -186,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -207,35 +192,6 @@
 </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
 }
diff --git a/src/views/dataManage/deviceData/listLiquidData.vue b/src/views/dataManage/deviceData/listLiquidData.vue
index 96f28f6..d818684 100644
--- a/src/views/dataManage/deviceData/listLiquidData.vue
+++ b/src/views/dataManage/deviceData/listLiquidData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -26,45 +26,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('/liquiddata/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 align="center" type="selection" width="55"/>-->
-        <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('/liquiddata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,6 +58,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: 'ListLiquidData',
@@ -84,7 +70,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,74 +87,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '液位值(m)',
-          value: 'liquiddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '液位值(m)', value: 'liquiddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -204,16 +140,10 @@
       })
       batchExportLiquidData(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()
       })
@@ -228,69 +158,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listLiquidGasData.vue b/src/views/dataManage/deviceData/listLiquidGasData.vue
index 160edde..f2801c2 100644
--- a/src/views/dataManage/deviceData/listLiquidGasData.vue
+++ b/src/views/dataManage/deviceData/listLiquidGasData.vue
@@ -9,7 +9,8 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
+          size="small"
           dept-type="03"
           placeholder="选择权属单位/使用单位"
         />
@@ -32,46 +33,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('/liquidGasData/export')" :disabled="list.length === 0" 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 align="center" type="selection" width="55"/>-->
-        <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('/liquidGasData/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-if="column.unitFilter">{{ scope.row[column.value]|unit }}</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>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>
   </app-container>
 </template>
 
@@ -80,6 +65,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: 'ListLiquidGasData',
@@ -104,7 +90,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -122,80 +108,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '燃气浓度',
-          value: 'data',
-          align: 'center',
-          unitFilter: true
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'companyName',
-          align: 'center'
-        },
-        {
-          text: '使用单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '燃气浓度', value: 'data', align: 'center', unitFilter: true },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'companyName', align: 'center' },
+        { text: '使用单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -235,20 +166,10 @@
       })
       batchExportLiquidGasData(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
-        if (this.listQuery.sensorType === 'liquid') {
-          downloadElement.download = `燃气智能终端（一体化）数据-液位.xlsx` // 下载后文件名
-        } else {
-          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()
       })
@@ -359,69 +280,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidGasData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listNoiseData.vue b/src/views/dataManage/deviceData/listNoiseData.vue
index 5e31021..ab4faf4 100644
--- a/src/views/dataManage/deviceData/listNoiseData.vue
+++ b/src/views/dataManage/deviceData/listNoiseData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/noisedata/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 align="center" type="selection" width="55"/>-->
-        <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('/noisedata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListNoiseData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        // { text: '状态描述', value: 'descn', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -209,15 +141,10 @@
       })
       batchExportNoiseData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +159,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getNoiseData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listPantiltData.vue b/src/views/dataManage/deviceData/listPantiltData.vue
index c2030da..1609544 100644
--- a/src/views/dataManage/deviceData/listPantiltData.vue
+++ b/src/views/dataManage/deviceData/listPantiltData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/pantilt/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('/pantilt/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listTempData.vue b/src/views/dataManage/deviceData/listTempData.vue
index ceb3b61..33a3a93 100644
--- a/src/views/dataManage/deviceData/listTempData.vue
+++ b/src/views/dataManage/deviceData/listTempData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/tempdata//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 align="center" type="selection" width="55"/>-->
-        <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('/tempdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListTempData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,79 +88,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '温度(℃)',
-          value: 'temperature',
-          align: 'center'
-        },
-        {
-          text: '湿度(%RH)',
-          value: 'humidity',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '温度(℃)', value: 'temperature', align: 'center' },
+        { text: '湿度(%RH)', value: 'humidity', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -207,15 +141,10 @@
       })
       batchExportTempData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -230,69 +159,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getTempData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listTubeData.vue b/src/views/dataManage/deviceData/listTubeData.vue
index a8c5267..e0e6ab8 100644
--- a/src/views/dataManage/deviceData/listTubeData.vue
+++ b/src/views/dataManage/deviceData/listTubeData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" :need-top="false" size="small" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -21,44 +21,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('/tubedata/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 align="center" type="selection" width="55"/>-->
-        <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('/tubedata/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>
-      </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>
   </app-container>
 </template>
 
@@ -67,6 +53,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: 'ListTubeData',
@@ -78,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -95,53 +82,22 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '燃气浓度(%LEL)',
-          value: 'strength',
-          align: 'center'
-        },
-        // {
-        //   text: '电量(%)',
-        //   value: 'cell',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   align: 'center'
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '燃气浓度(%LEL)', value: 'strength', align: 'center' },
+        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        // { text: '状态描述', value: 'descn', align: 'center' },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // multipleSelection: [], // 多选选中项
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       deviceTypeList: [], // 燃气配置类型列表
       deptProps: {
         parent: 'pid',
@@ -149,25 +105,12 @@
         label: 'name',
         children: 'children'
       }, // 权属单位树形下拉菜单
-      deptTreeList: null, // 组织树列表数据
-      showDeptTree: 0, // 是否显示权属单位下拉
-      showDeviceType: true, // 是否显示设备类型下拉
+      // deptTreeList: null, // 组织树列表数据
+      // showDeptTree: 0, // 是否显示权属单位下拉
+      // showDeviceType: true, // 是否显示设备类型下拉
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      editShow: false, // 是否显示编辑框
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -202,15 +145,10 @@
       })
       batchExportTubeData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -225,69 +163,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getTubeData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index b9e5ee6..09fb191 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-card :body-style="{ padding: '0px' }" shadow="always">
-    <div class="card-panel" >
+  <el-card :body-style="{ padding: '0px' }" :shadow="shadow">
+    <div class="card-panel">
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
@@ -24,27 +24,31 @@
     title: {
       type: String,
       default: '标题'
-    },
+    }, // 标题
     flags: {
       type: String,
       default: '单位'
-    },
+    }, // 单位
     subtitle: {
       type: String,
       default: ''
-    },
+    }, // 小标题
     icon: {
       type: String,
       default: ''
-    },
+    }, // 图标
     context: {
       type: [String, Number],
       default: ''
-    },
+    }, // 内容
     color: {
       type: String,
       default: '#40c9c6'
-    }
+    }, // 图标颜色
+    shadow: {
+      type: String,
+      default: 'always'
+    } // 卡片阴影
   },
   computed: {
     backgroundColor() {
diff --git a/src/components/BigData/Card/panelCard.vue b/src/components/BigData/Card/panelCard.vue
new file mode 100644
index 0000000..d6a7b89
--- /dev/null
+++ b/src/components/BigData/Card/panelCard.vue
@@ -0,0 +1,51 @@
+<template>
+  <div class="panel-container">
+    <div class="panel-title">
+      {{ title }}
+      <div class="title-right">
+        <slot name="func" />
+      </div>
+    </div>
+    <div class="panel-body">
+      <slot />
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'PanelCard',
+  props: {
+    // 标题
+    title: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.panel-container{
+  width: 100%;
+  padding: 10px;
+  border: 1px solid #EBEEF5 ;
+  .panel-title{
+    width: 100%;
+    line-height: 2;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0px 10px;
+    border-left: 5px solid #66b1ff;
+    position: relative;
+    .title-right{
+      display: inline-block;
+      position: absolute;
+      right: 10px;
+    }
+  }
+  .panel-body{
+    padding: 5px 0px;
+    height:auto;
+  }
+}
+</style>
diff --git a/src/icons/svg/icon-database.svg b/src/icons/svg/icon-database.svg
new file mode 100644
index 0000000..d3dd1c8
--- /dev/null
+++ b/src/icons/svg/icon-database.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1658711872102" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1435" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M960 123.7C872.7 49.9 704.8 0 512 0S151.3 49.9 64 123.7C23.2 158.2 0 197.8 0 240V605.9c0 0.7 0 1.4 0.1 2H0v176c0 132.5 229.2 240 512 240s512-107.5 512-240V608h-0.1c0.1-1.8 0.1-3.5 0.1-5.3V240c0-42.2-23.2-81.8-64-116.3zM64 356.3C151.3 430.1 319.2 480 512 480s360.7-49.9 448-123.7v79.2c-17.9 11.5-37.5 22.2-58.8 32.2C796.2 516.9 658 544 512 544s-284.2-27.1-389.2-76.4c-21.3-10-40.9-20.7-58.8-32.2v-79.1z m0 181.3c87.3 73.8 255.2 123.7 448 123.7s360.7-49.9 448-123.7v79.2c-17.9 11.4-37.5 22.2-58.8 32.2-105 49.2-243.3 76.3-389.2 76.3S227.8 698.2 122.8 649c-21.3-10-40.9-20.7-58.8-32.2v-79.2z m837.2 292.7c-105 49.2-243.3 76.3-389.2 76.3s-284.2-27.1-389.2-76.3c-20.3-9.5-39.1-19.8-56.4-30.6-1.6-5.3-2.4-10.5-2.4-15.7v-65c87.3 73.8 255.2 123.7 448 123.7s360.7-50 448-123.7v65c0 5.1-0.8 10.4-2.4 15.7-17.3 10.9-36.1 21.1-56.4 30.6z" p-id="1436"></path></svg>
\ No newline at end of file
diff --git a/src/views/dataManage/dataManage.vue b/src/views/dataManage/dataManage.vue
index 71be03f..0564cdd 100644
--- a/src/views/dataManage/dataManage.vue
+++ b/src/views/dataManage/dataManage.vue
@@ -31,19 +31,19 @@
     return {
       activeName: 'wellcover',
       tabList: [
-        { permission: '/welldata/list', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
-        { permission: '/liquiddata/list', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
-        { permission: '/gasdata/list', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
-        { permission: '/digdata/list', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
-        { permission: '/noisedata/list', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
-        { permission: '/harmfuldata/list', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
-        { permission: '/tempdata/list', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
-        { permission: '/welllocadata/list', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
-        { permission: '/liquidGasData/list', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
-        { permission: '/tubedata/list', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
-        { permission: '/gasdector/listPage', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
-        { permission: '/pantilt/listPage', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
-        { permission: '/hydrantdata/list', label: '消防栓数据列表', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
+        { permission: '/welldata/list-page', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
+        { permission: '/liquiddata/list-page', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
+        { permission: '/gasdata/list-page', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
+        { permission: '/digdata/list-page', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
+        { permission: '/noisedata/list-page', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
+        { permission: '/harmfuldata/list-page', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
+        { permission: '/tempdata/list-page', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
+        { permission: '/welllocadata/list-page', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
+        { permission: '/liquidGasData/list-page', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
+        { permission: '/tubedata/list-page', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
+        { permission: '/gasdector/list-page', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
+        { permission: '/pantilt/list-page', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
+        { permission: '/hydrantdata/list-page', label: '消防栓防盗水监测仪', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
       ] // 所有tab列表
     }
   },
diff --git a/src/views/dataManage/deviceData/listDigData.vue b/src/views/dataManage/deviceData/listDigData.vue
index fa4bbc7..3cb74ad 100644
--- a/src/views/dataManage/deviceData/listDigData.vue
+++ b/src/views/dataManage/deviceData/listDigData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/digdata/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 align="center" type="selection" width="55"/>-->
-        <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('/digdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListDigData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -185,6 +116,8 @@
       if (params && params.deviceType === this.type && params.devcode) {
         this.listQuery.keywords = params.devcode
         this.fetchData()
+      } else {
+        this.fetchData()
       }
     }
   },
@@ -203,21 +136,16 @@
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
-        text: '数据处理中,请稍后...',
+        text: '下载中,请稍后...',
         spinner: 'el-icon-loading',
         background: 'rgba(0, 0, 0, 0.7)'
       })
       batchExportDigData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +160,50 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getDigData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         return 'warning-state'
       }
     },
-    indexMethod(index) {
-      return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
-    },
-    // 改变页容量
-    handleSizeChange(val) {
-      this.listQuery.limit = val
+    // checkState(row) {
+    //   if (row.status !== '0') {
+    //     return 'warning-state'
+    //   }
+    // },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    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
   }
diff --git a/src/views/dataManage/deviceData/listGasdectorData.vue b/src/views/dataManage/deviceData/listGasdectorData.vue
index a78b8da..b4ecd07 100644
--- a/src/views/dataManage/deviceData/listGasdectorData.vue
+++ b/src/views/dataManage/deviceData/listGasdectorData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/gasdector/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('/liquidGasData/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listHarmfulData.vue b/src/views/dataManage/deviceData/listHarmfulData.vue
index dde92b4..c29cb2e 100644
--- a/src/views/dataManage/deviceData/listHarmfulData.vue
+++ b/src/views/dataManage/deviceData/listHarmfulData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -27,44 +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('/harmfuldata/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 align="center" type="selection" width="55"/>-->
-        <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('/harmfuldata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,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: 'ListHarmfulData',
@@ -84,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,92 +88,32 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: 'CO浓度(ppm)',
-          value: 'CO',
-          align: 'center'
-        },
-        {
-          text: 'CH4浓度(%VOL)',
-          value: 'CH4',
-          align: 'center'
-        },
-        {
-          text: 'H2S浓度(ppm)',
-          value: 'H2S',
-          align: 'center'
-        },
-        {
-          text: 'O2浓度(ppm)',
-          value: 'O2',
-          align: 'center'
-        },
-        {
-          text: '液位开关',
-          value: 'switch',
-          align: 'center'
-        },
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: 'CO浓度(ppm)', value: 'CO', align: 'center' },
+        { text: 'CH4浓度(%VOL)', value: 'CH4', align: 'center' },
+        { text: 'H2S浓度(ppm)', value: 'H2S', align: 'center' },
+        { text: 'O2浓度(ppm)', value: 'O2', align: 'center' },
+        { text: '液位开关', value: 'switch', align: 'center' },
         // {
         //   text: '状态描述',
         //   value: 'descn',
         //   align: 'center'
         // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -221,15 +148,10 @@
       })
       batchExportHarmfulData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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 = `有害监测仪数s据.xlsx` // 下载后文件名
-        document.body.appendChild(downloadElement)
-        downloadElement.click() // 点击下载
-        document.body.removeChild(downloadElement) // 下载完成移除元素
-        window.URL.revokeObjectURL(href) // 释放blob对象
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
       })
@@ -244,69 +166,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getHarmfulData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listHydrantData.vue b/src/views/dataManage/deviceData/listHydrantData.vue
index 575345d..f968760 100644
--- a/src/views/dataManage/deviceData/listHydrantData.vue
+++ b/src/views/dataManage/deviceData/listHydrantData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -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('/hydrantdata/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('/hydrantdata/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>
 
@@ -59,15 +58,6 @@
 export default {
   name: 'ListHydrantData',
   components: { DeptSelect },
-  /* filters: {
-    dataFilter(val) {
-      if (val === '40%LEL' || val === '60%LEL') {
-        return '0%LEL'
-      } else {
-        return val
-      }
-    }
-  }, */
   props: {
     type: {
       type: String,
@@ -75,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -91,10 +81,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', width: 170, align: 'center' },
@@ -105,17 +91,16 @@
         { text: '状态描述', value: 'descn', align: 'center' },
         { text: '消防栓状态', value: 'status', align: 'center' },
         { text: '上传时间', value: 'logtime', align: 'center' }
-        // { text: '点位编号', value: 'wellCode', align: 'center' },
-        // { text: '燃气浓度(%LEL)', value: 'strength', align: 'center', filter: true },
-        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
-        // { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -141,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -163,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取消防栓配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -186,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -207,35 +192,6 @@
 </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
 }
diff --git a/src/views/dataManage/deviceData/listLiquidData.vue b/src/views/dataManage/deviceData/listLiquidData.vue
index 96f28f6..d818684 100644
--- a/src/views/dataManage/deviceData/listLiquidData.vue
+++ b/src/views/dataManage/deviceData/listLiquidData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -26,45 +26,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('/liquiddata/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 align="center" type="selection" width="55"/>-->
-        <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('/liquiddata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,6 +58,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: 'ListLiquidData',
@@ -84,7 +70,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,74 +87,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '液位值(m)',
-          value: 'liquiddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '液位值(m)', value: 'liquiddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -204,16 +140,10 @@
       })
       batchExportLiquidData(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()
       })
@@ -228,69 +158,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listLiquidGasData.vue b/src/views/dataManage/deviceData/listLiquidGasData.vue
index 160edde..f2801c2 100644
--- a/src/views/dataManage/deviceData/listLiquidGasData.vue
+++ b/src/views/dataManage/deviceData/listLiquidGasData.vue
@@ -9,7 +9,8 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
+          size="small"
           dept-type="03"
           placeholder="选择权属单位/使用单位"
         />
@@ -32,46 +33,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('/liquidGasData/export')" :disabled="list.length === 0" 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 align="center" type="selection" width="55"/>-->
-        <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('/liquidGasData/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-if="column.unitFilter">{{ scope.row[column.value]|unit }}</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>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>
   </app-container>
 </template>
 
@@ -80,6 +65,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: 'ListLiquidGasData',
@@ -104,7 +90,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -122,80 +108,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '燃气浓度',
-          value: 'data',
-          align: 'center',
-          unitFilter: true
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'companyName',
-          align: 'center'
-        },
-        {
-          text: '使用单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '燃气浓度', value: 'data', align: 'center', unitFilter: true },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'companyName', align: 'center' },
+        { text: '使用单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -235,20 +166,10 @@
       })
       batchExportLiquidGasData(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
-        if (this.listQuery.sensorType === 'liquid') {
-          downloadElement.download = `燃气智能终端（一体化）数据-液位.xlsx` // 下载后文件名
-        } else {
-          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()
       })
@@ -359,69 +280,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidGasData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listNoiseData.vue b/src/views/dataManage/deviceData/listNoiseData.vue
index 5e31021..ab4faf4 100644
--- a/src/views/dataManage/deviceData/listNoiseData.vue
+++ b/src/views/dataManage/deviceData/listNoiseData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/noisedata/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 align="center" type="selection" width="55"/>-->
-        <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('/noisedata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListNoiseData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        // { text: '状态描述', value: 'descn', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -209,15 +141,10 @@
       })
       batchExportNoiseData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +159,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getNoiseData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listPantiltData.vue b/src/views/dataManage/deviceData/listPantiltData.vue
index c2030da..1609544 100644
--- a/src/views/dataManage/deviceData/listPantiltData.vue
+++ b/src/views/dataManage/deviceData/listPantiltData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/pantilt/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('/pantilt/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listTempData.vue b/src/views/dataManage/deviceData/listTempData.vue
index ceb3b61..33a3a93 100644
--- a/src/views/dataManage/deviceData/listTempData.vue
+++ b/src/views/dataManage/deviceData/listTempData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/tempdata//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 align="center" type="selection" width="55"/>-->
-        <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('/tempdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListTempData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,79 +88,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '温度(℃)',
-          value: 'temperature',
-          align: 'center'
-        },
-        {
-          text: '湿度(%RH)',
-          value: 'humidity',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '温度(℃)', value: 'temperature', align: 'center' },
+        { text: '湿度(%RH)', value: 'humidity', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -207,15 +141,10 @@
       })
       batchExportTempData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -230,69 +159,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getTempData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listTubeData.vue b/src/views/dataManage/deviceData/listTubeData.vue
index a8c5267..e0e6ab8 100644
--- a/src/views/dataManage/deviceData/listTubeData.vue
+++ b/src/views/dataManage/deviceData/listTubeData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" :need-top="false" size="small" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -21,44 +21,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('/tubedata/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 align="center" type="selection" width="55"/>-->
-        <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('/tubedata/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>
-      </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>
   </app-container>
 </template>
 
@@ -67,6 +53,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: 'ListTubeData',
@@ -78,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -95,53 +82,22 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '燃气浓度(%LEL)',
-          value: 'strength',
-          align: 'center'
-        },
-        // {
-        //   text: '电量(%)',
-        //   value: 'cell',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   align: 'center'
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '燃气浓度(%LEL)', value: 'strength', align: 'center' },
+        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        // { text: '状态描述', value: 'descn', align: 'center' },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // multipleSelection: [], // 多选选中项
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       deviceTypeList: [], // 燃气配置类型列表
       deptProps: {
         parent: 'pid',
@@ -149,25 +105,12 @@
         label: 'name',
         children: 'children'
       }, // 权属单位树形下拉菜单
-      deptTreeList: null, // 组织树列表数据
-      showDeptTree: 0, // 是否显示权属单位下拉
-      showDeviceType: true, // 是否显示设备类型下拉
+      // deptTreeList: null, // 组织树列表数据
+      // showDeptTree: 0, // 是否显示权属单位下拉
+      // showDeviceType: true, // 是否显示设备类型下拉
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      editShow: false, // 是否显示编辑框
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -202,15 +145,10 @@
       })
       batchExportTubeData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -225,69 +163,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getTubeData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listWellLocaData.vue b/src/views/dataManage/deviceData/listWellLocaData.vue
index 66722a2..e9609c8 100644
--- a/src/views/dataManage/deviceData/listWellLocaData.vue
+++ b/src/views/dataManage/deviceData/listWellLocaData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/welllocadata/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 align="center" type="selection" width="55"/>-->
-        <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('/welllocadata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListWellLocaData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,72 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '经度',
-          value: 'lng',
-          align: 'center'
-        },
-        {
-          text: '纬度',
-          value: 'lat',
-          align: 'center'
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'logtime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '经度', value: 'lng', align: 'center' },
+        { text: '纬度', value: 'lat', align: 'center' },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'logtime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -200,15 +140,10 @@
       })
       batchExportWellLocaData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -223,69 +158,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getWellLocaData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index b9e5ee6..09fb191 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-card :body-style="{ padding: '0px' }" shadow="always">
-    <div class="card-panel" >
+  <el-card :body-style="{ padding: '0px' }" :shadow="shadow">
+    <div class="card-panel">
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
@@ -24,27 +24,31 @@
     title: {
       type: String,
       default: '标题'
-    },
+    }, // 标题
     flags: {
       type: String,
       default: '单位'
-    },
+    }, // 单位
     subtitle: {
       type: String,
       default: ''
-    },
+    }, // 小标题
     icon: {
       type: String,
       default: ''
-    },
+    }, // 图标
     context: {
       type: [String, Number],
       default: ''
-    },
+    }, // 内容
     color: {
       type: String,
       default: '#40c9c6'
-    }
+    }, // 图标颜色
+    shadow: {
+      type: String,
+      default: 'always'
+    } // 卡片阴影
   },
   computed: {
     backgroundColor() {
diff --git a/src/components/BigData/Card/panelCard.vue b/src/components/BigData/Card/panelCard.vue
new file mode 100644
index 0000000..d6a7b89
--- /dev/null
+++ b/src/components/BigData/Card/panelCard.vue
@@ -0,0 +1,51 @@
+<template>
+  <div class="panel-container">
+    <div class="panel-title">
+      {{ title }}
+      <div class="title-right">
+        <slot name="func" />
+      </div>
+    </div>
+    <div class="panel-body">
+      <slot />
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'PanelCard',
+  props: {
+    // 标题
+    title: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.panel-container{
+  width: 100%;
+  padding: 10px;
+  border: 1px solid #EBEEF5 ;
+  .panel-title{
+    width: 100%;
+    line-height: 2;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0px 10px;
+    border-left: 5px solid #66b1ff;
+    position: relative;
+    .title-right{
+      display: inline-block;
+      position: absolute;
+      right: 10px;
+    }
+  }
+  .panel-body{
+    padding: 5px 0px;
+    height:auto;
+  }
+}
+</style>
diff --git a/src/icons/svg/icon-database.svg b/src/icons/svg/icon-database.svg
new file mode 100644
index 0000000..d3dd1c8
--- /dev/null
+++ b/src/icons/svg/icon-database.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1658711872102" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1435" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M960 123.7C872.7 49.9 704.8 0 512 0S151.3 49.9 64 123.7C23.2 158.2 0 197.8 0 240V605.9c0 0.7 0 1.4 0.1 2H0v176c0 132.5 229.2 240 512 240s512-107.5 512-240V608h-0.1c0.1-1.8 0.1-3.5 0.1-5.3V240c0-42.2-23.2-81.8-64-116.3zM64 356.3C151.3 430.1 319.2 480 512 480s360.7-49.9 448-123.7v79.2c-17.9 11.5-37.5 22.2-58.8 32.2C796.2 516.9 658 544 512 544s-284.2-27.1-389.2-76.4c-21.3-10-40.9-20.7-58.8-32.2v-79.1z m0 181.3c87.3 73.8 255.2 123.7 448 123.7s360.7-49.9 448-123.7v79.2c-17.9 11.4-37.5 22.2-58.8 32.2-105 49.2-243.3 76.3-389.2 76.3S227.8 698.2 122.8 649c-21.3-10-40.9-20.7-58.8-32.2v-79.2z m837.2 292.7c-105 49.2-243.3 76.3-389.2 76.3s-284.2-27.1-389.2-76.3c-20.3-9.5-39.1-19.8-56.4-30.6-1.6-5.3-2.4-10.5-2.4-15.7v-65c87.3 73.8 255.2 123.7 448 123.7s360.7-50 448-123.7v65c0 5.1-0.8 10.4-2.4 15.7-17.3 10.9-36.1 21.1-56.4 30.6z" p-id="1436"></path></svg>
\ No newline at end of file
diff --git a/src/views/dataManage/dataManage.vue b/src/views/dataManage/dataManage.vue
index 71be03f..0564cdd 100644
--- a/src/views/dataManage/dataManage.vue
+++ b/src/views/dataManage/dataManage.vue
@@ -31,19 +31,19 @@
     return {
       activeName: 'wellcover',
       tabList: [
-        { permission: '/welldata/list', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
-        { permission: '/liquiddata/list', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
-        { permission: '/gasdata/list', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
-        { permission: '/digdata/list', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
-        { permission: '/noisedata/list', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
-        { permission: '/harmfuldata/list', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
-        { permission: '/tempdata/list', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
-        { permission: '/welllocadata/list', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
-        { permission: '/liquidGasData/list', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
-        { permission: '/tubedata/list', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
-        { permission: '/gasdector/listPage', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
-        { permission: '/pantilt/listPage', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
-        { permission: '/hydrantdata/list', label: '消防栓数据列表', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
+        { permission: '/welldata/list-page', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
+        { permission: '/liquiddata/list-page', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
+        { permission: '/gasdata/list-page', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
+        { permission: '/digdata/list-page', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
+        { permission: '/noisedata/list-page', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
+        { permission: '/harmfuldata/list-page', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
+        { permission: '/tempdata/list-page', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
+        { permission: '/welllocadata/list-page', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
+        { permission: '/liquidGasData/list-page', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
+        { permission: '/tubedata/list-page', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
+        { permission: '/gasdector/list-page', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
+        { permission: '/pantilt/list-page', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
+        { permission: '/hydrantdata/list-page', label: '消防栓防盗水监测仪', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
       ] // 所有tab列表
     }
   },
diff --git a/src/views/dataManage/deviceData/listDigData.vue b/src/views/dataManage/deviceData/listDigData.vue
index fa4bbc7..3cb74ad 100644
--- a/src/views/dataManage/deviceData/listDigData.vue
+++ b/src/views/dataManage/deviceData/listDigData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/digdata/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 align="center" type="selection" width="55"/>-->
-        <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('/digdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListDigData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -185,6 +116,8 @@
       if (params && params.deviceType === this.type && params.devcode) {
         this.listQuery.keywords = params.devcode
         this.fetchData()
+      } else {
+        this.fetchData()
       }
     }
   },
@@ -203,21 +136,16 @@
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
-        text: '数据处理中,请稍后...',
+        text: '下载中,请稍后...',
         spinner: 'el-icon-loading',
         background: 'rgba(0, 0, 0, 0.7)'
       })
       batchExportDigData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +160,50 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getDigData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         return 'warning-state'
       }
     },
-    indexMethod(index) {
-      return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
-    },
-    // 改变页容量
-    handleSizeChange(val) {
-      this.listQuery.limit = val
+    // checkState(row) {
+    //   if (row.status !== '0') {
+    //     return 'warning-state'
+    //   }
+    // },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    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
   }
diff --git a/src/views/dataManage/deviceData/listGasdectorData.vue b/src/views/dataManage/deviceData/listGasdectorData.vue
index a78b8da..b4ecd07 100644
--- a/src/views/dataManage/deviceData/listGasdectorData.vue
+++ b/src/views/dataManage/deviceData/listGasdectorData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/gasdector/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('/liquidGasData/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listHarmfulData.vue b/src/views/dataManage/deviceData/listHarmfulData.vue
index dde92b4..c29cb2e 100644
--- a/src/views/dataManage/deviceData/listHarmfulData.vue
+++ b/src/views/dataManage/deviceData/listHarmfulData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -27,44 +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('/harmfuldata/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 align="center" type="selection" width="55"/>-->
-        <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('/harmfuldata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,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: 'ListHarmfulData',
@@ -84,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,92 +88,32 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: 'CO浓度(ppm)',
-          value: 'CO',
-          align: 'center'
-        },
-        {
-          text: 'CH4浓度(%VOL)',
-          value: 'CH4',
-          align: 'center'
-        },
-        {
-          text: 'H2S浓度(ppm)',
-          value: 'H2S',
-          align: 'center'
-        },
-        {
-          text: 'O2浓度(ppm)',
-          value: 'O2',
-          align: 'center'
-        },
-        {
-          text: '液位开关',
-          value: 'switch',
-          align: 'center'
-        },
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: 'CO浓度(ppm)', value: 'CO', align: 'center' },
+        { text: 'CH4浓度(%VOL)', value: 'CH4', align: 'center' },
+        { text: 'H2S浓度(ppm)', value: 'H2S', align: 'center' },
+        { text: 'O2浓度(ppm)', value: 'O2', align: 'center' },
+        { text: '液位开关', value: 'switch', align: 'center' },
         // {
         //   text: '状态描述',
         //   value: 'descn',
         //   align: 'center'
         // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -221,15 +148,10 @@
       })
       batchExportHarmfulData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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 = `有害监测仪数s据.xlsx` // 下载后文件名
-        document.body.appendChild(downloadElement)
-        downloadElement.click() // 点击下载
-        document.body.removeChild(downloadElement) // 下载完成移除元素
-        window.URL.revokeObjectURL(href) // 释放blob对象
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
       })
@@ -244,69 +166,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getHarmfulData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listHydrantData.vue b/src/views/dataManage/deviceData/listHydrantData.vue
index 575345d..f968760 100644
--- a/src/views/dataManage/deviceData/listHydrantData.vue
+++ b/src/views/dataManage/deviceData/listHydrantData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -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('/hydrantdata/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('/hydrantdata/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>
 
@@ -59,15 +58,6 @@
 export default {
   name: 'ListHydrantData',
   components: { DeptSelect },
-  /* filters: {
-    dataFilter(val) {
-      if (val === '40%LEL' || val === '60%LEL') {
-        return '0%LEL'
-      } else {
-        return val
-      }
-    }
-  }, */
   props: {
     type: {
       type: String,
@@ -75,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -91,10 +81,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', width: 170, align: 'center' },
@@ -105,17 +91,16 @@
         { text: '状态描述', value: 'descn', align: 'center' },
         { text: '消防栓状态', value: 'status', align: 'center' },
         { text: '上传时间', value: 'logtime', align: 'center' }
-        // { text: '点位编号', value: 'wellCode', align: 'center' },
-        // { text: '燃气浓度(%LEL)', value: 'strength', align: 'center', filter: true },
-        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
-        // { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -141,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -163,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取消防栓配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -186,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -207,35 +192,6 @@
 </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
 }
diff --git a/src/views/dataManage/deviceData/listLiquidData.vue b/src/views/dataManage/deviceData/listLiquidData.vue
index 96f28f6..d818684 100644
--- a/src/views/dataManage/deviceData/listLiquidData.vue
+++ b/src/views/dataManage/deviceData/listLiquidData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -26,45 +26,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('/liquiddata/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 align="center" type="selection" width="55"/>-->
-        <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('/liquiddata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,6 +58,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: 'ListLiquidData',
@@ -84,7 +70,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,74 +87,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '液位值(m)',
-          value: 'liquiddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '液位值(m)', value: 'liquiddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -204,16 +140,10 @@
       })
       batchExportLiquidData(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()
       })
@@ -228,69 +158,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listLiquidGasData.vue b/src/views/dataManage/deviceData/listLiquidGasData.vue
index 160edde..f2801c2 100644
--- a/src/views/dataManage/deviceData/listLiquidGasData.vue
+++ b/src/views/dataManage/deviceData/listLiquidGasData.vue
@@ -9,7 +9,8 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
+          size="small"
           dept-type="03"
           placeholder="选择权属单位/使用单位"
         />
@@ -32,46 +33,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('/liquidGasData/export')" :disabled="list.length === 0" 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 align="center" type="selection" width="55"/>-->
-        <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('/liquidGasData/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-if="column.unitFilter">{{ scope.row[column.value]|unit }}</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>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>
   </app-container>
 </template>
 
@@ -80,6 +65,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: 'ListLiquidGasData',
@@ -104,7 +90,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -122,80 +108,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '燃气浓度',
-          value: 'data',
-          align: 'center',
-          unitFilter: true
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'companyName',
-          align: 'center'
-        },
-        {
-          text: '使用单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '燃气浓度', value: 'data', align: 'center', unitFilter: true },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'companyName', align: 'center' },
+        { text: '使用单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -235,20 +166,10 @@
       })
       batchExportLiquidGasData(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
-        if (this.listQuery.sensorType === 'liquid') {
-          downloadElement.download = `燃气智能终端（一体化）数据-液位.xlsx` // 下载后文件名
-        } else {
-          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()
       })
@@ -359,69 +280,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidGasData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listNoiseData.vue b/src/views/dataManage/deviceData/listNoiseData.vue
index 5e31021..ab4faf4 100644
--- a/src/views/dataManage/deviceData/listNoiseData.vue
+++ b/src/views/dataManage/deviceData/listNoiseData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/noisedata/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 align="center" type="selection" width="55"/>-->
-        <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('/noisedata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListNoiseData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        // { text: '状态描述', value: 'descn', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -209,15 +141,10 @@
       })
       batchExportNoiseData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +159,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getNoiseData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listPantiltData.vue b/src/views/dataManage/deviceData/listPantiltData.vue
index c2030da..1609544 100644
--- a/src/views/dataManage/deviceData/listPantiltData.vue
+++ b/src/views/dataManage/deviceData/listPantiltData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/pantilt/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('/pantilt/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listTempData.vue b/src/views/dataManage/deviceData/listTempData.vue
index ceb3b61..33a3a93 100644
--- a/src/views/dataManage/deviceData/listTempData.vue
+++ b/src/views/dataManage/deviceData/listTempData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/tempdata//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 align="center" type="selection" width="55"/>-->
-        <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('/tempdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListTempData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,79 +88,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '温度(℃)',
-          value: 'temperature',
-          align: 'center'
-        },
-        {
-          text: '湿度(%RH)',
-          value: 'humidity',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '温度(℃)', value: 'temperature', align: 'center' },
+        { text: '湿度(%RH)', value: 'humidity', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -207,15 +141,10 @@
       })
       batchExportTempData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -230,69 +159,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getTempData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listTubeData.vue b/src/views/dataManage/deviceData/listTubeData.vue
index a8c5267..e0e6ab8 100644
--- a/src/views/dataManage/deviceData/listTubeData.vue
+++ b/src/views/dataManage/deviceData/listTubeData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" :need-top="false" size="small" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -21,44 +21,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('/tubedata/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 align="center" type="selection" width="55"/>-->
-        <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('/tubedata/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>
-      </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>
   </app-container>
 </template>
 
@@ -67,6 +53,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: 'ListTubeData',
@@ -78,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -95,53 +82,22 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '燃气浓度(%LEL)',
-          value: 'strength',
-          align: 'center'
-        },
-        // {
-        //   text: '电量(%)',
-        //   value: 'cell',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   align: 'center'
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '燃气浓度(%LEL)', value: 'strength', align: 'center' },
+        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        // { text: '状态描述', value: 'descn', align: 'center' },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // multipleSelection: [], // 多选选中项
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       deviceTypeList: [], // 燃气配置类型列表
       deptProps: {
         parent: 'pid',
@@ -149,25 +105,12 @@
         label: 'name',
         children: 'children'
       }, // 权属单位树形下拉菜单
-      deptTreeList: null, // 组织树列表数据
-      showDeptTree: 0, // 是否显示权属单位下拉
-      showDeviceType: true, // 是否显示设备类型下拉
+      // deptTreeList: null, // 组织树列表数据
+      // showDeptTree: 0, // 是否显示权属单位下拉
+      // showDeviceType: true, // 是否显示设备类型下拉
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      editShow: false, // 是否显示编辑框
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -202,15 +145,10 @@
       })
       batchExportTubeData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -225,69 +163,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getTubeData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listWellLocaData.vue b/src/views/dataManage/deviceData/listWellLocaData.vue
index 66722a2..e9609c8 100644
--- a/src/views/dataManage/deviceData/listWellLocaData.vue
+++ b/src/views/dataManage/deviceData/listWellLocaData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/welllocadata/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 align="center" type="selection" width="55"/>-->
-        <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('/welllocadata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListWellLocaData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,72 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '经度',
-          value: 'lng',
-          align: 'center'
-        },
-        {
-          text: '纬度',
-          value: 'lat',
-          align: 'center'
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'logtime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '经度', value: 'lng', align: 'center' },
+        { text: '纬度', value: 'lat', align: 'center' },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'logtime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -200,15 +140,10 @@
       })
       batchExportWellLocaData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -223,69 +158,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getWellLocaData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataView/components/alarmStatus.vue b/src/views/dataView/components/alarmStatus.vue
deleted file mode 100644
index f2b74b5..0000000
--- a/src/views/dataView/components/alarmStatus.vue
+++ /dev/null
@@ -1,164 +0,0 @@
-<template>
-  <el-row :gutter="40" class="panel-group">
-    <div>
-      <el-col>
-        <div class="flagBoxStyle">
-          <div class="flagStyle" />
-          <div>工单情况</div>
-        </div>
-      </el-col>
-    </div>
-    <el-row>
-      <el-col :span="12">
-        <ve-bar
-          :data="chartData"
-          :grid="grid"
-          :extend="extend"
-          :settings="chartSettings"
-        />
-      </el-col>
-      <el-col :span="12">
-        <div class="tableStyle">
-          <el-table border :data="tableList" stripe>
-            <el-table-column prop="name" label="设备型号" />
-            <el-table-column prop="value" label="设备名称" />
-          </el-table>
-        </div>
-      </el-col>
-    </el-row>
-  </el-row>
-</template>
-
-<script>
-import { wellCountByBfzt } from '@/api/well/well'
-import { deviceStaticByStatus, alarmNowStatic } from '@/api/data/dataStatics'
-import { jobCountByStatus } from '@/api/alarm/job'
-export default {
-  name: 'AlarmStatus',
-  data() {
-    return {
-      // 柱状图
-      extend: {
-        xAxis: {
-          axisLabel: {
-            rotate: 30,
-            margin: 30,
-            textStyle: {
-              align: 'center'
-            }
-          }
-        },
-        series: {
-          label: { show: true, position: 'top' },
-          barMaxWidth: 35 // 最大柱宽度
-        }
-      },
-      grid: {
-        right: 60
-      },
-      chartSettings: {
-        itemStyle: {
-          'barCategoryGap': 5
-        },
-        barWidth: 15,
-        labelMap: {
-          'deviceType': '权属单位',
-          'offline': '设备数量（个）'
-        },
-        dimension: ['deviceType'],
-        metrics: ['offline']
-      },
-      chartData: {
-        columns: ['deviceType', 'offline'],
-        rows: []
-      },
-      tableList: [],
-      dataGroup: [
-        {
-          title: '井',
-          context: '--',
-          flags: '条',
-          icon: 'icon-alarm',
-          color: '#40c9c6',
-          permission: '/well/list'
-        }
-      ]
-    }
-  },
-  created() {
-    this.getWellCount()
-    this.getDeviceCount()
-    this.getAlarmCount()
-    this.getJobCount()
-  },
-  mounted() {
-    this.tableList = [
-      {
-        value: 'WELL-001',
-        name: '液位超限'
-      },
-      {
-        value: 'WELL-002',
-        name: '燃气浓度超限'
-      },
-      {
-        value: 'WELL-003',
-        name: '井盖开启'
-      },
-      {
-        value: 'WELL-004',
-        name: '井盖开启'
-      }
-    ]
-  },
-  methods: {
-    refresh() {
-      this.getAlarmCount()
-      this.getJobCount()
-    },
-    getWellCount() {
-      wellCountByBfzt().then(response => {
-        this.dataGroup[0].context = response.data.total
-      })
-    },
-    getDeviceCount() {
-      deviceStaticByStatus().then(response => {
-        this.dataGroup[1].context = response.data.total
-      })
-    },
-    getAlarmCount() {
-      alarmNowStatic().then(response => {
-        this.dataGroup[2].context = response.data.total
-      })
-    },
-    getJobCount() {
-      jobCountByStatus().then(response => {
-        const data = response.data
-        const total = data.beforeGet + data.beforeConfirm + data.inHandle
-        this.dataGroup[3].context = total
-      })
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.tableStyle{
-  padding: 20px;
-}
-.flagBoxStyle {
-  display: flex;
-  margin-bottom: 20px;
-}
-.flagBoxStyle div:nth-child(2){
-  line-height: 30px;
-  font-weight: 600;
-}
-.flagStyle {
-  width: 4px;
-  height: 30px;
-  margin-right: 6px;
-  background: rgb(64 121 242);
-}
-
-</style>

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index b9e5ee6..09fb191 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-card :body-style="{ padding: '0px' }" shadow="always">
-    <div class="card-panel" >
+  <el-card :body-style="{ padding: '0px' }" :shadow="shadow">
+    <div class="card-panel">
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
@@ -24,27 +24,31 @@
     title: {
       type: String,
       default: '标题'
-    },
+    }, // 标题
     flags: {
       type: String,
       default: '单位'
-    },
+    }, // 单位
     subtitle: {
       type: String,
       default: ''
-    },
+    }, // 小标题
     icon: {
       type: String,
       default: ''
-    },
+    }, // 图标
     context: {
       type: [String, Number],
       default: ''
-    },
+    }, // 内容
     color: {
       type: String,
       default: '#40c9c6'
-    }
+    }, // 图标颜色
+    shadow: {
+      type: String,
+      default: 'always'
+    } // 卡片阴影
   },
   computed: {
     backgroundColor() {
diff --git a/src/components/BigData/Card/panelCard.vue b/src/components/BigData/Card/panelCard.vue
new file mode 100644
index 0000000..d6a7b89
--- /dev/null
+++ b/src/components/BigData/Card/panelCard.vue
@@ -0,0 +1,51 @@
+<template>
+  <div class="panel-container">
+    <div class="panel-title">
+      {{ title }}
+      <div class="title-right">
+        <slot name="func" />
+      </div>
+    </div>
+    <div class="panel-body">
+      <slot />
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'PanelCard',
+  props: {
+    // 标题
+    title: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.panel-container{
+  width: 100%;
+  padding: 10px;
+  border: 1px solid #EBEEF5 ;
+  .panel-title{
+    width: 100%;
+    line-height: 2;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0px 10px;
+    border-left: 5px solid #66b1ff;
+    position: relative;
+    .title-right{
+      display: inline-block;
+      position: absolute;
+      right: 10px;
+    }
+  }
+  .panel-body{
+    padding: 5px 0px;
+    height:auto;
+  }
+}
+</style>
diff --git a/src/icons/svg/icon-database.svg b/src/icons/svg/icon-database.svg
new file mode 100644
index 0000000..d3dd1c8
--- /dev/null
+++ b/src/icons/svg/icon-database.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1658711872102" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1435" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M960 123.7C872.7 49.9 704.8 0 512 0S151.3 49.9 64 123.7C23.2 158.2 0 197.8 0 240V605.9c0 0.7 0 1.4 0.1 2H0v176c0 132.5 229.2 240 512 240s512-107.5 512-240V608h-0.1c0.1-1.8 0.1-3.5 0.1-5.3V240c0-42.2-23.2-81.8-64-116.3zM64 356.3C151.3 430.1 319.2 480 512 480s360.7-49.9 448-123.7v79.2c-17.9 11.5-37.5 22.2-58.8 32.2C796.2 516.9 658 544 512 544s-284.2-27.1-389.2-76.4c-21.3-10-40.9-20.7-58.8-32.2v-79.1z m0 181.3c87.3 73.8 255.2 123.7 448 123.7s360.7-49.9 448-123.7v79.2c-17.9 11.4-37.5 22.2-58.8 32.2-105 49.2-243.3 76.3-389.2 76.3S227.8 698.2 122.8 649c-21.3-10-40.9-20.7-58.8-32.2v-79.2z m837.2 292.7c-105 49.2-243.3 76.3-389.2 76.3s-284.2-27.1-389.2-76.3c-20.3-9.5-39.1-19.8-56.4-30.6-1.6-5.3-2.4-10.5-2.4-15.7v-65c87.3 73.8 255.2 123.7 448 123.7s360.7-50 448-123.7v65c0 5.1-0.8 10.4-2.4 15.7-17.3 10.9-36.1 21.1-56.4 30.6z" p-id="1436"></path></svg>
\ No newline at end of file
diff --git a/src/views/dataManage/dataManage.vue b/src/views/dataManage/dataManage.vue
index 71be03f..0564cdd 100644
--- a/src/views/dataManage/dataManage.vue
+++ b/src/views/dataManage/dataManage.vue
@@ -31,19 +31,19 @@
     return {
       activeName: 'wellcover',
       tabList: [
-        { permission: '/welldata/list', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
-        { permission: '/liquiddata/list', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
-        { permission: '/gasdata/list', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
-        { permission: '/digdata/list', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
-        { permission: '/noisedata/list', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
-        { permission: '/harmfuldata/list', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
-        { permission: '/tempdata/list', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
-        { permission: '/welllocadata/list', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
-        { permission: '/liquidGasData/list', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
-        { permission: '/tubedata/list', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
-        { permission: '/gasdector/listPage', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
-        { permission: '/pantilt/listPage', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
-        { permission: '/hydrantdata/list', label: '消防栓数据列表', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
+        { permission: '/welldata/list-page', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
+        { permission: '/liquiddata/list-page', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
+        { permission: '/gasdata/list-page', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
+        { permission: '/digdata/list-page', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
+        { permission: '/noisedata/list-page', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
+        { permission: '/harmfuldata/list-page', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
+        { permission: '/tempdata/list-page', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
+        { permission: '/welllocadata/list-page', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
+        { permission: '/liquidGasData/list-page', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
+        { permission: '/tubedata/list-page', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
+        { permission: '/gasdector/list-page', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
+        { permission: '/pantilt/list-page', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
+        { permission: '/hydrantdata/list-page', label: '消防栓防盗水监测仪', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
       ] // 所有tab列表
     }
   },
diff --git a/src/views/dataManage/deviceData/listDigData.vue b/src/views/dataManage/deviceData/listDigData.vue
index fa4bbc7..3cb74ad 100644
--- a/src/views/dataManage/deviceData/listDigData.vue
+++ b/src/views/dataManage/deviceData/listDigData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/digdata/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 align="center" type="selection" width="55"/>-->
-        <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('/digdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListDigData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -185,6 +116,8 @@
       if (params && params.deviceType === this.type && params.devcode) {
         this.listQuery.keywords = params.devcode
         this.fetchData()
+      } else {
+        this.fetchData()
       }
     }
   },
@@ -203,21 +136,16 @@
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
-        text: '数据处理中,请稍后...',
+        text: '下载中,请稍后...',
         spinner: 'el-icon-loading',
         background: 'rgba(0, 0, 0, 0.7)'
       })
       batchExportDigData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +160,50 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getDigData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         return 'warning-state'
       }
     },
-    indexMethod(index) {
-      return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
-    },
-    // 改变页容量
-    handleSizeChange(val) {
-      this.listQuery.limit = val
+    // checkState(row) {
+    //   if (row.status !== '0') {
+    //     return 'warning-state'
+    //   }
+    // },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    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
   }
diff --git a/src/views/dataManage/deviceData/listGasdectorData.vue b/src/views/dataManage/deviceData/listGasdectorData.vue
index a78b8da..b4ecd07 100644
--- a/src/views/dataManage/deviceData/listGasdectorData.vue
+++ b/src/views/dataManage/deviceData/listGasdectorData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/gasdector/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('/liquidGasData/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listHarmfulData.vue b/src/views/dataManage/deviceData/listHarmfulData.vue
index dde92b4..c29cb2e 100644
--- a/src/views/dataManage/deviceData/listHarmfulData.vue
+++ b/src/views/dataManage/deviceData/listHarmfulData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -27,44 +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('/harmfuldata/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 align="center" type="selection" width="55"/>-->
-        <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('/harmfuldata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,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: 'ListHarmfulData',
@@ -84,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,92 +88,32 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: 'CO浓度(ppm)',
-          value: 'CO',
-          align: 'center'
-        },
-        {
-          text: 'CH4浓度(%VOL)',
-          value: 'CH4',
-          align: 'center'
-        },
-        {
-          text: 'H2S浓度(ppm)',
-          value: 'H2S',
-          align: 'center'
-        },
-        {
-          text: 'O2浓度(ppm)',
-          value: 'O2',
-          align: 'center'
-        },
-        {
-          text: '液位开关',
-          value: 'switch',
-          align: 'center'
-        },
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: 'CO浓度(ppm)', value: 'CO', align: 'center' },
+        { text: 'CH4浓度(%VOL)', value: 'CH4', align: 'center' },
+        { text: 'H2S浓度(ppm)', value: 'H2S', align: 'center' },
+        { text: 'O2浓度(ppm)', value: 'O2', align: 'center' },
+        { text: '液位开关', value: 'switch', align: 'center' },
         // {
         //   text: '状态描述',
         //   value: 'descn',
         //   align: 'center'
         // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -221,15 +148,10 @@
       })
       batchExportHarmfulData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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 = `有害监测仪数s据.xlsx` // 下载后文件名
-        document.body.appendChild(downloadElement)
-        downloadElement.click() // 点击下载
-        document.body.removeChild(downloadElement) // 下载完成移除元素
-        window.URL.revokeObjectURL(href) // 释放blob对象
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
       })
@@ -244,69 +166,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getHarmfulData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listHydrantData.vue b/src/views/dataManage/deviceData/listHydrantData.vue
index 575345d..f968760 100644
--- a/src/views/dataManage/deviceData/listHydrantData.vue
+++ b/src/views/dataManage/deviceData/listHydrantData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -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('/hydrantdata/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('/hydrantdata/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>
 
@@ -59,15 +58,6 @@
 export default {
   name: 'ListHydrantData',
   components: { DeptSelect },
-  /* filters: {
-    dataFilter(val) {
-      if (val === '40%LEL' || val === '60%LEL') {
-        return '0%LEL'
-      } else {
-        return val
-      }
-    }
-  }, */
   props: {
     type: {
       type: String,
@@ -75,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -91,10 +81,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', width: 170, align: 'center' },
@@ -105,17 +91,16 @@
         { text: '状态描述', value: 'descn', align: 'center' },
         { text: '消防栓状态', value: 'status', align: 'center' },
         { text: '上传时间', value: 'logtime', align: 'center' }
-        // { text: '点位编号', value: 'wellCode', align: 'center' },
-        // { text: '燃气浓度(%LEL)', value: 'strength', align: 'center', filter: true },
-        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
-        // { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -141,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -163,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取消防栓配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -186,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -207,35 +192,6 @@
 </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
 }
diff --git a/src/views/dataManage/deviceData/listLiquidData.vue b/src/views/dataManage/deviceData/listLiquidData.vue
index 96f28f6..d818684 100644
--- a/src/views/dataManage/deviceData/listLiquidData.vue
+++ b/src/views/dataManage/deviceData/listLiquidData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -26,45 +26,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('/liquiddata/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 align="center" type="selection" width="55"/>-->
-        <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('/liquiddata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,6 +58,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: 'ListLiquidData',
@@ -84,7 +70,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,74 +87,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '液位值(m)',
-          value: 'liquiddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '液位值(m)', value: 'liquiddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -204,16 +140,10 @@
       })
       batchExportLiquidData(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()
       })
@@ -228,69 +158,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listLiquidGasData.vue b/src/views/dataManage/deviceData/listLiquidGasData.vue
index 160edde..f2801c2 100644
--- a/src/views/dataManage/deviceData/listLiquidGasData.vue
+++ b/src/views/dataManage/deviceData/listLiquidGasData.vue
@@ -9,7 +9,8 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
+          size="small"
           dept-type="03"
           placeholder="选择权属单位/使用单位"
         />
@@ -32,46 +33,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('/liquidGasData/export')" :disabled="list.length === 0" 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 align="center" type="selection" width="55"/>-->
-        <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('/liquidGasData/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-if="column.unitFilter">{{ scope.row[column.value]|unit }}</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>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>
   </app-container>
 </template>
 
@@ -80,6 +65,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: 'ListLiquidGasData',
@@ -104,7 +90,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -122,80 +108,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '燃气浓度',
-          value: 'data',
-          align: 'center',
-          unitFilter: true
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'companyName',
-          align: 'center'
-        },
-        {
-          text: '使用单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '燃气浓度', value: 'data', align: 'center', unitFilter: true },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'companyName', align: 'center' },
+        { text: '使用单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -235,20 +166,10 @@
       })
       batchExportLiquidGasData(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
-        if (this.listQuery.sensorType === 'liquid') {
-          downloadElement.download = `燃气智能终端（一体化）数据-液位.xlsx` // 下载后文件名
-        } else {
-          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()
       })
@@ -359,69 +280,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidGasData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listNoiseData.vue b/src/views/dataManage/deviceData/listNoiseData.vue
index 5e31021..ab4faf4 100644
--- a/src/views/dataManage/deviceData/listNoiseData.vue
+++ b/src/views/dataManage/deviceData/listNoiseData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/noisedata/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 align="center" type="selection" width="55"/>-->
-        <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('/noisedata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListNoiseData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        // { text: '状态描述', value: 'descn', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -209,15 +141,10 @@
       })
       batchExportNoiseData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +159,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getNoiseData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listPantiltData.vue b/src/views/dataManage/deviceData/listPantiltData.vue
index c2030da..1609544 100644
--- a/src/views/dataManage/deviceData/listPantiltData.vue
+++ b/src/views/dataManage/deviceData/listPantiltData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/pantilt/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('/pantilt/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listTempData.vue b/src/views/dataManage/deviceData/listTempData.vue
index ceb3b61..33a3a93 100644
--- a/src/views/dataManage/deviceData/listTempData.vue
+++ b/src/views/dataManage/deviceData/listTempData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/tempdata//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 align="center" type="selection" width="55"/>-->
-        <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('/tempdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListTempData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,79 +88,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '温度(℃)',
-          value: 'temperature',
-          align: 'center'
-        },
-        {
-          text: '湿度(%RH)',
-          value: 'humidity',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '温度(℃)', value: 'temperature', align: 'center' },
+        { text: '湿度(%RH)', value: 'humidity', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -207,15 +141,10 @@
       })
       batchExportTempData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -230,69 +159,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getTempData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listTubeData.vue b/src/views/dataManage/deviceData/listTubeData.vue
index a8c5267..e0e6ab8 100644
--- a/src/views/dataManage/deviceData/listTubeData.vue
+++ b/src/views/dataManage/deviceData/listTubeData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" :need-top="false" size="small" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -21,44 +21,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('/tubedata/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 align="center" type="selection" width="55"/>-->
-        <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('/tubedata/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>
-      </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>
   </app-container>
 </template>
 
@@ -67,6 +53,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: 'ListTubeData',
@@ -78,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -95,53 +82,22 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '燃气浓度(%LEL)',
-          value: 'strength',
-          align: 'center'
-        },
-        // {
-        //   text: '电量(%)',
-        //   value: 'cell',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   align: 'center'
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '燃气浓度(%LEL)', value: 'strength', align: 'center' },
+        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        // { text: '状态描述', value: 'descn', align: 'center' },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // multipleSelection: [], // 多选选中项
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       deviceTypeList: [], // 燃气配置类型列表
       deptProps: {
         parent: 'pid',
@@ -149,25 +105,12 @@
         label: 'name',
         children: 'children'
       }, // 权属单位树形下拉菜单
-      deptTreeList: null, // 组织树列表数据
-      showDeptTree: 0, // 是否显示权属单位下拉
-      showDeviceType: true, // 是否显示设备类型下拉
+      // deptTreeList: null, // 组织树列表数据
+      // showDeptTree: 0, // 是否显示权属单位下拉
+      // showDeviceType: true, // 是否显示设备类型下拉
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      editShow: false, // 是否显示编辑框
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -202,15 +145,10 @@
       })
       batchExportTubeData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -225,69 +163,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getTubeData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listWellLocaData.vue b/src/views/dataManage/deviceData/listWellLocaData.vue
index 66722a2..e9609c8 100644
--- a/src/views/dataManage/deviceData/listWellLocaData.vue
+++ b/src/views/dataManage/deviceData/listWellLocaData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/welllocadata/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 align="center" type="selection" width="55"/>-->
-        <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('/welllocadata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListWellLocaData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,72 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '经度',
-          value: 'lng',
-          align: 'center'
-        },
-        {
-          text: '纬度',
-          value: 'lat',
-          align: 'center'
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'logtime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '经度', value: 'lng', align: 'center' },
+        { text: '纬度', value: 'lat', align: 'center' },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'logtime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -200,15 +140,10 @@
       })
       batchExportWellLocaData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -223,69 +158,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getWellLocaData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataView/components/alarmStatus.vue b/src/views/dataView/components/alarmStatus.vue
deleted file mode 100644
index f2b74b5..0000000
--- a/src/views/dataView/components/alarmStatus.vue
+++ /dev/null
@@ -1,164 +0,0 @@
-<template>
-  <el-row :gutter="40" class="panel-group">
-    <div>
-      <el-col>
-        <div class="flagBoxStyle">
-          <div class="flagStyle" />
-          <div>工单情况</div>
-        </div>
-      </el-col>
-    </div>
-    <el-row>
-      <el-col :span="12">
-        <ve-bar
-          :data="chartData"
-          :grid="grid"
-          :extend="extend"
-          :settings="chartSettings"
-        />
-      </el-col>
-      <el-col :span="12">
-        <div class="tableStyle">
-          <el-table border :data="tableList" stripe>
-            <el-table-column prop="name" label="设备型号" />
-            <el-table-column prop="value" label="设备名称" />
-          </el-table>
-        </div>
-      </el-col>
-    </el-row>
-  </el-row>
-</template>
-
-<script>
-import { wellCountByBfzt } from '@/api/well/well'
-import { deviceStaticByStatus, alarmNowStatic } from '@/api/data/dataStatics'
-import { jobCountByStatus } from '@/api/alarm/job'
-export default {
-  name: 'AlarmStatus',
-  data() {
-    return {
-      // 柱状图
-      extend: {
-        xAxis: {
-          axisLabel: {
-            rotate: 30,
-            margin: 30,
-            textStyle: {
-              align: 'center'
-            }
-          }
-        },
-        series: {
-          label: { show: true, position: 'top' },
-          barMaxWidth: 35 // 最大柱宽度
-        }
-      },
-      grid: {
-        right: 60
-      },
-      chartSettings: {
-        itemStyle: {
-          'barCategoryGap': 5
-        },
-        barWidth: 15,
-        labelMap: {
-          'deviceType': '权属单位',
-          'offline': '设备数量（个）'
-        },
-        dimension: ['deviceType'],
-        metrics: ['offline']
-      },
-      chartData: {
-        columns: ['deviceType', 'offline'],
-        rows: []
-      },
-      tableList: [],
-      dataGroup: [
-        {
-          title: '井',
-          context: '--',
-          flags: '条',
-          icon: 'icon-alarm',
-          color: '#40c9c6',
-          permission: '/well/list'
-        }
-      ]
-    }
-  },
-  created() {
-    this.getWellCount()
-    this.getDeviceCount()
-    this.getAlarmCount()
-    this.getJobCount()
-  },
-  mounted() {
-    this.tableList = [
-      {
-        value: 'WELL-001',
-        name: '液位超限'
-      },
-      {
-        value: 'WELL-002',
-        name: '燃气浓度超限'
-      },
-      {
-        value: 'WELL-003',
-        name: '井盖开启'
-      },
-      {
-        value: 'WELL-004',
-        name: '井盖开启'
-      }
-    ]
-  },
-  methods: {
-    refresh() {
-      this.getAlarmCount()
-      this.getJobCount()
-    },
-    getWellCount() {
-      wellCountByBfzt().then(response => {
-        this.dataGroup[0].context = response.data.total
-      })
-    },
-    getDeviceCount() {
-      deviceStaticByStatus().then(response => {
-        this.dataGroup[1].context = response.data.total
-      })
-    },
-    getAlarmCount() {
-      alarmNowStatic().then(response => {
-        this.dataGroup[2].context = response.data.total
-      })
-    },
-    getJobCount() {
-      jobCountByStatus().then(response => {
-        const data = response.data
-        const total = data.beforeGet + data.beforeConfirm + data.inHandle
-        this.dataGroup[3].context = total
-      })
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.tableStyle{
-  padding: 20px;
-}
-.flagBoxStyle {
-  display: flex;
-  margin-bottom: 20px;
-}
-.flagBoxStyle div:nth-child(2){
-  line-height: 30px;
-  font-weight: 600;
-}
-.flagStyle {
-  width: 4px;
-  height: 30px;
-  margin-right: 6px;
-  background: rgb(64 121 242);
-}
-
-</style>
diff --git a/src/views/dataView/components/alarmView.vue b/src/views/dataView/components/alarmView.vue
index 5c02f41..e13f811 100644
--- a/src/views/dataView/components/alarmView.vue
+++ b/src/views/dataView/components/alarmView.vue
@@ -1,106 +1,124 @@
+<!--报警分析-->
 <template>
-  <div>
-    <div class="flagBoxStyle">
-      <div class="flagStyle" />
-      <div>报警分析</div>
-    </div>
-    <el-row>
-      <el-col :span="12">
-        <ve-line
-          :data="chartDataLine"
-          :settings="chartSettingsLine"
+  <panel-card title="报警分析">
+    <template slot="func">
+      <el-col :span="16">
+        <el-date-picker
+          v-model="timeRange"
+          type="datetimerange"
+          range-separator="至"
+          size="small"
+          :picker-options="pickerOptions"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          start-placeholder="开始时间"
+          end-placeholder="结束时间"
+          @change="refresh"
         />
       </el-col>
-      <el-col :span="12">
-        <div class="tableStyle">
-          <el-table border :data="tableList" stripe>
-            <el-table-column prop="name" label="报警类型" />
-            <el-table-column prop="value" label="设备名称" />
-          </el-table>
-        </div>
-      </el-col>
-    </el-row>
-  </div>
+    </template>
+    <div class="flex-container">
+      <div class="flex-left">
+        <ve-line
+          :data="chartData"
+          :settings="chartSettingsLine"
+        />
+      </div>
+      <div class="flex-right">
+        <el-table border :data="tableList" stripe empty-text="无报警" height="340">
+          <el-table-column prop="name" label="报警类型" align="center" />
+          <el-table-column prop="value" label="报警数量" align="center" />
+        </el-table>
+      </div>
+    </div>
+  </panel-card>
 </template>
 
 <script>
-import { alarmStaticsByContent } from '@/api/alarm/deviceStatics'
+import { alarmStaticByDay, alarmStaticsByContent } from '@/api/data/dataStatics'
+import PanelCard from '@/components/BigData/Card/panelCard'
+import { getSearchLastWeekTime } from '@/utils/dateutils'
+
 export default {
   name: 'AlarmStaticsByType',
+  components: { PanelCard },
   data() {
     return {
-      tableList: [],
+      listQuery: {
+        deviceType: '',
+        beginTime: '',
+        endTime: ''
+      }, // 查询条件
+      timeRange: [], // 时间范围
+      tableList: [], // 列表
       // 折线图
       chartSettingsLine: {
         labelMap: {
-          'alarmWellData': '井盖开盖报警',
-          'alarmLiquidData': '液位超限报警',
-          'alarmHarmfulData': '有害气体超标报警'
+          'date': '日期',
+          'alarmTimes': '报警次数'
         },
-        metrics: ['alarmWellData', 'alarmLiquidData', 'alarmHarmfulData'],
         dimension: ['date']
-      },
-      chartDataLine: {
-        columns: ['date', 'alarmWellData', 'alarmLiquidData', 'alarmHarmfulData'],
+      }, // 配置
+      chartData: {
+        columns: ['date', 'alarmTimes'],
         rows: []
-      }
+      } // 折线图数据
     }
   },
   created() {
-    this.fetchDeviceTypeLine()
-  },
-  mounted() {
-    this.tableList = [
-      {
-        value: '224',
-        name: '井盖开启'
-      },
-      {
-        value: '22',
-        name: '燃气浓度超限'
-      },
-      {
-        value: '1',
-        name: '液位超限'
-      },
-      {
-        value: '4',
-        name: '有害气体超标'
-      }
-    ]
+    this.timeRange = getSearchLastWeekTime()
+    this.refresh()
   },
   methods: {
-    fetchDeviceTypeLine(val) {
-      if (val !== undefined) {
-        this.listQuery.startTime = val[0]
-        this.listQuery.endTime = val[1]
-      }
-      alarmStaticsByContent(this.listStatue).then(response => {
-        console.log(response.data, '===123')
-        this.chartDataLine.rows = response.data
+    refresh() {
+      this.handleDateTime()
+      this.fetchAlarmByDay()
+      this.fetchAlarmByContent()
+    },
+    // 获取各类报警的列表
+    fetchAlarmByContent() {
+      alarmStaticsByContent(this.listQuery).then(response => {
+        this.tableList = response.data
       })
+    },
+    // 获取每日报警数
+    fetchAlarmByDay() {
+      // 模拟数据
+      // this.chartData.rows = [
+      //   { 'date': '9月20日', 'alarmTimes': 153, 'alarmWells': 43 },
+      //   { 'date': '9月21日', 'alarmTimes': 150, 'alarmWells': 30 },
+      //   { 'date': '9月22日', 'alarmTimes': 143, 'alarmWells': 23 },
+      //   { 'date': '9月23日', 'alarmTimes': 173, 'alarmWells': 23 },
+      //   { 'date': '9月24日', 'alarmTimes': 272, 'alarmWells': 52 },
+      //   { 'date': '9月25日', 'alarmTimes': 253, 'alarmWells': 53 }
+      // ]
+      alarmStaticByDay(this.listQuery).then(response => {
+        this.chartData.rows = response.data
+      })
+    },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
     }
   }
 }
 </script>
 
 <style lang="scss" scoped>
-.tableStyle{
-  // padding: 100px 10px;
-}
-.flagBoxStyle {
+.flex-container{
   display: flex;
-  margin-bottom: 20px;
-}
-.flagBoxStyle div:nth-child(2){
-  line-height: 30px;
-  font-weight: 600;
-}
-.flagStyle {
-  width: 4px;
-  height: 30px;
-  margin-right: 6px;
-  background: rgb(64 121 242);
+  .flex-left{
+    flex:1;
+  }
+  .flex-right{
+    width: 260px;
+    padding: 10px 20px;
+  }
 }
 
 </style>

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index b9e5ee6..09fb191 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-card :body-style="{ padding: '0px' }" shadow="always">
-    <div class="card-panel" >
+  <el-card :body-style="{ padding: '0px' }" :shadow="shadow">
+    <div class="card-panel">
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
@@ -24,27 +24,31 @@
     title: {
       type: String,
       default: '标题'
-    },
+    }, // 标题
     flags: {
       type: String,
       default: '单位'
-    },
+    }, // 单位
     subtitle: {
       type: String,
       default: ''
-    },
+    }, // 小标题
     icon: {
       type: String,
       default: ''
-    },
+    }, // 图标
     context: {
       type: [String, Number],
       default: ''
-    },
+    }, // 内容
     color: {
       type: String,
       default: '#40c9c6'
-    }
+    }, // 图标颜色
+    shadow: {
+      type: String,
+      default: 'always'
+    } // 卡片阴影
   },
   computed: {
     backgroundColor() {
diff --git a/src/components/BigData/Card/panelCard.vue b/src/components/BigData/Card/panelCard.vue
new file mode 100644
index 0000000..d6a7b89
--- /dev/null
+++ b/src/components/BigData/Card/panelCard.vue
@@ -0,0 +1,51 @@
+<template>
+  <div class="panel-container">
+    <div class="panel-title">
+      {{ title }}
+      <div class="title-right">
+        <slot name="func" />
+      </div>
+    </div>
+    <div class="panel-body">
+      <slot />
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'PanelCard',
+  props: {
+    // 标题
+    title: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.panel-container{
+  width: 100%;
+  padding: 10px;
+  border: 1px solid #EBEEF5 ;
+  .panel-title{
+    width: 100%;
+    line-height: 2;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0px 10px;
+    border-left: 5px solid #66b1ff;
+    position: relative;
+    .title-right{
+      display: inline-block;
+      position: absolute;
+      right: 10px;
+    }
+  }
+  .panel-body{
+    padding: 5px 0px;
+    height:auto;
+  }
+}
+</style>
diff --git a/src/icons/svg/icon-database.svg b/src/icons/svg/icon-database.svg
new file mode 100644
index 0000000..d3dd1c8
--- /dev/null
+++ b/src/icons/svg/icon-database.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1658711872102" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1435" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M960 123.7C872.7 49.9 704.8 0 512 0S151.3 49.9 64 123.7C23.2 158.2 0 197.8 0 240V605.9c0 0.7 0 1.4 0.1 2H0v176c0 132.5 229.2 240 512 240s512-107.5 512-240V608h-0.1c0.1-1.8 0.1-3.5 0.1-5.3V240c0-42.2-23.2-81.8-64-116.3zM64 356.3C151.3 430.1 319.2 480 512 480s360.7-49.9 448-123.7v79.2c-17.9 11.5-37.5 22.2-58.8 32.2C796.2 516.9 658 544 512 544s-284.2-27.1-389.2-76.4c-21.3-10-40.9-20.7-58.8-32.2v-79.1z m0 181.3c87.3 73.8 255.2 123.7 448 123.7s360.7-49.9 448-123.7v79.2c-17.9 11.4-37.5 22.2-58.8 32.2-105 49.2-243.3 76.3-389.2 76.3S227.8 698.2 122.8 649c-21.3-10-40.9-20.7-58.8-32.2v-79.2z m837.2 292.7c-105 49.2-243.3 76.3-389.2 76.3s-284.2-27.1-389.2-76.3c-20.3-9.5-39.1-19.8-56.4-30.6-1.6-5.3-2.4-10.5-2.4-15.7v-65c87.3 73.8 255.2 123.7 448 123.7s360.7-50 448-123.7v65c0 5.1-0.8 10.4-2.4 15.7-17.3 10.9-36.1 21.1-56.4 30.6z" p-id="1436"></path></svg>
\ No newline at end of file
diff --git a/src/views/dataManage/dataManage.vue b/src/views/dataManage/dataManage.vue
index 71be03f..0564cdd 100644
--- a/src/views/dataManage/dataManage.vue
+++ b/src/views/dataManage/dataManage.vue
@@ -31,19 +31,19 @@
     return {
       activeName: 'wellcover',
       tabList: [
-        { permission: '/welldata/list', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
-        { permission: '/liquiddata/list', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
-        { permission: '/gasdata/list', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
-        { permission: '/digdata/list', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
-        { permission: '/noisedata/list', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
-        { permission: '/harmfuldata/list', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
-        { permission: '/tempdata/list', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
-        { permission: '/welllocadata/list', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
-        { permission: '/liquidGasData/list', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
-        { permission: '/tubedata/list', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
-        { permission: '/gasdector/listPage', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
-        { permission: '/pantilt/listPage', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
-        { permission: '/hydrantdata/list', label: '消防栓数据列表', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
+        { permission: '/welldata/list-page', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
+        { permission: '/liquiddata/list-page', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
+        { permission: '/gasdata/list-page', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
+        { permission: '/digdata/list-page', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
+        { permission: '/noisedata/list-page', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
+        { permission: '/harmfuldata/list-page', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
+        { permission: '/tempdata/list-page', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
+        { permission: '/welllocadata/list-page', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
+        { permission: '/liquidGasData/list-page', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
+        { permission: '/tubedata/list-page', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
+        { permission: '/gasdector/list-page', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
+        { permission: '/pantilt/list-page', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
+        { permission: '/hydrantdata/list-page', label: '消防栓防盗水监测仪', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
       ] // 所有tab列表
     }
   },
diff --git a/src/views/dataManage/deviceData/listDigData.vue b/src/views/dataManage/deviceData/listDigData.vue
index fa4bbc7..3cb74ad 100644
--- a/src/views/dataManage/deviceData/listDigData.vue
+++ b/src/views/dataManage/deviceData/listDigData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/digdata/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 align="center" type="selection" width="55"/>-->
-        <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('/digdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListDigData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -185,6 +116,8 @@
       if (params && params.deviceType === this.type && params.devcode) {
         this.listQuery.keywords = params.devcode
         this.fetchData()
+      } else {
+        this.fetchData()
       }
     }
   },
@@ -203,21 +136,16 @@
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
-        text: '数据处理中,请稍后...',
+        text: '下载中,请稍后...',
         spinner: 'el-icon-loading',
         background: 'rgba(0, 0, 0, 0.7)'
       })
       batchExportDigData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +160,50 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getDigData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         return 'warning-state'
       }
     },
-    indexMethod(index) {
-      return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
-    },
-    // 改变页容量
-    handleSizeChange(val) {
-      this.listQuery.limit = val
+    // checkState(row) {
+    //   if (row.status !== '0') {
+    //     return 'warning-state'
+    //   }
+    // },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    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
   }
diff --git a/src/views/dataManage/deviceData/listGasdectorData.vue b/src/views/dataManage/deviceData/listGasdectorData.vue
index a78b8da..b4ecd07 100644
--- a/src/views/dataManage/deviceData/listGasdectorData.vue
+++ b/src/views/dataManage/deviceData/listGasdectorData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/gasdector/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('/liquidGasData/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listHarmfulData.vue b/src/views/dataManage/deviceData/listHarmfulData.vue
index dde92b4..c29cb2e 100644
--- a/src/views/dataManage/deviceData/listHarmfulData.vue
+++ b/src/views/dataManage/deviceData/listHarmfulData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -27,44 +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('/harmfuldata/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 align="center" type="selection" width="55"/>-->
-        <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('/harmfuldata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,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: 'ListHarmfulData',
@@ -84,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,92 +88,32 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: 'CO浓度(ppm)',
-          value: 'CO',
-          align: 'center'
-        },
-        {
-          text: 'CH4浓度(%VOL)',
-          value: 'CH4',
-          align: 'center'
-        },
-        {
-          text: 'H2S浓度(ppm)',
-          value: 'H2S',
-          align: 'center'
-        },
-        {
-          text: 'O2浓度(ppm)',
-          value: 'O2',
-          align: 'center'
-        },
-        {
-          text: '液位开关',
-          value: 'switch',
-          align: 'center'
-        },
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: 'CO浓度(ppm)', value: 'CO', align: 'center' },
+        { text: 'CH4浓度(%VOL)', value: 'CH4', align: 'center' },
+        { text: 'H2S浓度(ppm)', value: 'H2S', align: 'center' },
+        { text: 'O2浓度(ppm)', value: 'O2', align: 'center' },
+        { text: '液位开关', value: 'switch', align: 'center' },
         // {
         //   text: '状态描述',
         //   value: 'descn',
         //   align: 'center'
         // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -221,15 +148,10 @@
       })
       batchExportHarmfulData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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 = `有害监测仪数s据.xlsx` // 下载后文件名
-        document.body.appendChild(downloadElement)
-        downloadElement.click() // 点击下载
-        document.body.removeChild(downloadElement) // 下载完成移除元素
-        window.URL.revokeObjectURL(href) // 释放blob对象
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
       })
@@ -244,69 +166,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getHarmfulData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listHydrantData.vue b/src/views/dataManage/deviceData/listHydrantData.vue
index 575345d..f968760 100644
--- a/src/views/dataManage/deviceData/listHydrantData.vue
+++ b/src/views/dataManage/deviceData/listHydrantData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -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('/hydrantdata/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('/hydrantdata/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>
 
@@ -59,15 +58,6 @@
 export default {
   name: 'ListHydrantData',
   components: { DeptSelect },
-  /* filters: {
-    dataFilter(val) {
-      if (val === '40%LEL' || val === '60%LEL') {
-        return '0%LEL'
-      } else {
-        return val
-      }
-    }
-  }, */
   props: {
     type: {
       type: String,
@@ -75,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -91,10 +81,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', width: 170, align: 'center' },
@@ -105,17 +91,16 @@
         { text: '状态描述', value: 'descn', align: 'center' },
         { text: '消防栓状态', value: 'status', align: 'center' },
         { text: '上传时间', value: 'logtime', align: 'center' }
-        // { text: '点位编号', value: 'wellCode', align: 'center' },
-        // { text: '燃气浓度(%LEL)', value: 'strength', align: 'center', filter: true },
-        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
-        // { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -141,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -163,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取消防栓配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -186,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -207,35 +192,6 @@
 </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
 }
diff --git a/src/views/dataManage/deviceData/listLiquidData.vue b/src/views/dataManage/deviceData/listLiquidData.vue
index 96f28f6..d818684 100644
--- a/src/views/dataManage/deviceData/listLiquidData.vue
+++ b/src/views/dataManage/deviceData/listLiquidData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -26,45 +26,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('/liquiddata/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 align="center" type="selection" width="55"/>-->
-        <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('/liquiddata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,6 +58,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: 'ListLiquidData',
@@ -84,7 +70,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,74 +87,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '液位值(m)',
-          value: 'liquiddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '液位值(m)', value: 'liquiddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -204,16 +140,10 @@
       })
       batchExportLiquidData(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()
       })
@@ -228,69 +158,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listLiquidGasData.vue b/src/views/dataManage/deviceData/listLiquidGasData.vue
index 160edde..f2801c2 100644
--- a/src/views/dataManage/deviceData/listLiquidGasData.vue
+++ b/src/views/dataManage/deviceData/listLiquidGasData.vue
@@ -9,7 +9,8 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
+          size="small"
           dept-type="03"
           placeholder="选择权属单位/使用单位"
         />
@@ -32,46 +33,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('/liquidGasData/export')" :disabled="list.length === 0" 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 align="center" type="selection" width="55"/>-->
-        <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('/liquidGasData/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-if="column.unitFilter">{{ scope.row[column.value]|unit }}</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>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>
   </app-container>
 </template>
 
@@ -80,6 +65,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: 'ListLiquidGasData',
@@ -104,7 +90,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -122,80 +108,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '燃气浓度',
-          value: 'data',
-          align: 'center',
-          unitFilter: true
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'companyName',
-          align: 'center'
-        },
-        {
-          text: '使用单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '燃气浓度', value: 'data', align: 'center', unitFilter: true },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'companyName', align: 'center' },
+        { text: '使用单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -235,20 +166,10 @@
       })
       batchExportLiquidGasData(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
-        if (this.listQuery.sensorType === 'liquid') {
-          downloadElement.download = `燃气智能终端（一体化）数据-液位.xlsx` // 下载后文件名
-        } else {
-          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()
       })
@@ -359,69 +280,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidGasData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listNoiseData.vue b/src/views/dataManage/deviceData/listNoiseData.vue
index 5e31021..ab4faf4 100644
--- a/src/views/dataManage/deviceData/listNoiseData.vue
+++ b/src/views/dataManage/deviceData/listNoiseData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/noisedata/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 align="center" type="selection" width="55"/>-->
-        <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('/noisedata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListNoiseData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        // { text: '状态描述', value: 'descn', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -209,15 +141,10 @@
       })
       batchExportNoiseData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +159,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getNoiseData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listPantiltData.vue b/src/views/dataManage/deviceData/listPantiltData.vue
index c2030da..1609544 100644
--- a/src/views/dataManage/deviceData/listPantiltData.vue
+++ b/src/views/dataManage/deviceData/listPantiltData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/pantilt/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('/pantilt/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listTempData.vue b/src/views/dataManage/deviceData/listTempData.vue
index ceb3b61..33a3a93 100644
--- a/src/views/dataManage/deviceData/listTempData.vue
+++ b/src/views/dataManage/deviceData/listTempData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/tempdata//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 align="center" type="selection" width="55"/>-->
-        <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('/tempdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListTempData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,79 +88,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '温度(℃)',
-          value: 'temperature',
-          align: 'center'
-        },
-        {
-          text: '湿度(%RH)',
-          value: 'humidity',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '温度(℃)', value: 'temperature', align: 'center' },
+        { text: '湿度(%RH)', value: 'humidity', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -207,15 +141,10 @@
       })
       batchExportTempData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -230,69 +159,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getTempData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listTubeData.vue b/src/views/dataManage/deviceData/listTubeData.vue
index a8c5267..e0e6ab8 100644
--- a/src/views/dataManage/deviceData/listTubeData.vue
+++ b/src/views/dataManage/deviceData/listTubeData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" :need-top="false" size="small" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -21,44 +21,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('/tubedata/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 align="center" type="selection" width="55"/>-->
-        <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('/tubedata/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>
-      </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>
   </app-container>
 </template>
 
@@ -67,6 +53,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: 'ListTubeData',
@@ -78,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -95,53 +82,22 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '燃气浓度(%LEL)',
-          value: 'strength',
-          align: 'center'
-        },
-        // {
-        //   text: '电量(%)',
-        //   value: 'cell',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   align: 'center'
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '燃气浓度(%LEL)', value: 'strength', align: 'center' },
+        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        // { text: '状态描述', value: 'descn', align: 'center' },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // multipleSelection: [], // 多选选中项
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       deviceTypeList: [], // 燃气配置类型列表
       deptProps: {
         parent: 'pid',
@@ -149,25 +105,12 @@
         label: 'name',
         children: 'children'
       }, // 权属单位树形下拉菜单
-      deptTreeList: null, // 组织树列表数据
-      showDeptTree: 0, // 是否显示权属单位下拉
-      showDeviceType: true, // 是否显示设备类型下拉
+      // deptTreeList: null, // 组织树列表数据
+      // showDeptTree: 0, // 是否显示权属单位下拉
+      // showDeviceType: true, // 是否显示设备类型下拉
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      editShow: false, // 是否显示编辑框
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -202,15 +145,10 @@
       })
       batchExportTubeData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -225,69 +163,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getTubeData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listWellLocaData.vue b/src/views/dataManage/deviceData/listWellLocaData.vue
index 66722a2..e9609c8 100644
--- a/src/views/dataManage/deviceData/listWellLocaData.vue
+++ b/src/views/dataManage/deviceData/listWellLocaData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/welllocadata/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 align="center" type="selection" width="55"/>-->
-        <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('/welllocadata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListWellLocaData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,72 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '经度',
-          value: 'lng',
-          align: 'center'
-        },
-        {
-          text: '纬度',
-          value: 'lat',
-          align: 'center'
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'logtime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '经度', value: 'lng', align: 'center' },
+        { text: '纬度', value: 'lat', align: 'center' },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'logtime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -200,15 +140,10 @@
       })
       batchExportWellLocaData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -223,69 +158,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getWellLocaData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataView/components/alarmStatus.vue b/src/views/dataView/components/alarmStatus.vue
deleted file mode 100644
index f2b74b5..0000000
--- a/src/views/dataView/components/alarmStatus.vue
+++ /dev/null
@@ -1,164 +0,0 @@
-<template>
-  <el-row :gutter="40" class="panel-group">
-    <div>
-      <el-col>
-        <div class="flagBoxStyle">
-          <div class="flagStyle" />
-          <div>工单情况</div>
-        </div>
-      </el-col>
-    </div>
-    <el-row>
-      <el-col :span="12">
-        <ve-bar
-          :data="chartData"
-          :grid="grid"
-          :extend="extend"
-          :settings="chartSettings"
-        />
-      </el-col>
-      <el-col :span="12">
-        <div class="tableStyle">
-          <el-table border :data="tableList" stripe>
-            <el-table-column prop="name" label="设备型号" />
-            <el-table-column prop="value" label="设备名称" />
-          </el-table>
-        </div>
-      </el-col>
-    </el-row>
-  </el-row>
-</template>
-
-<script>
-import { wellCountByBfzt } from '@/api/well/well'
-import { deviceStaticByStatus, alarmNowStatic } from '@/api/data/dataStatics'
-import { jobCountByStatus } from '@/api/alarm/job'
-export default {
-  name: 'AlarmStatus',
-  data() {
-    return {
-      // 柱状图
-      extend: {
-        xAxis: {
-          axisLabel: {
-            rotate: 30,
-            margin: 30,
-            textStyle: {
-              align: 'center'
-            }
-          }
-        },
-        series: {
-          label: { show: true, position: 'top' },
-          barMaxWidth: 35 // 最大柱宽度
-        }
-      },
-      grid: {
-        right: 60
-      },
-      chartSettings: {
-        itemStyle: {
-          'barCategoryGap': 5
-        },
-        barWidth: 15,
-        labelMap: {
-          'deviceType': '权属单位',
-          'offline': '设备数量（个）'
-        },
-        dimension: ['deviceType'],
-        metrics: ['offline']
-      },
-      chartData: {
-        columns: ['deviceType', 'offline'],
-        rows: []
-      },
-      tableList: [],
-      dataGroup: [
-        {
-          title: '井',
-          context: '--',
-          flags: '条',
-          icon: 'icon-alarm',
-          color: '#40c9c6',
-          permission: '/well/list'
-        }
-      ]
-    }
-  },
-  created() {
-    this.getWellCount()
-    this.getDeviceCount()
-    this.getAlarmCount()
-    this.getJobCount()
-  },
-  mounted() {
-    this.tableList = [
-      {
-        value: 'WELL-001',
-        name: '液位超限'
-      },
-      {
-        value: 'WELL-002',
-        name: '燃气浓度超限'
-      },
-      {
-        value: 'WELL-003',
-        name: '井盖开启'
-      },
-      {
-        value: 'WELL-004',
-        name: '井盖开启'
-      }
-    ]
-  },
-  methods: {
-    refresh() {
-      this.getAlarmCount()
-      this.getJobCount()
-    },
-    getWellCount() {
-      wellCountByBfzt().then(response => {
-        this.dataGroup[0].context = response.data.total
-      })
-    },
-    getDeviceCount() {
-      deviceStaticByStatus().then(response => {
-        this.dataGroup[1].context = response.data.total
-      })
-    },
-    getAlarmCount() {
-      alarmNowStatic().then(response => {
-        this.dataGroup[2].context = response.data.total
-      })
-    },
-    getJobCount() {
-      jobCountByStatus().then(response => {
-        const data = response.data
-        const total = data.beforeGet + data.beforeConfirm + data.inHandle
-        this.dataGroup[3].context = total
-      })
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.tableStyle{
-  padding: 20px;
-}
-.flagBoxStyle {
-  display: flex;
-  margin-bottom: 20px;
-}
-.flagBoxStyle div:nth-child(2){
-  line-height: 30px;
-  font-weight: 600;
-}
-.flagStyle {
-  width: 4px;
-  height: 30px;
-  margin-right: 6px;
-  background: rgb(64 121 242);
-}
-
-</style>
diff --git a/src/views/dataView/components/alarmView.vue b/src/views/dataView/components/alarmView.vue
index 5c02f41..e13f811 100644
--- a/src/views/dataView/components/alarmView.vue
+++ b/src/views/dataView/components/alarmView.vue
@@ -1,106 +1,124 @@
+<!--报警分析-->
 <template>
-  <div>
-    <div class="flagBoxStyle">
-      <div class="flagStyle" />
-      <div>报警分析</div>
-    </div>
-    <el-row>
-      <el-col :span="12">
-        <ve-line
-          :data="chartDataLine"
-          :settings="chartSettingsLine"
+  <panel-card title="报警分析">
+    <template slot="func">
+      <el-col :span="16">
+        <el-date-picker
+          v-model="timeRange"
+          type="datetimerange"
+          range-separator="至"
+          size="small"
+          :picker-options="pickerOptions"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          start-placeholder="开始时间"
+          end-placeholder="结束时间"
+          @change="refresh"
         />
       </el-col>
-      <el-col :span="12">
-        <div class="tableStyle">
-          <el-table border :data="tableList" stripe>
-            <el-table-column prop="name" label="报警类型" />
-            <el-table-column prop="value" label="设备名称" />
-          </el-table>
-        </div>
-      </el-col>
-    </el-row>
-  </div>
+    </template>
+    <div class="flex-container">
+      <div class="flex-left">
+        <ve-line
+          :data="chartData"
+          :settings="chartSettingsLine"
+        />
+      </div>
+      <div class="flex-right">
+        <el-table border :data="tableList" stripe empty-text="无报警" height="340">
+          <el-table-column prop="name" label="报警类型" align="center" />
+          <el-table-column prop="value" label="报警数量" align="center" />
+        </el-table>
+      </div>
+    </div>
+  </panel-card>
 </template>
 
 <script>
-import { alarmStaticsByContent } from '@/api/alarm/deviceStatics'
+import { alarmStaticByDay, alarmStaticsByContent } from '@/api/data/dataStatics'
+import PanelCard from '@/components/BigData/Card/panelCard'
+import { getSearchLastWeekTime } from '@/utils/dateutils'
+
 export default {
   name: 'AlarmStaticsByType',
+  components: { PanelCard },
   data() {
     return {
-      tableList: [],
+      listQuery: {
+        deviceType: '',
+        beginTime: '',
+        endTime: ''
+      }, // 查询条件
+      timeRange: [], // 时间范围
+      tableList: [], // 列表
       // 折线图
       chartSettingsLine: {
         labelMap: {
-          'alarmWellData': '井盖开盖报警',
-          'alarmLiquidData': '液位超限报警',
-          'alarmHarmfulData': '有害气体超标报警'
+          'date': '日期',
+          'alarmTimes': '报警次数'
         },
-        metrics: ['alarmWellData', 'alarmLiquidData', 'alarmHarmfulData'],
         dimension: ['date']
-      },
-      chartDataLine: {
-        columns: ['date', 'alarmWellData', 'alarmLiquidData', 'alarmHarmfulData'],
+      }, // 配置
+      chartData: {
+        columns: ['date', 'alarmTimes'],
         rows: []
-      }
+      } // 折线图数据
     }
   },
   created() {
-    this.fetchDeviceTypeLine()
-  },
-  mounted() {
-    this.tableList = [
-      {
-        value: '224',
-        name: '井盖开启'
-      },
-      {
-        value: '22',
-        name: '燃气浓度超限'
-      },
-      {
-        value: '1',
-        name: '液位超限'
-      },
-      {
-        value: '4',
-        name: '有害气体超标'
-      }
-    ]
+    this.timeRange = getSearchLastWeekTime()
+    this.refresh()
   },
   methods: {
-    fetchDeviceTypeLine(val) {
-      if (val !== undefined) {
-        this.listQuery.startTime = val[0]
-        this.listQuery.endTime = val[1]
-      }
-      alarmStaticsByContent(this.listStatue).then(response => {
-        console.log(response.data, '===123')
-        this.chartDataLine.rows = response.data
+    refresh() {
+      this.handleDateTime()
+      this.fetchAlarmByDay()
+      this.fetchAlarmByContent()
+    },
+    // 获取各类报警的列表
+    fetchAlarmByContent() {
+      alarmStaticsByContent(this.listQuery).then(response => {
+        this.tableList = response.data
       })
+    },
+    // 获取每日报警数
+    fetchAlarmByDay() {
+      // 模拟数据
+      // this.chartData.rows = [
+      //   { 'date': '9月20日', 'alarmTimes': 153, 'alarmWells': 43 },
+      //   { 'date': '9月21日', 'alarmTimes': 150, 'alarmWells': 30 },
+      //   { 'date': '9月22日', 'alarmTimes': 143, 'alarmWells': 23 },
+      //   { 'date': '9月23日', 'alarmTimes': 173, 'alarmWells': 23 },
+      //   { 'date': '9月24日', 'alarmTimes': 272, 'alarmWells': 52 },
+      //   { 'date': '9月25日', 'alarmTimes': 253, 'alarmWells': 53 }
+      // ]
+      alarmStaticByDay(this.listQuery).then(response => {
+        this.chartData.rows = response.data
+      })
+    },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
     }
   }
 }
 </script>
 
 <style lang="scss" scoped>
-.tableStyle{
-  // padding: 100px 10px;
-}
-.flagBoxStyle {
+.flex-container{
   display: flex;
-  margin-bottom: 20px;
-}
-.flagBoxStyle div:nth-child(2){
-  line-height: 30px;
-  font-weight: 600;
-}
-.flagStyle {
-  width: 4px;
-  height: 30px;
-  margin-right: 6px;
-  background: rgb(64 121 242);
+  .flex-left{
+    flex:1;
+  }
+  .flex-right{
+    width: 260px;
+    padding: 10px 20px;
+  }
 }
 
 </style>
diff --git a/src/views/dataView/components/jobAnalysis.vue b/src/views/dataView/components/jobAnalysis.vue
new file mode 100644
index 0000000..483e652
--- /dev/null
+++ b/src/views/dataView/components/jobAnalysis.vue
@@ -0,0 +1,106 @@
+<!--工单情况-->
+<template>
+  <panel-card title="工单分析">
+    <template slot="func">
+      <el-col :span="16">
+        <el-date-picker
+          v-model="timeRange"
+          type="datetimerange"
+          range-separator="至"
+          size="small"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          start-placeholder="开始时间"
+          end-placeholder="结束时间"
+          @change="refresh"
+        />
+      </el-col>
+    </template>
+    <ve-bar
+      :data="chartData"
+      :extend="extend"
+      :settings="chartSettings"
+    />
+  </panel-card>
+</template>
+
+<script>
+import PanelCard from '@/components/BigData/Card/panelCard'
+import { getSearchLastWeekTime } from '@/utils/dateutils'
+import { jobStaticsByDept } from '@/api/data/dataStatics'
+export default {
+  name: 'JobAnalysis',
+  components: { PanelCard },
+  data() {
+    return {
+      listQuery: {
+        beginTime: '',
+        endTime: ''
+      }, // 查询条件
+      timeRange: [], // 时间范围
+      chartSettings: {
+        labelMap: {
+          'deptName': '权属单位',
+          'beforeGet': '待处理',
+          'beforeConfirm': '待确认',
+          'inHandle': '处理中',
+          'over': '已完成'
+        },
+        stack: {
+          'xxx': ['beforeGet', 'beforeConfirm', 'inHandle', 'over']
+        }
+      },
+      extend: {
+        xAxis: {
+          type: 'value',
+          minInterval: 1
+        },
+        series: {
+          barMaxWidth: 35
+        }
+      },
+      chartData: {
+        columns: ['deptName', 'beforeGet', 'beforeConfirm', 'inHandle', 'over'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.timeRange = getSearchLastWeekTime()
+    this.refresh()
+  },
+  mounted() {
+  },
+  methods: {
+    refresh() {
+      this.handleDateTime()
+      this.fetchData()
+    },
+    fetchData() {
+      jobStaticsByDept(this.listQuery).then(response => {
+        this.chartData.rows = response.data
+        const maxValue = Math.max.apply(Math, response.data.map(function(item) {
+          return parseInt(item.beforeGet) + parseInt(item.beforeConfirm) + parseInt(item.inHandle) + parseInt(item.over)
+        }))
+        if (maxValue < 10) {
+          this.extend.xAxis = { type: 'value', minInterval: 1, max: 10 }
+        } else {
+          this.extend.xAxis = { type: 'value', minInterval: 1 }
+        }
+      })
+    },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+</style>

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index b9e5ee6..09fb191 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-card :body-style="{ padding: '0px' }" shadow="always">
-    <div class="card-panel" >
+  <el-card :body-style="{ padding: '0px' }" :shadow="shadow">
+    <div class="card-panel">
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
@@ -24,27 +24,31 @@
     title: {
       type: String,
       default: '标题'
-    },
+    }, // 标题
     flags: {
       type: String,
       default: '单位'
-    },
+    }, // 单位
     subtitle: {
       type: String,
       default: ''
-    },
+    }, // 小标题
     icon: {
       type: String,
       default: ''
-    },
+    }, // 图标
     context: {
       type: [String, Number],
       default: ''
-    },
+    }, // 内容
     color: {
       type: String,
       default: '#40c9c6'
-    }
+    }, // 图标颜色
+    shadow: {
+      type: String,
+      default: 'always'
+    } // 卡片阴影
   },
   computed: {
     backgroundColor() {
diff --git a/src/components/BigData/Card/panelCard.vue b/src/components/BigData/Card/panelCard.vue
new file mode 100644
index 0000000..d6a7b89
--- /dev/null
+++ b/src/components/BigData/Card/panelCard.vue
@@ -0,0 +1,51 @@
+<template>
+  <div class="panel-container">
+    <div class="panel-title">
+      {{ title }}
+      <div class="title-right">
+        <slot name="func" />
+      </div>
+    </div>
+    <div class="panel-body">
+      <slot />
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'PanelCard',
+  props: {
+    // 标题
+    title: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.panel-container{
+  width: 100%;
+  padding: 10px;
+  border: 1px solid #EBEEF5 ;
+  .panel-title{
+    width: 100%;
+    line-height: 2;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0px 10px;
+    border-left: 5px solid #66b1ff;
+    position: relative;
+    .title-right{
+      display: inline-block;
+      position: absolute;
+      right: 10px;
+    }
+  }
+  .panel-body{
+    padding: 5px 0px;
+    height:auto;
+  }
+}
+</style>
diff --git a/src/icons/svg/icon-database.svg b/src/icons/svg/icon-database.svg
new file mode 100644
index 0000000..d3dd1c8
--- /dev/null
+++ b/src/icons/svg/icon-database.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1658711872102" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1435" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M960 123.7C872.7 49.9 704.8 0 512 0S151.3 49.9 64 123.7C23.2 158.2 0 197.8 0 240V605.9c0 0.7 0 1.4 0.1 2H0v176c0 132.5 229.2 240 512 240s512-107.5 512-240V608h-0.1c0.1-1.8 0.1-3.5 0.1-5.3V240c0-42.2-23.2-81.8-64-116.3zM64 356.3C151.3 430.1 319.2 480 512 480s360.7-49.9 448-123.7v79.2c-17.9 11.5-37.5 22.2-58.8 32.2C796.2 516.9 658 544 512 544s-284.2-27.1-389.2-76.4c-21.3-10-40.9-20.7-58.8-32.2v-79.1z m0 181.3c87.3 73.8 255.2 123.7 448 123.7s360.7-49.9 448-123.7v79.2c-17.9 11.4-37.5 22.2-58.8 32.2-105 49.2-243.3 76.3-389.2 76.3S227.8 698.2 122.8 649c-21.3-10-40.9-20.7-58.8-32.2v-79.2z m837.2 292.7c-105 49.2-243.3 76.3-389.2 76.3s-284.2-27.1-389.2-76.3c-20.3-9.5-39.1-19.8-56.4-30.6-1.6-5.3-2.4-10.5-2.4-15.7v-65c87.3 73.8 255.2 123.7 448 123.7s360.7-50 448-123.7v65c0 5.1-0.8 10.4-2.4 15.7-17.3 10.9-36.1 21.1-56.4 30.6z" p-id="1436"></path></svg>
\ No newline at end of file
diff --git a/src/views/dataManage/dataManage.vue b/src/views/dataManage/dataManage.vue
index 71be03f..0564cdd 100644
--- a/src/views/dataManage/dataManage.vue
+++ b/src/views/dataManage/dataManage.vue
@@ -31,19 +31,19 @@
     return {
       activeName: 'wellcover',
       tabList: [
-        { permission: '/welldata/list', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
-        { permission: '/liquiddata/list', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
-        { permission: '/gasdata/list', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
-        { permission: '/digdata/list', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
-        { permission: '/noisedata/list', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
-        { permission: '/harmfuldata/list', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
-        { permission: '/tempdata/list', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
-        { permission: '/welllocadata/list', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
-        { permission: '/liquidGasData/list', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
-        { permission: '/tubedata/list', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
-        { permission: '/gasdector/listPage', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
-        { permission: '/pantilt/listPage', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
-        { permission: '/hydrantdata/list', label: '消防栓数据列表', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
+        { permission: '/welldata/list-page', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
+        { permission: '/liquiddata/list-page', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
+        { permission: '/gasdata/list-page', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
+        { permission: '/digdata/list-page', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
+        { permission: '/noisedata/list-page', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
+        { permission: '/harmfuldata/list-page', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
+        { permission: '/tempdata/list-page', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
+        { permission: '/welllocadata/list-page', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
+        { permission: '/liquidGasData/list-page', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
+        { permission: '/tubedata/list-page', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
+        { permission: '/gasdector/list-page', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
+        { permission: '/pantilt/list-page', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
+        { permission: '/hydrantdata/list-page', label: '消防栓防盗水监测仪', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
       ] // 所有tab列表
     }
   },
diff --git a/src/views/dataManage/deviceData/listDigData.vue b/src/views/dataManage/deviceData/listDigData.vue
index fa4bbc7..3cb74ad 100644
--- a/src/views/dataManage/deviceData/listDigData.vue
+++ b/src/views/dataManage/deviceData/listDigData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/digdata/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 align="center" type="selection" width="55"/>-->
-        <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('/digdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListDigData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -185,6 +116,8 @@
       if (params && params.deviceType === this.type && params.devcode) {
         this.listQuery.keywords = params.devcode
         this.fetchData()
+      } else {
+        this.fetchData()
       }
     }
   },
@@ -203,21 +136,16 @@
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
-        text: '数据处理中,请稍后...',
+        text: '下载中,请稍后...',
         spinner: 'el-icon-loading',
         background: 'rgba(0, 0, 0, 0.7)'
       })
       batchExportDigData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +160,50 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getDigData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         return 'warning-state'
       }
     },
-    indexMethod(index) {
-      return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
-    },
-    // 改变页容量
-    handleSizeChange(val) {
-      this.listQuery.limit = val
+    // checkState(row) {
+    //   if (row.status !== '0') {
+    //     return 'warning-state'
+    //   }
+    // },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    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
   }
diff --git a/src/views/dataManage/deviceData/listGasdectorData.vue b/src/views/dataManage/deviceData/listGasdectorData.vue
index a78b8da..b4ecd07 100644
--- a/src/views/dataManage/deviceData/listGasdectorData.vue
+++ b/src/views/dataManage/deviceData/listGasdectorData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/gasdector/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('/liquidGasData/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listHarmfulData.vue b/src/views/dataManage/deviceData/listHarmfulData.vue
index dde92b4..c29cb2e 100644
--- a/src/views/dataManage/deviceData/listHarmfulData.vue
+++ b/src/views/dataManage/deviceData/listHarmfulData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -27,44 +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('/harmfuldata/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 align="center" type="selection" width="55"/>-->
-        <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('/harmfuldata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,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: 'ListHarmfulData',
@@ -84,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,92 +88,32 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: 'CO浓度(ppm)',
-          value: 'CO',
-          align: 'center'
-        },
-        {
-          text: 'CH4浓度(%VOL)',
-          value: 'CH4',
-          align: 'center'
-        },
-        {
-          text: 'H2S浓度(ppm)',
-          value: 'H2S',
-          align: 'center'
-        },
-        {
-          text: 'O2浓度(ppm)',
-          value: 'O2',
-          align: 'center'
-        },
-        {
-          text: '液位开关',
-          value: 'switch',
-          align: 'center'
-        },
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: 'CO浓度(ppm)', value: 'CO', align: 'center' },
+        { text: 'CH4浓度(%VOL)', value: 'CH4', align: 'center' },
+        { text: 'H2S浓度(ppm)', value: 'H2S', align: 'center' },
+        { text: 'O2浓度(ppm)', value: 'O2', align: 'center' },
+        { text: '液位开关', value: 'switch', align: 'center' },
         // {
         //   text: '状态描述',
         //   value: 'descn',
         //   align: 'center'
         // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -221,15 +148,10 @@
       })
       batchExportHarmfulData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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 = `有害监测仪数s据.xlsx` // 下载后文件名
-        document.body.appendChild(downloadElement)
-        downloadElement.click() // 点击下载
-        document.body.removeChild(downloadElement) // 下载完成移除元素
-        window.URL.revokeObjectURL(href) // 释放blob对象
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
       })
@@ -244,69 +166,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getHarmfulData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listHydrantData.vue b/src/views/dataManage/deviceData/listHydrantData.vue
index 575345d..f968760 100644
--- a/src/views/dataManage/deviceData/listHydrantData.vue
+++ b/src/views/dataManage/deviceData/listHydrantData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -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('/hydrantdata/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('/hydrantdata/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>
 
@@ -59,15 +58,6 @@
 export default {
   name: 'ListHydrantData',
   components: { DeptSelect },
-  /* filters: {
-    dataFilter(val) {
-      if (val === '40%LEL' || val === '60%LEL') {
-        return '0%LEL'
-      } else {
-        return val
-      }
-    }
-  }, */
   props: {
     type: {
       type: String,
@@ -75,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -91,10 +81,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', width: 170, align: 'center' },
@@ -105,17 +91,16 @@
         { text: '状态描述', value: 'descn', align: 'center' },
         { text: '消防栓状态', value: 'status', align: 'center' },
         { text: '上传时间', value: 'logtime', align: 'center' }
-        // { text: '点位编号', value: 'wellCode', align: 'center' },
-        // { text: '燃气浓度(%LEL)', value: 'strength', align: 'center', filter: true },
-        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
-        // { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -141,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -163,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取消防栓配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -186,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -207,35 +192,6 @@
 </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
 }
diff --git a/src/views/dataManage/deviceData/listLiquidData.vue b/src/views/dataManage/deviceData/listLiquidData.vue
index 96f28f6..d818684 100644
--- a/src/views/dataManage/deviceData/listLiquidData.vue
+++ b/src/views/dataManage/deviceData/listLiquidData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -26,45 +26,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('/liquiddata/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 align="center" type="selection" width="55"/>-->
-        <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('/liquiddata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,6 +58,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: 'ListLiquidData',
@@ -84,7 +70,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,74 +87,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '液位值(m)',
-          value: 'liquiddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '液位值(m)', value: 'liquiddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -204,16 +140,10 @@
       })
       batchExportLiquidData(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()
       })
@@ -228,69 +158,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listLiquidGasData.vue b/src/views/dataManage/deviceData/listLiquidGasData.vue
index 160edde..f2801c2 100644
--- a/src/views/dataManage/deviceData/listLiquidGasData.vue
+++ b/src/views/dataManage/deviceData/listLiquidGasData.vue
@@ -9,7 +9,8 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
+          size="small"
           dept-type="03"
           placeholder="选择权属单位/使用单位"
         />
@@ -32,46 +33,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('/liquidGasData/export')" :disabled="list.length === 0" 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 align="center" type="selection" width="55"/>-->
-        <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('/liquidGasData/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-if="column.unitFilter">{{ scope.row[column.value]|unit }}</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>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>
   </app-container>
 </template>
 
@@ -80,6 +65,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: 'ListLiquidGasData',
@@ -104,7 +90,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -122,80 +108,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '燃气浓度',
-          value: 'data',
-          align: 'center',
-          unitFilter: true
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'companyName',
-          align: 'center'
-        },
-        {
-          text: '使用单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '燃气浓度', value: 'data', align: 'center', unitFilter: true },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'companyName', align: 'center' },
+        { text: '使用单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -235,20 +166,10 @@
       })
       batchExportLiquidGasData(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
-        if (this.listQuery.sensorType === 'liquid') {
-          downloadElement.download = `燃气智能终端（一体化）数据-液位.xlsx` // 下载后文件名
-        } else {
-          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()
       })
@@ -359,69 +280,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidGasData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listNoiseData.vue b/src/views/dataManage/deviceData/listNoiseData.vue
index 5e31021..ab4faf4 100644
--- a/src/views/dataManage/deviceData/listNoiseData.vue
+++ b/src/views/dataManage/deviceData/listNoiseData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/noisedata/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 align="center" type="selection" width="55"/>-->
-        <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('/noisedata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListNoiseData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        // { text: '状态描述', value: 'descn', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -209,15 +141,10 @@
       })
       batchExportNoiseData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +159,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getNoiseData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listPantiltData.vue b/src/views/dataManage/deviceData/listPantiltData.vue
index c2030da..1609544 100644
--- a/src/views/dataManage/deviceData/listPantiltData.vue
+++ b/src/views/dataManage/deviceData/listPantiltData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/pantilt/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('/pantilt/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listTempData.vue b/src/views/dataManage/deviceData/listTempData.vue
index ceb3b61..33a3a93 100644
--- a/src/views/dataManage/deviceData/listTempData.vue
+++ b/src/views/dataManage/deviceData/listTempData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/tempdata//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 align="center" type="selection" width="55"/>-->
-        <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('/tempdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListTempData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,79 +88,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '温度(℃)',
-          value: 'temperature',
-          align: 'center'
-        },
-        {
-          text: '湿度(%RH)',
-          value: 'humidity',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '温度(℃)', value: 'temperature', align: 'center' },
+        { text: '湿度(%RH)', value: 'humidity', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -207,15 +141,10 @@
       })
       batchExportTempData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -230,69 +159,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getTempData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listTubeData.vue b/src/views/dataManage/deviceData/listTubeData.vue
index a8c5267..e0e6ab8 100644
--- a/src/views/dataManage/deviceData/listTubeData.vue
+++ b/src/views/dataManage/deviceData/listTubeData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" :need-top="false" size="small" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -21,44 +21,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('/tubedata/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 align="center" type="selection" width="55"/>-->
-        <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('/tubedata/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>
-      </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>
   </app-container>
 </template>
 
@@ -67,6 +53,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: 'ListTubeData',
@@ -78,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -95,53 +82,22 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '燃气浓度(%LEL)',
-          value: 'strength',
-          align: 'center'
-        },
-        // {
-        //   text: '电量(%)',
-        //   value: 'cell',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   align: 'center'
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '燃气浓度(%LEL)', value: 'strength', align: 'center' },
+        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        // { text: '状态描述', value: 'descn', align: 'center' },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // multipleSelection: [], // 多选选中项
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       deviceTypeList: [], // 燃气配置类型列表
       deptProps: {
         parent: 'pid',
@@ -149,25 +105,12 @@
         label: 'name',
         children: 'children'
       }, // 权属单位树形下拉菜单
-      deptTreeList: null, // 组织树列表数据
-      showDeptTree: 0, // 是否显示权属单位下拉
-      showDeviceType: true, // 是否显示设备类型下拉
+      // deptTreeList: null, // 组织树列表数据
+      // showDeptTree: 0, // 是否显示权属单位下拉
+      // showDeviceType: true, // 是否显示设备类型下拉
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      editShow: false, // 是否显示编辑框
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -202,15 +145,10 @@
       })
       batchExportTubeData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -225,69 +163,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getTubeData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listWellLocaData.vue b/src/views/dataManage/deviceData/listWellLocaData.vue
index 66722a2..e9609c8 100644
--- a/src/views/dataManage/deviceData/listWellLocaData.vue
+++ b/src/views/dataManage/deviceData/listWellLocaData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/welllocadata/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 align="center" type="selection" width="55"/>-->
-        <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('/welllocadata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListWellLocaData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,72 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '经度',
-          value: 'lng',
-          align: 'center'
-        },
-        {
-          text: '纬度',
-          value: 'lat',
-          align: 'center'
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'logtime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '经度', value: 'lng', align: 'center' },
+        { text: '纬度', value: 'lat', align: 'center' },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'logtime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -200,15 +140,10 @@
       })
       batchExportWellLocaData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -223,69 +158,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getWellLocaData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataView/components/alarmStatus.vue b/src/views/dataView/components/alarmStatus.vue
deleted file mode 100644
index f2b74b5..0000000
--- a/src/views/dataView/components/alarmStatus.vue
+++ /dev/null
@@ -1,164 +0,0 @@
-<template>
-  <el-row :gutter="40" class="panel-group">
-    <div>
-      <el-col>
-        <div class="flagBoxStyle">
-          <div class="flagStyle" />
-          <div>工单情况</div>
-        </div>
-      </el-col>
-    </div>
-    <el-row>
-      <el-col :span="12">
-        <ve-bar
-          :data="chartData"
-          :grid="grid"
-          :extend="extend"
-          :settings="chartSettings"
-        />
-      </el-col>
-      <el-col :span="12">
-        <div class="tableStyle">
-          <el-table border :data="tableList" stripe>
-            <el-table-column prop="name" label="设备型号" />
-            <el-table-column prop="value" label="设备名称" />
-          </el-table>
-        </div>
-      </el-col>
-    </el-row>
-  </el-row>
-</template>
-
-<script>
-import { wellCountByBfzt } from '@/api/well/well'
-import { deviceStaticByStatus, alarmNowStatic } from '@/api/data/dataStatics'
-import { jobCountByStatus } from '@/api/alarm/job'
-export default {
-  name: 'AlarmStatus',
-  data() {
-    return {
-      // 柱状图
-      extend: {
-        xAxis: {
-          axisLabel: {
-            rotate: 30,
-            margin: 30,
-            textStyle: {
-              align: 'center'
-            }
-          }
-        },
-        series: {
-          label: { show: true, position: 'top' },
-          barMaxWidth: 35 // 最大柱宽度
-        }
-      },
-      grid: {
-        right: 60
-      },
-      chartSettings: {
-        itemStyle: {
-          'barCategoryGap': 5
-        },
-        barWidth: 15,
-        labelMap: {
-          'deviceType': '权属单位',
-          'offline': '设备数量（个）'
-        },
-        dimension: ['deviceType'],
-        metrics: ['offline']
-      },
-      chartData: {
-        columns: ['deviceType', 'offline'],
-        rows: []
-      },
-      tableList: [],
-      dataGroup: [
-        {
-          title: '井',
-          context: '--',
-          flags: '条',
-          icon: 'icon-alarm',
-          color: '#40c9c6',
-          permission: '/well/list'
-        }
-      ]
-    }
-  },
-  created() {
-    this.getWellCount()
-    this.getDeviceCount()
-    this.getAlarmCount()
-    this.getJobCount()
-  },
-  mounted() {
-    this.tableList = [
-      {
-        value: 'WELL-001',
-        name: '液位超限'
-      },
-      {
-        value: 'WELL-002',
-        name: '燃气浓度超限'
-      },
-      {
-        value: 'WELL-003',
-        name: '井盖开启'
-      },
-      {
-        value: 'WELL-004',
-        name: '井盖开启'
-      }
-    ]
-  },
-  methods: {
-    refresh() {
-      this.getAlarmCount()
-      this.getJobCount()
-    },
-    getWellCount() {
-      wellCountByBfzt().then(response => {
-        this.dataGroup[0].context = response.data.total
-      })
-    },
-    getDeviceCount() {
-      deviceStaticByStatus().then(response => {
-        this.dataGroup[1].context = response.data.total
-      })
-    },
-    getAlarmCount() {
-      alarmNowStatic().then(response => {
-        this.dataGroup[2].context = response.data.total
-      })
-    },
-    getJobCount() {
-      jobCountByStatus().then(response => {
-        const data = response.data
-        const total = data.beforeGet + data.beforeConfirm + data.inHandle
-        this.dataGroup[3].context = total
-      })
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.tableStyle{
-  padding: 20px;
-}
-.flagBoxStyle {
-  display: flex;
-  margin-bottom: 20px;
-}
-.flagBoxStyle div:nth-child(2){
-  line-height: 30px;
-  font-weight: 600;
-}
-.flagStyle {
-  width: 4px;
-  height: 30px;
-  margin-right: 6px;
-  background: rgb(64 121 242);
-}
-
-</style>
diff --git a/src/views/dataView/components/alarmView.vue b/src/views/dataView/components/alarmView.vue
index 5c02f41..e13f811 100644
--- a/src/views/dataView/components/alarmView.vue
+++ b/src/views/dataView/components/alarmView.vue
@@ -1,106 +1,124 @@
+<!--报警分析-->
 <template>
-  <div>
-    <div class="flagBoxStyle">
-      <div class="flagStyle" />
-      <div>报警分析</div>
-    </div>
-    <el-row>
-      <el-col :span="12">
-        <ve-line
-          :data="chartDataLine"
-          :settings="chartSettingsLine"
+  <panel-card title="报警分析">
+    <template slot="func">
+      <el-col :span="16">
+        <el-date-picker
+          v-model="timeRange"
+          type="datetimerange"
+          range-separator="至"
+          size="small"
+          :picker-options="pickerOptions"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          start-placeholder="开始时间"
+          end-placeholder="结束时间"
+          @change="refresh"
         />
       </el-col>
-      <el-col :span="12">
-        <div class="tableStyle">
-          <el-table border :data="tableList" stripe>
-            <el-table-column prop="name" label="报警类型" />
-            <el-table-column prop="value" label="设备名称" />
-          </el-table>
-        </div>
-      </el-col>
-    </el-row>
-  </div>
+    </template>
+    <div class="flex-container">
+      <div class="flex-left">
+        <ve-line
+          :data="chartData"
+          :settings="chartSettingsLine"
+        />
+      </div>
+      <div class="flex-right">
+        <el-table border :data="tableList" stripe empty-text="无报警" height="340">
+          <el-table-column prop="name" label="报警类型" align="center" />
+          <el-table-column prop="value" label="报警数量" align="center" />
+        </el-table>
+      </div>
+    </div>
+  </panel-card>
 </template>
 
 <script>
-import { alarmStaticsByContent } from '@/api/alarm/deviceStatics'
+import { alarmStaticByDay, alarmStaticsByContent } from '@/api/data/dataStatics'
+import PanelCard from '@/components/BigData/Card/panelCard'
+import { getSearchLastWeekTime } from '@/utils/dateutils'
+
 export default {
   name: 'AlarmStaticsByType',
+  components: { PanelCard },
   data() {
     return {
-      tableList: [],
+      listQuery: {
+        deviceType: '',
+        beginTime: '',
+        endTime: ''
+      }, // 查询条件
+      timeRange: [], // 时间范围
+      tableList: [], // 列表
       // 折线图
       chartSettingsLine: {
         labelMap: {
-          'alarmWellData': '井盖开盖报警',
-          'alarmLiquidData': '液位超限报警',
-          'alarmHarmfulData': '有害气体超标报警'
+          'date': '日期',
+          'alarmTimes': '报警次数'
         },
-        metrics: ['alarmWellData', 'alarmLiquidData', 'alarmHarmfulData'],
         dimension: ['date']
-      },
-      chartDataLine: {
-        columns: ['date', 'alarmWellData', 'alarmLiquidData', 'alarmHarmfulData'],
+      }, // 配置
+      chartData: {
+        columns: ['date', 'alarmTimes'],
         rows: []
-      }
+      } // 折线图数据
     }
   },
   created() {
-    this.fetchDeviceTypeLine()
-  },
-  mounted() {
-    this.tableList = [
-      {
-        value: '224',
-        name: '井盖开启'
-      },
-      {
-        value: '22',
-        name: '燃气浓度超限'
-      },
-      {
-        value: '1',
-        name: '液位超限'
-      },
-      {
-        value: '4',
-        name: '有害气体超标'
-      }
-    ]
+    this.timeRange = getSearchLastWeekTime()
+    this.refresh()
   },
   methods: {
-    fetchDeviceTypeLine(val) {
-      if (val !== undefined) {
-        this.listQuery.startTime = val[0]
-        this.listQuery.endTime = val[1]
-      }
-      alarmStaticsByContent(this.listStatue).then(response => {
-        console.log(response.data, '===123')
-        this.chartDataLine.rows = response.data
+    refresh() {
+      this.handleDateTime()
+      this.fetchAlarmByDay()
+      this.fetchAlarmByContent()
+    },
+    // 获取各类报警的列表
+    fetchAlarmByContent() {
+      alarmStaticsByContent(this.listQuery).then(response => {
+        this.tableList = response.data
       })
+    },
+    // 获取每日报警数
+    fetchAlarmByDay() {
+      // 模拟数据
+      // this.chartData.rows = [
+      //   { 'date': '9月20日', 'alarmTimes': 153, 'alarmWells': 43 },
+      //   { 'date': '9月21日', 'alarmTimes': 150, 'alarmWells': 30 },
+      //   { 'date': '9月22日', 'alarmTimes': 143, 'alarmWells': 23 },
+      //   { 'date': '9月23日', 'alarmTimes': 173, 'alarmWells': 23 },
+      //   { 'date': '9月24日', 'alarmTimes': 272, 'alarmWells': 52 },
+      //   { 'date': '9月25日', 'alarmTimes': 253, 'alarmWells': 53 }
+      // ]
+      alarmStaticByDay(this.listQuery).then(response => {
+        this.chartData.rows = response.data
+      })
+    },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
     }
   }
 }
 </script>
 
 <style lang="scss" scoped>
-.tableStyle{
-  // padding: 100px 10px;
-}
-.flagBoxStyle {
+.flex-container{
   display: flex;
-  margin-bottom: 20px;
-}
-.flagBoxStyle div:nth-child(2){
-  line-height: 30px;
-  font-weight: 600;
-}
-.flagStyle {
-  width: 4px;
-  height: 30px;
-  margin-right: 6px;
-  background: rgb(64 121 242);
+  .flex-left{
+    flex:1;
+  }
+  .flex-right{
+    width: 260px;
+    padding: 10px 20px;
+  }
 }
 
 </style>
diff --git a/src/views/dataView/components/jobAnalysis.vue b/src/views/dataView/components/jobAnalysis.vue
new file mode 100644
index 0000000..483e652
--- /dev/null
+++ b/src/views/dataView/components/jobAnalysis.vue
@@ -0,0 +1,106 @@
+<!--工单情况-->
+<template>
+  <panel-card title="工单分析">
+    <template slot="func">
+      <el-col :span="16">
+        <el-date-picker
+          v-model="timeRange"
+          type="datetimerange"
+          range-separator="至"
+          size="small"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          start-placeholder="开始时间"
+          end-placeholder="结束时间"
+          @change="refresh"
+        />
+      </el-col>
+    </template>
+    <ve-bar
+      :data="chartData"
+      :extend="extend"
+      :settings="chartSettings"
+    />
+  </panel-card>
+</template>
+
+<script>
+import PanelCard from '@/components/BigData/Card/panelCard'
+import { getSearchLastWeekTime } from '@/utils/dateutils'
+import { jobStaticsByDept } from '@/api/data/dataStatics'
+export default {
+  name: 'JobAnalysis',
+  components: { PanelCard },
+  data() {
+    return {
+      listQuery: {
+        beginTime: '',
+        endTime: ''
+      }, // 查询条件
+      timeRange: [], // 时间范围
+      chartSettings: {
+        labelMap: {
+          'deptName': '权属单位',
+          'beforeGet': '待处理',
+          'beforeConfirm': '待确认',
+          'inHandle': '处理中',
+          'over': '已完成'
+        },
+        stack: {
+          'xxx': ['beforeGet', 'beforeConfirm', 'inHandle', 'over']
+        }
+      },
+      extend: {
+        xAxis: {
+          type: 'value',
+          minInterval: 1
+        },
+        series: {
+          barMaxWidth: 35
+        }
+      },
+      chartData: {
+        columns: ['deptName', 'beforeGet', 'beforeConfirm', 'inHandle', 'over'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.timeRange = getSearchLastWeekTime()
+    this.refresh()
+  },
+  mounted() {
+  },
+  methods: {
+    refresh() {
+      this.handleDateTime()
+      this.fetchData()
+    },
+    fetchData() {
+      jobStaticsByDept(this.listQuery).then(response => {
+        this.chartData.rows = response.data
+        const maxValue = Math.max.apply(Math, response.data.map(function(item) {
+          return parseInt(item.beforeGet) + parseInt(item.beforeConfirm) + parseInt(item.inHandle) + parseInt(item.over)
+        }))
+        if (maxValue < 10) {
+          this.extend.xAxis = { type: 'value', minInterval: 1, max: 10 }
+        } else {
+          this.extend.xAxis = { type: 'value', minInterval: 1 }
+        }
+      })
+    },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+</style>
diff --git a/src/views/dataView/components/panelGroup.vue b/src/views/dataView/components/panelGroup.vue
index cdb9180..7cae96f 100644
--- a/src/views/dataView/components/panelGroup.vue
+++ b/src/views/dataView/components/panelGroup.vue
@@ -1,82 +1,54 @@
 <template>
-  <el-row :gutter="20" class="panel-group">
-    <div>
-      <el-col>
-        <div class="flagBoxStyle">
-          <div class="flagStyle" />
-          <div>数据总体情况</div>
-        </div>
-      </el-col>
+  <panel-card title="数据总体情况">
+    <div class="panel-group">
+      <div v-for="card in dataGroup" :key="card.title" class="card-panel">
+        <card :title="card.title" :context="card.context" :flags="card.flags" :icon="card.icon" :color="card.color" shadow="never" @click.native="goPage(card)" />
+      </div>
     </div>
-    <div v-for="card in dataGroup" :key="card.title">
-      <el-col v-if="hasPerm(card.permission)" :lg="{span:'4-8'}" :md="8" :sm="12" :xs="24" class="card-panel-col">
-        <card :title="card.title" :context="card.context" :flags="card.flags" :icon="card.icon" :color="card.color" @click.native="goPage(card)" />
-      </el-col>
-    </div>
-    <el-dialog append-to-body :visible.sync="dialogFormVisible">
-      <el-table v-loading="listLoading" :data="list" class="table" border>
-        <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>{{ scope.row[column.value] }}</span>
-          </template>
-        </el-table-column>
-      </el-table>
-    </el-dialog>
-  </el-row>
+  </panel-card>
+<!--  <el-row :gutter="20" class="panel-group">-->
+<!--    &lt;!&ndash;    <el-dialog append-to-body :visible.sync="dialogFormVisible">&ndash;&gt;-->
+<!--    &lt;!&ndash;      <el-table v-loading="listLoading" :data="list" class="table" border>&ndash;&gt;-->
+<!--    &lt;!&ndash;        <el-table-column&ndash;&gt;-->
+<!--    &lt;!&ndash;          v-for="column in columns"&ndash;&gt;-->
+<!--    &lt;!&ndash;          :key="column.value"&ndash;&gt;-->
+<!--    &lt;!&ndash;          :label="column.text"&ndash;&gt;-->
+<!--    &lt;!&ndash;          :width="column.width"&ndash;&gt;-->
+<!--    &lt;!&ndash;          :align="column.align"&ndash;&gt;-->
+<!--    &lt;!&ndash;          show-overflow-tooltip&ndash;&gt;-->
+<!--    &lt;!&ndash;        >&ndash;&gt;-->
+<!--    &lt;!&ndash;          <template v-slot="scope">&ndash;&gt;-->
+<!--    &lt;!&ndash;            <span>{{ scope.row[column.value] }}</span>&ndash;&gt;-->
+<!--    &lt;!&ndash;          </template>&ndash;&gt;-->
+<!--    &lt;!&ndash;        </el-table-column>&ndash;&gt;-->
+<!--    &lt;!&ndash;      </el-table>&ndash;&gt;-->
+<!--    &lt;!&ndash;    </el-dialog>&ndash;&gt;-->
+<!--  </el-row>-->
 </template>
 
 <script>
 import Card from '@/components/BigData/Card'
 import { wellCountByBfzt } from '@/api/well/well'
-import { deviceStaticByStatus, alarmNowStatic } from '@/api/data/dataStatics'
-import { jobCountByStatus } from '@/api/alarm/job'
+import { deviceStaticByStatus, alarmNowStatic, dataCount } from '@/api/data/dataStatics'
+import PanelCard from '@/components/BigData/Card/panelCard'
+import { getDayTime } from '@/utils/dateutils'
 export default {
   name: 'PanelGroup',
-  components: { Card },
+  components: { PanelCard, Card },
   data() {
     return {
-      dialogFormVisible: false,
-      listLoading: false,
       columns: [
-        {
-          text: '设备编号',
-          value: '',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: '',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: '',
-          align: 'center'
-        },
-        {
-          text: '最新记录上传时间',
-          width: '200',
-          value: '',
-          align: 'center'
-        },
-        {
-          text: '离线天数',
-          value: '',
-          align: 'center'
-        }
+        { text: '设备编号', value: '', align: 'center' },
+        { text: '设备类型', value: '', align: 'center' },
+        { text: '点位编号', value: '', align: 'center' },
+        { text: '最新记录上传时间', width: '200', value: '', align: 'center' },
+        { text: '离线天数', value: '', align: 'center' }
       ], // 显示列
       dataGroup: [
         {
-          title: '井',
+          title: '安装点位',
           context: '--',
-          flags: '条',
+          flags: '个',
           icon: 'icon-well',
           color: '#40c9c6',
           permission: '/well/list'
@@ -93,25 +65,25 @@
           title: '今日数据',
           context: '--',
           flags: '条',
-          icon: 'icon-alarm',
-          color: '#f4516c',
-          permission: '/alarm/now'
+          icon: 'icon-database',
+          color: '#1ed8f3',
+          permission: '/data'
         },
         {
           title: '离线设备',
           context: '--',
           flags: '个',
-          icon: 'icon-order',
-          color: '#f4516c',
-          permission: '/job/list'
+          icon: 'icon-device',
+          color: '#676767',
+          permission: '/device/list'
         },
         {
           title: '当前报警',
           context: '--',
           flags: '条',
           icon: 'icon-alarm',
-          color: '#40c9c6',
-          permission: '/well/list'
+          color: '#f4516c',
+          permission: '/alarm/now'
         }
       ]
     }
@@ -120,34 +92,36 @@
     this.getWellCount()
     this.getDeviceCount()
     this.getAlarmCount()
-    this.getJobCount()
+    this.getTodayDataCount()
   },
   methods: {
-    goPage(card) {
-      if (card.title === '离线设备') {
-        this.dialogFormVisible = true
-      }
-    },
+    // 获取井数量
     getWellCount() {
       wellCountByBfzt().then(response => {
         this.dataGroup[0].context = response.data.total
       })
     },
+    // 获取设备数量， 离线设备数量
     getDeviceCount() {
       deviceStaticByStatus().then(response => {
         this.dataGroup[1].context = response.data.total
+        this.dataGroup[3].context = response.data.offline
       })
     },
+    // 获取当前报警数量
     getAlarmCount() {
       alarmNowStatic().then(response => {
-        this.dataGroup[2].context = response.data.total
+        this.dataGroup[4].context = response.data.total
       })
     },
-    getJobCount() {
-      jobCountByStatus().then(response => {
-        const data = response.data
-        const total = data.beforeGet + data.beforeConfirm + data.inHandle
-        this.dataGroup[3].context = total
+    // 获取今日数据总数
+    getTodayDataCount() {
+      const beginTime = getDayTime(new Date().getTime()).Format('yyyy-MM-dd hh:mm:ss')
+      const endTime = new Date().Format('yyyy-MM-dd hh:mm:ss')
+      const params = { beginTime, endTime }
+      dataCount(params).then(response => {
+        debugger
+        this.dataGroup[2].context = response.data.total
       })
     }
   }
@@ -155,174 +129,16 @@
 </script>
 
 <style lang="scss" scoped>
-.flagBoxStyle {
-  display: flex;
-  margin-bottom: 20px;
-  margin-top: -20px;
-}
-.flagBoxStyle div:nth-child(2){
-  line-height: 30px;
-  font-weight: 600;
-}
-.flagStyle {
-  width: 4px;
-  height: 30px;
-  margin-right: 6px;
-  background: rgb(64 121 242);
-}
 .panel-group {
-  margin-top: 18px;
-  .card-panel-col {
-    margin-bottom: 32px;
-  }
+  display: flex;
+  margin: 10px;
+  justify-content: space-between;
   .card-panel {
-    height: 108px;
-    cursor: pointer;
-    font-size: 12px;
-    position: relative;
-    overflow: hidden;
-    color: #666;
-    background: #fff;
-    box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
-    border-color: rgba(0, 0, 0, .05);
-
-    &:hover {
-      .card-panel-icon-wrapper {
-        color: #fff;
-      }
-
-      .icon-people {
-        background: #40c9c6;
-      }
-
-      .icon-message {
-        background: #36a3f7;
-      }
-
-      .icon-money {
-        background: #f4516c;
-      }
-
-      .icon-shopping {
-        background: #34bfa3
-      }
-    }
-
-    .icon-people {
-      color: #40c9c6;
-    }
-
-    .icon-message {
-      color: #36a3f7;
-    }
-
-    .icon-money {
-      color: #f4516c;
-    }
-
-    .icon-shopping {
-      color: #34bfa3
-    }
-
-    .card-panel-icon-wrapper {
-      float: left;
-      margin: 14px 0 0 14px;
-      padding: 16px;
-      transition: all 0.38s ease-out;
-      border-radius: 6px;
-    }
-
-    .card-panel-icon {
-      float: left;
-      font-size: 48px;
-    }
-
-    .card-panel-description {
-      float: right;
-      font-weight: bold;
-      margin: 26px;
-      margin-left: 0px;
-
-      .card-panel-text {
-        line-height: 18px;
-        color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
-        margin-bottom: 12px;
-      }
-
-      .card-panel-num {
-        font-size: 20px;
-      }
-    }
+    flex: 1;
+  }
+  .card-panel + .card-panel  {
+    margin-left: 20px;
   }
 }
 
-  @media only screen and (min-width: 768px) {
-    .el-col-sm-4-8 {
-      width: 20%;
-    }
-    .el-col-sm-offset-4-8 {
-      margin-left: 20%;
-    }
-    .el-col-sm-pull-4-8 {
-      position: relative;
-      right: 20%;
-    }
-    .el-col-sm-push-4-8 {
-      position: relative;
-      left: 20%;
-    }
-  }
-
-  @media only screen and (min-width: 992px) {
-    .el-col-md-4-8 {
-      width: 20%;
-    }
-    .el-col-md-offset-4-8 {
-      margin-left: 20%;
-    }
-    .el-col-md-pull-4-8 {
-      position: relative;
-      right: 20%;
-    }
-    .el-col-md-push-4-8 {
-      position: relative;
-      left: 20%;
-    }
-  }
-
-  @media only screen and (min-width: 1200px) {
-    .el-col-lg-4-8 {
-      width: 20%;
-    }
-    .el-col-lg-offset-4-8 {
-      margin-left: 20%;
-    }
-    .el-col-lg-pull-4-8 {
-      position: relative;
-      right: 20%;
-    }
-    .el-col-lg-push-4-8 {
-      position: relative;
-      left: 20%;
-    }
-  }
-
-  @media only screen and (min-width: 1920px) {
-    .el-col-xl-4-8 {
-      width: 20%;
-    }
-    .el-col-xl-offset-4-8 {
-      margin-left: 20%;
-    }
-    .el-col-xl-pull-4-8 {
-      position: relative;
-      right: 20%;
-    }
-    .el-col-xl-push-4-8 {
-      position: relative;
-      left: 20%;
-    }
-  }
-
 </style>

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index b9e5ee6..09fb191 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-card :body-style="{ padding: '0px' }" shadow="always">
-    <div class="card-panel" >
+  <el-card :body-style="{ padding: '0px' }" :shadow="shadow">
+    <div class="card-panel">
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
@@ -24,27 +24,31 @@
     title: {
       type: String,
       default: '标题'
-    },
+    }, // 标题
     flags: {
       type: String,
       default: '单位'
-    },
+    }, // 单位
     subtitle: {
       type: String,
       default: ''
-    },
+    }, // 小标题
     icon: {
       type: String,
       default: ''
-    },
+    }, // 图标
     context: {
       type: [String, Number],
       default: ''
-    },
+    }, // 内容
     color: {
       type: String,
       default: '#40c9c6'
-    }
+    }, // 图标颜色
+    shadow: {
+      type: String,
+      default: 'always'
+    } // 卡片阴影
   },
   computed: {
     backgroundColor() {
diff --git a/src/components/BigData/Card/panelCard.vue b/src/components/BigData/Card/panelCard.vue
new file mode 100644
index 0000000..d6a7b89
--- /dev/null
+++ b/src/components/BigData/Card/panelCard.vue
@@ -0,0 +1,51 @@
+<template>
+  <div class="panel-container">
+    <div class="panel-title">
+      {{ title }}
+      <div class="title-right">
+        <slot name="func" />
+      </div>
+    </div>
+    <div class="panel-body">
+      <slot />
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'PanelCard',
+  props: {
+    // 标题
+    title: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.panel-container{
+  width: 100%;
+  padding: 10px;
+  border: 1px solid #EBEEF5 ;
+  .panel-title{
+    width: 100%;
+    line-height: 2;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0px 10px;
+    border-left: 5px solid #66b1ff;
+    position: relative;
+    .title-right{
+      display: inline-block;
+      position: absolute;
+      right: 10px;
+    }
+  }
+  .panel-body{
+    padding: 5px 0px;
+    height:auto;
+  }
+}
+</style>
diff --git a/src/icons/svg/icon-database.svg b/src/icons/svg/icon-database.svg
new file mode 100644
index 0000000..d3dd1c8
--- /dev/null
+++ b/src/icons/svg/icon-database.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1658711872102" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1435" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M960 123.7C872.7 49.9 704.8 0 512 0S151.3 49.9 64 123.7C23.2 158.2 0 197.8 0 240V605.9c0 0.7 0 1.4 0.1 2H0v176c0 132.5 229.2 240 512 240s512-107.5 512-240V608h-0.1c0.1-1.8 0.1-3.5 0.1-5.3V240c0-42.2-23.2-81.8-64-116.3zM64 356.3C151.3 430.1 319.2 480 512 480s360.7-49.9 448-123.7v79.2c-17.9 11.5-37.5 22.2-58.8 32.2C796.2 516.9 658 544 512 544s-284.2-27.1-389.2-76.4c-21.3-10-40.9-20.7-58.8-32.2v-79.1z m0 181.3c87.3 73.8 255.2 123.7 448 123.7s360.7-49.9 448-123.7v79.2c-17.9 11.4-37.5 22.2-58.8 32.2-105 49.2-243.3 76.3-389.2 76.3S227.8 698.2 122.8 649c-21.3-10-40.9-20.7-58.8-32.2v-79.2z m837.2 292.7c-105 49.2-243.3 76.3-389.2 76.3s-284.2-27.1-389.2-76.3c-20.3-9.5-39.1-19.8-56.4-30.6-1.6-5.3-2.4-10.5-2.4-15.7v-65c87.3 73.8 255.2 123.7 448 123.7s360.7-50 448-123.7v65c0 5.1-0.8 10.4-2.4 15.7-17.3 10.9-36.1 21.1-56.4 30.6z" p-id="1436"></path></svg>
\ No newline at end of file
diff --git a/src/views/dataManage/dataManage.vue b/src/views/dataManage/dataManage.vue
index 71be03f..0564cdd 100644
--- a/src/views/dataManage/dataManage.vue
+++ b/src/views/dataManage/dataManage.vue
@@ -31,19 +31,19 @@
     return {
       activeName: 'wellcover',
       tabList: [
-        { permission: '/welldata/list', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
-        { permission: '/liquiddata/list', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
-        { permission: '/gasdata/list', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
-        { permission: '/digdata/list', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
-        { permission: '/noisedata/list', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
-        { permission: '/harmfuldata/list', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
-        { permission: '/tempdata/list', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
-        { permission: '/welllocadata/list', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
-        { permission: '/liquidGasData/list', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
-        { permission: '/tubedata/list', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
-        { permission: '/gasdector/listPage', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
-        { permission: '/pantilt/listPage', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
-        { permission: '/hydrantdata/list', label: '消防栓数据列表', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
+        { permission: '/welldata/list-page', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
+        { permission: '/liquiddata/list-page', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
+        { permission: '/gasdata/list-page', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
+        { permission: '/digdata/list-page', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
+        { permission: '/noisedata/list-page', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
+        { permission: '/harmfuldata/list-page', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
+        { permission: '/tempdata/list-page', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
+        { permission: '/welllocadata/list-page', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
+        { permission: '/liquidGasData/list-page', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
+        { permission: '/tubedata/list-page', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
+        { permission: '/gasdector/list-page', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
+        { permission: '/pantilt/list-page', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
+        { permission: '/hydrantdata/list-page', label: '消防栓防盗水监测仪', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
       ] // 所有tab列表
     }
   },
diff --git a/src/views/dataManage/deviceData/listDigData.vue b/src/views/dataManage/deviceData/listDigData.vue
index fa4bbc7..3cb74ad 100644
--- a/src/views/dataManage/deviceData/listDigData.vue
+++ b/src/views/dataManage/deviceData/listDigData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/digdata/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 align="center" type="selection" width="55"/>-->
-        <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('/digdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListDigData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -185,6 +116,8 @@
       if (params && params.deviceType === this.type && params.devcode) {
         this.listQuery.keywords = params.devcode
         this.fetchData()
+      } else {
+        this.fetchData()
       }
     }
   },
@@ -203,21 +136,16 @@
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
-        text: '数据处理中,请稍后...',
+        text: '下载中,请稍后...',
         spinner: 'el-icon-loading',
         background: 'rgba(0, 0, 0, 0.7)'
       })
       batchExportDigData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +160,50 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getDigData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         return 'warning-state'
       }
     },
-    indexMethod(index) {
-      return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
-    },
-    // 改变页容量
-    handleSizeChange(val) {
-      this.listQuery.limit = val
+    // checkState(row) {
+    //   if (row.status !== '0') {
+    //     return 'warning-state'
+    //   }
+    // },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    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
   }
diff --git a/src/views/dataManage/deviceData/listGasdectorData.vue b/src/views/dataManage/deviceData/listGasdectorData.vue
index a78b8da..b4ecd07 100644
--- a/src/views/dataManage/deviceData/listGasdectorData.vue
+++ b/src/views/dataManage/deviceData/listGasdectorData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/gasdector/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('/liquidGasData/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listHarmfulData.vue b/src/views/dataManage/deviceData/listHarmfulData.vue
index dde92b4..c29cb2e 100644
--- a/src/views/dataManage/deviceData/listHarmfulData.vue
+++ b/src/views/dataManage/deviceData/listHarmfulData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -27,44 +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('/harmfuldata/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 align="center" type="selection" width="55"/>-->
-        <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('/harmfuldata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,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: 'ListHarmfulData',
@@ -84,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,92 +88,32 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: 'CO浓度(ppm)',
-          value: 'CO',
-          align: 'center'
-        },
-        {
-          text: 'CH4浓度(%VOL)',
-          value: 'CH4',
-          align: 'center'
-        },
-        {
-          text: 'H2S浓度(ppm)',
-          value: 'H2S',
-          align: 'center'
-        },
-        {
-          text: 'O2浓度(ppm)',
-          value: 'O2',
-          align: 'center'
-        },
-        {
-          text: '液位开关',
-          value: 'switch',
-          align: 'center'
-        },
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: 'CO浓度(ppm)', value: 'CO', align: 'center' },
+        { text: 'CH4浓度(%VOL)', value: 'CH4', align: 'center' },
+        { text: 'H2S浓度(ppm)', value: 'H2S', align: 'center' },
+        { text: 'O2浓度(ppm)', value: 'O2', align: 'center' },
+        { text: '液位开关', value: 'switch', align: 'center' },
         // {
         //   text: '状态描述',
         //   value: 'descn',
         //   align: 'center'
         // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -221,15 +148,10 @@
       })
       batchExportHarmfulData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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 = `有害监测仪数s据.xlsx` // 下载后文件名
-        document.body.appendChild(downloadElement)
-        downloadElement.click() // 点击下载
-        document.body.removeChild(downloadElement) // 下载完成移除元素
-        window.URL.revokeObjectURL(href) // 释放blob对象
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
       })
@@ -244,69 +166,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getHarmfulData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listHydrantData.vue b/src/views/dataManage/deviceData/listHydrantData.vue
index 575345d..f968760 100644
--- a/src/views/dataManage/deviceData/listHydrantData.vue
+++ b/src/views/dataManage/deviceData/listHydrantData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -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('/hydrantdata/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('/hydrantdata/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>
 
@@ -59,15 +58,6 @@
 export default {
   name: 'ListHydrantData',
   components: { DeptSelect },
-  /* filters: {
-    dataFilter(val) {
-      if (val === '40%LEL' || val === '60%LEL') {
-        return '0%LEL'
-      } else {
-        return val
-      }
-    }
-  }, */
   props: {
     type: {
       type: String,
@@ -75,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -91,10 +81,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', width: 170, align: 'center' },
@@ -105,17 +91,16 @@
         { text: '状态描述', value: 'descn', align: 'center' },
         { text: '消防栓状态', value: 'status', align: 'center' },
         { text: '上传时间', value: 'logtime', align: 'center' }
-        // { text: '点位编号', value: 'wellCode', align: 'center' },
-        // { text: '燃气浓度(%LEL)', value: 'strength', align: 'center', filter: true },
-        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
-        // { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -141,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -163,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取消防栓配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -186,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -207,35 +192,6 @@
 </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
 }
diff --git a/src/views/dataManage/deviceData/listLiquidData.vue b/src/views/dataManage/deviceData/listLiquidData.vue
index 96f28f6..d818684 100644
--- a/src/views/dataManage/deviceData/listLiquidData.vue
+++ b/src/views/dataManage/deviceData/listLiquidData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -26,45 +26,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('/liquiddata/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 align="center" type="selection" width="55"/>-->
-        <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('/liquiddata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,6 +58,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: 'ListLiquidData',
@@ -84,7 +70,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,74 +87,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '液位值(m)',
-          value: 'liquiddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '液位值(m)', value: 'liquiddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -204,16 +140,10 @@
       })
       batchExportLiquidData(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()
       })
@@ -228,69 +158,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listLiquidGasData.vue b/src/views/dataManage/deviceData/listLiquidGasData.vue
index 160edde..f2801c2 100644
--- a/src/views/dataManage/deviceData/listLiquidGasData.vue
+++ b/src/views/dataManage/deviceData/listLiquidGasData.vue
@@ -9,7 +9,8 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
+          size="small"
           dept-type="03"
           placeholder="选择权属单位/使用单位"
         />
@@ -32,46 +33,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('/liquidGasData/export')" :disabled="list.length === 0" 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 align="center" type="selection" width="55"/>-->
-        <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('/liquidGasData/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-if="column.unitFilter">{{ scope.row[column.value]|unit }}</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>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>
   </app-container>
 </template>
 
@@ -80,6 +65,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: 'ListLiquidGasData',
@@ -104,7 +90,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -122,80 +108,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '燃气浓度',
-          value: 'data',
-          align: 'center',
-          unitFilter: true
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'companyName',
-          align: 'center'
-        },
-        {
-          text: '使用单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '燃气浓度', value: 'data', align: 'center', unitFilter: true },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'companyName', align: 'center' },
+        { text: '使用单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -235,20 +166,10 @@
       })
       batchExportLiquidGasData(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
-        if (this.listQuery.sensorType === 'liquid') {
-          downloadElement.download = `燃气智能终端（一体化）数据-液位.xlsx` // 下载后文件名
-        } else {
-          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()
       })
@@ -359,69 +280,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidGasData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listNoiseData.vue b/src/views/dataManage/deviceData/listNoiseData.vue
index 5e31021..ab4faf4 100644
--- a/src/views/dataManage/deviceData/listNoiseData.vue
+++ b/src/views/dataManage/deviceData/listNoiseData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/noisedata/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 align="center" type="selection" width="55"/>-->
-        <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('/noisedata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListNoiseData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        // { text: '状态描述', value: 'descn', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -209,15 +141,10 @@
       })
       batchExportNoiseData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +159,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getNoiseData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listPantiltData.vue b/src/views/dataManage/deviceData/listPantiltData.vue
index c2030da..1609544 100644
--- a/src/views/dataManage/deviceData/listPantiltData.vue
+++ b/src/views/dataManage/deviceData/listPantiltData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/pantilt/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('/pantilt/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listTempData.vue b/src/views/dataManage/deviceData/listTempData.vue
index ceb3b61..33a3a93 100644
--- a/src/views/dataManage/deviceData/listTempData.vue
+++ b/src/views/dataManage/deviceData/listTempData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/tempdata//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 align="center" type="selection" width="55"/>-->
-        <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('/tempdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListTempData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,79 +88,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '温度(℃)',
-          value: 'temperature',
-          align: 'center'
-        },
-        {
-          text: '湿度(%RH)',
-          value: 'humidity',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '温度(℃)', value: 'temperature', align: 'center' },
+        { text: '湿度(%RH)', value: 'humidity', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -207,15 +141,10 @@
       })
       batchExportTempData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -230,69 +159,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getTempData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listTubeData.vue b/src/views/dataManage/deviceData/listTubeData.vue
index a8c5267..e0e6ab8 100644
--- a/src/views/dataManage/deviceData/listTubeData.vue
+++ b/src/views/dataManage/deviceData/listTubeData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" :need-top="false" size="small" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -21,44 +21,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('/tubedata/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 align="center" type="selection" width="55"/>-->
-        <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('/tubedata/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>
-      </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>
   </app-container>
 </template>
 
@@ -67,6 +53,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: 'ListTubeData',
@@ -78,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -95,53 +82,22 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '燃气浓度(%LEL)',
-          value: 'strength',
-          align: 'center'
-        },
-        // {
-        //   text: '电量(%)',
-        //   value: 'cell',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   align: 'center'
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '燃气浓度(%LEL)', value: 'strength', align: 'center' },
+        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        // { text: '状态描述', value: 'descn', align: 'center' },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // multipleSelection: [], // 多选选中项
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       deviceTypeList: [], // 燃气配置类型列表
       deptProps: {
         parent: 'pid',
@@ -149,25 +105,12 @@
         label: 'name',
         children: 'children'
       }, // 权属单位树形下拉菜单
-      deptTreeList: null, // 组织树列表数据
-      showDeptTree: 0, // 是否显示权属单位下拉
-      showDeviceType: true, // 是否显示设备类型下拉
+      // deptTreeList: null, // 组织树列表数据
+      // showDeptTree: 0, // 是否显示权属单位下拉
+      // showDeviceType: true, // 是否显示设备类型下拉
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      editShow: false, // 是否显示编辑框
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -202,15 +145,10 @@
       })
       batchExportTubeData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -225,69 +163,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getTubeData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listWellLocaData.vue b/src/views/dataManage/deviceData/listWellLocaData.vue
index 66722a2..e9609c8 100644
--- a/src/views/dataManage/deviceData/listWellLocaData.vue
+++ b/src/views/dataManage/deviceData/listWellLocaData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/welllocadata/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 align="center" type="selection" width="55"/>-->
-        <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('/welllocadata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListWellLocaData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,72 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '经度',
-          value: 'lng',
-          align: 'center'
-        },
-        {
-          text: '纬度',
-          value: 'lat',
-          align: 'center'
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'logtime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '经度', value: 'lng', align: 'center' },
+        { text: '纬度', value: 'lat', align: 'center' },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'logtime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -200,15 +140,10 @@
       })
       batchExportWellLocaData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -223,69 +158,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getWellLocaData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataView/components/alarmStatus.vue b/src/views/dataView/components/alarmStatus.vue
deleted file mode 100644
index f2b74b5..0000000
--- a/src/views/dataView/components/alarmStatus.vue
+++ /dev/null
@@ -1,164 +0,0 @@
-<template>
-  <el-row :gutter="40" class="panel-group">
-    <div>
-      <el-col>
-        <div class="flagBoxStyle">
-          <div class="flagStyle" />
-          <div>工单情况</div>
-        </div>
-      </el-col>
-    </div>
-    <el-row>
-      <el-col :span="12">
-        <ve-bar
-          :data="chartData"
-          :grid="grid"
-          :extend="extend"
-          :settings="chartSettings"
-        />
-      </el-col>
-      <el-col :span="12">
-        <div class="tableStyle">
-          <el-table border :data="tableList" stripe>
-            <el-table-column prop="name" label="设备型号" />
-            <el-table-column prop="value" label="设备名称" />
-          </el-table>
-        </div>
-      </el-col>
-    </el-row>
-  </el-row>
-</template>
-
-<script>
-import { wellCountByBfzt } from '@/api/well/well'
-import { deviceStaticByStatus, alarmNowStatic } from '@/api/data/dataStatics'
-import { jobCountByStatus } from '@/api/alarm/job'
-export default {
-  name: 'AlarmStatus',
-  data() {
-    return {
-      // 柱状图
-      extend: {
-        xAxis: {
-          axisLabel: {
-            rotate: 30,
-            margin: 30,
-            textStyle: {
-              align: 'center'
-            }
-          }
-        },
-        series: {
-          label: { show: true, position: 'top' },
-          barMaxWidth: 35 // 最大柱宽度
-        }
-      },
-      grid: {
-        right: 60
-      },
-      chartSettings: {
-        itemStyle: {
-          'barCategoryGap': 5
-        },
-        barWidth: 15,
-        labelMap: {
-          'deviceType': '权属单位',
-          'offline': '设备数量（个）'
-        },
-        dimension: ['deviceType'],
-        metrics: ['offline']
-      },
-      chartData: {
-        columns: ['deviceType', 'offline'],
-        rows: []
-      },
-      tableList: [],
-      dataGroup: [
-        {
-          title: '井',
-          context: '--',
-          flags: '条',
-          icon: 'icon-alarm',
-          color: '#40c9c6',
-          permission: '/well/list'
-        }
-      ]
-    }
-  },
-  created() {
-    this.getWellCount()
-    this.getDeviceCount()
-    this.getAlarmCount()
-    this.getJobCount()
-  },
-  mounted() {
-    this.tableList = [
-      {
-        value: 'WELL-001',
-        name: '液位超限'
-      },
-      {
-        value: 'WELL-002',
-        name: '燃气浓度超限'
-      },
-      {
-        value: 'WELL-003',
-        name: '井盖开启'
-      },
-      {
-        value: 'WELL-004',
-        name: '井盖开启'
-      }
-    ]
-  },
-  methods: {
-    refresh() {
-      this.getAlarmCount()
-      this.getJobCount()
-    },
-    getWellCount() {
-      wellCountByBfzt().then(response => {
-        this.dataGroup[0].context = response.data.total
-      })
-    },
-    getDeviceCount() {
-      deviceStaticByStatus().then(response => {
-        this.dataGroup[1].context = response.data.total
-      })
-    },
-    getAlarmCount() {
-      alarmNowStatic().then(response => {
-        this.dataGroup[2].context = response.data.total
-      })
-    },
-    getJobCount() {
-      jobCountByStatus().then(response => {
-        const data = response.data
-        const total = data.beforeGet + data.beforeConfirm + data.inHandle
-        this.dataGroup[3].context = total
-      })
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.tableStyle{
-  padding: 20px;
-}
-.flagBoxStyle {
-  display: flex;
-  margin-bottom: 20px;
-}
-.flagBoxStyle div:nth-child(2){
-  line-height: 30px;
-  font-weight: 600;
-}
-.flagStyle {
-  width: 4px;
-  height: 30px;
-  margin-right: 6px;
-  background: rgb(64 121 242);
-}
-
-</style>
diff --git a/src/views/dataView/components/alarmView.vue b/src/views/dataView/components/alarmView.vue
index 5c02f41..e13f811 100644
--- a/src/views/dataView/components/alarmView.vue
+++ b/src/views/dataView/components/alarmView.vue
@@ -1,106 +1,124 @@
+<!--报警分析-->
 <template>
-  <div>
-    <div class="flagBoxStyle">
-      <div class="flagStyle" />
-      <div>报警分析</div>
-    </div>
-    <el-row>
-      <el-col :span="12">
-        <ve-line
-          :data="chartDataLine"
-          :settings="chartSettingsLine"
+  <panel-card title="报警分析">
+    <template slot="func">
+      <el-col :span="16">
+        <el-date-picker
+          v-model="timeRange"
+          type="datetimerange"
+          range-separator="至"
+          size="small"
+          :picker-options="pickerOptions"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          start-placeholder="开始时间"
+          end-placeholder="结束时间"
+          @change="refresh"
         />
       </el-col>
-      <el-col :span="12">
-        <div class="tableStyle">
-          <el-table border :data="tableList" stripe>
-            <el-table-column prop="name" label="报警类型" />
-            <el-table-column prop="value" label="设备名称" />
-          </el-table>
-        </div>
-      </el-col>
-    </el-row>
-  </div>
+    </template>
+    <div class="flex-container">
+      <div class="flex-left">
+        <ve-line
+          :data="chartData"
+          :settings="chartSettingsLine"
+        />
+      </div>
+      <div class="flex-right">
+        <el-table border :data="tableList" stripe empty-text="无报警" height="340">
+          <el-table-column prop="name" label="报警类型" align="center" />
+          <el-table-column prop="value" label="报警数量" align="center" />
+        </el-table>
+      </div>
+    </div>
+  </panel-card>
 </template>
 
 <script>
-import { alarmStaticsByContent } from '@/api/alarm/deviceStatics'
+import { alarmStaticByDay, alarmStaticsByContent } from '@/api/data/dataStatics'
+import PanelCard from '@/components/BigData/Card/panelCard'
+import { getSearchLastWeekTime } from '@/utils/dateutils'
+
 export default {
   name: 'AlarmStaticsByType',
+  components: { PanelCard },
   data() {
     return {
-      tableList: [],
+      listQuery: {
+        deviceType: '',
+        beginTime: '',
+        endTime: ''
+      }, // 查询条件
+      timeRange: [], // 时间范围
+      tableList: [], // 列表
       // 折线图
       chartSettingsLine: {
         labelMap: {
-          'alarmWellData': '井盖开盖报警',
-          'alarmLiquidData': '液位超限报警',
-          'alarmHarmfulData': '有害气体超标报警'
+          'date': '日期',
+          'alarmTimes': '报警次数'
         },
-        metrics: ['alarmWellData', 'alarmLiquidData', 'alarmHarmfulData'],
         dimension: ['date']
-      },
-      chartDataLine: {
-        columns: ['date', 'alarmWellData', 'alarmLiquidData', 'alarmHarmfulData'],
+      }, // 配置
+      chartData: {
+        columns: ['date', 'alarmTimes'],
         rows: []
-      }
+      } // 折线图数据
     }
   },
   created() {
-    this.fetchDeviceTypeLine()
-  },
-  mounted() {
-    this.tableList = [
-      {
-        value: '224',
-        name: '井盖开启'
-      },
-      {
-        value: '22',
-        name: '燃气浓度超限'
-      },
-      {
-        value: '1',
-        name: '液位超限'
-      },
-      {
-        value: '4',
-        name: '有害气体超标'
-      }
-    ]
+    this.timeRange = getSearchLastWeekTime()
+    this.refresh()
   },
   methods: {
-    fetchDeviceTypeLine(val) {
-      if (val !== undefined) {
-        this.listQuery.startTime = val[0]
-        this.listQuery.endTime = val[1]
-      }
-      alarmStaticsByContent(this.listStatue).then(response => {
-        console.log(response.data, '===123')
-        this.chartDataLine.rows = response.data
+    refresh() {
+      this.handleDateTime()
+      this.fetchAlarmByDay()
+      this.fetchAlarmByContent()
+    },
+    // 获取各类报警的列表
+    fetchAlarmByContent() {
+      alarmStaticsByContent(this.listQuery).then(response => {
+        this.tableList = response.data
       })
+    },
+    // 获取每日报警数
+    fetchAlarmByDay() {
+      // 模拟数据
+      // this.chartData.rows = [
+      //   { 'date': '9月20日', 'alarmTimes': 153, 'alarmWells': 43 },
+      //   { 'date': '9月21日', 'alarmTimes': 150, 'alarmWells': 30 },
+      //   { 'date': '9月22日', 'alarmTimes': 143, 'alarmWells': 23 },
+      //   { 'date': '9月23日', 'alarmTimes': 173, 'alarmWells': 23 },
+      //   { 'date': '9月24日', 'alarmTimes': 272, 'alarmWells': 52 },
+      //   { 'date': '9月25日', 'alarmTimes': 253, 'alarmWells': 53 }
+      // ]
+      alarmStaticByDay(this.listQuery).then(response => {
+        this.chartData.rows = response.data
+      })
+    },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
     }
   }
 }
 </script>
 
 <style lang="scss" scoped>
-.tableStyle{
-  // padding: 100px 10px;
-}
-.flagBoxStyle {
+.flex-container{
   display: flex;
-  margin-bottom: 20px;
-}
-.flagBoxStyle div:nth-child(2){
-  line-height: 30px;
-  font-weight: 600;
-}
-.flagStyle {
-  width: 4px;
-  height: 30px;
-  margin-right: 6px;
-  background: rgb(64 121 242);
+  .flex-left{
+    flex:1;
+  }
+  .flex-right{
+    width: 260px;
+    padding: 10px 20px;
+  }
 }
 
 </style>
diff --git a/src/views/dataView/components/jobAnalysis.vue b/src/views/dataView/components/jobAnalysis.vue
new file mode 100644
index 0000000..483e652
--- /dev/null
+++ b/src/views/dataView/components/jobAnalysis.vue
@@ -0,0 +1,106 @@
+<!--工单情况-->
+<template>
+  <panel-card title="工单分析">
+    <template slot="func">
+      <el-col :span="16">
+        <el-date-picker
+          v-model="timeRange"
+          type="datetimerange"
+          range-separator="至"
+          size="small"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          start-placeholder="开始时间"
+          end-placeholder="结束时间"
+          @change="refresh"
+        />
+      </el-col>
+    </template>
+    <ve-bar
+      :data="chartData"
+      :extend="extend"
+      :settings="chartSettings"
+    />
+  </panel-card>
+</template>
+
+<script>
+import PanelCard from '@/components/BigData/Card/panelCard'
+import { getSearchLastWeekTime } from '@/utils/dateutils'
+import { jobStaticsByDept } from '@/api/data/dataStatics'
+export default {
+  name: 'JobAnalysis',
+  components: { PanelCard },
+  data() {
+    return {
+      listQuery: {
+        beginTime: '',
+        endTime: ''
+      }, // 查询条件
+      timeRange: [], // 时间范围
+      chartSettings: {
+        labelMap: {
+          'deptName': '权属单位',
+          'beforeGet': '待处理',
+          'beforeConfirm': '待确认',
+          'inHandle': '处理中',
+          'over': '已完成'
+        },
+        stack: {
+          'xxx': ['beforeGet', 'beforeConfirm', 'inHandle', 'over']
+        }
+      },
+      extend: {
+        xAxis: {
+          type: 'value',
+          minInterval: 1
+        },
+        series: {
+          barMaxWidth: 35
+        }
+      },
+      chartData: {
+        columns: ['deptName', 'beforeGet', 'beforeConfirm', 'inHandle', 'over'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.timeRange = getSearchLastWeekTime()
+    this.refresh()
+  },
+  mounted() {
+  },
+  methods: {
+    refresh() {
+      this.handleDateTime()
+      this.fetchData()
+    },
+    fetchData() {
+      jobStaticsByDept(this.listQuery).then(response => {
+        this.chartData.rows = response.data
+        const maxValue = Math.max.apply(Math, response.data.map(function(item) {
+          return parseInt(item.beforeGet) + parseInt(item.beforeConfirm) + parseInt(item.inHandle) + parseInt(item.over)
+        }))
+        if (maxValue < 10) {
+          this.extend.xAxis = { type: 'value', minInterval: 1, max: 10 }
+        } else {
+          this.extend.xAxis = { type: 'value', minInterval: 1 }
+        }
+      })
+    },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+</style>
diff --git a/src/views/dataView/components/panelGroup.vue b/src/views/dataView/components/panelGroup.vue
index cdb9180..7cae96f 100644
--- a/src/views/dataView/components/panelGroup.vue
+++ b/src/views/dataView/components/panelGroup.vue
@@ -1,82 +1,54 @@
 <template>
-  <el-row :gutter="20" class="panel-group">
-    <div>
-      <el-col>
-        <div class="flagBoxStyle">
-          <div class="flagStyle" />
-          <div>数据总体情况</div>
-        </div>
-      </el-col>
+  <panel-card title="数据总体情况">
+    <div class="panel-group">
+      <div v-for="card in dataGroup" :key="card.title" class="card-panel">
+        <card :title="card.title" :context="card.context" :flags="card.flags" :icon="card.icon" :color="card.color" shadow="never" @click.native="goPage(card)" />
+      </div>
     </div>
-    <div v-for="card in dataGroup" :key="card.title">
-      <el-col v-if="hasPerm(card.permission)" :lg="{span:'4-8'}" :md="8" :sm="12" :xs="24" class="card-panel-col">
-        <card :title="card.title" :context="card.context" :flags="card.flags" :icon="card.icon" :color="card.color" @click.native="goPage(card)" />
-      </el-col>
-    </div>
-    <el-dialog append-to-body :visible.sync="dialogFormVisible">
-      <el-table v-loading="listLoading" :data="list" class="table" border>
-        <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>{{ scope.row[column.value] }}</span>
-          </template>
-        </el-table-column>
-      </el-table>
-    </el-dialog>
-  </el-row>
+  </panel-card>
+<!--  <el-row :gutter="20" class="panel-group">-->
+<!--    &lt;!&ndash;    <el-dialog append-to-body :visible.sync="dialogFormVisible">&ndash;&gt;-->
+<!--    &lt;!&ndash;      <el-table v-loading="listLoading" :data="list" class="table" border>&ndash;&gt;-->
+<!--    &lt;!&ndash;        <el-table-column&ndash;&gt;-->
+<!--    &lt;!&ndash;          v-for="column in columns"&ndash;&gt;-->
+<!--    &lt;!&ndash;          :key="column.value"&ndash;&gt;-->
+<!--    &lt;!&ndash;          :label="column.text"&ndash;&gt;-->
+<!--    &lt;!&ndash;          :width="column.width"&ndash;&gt;-->
+<!--    &lt;!&ndash;          :align="column.align"&ndash;&gt;-->
+<!--    &lt;!&ndash;          show-overflow-tooltip&ndash;&gt;-->
+<!--    &lt;!&ndash;        >&ndash;&gt;-->
+<!--    &lt;!&ndash;          <template v-slot="scope">&ndash;&gt;-->
+<!--    &lt;!&ndash;            <span>{{ scope.row[column.value] }}</span>&ndash;&gt;-->
+<!--    &lt;!&ndash;          </template>&ndash;&gt;-->
+<!--    &lt;!&ndash;        </el-table-column>&ndash;&gt;-->
+<!--    &lt;!&ndash;      </el-table>&ndash;&gt;-->
+<!--    &lt;!&ndash;    </el-dialog>&ndash;&gt;-->
+<!--  </el-row>-->
 </template>
 
 <script>
 import Card from '@/components/BigData/Card'
 import { wellCountByBfzt } from '@/api/well/well'
-import { deviceStaticByStatus, alarmNowStatic } from '@/api/data/dataStatics'
-import { jobCountByStatus } from '@/api/alarm/job'
+import { deviceStaticByStatus, alarmNowStatic, dataCount } from '@/api/data/dataStatics'
+import PanelCard from '@/components/BigData/Card/panelCard'
+import { getDayTime } from '@/utils/dateutils'
 export default {
   name: 'PanelGroup',
-  components: { Card },
+  components: { PanelCard, Card },
   data() {
     return {
-      dialogFormVisible: false,
-      listLoading: false,
       columns: [
-        {
-          text: '设备编号',
-          value: '',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: '',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: '',
-          align: 'center'
-        },
-        {
-          text: '最新记录上传时间',
-          width: '200',
-          value: '',
-          align: 'center'
-        },
-        {
-          text: '离线天数',
-          value: '',
-          align: 'center'
-        }
+        { text: '设备编号', value: '', align: 'center' },
+        { text: '设备类型', value: '', align: 'center' },
+        { text: '点位编号', value: '', align: 'center' },
+        { text: '最新记录上传时间', width: '200', value: '', align: 'center' },
+        { text: '离线天数', value: '', align: 'center' }
       ], // 显示列
       dataGroup: [
         {
-          title: '井',
+          title: '安装点位',
           context: '--',
-          flags: '条',
+          flags: '个',
           icon: 'icon-well',
           color: '#40c9c6',
           permission: '/well/list'
@@ -93,25 +65,25 @@
           title: '今日数据',
           context: '--',
           flags: '条',
-          icon: 'icon-alarm',
-          color: '#f4516c',
-          permission: '/alarm/now'
+          icon: 'icon-database',
+          color: '#1ed8f3',
+          permission: '/data'
         },
         {
           title: '离线设备',
           context: '--',
           flags: '个',
-          icon: 'icon-order',
-          color: '#f4516c',
-          permission: '/job/list'
+          icon: 'icon-device',
+          color: '#676767',
+          permission: '/device/list'
         },
         {
           title: '当前报警',
           context: '--',
           flags: '条',
           icon: 'icon-alarm',
-          color: '#40c9c6',
-          permission: '/well/list'
+          color: '#f4516c',
+          permission: '/alarm/now'
         }
       ]
     }
@@ -120,34 +92,36 @@
     this.getWellCount()
     this.getDeviceCount()
     this.getAlarmCount()
-    this.getJobCount()
+    this.getTodayDataCount()
   },
   methods: {
-    goPage(card) {
-      if (card.title === '离线设备') {
-        this.dialogFormVisible = true
-      }
-    },
+    // 获取井数量
     getWellCount() {
       wellCountByBfzt().then(response => {
         this.dataGroup[0].context = response.data.total
       })
     },
+    // 获取设备数量， 离线设备数量
     getDeviceCount() {
       deviceStaticByStatus().then(response => {
         this.dataGroup[1].context = response.data.total
+        this.dataGroup[3].context = response.data.offline
       })
     },
+    // 获取当前报警数量
     getAlarmCount() {
       alarmNowStatic().then(response => {
-        this.dataGroup[2].context = response.data.total
+        this.dataGroup[4].context = response.data.total
       })
     },
-    getJobCount() {
-      jobCountByStatus().then(response => {
-        const data = response.data
-        const total = data.beforeGet + data.beforeConfirm + data.inHandle
-        this.dataGroup[3].context = total
+    // 获取今日数据总数
+    getTodayDataCount() {
+      const beginTime = getDayTime(new Date().getTime()).Format('yyyy-MM-dd hh:mm:ss')
+      const endTime = new Date().Format('yyyy-MM-dd hh:mm:ss')
+      const params = { beginTime, endTime }
+      dataCount(params).then(response => {
+        debugger
+        this.dataGroup[2].context = response.data.total
       })
     }
   }
@@ -155,174 +129,16 @@
 </script>
 
 <style lang="scss" scoped>
-.flagBoxStyle {
-  display: flex;
-  margin-bottom: 20px;
-  margin-top: -20px;
-}
-.flagBoxStyle div:nth-child(2){
-  line-height: 30px;
-  font-weight: 600;
-}
-.flagStyle {
-  width: 4px;
-  height: 30px;
-  margin-right: 6px;
-  background: rgb(64 121 242);
-}
 .panel-group {
-  margin-top: 18px;
-  .card-panel-col {
-    margin-bottom: 32px;
-  }
+  display: flex;
+  margin: 10px;
+  justify-content: space-between;
   .card-panel {
-    height: 108px;
-    cursor: pointer;
-    font-size: 12px;
-    position: relative;
-    overflow: hidden;
-    color: #666;
-    background: #fff;
-    box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
-    border-color: rgba(0, 0, 0, .05);
-
-    &:hover {
-      .card-panel-icon-wrapper {
-        color: #fff;
-      }
-
-      .icon-people {
-        background: #40c9c6;
-      }
-
-      .icon-message {
-        background: #36a3f7;
-      }
-
-      .icon-money {
-        background: #f4516c;
-      }
-
-      .icon-shopping {
-        background: #34bfa3
-      }
-    }
-
-    .icon-people {
-      color: #40c9c6;
-    }
-
-    .icon-message {
-      color: #36a3f7;
-    }
-
-    .icon-money {
-      color: #f4516c;
-    }
-
-    .icon-shopping {
-      color: #34bfa3
-    }
-
-    .card-panel-icon-wrapper {
-      float: left;
-      margin: 14px 0 0 14px;
-      padding: 16px;
-      transition: all 0.38s ease-out;
-      border-radius: 6px;
-    }
-
-    .card-panel-icon {
-      float: left;
-      font-size: 48px;
-    }
-
-    .card-panel-description {
-      float: right;
-      font-weight: bold;
-      margin: 26px;
-      margin-left: 0px;
-
-      .card-panel-text {
-        line-height: 18px;
-        color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
-        margin-bottom: 12px;
-      }
-
-      .card-panel-num {
-        font-size: 20px;
-      }
-    }
+    flex: 1;
+  }
+  .card-panel + .card-panel  {
+    margin-left: 20px;
   }
 }
 
-  @media only screen and (min-width: 768px) {
-    .el-col-sm-4-8 {
-      width: 20%;
-    }
-    .el-col-sm-offset-4-8 {
-      margin-left: 20%;
-    }
-    .el-col-sm-pull-4-8 {
-      position: relative;
-      right: 20%;
-    }
-    .el-col-sm-push-4-8 {
-      position: relative;
-      left: 20%;
-    }
-  }
-
-  @media only screen and (min-width: 992px) {
-    .el-col-md-4-8 {
-      width: 20%;
-    }
-    .el-col-md-offset-4-8 {
-      margin-left: 20%;
-    }
-    .el-col-md-pull-4-8 {
-      position: relative;
-      right: 20%;
-    }
-    .el-col-md-push-4-8 {
-      position: relative;
-      left: 20%;
-    }
-  }
-
-  @media only screen and (min-width: 1200px) {
-    .el-col-lg-4-8 {
-      width: 20%;
-    }
-    .el-col-lg-offset-4-8 {
-      margin-left: 20%;
-    }
-    .el-col-lg-pull-4-8 {
-      position: relative;
-      right: 20%;
-    }
-    .el-col-lg-push-4-8 {
-      position: relative;
-      left: 20%;
-    }
-  }
-
-  @media only screen and (min-width: 1920px) {
-    .el-col-xl-4-8 {
-      width: 20%;
-    }
-    .el-col-xl-offset-4-8 {
-      margin-left: 20%;
-    }
-    .el-col-xl-pull-4-8 {
-      position: relative;
-      right: 20%;
-    }
-    .el-col-xl-push-4-8 {
-      position: relative;
-      left: 20%;
-    }
-  }
-
 </style>
diff --git a/src/views/dataView/components/wellCountView.vue b/src/views/dataView/components/wellCountView.vue
index 82fe878..5c0e2d7 100644
--- a/src/views/dataView/components/wellCountView.vue
+++ b/src/views/dataView/components/wellCountView.vue
@@ -1,61 +1,70 @@
 <template>
-  <div>
-    <div class="flagBoxStyle">
-      <div class="flagStyle" />
-      <div>井数量分析</div>
-    </div>
-    <el-row :gutter="10">
+  <panel-card title="点位分析">
+    <el-row>
       <el-col :span="12">
-        <ve-pie
-          :data="chartDataPie"
-          :extend="extendPie"
-        />
+        <ve-pie :data="pieChartData" :extend="pieExtend" />
       </el-col>
       <el-col :span="12">
-        <ve-bar
-          :data="chartData"
-          :grid="grid"
-          :extend="extend"
-          :settings="chartSettings"
-        />
+        <ve-bar :data="chartData" :grid="grid" :extend="extend" :settings="chartSettings" />
       </el-col>
     </el-row>
+  </panel-card>
+  <!--  <div>-->
+  <!--    <div class="flagBoxStyle">-->
+  <!--      <div class="flagStyle" />-->
+  <!--      <div>井数量分析</div>-->
+  <!--    </div>-->
+    <!--    <el-row :gutter="10">-->
+    <!--      <el-col :span="12">-->
+    <!--        <ve-pie-->
+    <!--          :data="chartDataPie"-->
+    <!--          :extend="extendPie"-->
+    <!--        />-->
+    <!--      </el-col>-->
+    <!--      <el-col :span="12">-->
+    <!--        <ve-bar-->
+    <!--          :data="chartData"-->
+    <!--          :grid="grid"-->
+    <!--          :extend="extend"-->
+    <!--          :settings="chartSettings"-->
+    <!--        />-->
+    <!--      </el-col>-->
+    <!--    </el-row>-->
   </div>
 </template>
 
 <script>
-import { deviceStaticsByOnline } from '@/api/data/dataStatics'
+import { deviceStaticsByOnline, wellStaticByBfzt, wellStaticByType } from '@/api/data/dataStatics'
+import PanelCard from '@/components/BigData/Card/panelCard'
 export default {
   name: 'WellCountView',
+  components: { PanelCard },
   data() {
     return {
-      online: 0,
-      offline: 0,
       // 饼状图
-      extendPie: {
+      pieExtend: {
         series: {
           label: { show: true, position: 'outside', formatter: '{b}:{c}' },
           radius: '45%'
         }
       },
-      chartDataPie: {
-        columns: ['onlineStatus', 'deviceCount'],
+      pieChartSettings: {
+        labelMap: {
+          'bfzt': '布防状态',
+          'wellCount': '井数量'
+        },
+        dimension: 'bfzt',
+        metrics: 'wellCount'
+      },
+      pieChartData: {
+        columns: ['bfzt', 'wellCount'],
         rows: []
       },
       // 柱状图
       extend: {
-        xAxis: {
-          axisLabel: {
-            rotate: 30,
-            margin: 30,
-            textStyle: {
-              align: 'center'
-            }
-          }
-        },
         series: {
-          label: { show: true, position: 'top' },
-          barMaxWidth: 35 // 最大柱宽度
+          label: { show: true, position: 'right' },
+          barMaxWidth: 35
         }
       },
       grid: {
@@ -67,42 +76,36 @@
         },
         barWidth: 15,
         labelMap: {
-          'deviceType': '权属单位',
-          'offline': '设备数量（个）'
+          'wellTypeName': '点位类型',
+          'wellCount': '井数量'
         },
-        dimension: ['deviceType'],
-        metrics: ['offline']
+        dimension: ['wellTypeName'],
+        metrics: ['wellCount']
       },
       chartData: {
-        columns: ['deviceType', 'offline'],
+        columns: ['wellTypeName', 'wellCount'],
         rows: []
       }
     }
   },
   created() {
-    this.fetchDeviceType()
+    this.fetchBfcfData()
+    this.fetchWellTypeData()
   },
   methods: {
-    fetchDeviceType() {
-      this.chartDataPie.rows = [
-        { 'onlineStatus': '在线', 'deviceCount': '10' },
-        { 'onlineStatus': '离线', 'deviceCount': '20' }
-      ]
-      this.chartData.rows = [
-        {
-
-        }
-      ]
-      deviceStaticsByOnline().then(response => {
-        response.data.forEach((item) => {
-          this.online += item.online
-          this.offline += item.offline
-        })
+    // 获取统计数据
+    fetchBfcfData() {
+      wellStaticByBfzt(this.listQuery).then(response => {
+        const data = response.data
+        this.pieChartData.rows = [
+          { 'bfzt': '布防', 'wellCount': data.bfWell },
+          { 'bfzt': '撤防', 'wellCount': data.cfWell }
+        ]
+      })
+    },
+    fetchWellTypeData() {
+      wellStaticByType().then(response => {
         this.chartData.rows = response.data
-        // this.chartDataPie.rows = [
-        //   { 'onlineStatus': '在线', 'deviceCount': this.online },
-        //   { 'onlineStatus': '离线', 'deviceCount': this.offline }
-        // ]
       })
     }
   }

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index b9e5ee6..09fb191 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-card :body-style="{ padding: '0px' }" shadow="always">
-    <div class="card-panel" >
+  <el-card :body-style="{ padding: '0px' }" :shadow="shadow">
+    <div class="card-panel">
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
@@ -24,27 +24,31 @@
     title: {
       type: String,
       default: '标题'
-    },
+    }, // 标题
     flags: {
       type: String,
       default: '单位'
-    },
+    }, // 单位
     subtitle: {
       type: String,
       default: ''
-    },
+    }, // 小标题
     icon: {
       type: String,
       default: ''
-    },
+    }, // 图标
     context: {
       type: [String, Number],
       default: ''
-    },
+    }, // 内容
     color: {
       type: String,
       default: '#40c9c6'
-    }
+    }, // 图标颜色
+    shadow: {
+      type: String,
+      default: 'always'
+    } // 卡片阴影
   },
   computed: {
     backgroundColor() {
diff --git a/src/components/BigData/Card/panelCard.vue b/src/components/BigData/Card/panelCard.vue
new file mode 100644
index 0000000..d6a7b89
--- /dev/null
+++ b/src/components/BigData/Card/panelCard.vue
@@ -0,0 +1,51 @@
+<template>
+  <div class="panel-container">
+    <div class="panel-title">
+      {{ title }}
+      <div class="title-right">
+        <slot name="func" />
+      </div>
+    </div>
+    <div class="panel-body">
+      <slot />
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'PanelCard',
+  props: {
+    // 标题
+    title: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.panel-container{
+  width: 100%;
+  padding: 10px;
+  border: 1px solid #EBEEF5 ;
+  .panel-title{
+    width: 100%;
+    line-height: 2;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0px 10px;
+    border-left: 5px solid #66b1ff;
+    position: relative;
+    .title-right{
+      display: inline-block;
+      position: absolute;
+      right: 10px;
+    }
+  }
+  .panel-body{
+    padding: 5px 0px;
+    height:auto;
+  }
+}
+</style>
diff --git a/src/icons/svg/icon-database.svg b/src/icons/svg/icon-database.svg
new file mode 100644
index 0000000..d3dd1c8
--- /dev/null
+++ b/src/icons/svg/icon-database.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1658711872102" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1435" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M960 123.7C872.7 49.9 704.8 0 512 0S151.3 49.9 64 123.7C23.2 158.2 0 197.8 0 240V605.9c0 0.7 0 1.4 0.1 2H0v176c0 132.5 229.2 240 512 240s512-107.5 512-240V608h-0.1c0.1-1.8 0.1-3.5 0.1-5.3V240c0-42.2-23.2-81.8-64-116.3zM64 356.3C151.3 430.1 319.2 480 512 480s360.7-49.9 448-123.7v79.2c-17.9 11.5-37.5 22.2-58.8 32.2C796.2 516.9 658 544 512 544s-284.2-27.1-389.2-76.4c-21.3-10-40.9-20.7-58.8-32.2v-79.1z m0 181.3c87.3 73.8 255.2 123.7 448 123.7s360.7-49.9 448-123.7v79.2c-17.9 11.4-37.5 22.2-58.8 32.2-105 49.2-243.3 76.3-389.2 76.3S227.8 698.2 122.8 649c-21.3-10-40.9-20.7-58.8-32.2v-79.2z m837.2 292.7c-105 49.2-243.3 76.3-389.2 76.3s-284.2-27.1-389.2-76.3c-20.3-9.5-39.1-19.8-56.4-30.6-1.6-5.3-2.4-10.5-2.4-15.7v-65c87.3 73.8 255.2 123.7 448 123.7s360.7-50 448-123.7v65c0 5.1-0.8 10.4-2.4 15.7-17.3 10.9-36.1 21.1-56.4 30.6z" p-id="1436"></path></svg>
\ No newline at end of file
diff --git a/src/views/dataManage/dataManage.vue b/src/views/dataManage/dataManage.vue
index 71be03f..0564cdd 100644
--- a/src/views/dataManage/dataManage.vue
+++ b/src/views/dataManage/dataManage.vue
@@ -31,19 +31,19 @@
     return {
       activeName: 'wellcover',
       tabList: [
-        { permission: '/welldata/list', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
-        { permission: '/liquiddata/list', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
-        { permission: '/gasdata/list', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
-        { permission: '/digdata/list', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
-        { permission: '/noisedata/list', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
-        { permission: '/harmfuldata/list', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
-        { permission: '/tempdata/list', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
-        { permission: '/welllocadata/list', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
-        { permission: '/liquidGasData/list', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
-        { permission: '/tubedata/list', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
-        { permission: '/gasdector/listPage', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
-        { permission: '/pantilt/listPage', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
-        { permission: '/hydrantdata/list', label: '消防栓数据列表', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
+        { permission: '/welldata/list-page', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
+        { permission: '/liquiddata/list-page', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
+        { permission: '/gasdata/list-page', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
+        { permission: '/digdata/list-page', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
+        { permission: '/noisedata/list-page', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
+        { permission: '/harmfuldata/list-page', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
+        { permission: '/tempdata/list-page', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
+        { permission: '/welllocadata/list-page', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
+        { permission: '/liquidGasData/list-page', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
+        { permission: '/tubedata/list-page', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
+        { permission: '/gasdector/list-page', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
+        { permission: '/pantilt/list-page', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
+        { permission: '/hydrantdata/list-page', label: '消防栓防盗水监测仪', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
       ] // 所有tab列表
     }
   },
diff --git a/src/views/dataManage/deviceData/listDigData.vue b/src/views/dataManage/deviceData/listDigData.vue
index fa4bbc7..3cb74ad 100644
--- a/src/views/dataManage/deviceData/listDigData.vue
+++ b/src/views/dataManage/deviceData/listDigData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/digdata/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 align="center" type="selection" width="55"/>-->
-        <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('/digdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListDigData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -185,6 +116,8 @@
       if (params && params.deviceType === this.type && params.devcode) {
         this.listQuery.keywords = params.devcode
         this.fetchData()
+      } else {
+        this.fetchData()
       }
     }
   },
@@ -203,21 +136,16 @@
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
-        text: '数据处理中,请稍后...',
+        text: '下载中,请稍后...',
         spinner: 'el-icon-loading',
         background: 'rgba(0, 0, 0, 0.7)'
       })
       batchExportDigData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +160,50 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getDigData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         return 'warning-state'
       }
     },
-    indexMethod(index) {
-      return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
-    },
-    // 改变页容量
-    handleSizeChange(val) {
-      this.listQuery.limit = val
+    // checkState(row) {
+    //   if (row.status !== '0') {
+    //     return 'warning-state'
+    //   }
+    // },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    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
   }
diff --git a/src/views/dataManage/deviceData/listGasdectorData.vue b/src/views/dataManage/deviceData/listGasdectorData.vue
index a78b8da..b4ecd07 100644
--- a/src/views/dataManage/deviceData/listGasdectorData.vue
+++ b/src/views/dataManage/deviceData/listGasdectorData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/gasdector/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('/liquidGasData/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listHarmfulData.vue b/src/views/dataManage/deviceData/listHarmfulData.vue
index dde92b4..c29cb2e 100644
--- a/src/views/dataManage/deviceData/listHarmfulData.vue
+++ b/src/views/dataManage/deviceData/listHarmfulData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -27,44 +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('/harmfuldata/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 align="center" type="selection" width="55"/>-->
-        <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('/harmfuldata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,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: 'ListHarmfulData',
@@ -84,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,92 +88,32 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: 'CO浓度(ppm)',
-          value: 'CO',
-          align: 'center'
-        },
-        {
-          text: 'CH4浓度(%VOL)',
-          value: 'CH4',
-          align: 'center'
-        },
-        {
-          text: 'H2S浓度(ppm)',
-          value: 'H2S',
-          align: 'center'
-        },
-        {
-          text: 'O2浓度(ppm)',
-          value: 'O2',
-          align: 'center'
-        },
-        {
-          text: '液位开关',
-          value: 'switch',
-          align: 'center'
-        },
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: 'CO浓度(ppm)', value: 'CO', align: 'center' },
+        { text: 'CH4浓度(%VOL)', value: 'CH4', align: 'center' },
+        { text: 'H2S浓度(ppm)', value: 'H2S', align: 'center' },
+        { text: 'O2浓度(ppm)', value: 'O2', align: 'center' },
+        { text: '液位开关', value: 'switch', align: 'center' },
         // {
         //   text: '状态描述',
         //   value: 'descn',
         //   align: 'center'
         // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -221,15 +148,10 @@
       })
       batchExportHarmfulData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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 = `有害监测仪数s据.xlsx` // 下载后文件名
-        document.body.appendChild(downloadElement)
-        downloadElement.click() // 点击下载
-        document.body.removeChild(downloadElement) // 下载完成移除元素
-        window.URL.revokeObjectURL(href) // 释放blob对象
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
       })
@@ -244,69 +166,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getHarmfulData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listHydrantData.vue b/src/views/dataManage/deviceData/listHydrantData.vue
index 575345d..f968760 100644
--- a/src/views/dataManage/deviceData/listHydrantData.vue
+++ b/src/views/dataManage/deviceData/listHydrantData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -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('/hydrantdata/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('/hydrantdata/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>
 
@@ -59,15 +58,6 @@
 export default {
   name: 'ListHydrantData',
   components: { DeptSelect },
-  /* filters: {
-    dataFilter(val) {
-      if (val === '40%LEL' || val === '60%LEL') {
-        return '0%LEL'
-      } else {
-        return val
-      }
-    }
-  }, */
   props: {
     type: {
       type: String,
@@ -75,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -91,10 +81,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', width: 170, align: 'center' },
@@ -105,17 +91,16 @@
         { text: '状态描述', value: 'descn', align: 'center' },
         { text: '消防栓状态', value: 'status', align: 'center' },
         { text: '上传时间', value: 'logtime', align: 'center' }
-        // { text: '点位编号', value: 'wellCode', align: 'center' },
-        // { text: '燃气浓度(%LEL)', value: 'strength', align: 'center', filter: true },
-        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
-        // { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -141,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -163,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取消防栓配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -186,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -207,35 +192,6 @@
 </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
 }
diff --git a/src/views/dataManage/deviceData/listLiquidData.vue b/src/views/dataManage/deviceData/listLiquidData.vue
index 96f28f6..d818684 100644
--- a/src/views/dataManage/deviceData/listLiquidData.vue
+++ b/src/views/dataManage/deviceData/listLiquidData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -26,45 +26,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('/liquiddata/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 align="center" type="selection" width="55"/>-->
-        <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('/liquiddata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,6 +58,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: 'ListLiquidData',
@@ -84,7 +70,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,74 +87,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '液位值(m)',
-          value: 'liquiddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '液位值(m)', value: 'liquiddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -204,16 +140,10 @@
       })
       batchExportLiquidData(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()
       })
@@ -228,69 +158,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listLiquidGasData.vue b/src/views/dataManage/deviceData/listLiquidGasData.vue
index 160edde..f2801c2 100644
--- a/src/views/dataManage/deviceData/listLiquidGasData.vue
+++ b/src/views/dataManage/deviceData/listLiquidGasData.vue
@@ -9,7 +9,8 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
+          size="small"
           dept-type="03"
           placeholder="选择权属单位/使用单位"
         />
@@ -32,46 +33,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('/liquidGasData/export')" :disabled="list.length === 0" 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 align="center" type="selection" width="55"/>-->
-        <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('/liquidGasData/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-if="column.unitFilter">{{ scope.row[column.value]|unit }}</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>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>
   </app-container>
 </template>
 
@@ -80,6 +65,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: 'ListLiquidGasData',
@@ -104,7 +90,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -122,80 +108,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '燃气浓度',
-          value: 'data',
-          align: 'center',
-          unitFilter: true
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'companyName',
-          align: 'center'
-        },
-        {
-          text: '使用单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '燃气浓度', value: 'data', align: 'center', unitFilter: true },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'companyName', align: 'center' },
+        { text: '使用单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -235,20 +166,10 @@
       })
       batchExportLiquidGasData(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
-        if (this.listQuery.sensorType === 'liquid') {
-          downloadElement.download = `燃气智能终端（一体化）数据-液位.xlsx` // 下载后文件名
-        } else {
-          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()
       })
@@ -359,69 +280,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidGasData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listNoiseData.vue b/src/views/dataManage/deviceData/listNoiseData.vue
index 5e31021..ab4faf4 100644
--- a/src/views/dataManage/deviceData/listNoiseData.vue
+++ b/src/views/dataManage/deviceData/listNoiseData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/noisedata/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 align="center" type="selection" width="55"/>-->
-        <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('/noisedata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListNoiseData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        // { text: '状态描述', value: 'descn', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -209,15 +141,10 @@
       })
       batchExportNoiseData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +159,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getNoiseData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listPantiltData.vue b/src/views/dataManage/deviceData/listPantiltData.vue
index c2030da..1609544 100644
--- a/src/views/dataManage/deviceData/listPantiltData.vue
+++ b/src/views/dataManage/deviceData/listPantiltData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/pantilt/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('/pantilt/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listTempData.vue b/src/views/dataManage/deviceData/listTempData.vue
index ceb3b61..33a3a93 100644
--- a/src/views/dataManage/deviceData/listTempData.vue
+++ b/src/views/dataManage/deviceData/listTempData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/tempdata//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 align="center" type="selection" width="55"/>-->
-        <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('/tempdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListTempData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,79 +88,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '温度(℃)',
-          value: 'temperature',
-          align: 'center'
-        },
-        {
-          text: '湿度(%RH)',
-          value: 'humidity',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '温度(℃)', value: 'temperature', align: 'center' },
+        { text: '湿度(%RH)', value: 'humidity', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -207,15 +141,10 @@
       })
       batchExportTempData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -230,69 +159,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getTempData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listTubeData.vue b/src/views/dataManage/deviceData/listTubeData.vue
index a8c5267..e0e6ab8 100644
--- a/src/views/dataManage/deviceData/listTubeData.vue
+++ b/src/views/dataManage/deviceData/listTubeData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" :need-top="false" size="small" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -21,44 +21,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('/tubedata/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 align="center" type="selection" width="55"/>-->
-        <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('/tubedata/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>
-      </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>
   </app-container>
 </template>
 
@@ -67,6 +53,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: 'ListTubeData',
@@ -78,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -95,53 +82,22 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '燃气浓度(%LEL)',
-          value: 'strength',
-          align: 'center'
-        },
-        // {
-        //   text: '电量(%)',
-        //   value: 'cell',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   align: 'center'
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '燃气浓度(%LEL)', value: 'strength', align: 'center' },
+        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        // { text: '状态描述', value: 'descn', align: 'center' },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // multipleSelection: [], // 多选选中项
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       deviceTypeList: [], // 燃气配置类型列表
       deptProps: {
         parent: 'pid',
@@ -149,25 +105,12 @@
         label: 'name',
         children: 'children'
       }, // 权属单位树形下拉菜单
-      deptTreeList: null, // 组织树列表数据
-      showDeptTree: 0, // 是否显示权属单位下拉
-      showDeviceType: true, // 是否显示设备类型下拉
+      // deptTreeList: null, // 组织树列表数据
+      // showDeptTree: 0, // 是否显示权属单位下拉
+      // showDeviceType: true, // 是否显示设备类型下拉
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      editShow: false, // 是否显示编辑框
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -202,15 +145,10 @@
       })
       batchExportTubeData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -225,69 +163,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getTubeData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listWellLocaData.vue b/src/views/dataManage/deviceData/listWellLocaData.vue
index 66722a2..e9609c8 100644
--- a/src/views/dataManage/deviceData/listWellLocaData.vue
+++ b/src/views/dataManage/deviceData/listWellLocaData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/welllocadata/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 align="center" type="selection" width="55"/>-->
-        <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('/welllocadata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListWellLocaData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,72 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '经度',
-          value: 'lng',
-          align: 'center'
-        },
-        {
-          text: '纬度',
-          value: 'lat',
-          align: 'center'
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'logtime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '经度', value: 'lng', align: 'center' },
+        { text: '纬度', value: 'lat', align: 'center' },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'logtime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -200,15 +140,10 @@
       })
       batchExportWellLocaData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -223,69 +158,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getWellLocaData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataView/components/alarmStatus.vue b/src/views/dataView/components/alarmStatus.vue
deleted file mode 100644
index f2b74b5..0000000
--- a/src/views/dataView/components/alarmStatus.vue
+++ /dev/null
@@ -1,164 +0,0 @@
-<template>
-  <el-row :gutter="40" class="panel-group">
-    <div>
-      <el-col>
-        <div class="flagBoxStyle">
-          <div class="flagStyle" />
-          <div>工单情况</div>
-        </div>
-      </el-col>
-    </div>
-    <el-row>
-      <el-col :span="12">
-        <ve-bar
-          :data="chartData"
-          :grid="grid"
-          :extend="extend"
-          :settings="chartSettings"
-        />
-      </el-col>
-      <el-col :span="12">
-        <div class="tableStyle">
-          <el-table border :data="tableList" stripe>
-            <el-table-column prop="name" label="设备型号" />
-            <el-table-column prop="value" label="设备名称" />
-          </el-table>
-        </div>
-      </el-col>
-    </el-row>
-  </el-row>
-</template>
-
-<script>
-import { wellCountByBfzt } from '@/api/well/well'
-import { deviceStaticByStatus, alarmNowStatic } from '@/api/data/dataStatics'
-import { jobCountByStatus } from '@/api/alarm/job'
-export default {
-  name: 'AlarmStatus',
-  data() {
-    return {
-      // 柱状图
-      extend: {
-        xAxis: {
-          axisLabel: {
-            rotate: 30,
-            margin: 30,
-            textStyle: {
-              align: 'center'
-            }
-          }
-        },
-        series: {
-          label: { show: true, position: 'top' },
-          barMaxWidth: 35 // 最大柱宽度
-        }
-      },
-      grid: {
-        right: 60
-      },
-      chartSettings: {
-        itemStyle: {
-          'barCategoryGap': 5
-        },
-        barWidth: 15,
-        labelMap: {
-          'deviceType': '权属单位',
-          'offline': '设备数量（个）'
-        },
-        dimension: ['deviceType'],
-        metrics: ['offline']
-      },
-      chartData: {
-        columns: ['deviceType', 'offline'],
-        rows: []
-      },
-      tableList: [],
-      dataGroup: [
-        {
-          title: '井',
-          context: '--',
-          flags: '条',
-          icon: 'icon-alarm',
-          color: '#40c9c6',
-          permission: '/well/list'
-        }
-      ]
-    }
-  },
-  created() {
-    this.getWellCount()
-    this.getDeviceCount()
-    this.getAlarmCount()
-    this.getJobCount()
-  },
-  mounted() {
-    this.tableList = [
-      {
-        value: 'WELL-001',
-        name: '液位超限'
-      },
-      {
-        value: 'WELL-002',
-        name: '燃气浓度超限'
-      },
-      {
-        value: 'WELL-003',
-        name: '井盖开启'
-      },
-      {
-        value: 'WELL-004',
-        name: '井盖开启'
-      }
-    ]
-  },
-  methods: {
-    refresh() {
-      this.getAlarmCount()
-      this.getJobCount()
-    },
-    getWellCount() {
-      wellCountByBfzt().then(response => {
-        this.dataGroup[0].context = response.data.total
-      })
-    },
-    getDeviceCount() {
-      deviceStaticByStatus().then(response => {
-        this.dataGroup[1].context = response.data.total
-      })
-    },
-    getAlarmCount() {
-      alarmNowStatic().then(response => {
-        this.dataGroup[2].context = response.data.total
-      })
-    },
-    getJobCount() {
-      jobCountByStatus().then(response => {
-        const data = response.data
-        const total = data.beforeGet + data.beforeConfirm + data.inHandle
-        this.dataGroup[3].context = total
-      })
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.tableStyle{
-  padding: 20px;
-}
-.flagBoxStyle {
-  display: flex;
-  margin-bottom: 20px;
-}
-.flagBoxStyle div:nth-child(2){
-  line-height: 30px;
-  font-weight: 600;
-}
-.flagStyle {
-  width: 4px;
-  height: 30px;
-  margin-right: 6px;
-  background: rgb(64 121 242);
-}
-
-</style>
diff --git a/src/views/dataView/components/alarmView.vue b/src/views/dataView/components/alarmView.vue
index 5c02f41..e13f811 100644
--- a/src/views/dataView/components/alarmView.vue
+++ b/src/views/dataView/components/alarmView.vue
@@ -1,106 +1,124 @@
+<!--报警分析-->
 <template>
-  <div>
-    <div class="flagBoxStyle">
-      <div class="flagStyle" />
-      <div>报警分析</div>
-    </div>
-    <el-row>
-      <el-col :span="12">
-        <ve-line
-          :data="chartDataLine"
-          :settings="chartSettingsLine"
+  <panel-card title="报警分析">
+    <template slot="func">
+      <el-col :span="16">
+        <el-date-picker
+          v-model="timeRange"
+          type="datetimerange"
+          range-separator="至"
+          size="small"
+          :picker-options="pickerOptions"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          start-placeholder="开始时间"
+          end-placeholder="结束时间"
+          @change="refresh"
         />
       </el-col>
-      <el-col :span="12">
-        <div class="tableStyle">
-          <el-table border :data="tableList" stripe>
-            <el-table-column prop="name" label="报警类型" />
-            <el-table-column prop="value" label="设备名称" />
-          </el-table>
-        </div>
-      </el-col>
-    </el-row>
-  </div>
+    </template>
+    <div class="flex-container">
+      <div class="flex-left">
+        <ve-line
+          :data="chartData"
+          :settings="chartSettingsLine"
+        />
+      </div>
+      <div class="flex-right">
+        <el-table border :data="tableList" stripe empty-text="无报警" height="340">
+          <el-table-column prop="name" label="报警类型" align="center" />
+          <el-table-column prop="value" label="报警数量" align="center" />
+        </el-table>
+      </div>
+    </div>
+  </panel-card>
 </template>
 
 <script>
-import { alarmStaticsByContent } from '@/api/alarm/deviceStatics'
+import { alarmStaticByDay, alarmStaticsByContent } from '@/api/data/dataStatics'
+import PanelCard from '@/components/BigData/Card/panelCard'
+import { getSearchLastWeekTime } from '@/utils/dateutils'
+
 export default {
   name: 'AlarmStaticsByType',
+  components: { PanelCard },
   data() {
     return {
-      tableList: [],
+      listQuery: {
+        deviceType: '',
+        beginTime: '',
+        endTime: ''
+      }, // 查询条件
+      timeRange: [], // 时间范围
+      tableList: [], // 列表
       // 折线图
       chartSettingsLine: {
         labelMap: {
-          'alarmWellData': '井盖开盖报警',
-          'alarmLiquidData': '液位超限报警',
-          'alarmHarmfulData': '有害气体超标报警'
+          'date': '日期',
+          'alarmTimes': '报警次数'
         },
-        metrics: ['alarmWellData', 'alarmLiquidData', 'alarmHarmfulData'],
         dimension: ['date']
-      },
-      chartDataLine: {
-        columns: ['date', 'alarmWellData', 'alarmLiquidData', 'alarmHarmfulData'],
+      }, // 配置
+      chartData: {
+        columns: ['date', 'alarmTimes'],
         rows: []
-      }
+      } // 折线图数据
     }
   },
   created() {
-    this.fetchDeviceTypeLine()
-  },
-  mounted() {
-    this.tableList = [
-      {
-        value: '224',
-        name: '井盖开启'
-      },
-      {
-        value: '22',
-        name: '燃气浓度超限'
-      },
-      {
-        value: '1',
-        name: '液位超限'
-      },
-      {
-        value: '4',
-        name: '有害气体超标'
-      }
-    ]
+    this.timeRange = getSearchLastWeekTime()
+    this.refresh()
   },
   methods: {
-    fetchDeviceTypeLine(val) {
-      if (val !== undefined) {
-        this.listQuery.startTime = val[0]
-        this.listQuery.endTime = val[1]
-      }
-      alarmStaticsByContent(this.listStatue).then(response => {
-        console.log(response.data, '===123')
-        this.chartDataLine.rows = response.data
+    refresh() {
+      this.handleDateTime()
+      this.fetchAlarmByDay()
+      this.fetchAlarmByContent()
+    },
+    // 获取各类报警的列表
+    fetchAlarmByContent() {
+      alarmStaticsByContent(this.listQuery).then(response => {
+        this.tableList = response.data
       })
+    },
+    // 获取每日报警数
+    fetchAlarmByDay() {
+      // 模拟数据
+      // this.chartData.rows = [
+      //   { 'date': '9月20日', 'alarmTimes': 153, 'alarmWells': 43 },
+      //   { 'date': '9月21日', 'alarmTimes': 150, 'alarmWells': 30 },
+      //   { 'date': '9月22日', 'alarmTimes': 143, 'alarmWells': 23 },
+      //   { 'date': '9月23日', 'alarmTimes': 173, 'alarmWells': 23 },
+      //   { 'date': '9月24日', 'alarmTimes': 272, 'alarmWells': 52 },
+      //   { 'date': '9月25日', 'alarmTimes': 253, 'alarmWells': 53 }
+      // ]
+      alarmStaticByDay(this.listQuery).then(response => {
+        this.chartData.rows = response.data
+      })
+    },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
     }
   }
 }
 </script>
 
 <style lang="scss" scoped>
-.tableStyle{
-  // padding: 100px 10px;
-}
-.flagBoxStyle {
+.flex-container{
   display: flex;
-  margin-bottom: 20px;
-}
-.flagBoxStyle div:nth-child(2){
-  line-height: 30px;
-  font-weight: 600;
-}
-.flagStyle {
-  width: 4px;
-  height: 30px;
-  margin-right: 6px;
-  background: rgb(64 121 242);
+  .flex-left{
+    flex:1;
+  }
+  .flex-right{
+    width: 260px;
+    padding: 10px 20px;
+  }
 }
 
 </style>
diff --git a/src/views/dataView/components/jobAnalysis.vue b/src/views/dataView/components/jobAnalysis.vue
new file mode 100644
index 0000000..483e652
--- /dev/null
+++ b/src/views/dataView/components/jobAnalysis.vue
@@ -0,0 +1,106 @@
+<!--工单情况-->
+<template>
+  <panel-card title="工单分析">
+    <template slot="func">
+      <el-col :span="16">
+        <el-date-picker
+          v-model="timeRange"
+          type="datetimerange"
+          range-separator="至"
+          size="small"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          start-placeholder="开始时间"
+          end-placeholder="结束时间"
+          @change="refresh"
+        />
+      </el-col>
+    </template>
+    <ve-bar
+      :data="chartData"
+      :extend="extend"
+      :settings="chartSettings"
+    />
+  </panel-card>
+</template>
+
+<script>
+import PanelCard from '@/components/BigData/Card/panelCard'
+import { getSearchLastWeekTime } from '@/utils/dateutils'
+import { jobStaticsByDept } from '@/api/data/dataStatics'
+export default {
+  name: 'JobAnalysis',
+  components: { PanelCard },
+  data() {
+    return {
+      listQuery: {
+        beginTime: '',
+        endTime: ''
+      }, // 查询条件
+      timeRange: [], // 时间范围
+      chartSettings: {
+        labelMap: {
+          'deptName': '权属单位',
+          'beforeGet': '待处理',
+          'beforeConfirm': '待确认',
+          'inHandle': '处理中',
+          'over': '已完成'
+        },
+        stack: {
+          'xxx': ['beforeGet', 'beforeConfirm', 'inHandle', 'over']
+        }
+      },
+      extend: {
+        xAxis: {
+          type: 'value',
+          minInterval: 1
+        },
+        series: {
+          barMaxWidth: 35
+        }
+      },
+      chartData: {
+        columns: ['deptName', 'beforeGet', 'beforeConfirm', 'inHandle', 'over'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.timeRange = getSearchLastWeekTime()
+    this.refresh()
+  },
+  mounted() {
+  },
+  methods: {
+    refresh() {
+      this.handleDateTime()
+      this.fetchData()
+    },
+    fetchData() {
+      jobStaticsByDept(this.listQuery).then(response => {
+        this.chartData.rows = response.data
+        const maxValue = Math.max.apply(Math, response.data.map(function(item) {
+          return parseInt(item.beforeGet) + parseInt(item.beforeConfirm) + parseInt(item.inHandle) + parseInt(item.over)
+        }))
+        if (maxValue < 10) {
+          this.extend.xAxis = { type: 'value', minInterval: 1, max: 10 }
+        } else {
+          this.extend.xAxis = { type: 'value', minInterval: 1 }
+        }
+      })
+    },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+</style>
diff --git a/src/views/dataView/components/panelGroup.vue b/src/views/dataView/components/panelGroup.vue
index cdb9180..7cae96f 100644
--- a/src/views/dataView/components/panelGroup.vue
+++ b/src/views/dataView/components/panelGroup.vue
@@ -1,82 +1,54 @@
 <template>
-  <el-row :gutter="20" class="panel-group">
-    <div>
-      <el-col>
-        <div class="flagBoxStyle">
-          <div class="flagStyle" />
-          <div>数据总体情况</div>
-        </div>
-      </el-col>
+  <panel-card title="数据总体情况">
+    <div class="panel-group">
+      <div v-for="card in dataGroup" :key="card.title" class="card-panel">
+        <card :title="card.title" :context="card.context" :flags="card.flags" :icon="card.icon" :color="card.color" shadow="never" @click.native="goPage(card)" />
+      </div>
     </div>
-    <div v-for="card in dataGroup" :key="card.title">
-      <el-col v-if="hasPerm(card.permission)" :lg="{span:'4-8'}" :md="8" :sm="12" :xs="24" class="card-panel-col">
-        <card :title="card.title" :context="card.context" :flags="card.flags" :icon="card.icon" :color="card.color" @click.native="goPage(card)" />
-      </el-col>
-    </div>
-    <el-dialog append-to-body :visible.sync="dialogFormVisible">
-      <el-table v-loading="listLoading" :data="list" class="table" border>
-        <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>{{ scope.row[column.value] }}</span>
-          </template>
-        </el-table-column>
-      </el-table>
-    </el-dialog>
-  </el-row>
+  </panel-card>
+<!--  <el-row :gutter="20" class="panel-group">-->
+<!--    &lt;!&ndash;    <el-dialog append-to-body :visible.sync="dialogFormVisible">&ndash;&gt;-->
+<!--    &lt;!&ndash;      <el-table v-loading="listLoading" :data="list" class="table" border>&ndash;&gt;-->
+<!--    &lt;!&ndash;        <el-table-column&ndash;&gt;-->
+<!--    &lt;!&ndash;          v-for="column in columns"&ndash;&gt;-->
+<!--    &lt;!&ndash;          :key="column.value"&ndash;&gt;-->
+<!--    &lt;!&ndash;          :label="column.text"&ndash;&gt;-->
+<!--    &lt;!&ndash;          :width="column.width"&ndash;&gt;-->
+<!--    &lt;!&ndash;          :align="column.align"&ndash;&gt;-->
+<!--    &lt;!&ndash;          show-overflow-tooltip&ndash;&gt;-->
+<!--    &lt;!&ndash;        >&ndash;&gt;-->
+<!--    &lt;!&ndash;          <template v-slot="scope">&ndash;&gt;-->
+<!--    &lt;!&ndash;            <span>{{ scope.row[column.value] }}</span>&ndash;&gt;-->
+<!--    &lt;!&ndash;          </template>&ndash;&gt;-->
+<!--    &lt;!&ndash;        </el-table-column>&ndash;&gt;-->
+<!--    &lt;!&ndash;      </el-table>&ndash;&gt;-->
+<!--    &lt;!&ndash;    </el-dialog>&ndash;&gt;-->
+<!--  </el-row>-->
 </template>
 
 <script>
 import Card from '@/components/BigData/Card'
 import { wellCountByBfzt } from '@/api/well/well'
-import { deviceStaticByStatus, alarmNowStatic } from '@/api/data/dataStatics'
-import { jobCountByStatus } from '@/api/alarm/job'
+import { deviceStaticByStatus, alarmNowStatic, dataCount } from '@/api/data/dataStatics'
+import PanelCard from '@/components/BigData/Card/panelCard'
+import { getDayTime } from '@/utils/dateutils'
 export default {
   name: 'PanelGroup',
-  components: { Card },
+  components: { PanelCard, Card },
   data() {
     return {
-      dialogFormVisible: false,
-      listLoading: false,
       columns: [
-        {
-          text: '设备编号',
-          value: '',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: '',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: '',
-          align: 'center'
-        },
-        {
-          text: '最新记录上传时间',
-          width: '200',
-          value: '',
-          align: 'center'
-        },
-        {
-          text: '离线天数',
-          value: '',
-          align: 'center'
-        }
+        { text: '设备编号', value: '', align: 'center' },
+        { text: '设备类型', value: '', align: 'center' },
+        { text: '点位编号', value: '', align: 'center' },
+        { text: '最新记录上传时间', width: '200', value: '', align: 'center' },
+        { text: '离线天数', value: '', align: 'center' }
       ], // 显示列
       dataGroup: [
         {
-          title: '井',
+          title: '安装点位',
           context: '--',
-          flags: '条',
+          flags: '个',
           icon: 'icon-well',
           color: '#40c9c6',
           permission: '/well/list'
@@ -93,25 +65,25 @@
           title: '今日数据',
           context: '--',
           flags: '条',
-          icon: 'icon-alarm',
-          color: '#f4516c',
-          permission: '/alarm/now'
+          icon: 'icon-database',
+          color: '#1ed8f3',
+          permission: '/data'
         },
         {
           title: '离线设备',
           context: '--',
           flags: '个',
-          icon: 'icon-order',
-          color: '#f4516c',
-          permission: '/job/list'
+          icon: 'icon-device',
+          color: '#676767',
+          permission: '/device/list'
         },
         {
           title: '当前报警',
           context: '--',
           flags: '条',
           icon: 'icon-alarm',
-          color: '#40c9c6',
-          permission: '/well/list'
+          color: '#f4516c',
+          permission: '/alarm/now'
         }
       ]
     }
@@ -120,34 +92,36 @@
     this.getWellCount()
     this.getDeviceCount()
     this.getAlarmCount()
-    this.getJobCount()
+    this.getTodayDataCount()
   },
   methods: {
-    goPage(card) {
-      if (card.title === '离线设备') {
-        this.dialogFormVisible = true
-      }
-    },
+    // 获取井数量
     getWellCount() {
       wellCountByBfzt().then(response => {
         this.dataGroup[0].context = response.data.total
       })
     },
+    // 获取设备数量， 离线设备数量
     getDeviceCount() {
       deviceStaticByStatus().then(response => {
         this.dataGroup[1].context = response.data.total
+        this.dataGroup[3].context = response.data.offline
       })
     },
+    // 获取当前报警数量
     getAlarmCount() {
       alarmNowStatic().then(response => {
-        this.dataGroup[2].context = response.data.total
+        this.dataGroup[4].context = response.data.total
       })
     },
-    getJobCount() {
-      jobCountByStatus().then(response => {
-        const data = response.data
-        const total = data.beforeGet + data.beforeConfirm + data.inHandle
-        this.dataGroup[3].context = total
+    // 获取今日数据总数
+    getTodayDataCount() {
+      const beginTime = getDayTime(new Date().getTime()).Format('yyyy-MM-dd hh:mm:ss')
+      const endTime = new Date().Format('yyyy-MM-dd hh:mm:ss')
+      const params = { beginTime, endTime }
+      dataCount(params).then(response => {
+        debugger
+        this.dataGroup[2].context = response.data.total
       })
     }
   }
@@ -155,174 +129,16 @@
 </script>
 
 <style lang="scss" scoped>
-.flagBoxStyle {
-  display: flex;
-  margin-bottom: 20px;
-  margin-top: -20px;
-}
-.flagBoxStyle div:nth-child(2){
-  line-height: 30px;
-  font-weight: 600;
-}
-.flagStyle {
-  width: 4px;
-  height: 30px;
-  margin-right: 6px;
-  background: rgb(64 121 242);
-}
 .panel-group {
-  margin-top: 18px;
-  .card-panel-col {
-    margin-bottom: 32px;
-  }
+  display: flex;
+  margin: 10px;
+  justify-content: space-between;
   .card-panel {
-    height: 108px;
-    cursor: pointer;
-    font-size: 12px;
-    position: relative;
-    overflow: hidden;
-    color: #666;
-    background: #fff;
-    box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
-    border-color: rgba(0, 0, 0, .05);
-
-    &:hover {
-      .card-panel-icon-wrapper {
-        color: #fff;
-      }
-
-      .icon-people {
-        background: #40c9c6;
-      }
-
-      .icon-message {
-        background: #36a3f7;
-      }
-
-      .icon-money {
-        background: #f4516c;
-      }
-
-      .icon-shopping {
-        background: #34bfa3
-      }
-    }
-
-    .icon-people {
-      color: #40c9c6;
-    }
-
-    .icon-message {
-      color: #36a3f7;
-    }
-
-    .icon-money {
-      color: #f4516c;
-    }
-
-    .icon-shopping {
-      color: #34bfa3
-    }
-
-    .card-panel-icon-wrapper {
-      float: left;
-      margin: 14px 0 0 14px;
-      padding: 16px;
-      transition: all 0.38s ease-out;
-      border-radius: 6px;
-    }
-
-    .card-panel-icon {
-      float: left;
-      font-size: 48px;
-    }
-
-    .card-panel-description {
-      float: right;
-      font-weight: bold;
-      margin: 26px;
-      margin-left: 0px;
-
-      .card-panel-text {
-        line-height: 18px;
-        color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
-        margin-bottom: 12px;
-      }
-
-      .card-panel-num {
-        font-size: 20px;
-      }
-    }
+    flex: 1;
+  }
+  .card-panel + .card-panel  {
+    margin-left: 20px;
   }
 }
 
-  @media only screen and (min-width: 768px) {
-    .el-col-sm-4-8 {
-      width: 20%;
-    }
-    .el-col-sm-offset-4-8 {
-      margin-left: 20%;
-    }
-    .el-col-sm-pull-4-8 {
-      position: relative;
-      right: 20%;
-    }
-    .el-col-sm-push-4-8 {
-      position: relative;
-      left: 20%;
-    }
-  }
-
-  @media only screen and (min-width: 992px) {
-    .el-col-md-4-8 {
-      width: 20%;
-    }
-    .el-col-md-offset-4-8 {
-      margin-left: 20%;
-    }
-    .el-col-md-pull-4-8 {
-      position: relative;
-      right: 20%;
-    }
-    .el-col-md-push-4-8 {
-      position: relative;
-      left: 20%;
-    }
-  }
-
-  @media only screen and (min-width: 1200px) {
-    .el-col-lg-4-8 {
-      width: 20%;
-    }
-    .el-col-lg-offset-4-8 {
-      margin-left: 20%;
-    }
-    .el-col-lg-pull-4-8 {
-      position: relative;
-      right: 20%;
-    }
-    .el-col-lg-push-4-8 {
-      position: relative;
-      left: 20%;
-    }
-  }
-
-  @media only screen and (min-width: 1920px) {
-    .el-col-xl-4-8 {
-      width: 20%;
-    }
-    .el-col-xl-offset-4-8 {
-      margin-left: 20%;
-    }
-    .el-col-xl-pull-4-8 {
-      position: relative;
-      right: 20%;
-    }
-    .el-col-xl-push-4-8 {
-      position: relative;
-      left: 20%;
-    }
-  }
-
 </style>
diff --git a/src/views/dataView/components/wellCountView.vue b/src/views/dataView/components/wellCountView.vue
index 82fe878..5c0e2d7 100644
--- a/src/views/dataView/components/wellCountView.vue
+++ b/src/views/dataView/components/wellCountView.vue
@@ -1,61 +1,70 @@
 <template>
-  <div>
-    <div class="flagBoxStyle">
-      <div class="flagStyle" />
-      <div>井数量分析</div>
-    </div>
-    <el-row :gutter="10">
+  <panel-card title="点位分析">
+    <el-row>
       <el-col :span="12">
-        <ve-pie
-          :data="chartDataPie"
-          :extend="extendPie"
-        />
+        <ve-pie :data="pieChartData" :extend="pieExtend" />
       </el-col>
       <el-col :span="12">
-        <ve-bar
-          :data="chartData"
-          :grid="grid"
-          :extend="extend"
-          :settings="chartSettings"
-        />
+        <ve-bar :data="chartData" :grid="grid" :extend="extend" :settings="chartSettings" />
       </el-col>
     </el-row>
+  </panel-card>
+  <!--  <div>-->
+  <!--    <div class="flagBoxStyle">-->
+  <!--      <div class="flagStyle" />-->
+  <!--      <div>井数量分析</div>-->
+  <!--    </div>-->
+    <!--    <el-row :gutter="10">-->
+    <!--      <el-col :span="12">-->
+    <!--        <ve-pie-->
+    <!--          :data="chartDataPie"-->
+    <!--          :extend="extendPie"-->
+    <!--        />-->
+    <!--      </el-col>-->
+    <!--      <el-col :span="12">-->
+    <!--        <ve-bar-->
+    <!--          :data="chartData"-->
+    <!--          :grid="grid"-->
+    <!--          :extend="extend"-->
+    <!--          :settings="chartSettings"-->
+    <!--        />-->
+    <!--      </el-col>-->
+    <!--    </el-row>-->
   </div>
 </template>
 
 <script>
-import { deviceStaticsByOnline } from '@/api/data/dataStatics'
+import { deviceStaticsByOnline, wellStaticByBfzt, wellStaticByType } from '@/api/data/dataStatics'
+import PanelCard from '@/components/BigData/Card/panelCard'
 export default {
   name: 'WellCountView',
+  components: { PanelCard },
   data() {
     return {
-      online: 0,
-      offline: 0,
       // 饼状图
-      extendPie: {
+      pieExtend: {
         series: {
           label: { show: true, position: 'outside', formatter: '{b}:{c}' },
           radius: '45%'
         }
       },
-      chartDataPie: {
-        columns: ['onlineStatus', 'deviceCount'],
+      pieChartSettings: {
+        labelMap: {
+          'bfzt': '布防状态',
+          'wellCount': '井数量'
+        },
+        dimension: 'bfzt',
+        metrics: 'wellCount'
+      },
+      pieChartData: {
+        columns: ['bfzt', 'wellCount'],
         rows: []
       },
       // 柱状图
       extend: {
-        xAxis: {
-          axisLabel: {
-            rotate: 30,
-            margin: 30,
-            textStyle: {
-              align: 'center'
-            }
-          }
-        },
         series: {
-          label: { show: true, position: 'top' },
-          barMaxWidth: 35 // 最大柱宽度
+          label: { show: true, position: 'right' },
+          barMaxWidth: 35
         }
       },
       grid: {
@@ -67,42 +76,36 @@
         },
         barWidth: 15,
         labelMap: {
-          'deviceType': '权属单位',
-          'offline': '设备数量（个）'
+          'wellTypeName': '点位类型',
+          'wellCount': '井数量'
         },
-        dimension: ['deviceType'],
-        metrics: ['offline']
+        dimension: ['wellTypeName'],
+        metrics: ['wellCount']
       },
       chartData: {
-        columns: ['deviceType', 'offline'],
+        columns: ['wellTypeName', 'wellCount'],
         rows: []
       }
     }
   },
   created() {
-    this.fetchDeviceType()
+    this.fetchBfcfData()
+    this.fetchWellTypeData()
   },
   methods: {
-    fetchDeviceType() {
-      this.chartDataPie.rows = [
-        { 'onlineStatus': '在线', 'deviceCount': '10' },
-        { 'onlineStatus': '离线', 'deviceCount': '20' }
-      ]
-      this.chartData.rows = [
-        {
-
-        }
-      ]
-      deviceStaticsByOnline().then(response => {
-        response.data.forEach((item) => {
-          this.online += item.online
-          this.offline += item.offline
-        })
+    // 获取统计数据
+    fetchBfcfData() {
+      wellStaticByBfzt(this.listQuery).then(response => {
+        const data = response.data
+        this.pieChartData.rows = [
+          { 'bfzt': '布防', 'wellCount': data.bfWell },
+          { 'bfzt': '撤防', 'wellCount': data.cfWell }
+        ]
+      })
+    },
+    fetchWellTypeData() {
+      wellStaticByType().then(response => {
         this.chartData.rows = response.data
-        // this.chartDataPie.rows = [
-        //   { 'onlineStatus': '在线', 'deviceCount': this.online },
-        //   { 'onlineStatus': '离线', 'deviceCount': this.offline }
-        // ]
       })
     }
   }
diff --git a/src/views/dataView/dataView.vue b/src/views/dataView/dataView.vue
index 4920908..a1cc8c5 100644
--- a/src/views/dataView/dataView.vue
+++ b/src/views/dataView/dataView.vue
@@ -1,51 +1,46 @@
+<!--数据概览页面-->
 <template>
   <div class="dashboard-container">
     <el-row>
-      <!-- 数总体情况 -->
+      <!--数据总体情况 -->
       <el-col :span="24">
+        <panel-group />
+      </el-col>
+    </el-row>
+    <el-row style="margin-top:10px" gutter="10">
+      <el-col :span="12">
+        <alarm-view />
+      </el-col>
+      <el-col :span="12">
+        <job-analysis />
+      </el-col>
+    </el-row>
+    <el-row style="margin-top:10px" gutter="10">
+      <!-- 井数量分析 -->
+      <el-col :span="12">
+        <well-count-view />
+      </el-col>
+      <!-- 设备数量分析 -->
+      <el-col :span="12">
         <el-card>
-          <panel-group />
+          <device-count-view />
         </el-card>
       </el-col>
-      <el-col :span="24">
-        <el-col :span="12">
-          <el-card>
-            <alarm-view />
-          </el-card>
-        </el-col>
-        <el-col :span="12">
-          <el-card>
-            <alarm-status />
-          </el-card>
-        </el-col>
-      </el-col>
-      <el-col :span="24">
-        <!-- 井数量分析 -->
-        <el-col :span="12">
-          <el-card>
-            <well-count-view />
-          </el-card>
-        </el-col>
-        <!-- 设备数量分析 -->
-        <el-col :span="12">
-          <el-card>
-            <device-count-view />
-          </el-card>
-        </el-col>
-      </el-col>
     </el-row>
   </div>
 </template>
 
 <script>
 import panelGroup from './components/panelGroup'
-import alarmStatus from './components/alarmStatus'
+import alarmStatus from './components/jobAnalysis'
 import wellCountView from './components/wellCountView'
 import deviceCountView from './components/deviceCountView'
 import alarmView from './components/alarmView'
+import JobByStatus from '@/views/dashboard/components/JobByStatus'
+import JobAnalysis from '@/views/dataView/components/jobAnalysis'
 export default {
   name: 'DataView',
-  components: { panelGroup, alarmStatus, wellCountView, deviceCountView, alarmView }
+  components: { JobAnalysis, JobByStatus, panelGroup, alarmStatus, wellCountView, deviceCountView, alarmView }
 }
 </script>
 

diff --git a/src/api/data/data.js b/src/api/data/data.js
index 7dcc6c7..9d23a3e 100644
--- a/src/api/data/data.js
+++ b/src/api/data/data.js
@@ -13,7 +13,7 @@
 // 井盖数据查询
 export function getWellData(params) {
   return request({
-    url: 'welldata/list',
+    url: 'welldata/list-page',
     method: 'get',
     params
   })
@@ -40,6 +40,15 @@
 // 液位数据查询
 export function getLiquidData(params) {
   return request({
+    url: 'liquiddata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 液位数据查询-不分页
+export function getLiquidDataSingle(params) {
+  return request({
     url: 'liquiddata/list',
     method: 'get',
     params
@@ -60,6 +69,14 @@
 // 燃气数据查询
 export function getGasData(params) {
   return request({
+    url: 'gasdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 燃气数据查询-不分页
+export function getGasDataSingle(params) {
+  return request({
     url: 'gasdata/list',
     method: 'get',
     params
@@ -85,6 +102,16 @@
     params
   })
 }
+
+// 管盯数据查询-不分页
+export function getTubeDataSingle(params) {
+  return request({
+    url: 'tubedata/list',
+    method: 'get',
+    params
+  })
+}
+
 // 批量导出管盯数据
 export function batchExportTubeData(params) {
   return request({
@@ -98,11 +125,21 @@
 // 开挖数据查询
 export function getDigData(params) {
   return request({
+    url: 'digdata/list-page',
+    method: 'get',
+    params
+  })
+}
+
+// 开挖数据查询,不分页
+export function getDigDataSingle(params) {
+  return request({
     url: 'digdata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出开挖数据
 export function batchExportDigData(params) {
   return request({
@@ -116,11 +153,20 @@
 // 有害气体数据查询
 export function getHarmfulData(params) {
   return request({
+    url: 'harmfuldata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 有害气体数据查询,不分页
+export function getHarmfulDataSingle(params) {
+  return request({
     url: 'harmfuldata/list',
     method: 'get',
     params
   })
 }
+
 // 批量导出有害气体数据
 export function batchExportHarmfulData(params) {
   return request({
@@ -134,6 +180,14 @@
 // 温湿度数据查询
 export function getTempData(params) {
   return request({
+    url: 'tempdata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 温湿度数据查询,不分页
+export function getTempDataSimple(params) {
+  return request({
     url: 'tempdata/list',
     method: 'get',
     params
@@ -153,6 +207,14 @@
 // 井盖定位监测仪数据查询
 export function getWellLocaData(params) {
   return request({
+    url: 'welllocadata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 井盖定位监测仪数据查询,不分页
+export function getWellLocaDataSingle(params) {
+  return request({
     url: 'welllocadata/list',
     method: 'get',
     params
@@ -172,6 +234,14 @@
 // 噪声记录仪数据查询
 export function getNoiseData(params) {
   return request({
+    url: 'noisedata/list-page',
+    method: 'get',
+    params
+  })
+}
+// 噪声记录仪数据查询,不分页
+export function getNoiseDataSingle(params) {
+  return request({
     url: 'noisedata/list',
     method: 'get',
     params
@@ -190,6 +260,14 @@
 // 液位燃气一体化设备数据查询
 export function getLiquidGasData(params) {
   return request({
+    url: 'liquidGasData/list-page',
+    method: 'get',
+    params
+  })
+}
+// 液位燃气一体化设备数据查询,不分页
+export function getLiquidGasDataSingle(params) {
+  return request({
     url: 'liquidGasData/list',
     method: 'get',
     params
@@ -209,7 +287,15 @@
 // 可燃气体外协数据查询
 export function getGasdectorData(params) {
   return request({
-    url: '/gasdector/listpage',
+    url: '/gasdector/list-page',
+    method: 'get',
+    params
+  })
+}
+// 可燃气体外协数据查询,不分页
+export function getGasdectorDataSingle(params) {
+  return request({
+    url: '/gasdector/list',
     method: 'get',
     params
   })
@@ -228,7 +314,15 @@
 // 激甲云台数据查询-章丘
 export function getPantiltData(params) {
   return request({
-    url: '/pantilt/listpage',
+    url: '/pantilt/list-page',
+    method: 'get',
+    params
+  })
+}
+// 激甲云台数据查询-章丘
+export function getPantiltDataSingle(params) {
+  return request({
+    url: '/pantilt/list',
     method: 'get',
     params
   })
@@ -248,6 +342,14 @@
 // 消防栓数据查询
 export function getHydrantData(params) {
   return request({
+    url: 'hydrant/list-page',
+    method: 'get',
+    params
+  })
+}
+// 消防栓数据查询,不分页
+export function getHydrantDataSingle(params) {
+  return request({
     url: 'hydrant/list',
     method: 'get',
     params
diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js
index e79dea3..d6b7a72 100644
--- a/src/api/data/dataStatics.js
+++ b/src/api/data/dataStatics.js
@@ -90,6 +90,15 @@
   })
 }
 
+// 统计某段时间每种类型的报警数
+export function alarmStaticByContent(params) {
+  return request({
+    url: 'statics/alarmStaticsByContent',
+    method: 'get',
+    params
+  })
+}
+
 // 根据权属单位进行报警统计查询
 export function alarmStaticByDept(params) {
   return request({
@@ -108,3 +117,12 @@
   })
 }
 
+// 获取数据总数
+export function dataCount(params) {
+  return request({
+    url: '/dataStatics/upLoadCountByTime',
+    method: 'get',
+    params
+  })
+}
+
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index b9e5ee6..09fb191 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-card :body-style="{ padding: '0px' }" shadow="always">
-    <div class="card-panel" >
+  <el-card :body-style="{ padding: '0px' }" :shadow="shadow">
+    <div class="card-panel">
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
@@ -24,27 +24,31 @@
     title: {
       type: String,
       default: '标题'
-    },
+    }, // 标题
     flags: {
       type: String,
       default: '单位'
-    },
+    }, // 单位
     subtitle: {
       type: String,
       default: ''
-    },
+    }, // 小标题
     icon: {
       type: String,
       default: ''
-    },
+    }, // 图标
     context: {
       type: [String, Number],
       default: ''
-    },
+    }, // 内容
     color: {
       type: String,
       default: '#40c9c6'
-    }
+    }, // 图标颜色
+    shadow: {
+      type: String,
+      default: 'always'
+    } // 卡片阴影
   },
   computed: {
     backgroundColor() {
diff --git a/src/components/BigData/Card/panelCard.vue b/src/components/BigData/Card/panelCard.vue
new file mode 100644
index 0000000..d6a7b89
--- /dev/null
+++ b/src/components/BigData/Card/panelCard.vue
@@ -0,0 +1,51 @@
+<template>
+  <div class="panel-container">
+    <div class="panel-title">
+      {{ title }}
+      <div class="title-right">
+        <slot name="func" />
+      </div>
+    </div>
+    <div class="panel-body">
+      <slot />
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'PanelCard',
+  props: {
+    // 标题
+    title: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.panel-container{
+  width: 100%;
+  padding: 10px;
+  border: 1px solid #EBEEF5 ;
+  .panel-title{
+    width: 100%;
+    line-height: 2;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0px 10px;
+    border-left: 5px solid #66b1ff;
+    position: relative;
+    .title-right{
+      display: inline-block;
+      position: absolute;
+      right: 10px;
+    }
+  }
+  .panel-body{
+    padding: 5px 0px;
+    height:auto;
+  }
+}
+</style>
diff --git a/src/icons/svg/icon-database.svg b/src/icons/svg/icon-database.svg
new file mode 100644
index 0000000..d3dd1c8
--- /dev/null
+++ b/src/icons/svg/icon-database.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1658711872102" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1435" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M960 123.7C872.7 49.9 704.8 0 512 0S151.3 49.9 64 123.7C23.2 158.2 0 197.8 0 240V605.9c0 0.7 0 1.4 0.1 2H0v176c0 132.5 229.2 240 512 240s512-107.5 512-240V608h-0.1c0.1-1.8 0.1-3.5 0.1-5.3V240c0-42.2-23.2-81.8-64-116.3zM64 356.3C151.3 430.1 319.2 480 512 480s360.7-49.9 448-123.7v79.2c-17.9 11.5-37.5 22.2-58.8 32.2C796.2 516.9 658 544 512 544s-284.2-27.1-389.2-76.4c-21.3-10-40.9-20.7-58.8-32.2v-79.1z m0 181.3c87.3 73.8 255.2 123.7 448 123.7s360.7-49.9 448-123.7v79.2c-17.9 11.4-37.5 22.2-58.8 32.2-105 49.2-243.3 76.3-389.2 76.3S227.8 698.2 122.8 649c-21.3-10-40.9-20.7-58.8-32.2v-79.2z m837.2 292.7c-105 49.2-243.3 76.3-389.2 76.3s-284.2-27.1-389.2-76.3c-20.3-9.5-39.1-19.8-56.4-30.6-1.6-5.3-2.4-10.5-2.4-15.7v-65c87.3 73.8 255.2 123.7 448 123.7s360.7-50 448-123.7v65c0 5.1-0.8 10.4-2.4 15.7-17.3 10.9-36.1 21.1-56.4 30.6z" p-id="1436"></path></svg>
\ No newline at end of file
diff --git a/src/views/dataManage/dataManage.vue b/src/views/dataManage/dataManage.vue
index 71be03f..0564cdd 100644
--- a/src/views/dataManage/dataManage.vue
+++ b/src/views/dataManage/dataManage.vue
@@ -31,19 +31,19 @@
     return {
       activeName: 'wellcover',
       tabList: [
-        { permission: '/welldata/list', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
-        { permission: '/liquiddata/list', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
-        { permission: '/gasdata/list', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
-        { permission: '/digdata/list', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
-        { permission: '/noisedata/list', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
-        { permission: '/harmfuldata/list', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
-        { permission: '/tempdata/list', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
-        { permission: '/welllocadata/list', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
-        { permission: '/liquidGasData/list', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
-        { permission: '/tubedata/list', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
-        { permission: '/gasdector/listPage', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
-        { permission: '/pantilt/listPage', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
-        { permission: '/hydrantdata/list', label: '消防栓数据列表', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
+        { permission: '/welldata/list-page', label: '井盖状态监测仪', name: 'wellcover', type: '1', comp: 'list-well-cover-data' },
+        { permission: '/liquiddata/list-page', label: '液位监测仪', name: 'liquid', type: '2', comp: 'list-liquid-data' },
+        { permission: '/gasdata/list-page', label: '燃气智能监测终端', name: 'gas', type: '4', comp: 'list-gas-data' },
+        { permission: '/digdata/list-page', label: '开挖监测仪', name: 'dig', type: '6', comp: 'list-dig-data' },
+        { permission: '/noisedata/list-page', label: '噪声记录仪', name: 'noise', type: '8', comp: 'list-noise-data' },
+        { permission: '/harmfuldata/list-page', label: '有害气体监测仪', name: 'harmful', type: '3', comp: 'list-harmful-data' },
+        { permission: '/tempdata/list-page', label: '温湿度监测仪', name: 'temp', type: '5', comp: 'list-temp-data' },
+        { permission: '/welllocadata/list-page', label: '井盖定位监测仪', name: 'wellloca', type: '7', comp: 'list-well-loca-data' },
+        { permission: '/liquidGasData/list-page', label: '燃气智能终端(一体化)', name: 'liquidgas', type: '10', comp: 'list-liquid-gas-data' },
+        { permission: '/tubedata/list-page', label: '管盯', name: 'tube', type: '12', comp: 'list-tube-data' },
+        { permission: '/gasdector/list-page', label: '可燃气体智能监测终端', name: 'gasdector', type: '1', comp: 'list-gasdector-data' },
+        { permission: '/pantilt/list-page', label: '激光甲烷遥测云台', name: 'pantilt', type: '1', comp: 'list-pantilt-data' },
+        { permission: '/hydrantdata/list-page', label: '消防栓防盗水监测仪', name: 'hydrant', type: '11', comp: 'list-hydrant-data' }
       ] // 所有tab列表
     }
   },
diff --git a/src/views/dataManage/deviceData/listDigData.vue b/src/views/dataManage/deviceData/listDigData.vue
index fa4bbc7..3cb74ad 100644
--- a/src/views/dataManage/deviceData/listDigData.vue
+++ b/src/views/dataManage/deviceData/listDigData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/digdata/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 align="center" type="selection" width="55"/>-->
-        <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('/digdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListDigData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -185,6 +116,8 @@
       if (params && params.deviceType === this.type && params.devcode) {
         this.listQuery.keywords = params.devcode
         this.fetchData()
+      } else {
+        this.fetchData()
       }
     }
   },
@@ -203,21 +136,16 @@
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
-        text: '数据处理中,请稍后...',
+        text: '下载中,请稍后...',
         spinner: 'el-icon-loading',
         background: 'rgba(0, 0, 0, 0.7)'
       })
       batchExportDigData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +160,50 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getDigData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         return 'warning-state'
       }
     },
-    indexMethod(index) {
-      return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
-    },
-    // 改变页容量
-    handleSizeChange(val) {
-      this.listQuery.limit = val
+    // checkState(row) {
+    //   if (row.status !== '0') {
+    //     return 'warning-state'
+    //   }
+    // },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    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
   }
diff --git a/src/views/dataManage/deviceData/listGasdectorData.vue b/src/views/dataManage/deviceData/listGasdectorData.vue
index a78b8da..b4ecd07 100644
--- a/src/views/dataManage/deviceData/listGasdectorData.vue
+++ b/src/views/dataManage/deviceData/listGasdectorData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/gasdector/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('/liquidGasData/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listHarmfulData.vue b/src/views/dataManage/deviceData/listHarmfulData.vue
index dde92b4..c29cb2e 100644
--- a/src/views/dataManage/deviceData/listHarmfulData.vue
+++ b/src/views/dataManage/deviceData/listHarmfulData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -27,44 +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('/harmfuldata/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 align="center" type="selection" width="55"/>-->
-        <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('/harmfuldata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,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: 'ListHarmfulData',
@@ -84,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,92 +88,32 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: 'CO浓度(ppm)',
-          value: 'CO',
-          align: 'center'
-        },
-        {
-          text: 'CH4浓度(%VOL)',
-          value: 'CH4',
-          align: 'center'
-        },
-        {
-          text: 'H2S浓度(ppm)',
-          value: 'H2S',
-          align: 'center'
-        },
-        {
-          text: 'O2浓度(ppm)',
-          value: 'O2',
-          align: 'center'
-        },
-        {
-          text: '液位开关',
-          value: 'switch',
-          align: 'center'
-        },
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: 'CO浓度(ppm)', value: 'CO', align: 'center' },
+        { text: 'CH4浓度(%VOL)', value: 'CH4', align: 'center' },
+        { text: 'H2S浓度(ppm)', value: 'H2S', align: 'center' },
+        { text: 'O2浓度(ppm)', value: 'O2', align: 'center' },
+        { text: '液位开关', value: 'switch', align: 'center' },
         // {
         //   text: '状态描述',
         //   value: 'descn',
         //   align: 'center'
         // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -221,15 +148,10 @@
       })
       batchExportHarmfulData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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 = `有害监测仪数s据.xlsx` // 下载后文件名
-        document.body.appendChild(downloadElement)
-        downloadElement.click() // 点击下载
-        document.body.removeChild(downloadElement) // 下载完成移除元素
-        window.URL.revokeObjectURL(href) // 释放blob对象
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
       })
@@ -244,69 +166,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getHarmfulData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listHydrantData.vue b/src/views/dataManage/deviceData/listHydrantData.vue
index 575345d..f968760 100644
--- a/src/views/dataManage/deviceData/listHydrantData.vue
+++ b/src/views/dataManage/deviceData/listHydrantData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -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('/hydrantdata/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('/hydrantdata/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>
 
@@ -59,15 +58,6 @@
 export default {
   name: 'ListHydrantData',
   components: { DeptSelect },
-  /* filters: {
-    dataFilter(val) {
-      if (val === '40%LEL' || val === '60%LEL') {
-        return '0%LEL'
-      } else {
-        return val
-      }
-    }
-  }, */
   props: {
     type: {
       type: String,
@@ -75,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -91,10 +81,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', width: 170, align: 'center' },
@@ -105,17 +91,16 @@
         { text: '状态描述', value: 'descn', align: 'center' },
         { text: '消防栓状态', value: 'status', align: 'center' },
         { text: '上传时间', value: 'logtime', align: 'center' }
-        // { text: '点位编号', value: 'wellCode', align: 'center' },
-        // { text: '燃气浓度(%LEL)', value: 'strength', align: 'center', filter: true },
-        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
-        // { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -141,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -163,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取消防栓配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -186,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -207,35 +192,6 @@
 </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
 }
diff --git a/src/views/dataManage/deviceData/listLiquidData.vue b/src/views/dataManage/deviceData/listLiquidData.vue
index 96f28f6..d818684 100644
--- a/src/views/dataManage/deviceData/listLiquidData.vue
+++ b/src/views/dataManage/deviceData/listLiquidData.vue
@@ -9,7 +9,7 @@
         <dept-select
           v-model="listQuery.deptid"
           size="small"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
           placeholder="选择权属单位"
         />
@@ -26,45 +26,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('/liquiddata/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 align="center" type="selection" width="55"/>-->
-        <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('/liquiddata/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>
-      </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>
   </app-container>
 </template>
 
@@ -73,6 +58,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: 'ListLiquidData',
@@ -84,7 +70,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -101,74 +87,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '液位值(m)',
-          value: 'liquiddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '液位值(m)', value: 'liquiddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -204,16 +140,10 @@
       })
       batchExportLiquidData(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()
       })
@@ -228,69 +158,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listLiquidGasData.vue b/src/views/dataManage/deviceData/listLiquidGasData.vue
index 160edde..f2801c2 100644
--- a/src/views/dataManage/deviceData/listLiquidGasData.vue
+++ b/src/views/dataManage/deviceData/listLiquidGasData.vue
@@ -9,7 +9,8 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
+          size="small"
           dept-type="03"
           placeholder="选择权属单位/使用单位"
         />
@@ -32,46 +33,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('/liquidGasData/export')" :disabled="list.length === 0" 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 align="center" type="selection" width="55"/>-->
-        <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('/liquidGasData/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-if="column.unitFilter">{{ scope.row[column.value]|unit }}</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>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>
   </app-container>
 </template>
 
@@ -80,6 +65,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: 'ListLiquidGasData',
@@ -104,7 +90,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -122,80 +108,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '燃气浓度',
-          value: 'data',
-          align: 'center',
-          unitFilter: true
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'companyName',
-          align: 'center'
-        },
-        {
-          text: '使用单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '燃气浓度', value: 'data', align: 'center', unitFilter: true },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'companyName', align: 'center' },
+        { text: '使用单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -235,20 +166,10 @@
       })
       batchExportLiquidGasData(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
-        if (this.listQuery.sensorType === 'liquid') {
-          downloadElement.download = `燃气智能终端（一体化）数据-液位.xlsx` // 下载后文件名
-        } else {
-          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()
       })
@@ -359,69 +280,45 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getLiquidGasData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listNoiseData.vue b/src/views/dataManage/deviceData/listNoiseData.vue
index 5e31021..ab4faf4 100644
--- a/src/views/dataManage/deviceData/listNoiseData.vue
+++ b/src/views/dataManage/deviceData/listNoiseData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/noisedata/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 align="center" type="selection" width="55"/>-->
-        <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('/noisedata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListNoiseData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,81 +88,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '噪声值(mg)',
-          value: 'ddata',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '噪声值(mg)', value: 'ddata', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        // { text: '状态描述', value: 'descn', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -209,15 +141,10 @@
       })
       batchExportNoiseData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -232,69 +159,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getNoiseData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listPantiltData.vue b/src/views/dataManage/deviceData/listPantiltData.vue
index c2030da..1609544 100644
--- a/src/views/dataManage/deviceData/listPantiltData.vue
+++ b/src/views/dataManage/deviceData/listPantiltData.vue
@@ -7,7 +7,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" size="small" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" size="small" :need-top="false" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -22,31 +22,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('/pantilt/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('/pantilt/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>
 
@@ -67,7 +66,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -83,10 +82,6 @@
         order: ''
       }, // 筛选条件
       timeRange: [], // 时间范围
-      options: {
-        needIndex: true, // 是否需要序号列
-        border: true // 是否需要上方边框
-      },
       columns: [
         { text: '设备编号', value: 'devcode', align: 'center' },
         { text: '点位编号', value: 'wellCode', align: 'center' },
@@ -99,10 +94,13 @@
       ], // 显示列
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -128,7 +126,7 @@
   methods: {
     // 批量导出
     batchExport() {
-      this.handleDateTime()
+      // this.handleDateTime()
       // 全屏加载动画
       const loading = this.$loading({
         lock: true,
@@ -150,16 +148,6 @@
     search() {
       this.fetchData(false)
     },
-    // 处理时间
-    handleDateTime() {
-      if (this.timeRange && this.timeRange.length > 0) {
-        this.listQuery.beginTime = this.timeRange[0]
-        this.listQuery.endTime = this.timeRange[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
-    },
     // 获取燃气配置数据
     fetchData(isNowPage = true) {
       this.listLoading = true
@@ -173,6 +161,16 @@
         this.listLoading = false
       })
     },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
@@ -194,35 +192,6 @@
 </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
   }
diff --git a/src/views/dataManage/deviceData/listTempData.vue b/src/views/dataManage/deviceData/listTempData.vue
index ceb3b61..33a3a93 100644
--- a/src/views/dataManage/deviceData/listTempData.vue
+++ b/src/views/dataManage/deviceData/listTempData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/tempdata//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 align="center" type="selection" width="55"/>-->
-        <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('/tempdata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListTempData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,79 +88,25 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '温度(℃)',
-          value: 'temperature',
-          align: 'center'
-        },
-        {
-          text: '湿度(%RH)',
-          value: 'humidity',
-          align: 'center'
-        },
-        {
-          text: '电量(%)',
-          value: 'cell',
-          width: 80,
-          align: 'center',
-          checkCell: true
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '温度(℃)', value: 'temperature', align: 'center' },
+        { text: '湿度(%RH)', value: 'humidity', align: 'center' },
+        { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -207,15 +141,10 @@
       })
       batchExportTempData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -230,69 +159,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getTempData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listTubeData.vue b/src/views/dataManage/deviceData/listTubeData.vue
index a8c5267..e0e6ab8 100644
--- a/src/views/dataManage/deviceData/listTubeData.vue
+++ b/src/views/dataManage/deviceData/listTubeData.vue
@@ -6,7 +6,7 @@
         <el-input v-model.trim="listQuery.keywords" size="small" placeholder="点位编号/设备编号" clearable />
       </search-item>
       <search-item>
-        <dept-select v-model="listQuery.deptid" :need-top="deptShowTop" dept-type="03" placeholder="选择权属单位" />
+        <dept-select v-model="listQuery.deptid" :need-top="false" size="small" dept-type="03" placeholder="选择权属单位" />
       </search-item>
       <search-item>
         <el-date-picker
@@ -21,44 +21,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('/tubedata/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 align="center" type="selection" width="55"/>-->
-        <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('/tubedata/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>
-      </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>
   </app-container>
 </template>
 
@@ -67,6 +53,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: 'ListTubeData',
@@ -78,7 +65,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -95,53 +82,22 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '燃气浓度(%LEL)',
-          value: 'strength',
-          align: 'center'
-        },
-        // {
-        //   text: '电量(%)',
-        //   value: 'cell',
-        //   width: 80,
-        //   align: 'center',
-        //   checkCell: true
-        // },
-        // {
-        //   text: '状态描述',
-        //   value: 'descn',
-        //   align: 'center'
-        // },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'uptime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '燃气浓度(%LEL)', value: 'strength', align: 'center' },
+        // { text: '电量(%)', value: 'cell', width: 80, align: 'center', checkCell: true },
+        // { text: '状态描述', value: 'descn', align: 'center' },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'uptime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // multipleSelection: [], // 多选选中项
       list: [], // 列表数据
       total: 0, // 数据总数
+      options: {
+        needIndex: true, // 是否需要序号列
+        border: true // 是否需要上方边框
+      },
       deviceTypeList: [], // 燃气配置类型列表
       deptProps: {
         parent: 'pid',
@@ -149,25 +105,12 @@
         label: 'name',
         children: 'children'
       }, // 权属单位树形下拉菜单
-      deptTreeList: null, // 组织树列表数据
-      showDeptTree: 0, // 是否显示权属单位下拉
-      showDeviceType: true, // 是否显示设备类型下拉
+      // deptTreeList: null, // 组织树列表数据
+      // showDeptTree: 0, // 是否显示权属单位下拉
+      // showDeviceType: true, // 是否显示设备类型下拉
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
-      editShow: false, // 是否显示编辑框
-      detailShow: false, // 是否显示编辑框
-      deptShowTop: false
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -202,15 +145,10 @@
       })
       batchExportTubeData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -225,69 +163,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getTubeData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataManage/deviceData/listWellLocaData.vue b/src/views/dataManage/deviceData/listWellLocaData.vue
index 66722a2..e9609c8 100644
--- a/src/views/dataManage/deviceData/listWellLocaData.vue
+++ b/src/views/dataManage/deviceData/listWellLocaData.vue
@@ -8,8 +8,9 @@
       <search-item>
         <dept-select
           v-model="listQuery.deptid"
-          :need-top="deptShowTop"
+          :need-top="false"
           dept-type="03"
+          size="small"
           placeholder="选择权属单位"
         />
       </search-item>
@@ -26,44 +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('/welllocadata/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 align="center" type="selection" width="55"/>-->
-        <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('/welllocadata/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>
-      </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>
   </app-container>
 </template>
 
@@ -72,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: 'ListWellLocaData',
@@ -83,7 +71,7 @@
     }, // 设备类型
     name: {
       type: String,
-      default: '激光甲烷遥测云台'
+      default: ''
     } // 设备名称
   },
   data() {
@@ -100,72 +88,24 @@
       }, // 筛选条件
       timeRange: [], // 时间范围
       columns: [
-        {
-          text: '设备编号',
-          value: 'devcode',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: 'wellCode',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: 'deviceTypeName',
-          align: 'center'
-        },
-        {
-          text: '经度',
-          value: 'lng',
-          align: 'center'
-        },
-        {
-          text: '纬度',
-          value: 'lat',
-          align: 'center'
-        },
-        {
-          text: '权属单位',
-          value: 'deptName',
-          align: 'center'
-        },
-        {
-          text: '上传时间',
-          value: 'logtime',
-          width: 170,
-          align: 'center'
-        }
+        { text: '设备编号', value: 'devcode', align: 'center' },
+        { text: '点位编号', value: 'wellCode', align: 'center' },
+        { text: '设备类型', value: 'deviceTypeName', align: 'center' },
+        { text: '经度', value: 'lng', align: 'center' },
+        { text: '纬度', value: 'lat', align: 'center' },
+        { text: '权属单位', value: 'deptName', align: 'center' },
+        { text: '上传时间', value: 'logtime', width: 170, align: 'center' }
       ], // 显示列
-      multipleSelection: [], // 多选选中项
+      // 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
-    }
-  },
-  watch: {
-    timeRange(val) {
-      if (val && val.length > 0) {
-        this.listQuery.beginTime = val[0]
-        this.listQuery.endTime = val[1]
-      } else {
-        this.listQuery.beginTime = ''
-        this.listQuery.endTime = ''
-      }
+      editShow: false // 是否显示编辑框
     }
   },
   mounted() {
@@ -200,15 +140,10 @@
       })
       batchExportWellLocaData(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
+        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()
       })
@@ -223,69 +158,44 @@
       if (!isNowPage) { // 是否显示当前页，否则跳转第一页
         this.listQuery.offset = 1
       }
+      this.handleDateTime()
       getWellLocaData(this.listQuery).then(response => {
         this.list = response.data.rows
         this.total = parseInt(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]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    },
     checkCell(value) {
       var cell = parseFloat(value)
       if (cell < 10) {
         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
   }
diff --git a/src/views/dataView/components/alarmStatus.vue b/src/views/dataView/components/alarmStatus.vue
deleted file mode 100644
index f2b74b5..0000000
--- a/src/views/dataView/components/alarmStatus.vue
+++ /dev/null
@@ -1,164 +0,0 @@
-<template>
-  <el-row :gutter="40" class="panel-group">
-    <div>
-      <el-col>
-        <div class="flagBoxStyle">
-          <div class="flagStyle" />
-          <div>工单情况</div>
-        </div>
-      </el-col>
-    </div>
-    <el-row>
-      <el-col :span="12">
-        <ve-bar
-          :data="chartData"
-          :grid="grid"
-          :extend="extend"
-          :settings="chartSettings"
-        />
-      </el-col>
-      <el-col :span="12">
-        <div class="tableStyle">
-          <el-table border :data="tableList" stripe>
-            <el-table-column prop="name" label="设备型号" />
-            <el-table-column prop="value" label="设备名称" />
-          </el-table>
-        </div>
-      </el-col>
-    </el-row>
-  </el-row>
-</template>
-
-<script>
-import { wellCountByBfzt } from '@/api/well/well'
-import { deviceStaticByStatus, alarmNowStatic } from '@/api/data/dataStatics'
-import { jobCountByStatus } from '@/api/alarm/job'
-export default {
-  name: 'AlarmStatus',
-  data() {
-    return {
-      // 柱状图
-      extend: {
-        xAxis: {
-          axisLabel: {
-            rotate: 30,
-            margin: 30,
-            textStyle: {
-              align: 'center'
-            }
-          }
-        },
-        series: {
-          label: { show: true, position: 'top' },
-          barMaxWidth: 35 // 最大柱宽度
-        }
-      },
-      grid: {
-        right: 60
-      },
-      chartSettings: {
-        itemStyle: {
-          'barCategoryGap': 5
-        },
-        barWidth: 15,
-        labelMap: {
-          'deviceType': '权属单位',
-          'offline': '设备数量（个）'
-        },
-        dimension: ['deviceType'],
-        metrics: ['offline']
-      },
-      chartData: {
-        columns: ['deviceType', 'offline'],
-        rows: []
-      },
-      tableList: [],
-      dataGroup: [
-        {
-          title: '井',
-          context: '--',
-          flags: '条',
-          icon: 'icon-alarm',
-          color: '#40c9c6',
-          permission: '/well/list'
-        }
-      ]
-    }
-  },
-  created() {
-    this.getWellCount()
-    this.getDeviceCount()
-    this.getAlarmCount()
-    this.getJobCount()
-  },
-  mounted() {
-    this.tableList = [
-      {
-        value: 'WELL-001',
-        name: '液位超限'
-      },
-      {
-        value: 'WELL-002',
-        name: '燃气浓度超限'
-      },
-      {
-        value: 'WELL-003',
-        name: '井盖开启'
-      },
-      {
-        value: 'WELL-004',
-        name: '井盖开启'
-      }
-    ]
-  },
-  methods: {
-    refresh() {
-      this.getAlarmCount()
-      this.getJobCount()
-    },
-    getWellCount() {
-      wellCountByBfzt().then(response => {
-        this.dataGroup[0].context = response.data.total
-      })
-    },
-    getDeviceCount() {
-      deviceStaticByStatus().then(response => {
-        this.dataGroup[1].context = response.data.total
-      })
-    },
-    getAlarmCount() {
-      alarmNowStatic().then(response => {
-        this.dataGroup[2].context = response.data.total
-      })
-    },
-    getJobCount() {
-      jobCountByStatus().then(response => {
-        const data = response.data
-        const total = data.beforeGet + data.beforeConfirm + data.inHandle
-        this.dataGroup[3].context = total
-      })
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.tableStyle{
-  padding: 20px;
-}
-.flagBoxStyle {
-  display: flex;
-  margin-bottom: 20px;
-}
-.flagBoxStyle div:nth-child(2){
-  line-height: 30px;
-  font-weight: 600;
-}
-.flagStyle {
-  width: 4px;
-  height: 30px;
-  margin-right: 6px;
-  background: rgb(64 121 242);
-}
-
-</style>
diff --git a/src/views/dataView/components/alarmView.vue b/src/views/dataView/components/alarmView.vue
index 5c02f41..e13f811 100644
--- a/src/views/dataView/components/alarmView.vue
+++ b/src/views/dataView/components/alarmView.vue
@@ -1,106 +1,124 @@
+<!--报警分析-->
 <template>
-  <div>
-    <div class="flagBoxStyle">
-      <div class="flagStyle" />
-      <div>报警分析</div>
-    </div>
-    <el-row>
-      <el-col :span="12">
-        <ve-line
-          :data="chartDataLine"
-          :settings="chartSettingsLine"
+  <panel-card title="报警分析">
+    <template slot="func">
+      <el-col :span="16">
+        <el-date-picker
+          v-model="timeRange"
+          type="datetimerange"
+          range-separator="至"
+          size="small"
+          :picker-options="pickerOptions"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          start-placeholder="开始时间"
+          end-placeholder="结束时间"
+          @change="refresh"
         />
       </el-col>
-      <el-col :span="12">
-        <div class="tableStyle">
-          <el-table border :data="tableList" stripe>
-            <el-table-column prop="name" label="报警类型" />
-            <el-table-column prop="value" label="设备名称" />
-          </el-table>
-        </div>
-      </el-col>
-    </el-row>
-  </div>
+    </template>
+    <div class="flex-container">
+      <div class="flex-left">
+        <ve-line
+          :data="chartData"
+          :settings="chartSettingsLine"
+        />
+      </div>
+      <div class="flex-right">
+        <el-table border :data="tableList" stripe empty-text="无报警" height="340">
+          <el-table-column prop="name" label="报警类型" align="center" />
+          <el-table-column prop="value" label="报警数量" align="center" />
+        </el-table>
+      </div>
+    </div>
+  </panel-card>
 </template>
 
 <script>
-import { alarmStaticsByContent } from '@/api/alarm/deviceStatics'
+import { alarmStaticByDay, alarmStaticsByContent } from '@/api/data/dataStatics'
+import PanelCard from '@/components/BigData/Card/panelCard'
+import { getSearchLastWeekTime } from '@/utils/dateutils'
+
 export default {
   name: 'AlarmStaticsByType',
+  components: { PanelCard },
   data() {
     return {
-      tableList: [],
+      listQuery: {
+        deviceType: '',
+        beginTime: '',
+        endTime: ''
+      }, // 查询条件
+      timeRange: [], // 时间范围
+      tableList: [], // 列表
       // 折线图
       chartSettingsLine: {
         labelMap: {
-          'alarmWellData': '井盖开盖报警',
-          'alarmLiquidData': '液位超限报警',
-          'alarmHarmfulData': '有害气体超标报警'
+          'date': '日期',
+          'alarmTimes': '报警次数'
         },
-        metrics: ['alarmWellData', 'alarmLiquidData', 'alarmHarmfulData'],
         dimension: ['date']
-      },
-      chartDataLine: {
-        columns: ['date', 'alarmWellData', 'alarmLiquidData', 'alarmHarmfulData'],
+      }, // 配置
+      chartData: {
+        columns: ['date', 'alarmTimes'],
         rows: []
-      }
+      } // 折线图数据
     }
   },
   created() {
-    this.fetchDeviceTypeLine()
-  },
-  mounted() {
-    this.tableList = [
-      {
-        value: '224',
-        name: '井盖开启'
-      },
-      {
-        value: '22',
-        name: '燃气浓度超限'
-      },
-      {
-        value: '1',
-        name: '液位超限'
-      },
-      {
-        value: '4',
-        name: '有害气体超标'
-      }
-    ]
+    this.timeRange = getSearchLastWeekTime()
+    this.refresh()
   },
   methods: {
-    fetchDeviceTypeLine(val) {
-      if (val !== undefined) {
-        this.listQuery.startTime = val[0]
-        this.listQuery.endTime = val[1]
-      }
-      alarmStaticsByContent(this.listStatue).then(response => {
-        console.log(response.data, '===123')
-        this.chartDataLine.rows = response.data
+    refresh() {
+      this.handleDateTime()
+      this.fetchAlarmByDay()
+      this.fetchAlarmByContent()
+    },
+    // 获取各类报警的列表
+    fetchAlarmByContent() {
+      alarmStaticsByContent(this.listQuery).then(response => {
+        this.tableList = response.data
       })
+    },
+    // 获取每日报警数
+    fetchAlarmByDay() {
+      // 模拟数据
+      // this.chartData.rows = [
+      //   { 'date': '9月20日', 'alarmTimes': 153, 'alarmWells': 43 },
+      //   { 'date': '9月21日', 'alarmTimes': 150, 'alarmWells': 30 },
+      //   { 'date': '9月22日', 'alarmTimes': 143, 'alarmWells': 23 },
+      //   { 'date': '9月23日', 'alarmTimes': 173, 'alarmWells': 23 },
+      //   { 'date': '9月24日', 'alarmTimes': 272, 'alarmWells': 52 },
+      //   { 'date': '9月25日', 'alarmTimes': 253, 'alarmWells': 53 }
+      // ]
+      alarmStaticByDay(this.listQuery).then(response => {
+        this.chartData.rows = response.data
+      })
+    },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
     }
   }
 }
 </script>
 
 <style lang="scss" scoped>
-.tableStyle{
-  // padding: 100px 10px;
-}
-.flagBoxStyle {
+.flex-container{
   display: flex;
-  margin-bottom: 20px;
-}
-.flagBoxStyle div:nth-child(2){
-  line-height: 30px;
-  font-weight: 600;
-}
-.flagStyle {
-  width: 4px;
-  height: 30px;
-  margin-right: 6px;
-  background: rgb(64 121 242);
+  .flex-left{
+    flex:1;
+  }
+  .flex-right{
+    width: 260px;
+    padding: 10px 20px;
+  }
 }
 
 </style>
diff --git a/src/views/dataView/components/jobAnalysis.vue b/src/views/dataView/components/jobAnalysis.vue
new file mode 100644
index 0000000..483e652
--- /dev/null
+++ b/src/views/dataView/components/jobAnalysis.vue
@@ -0,0 +1,106 @@
+<!--工单情况-->
+<template>
+  <panel-card title="工单分析">
+    <template slot="func">
+      <el-col :span="16">
+        <el-date-picker
+          v-model="timeRange"
+          type="datetimerange"
+          range-separator="至"
+          size="small"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          start-placeholder="开始时间"
+          end-placeholder="结束时间"
+          @change="refresh"
+        />
+      </el-col>
+    </template>
+    <ve-bar
+      :data="chartData"
+      :extend="extend"
+      :settings="chartSettings"
+    />
+  </panel-card>
+</template>
+
+<script>
+import PanelCard from '@/components/BigData/Card/panelCard'
+import { getSearchLastWeekTime } from '@/utils/dateutils'
+import { jobStaticsByDept } from '@/api/data/dataStatics'
+export default {
+  name: 'JobAnalysis',
+  components: { PanelCard },
+  data() {
+    return {
+      listQuery: {
+        beginTime: '',
+        endTime: ''
+      }, // 查询条件
+      timeRange: [], // 时间范围
+      chartSettings: {
+        labelMap: {
+          'deptName': '权属单位',
+          'beforeGet': '待处理',
+          'beforeConfirm': '待确认',
+          'inHandle': '处理中',
+          'over': '已完成'
+        },
+        stack: {
+          'xxx': ['beforeGet', 'beforeConfirm', 'inHandle', 'over']
+        }
+      },
+      extend: {
+        xAxis: {
+          type: 'value',
+          minInterval: 1
+        },
+        series: {
+          barMaxWidth: 35
+        }
+      },
+      chartData: {
+        columns: ['deptName', 'beforeGet', 'beforeConfirm', 'inHandle', 'over'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.timeRange = getSearchLastWeekTime()
+    this.refresh()
+  },
+  mounted() {
+  },
+  methods: {
+    refresh() {
+      this.handleDateTime()
+      this.fetchData()
+    },
+    fetchData() {
+      jobStaticsByDept(this.listQuery).then(response => {
+        this.chartData.rows = response.data
+        const maxValue = Math.max.apply(Math, response.data.map(function(item) {
+          return parseInt(item.beforeGet) + parseInt(item.beforeConfirm) + parseInt(item.inHandle) + parseInt(item.over)
+        }))
+        if (maxValue < 10) {
+          this.extend.xAxis = { type: 'value', minInterval: 1, max: 10 }
+        } else {
+          this.extend.xAxis = { type: 'value', minInterval: 1 }
+        }
+      })
+    },
+    // 处理时间
+    handleDateTime() {
+      if (this.timeRange && this.timeRange.length > 0) {
+        this.listQuery.beginTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      } else {
+        this.listQuery.beginTime = ''
+        this.listQuery.endTime = ''
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+</style>
diff --git a/src/views/dataView/components/panelGroup.vue b/src/views/dataView/components/panelGroup.vue
index cdb9180..7cae96f 100644
--- a/src/views/dataView/components/panelGroup.vue
+++ b/src/views/dataView/components/panelGroup.vue
@@ -1,82 +1,54 @@
 <template>
-  <el-row :gutter="20" class="panel-group">
-    <div>
-      <el-col>
-        <div class="flagBoxStyle">
-          <div class="flagStyle" />
-          <div>数据总体情况</div>
-        </div>
-      </el-col>
+  <panel-card title="数据总体情况">
+    <div class="panel-group">
+      <div v-for="card in dataGroup" :key="card.title" class="card-panel">
+        <card :title="card.title" :context="card.context" :flags="card.flags" :icon="card.icon" :color="card.color" shadow="never" @click.native="goPage(card)" />
+      </div>
     </div>
-    <div v-for="card in dataGroup" :key="card.title">
-      <el-col v-if="hasPerm(card.permission)" :lg="{span:'4-8'}" :md="8" :sm="12" :xs="24" class="card-panel-col">
-        <card :title="card.title" :context="card.context" :flags="card.flags" :icon="card.icon" :color="card.color" @click.native="goPage(card)" />
-      </el-col>
-    </div>
-    <el-dialog append-to-body :visible.sync="dialogFormVisible">
-      <el-table v-loading="listLoading" :data="list" class="table" border>
-        <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>{{ scope.row[column.value] }}</span>
-          </template>
-        </el-table-column>
-      </el-table>
-    </el-dialog>
-  </el-row>
+  </panel-card>
+<!--  <el-row :gutter="20" class="panel-group">-->
+<!--    &lt;!&ndash;    <el-dialog append-to-body :visible.sync="dialogFormVisible">&ndash;&gt;-->
+<!--    &lt;!&ndash;      <el-table v-loading="listLoading" :data="list" class="table" border>&ndash;&gt;-->
+<!--    &lt;!&ndash;        <el-table-column&ndash;&gt;-->
+<!--    &lt;!&ndash;          v-for="column in columns"&ndash;&gt;-->
+<!--    &lt;!&ndash;          :key="column.value"&ndash;&gt;-->
+<!--    &lt;!&ndash;          :label="column.text"&ndash;&gt;-->
+<!--    &lt;!&ndash;          :width="column.width"&ndash;&gt;-->
+<!--    &lt;!&ndash;          :align="column.align"&ndash;&gt;-->
+<!--    &lt;!&ndash;          show-overflow-tooltip&ndash;&gt;-->
+<!--    &lt;!&ndash;        >&ndash;&gt;-->
+<!--    &lt;!&ndash;          <template v-slot="scope">&ndash;&gt;-->
+<!--    &lt;!&ndash;            <span>{{ scope.row[column.value] }}</span>&ndash;&gt;-->
+<!--    &lt;!&ndash;          </template>&ndash;&gt;-->
+<!--    &lt;!&ndash;        </el-table-column>&ndash;&gt;-->
+<!--    &lt;!&ndash;      </el-table>&ndash;&gt;-->
+<!--    &lt;!&ndash;    </el-dialog>&ndash;&gt;-->
+<!--  </el-row>-->
 </template>
 
 <script>
 import Card from '@/components/BigData/Card'
 import { wellCountByBfzt } from '@/api/well/well'
-import { deviceStaticByStatus, alarmNowStatic } from '@/api/data/dataStatics'
-import { jobCountByStatus } from '@/api/alarm/job'
+import { deviceStaticByStatus, alarmNowStatic, dataCount } from '@/api/data/dataStatics'
+import PanelCard from '@/components/BigData/Card/panelCard'
+import { getDayTime } from '@/utils/dateutils'
 export default {
   name: 'PanelGroup',
-  components: { Card },
+  components: { PanelCard, Card },
   data() {
     return {
-      dialogFormVisible: false,
-      listLoading: false,
       columns: [
-        {
-          text: '设备编号',
-          value: '',
-          align: 'center'
-        },
-        {
-          text: '设备类型',
-          value: '',
-          align: 'center'
-        },
-        {
-          text: '点位编号',
-          value: '',
-          align: 'center'
-        },
-        {
-          text: '最新记录上传时间',
-          width: '200',
-          value: '',
-          align: 'center'
-        },
-        {
-          text: '离线天数',
-          value: '',
-          align: 'center'
-        }
+        { text: '设备编号', value: '', align: 'center' },
+        { text: '设备类型', value: '', align: 'center' },
+        { text: '点位编号', value: '', align: 'center' },
+        { text: '最新记录上传时间', width: '200', value: '', align: 'center' },
+        { text: '离线天数', value: '', align: 'center' }
       ], // 显示列
       dataGroup: [
         {
-          title: '井',
+          title: '安装点位',
           context: '--',
-          flags: '条',
+          flags: '个',
           icon: 'icon-well',
           color: '#40c9c6',
           permission: '/well/list'
@@ -93,25 +65,25 @@
           title: '今日数据',
           context: '--',
           flags: '条',
-          icon: 'icon-alarm',
-          color: '#f4516c',
-          permission: '/alarm/now'
+          icon: 'icon-database',
+          color: '#1ed8f3',
+          permission: '/data'
         },
         {
           title: '离线设备',
           context: '--',
           flags: '个',
-          icon: 'icon-order',
-          color: '#f4516c',
-          permission: '/job/list'
+          icon: 'icon-device',
+          color: '#676767',
+          permission: '/device/list'
         },
         {
           title: '当前报警',
           context: '--',
           flags: '条',
           icon: 'icon-alarm',
-          color: '#40c9c6',
-          permission: '/well/list'
+          color: '#f4516c',
+          permission: '/alarm/now'
         }
       ]
     }
@@ -120,34 +92,36 @@
     this.getWellCount()
     this.getDeviceCount()
     this.getAlarmCount()
-    this.getJobCount()
+    this.getTodayDataCount()
   },
   methods: {
-    goPage(card) {
-      if (card.title === '离线设备') {
-        this.dialogFormVisible = true
-      }
-    },
+    // 获取井数量
     getWellCount() {
       wellCountByBfzt().then(response => {
         this.dataGroup[0].context = response.data.total
       })
     },
+    // 获取设备数量， 离线设备数量
     getDeviceCount() {
       deviceStaticByStatus().then(response => {
         this.dataGroup[1].context = response.data.total
+        this.dataGroup[3].context = response.data.offline
       })
     },
+    // 获取当前报警数量
     getAlarmCount() {
       alarmNowStatic().then(response => {
-        this.dataGroup[2].context = response.data.total
+        this.dataGroup[4].context = response.data.total
       })
     },
-    getJobCount() {
-      jobCountByStatus().then(response => {
-        const data = response.data
-        const total = data.beforeGet + data.beforeConfirm + data.inHandle
-        this.dataGroup[3].context = total
+    // 获取今日数据总数
+    getTodayDataCount() {
+      const beginTime = getDayTime(new Date().getTime()).Format('yyyy-MM-dd hh:mm:ss')
+      const endTime = new Date().Format('yyyy-MM-dd hh:mm:ss')
+      const params = { beginTime, endTime }
+      dataCount(params).then(response => {
+        debugger
+        this.dataGroup[2].context = response.data.total
       })
     }
   }
@@ -155,174 +129,16 @@
 </script>
 
 <style lang="scss" scoped>
-.flagBoxStyle {
-  display: flex;
-  margin-bottom: 20px;
-  margin-top: -20px;
-}
-.flagBoxStyle div:nth-child(2){
-  line-height: 30px;
-  font-weight: 600;
-}
-.flagStyle {
-  width: 4px;
-  height: 30px;
-  margin-right: 6px;
-  background: rgb(64 121 242);
-}
 .panel-group {
-  margin-top: 18px;
-  .card-panel-col {
-    margin-bottom: 32px;
-  }
+  display: flex;
+  margin: 10px;
+  justify-content: space-between;
   .card-panel {
-    height: 108px;
-    cursor: pointer;
-    font-size: 12px;
-    position: relative;
-    overflow: hidden;
-    color: #666;
-    background: #fff;
-    box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
-    border-color: rgba(0, 0, 0, .05);
-
-    &:hover {
-      .card-panel-icon-wrapper {
-        color: #fff;
-      }
-
-      .icon-people {
-        background: #40c9c6;
-      }
-
-      .icon-message {
-        background: #36a3f7;
-      }
-
-      .icon-money {
-        background: #f4516c;
-      }
-
-      .icon-shopping {
-        background: #34bfa3
-      }
-    }
-
-    .icon-people {
-      color: #40c9c6;
-    }
-
-    .icon-message {
-      color: #36a3f7;
-    }
-
-    .icon-money {
-      color: #f4516c;
-    }
-
-    .icon-shopping {
-      color: #34bfa3
-    }
-
-    .card-panel-icon-wrapper {
-      float: left;
-      margin: 14px 0 0 14px;
-      padding: 16px;
-      transition: all 0.38s ease-out;
-      border-radius: 6px;
-    }
-
-    .card-panel-icon {
-      float: left;
-      font-size: 48px;
-    }
-
-    .card-panel-description {
-      float: right;
-      font-weight: bold;
-      margin: 26px;
-      margin-left: 0px;
-
-      .card-panel-text {
-        line-height: 18px;
-        color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
-        margin-bottom: 12px;
-      }
-
-      .card-panel-num {
-        font-size: 20px;
-      }
-    }
+    flex: 1;
+  }
+  .card-panel + .card-panel  {
+    margin-left: 20px;
   }
 }
 
-  @media only screen and (min-width: 768px) {
-    .el-col-sm-4-8 {
-      width: 20%;
-    }
-    .el-col-sm-offset-4-8 {
-      margin-left: 20%;
-    }
-    .el-col-sm-pull-4-8 {
-      position: relative;
-      right: 20%;
-    }
-    .el-col-sm-push-4-8 {
-      position: relative;
-      left: 20%;
-    }
-  }
-
-  @media only screen and (min-width: 992px) {
-    .el-col-md-4-8 {
-      width: 20%;
-    }
-    .el-col-md-offset-4-8 {
-      margin-left: 20%;
-    }
-    .el-col-md-pull-4-8 {
-      position: relative;
-      right: 20%;
-    }
-    .el-col-md-push-4-8 {
-      position: relative;
-      left: 20%;
-    }
-  }
-
-  @media only screen and (min-width: 1200px) {
-    .el-col-lg-4-8 {
-      width: 20%;
-    }
-    .el-col-lg-offset-4-8 {
-      margin-left: 20%;
-    }
-    .el-col-lg-pull-4-8 {
-      position: relative;
-      right: 20%;
-    }
-    .el-col-lg-push-4-8 {
-      position: relative;
-      left: 20%;
-    }
-  }
-
-  @media only screen and (min-width: 1920px) {
-    .el-col-xl-4-8 {
-      width: 20%;
-    }
-    .el-col-xl-offset-4-8 {
-      margin-left: 20%;
-    }
-    .el-col-xl-pull-4-8 {
-      position: relative;
-      right: 20%;
-    }
-    .el-col-xl-push-4-8 {
-      position: relative;
-      left: 20%;
-    }
-  }
-
 </style>
diff --git a/src/views/dataView/components/wellCountView.vue b/src/views/dataView/components/wellCountView.vue
index 82fe878..5c0e2d7 100644
--- a/src/views/dataView/components/wellCountView.vue
+++ b/src/views/dataView/components/wellCountView.vue
@@ -1,61 +1,70 @@
 <template>
-  <div>
-    <div class="flagBoxStyle">
-      <div class="flagStyle" />
-      <div>井数量分析</div>
-    </div>
-    <el-row :gutter="10">
+  <panel-card title="点位分析">
+    <el-row>
       <el-col :span="12">
-        <ve-pie
-          :data="chartDataPie"
-          :extend="extendPie"
-        />
+        <ve-pie :data="pieChartData" :extend="pieExtend" />
       </el-col>
       <el-col :span="12">
-        <ve-bar
-          :data="chartData"
-          :grid="grid"
-          :extend="extend"
-          :settings="chartSettings"
-        />
+        <ve-bar :data="chartData" :grid="grid" :extend="extend" :settings="chartSettings" />
       </el-col>
     </el-row>
+  </panel-card>
+  <!--  <div>-->
+  <!--    <div class="flagBoxStyle">-->
+  <!--      <div class="flagStyle" />-->
+  <!--      <div>井数量分析</div>-->
+  <!--    </div>-->
+    <!--    <el-row :gutter="10">-->
+    <!--      <el-col :span="12">-->
+    <!--        <ve-pie-->
+    <!--          :data="chartDataPie"-->
+    <!--          :extend="extendPie"-->
+    <!--        />-->
+    <!--      </el-col>-->
+    <!--      <el-col :span="12">-->
+    <!--        <ve-bar-->
+    <!--          :data="chartData"-->
+    <!--          :grid="grid"-->
+    <!--          :extend="extend"-->
+    <!--          :settings="chartSettings"-->
+    <!--        />-->
+    <!--      </el-col>-->
+    <!--    </el-row>-->
   </div>
 </template>
 
 <script>
-import { deviceStaticsByOnline } from '@/api/data/dataStatics'
+import { deviceStaticsByOnline, wellStaticByBfzt, wellStaticByType } from '@/api/data/dataStatics'
+import PanelCard from '@/components/BigData/Card/panelCard'
 export default {
   name: 'WellCountView',
+  components: { PanelCard },
   data() {
     return {
-      online: 0,
-      offline: 0,
       // 饼状图
-      extendPie: {
+      pieExtend: {
         series: {
           label: { show: true, position: 'outside', formatter: '{b}:{c}' },
           radius: '45%'
         }
       },
-      chartDataPie: {
-        columns: ['onlineStatus', 'deviceCount'],
+      pieChartSettings: {
+        labelMap: {
+          'bfzt': '布防状态',
+          'wellCount': '井数量'
+        },
+        dimension: 'bfzt',
+        metrics: 'wellCount'
+      },
+      pieChartData: {
+        columns: ['bfzt', 'wellCount'],
         rows: []
       },
       // 柱状图
       extend: {
-        xAxis: {
-          axisLabel: {
-            rotate: 30,
-            margin: 30,
-            textStyle: {
-              align: 'center'
-            }
-          }
-        },
         series: {
-          label: { show: true, position: 'top' },
-          barMaxWidth: 35 // 最大柱宽度
+          label: { show: true, position: 'right' },
+          barMaxWidth: 35
         }
       },
       grid: {
@@ -67,42 +76,36 @@
         },
         barWidth: 15,
         labelMap: {
-          'deviceType': '权属单位',
-          'offline': '设备数量（个）'
+          'wellTypeName': '点位类型',
+          'wellCount': '井数量'
         },
-        dimension: ['deviceType'],
-        metrics: ['offline']
+        dimension: ['wellTypeName'],
+        metrics: ['wellCount']
       },
       chartData: {
-        columns: ['deviceType', 'offline'],
+        columns: ['wellTypeName', 'wellCount'],
         rows: []
       }
     }
   },
   created() {
-    this.fetchDeviceType()
+    this.fetchBfcfData()
+    this.fetchWellTypeData()
   },
   methods: {
-    fetchDeviceType() {
-      this.chartDataPie.rows = [
-        { 'onlineStatus': '在线', 'deviceCount': '10' },
-        { 'onlineStatus': '离线', 'deviceCount': '20' }
-      ]
-      this.chartData.rows = [
-        {
-
-        }
-      ]
-      deviceStaticsByOnline().then(response => {
-        response.data.forEach((item) => {
-          this.online += item.online
-          this.offline += item.offline
-        })
+    // 获取统计数据
+    fetchBfcfData() {
+      wellStaticByBfzt(this.listQuery).then(response => {
+        const data = response.data
+        this.pieChartData.rows = [
+          { 'bfzt': '布防', 'wellCount': data.bfWell },
+          { 'bfzt': '撤防', 'wellCount': data.cfWell }
+        ]
+      })
+    },
+    fetchWellTypeData() {
+      wellStaticByType().then(response => {
         this.chartData.rows = response.data
-        // this.chartDataPie.rows = [
-        //   { 'onlineStatus': '在线', 'deviceCount': this.online },
-        //   { 'onlineStatus': '离线', 'deviceCount': this.offline }
-        // ]
       })
     }
   }
diff --git a/src/views/dataView/dataView.vue b/src/views/dataView/dataView.vue
index 4920908..a1cc8c5 100644
--- a/src/views/dataView/dataView.vue
+++ b/src/views/dataView/dataView.vue
@@ -1,51 +1,46 @@
+<!--数据概览页面-->
 <template>
   <div class="dashboard-container">
     <el-row>
-      <!-- 数总体情况 -->
+      <!--数据总体情况 -->
       <el-col :span="24">
+        <panel-group />
+      </el-col>
+    </el-row>
+    <el-row style="margin-top:10px" gutter="10">
+      <el-col :span="12">
+        <alarm-view />
+      </el-col>
+      <el-col :span="12">
+        <job-analysis />
+      </el-col>
+    </el-row>
+    <el-row style="margin-top:10px" gutter="10">
+      <!-- 井数量分析 -->
+      <el-col :span="12">
+        <well-count-view />
+      </el-col>
+      <!-- 设备数量分析 -->
+      <el-col :span="12">
         <el-card>
-          <panel-group />
+          <device-count-view />
         </el-card>
       </el-col>
-      <el-col :span="24">
-        <el-col :span="12">
-          <el-card>
-            <alarm-view />
-          </el-card>
-        </el-col>
-        <el-col :span="12">
-          <el-card>
-            <alarm-status />
-          </el-card>
-        </el-col>
-      </el-col>
-      <el-col :span="24">
-        <!-- 井数量分析 -->
-        <el-col :span="12">
-          <el-card>
-            <well-count-view />
-          </el-card>
-        </el-col>
-        <!-- 设备数量分析 -->
-        <el-col :span="12">
-          <el-card>
-            <device-count-view />
-          </el-card>
-        </el-col>
-      </el-col>
     </el-row>
   </div>
 </template>
 
 <script>
 import panelGroup from './components/panelGroup'
-import alarmStatus from './components/alarmStatus'
+import alarmStatus from './components/jobAnalysis'
 import wellCountView from './components/wellCountView'
 import deviceCountView from './components/deviceCountView'
 import alarmView from './components/alarmView'
+import JobByStatus from '@/views/dashboard/components/JobByStatus'
+import JobAnalysis from '@/views/dataView/components/jobAnalysis'
 export default {
   name: 'DataView',
-  components: { panelGroup, alarmStatus, wellCountView, deviceCountView, alarmView }
+  components: { JobAnalysis, JobByStatus, panelGroup, alarmStatus, wellCountView, deviceCountView, alarmView }
 }
 </script>
 
diff --git a/src/views/system/resource/editResource.vue b/src/views/system/resource/editResource.vue
index 5f88a36..74e6363 100644
--- a/src/views/system/resource/editResource.vue
+++ b/src/views/system/resource/editResource.vue
@@ -27,7 +27,7 @@
         </el-col>
         <el-col :span="12">
           <el-form-item label="父资源" prop="pid">
-            <select-tree v-model="resourceForm.pid" :options="resourceTreeList" :props="defaultProps" />
+            <select-tree v-model="resourceForm.pid" :options="resourceTreeList" :props="defaultProps" :default-expanded-keys="[resourceForm.pid]" />
           </el-form-item>
         </el-col>
       </el-row>