diff --git a/src/api/environment/alarm.js b/src/api/environment/alarm.js
new file mode 100644
index 0000000..a882719
--- /dev/null
+++ b/src/api/environment/alarm.js
@@ -0,0 +1,41 @@
+/**
+ * 报警接口
+ */
+import request from '@/utils/request'
+import qs from 'qs'
+// 报警列表查询
+export function getAlarmList(params) {
+  return request({
+    url: '/environment/alarm/listPage',
+    method: 'get',
+    params
+  })
+}
+// 单个消警
+export function cancelAlarm(params) {
+  return request({
+    url: '/environment/alarm/cancel',
+    method: 'get',
+    params
+  })
+}
+
+// 批量消警
+export function batchCancelAlarm() {
+  return request({
+    url: '/environment/alarm/batchCancel',
+    method: 'post'
+  })
+}
+
+// 批量导出
+export function batchExportAlarm(params, config) {
+  return request({
+    url: '/environment/alarm/export',
+    method: 'get',
+    timeout: 120000,
+    params,
+    ...config,
+    responseType: 'blob' // 这一步也很关键，一定要加上 responseType 值为 blob
+  })
+}

diff --git a/src/api/environment/alarm.js b/src/api/environment/alarm.js
new file mode 100644
index 0000000..a882719
--- /dev/null
+++ b/src/api/environment/alarm.js
@@ -0,0 +1,41 @@
+/**
+ * 报警接口
+ */
+import request from '@/utils/request'
+import qs from 'qs'
+// 报警列表查询
+export function getAlarmList(params) {
+  return request({
+    url: '/environment/alarm/listPage',
+    method: 'get',
+    params
+  })
+}
+// 单个消警
+export function cancelAlarm(params) {
+  return request({
+    url: '/environment/alarm/cancel',
+    method: 'get',
+    params
+  })
+}
+
+// 批量消警
+export function batchCancelAlarm() {
+  return request({
+    url: '/environment/alarm/batchCancel',
+    method: 'post'
+  })
+}
+
+// 批量导出
+export function batchExportAlarm(params, config) {
+  return request({
+    url: '/environment/alarm/export',
+    method: 'get',
+    timeout: 120000,
+    params,
+    ...config,
+    responseType: 'blob' // 这一步也很关键，一定要加上 responseType 值为 blob
+  })
+}
diff --git a/src/api/system/dict.js b/src/api/system/dict.js
index 444617e..0efe7e3 100644
--- a/src/api/system/dict.js
+++ b/src/api/system/dict.js
@@ -40,8 +40,7 @@
 // 获取字典值列表
 export function getDictByCode(params) {
   return request({
-    url: '/environment/dict/code/'+params,
-    method: 'get',
-    params
+    url: 'dict/code/'+params,
+    method: 'get'
   })
 }

diff --git a/src/api/environment/alarm.js b/src/api/environment/alarm.js
new file mode 100644
index 0000000..a882719
--- /dev/null
+++ b/src/api/environment/alarm.js
@@ -0,0 +1,41 @@
+/**
+ * 报警接口
+ */
+import request from '@/utils/request'
+import qs from 'qs'
+// 报警列表查询
+export function getAlarmList(params) {
+  return request({
+    url: '/environment/alarm/listPage',
+    method: 'get',
+    params
+  })
+}
+// 单个消警
+export function cancelAlarm(params) {
+  return request({
+    url: '/environment/alarm/cancel',
+    method: 'get',
+    params
+  })
+}
+
+// 批量消警
+export function batchCancelAlarm() {
+  return request({
+    url: '/environment/alarm/batchCancel',
+    method: 'post'
+  })
+}
+
+// 批量导出
+export function batchExportAlarm(params, config) {
+  return request({
+    url: '/environment/alarm/export',
+    method: 'get',
+    timeout: 120000,
+    params,
+    ...config,
+    responseType: 'blob' // 这一步也很关键，一定要加上 responseType 值为 blob
+  })
+}
diff --git a/src/api/system/dict.js b/src/api/system/dict.js
index 444617e..0efe7e3 100644
--- a/src/api/system/dict.js
+++ b/src/api/system/dict.js
@@ -40,8 +40,7 @@
 // 获取字典值列表
 export function getDictByCode(params) {
   return request({
-    url: '/environment/dict/code/'+params,
-    method: 'get',
-    params
+    url: 'dict/code/'+params,
+    method: 'get'
   })
 }
diff --git a/src/components/NormalTable/index.vue b/src/components/NormalTable/index.vue
index 5077bef..6776ddd 100644
--- a/src/components/NormalTable/index.vue
+++ b/src/components/NormalTable/index.vue
@@ -152,7 +152,7 @@
     },
     size: {
       type: String,
-      default: ''
+      default: 'small'
     }, // 表格大小，默认，small,mini等，与el-table条件仙童
     toolsOption: {
       type: Object,

diff --git a/src/api/environment/alarm.js b/src/api/environment/alarm.js
new file mode 100644
index 0000000..a882719
--- /dev/null
+++ b/src/api/environment/alarm.js
@@ -0,0 +1,41 @@
+/**
+ * 报警接口
+ */
+import request from '@/utils/request'
+import qs from 'qs'
+// 报警列表查询
+export function getAlarmList(params) {
+  return request({
+    url: '/environment/alarm/listPage',
+    method: 'get',
+    params
+  })
+}
+// 单个消警
+export function cancelAlarm(params) {
+  return request({
+    url: '/environment/alarm/cancel',
+    method: 'get',
+    params
+  })
+}
+
+// 批量消警
+export function batchCancelAlarm() {
+  return request({
+    url: '/environment/alarm/batchCancel',
+    method: 'post'
+  })
+}
+
+// 批量导出
+export function batchExportAlarm(params, config) {
+  return request({
+    url: '/environment/alarm/export',
+    method: 'get',
+    timeout: 120000,
+    params,
+    ...config,
+    responseType: 'blob' // 这一步也很关键，一定要加上 responseType 值为 blob
+  })
+}
diff --git a/src/api/system/dict.js b/src/api/system/dict.js
index 444617e..0efe7e3 100644
--- a/src/api/system/dict.js
+++ b/src/api/system/dict.js
@@ -40,8 +40,7 @@
 // 获取字典值列表
 export function getDictByCode(params) {
   return request({
-    url: '/environment/dict/code/'+params,
-    method: 'get',
-    params
+    url: 'dict/code/'+params,
+    method: 'get'
   })
 }
diff --git a/src/components/NormalTable/index.vue b/src/components/NormalTable/index.vue
index 5077bef..6776ddd 100644
--- a/src/components/NormalTable/index.vue
+++ b/src/components/NormalTable/index.vue
@@ -152,7 +152,7 @@
     },
     size: {
       type: String,
-      default: ''
+      default: 'small'
     }, // 表格大小，默认，small,mini等，与el-table条件仙童
     toolsOption: {
       type: Object,
diff --git a/src/router/modules/environment.js b/src/router/modules/environment.js
index 10f1d58..75094ea 100644
--- a/src/router/modules/environment.js
+++ b/src/router/modules/environment.js
@@ -35,7 +35,7 @@
       }, {
         path: '/historyAlarm',
         name: 'historyAlarm',
-        component: () => import('@/views/environment/environmentData'),
+        component: () => import('@/views/alarm/listAlarmHistory'),
         meta: { title: '历史报警', icon: '', permission: ['/environment/alarm/listPage'] }
       }
     ]
@@ -93,7 +93,7 @@
       }, {
         path: '/historyData',
         name: 'HistoryData',
-        component: () => import('@/views/environment/environmentData'),
+        component: () => import('@/views/data/pointData'),
         meta: { title: '历史数据', icon: '', permission: ['/environment/data/historyData'] }
       }
     ]

diff --git a/src/api/environment/alarm.js b/src/api/environment/alarm.js
new file mode 100644
index 0000000..a882719
--- /dev/null
+++ b/src/api/environment/alarm.js
@@ -0,0 +1,41 @@
+/**
+ * 报警接口
+ */
+import request from '@/utils/request'
+import qs from 'qs'
+// 报警列表查询
+export function getAlarmList(params) {
+  return request({
+    url: '/environment/alarm/listPage',
+    method: 'get',
+    params
+  })
+}
+// 单个消警
+export function cancelAlarm(params) {
+  return request({
+    url: '/environment/alarm/cancel',
+    method: 'get',
+    params
+  })
+}
+
+// 批量消警
+export function batchCancelAlarm() {
+  return request({
+    url: '/environment/alarm/batchCancel',
+    method: 'post'
+  })
+}
+
+// 批量导出
+export function batchExportAlarm(params, config) {
+  return request({
+    url: '/environment/alarm/export',
+    method: 'get',
+    timeout: 120000,
+    params,
+    ...config,
+    responseType: 'blob' // 这一步也很关键，一定要加上 responseType 值为 blob
+  })
+}
diff --git a/src/api/system/dict.js b/src/api/system/dict.js
index 444617e..0efe7e3 100644
--- a/src/api/system/dict.js
+++ b/src/api/system/dict.js
@@ -40,8 +40,7 @@
 // 获取字典值列表
 export function getDictByCode(params) {
   return request({
-    url: '/environment/dict/code/'+params,
-    method: 'get',
-    params
+    url: 'dict/code/'+params,
+    method: 'get'
   })
 }
diff --git a/src/components/NormalTable/index.vue b/src/components/NormalTable/index.vue
index 5077bef..6776ddd 100644
--- a/src/components/NormalTable/index.vue
+++ b/src/components/NormalTable/index.vue
@@ -152,7 +152,7 @@
     },
     size: {
       type: String,
-      default: ''
+      default: 'small'
     }, // 表格大小，默认，small,mini等，与el-table条件仙童
     toolsOption: {
       type: Object,
diff --git a/src/router/modules/environment.js b/src/router/modules/environment.js
index 10f1d58..75094ea 100644
--- a/src/router/modules/environment.js
+++ b/src/router/modules/environment.js
@@ -35,7 +35,7 @@
       }, {
         path: '/historyAlarm',
         name: 'historyAlarm',
-        component: () => import('@/views/environment/environmentData'),
+        component: () => import('@/views/alarm/listAlarmHistory'),
         meta: { title: '历史报警', icon: '', permission: ['/environment/alarm/listPage'] }
       }
     ]
@@ -93,7 +93,7 @@
       }, {
         path: '/historyData',
         name: 'HistoryData',
-        component: () => import('@/views/environment/environmentData'),
+        component: () => import('@/views/data/pointData'),
         meta: { title: '历史数据', icon: '', permission: ['/environment/data/historyData'] }
       }
     ]
diff --git a/src/views/alarm/listAlarmHistory.vue b/src/views/alarm/listAlarmHistory.vue
new file mode 100644
index 0000000..2d8b5c9
--- /dev/null
+++ b/src/views/alarm/listAlarmHistory.vue
@@ -0,0 +1,255 @@
+<template>
+  <app-container>
+    <!--筛选条件-->
+    <search-area :need-clear="false" :need-search-more="false" type="seperate" size="small" search-more-type="default" @search="search" >
+        <!--一般查询条件-->
+        <search-item>
+          <el-input v-model.trim="listQuery.keywords" placeholder="设备编号/点位名称" size="small" clearable/>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.alarmType" placeholder="报警类型" size="small" clearable>
+            <el-option
+              v-for="item in alarmTypeList"
+              :key="item.value"
+              :label="item.name"
+              :value="item.value"/>
+          </el-select>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.AlarmLevelType" placeholder="报警等级" size="small" clearable>
+            <el-option
+              v-for="item in alarmLevelList"
+              :key="item.value"
+              :label="item.name"
+              :value="item.value"/>
+          </el-select>
+        </search-item>
+      <search-item>
+        <el-select v-model="listQuery.status" placeholder="报警状态" size="small" clearable>
+          <el-option
+            v-for="item in alarmStatusList"
+            :key="item.value"
+            :label="item.name"
+            :value="item.value"/>
+        </el-select>
+      </search-item>
+        <search-item>
+          <el-date-picker
+            v-model="timeRange"
+            type="datetimerange"
+            range-separator="至"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            start-placeholder="报警开始时间"
+            end-placeholder="报警结束时间" size="small"/>
+        </search-item>
+      </search-area>
+    <!--查询结果Table显示-->
+    <normal-table :data="list" :head="tableOption.head" :query="listQuery" :total="total" :columns="columns" :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption" @change="changePage">
+      <template slot="btns">
+        <el-button v-if="hasPerm('/environment/device/export')" size="small" class="edit_btn" @click="batchExport">导出记录</el-button>
+      </template>
+      <template slot="columns">
+        <el-table-column label="报警状态" align="center" width="90">
+          <template slot-scope="scope">
+            <el-tag v-if="scope.row.status=='2'" type="success" size="small">手动消警</el-tag>
+            <el-tag v-else-if="scope.row.status=='1'" type="danger" size="small">正在报警</el-tag>
+            <el-tag v-else type="info" size="small">自动消警</el-tag>
+          </template>
+        </el-table-column>
+        <!--<el-table-column label="操作" align="center" width="120">-->
+          <!--<template slot-scope="scope">-->
+            <!--<el-button v-if="hasPerm('/environment/device/update')" type="text" size="small" @click.stop="cancel(scope.row.id)">取消报警</el-button>-->
+          <!--</template>-->
+        <!--</el-table-column>-->
+      </template>
+    </normal-table>
+  </app-container>
+</template>
+
+<script>
+import { getAlarmList, batchExportAlarm, cancelAlarm, batchCancelAlarm } from '@/api/environment/alarm'
+import { exportFile } from '@/utils/exportutils'
+import { getDictByCode } from '@/api/system/dict'
+export default {
+  name: 'ListAlarmHistory',
+  data() {
+    return {
+      listQuery: {
+        keywords: '',
+        alarmType: '',
+        AlarmLevelType: '',
+        status: '',
+        beginTime: '',
+        endTime: '',
+        offset: 1,
+        limit: 20,
+        sort: '',
+        order: ''
+      }, // 筛选条件
+      timeRange: [], // 时间范围
+      columns: [
+        {
+          text: '设备编号',
+          value: 'deviceNo',
+          align: 'center'
+        },
+        {
+          text: '点位名称',
+          value: 'deviceName',
+          align: 'center'
+        },
+        {
+          text: '报警类型',
+          value: 'alarmTypeName',
+          align: 'center'
+        },
+        {
+          text: '报警等级',
+          value: 'alarmLevelName',
+          align: 'center',
+          width: 80
+        },
+        {
+          text: '报警内容',
+          value: 'alarmContent',
+          align: 'center',
+          level: true
+        },
+        {
+          text: '报警数值',
+          value: 'alarmValue',
+          width: 80,
+          align: 'center',
+        },
+        {
+          text: '报警时间',
+          value: 'alarmTime',
+          width: 170,
+          align: 'center'
+        }
+      ], // 显示列
+      multipleSelection: [], // 多选选中项
+      list: [], // 列表数据
+      total: 0, // 数据总数
+      tableOption: {
+        head: {
+          show: true, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: true // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      alarmTypeList: [], // 报警类型列表
+      alarmLevelList: [], // 报警等级类型列表
+      alarmStatusList:[], // 报警状态列表
+      listLoading: true, // 加载动画
+      fullscreenLoading: false, // 全屏加载动画
+    }
+  },
+  computed: {
+    alarmType() {
+      return this.listQuery.alarmType
+    }
+  },
+  created() {
+    this.fetchAlarmType()
+    this.fetchAlarmLevelType()
+    this.fetchAlarmStatus()
+    this.fetchData()// 获取数据
+  },
+  activated() {
+    this.listQuery.keywords = ''
+    this.listQuery.alarmType = ''
+    this.listQuery.AlarmLevelType = ''
+    this.listQuery.status = ''
+    this.listQuery.beginTime = ''
+    this.listQuery.endTime = ''
+    this.timeRange = []
+    this.fetchData(false)
+  },
+  methods: {
+    // 批量导出
+    batchExport() {
+      // 全屏加载动画
+      const loading = this.$loading({
+        lock: true,
+        text: '数据处理中,请稍后...',
+        spinner: 'el-icon-loading',
+        background: 'rgba(0, 0, 0, 0.7)'
+      })
+      batchExportAlarm(this.listQuery).then(res => {
+        loading.close() // 关闭加载动画
+        const blob = new Blob([res.data])
+        const fileName = `实时报警.xlsx`
+        exportFile(blob, fileName)
+      }).catch((res) => {
+        loading.close()
+      })
+    },
+    // 查询数据
+    search() {
+      this.fetchData(false)
+    },
+    // 获取数据
+    fetchData(isNowPage = true) {
+      this.listLoading = true
+      if (!isNowPage) { // 是否显示当前页，否则跳转第一页
+        this.listQuery.offset = 1
+      }
+      this.list = [
+        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124, status: '1', alarmTime:'2021-07-04 08:33:00'},
+        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124, status: '2', alarmTime:'2021-07-04 08:33:00'},
+        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124, status: '3', alarmTime:'2021-07-04 08:33:00'}
+      ]
+      this.total = 1
+      // getAlarmList(this.listQuery).then(response => {
+      //   this.list = response.data.rows
+      //   this.total = parseInt(response.data.total)
+        this.listLoading = false
+      // })
+    },
+    // 获取报警类型
+    fetchAlarmType() {
+      getDictByCode('envAlarmType').then(response => {
+        this.alarmTypeList = response.data
+      })
+    },
+    // 获取报警内容类别
+    fetchAlarmLevelType() {
+      getDictByCode('envAlarmLevel').then(response => {
+        this.alarmLevelList = response.data
+      })
+    },
+    // 获取报警内容类别
+    fetchAlarmStatus() {
+      getDictByCode('envAlarmStatus').then(response => {
+        this.alarmStatusList = response.data
+      })
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+  .edit_btns{
+    .edit_btn{
+      float:right;
+      margin:7px 3px;//为了需要居中显示margin-top和bottom要用$tableTitleHeight减去按钮原高度除以2
+    }
+  }
+</style>

diff --git a/src/api/environment/alarm.js b/src/api/environment/alarm.js
new file mode 100644
index 0000000..a882719
--- /dev/null
+++ b/src/api/environment/alarm.js
@@ -0,0 +1,41 @@
+/**
+ * 报警接口
+ */
+import request from '@/utils/request'
+import qs from 'qs'
+// 报警列表查询
+export function getAlarmList(params) {
+  return request({
+    url: '/environment/alarm/listPage',
+    method: 'get',
+    params
+  })
+}
+// 单个消警
+export function cancelAlarm(params) {
+  return request({
+    url: '/environment/alarm/cancel',
+    method: 'get',
+    params
+  })
+}
+
+// 批量消警
+export function batchCancelAlarm() {
+  return request({
+    url: '/environment/alarm/batchCancel',
+    method: 'post'
+  })
+}
+
+// 批量导出
+export function batchExportAlarm(params, config) {
+  return request({
+    url: '/environment/alarm/export',
+    method: 'get',
+    timeout: 120000,
+    params,
+    ...config,
+    responseType: 'blob' // 这一步也很关键，一定要加上 responseType 值为 blob
+  })
+}
diff --git a/src/api/system/dict.js b/src/api/system/dict.js
index 444617e..0efe7e3 100644
--- a/src/api/system/dict.js
+++ b/src/api/system/dict.js
@@ -40,8 +40,7 @@
 // 获取字典值列表
 export function getDictByCode(params) {
   return request({
-    url: '/environment/dict/code/'+params,
-    method: 'get',
-    params
+    url: 'dict/code/'+params,
+    method: 'get'
   })
 }
diff --git a/src/components/NormalTable/index.vue b/src/components/NormalTable/index.vue
index 5077bef..6776ddd 100644
--- a/src/components/NormalTable/index.vue
+++ b/src/components/NormalTable/index.vue
@@ -152,7 +152,7 @@
     },
     size: {
       type: String,
-      default: ''
+      default: 'small'
     }, // 表格大小，默认，small,mini等，与el-table条件仙童
     toolsOption: {
       type: Object,
diff --git a/src/router/modules/environment.js b/src/router/modules/environment.js
index 10f1d58..75094ea 100644
--- a/src/router/modules/environment.js
+++ b/src/router/modules/environment.js
@@ -35,7 +35,7 @@
       }, {
         path: '/historyAlarm',
         name: 'historyAlarm',
-        component: () => import('@/views/environment/environmentData'),
+        component: () => import('@/views/alarm/listAlarmHistory'),
         meta: { title: '历史报警', icon: '', permission: ['/environment/alarm/listPage'] }
       }
     ]
@@ -93,7 +93,7 @@
       }, {
         path: '/historyData',
         name: 'HistoryData',
-        component: () => import('@/views/environment/environmentData'),
+        component: () => import('@/views/data/pointData'),
         meta: { title: '历史数据', icon: '', permission: ['/environment/data/historyData'] }
       }
     ]
diff --git a/src/views/alarm/listAlarmHistory.vue b/src/views/alarm/listAlarmHistory.vue
new file mode 100644
index 0000000..2d8b5c9
--- /dev/null
+++ b/src/views/alarm/listAlarmHistory.vue
@@ -0,0 +1,255 @@
+<template>
+  <app-container>
+    <!--筛选条件-->
+    <search-area :need-clear="false" :need-search-more="false" type="seperate" size="small" search-more-type="default" @search="search" >
+        <!--一般查询条件-->
+        <search-item>
+          <el-input v-model.trim="listQuery.keywords" placeholder="设备编号/点位名称" size="small" clearable/>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.alarmType" placeholder="报警类型" size="small" clearable>
+            <el-option
+              v-for="item in alarmTypeList"
+              :key="item.value"
+              :label="item.name"
+              :value="item.value"/>
+          </el-select>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.AlarmLevelType" placeholder="报警等级" size="small" clearable>
+            <el-option
+              v-for="item in alarmLevelList"
+              :key="item.value"
+              :label="item.name"
+              :value="item.value"/>
+          </el-select>
+        </search-item>
+      <search-item>
+        <el-select v-model="listQuery.status" placeholder="报警状态" size="small" clearable>
+          <el-option
+            v-for="item in alarmStatusList"
+            :key="item.value"
+            :label="item.name"
+            :value="item.value"/>
+        </el-select>
+      </search-item>
+        <search-item>
+          <el-date-picker
+            v-model="timeRange"
+            type="datetimerange"
+            range-separator="至"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            start-placeholder="报警开始时间"
+            end-placeholder="报警结束时间" size="small"/>
+        </search-item>
+      </search-area>
+    <!--查询结果Table显示-->
+    <normal-table :data="list" :head="tableOption.head" :query="listQuery" :total="total" :columns="columns" :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption" @change="changePage">
+      <template slot="btns">
+        <el-button v-if="hasPerm('/environment/device/export')" size="small" class="edit_btn" @click="batchExport">导出记录</el-button>
+      </template>
+      <template slot="columns">
+        <el-table-column label="报警状态" align="center" width="90">
+          <template slot-scope="scope">
+            <el-tag v-if="scope.row.status=='2'" type="success" size="small">手动消警</el-tag>
+            <el-tag v-else-if="scope.row.status=='1'" type="danger" size="small">正在报警</el-tag>
+            <el-tag v-else type="info" size="small">自动消警</el-tag>
+          </template>
+        </el-table-column>
+        <!--<el-table-column label="操作" align="center" width="120">-->
+          <!--<template slot-scope="scope">-->
+            <!--<el-button v-if="hasPerm('/environment/device/update')" type="text" size="small" @click.stop="cancel(scope.row.id)">取消报警</el-button>-->
+          <!--</template>-->
+        <!--</el-table-column>-->
+      </template>
+    </normal-table>
+  </app-container>
+</template>
+
+<script>
+import { getAlarmList, batchExportAlarm, cancelAlarm, batchCancelAlarm } from '@/api/environment/alarm'
+import { exportFile } from '@/utils/exportutils'
+import { getDictByCode } from '@/api/system/dict'
+export default {
+  name: 'ListAlarmHistory',
+  data() {
+    return {
+      listQuery: {
+        keywords: '',
+        alarmType: '',
+        AlarmLevelType: '',
+        status: '',
+        beginTime: '',
+        endTime: '',
+        offset: 1,
+        limit: 20,
+        sort: '',
+        order: ''
+      }, // 筛选条件
+      timeRange: [], // 时间范围
+      columns: [
+        {
+          text: '设备编号',
+          value: 'deviceNo',
+          align: 'center'
+        },
+        {
+          text: '点位名称',
+          value: 'deviceName',
+          align: 'center'
+        },
+        {
+          text: '报警类型',
+          value: 'alarmTypeName',
+          align: 'center'
+        },
+        {
+          text: '报警等级',
+          value: 'alarmLevelName',
+          align: 'center',
+          width: 80
+        },
+        {
+          text: '报警内容',
+          value: 'alarmContent',
+          align: 'center',
+          level: true
+        },
+        {
+          text: '报警数值',
+          value: 'alarmValue',
+          width: 80,
+          align: 'center',
+        },
+        {
+          text: '报警时间',
+          value: 'alarmTime',
+          width: 170,
+          align: 'center'
+        }
+      ], // 显示列
+      multipleSelection: [], // 多选选中项
+      list: [], // 列表数据
+      total: 0, // 数据总数
+      tableOption: {
+        head: {
+          show: true, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: true // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      alarmTypeList: [], // 报警类型列表
+      alarmLevelList: [], // 报警等级类型列表
+      alarmStatusList:[], // 报警状态列表
+      listLoading: true, // 加载动画
+      fullscreenLoading: false, // 全屏加载动画
+    }
+  },
+  computed: {
+    alarmType() {
+      return this.listQuery.alarmType
+    }
+  },
+  created() {
+    this.fetchAlarmType()
+    this.fetchAlarmLevelType()
+    this.fetchAlarmStatus()
+    this.fetchData()// 获取数据
+  },
+  activated() {
+    this.listQuery.keywords = ''
+    this.listQuery.alarmType = ''
+    this.listQuery.AlarmLevelType = ''
+    this.listQuery.status = ''
+    this.listQuery.beginTime = ''
+    this.listQuery.endTime = ''
+    this.timeRange = []
+    this.fetchData(false)
+  },
+  methods: {
+    // 批量导出
+    batchExport() {
+      // 全屏加载动画
+      const loading = this.$loading({
+        lock: true,
+        text: '数据处理中,请稍后...',
+        spinner: 'el-icon-loading',
+        background: 'rgba(0, 0, 0, 0.7)'
+      })
+      batchExportAlarm(this.listQuery).then(res => {
+        loading.close() // 关闭加载动画
+        const blob = new Blob([res.data])
+        const fileName = `实时报警.xlsx`
+        exportFile(blob, fileName)
+      }).catch((res) => {
+        loading.close()
+      })
+    },
+    // 查询数据
+    search() {
+      this.fetchData(false)
+    },
+    // 获取数据
+    fetchData(isNowPage = true) {
+      this.listLoading = true
+      if (!isNowPage) { // 是否显示当前页，否则跳转第一页
+        this.listQuery.offset = 1
+      }
+      this.list = [
+        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124, status: '1', alarmTime:'2021-07-04 08:33:00'},
+        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124, status: '2', alarmTime:'2021-07-04 08:33:00'},
+        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124, status: '3', alarmTime:'2021-07-04 08:33:00'}
+      ]
+      this.total = 1
+      // getAlarmList(this.listQuery).then(response => {
+      //   this.list = response.data.rows
+      //   this.total = parseInt(response.data.total)
+        this.listLoading = false
+      // })
+    },
+    // 获取报警类型
+    fetchAlarmType() {
+      getDictByCode('envAlarmType').then(response => {
+        this.alarmTypeList = response.data
+      })
+    },
+    // 获取报警内容类别
+    fetchAlarmLevelType() {
+      getDictByCode('envAlarmLevel').then(response => {
+        this.alarmLevelList = response.data
+      })
+    },
+    // 获取报警内容类别
+    fetchAlarmStatus() {
+      getDictByCode('envAlarmStatus').then(response => {
+        this.alarmStatusList = response.data
+      })
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+  .edit_btns{
+    .edit_btn{
+      float:right;
+      margin:7px 3px;//为了需要居中显示margin-top和bottom要用$tableTitleHeight减去按钮原高度除以2
+    }
+  }
+</style>
diff --git a/src/views/alarm/listAlarmNow.vue b/src/views/alarm/listAlarmNow.vue
index 75133d1..59cdcac 100644
--- a/src/views/alarm/listAlarmNow.vue
+++ b/src/views/alarm/listAlarmNow.vue
@@ -7,7 +7,7 @@
           <el-input v-model.trim="listQuery.keywords" placeholder="设备编号/点位名称" size="small" clearable/>
         </search-item>
         <search-item>
-          <el-select v-model="listQuery.alarmType" placeholder="告警类型" size="small" clearable>
+          <el-select v-model="listQuery.alarmType" placeholder="报警类型" size="small" clearable>
             <el-option
               v-for="item in alarmTypeList"
               :key="item.value"
@@ -16,7 +16,7 @@
           </el-select>
         </search-item>
         <search-item>
-          <el-select v-model="listQuery.AlarmLevelType" placeholder="告警等级" size="small" clearable>
+          <el-select v-model="listQuery.AlarmLevelType" placeholder="报警等级" size="small" clearable>
             <el-option
               v-for="item in alarmLevelList"
               :key="item.value"
@@ -38,7 +38,7 @@
     <normal-table :data="list" :head="tableOption.head" :query="listQuery" :total="total" :columns="columns" :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption" @change="changePage">
       <template slot="btns">
         <el-button v-if="hasPerm('/environment/device/export')" size="small" class="edit_btn" @click="batchExport">导出记录</el-button>
-        <el-button v-if="hasPerm('/environment/device/export')" size="small" class="edit_btn" @click="batchExport">一键消警</el-button>
+        <el-button v-if="hasPerm('/environment/device/export')" size="small" class="edit_btn" @click="batchCancel">一键消警</el-button>
       </template>
       <template slot="preColumns">
         <el-table-column type="selection" width="45" align="center"></el-table-column>
@@ -46,7 +46,7 @@
       <template slot="columns">
         <el-table-column label="操作" align="center" width="120">
           <template slot-scope="scope">
-            <el-button v-if="hasPerm('/environment/device/update')" type="text" size="small" @click.stop="edit(scope.row)">取消报警</el-button>
+            <el-button v-if="hasPerm('/environment/device/update')" type="text" size="small" @click.stop="cancel(scope.row.id)">取消报警</el-button>
           </template>
         </el-table-column>
       </template>
@@ -55,14 +55,11 @@
 </template>
 
 <script>
-// import infoWell from '@/views/wellManage/infoWell'
-// import { getAlarmList, batchExportAlarm, getAlarmType, getAlarmLevelType } from '@/api/alarm'
-// import HandlePrompt from './components/HandlePrompt'
-// import { isOperation } from '@/utils/permission'
-
+import { getAlarmList, batchExportAlarm, cancelAlarm, batchCancelAlarm } from '@/api/environment/alarm'
+import { exportFile } from '@/utils/exportutils'
+import { getDictByCode } from '@/api/system/dict'
 export default {
   name: 'ListAlarmNow',
-  // components: { HandlePrompt, infoWell },
   data() {
     return {
       listQuery: {
@@ -102,7 +99,7 @@
         },
         {
           text: '报警内容',
-          value: 'alarmLevel',
+          value: 'alarmContent',
           align: 'center',
           level: true
         },
@@ -137,8 +134,8 @@
           refresh: false // 是否需要刷新按钮
         }
       }, // 表格属性
-      alarmTypeList: [], // 告警类型列表
-      alarmLevelList: [], // 告警等级类型列表
+      alarmTypeList: [], // 报警类型列表
+      alarmLevelList: [], // 报警等级类型列表
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
     }
@@ -148,17 +145,6 @@
       return this.listQuery.alarmType
     }
   },
-  watch: {
-    // 当告警各类型变化时，刷新告警内容列表
-    alarmType(val) {
-      this.listQuery.AlarmLevelType = ''
-      if (val && val !== '') {
-        this.fetchAlarmLevelType()
-      } else {
-        this.alarmLevelList = []
-      }
-    }
-  },
   created() {
     this.fetchAlarmType()
     this.fetchAlarmLevelType()
@@ -175,18 +161,39 @@
   },
   methods: {
     // 取消报警
-    cancelAlarm(jobId) {
-      // this.cancelShow = true
-      // setTimeout(function() {
-      // this.$refs.handlePrompt.initDialog(true, jobId, false)
-      // }, 100)
+    cancel(id) {
+      this.$confirm(
+        '确定要取消报警吗？',
+        '确认操作',
+        {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }
+      ).then(() => {
+        cancelAlarm({id: id}).then(response => {
+          this.$message.success('取消报警成功')
+          this.closeDialog()
+        })
+      })
     },
     // 取消报警,调用结束工单接口
     batchCancel() {
-      // this.cancelShow = true
-      // setTimeout(function() {
-      // this.$refs.handlePrompt.initDialog(true, '', true, this.listQuery)
-      // }, 100)
+      this.$confirm(
+        '确定要取消全部报警吗？',
+        '确认操作',
+        {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }
+      ).then(() => {
+        // 批量消警接口
+        batchCancelAlarm().then(response => {
+          this.$message.success('批量消警成功')
+          this.fetchData(false)
+        })
+      })
     },
     // 批量导出
     batchExport() {
@@ -199,19 +206,11 @@
       })
       batchExportAlarm(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
-        console.log('download===', res)
         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对象
+        const fileName = `实时报警.xlsx`
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
-        this.$message.error(res.message)
       })
     },
     // 查询数据
@@ -225,43 +224,26 @@
         this.listQuery.offset = 1
       }
       this.list = [
-        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124}
+        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124, alarmTime:'2021-07-04 08:33:00'}
       ]
+      this.total = 1
       // getAlarmList(this.listQuery).then(response => {
       //   this.list = response.data.rows
       //   this.total = parseInt(response.data.total)
         this.listLoading = false
       // })
     },
-    // 获取告警类型
+    // 获取报警类型
     fetchAlarmType() {
-      // getDictByCode('alarmType').then(response => {
-        this.alarmTypeList = [
-          {name:'污染物浓度超标', value:'1'},
-          {name:'污染物浓度异常', value:'2'},
-        ]
-        // this.alarmTypeList = response.data
-        // if (!isOperation()) { // 如果不是管理员和运维人员
-        //   this.showAlarmType = false
-        //   this.listQuery.alarmType = '1'
-        // }
-      // })
+      getDictByCode('envAlarmType').then(response => {
+        this.alarmTypeList = response.data
+      })
     },
-    // 获取告警内容类别
+    // 获取报警内容类别
     fetchAlarmLevelType() {
-      this.alarmLevelList = [
-        {name:'一级报警', value:'1'},
-        {name:'二级报警', value:'2'},
-        {name:'三级报警', value:'3'},
-      ]
-      // getDictByCode(alarmLevel).then(response => {
-      //   const supportDeviceTypes = this.$store.getters.deviceTypes
-      //   for (const item of response.data.list) {
-      //     if (supportDeviceTypes.indexOf(item.deviceType) !== -1) {
-      //       this.alarmLevelList.push(item)
-      //     }
-      //   }
-      // })
+      getDictByCode('envAlarmLevel').then(response => {
+        this.alarmLevelList = response.data
+      })
     },
     // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
     changePage(val) {

diff --git a/src/api/environment/alarm.js b/src/api/environment/alarm.js
new file mode 100644
index 0000000..a882719
--- /dev/null
+++ b/src/api/environment/alarm.js
@@ -0,0 +1,41 @@
+/**
+ * 报警接口
+ */
+import request from '@/utils/request'
+import qs from 'qs'
+// 报警列表查询
+export function getAlarmList(params) {
+  return request({
+    url: '/environment/alarm/listPage',
+    method: 'get',
+    params
+  })
+}
+// 单个消警
+export function cancelAlarm(params) {
+  return request({
+    url: '/environment/alarm/cancel',
+    method: 'get',
+    params
+  })
+}
+
+// 批量消警
+export function batchCancelAlarm() {
+  return request({
+    url: '/environment/alarm/batchCancel',
+    method: 'post'
+  })
+}
+
+// 批量导出
+export function batchExportAlarm(params, config) {
+  return request({
+    url: '/environment/alarm/export',
+    method: 'get',
+    timeout: 120000,
+    params,
+    ...config,
+    responseType: 'blob' // 这一步也很关键，一定要加上 responseType 值为 blob
+  })
+}
diff --git a/src/api/system/dict.js b/src/api/system/dict.js
index 444617e..0efe7e3 100644
--- a/src/api/system/dict.js
+++ b/src/api/system/dict.js
@@ -40,8 +40,7 @@
 // 获取字典值列表
 export function getDictByCode(params) {
   return request({
-    url: '/environment/dict/code/'+params,
-    method: 'get',
-    params
+    url: 'dict/code/'+params,
+    method: 'get'
   })
 }
diff --git a/src/components/NormalTable/index.vue b/src/components/NormalTable/index.vue
index 5077bef..6776ddd 100644
--- a/src/components/NormalTable/index.vue
+++ b/src/components/NormalTable/index.vue
@@ -152,7 +152,7 @@
     },
     size: {
       type: String,
-      default: ''
+      default: 'small'
     }, // 表格大小，默认，small,mini等，与el-table条件仙童
     toolsOption: {
       type: Object,
diff --git a/src/router/modules/environment.js b/src/router/modules/environment.js
index 10f1d58..75094ea 100644
--- a/src/router/modules/environment.js
+++ b/src/router/modules/environment.js
@@ -35,7 +35,7 @@
       }, {
         path: '/historyAlarm',
         name: 'historyAlarm',
-        component: () => import('@/views/environment/environmentData'),
+        component: () => import('@/views/alarm/listAlarmHistory'),
         meta: { title: '历史报警', icon: '', permission: ['/environment/alarm/listPage'] }
       }
     ]
@@ -93,7 +93,7 @@
       }, {
         path: '/historyData',
         name: 'HistoryData',
-        component: () => import('@/views/environment/environmentData'),
+        component: () => import('@/views/data/pointData'),
         meta: { title: '历史数据', icon: '', permission: ['/environment/data/historyData'] }
       }
     ]
diff --git a/src/views/alarm/listAlarmHistory.vue b/src/views/alarm/listAlarmHistory.vue
new file mode 100644
index 0000000..2d8b5c9
--- /dev/null
+++ b/src/views/alarm/listAlarmHistory.vue
@@ -0,0 +1,255 @@
+<template>
+  <app-container>
+    <!--筛选条件-->
+    <search-area :need-clear="false" :need-search-more="false" type="seperate" size="small" search-more-type="default" @search="search" >
+        <!--一般查询条件-->
+        <search-item>
+          <el-input v-model.trim="listQuery.keywords" placeholder="设备编号/点位名称" size="small" clearable/>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.alarmType" placeholder="报警类型" size="small" clearable>
+            <el-option
+              v-for="item in alarmTypeList"
+              :key="item.value"
+              :label="item.name"
+              :value="item.value"/>
+          </el-select>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.AlarmLevelType" placeholder="报警等级" size="small" clearable>
+            <el-option
+              v-for="item in alarmLevelList"
+              :key="item.value"
+              :label="item.name"
+              :value="item.value"/>
+          </el-select>
+        </search-item>
+      <search-item>
+        <el-select v-model="listQuery.status" placeholder="报警状态" size="small" clearable>
+          <el-option
+            v-for="item in alarmStatusList"
+            :key="item.value"
+            :label="item.name"
+            :value="item.value"/>
+        </el-select>
+      </search-item>
+        <search-item>
+          <el-date-picker
+            v-model="timeRange"
+            type="datetimerange"
+            range-separator="至"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            start-placeholder="报警开始时间"
+            end-placeholder="报警结束时间" size="small"/>
+        </search-item>
+      </search-area>
+    <!--查询结果Table显示-->
+    <normal-table :data="list" :head="tableOption.head" :query="listQuery" :total="total" :columns="columns" :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption" @change="changePage">
+      <template slot="btns">
+        <el-button v-if="hasPerm('/environment/device/export')" size="small" class="edit_btn" @click="batchExport">导出记录</el-button>
+      </template>
+      <template slot="columns">
+        <el-table-column label="报警状态" align="center" width="90">
+          <template slot-scope="scope">
+            <el-tag v-if="scope.row.status=='2'" type="success" size="small">手动消警</el-tag>
+            <el-tag v-else-if="scope.row.status=='1'" type="danger" size="small">正在报警</el-tag>
+            <el-tag v-else type="info" size="small">自动消警</el-tag>
+          </template>
+        </el-table-column>
+        <!--<el-table-column label="操作" align="center" width="120">-->
+          <!--<template slot-scope="scope">-->
+            <!--<el-button v-if="hasPerm('/environment/device/update')" type="text" size="small" @click.stop="cancel(scope.row.id)">取消报警</el-button>-->
+          <!--</template>-->
+        <!--</el-table-column>-->
+      </template>
+    </normal-table>
+  </app-container>
+</template>
+
+<script>
+import { getAlarmList, batchExportAlarm, cancelAlarm, batchCancelAlarm } from '@/api/environment/alarm'
+import { exportFile } from '@/utils/exportutils'
+import { getDictByCode } from '@/api/system/dict'
+export default {
+  name: 'ListAlarmHistory',
+  data() {
+    return {
+      listQuery: {
+        keywords: '',
+        alarmType: '',
+        AlarmLevelType: '',
+        status: '',
+        beginTime: '',
+        endTime: '',
+        offset: 1,
+        limit: 20,
+        sort: '',
+        order: ''
+      }, // 筛选条件
+      timeRange: [], // 时间范围
+      columns: [
+        {
+          text: '设备编号',
+          value: 'deviceNo',
+          align: 'center'
+        },
+        {
+          text: '点位名称',
+          value: 'deviceName',
+          align: 'center'
+        },
+        {
+          text: '报警类型',
+          value: 'alarmTypeName',
+          align: 'center'
+        },
+        {
+          text: '报警等级',
+          value: 'alarmLevelName',
+          align: 'center',
+          width: 80
+        },
+        {
+          text: '报警内容',
+          value: 'alarmContent',
+          align: 'center',
+          level: true
+        },
+        {
+          text: '报警数值',
+          value: 'alarmValue',
+          width: 80,
+          align: 'center',
+        },
+        {
+          text: '报警时间',
+          value: 'alarmTime',
+          width: 170,
+          align: 'center'
+        }
+      ], // 显示列
+      multipleSelection: [], // 多选选中项
+      list: [], // 列表数据
+      total: 0, // 数据总数
+      tableOption: {
+        head: {
+          show: true, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: true // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      alarmTypeList: [], // 报警类型列表
+      alarmLevelList: [], // 报警等级类型列表
+      alarmStatusList:[], // 报警状态列表
+      listLoading: true, // 加载动画
+      fullscreenLoading: false, // 全屏加载动画
+    }
+  },
+  computed: {
+    alarmType() {
+      return this.listQuery.alarmType
+    }
+  },
+  created() {
+    this.fetchAlarmType()
+    this.fetchAlarmLevelType()
+    this.fetchAlarmStatus()
+    this.fetchData()// 获取数据
+  },
+  activated() {
+    this.listQuery.keywords = ''
+    this.listQuery.alarmType = ''
+    this.listQuery.AlarmLevelType = ''
+    this.listQuery.status = ''
+    this.listQuery.beginTime = ''
+    this.listQuery.endTime = ''
+    this.timeRange = []
+    this.fetchData(false)
+  },
+  methods: {
+    // 批量导出
+    batchExport() {
+      // 全屏加载动画
+      const loading = this.$loading({
+        lock: true,
+        text: '数据处理中,请稍后...',
+        spinner: 'el-icon-loading',
+        background: 'rgba(0, 0, 0, 0.7)'
+      })
+      batchExportAlarm(this.listQuery).then(res => {
+        loading.close() // 关闭加载动画
+        const blob = new Blob([res.data])
+        const fileName = `实时报警.xlsx`
+        exportFile(blob, fileName)
+      }).catch((res) => {
+        loading.close()
+      })
+    },
+    // 查询数据
+    search() {
+      this.fetchData(false)
+    },
+    // 获取数据
+    fetchData(isNowPage = true) {
+      this.listLoading = true
+      if (!isNowPage) { // 是否显示当前页，否则跳转第一页
+        this.listQuery.offset = 1
+      }
+      this.list = [
+        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124, status: '1', alarmTime:'2021-07-04 08:33:00'},
+        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124, status: '2', alarmTime:'2021-07-04 08:33:00'},
+        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124, status: '3', alarmTime:'2021-07-04 08:33:00'}
+      ]
+      this.total = 1
+      // getAlarmList(this.listQuery).then(response => {
+      //   this.list = response.data.rows
+      //   this.total = parseInt(response.data.total)
+        this.listLoading = false
+      // })
+    },
+    // 获取报警类型
+    fetchAlarmType() {
+      getDictByCode('envAlarmType').then(response => {
+        this.alarmTypeList = response.data
+      })
+    },
+    // 获取报警内容类别
+    fetchAlarmLevelType() {
+      getDictByCode('envAlarmLevel').then(response => {
+        this.alarmLevelList = response.data
+      })
+    },
+    // 获取报警内容类别
+    fetchAlarmStatus() {
+      getDictByCode('envAlarmStatus').then(response => {
+        this.alarmStatusList = response.data
+      })
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+  .edit_btns{
+    .edit_btn{
+      float:right;
+      margin:7px 3px;//为了需要居中显示margin-top和bottom要用$tableTitleHeight减去按钮原高度除以2
+    }
+  }
+</style>
diff --git a/src/views/alarm/listAlarmNow.vue b/src/views/alarm/listAlarmNow.vue
index 75133d1..59cdcac 100644
--- a/src/views/alarm/listAlarmNow.vue
+++ b/src/views/alarm/listAlarmNow.vue
@@ -7,7 +7,7 @@
           <el-input v-model.trim="listQuery.keywords" placeholder="设备编号/点位名称" size="small" clearable/>
         </search-item>
         <search-item>
-          <el-select v-model="listQuery.alarmType" placeholder="告警类型" size="small" clearable>
+          <el-select v-model="listQuery.alarmType" placeholder="报警类型" size="small" clearable>
             <el-option
               v-for="item in alarmTypeList"
               :key="item.value"
@@ -16,7 +16,7 @@
           </el-select>
         </search-item>
         <search-item>
-          <el-select v-model="listQuery.AlarmLevelType" placeholder="告警等级" size="small" clearable>
+          <el-select v-model="listQuery.AlarmLevelType" placeholder="报警等级" size="small" clearable>
             <el-option
               v-for="item in alarmLevelList"
               :key="item.value"
@@ -38,7 +38,7 @@
     <normal-table :data="list" :head="tableOption.head" :query="listQuery" :total="total" :columns="columns" :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption" @change="changePage">
       <template slot="btns">
         <el-button v-if="hasPerm('/environment/device/export')" size="small" class="edit_btn" @click="batchExport">导出记录</el-button>
-        <el-button v-if="hasPerm('/environment/device/export')" size="small" class="edit_btn" @click="batchExport">一键消警</el-button>
+        <el-button v-if="hasPerm('/environment/device/export')" size="small" class="edit_btn" @click="batchCancel">一键消警</el-button>
       </template>
       <template slot="preColumns">
         <el-table-column type="selection" width="45" align="center"></el-table-column>
@@ -46,7 +46,7 @@
       <template slot="columns">
         <el-table-column label="操作" align="center" width="120">
           <template slot-scope="scope">
-            <el-button v-if="hasPerm('/environment/device/update')" type="text" size="small" @click.stop="edit(scope.row)">取消报警</el-button>
+            <el-button v-if="hasPerm('/environment/device/update')" type="text" size="small" @click.stop="cancel(scope.row.id)">取消报警</el-button>
           </template>
         </el-table-column>
       </template>
@@ -55,14 +55,11 @@
 </template>
 
 <script>
-// import infoWell from '@/views/wellManage/infoWell'
-// import { getAlarmList, batchExportAlarm, getAlarmType, getAlarmLevelType } from '@/api/alarm'
-// import HandlePrompt from './components/HandlePrompt'
-// import { isOperation } from '@/utils/permission'
-
+import { getAlarmList, batchExportAlarm, cancelAlarm, batchCancelAlarm } from '@/api/environment/alarm'
+import { exportFile } from '@/utils/exportutils'
+import { getDictByCode } from '@/api/system/dict'
 export default {
   name: 'ListAlarmNow',
-  // components: { HandlePrompt, infoWell },
   data() {
     return {
       listQuery: {
@@ -102,7 +99,7 @@
         },
         {
           text: '报警内容',
-          value: 'alarmLevel',
+          value: 'alarmContent',
           align: 'center',
           level: true
         },
@@ -137,8 +134,8 @@
           refresh: false // 是否需要刷新按钮
         }
       }, // 表格属性
-      alarmTypeList: [], // 告警类型列表
-      alarmLevelList: [], // 告警等级类型列表
+      alarmTypeList: [], // 报警类型列表
+      alarmLevelList: [], // 报警等级类型列表
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
     }
@@ -148,17 +145,6 @@
       return this.listQuery.alarmType
     }
   },
-  watch: {
-    // 当告警各类型变化时，刷新告警内容列表
-    alarmType(val) {
-      this.listQuery.AlarmLevelType = ''
-      if (val && val !== '') {
-        this.fetchAlarmLevelType()
-      } else {
-        this.alarmLevelList = []
-      }
-    }
-  },
   created() {
     this.fetchAlarmType()
     this.fetchAlarmLevelType()
@@ -175,18 +161,39 @@
   },
   methods: {
     // 取消报警
-    cancelAlarm(jobId) {
-      // this.cancelShow = true
-      // setTimeout(function() {
-      // this.$refs.handlePrompt.initDialog(true, jobId, false)
-      // }, 100)
+    cancel(id) {
+      this.$confirm(
+        '确定要取消报警吗？',
+        '确认操作',
+        {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }
+      ).then(() => {
+        cancelAlarm({id: id}).then(response => {
+          this.$message.success('取消报警成功')
+          this.closeDialog()
+        })
+      })
     },
     // 取消报警,调用结束工单接口
     batchCancel() {
-      // this.cancelShow = true
-      // setTimeout(function() {
-      // this.$refs.handlePrompt.initDialog(true, '', true, this.listQuery)
-      // }, 100)
+      this.$confirm(
+        '确定要取消全部报警吗？',
+        '确认操作',
+        {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }
+      ).then(() => {
+        // 批量消警接口
+        batchCancelAlarm().then(response => {
+          this.$message.success('批量消警成功')
+          this.fetchData(false)
+        })
+      })
     },
     // 批量导出
     batchExport() {
@@ -199,19 +206,11 @@
       })
       batchExportAlarm(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
-        console.log('download===', res)
         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对象
+        const fileName = `实时报警.xlsx`
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
-        this.$message.error(res.message)
       })
     },
     // 查询数据
@@ -225,43 +224,26 @@
         this.listQuery.offset = 1
       }
       this.list = [
-        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124}
+        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124, alarmTime:'2021-07-04 08:33:00'}
       ]
+      this.total = 1
       // getAlarmList(this.listQuery).then(response => {
       //   this.list = response.data.rows
       //   this.total = parseInt(response.data.total)
         this.listLoading = false
       // })
     },
-    // 获取告警类型
+    // 获取报警类型
     fetchAlarmType() {
-      // getDictByCode('alarmType').then(response => {
-        this.alarmTypeList = [
-          {name:'污染物浓度超标', value:'1'},
-          {name:'污染物浓度异常', value:'2'},
-        ]
-        // this.alarmTypeList = response.data
-        // if (!isOperation()) { // 如果不是管理员和运维人员
-        //   this.showAlarmType = false
-        //   this.listQuery.alarmType = '1'
-        // }
-      // })
+      getDictByCode('envAlarmType').then(response => {
+        this.alarmTypeList = response.data
+      })
     },
-    // 获取告警内容类别
+    // 获取报警内容类别
     fetchAlarmLevelType() {
-      this.alarmLevelList = [
-        {name:'一级报警', value:'1'},
-        {name:'二级报警', value:'2'},
-        {name:'三级报警', value:'3'},
-      ]
-      // getDictByCode(alarmLevel).then(response => {
-      //   const supportDeviceTypes = this.$store.getters.deviceTypes
-      //   for (const item of response.data.list) {
-      //     if (supportDeviceTypes.indexOf(item.deviceType) !== -1) {
-      //       this.alarmLevelList.push(item)
-      //     }
-      //   }
-      // })
+      getDictByCode('envAlarmLevel').then(response => {
+        this.alarmLevelList = response.data
+      })
     },
     // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
     changePage(val) {
diff --git a/src/views/data/allDeviceData.vue b/src/views/data/allDeviceData.vue
index 3a3cf7b..24aeed5 100644
--- a/src/views/data/allDeviceData.vue
+++ b/src/views/data/allDeviceData.vue
@@ -2,6 +2,26 @@
   <app-container>
     <normal-table :data="list" :head="tableOption.head" :query="listQuery" :total="total" :columns="columns" :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption" size="small" @change="changePage">
       <template slot="btns"/>
+      <template slot="preColumns">
+        <el-table-column type="expand">
+          <template slot-scope="props">
+            <el-form label-position="left" inline class="table-expand">
+              <el-form-item label="风速(m/s):">
+                <span>{{ props.row.windSpeed }}</span>
+              </el-form-item>
+              <el-form-item label="风力(级):">
+                <span>{{ props.row.windPower }}</span>
+              </el-form-item>
+              <el-form-item label="风向(°):">
+                <span>{{ props.row.windDirection }}</span>
+              </el-form-item>
+              <el-form-item label="气压(kpa):">
+                <span>{{ props.row.pressure }}</span>
+              </el-form-item>
+            </el-form>
+          </template>
+        </el-table-column>
+      </template>
     </normal-table>
   </app-container>
 </template>
@@ -30,47 +50,47 @@
           value: 'deviceName'
         },
         {
-          text: 'PM2.5',
+          text: 'PM2.5(ug/m³)',
           value: 'pm25'
         },
         {
-          text: 'PM10',
+          text: 'PM10(ug/m³)',
           value: 'pm10'
         },
         {
-          text: 'TSP',
+          text: 'TSP(ug/m³)',
           value: 'tsp'
         },
         {
-          text: '噪声',
+          text: '噪声(db)',
           value: 'noise'
         },
+        // {
+        //   text: '风速(m/s)',
+        //   value: 'windSpeed'
+        // },
+        // {
+        //   text: '风向(°)',
+        //   value: 'windDirection'
+        // },
+        // {
+        //   text: '风力(级)',
+        //   value: 'windPower'
+        // },
         {
-          text: '风速',
-          value: 'windSpeed'
-        },
-        {
-          text: '风向',
-          value: 'windDirection'
-        },
-        {
-          text: '风力',
-          value: 'windPower'
-        },
-        {
-          text: '温度',
+          text: '温度(℃)',
           value: 'temperature'
         },
         {
-          text: '湿度',
+          text: '湿度(%RH)',
           value: 'humidity'
         },
+        // {
+        //   text: '气压(kpa)',
+        //   value: 'pressure'
+        // },
         {
-          text: '气压',
-          value: 'pressure'
-        },
-        {
-          text: '时间',
+          text: '更新时间',
           value: 'ts'
         }
       ], // 显示列
@@ -152,8 +172,30 @@
 }
 </script>
 
-<style scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
   .table-container{
     border-width: 0px !important;
   }
 </style>
+<style rel="stylesheet/scss" lang="scss">
+  .table-container{
+    border-width: 0px !important;
+  }
+  .table-expand{
+    margin-left: 50px;
+    .el-form-item{
+      margin-bottom: 0px;
+      /*margin-right: 20px;*/
+      padding:0px 20px;
+      border-right: 1px solid #EBEEF5;
+      font-size: 12px;
+    }
+    .el-form-item__label{
+      font-size: 12px;
+      color:#909399;
+    }
+    .el-form-item__content{
+      font-size: 12px;
+    }
+  }
+</style>

diff --git a/src/api/environment/alarm.js b/src/api/environment/alarm.js
new file mode 100644
index 0000000..a882719
--- /dev/null
+++ b/src/api/environment/alarm.js
@@ -0,0 +1,41 @@
+/**
+ * 报警接口
+ */
+import request from '@/utils/request'
+import qs from 'qs'
+// 报警列表查询
+export function getAlarmList(params) {
+  return request({
+    url: '/environment/alarm/listPage',
+    method: 'get',
+    params
+  })
+}
+// 单个消警
+export function cancelAlarm(params) {
+  return request({
+    url: '/environment/alarm/cancel',
+    method: 'get',
+    params
+  })
+}
+
+// 批量消警
+export function batchCancelAlarm() {
+  return request({
+    url: '/environment/alarm/batchCancel',
+    method: 'post'
+  })
+}
+
+// 批量导出
+export function batchExportAlarm(params, config) {
+  return request({
+    url: '/environment/alarm/export',
+    method: 'get',
+    timeout: 120000,
+    params,
+    ...config,
+    responseType: 'blob' // 这一步也很关键，一定要加上 responseType 值为 blob
+  })
+}
diff --git a/src/api/system/dict.js b/src/api/system/dict.js
index 444617e..0efe7e3 100644
--- a/src/api/system/dict.js
+++ b/src/api/system/dict.js
@@ -40,8 +40,7 @@
 // 获取字典值列表
 export function getDictByCode(params) {
   return request({
-    url: '/environment/dict/code/'+params,
-    method: 'get',
-    params
+    url: 'dict/code/'+params,
+    method: 'get'
   })
 }
diff --git a/src/components/NormalTable/index.vue b/src/components/NormalTable/index.vue
index 5077bef..6776ddd 100644
--- a/src/components/NormalTable/index.vue
+++ b/src/components/NormalTable/index.vue
@@ -152,7 +152,7 @@
     },
     size: {
       type: String,
-      default: ''
+      default: 'small'
     }, // 表格大小，默认，small,mini等，与el-table条件仙童
     toolsOption: {
       type: Object,
diff --git a/src/router/modules/environment.js b/src/router/modules/environment.js
index 10f1d58..75094ea 100644
--- a/src/router/modules/environment.js
+++ b/src/router/modules/environment.js
@@ -35,7 +35,7 @@
       }, {
         path: '/historyAlarm',
         name: 'historyAlarm',
-        component: () => import('@/views/environment/environmentData'),
+        component: () => import('@/views/alarm/listAlarmHistory'),
         meta: { title: '历史报警', icon: '', permission: ['/environment/alarm/listPage'] }
       }
     ]
@@ -93,7 +93,7 @@
       }, {
         path: '/historyData',
         name: 'HistoryData',
-        component: () => import('@/views/environment/environmentData'),
+        component: () => import('@/views/data/pointData'),
         meta: { title: '历史数据', icon: '', permission: ['/environment/data/historyData'] }
       }
     ]
diff --git a/src/views/alarm/listAlarmHistory.vue b/src/views/alarm/listAlarmHistory.vue
new file mode 100644
index 0000000..2d8b5c9
--- /dev/null
+++ b/src/views/alarm/listAlarmHistory.vue
@@ -0,0 +1,255 @@
+<template>
+  <app-container>
+    <!--筛选条件-->
+    <search-area :need-clear="false" :need-search-more="false" type="seperate" size="small" search-more-type="default" @search="search" >
+        <!--一般查询条件-->
+        <search-item>
+          <el-input v-model.trim="listQuery.keywords" placeholder="设备编号/点位名称" size="small" clearable/>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.alarmType" placeholder="报警类型" size="small" clearable>
+            <el-option
+              v-for="item in alarmTypeList"
+              :key="item.value"
+              :label="item.name"
+              :value="item.value"/>
+          </el-select>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.AlarmLevelType" placeholder="报警等级" size="small" clearable>
+            <el-option
+              v-for="item in alarmLevelList"
+              :key="item.value"
+              :label="item.name"
+              :value="item.value"/>
+          </el-select>
+        </search-item>
+      <search-item>
+        <el-select v-model="listQuery.status" placeholder="报警状态" size="small" clearable>
+          <el-option
+            v-for="item in alarmStatusList"
+            :key="item.value"
+            :label="item.name"
+            :value="item.value"/>
+        </el-select>
+      </search-item>
+        <search-item>
+          <el-date-picker
+            v-model="timeRange"
+            type="datetimerange"
+            range-separator="至"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            start-placeholder="报警开始时间"
+            end-placeholder="报警结束时间" size="small"/>
+        </search-item>
+      </search-area>
+    <!--查询结果Table显示-->
+    <normal-table :data="list" :head="tableOption.head" :query="listQuery" :total="total" :columns="columns" :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption" @change="changePage">
+      <template slot="btns">
+        <el-button v-if="hasPerm('/environment/device/export')" size="small" class="edit_btn" @click="batchExport">导出记录</el-button>
+      </template>
+      <template slot="columns">
+        <el-table-column label="报警状态" align="center" width="90">
+          <template slot-scope="scope">
+            <el-tag v-if="scope.row.status=='2'" type="success" size="small">手动消警</el-tag>
+            <el-tag v-else-if="scope.row.status=='1'" type="danger" size="small">正在报警</el-tag>
+            <el-tag v-else type="info" size="small">自动消警</el-tag>
+          </template>
+        </el-table-column>
+        <!--<el-table-column label="操作" align="center" width="120">-->
+          <!--<template slot-scope="scope">-->
+            <!--<el-button v-if="hasPerm('/environment/device/update')" type="text" size="small" @click.stop="cancel(scope.row.id)">取消报警</el-button>-->
+          <!--</template>-->
+        <!--</el-table-column>-->
+      </template>
+    </normal-table>
+  </app-container>
+</template>
+
+<script>
+import { getAlarmList, batchExportAlarm, cancelAlarm, batchCancelAlarm } from '@/api/environment/alarm'
+import { exportFile } from '@/utils/exportutils'
+import { getDictByCode } from '@/api/system/dict'
+export default {
+  name: 'ListAlarmHistory',
+  data() {
+    return {
+      listQuery: {
+        keywords: '',
+        alarmType: '',
+        AlarmLevelType: '',
+        status: '',
+        beginTime: '',
+        endTime: '',
+        offset: 1,
+        limit: 20,
+        sort: '',
+        order: ''
+      }, // 筛选条件
+      timeRange: [], // 时间范围
+      columns: [
+        {
+          text: '设备编号',
+          value: 'deviceNo',
+          align: 'center'
+        },
+        {
+          text: '点位名称',
+          value: 'deviceName',
+          align: 'center'
+        },
+        {
+          text: '报警类型',
+          value: 'alarmTypeName',
+          align: 'center'
+        },
+        {
+          text: '报警等级',
+          value: 'alarmLevelName',
+          align: 'center',
+          width: 80
+        },
+        {
+          text: '报警内容',
+          value: 'alarmContent',
+          align: 'center',
+          level: true
+        },
+        {
+          text: '报警数值',
+          value: 'alarmValue',
+          width: 80,
+          align: 'center',
+        },
+        {
+          text: '报警时间',
+          value: 'alarmTime',
+          width: 170,
+          align: 'center'
+        }
+      ], // 显示列
+      multipleSelection: [], // 多选选中项
+      list: [], // 列表数据
+      total: 0, // 数据总数
+      tableOption: {
+        head: {
+          show: true, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: true // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      alarmTypeList: [], // 报警类型列表
+      alarmLevelList: [], // 报警等级类型列表
+      alarmStatusList:[], // 报警状态列表
+      listLoading: true, // 加载动画
+      fullscreenLoading: false, // 全屏加载动画
+    }
+  },
+  computed: {
+    alarmType() {
+      return this.listQuery.alarmType
+    }
+  },
+  created() {
+    this.fetchAlarmType()
+    this.fetchAlarmLevelType()
+    this.fetchAlarmStatus()
+    this.fetchData()// 获取数据
+  },
+  activated() {
+    this.listQuery.keywords = ''
+    this.listQuery.alarmType = ''
+    this.listQuery.AlarmLevelType = ''
+    this.listQuery.status = ''
+    this.listQuery.beginTime = ''
+    this.listQuery.endTime = ''
+    this.timeRange = []
+    this.fetchData(false)
+  },
+  methods: {
+    // 批量导出
+    batchExport() {
+      // 全屏加载动画
+      const loading = this.$loading({
+        lock: true,
+        text: '数据处理中,请稍后...',
+        spinner: 'el-icon-loading',
+        background: 'rgba(0, 0, 0, 0.7)'
+      })
+      batchExportAlarm(this.listQuery).then(res => {
+        loading.close() // 关闭加载动画
+        const blob = new Blob([res.data])
+        const fileName = `实时报警.xlsx`
+        exportFile(blob, fileName)
+      }).catch((res) => {
+        loading.close()
+      })
+    },
+    // 查询数据
+    search() {
+      this.fetchData(false)
+    },
+    // 获取数据
+    fetchData(isNowPage = true) {
+      this.listLoading = true
+      if (!isNowPage) { // 是否显示当前页，否则跳转第一页
+        this.listQuery.offset = 1
+      }
+      this.list = [
+        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124, status: '1', alarmTime:'2021-07-04 08:33:00'},
+        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124, status: '2', alarmTime:'2021-07-04 08:33:00'},
+        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124, status: '3', alarmTime:'2021-07-04 08:33:00'}
+      ]
+      this.total = 1
+      // getAlarmList(this.listQuery).then(response => {
+      //   this.list = response.data.rows
+      //   this.total = parseInt(response.data.total)
+        this.listLoading = false
+      // })
+    },
+    // 获取报警类型
+    fetchAlarmType() {
+      getDictByCode('envAlarmType').then(response => {
+        this.alarmTypeList = response.data
+      })
+    },
+    // 获取报警内容类别
+    fetchAlarmLevelType() {
+      getDictByCode('envAlarmLevel').then(response => {
+        this.alarmLevelList = response.data
+      })
+    },
+    // 获取报警内容类别
+    fetchAlarmStatus() {
+      getDictByCode('envAlarmStatus').then(response => {
+        this.alarmStatusList = response.data
+      })
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+  .edit_btns{
+    .edit_btn{
+      float:right;
+      margin:7px 3px;//为了需要居中显示margin-top和bottom要用$tableTitleHeight减去按钮原高度除以2
+    }
+  }
+</style>
diff --git a/src/views/alarm/listAlarmNow.vue b/src/views/alarm/listAlarmNow.vue
index 75133d1..59cdcac 100644
--- a/src/views/alarm/listAlarmNow.vue
+++ b/src/views/alarm/listAlarmNow.vue
@@ -7,7 +7,7 @@
           <el-input v-model.trim="listQuery.keywords" placeholder="设备编号/点位名称" size="small" clearable/>
         </search-item>
         <search-item>
-          <el-select v-model="listQuery.alarmType" placeholder="告警类型" size="small" clearable>
+          <el-select v-model="listQuery.alarmType" placeholder="报警类型" size="small" clearable>
             <el-option
               v-for="item in alarmTypeList"
               :key="item.value"
@@ -16,7 +16,7 @@
           </el-select>
         </search-item>
         <search-item>
-          <el-select v-model="listQuery.AlarmLevelType" placeholder="告警等级" size="small" clearable>
+          <el-select v-model="listQuery.AlarmLevelType" placeholder="报警等级" size="small" clearable>
             <el-option
               v-for="item in alarmLevelList"
               :key="item.value"
@@ -38,7 +38,7 @@
     <normal-table :data="list" :head="tableOption.head" :query="listQuery" :total="total" :columns="columns" :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption" @change="changePage">
       <template slot="btns">
         <el-button v-if="hasPerm('/environment/device/export')" size="small" class="edit_btn" @click="batchExport">导出记录</el-button>
-        <el-button v-if="hasPerm('/environment/device/export')" size="small" class="edit_btn" @click="batchExport">一键消警</el-button>
+        <el-button v-if="hasPerm('/environment/device/export')" size="small" class="edit_btn" @click="batchCancel">一键消警</el-button>
       </template>
       <template slot="preColumns">
         <el-table-column type="selection" width="45" align="center"></el-table-column>
@@ -46,7 +46,7 @@
       <template slot="columns">
         <el-table-column label="操作" align="center" width="120">
           <template slot-scope="scope">
-            <el-button v-if="hasPerm('/environment/device/update')" type="text" size="small" @click.stop="edit(scope.row)">取消报警</el-button>
+            <el-button v-if="hasPerm('/environment/device/update')" type="text" size="small" @click.stop="cancel(scope.row.id)">取消报警</el-button>
           </template>
         </el-table-column>
       </template>
@@ -55,14 +55,11 @@
 </template>
 
 <script>
-// import infoWell from '@/views/wellManage/infoWell'
-// import { getAlarmList, batchExportAlarm, getAlarmType, getAlarmLevelType } from '@/api/alarm'
-// import HandlePrompt from './components/HandlePrompt'
-// import { isOperation } from '@/utils/permission'
-
+import { getAlarmList, batchExportAlarm, cancelAlarm, batchCancelAlarm } from '@/api/environment/alarm'
+import { exportFile } from '@/utils/exportutils'
+import { getDictByCode } from '@/api/system/dict'
 export default {
   name: 'ListAlarmNow',
-  // components: { HandlePrompt, infoWell },
   data() {
     return {
       listQuery: {
@@ -102,7 +99,7 @@
         },
         {
           text: '报警内容',
-          value: 'alarmLevel',
+          value: 'alarmContent',
           align: 'center',
           level: true
         },
@@ -137,8 +134,8 @@
           refresh: false // 是否需要刷新按钮
         }
       }, // 表格属性
-      alarmTypeList: [], // 告警类型列表
-      alarmLevelList: [], // 告警等级类型列表
+      alarmTypeList: [], // 报警类型列表
+      alarmLevelList: [], // 报警等级类型列表
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
     }
@@ -148,17 +145,6 @@
       return this.listQuery.alarmType
     }
   },
-  watch: {
-    // 当告警各类型变化时，刷新告警内容列表
-    alarmType(val) {
-      this.listQuery.AlarmLevelType = ''
-      if (val && val !== '') {
-        this.fetchAlarmLevelType()
-      } else {
-        this.alarmLevelList = []
-      }
-    }
-  },
   created() {
     this.fetchAlarmType()
     this.fetchAlarmLevelType()
@@ -175,18 +161,39 @@
   },
   methods: {
     // 取消报警
-    cancelAlarm(jobId) {
-      // this.cancelShow = true
-      // setTimeout(function() {
-      // this.$refs.handlePrompt.initDialog(true, jobId, false)
-      // }, 100)
+    cancel(id) {
+      this.$confirm(
+        '确定要取消报警吗？',
+        '确认操作',
+        {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }
+      ).then(() => {
+        cancelAlarm({id: id}).then(response => {
+          this.$message.success('取消报警成功')
+          this.closeDialog()
+        })
+      })
     },
     // 取消报警,调用结束工单接口
     batchCancel() {
-      // this.cancelShow = true
-      // setTimeout(function() {
-      // this.$refs.handlePrompt.initDialog(true, '', true, this.listQuery)
-      // }, 100)
+      this.$confirm(
+        '确定要取消全部报警吗？',
+        '确认操作',
+        {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }
+      ).then(() => {
+        // 批量消警接口
+        batchCancelAlarm().then(response => {
+          this.$message.success('批量消警成功')
+          this.fetchData(false)
+        })
+      })
     },
     // 批量导出
     batchExport() {
@@ -199,19 +206,11 @@
       })
       batchExportAlarm(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
-        console.log('download===', res)
         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对象
+        const fileName = `实时报警.xlsx`
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
-        this.$message.error(res.message)
       })
     },
     // 查询数据
@@ -225,43 +224,26 @@
         this.listQuery.offset = 1
       }
       this.list = [
-        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124}
+        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124, alarmTime:'2021-07-04 08:33:00'}
       ]
+      this.total = 1
       // getAlarmList(this.listQuery).then(response => {
       //   this.list = response.data.rows
       //   this.total = parseInt(response.data.total)
         this.listLoading = false
       // })
     },
-    // 获取告警类型
+    // 获取报警类型
     fetchAlarmType() {
-      // getDictByCode('alarmType').then(response => {
-        this.alarmTypeList = [
-          {name:'污染物浓度超标', value:'1'},
-          {name:'污染物浓度异常', value:'2'},
-        ]
-        // this.alarmTypeList = response.data
-        // if (!isOperation()) { // 如果不是管理员和运维人员
-        //   this.showAlarmType = false
-        //   this.listQuery.alarmType = '1'
-        // }
-      // })
+      getDictByCode('envAlarmType').then(response => {
+        this.alarmTypeList = response.data
+      })
     },
-    // 获取告警内容类别
+    // 获取报警内容类别
     fetchAlarmLevelType() {
-      this.alarmLevelList = [
-        {name:'一级报警', value:'1'},
-        {name:'二级报警', value:'2'},
-        {name:'三级报警', value:'3'},
-      ]
-      // getDictByCode(alarmLevel).then(response => {
-      //   const supportDeviceTypes = this.$store.getters.deviceTypes
-      //   for (const item of response.data.list) {
-      //     if (supportDeviceTypes.indexOf(item.deviceType) !== -1) {
-      //       this.alarmLevelList.push(item)
-      //     }
-      //   }
-      // })
+      getDictByCode('envAlarmLevel').then(response => {
+        this.alarmLevelList = response.data
+      })
     },
     // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
     changePage(val) {
diff --git a/src/views/data/allDeviceData.vue b/src/views/data/allDeviceData.vue
index 3a3cf7b..24aeed5 100644
--- a/src/views/data/allDeviceData.vue
+++ b/src/views/data/allDeviceData.vue
@@ -2,6 +2,26 @@
   <app-container>
     <normal-table :data="list" :head="tableOption.head" :query="listQuery" :total="total" :columns="columns" :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption" size="small" @change="changePage">
       <template slot="btns"/>
+      <template slot="preColumns">
+        <el-table-column type="expand">
+          <template slot-scope="props">
+            <el-form label-position="left" inline class="table-expand">
+              <el-form-item label="风速(m/s):">
+                <span>{{ props.row.windSpeed }}</span>
+              </el-form-item>
+              <el-form-item label="风力(级):">
+                <span>{{ props.row.windPower }}</span>
+              </el-form-item>
+              <el-form-item label="风向(°):">
+                <span>{{ props.row.windDirection }}</span>
+              </el-form-item>
+              <el-form-item label="气压(kpa):">
+                <span>{{ props.row.pressure }}</span>
+              </el-form-item>
+            </el-form>
+          </template>
+        </el-table-column>
+      </template>
     </normal-table>
   </app-container>
 </template>
@@ -30,47 +50,47 @@
           value: 'deviceName'
         },
         {
-          text: 'PM2.5',
+          text: 'PM2.5(ug/m³)',
           value: 'pm25'
         },
         {
-          text: 'PM10',
+          text: 'PM10(ug/m³)',
           value: 'pm10'
         },
         {
-          text: 'TSP',
+          text: 'TSP(ug/m³)',
           value: 'tsp'
         },
         {
-          text: '噪声',
+          text: '噪声(db)',
           value: 'noise'
         },
+        // {
+        //   text: '风速(m/s)',
+        //   value: 'windSpeed'
+        // },
+        // {
+        //   text: '风向(°)',
+        //   value: 'windDirection'
+        // },
+        // {
+        //   text: '风力(级)',
+        //   value: 'windPower'
+        // },
         {
-          text: '风速',
-          value: 'windSpeed'
-        },
-        {
-          text: '风向',
-          value: 'windDirection'
-        },
-        {
-          text: '风力',
-          value: 'windPower'
-        },
-        {
-          text: '温度',
+          text: '温度(℃)',
           value: 'temperature'
         },
         {
-          text: '湿度',
+          text: '湿度(%RH)',
           value: 'humidity'
         },
+        // {
+        //   text: '气压(kpa)',
+        //   value: 'pressure'
+        // },
         {
-          text: '气压',
-          value: 'pressure'
-        },
-        {
-          text: '时间',
+          text: '更新时间',
           value: 'ts'
         }
       ], // 显示列
@@ -152,8 +172,30 @@
 }
 </script>
 
-<style scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
   .table-container{
     border-width: 0px !important;
   }
 </style>
+<style rel="stylesheet/scss" lang="scss">
+  .table-container{
+    border-width: 0px !important;
+  }
+  .table-expand{
+    margin-left: 50px;
+    .el-form-item{
+      margin-bottom: 0px;
+      /*margin-right: 20px;*/
+      padding:0px 20px;
+      border-right: 1px solid #EBEEF5;
+      font-size: 12px;
+    }
+    .el-form-item__label{
+      font-size: 12px;
+      color:#909399;
+    }
+    .el-form-item__content{
+      font-size: 12px;
+    }
+  }
+</style>
diff --git a/src/views/data/chooseDevice.vue b/src/views/data/chooseDevice.vue
new file mode 100644
index 0000000..e9e53d5
--- /dev/null
+++ b/src/views/data/chooseDevice.vue
@@ -0,0 +1,61 @@
+<!--选择设备-->
+<template>
+  <el-dialog :title="dialogTitle" :visible.sync="dialogFormVisible" :fullscreen="false" width="60%" append-to-body>
+
+  </el-dialog>
+</template>
+
+<script>
+import { addDevice, updateDevice } from '@/api/environment/device'
+import { Uploadimg } from '@/api/common'
+import { getAreaList, getAreaByDept } from '@/api/system/area'
+import ChoosePointDialog from "../mapViews/choosePointDialog";
+import DeptSelect from "../../components/DeptSelect/index";
+import MapView from "../mapViews/mapView";
+import LMarker from "vue2-leaflet/src/components/LMarker";
+import { icon } from 'leaflet'
+
+export default {
+  name: 'ChooseDevice',
+  components: {LMarker, MapView, DeptSelect, ChoosePointDialog},
+  data() {
+    return {
+      dialogFormVisible: false, // 对话框是否显示
+      currentDevice:null, // 当前选中设备,
+      deviceList:[], // 设备列表
+      dialogTitle: '选择设备', // 表头显示标题
+      dataLoading: false
+    }
+  },
+  methods: {
+    /**
+     * 初始化对话框
+     */
+    initDialog: function(currentDevice) {
+      this.dialogFormVisible = true
+      this.fetchData()
+    },
+    // 查询所有设备列表
+    fetchRealData(){
+      this.dataLoading = true
+      // TODO: 请求数据
+      this.deviceList= [
+        {id:"1", deviceNo:"2021030803100001", deviceName:"王泥岭", area:'崇仁县', online:'1', deptName:"城管局", areaCode:'361024', lat:27.77740600, lng:116.05673800, notes:"无", position:"王泥岭", ts:"2021-01-12", deptid:'24', installDate:"2021-07-01"},
+        {id:"2", deviceNo:"2021030803100002", deviceName:"王泥岭", area:'崇仁县', online:'1', deptName:"城管局", areaCode:'361024', lat:27.77740600, lng:116.05673800, notes:"无", position:"王泥岭", ts:"2021-01-12", deptid:'24', installDate:"2021-07-01"},
+        {id:"3", deviceNo:"2021030803100003", deviceName:"王泥岭", area:'崇仁县', online:'1', deptName:"城管局", areaCode:'361024', lat:27.77740600, lng:116.05673800, notes:"无", position:"王泥岭", ts:"2021-01-12", deptid:'24', installDate:"2021-07-01"},
+        {id:"4", deviceNo:"2021030803100004", deviceName:"王泥岭", area:'崇仁县', online:'1', deptName:"城管局", areaCode:'361024', lat:27.77740600, lng:116.05673800, notes:"无", position:"王泥岭", ts:"2021-01-12", deptid:'24', installDate:"2021-07-01"},
+        {id:"5", deviceNo:"2021030803100005", deviceName:"王泥岭", area:'崇仁县', online:'2', deptName:"城管局", areaCode:'361024', lat:27.77740600, lng:116.05673800, notes:"无", position:"王泥岭", ts:"2021-01-12", deptid:'24', installDate:"2021-07-01"},
+        {id:"6", deviceNo:"2021030803100006", deviceName:"王泥岭", area:'崇仁县', online:'2', deptName:"城管局", areaCode:'361024', lat:27.77740600, lng:116.05673800, notes:"无", position:"王泥岭", ts:"2021-01-12", deptid:'24', installDate:"2021-07-01"}
+      ]
+      this.dataLoading = false
+    },
+    cancel: function() {
+      this.dialogFormVisible = false
+      this.$emit('watchChild')
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+</style>

diff --git a/src/api/environment/alarm.js b/src/api/environment/alarm.js
new file mode 100644
index 0000000..a882719
--- /dev/null
+++ b/src/api/environment/alarm.js
@@ -0,0 +1,41 @@
+/**
+ * 报警接口
+ */
+import request from '@/utils/request'
+import qs from 'qs'
+// 报警列表查询
+export function getAlarmList(params) {
+  return request({
+    url: '/environment/alarm/listPage',
+    method: 'get',
+    params
+  })
+}
+// 单个消警
+export function cancelAlarm(params) {
+  return request({
+    url: '/environment/alarm/cancel',
+    method: 'get',
+    params
+  })
+}
+
+// 批量消警
+export function batchCancelAlarm() {
+  return request({
+    url: '/environment/alarm/batchCancel',
+    method: 'post'
+  })
+}
+
+// 批量导出
+export function batchExportAlarm(params, config) {
+  return request({
+    url: '/environment/alarm/export',
+    method: 'get',
+    timeout: 120000,
+    params,
+    ...config,
+    responseType: 'blob' // 这一步也很关键，一定要加上 responseType 值为 blob
+  })
+}
diff --git a/src/api/system/dict.js b/src/api/system/dict.js
index 444617e..0efe7e3 100644
--- a/src/api/system/dict.js
+++ b/src/api/system/dict.js
@@ -40,8 +40,7 @@
 // 获取字典值列表
 export function getDictByCode(params) {
   return request({
-    url: '/environment/dict/code/'+params,
-    method: 'get',
-    params
+    url: 'dict/code/'+params,
+    method: 'get'
   })
 }
diff --git a/src/components/NormalTable/index.vue b/src/components/NormalTable/index.vue
index 5077bef..6776ddd 100644
--- a/src/components/NormalTable/index.vue
+++ b/src/components/NormalTable/index.vue
@@ -152,7 +152,7 @@
     },
     size: {
       type: String,
-      default: ''
+      default: 'small'
     }, // 表格大小，默认，small,mini等，与el-table条件仙童
     toolsOption: {
       type: Object,
diff --git a/src/router/modules/environment.js b/src/router/modules/environment.js
index 10f1d58..75094ea 100644
--- a/src/router/modules/environment.js
+++ b/src/router/modules/environment.js
@@ -35,7 +35,7 @@
       }, {
         path: '/historyAlarm',
         name: 'historyAlarm',
-        component: () => import('@/views/environment/environmentData'),
+        component: () => import('@/views/alarm/listAlarmHistory'),
         meta: { title: '历史报警', icon: '', permission: ['/environment/alarm/listPage'] }
       }
     ]
@@ -93,7 +93,7 @@
       }, {
         path: '/historyData',
         name: 'HistoryData',
-        component: () => import('@/views/environment/environmentData'),
+        component: () => import('@/views/data/pointData'),
         meta: { title: '历史数据', icon: '', permission: ['/environment/data/historyData'] }
       }
     ]
diff --git a/src/views/alarm/listAlarmHistory.vue b/src/views/alarm/listAlarmHistory.vue
new file mode 100644
index 0000000..2d8b5c9
--- /dev/null
+++ b/src/views/alarm/listAlarmHistory.vue
@@ -0,0 +1,255 @@
+<template>
+  <app-container>
+    <!--筛选条件-->
+    <search-area :need-clear="false" :need-search-more="false" type="seperate" size="small" search-more-type="default" @search="search" >
+        <!--一般查询条件-->
+        <search-item>
+          <el-input v-model.trim="listQuery.keywords" placeholder="设备编号/点位名称" size="small" clearable/>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.alarmType" placeholder="报警类型" size="small" clearable>
+            <el-option
+              v-for="item in alarmTypeList"
+              :key="item.value"
+              :label="item.name"
+              :value="item.value"/>
+          </el-select>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.AlarmLevelType" placeholder="报警等级" size="small" clearable>
+            <el-option
+              v-for="item in alarmLevelList"
+              :key="item.value"
+              :label="item.name"
+              :value="item.value"/>
+          </el-select>
+        </search-item>
+      <search-item>
+        <el-select v-model="listQuery.status" placeholder="报警状态" size="small" clearable>
+          <el-option
+            v-for="item in alarmStatusList"
+            :key="item.value"
+            :label="item.name"
+            :value="item.value"/>
+        </el-select>
+      </search-item>
+        <search-item>
+          <el-date-picker
+            v-model="timeRange"
+            type="datetimerange"
+            range-separator="至"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            start-placeholder="报警开始时间"
+            end-placeholder="报警结束时间" size="small"/>
+        </search-item>
+      </search-area>
+    <!--查询结果Table显示-->
+    <normal-table :data="list" :head="tableOption.head" :query="listQuery" :total="total" :columns="columns" :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption" @change="changePage">
+      <template slot="btns">
+        <el-button v-if="hasPerm('/environment/device/export')" size="small" class="edit_btn" @click="batchExport">导出记录</el-button>
+      </template>
+      <template slot="columns">
+        <el-table-column label="报警状态" align="center" width="90">
+          <template slot-scope="scope">
+            <el-tag v-if="scope.row.status=='2'" type="success" size="small">手动消警</el-tag>
+            <el-tag v-else-if="scope.row.status=='1'" type="danger" size="small">正在报警</el-tag>
+            <el-tag v-else type="info" size="small">自动消警</el-tag>
+          </template>
+        </el-table-column>
+        <!--<el-table-column label="操作" align="center" width="120">-->
+          <!--<template slot-scope="scope">-->
+            <!--<el-button v-if="hasPerm('/environment/device/update')" type="text" size="small" @click.stop="cancel(scope.row.id)">取消报警</el-button>-->
+          <!--</template>-->
+        <!--</el-table-column>-->
+      </template>
+    </normal-table>
+  </app-container>
+</template>
+
+<script>
+import { getAlarmList, batchExportAlarm, cancelAlarm, batchCancelAlarm } from '@/api/environment/alarm'
+import { exportFile } from '@/utils/exportutils'
+import { getDictByCode } from '@/api/system/dict'
+export default {
+  name: 'ListAlarmHistory',
+  data() {
+    return {
+      listQuery: {
+        keywords: '',
+        alarmType: '',
+        AlarmLevelType: '',
+        status: '',
+        beginTime: '',
+        endTime: '',
+        offset: 1,
+        limit: 20,
+        sort: '',
+        order: ''
+      }, // 筛选条件
+      timeRange: [], // 时间范围
+      columns: [
+        {
+          text: '设备编号',
+          value: 'deviceNo',
+          align: 'center'
+        },
+        {
+          text: '点位名称',
+          value: 'deviceName',
+          align: 'center'
+        },
+        {
+          text: '报警类型',
+          value: 'alarmTypeName',
+          align: 'center'
+        },
+        {
+          text: '报警等级',
+          value: 'alarmLevelName',
+          align: 'center',
+          width: 80
+        },
+        {
+          text: '报警内容',
+          value: 'alarmContent',
+          align: 'center',
+          level: true
+        },
+        {
+          text: '报警数值',
+          value: 'alarmValue',
+          width: 80,
+          align: 'center',
+        },
+        {
+          text: '报警时间',
+          value: 'alarmTime',
+          width: 170,
+          align: 'center'
+        }
+      ], // 显示列
+      multipleSelection: [], // 多选选中项
+      list: [], // 列表数据
+      total: 0, // 数据总数
+      tableOption: {
+        head: {
+          show: true, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: true // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      alarmTypeList: [], // 报警类型列表
+      alarmLevelList: [], // 报警等级类型列表
+      alarmStatusList:[], // 报警状态列表
+      listLoading: true, // 加载动画
+      fullscreenLoading: false, // 全屏加载动画
+    }
+  },
+  computed: {
+    alarmType() {
+      return this.listQuery.alarmType
+    }
+  },
+  created() {
+    this.fetchAlarmType()
+    this.fetchAlarmLevelType()
+    this.fetchAlarmStatus()
+    this.fetchData()// 获取数据
+  },
+  activated() {
+    this.listQuery.keywords = ''
+    this.listQuery.alarmType = ''
+    this.listQuery.AlarmLevelType = ''
+    this.listQuery.status = ''
+    this.listQuery.beginTime = ''
+    this.listQuery.endTime = ''
+    this.timeRange = []
+    this.fetchData(false)
+  },
+  methods: {
+    // 批量导出
+    batchExport() {
+      // 全屏加载动画
+      const loading = this.$loading({
+        lock: true,
+        text: '数据处理中,请稍后...',
+        spinner: 'el-icon-loading',
+        background: 'rgba(0, 0, 0, 0.7)'
+      })
+      batchExportAlarm(this.listQuery).then(res => {
+        loading.close() // 关闭加载动画
+        const blob = new Blob([res.data])
+        const fileName = `实时报警.xlsx`
+        exportFile(blob, fileName)
+      }).catch((res) => {
+        loading.close()
+      })
+    },
+    // 查询数据
+    search() {
+      this.fetchData(false)
+    },
+    // 获取数据
+    fetchData(isNowPage = true) {
+      this.listLoading = true
+      if (!isNowPage) { // 是否显示当前页，否则跳转第一页
+        this.listQuery.offset = 1
+      }
+      this.list = [
+        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124, status: '1', alarmTime:'2021-07-04 08:33:00'},
+        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124, status: '2', alarmTime:'2021-07-04 08:33:00'},
+        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124, status: '3', alarmTime:'2021-07-04 08:33:00'}
+      ]
+      this.total = 1
+      // getAlarmList(this.listQuery).then(response => {
+      //   this.list = response.data.rows
+      //   this.total = parseInt(response.data.total)
+        this.listLoading = false
+      // })
+    },
+    // 获取报警类型
+    fetchAlarmType() {
+      getDictByCode('envAlarmType').then(response => {
+        this.alarmTypeList = response.data
+      })
+    },
+    // 获取报警内容类别
+    fetchAlarmLevelType() {
+      getDictByCode('envAlarmLevel').then(response => {
+        this.alarmLevelList = response.data
+      })
+    },
+    // 获取报警内容类别
+    fetchAlarmStatus() {
+      getDictByCode('envAlarmStatus').then(response => {
+        this.alarmStatusList = response.data
+      })
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+  .edit_btns{
+    .edit_btn{
+      float:right;
+      margin:7px 3px;//为了需要居中显示margin-top和bottom要用$tableTitleHeight减去按钮原高度除以2
+    }
+  }
+</style>
diff --git a/src/views/alarm/listAlarmNow.vue b/src/views/alarm/listAlarmNow.vue
index 75133d1..59cdcac 100644
--- a/src/views/alarm/listAlarmNow.vue
+++ b/src/views/alarm/listAlarmNow.vue
@@ -7,7 +7,7 @@
           <el-input v-model.trim="listQuery.keywords" placeholder="设备编号/点位名称" size="small" clearable/>
         </search-item>
         <search-item>
-          <el-select v-model="listQuery.alarmType" placeholder="告警类型" size="small" clearable>
+          <el-select v-model="listQuery.alarmType" placeholder="报警类型" size="small" clearable>
             <el-option
               v-for="item in alarmTypeList"
               :key="item.value"
@@ -16,7 +16,7 @@
           </el-select>
         </search-item>
         <search-item>
-          <el-select v-model="listQuery.AlarmLevelType" placeholder="告警等级" size="small" clearable>
+          <el-select v-model="listQuery.AlarmLevelType" placeholder="报警等级" size="small" clearable>
             <el-option
               v-for="item in alarmLevelList"
               :key="item.value"
@@ -38,7 +38,7 @@
     <normal-table :data="list" :head="tableOption.head" :query="listQuery" :total="total" :columns="columns" :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption" @change="changePage">
       <template slot="btns">
         <el-button v-if="hasPerm('/environment/device/export')" size="small" class="edit_btn" @click="batchExport">导出记录</el-button>
-        <el-button v-if="hasPerm('/environment/device/export')" size="small" class="edit_btn" @click="batchExport">一键消警</el-button>
+        <el-button v-if="hasPerm('/environment/device/export')" size="small" class="edit_btn" @click="batchCancel">一键消警</el-button>
       </template>
       <template slot="preColumns">
         <el-table-column type="selection" width="45" align="center"></el-table-column>
@@ -46,7 +46,7 @@
       <template slot="columns">
         <el-table-column label="操作" align="center" width="120">
           <template slot-scope="scope">
-            <el-button v-if="hasPerm('/environment/device/update')" type="text" size="small" @click.stop="edit(scope.row)">取消报警</el-button>
+            <el-button v-if="hasPerm('/environment/device/update')" type="text" size="small" @click.stop="cancel(scope.row.id)">取消报警</el-button>
           </template>
         </el-table-column>
       </template>
@@ -55,14 +55,11 @@
 </template>
 
 <script>
-// import infoWell from '@/views/wellManage/infoWell'
-// import { getAlarmList, batchExportAlarm, getAlarmType, getAlarmLevelType } from '@/api/alarm'
-// import HandlePrompt from './components/HandlePrompt'
-// import { isOperation } from '@/utils/permission'
-
+import { getAlarmList, batchExportAlarm, cancelAlarm, batchCancelAlarm } from '@/api/environment/alarm'
+import { exportFile } from '@/utils/exportutils'
+import { getDictByCode } from '@/api/system/dict'
 export default {
   name: 'ListAlarmNow',
-  // components: { HandlePrompt, infoWell },
   data() {
     return {
       listQuery: {
@@ -102,7 +99,7 @@
         },
         {
           text: '报警内容',
-          value: 'alarmLevel',
+          value: 'alarmContent',
           align: 'center',
           level: true
         },
@@ -137,8 +134,8 @@
           refresh: false // 是否需要刷新按钮
         }
       }, // 表格属性
-      alarmTypeList: [], // 告警类型列表
-      alarmLevelList: [], // 告警等级类型列表
+      alarmTypeList: [], // 报警类型列表
+      alarmLevelList: [], // 报警等级类型列表
       listLoading: true, // 加载动画
       fullscreenLoading: false, // 全屏加载动画
     }
@@ -148,17 +145,6 @@
       return this.listQuery.alarmType
     }
   },
-  watch: {
-    // 当告警各类型变化时，刷新告警内容列表
-    alarmType(val) {
-      this.listQuery.AlarmLevelType = ''
-      if (val && val !== '') {
-        this.fetchAlarmLevelType()
-      } else {
-        this.alarmLevelList = []
-      }
-    }
-  },
   created() {
     this.fetchAlarmType()
     this.fetchAlarmLevelType()
@@ -175,18 +161,39 @@
   },
   methods: {
     // 取消报警
-    cancelAlarm(jobId) {
-      // this.cancelShow = true
-      // setTimeout(function() {
-      // this.$refs.handlePrompt.initDialog(true, jobId, false)
-      // }, 100)
+    cancel(id) {
+      this.$confirm(
+        '确定要取消报警吗？',
+        '确认操作',
+        {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }
+      ).then(() => {
+        cancelAlarm({id: id}).then(response => {
+          this.$message.success('取消报警成功')
+          this.closeDialog()
+        })
+      })
     },
     // 取消报警,调用结束工单接口
     batchCancel() {
-      // this.cancelShow = true
-      // setTimeout(function() {
-      // this.$refs.handlePrompt.initDialog(true, '', true, this.listQuery)
-      // }, 100)
+      this.$confirm(
+        '确定要取消全部报警吗？',
+        '确认操作',
+        {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }
+      ).then(() => {
+        // 批量消警接口
+        batchCancelAlarm().then(response => {
+          this.$message.success('批量消警成功')
+          this.fetchData(false)
+        })
+      })
     },
     // 批量导出
     batchExport() {
@@ -199,19 +206,11 @@
       })
       batchExportAlarm(this.listQuery).then(res => {
         loading.close() // 关闭加载动画
-        console.log('download===', res)
         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对象
+        const fileName = `实时报警.xlsx`
+        exportFile(blob, fileName)
       }).catch((res) => {
         loading.close()
-        this.$message.error(res.message)
       })
     },
     // 查询数据
@@ -225,43 +224,26 @@
         this.listQuery.offset = 1
       }
       this.list = [
-        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124}
+        {deviceNo:'2021030803100001', deviceName:'王泥岭',position:'王泥岭XXX', alarmLevelName:'一级报警', alarmTypeName:'污染物浓度超限',alarmContent:'PM2.5超标', alarmValue:124, alarmTime:'2021-07-04 08:33:00'}
       ]
+      this.total = 1
       // getAlarmList(this.listQuery).then(response => {
       //   this.list = response.data.rows
       //   this.total = parseInt(response.data.total)
         this.listLoading = false
       // })
     },
-    // 获取告警类型
+    // 获取报警类型
     fetchAlarmType() {
-      // getDictByCode('alarmType').then(response => {
-        this.alarmTypeList = [
-          {name:'污染物浓度超标', value:'1'},
-          {name:'污染物浓度异常', value:'2'},
-        ]
-        // this.alarmTypeList = response.data
-        // if (!isOperation()) { // 如果不是管理员和运维人员
-        //   this.showAlarmType = false
-        //   this.listQuery.alarmType = '1'
-        // }
-      // })
+      getDictByCode('envAlarmType').then(response => {
+        this.alarmTypeList = response.data
+      })
     },
-    // 获取告警内容类别
+    // 获取报警内容类别
     fetchAlarmLevelType() {
-      this.alarmLevelList = [
-        {name:'一级报警', value:'1'},
-        {name:'二级报警', value:'2'},
-        {name:'三级报警', value:'3'},
-      ]
-      // getDictByCode(alarmLevel).then(response => {
-      //   const supportDeviceTypes = this.$store.getters.deviceTypes
-      //   for (const item of response.data.list) {
-      //     if (supportDeviceTypes.indexOf(item.deviceType) !== -1) {
-      //       this.alarmLevelList.push(item)
-      //     }
-      //   }
-      // })
+      getDictByCode('envAlarmLevel').then(response => {
+        this.alarmLevelList = response.data
+      })
     },
     // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
     changePage(val) {
diff --git a/src/views/data/allDeviceData.vue b/src/views/data/allDeviceData.vue
index 3a3cf7b..24aeed5 100644
--- a/src/views/data/allDeviceData.vue
+++ b/src/views/data/allDeviceData.vue
@@ -2,6 +2,26 @@
   <app-container>
     <normal-table :data="list" :head="tableOption.head" :query="listQuery" :total="total" :columns="columns" :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption" size="small" @change="changePage">
       <template slot="btns"/>
+      <template slot="preColumns">
+        <el-table-column type="expand">
+          <template slot-scope="props">
+            <el-form label-position="left" inline class="table-expand">
+              <el-form-item label="风速(m/s):">
+                <span>{{ props.row.windSpeed }}</span>
+              </el-form-item>
+              <el-form-item label="风力(级):">
+                <span>{{ props.row.windPower }}</span>
+              </el-form-item>
+              <el-form-item label="风向(°):">
+                <span>{{ props.row.windDirection }}</span>
+              </el-form-item>
+              <el-form-item label="气压(kpa):">
+                <span>{{ props.row.pressure }}</span>
+              </el-form-item>
+            </el-form>
+          </template>
+        </el-table-column>
+      </template>
     </normal-table>
   </app-container>
 </template>
@@ -30,47 +50,47 @@
           value: 'deviceName'
         },
         {
-          text: 'PM2.5',
+          text: 'PM2.5(ug/m³)',
           value: 'pm25'
         },
         {
-          text: 'PM10',
+          text: 'PM10(ug/m³)',
           value: 'pm10'
         },
         {
-          text: 'TSP',
+          text: 'TSP(ug/m³)',
           value: 'tsp'
         },
         {
-          text: '噪声',
+          text: '噪声(db)',
           value: 'noise'
         },
+        // {
+        //   text: '风速(m/s)',
+        //   value: 'windSpeed'
+        // },
+        // {
+        //   text: '风向(°)',
+        //   value: 'windDirection'
+        // },
+        // {
+        //   text: '风力(级)',
+        //   value: 'windPower'
+        // },
         {
-          text: '风速',
-          value: 'windSpeed'
-        },
-        {
-          text: '风向',
-          value: 'windDirection'
-        },
-        {
-          text: '风力',
-          value: 'windPower'
-        },
-        {
-          text: '温度',
+          text: '温度(℃)',
           value: 'temperature'
         },
         {
-          text: '湿度',
+          text: '湿度(%RH)',
           value: 'humidity'
         },
+        // {
+        //   text: '气压(kpa)',
+        //   value: 'pressure'
+        // },
         {
-          text: '气压',
-          value: 'pressure'
-        },
-        {
-          text: '时间',
+          text: '更新时间',
           value: 'ts'
         }
       ], // 显示列
@@ -152,8 +172,30 @@
 }
 </script>
 
-<style scoped>
+<style rel="stylesheet/scss" lang="scss" scoped>
   .table-container{
     border-width: 0px !important;
   }
 </style>
+<style rel="stylesheet/scss" lang="scss">
+  .table-container{
+    border-width: 0px !important;
+  }
+  .table-expand{
+    margin-left: 50px;
+    .el-form-item{
+      margin-bottom: 0px;
+      /*margin-right: 20px;*/
+      padding:0px 20px;
+      border-right: 1px solid #EBEEF5;
+      font-size: 12px;
+    }
+    .el-form-item__label{
+      font-size: 12px;
+      color:#909399;
+    }
+    .el-form-item__content{
+      font-size: 12px;
+    }
+  }
+</style>
diff --git a/src/views/data/chooseDevice.vue b/src/views/data/chooseDevice.vue
new file mode 100644
index 0000000..e9e53d5
--- /dev/null
+++ b/src/views/data/chooseDevice.vue
@@ -0,0 +1,61 @@
+<!--选择设备-->
+<template>
+  <el-dialog :title="dialogTitle" :visible.sync="dialogFormVisible" :fullscreen="false" width="60%" append-to-body>
+
+  </el-dialog>
+</template>
+
+<script>
+import { addDevice, updateDevice } from '@/api/environment/device'
+import { Uploadimg } from '@/api/common'
+import { getAreaList, getAreaByDept } from '@/api/system/area'
+import ChoosePointDialog from "../mapViews/choosePointDialog";
+import DeptSelect from "../../components/DeptSelect/index";
+import MapView from "../mapViews/mapView";
+import LMarker from "vue2-leaflet/src/components/LMarker";
+import { icon } from 'leaflet'
+
+export default {
+  name: 'ChooseDevice',
+  components: {LMarker, MapView, DeptSelect, ChoosePointDialog},
+  data() {
+    return {
+      dialogFormVisible: false, // 对话框是否显示
+      currentDevice:null, // 当前选中设备,
+      deviceList:[], // 设备列表
+      dialogTitle: '选择设备', // 表头显示标题
+      dataLoading: false
+    }
+  },
+  methods: {
+    /**
+     * 初始化对话框
+     */
+    initDialog: function(currentDevice) {
+      this.dialogFormVisible = true
+      this.fetchData()
+    },
+    // 查询所有设备列表
+    fetchRealData(){
+      this.dataLoading = true
+      // TODO: 请求数据
+      this.deviceList= [
+        {id:"1", deviceNo:"2021030803100001", deviceName:"王泥岭", area:'崇仁县', online:'1', deptName:"城管局", areaCode:'361024', lat:27.77740600, lng:116.05673800, notes:"无", position:"王泥岭", ts:"2021-01-12", deptid:'24', installDate:"2021-07-01"},
+        {id:"2", deviceNo:"2021030803100002", deviceName:"王泥岭", area:'崇仁县', online:'1', deptName:"城管局", areaCode:'361024', lat:27.77740600, lng:116.05673800, notes:"无", position:"王泥岭", ts:"2021-01-12", deptid:'24', installDate:"2021-07-01"},
+        {id:"3", deviceNo:"2021030803100003", deviceName:"王泥岭", area:'崇仁县', online:'1', deptName:"城管局", areaCode:'361024', lat:27.77740600, lng:116.05673800, notes:"无", position:"王泥岭", ts:"2021-01-12", deptid:'24', installDate:"2021-07-01"},
+        {id:"4", deviceNo:"2021030803100004", deviceName:"王泥岭", area:'崇仁县', online:'1', deptName:"城管局", areaCode:'361024', lat:27.77740600, lng:116.05673800, notes:"无", position:"王泥岭", ts:"2021-01-12", deptid:'24', installDate:"2021-07-01"},
+        {id:"5", deviceNo:"2021030803100005", deviceName:"王泥岭", area:'崇仁县', online:'2', deptName:"城管局", areaCode:'361024', lat:27.77740600, lng:116.05673800, notes:"无", position:"王泥岭", ts:"2021-01-12", deptid:'24', installDate:"2021-07-01"},
+        {id:"6", deviceNo:"2021030803100006", deviceName:"王泥岭", area:'崇仁县', online:'2', deptName:"城管局", areaCode:'361024', lat:27.77740600, lng:116.05673800, notes:"无", position:"王泥岭", ts:"2021-01-12", deptid:'24', installDate:"2021-07-01"}
+      ]
+      this.dataLoading = false
+    },
+    cancel: function() {
+      this.dialogFormVisible = false
+      this.$emit('watchChild')
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+</style>
diff --git a/src/views/data/pointData.vue b/src/views/data/pointData.vue
index 9ed8a09..cd7edac 100644
--- a/src/views/data/pointData.vue
+++ b/src/views/data/pointData.vue
@@ -1,170 +1,269 @@
 <template>
   <app-container>
-    <search-area :need-clear="false" :need-search-more="false" type="seperate" size="small" search-more-type="default" @search="fetchData" @clear="clearInput">
+    <div class="choose-device">
+      <el-button type="primary" size="small">选择设备</el-button>
+      <span class="detail"><span class="title">设备编号：</span>{{currentDevice.deviceNo}}</span>
+      <span class="detail"><span class="title">安装点位：</span>{{currentDevice.deviceName}}</span>
+      <span class="detail"><span class="title">地址：</span>{{currentDevice.position}}</span>
+    </div>
+    <search-area :need-clear="false" :need-search-more="false" type="seperate" size="small" search-more-type="default"
+                 @search="fetchData" @clear="clearInput">
       <!--一般查询条件-->
       <search-item>
-        <el-input v-model.trim="listQuery.keywords" size="small" placeholder="请输入关键字" clearable/>
+        <el-radio-group v-model="listQuery.searchType" size="small">
+          <el-radio-button v-for="item of searchTypes" :label="item.value">{{item.name}}</el-radio-button>
+        </el-radio-group>
+      </search-item>
+      <search-item>
+        <el-date-picker
+          v-model="timeRange"
+          size="small"
+          type="datetimerange"
+          range-separator="至"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          start-placeholder="开始时间"
+          end-placeholder="结束时间"/>
+      </search-item>
+      <search-item>
+        <el-select v-model="listQuery.params" placeholder="参数选择" size="small" multiple collapse-tags clearable>
+          <el-option
+            v-for="item in paramsList"
+            :key="item.value"
+            :label="item.name"
+            :value="item.value"/>
+        </el-select>
       </search-item>
     </search-area>
-    <normal-table :data="list" :head="tableOption.head" :query="listQuery" :total="total" :columns="columns" :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption" size="small" @change="changePage">
+
+    <div class="data-container">
+      <div class="title-header">
+        <i class="el-icon-menu"/>
+        历史数据
+      </div>
+      <div class="edit_btns">
+        <el-button type="primary" size="small">导出数据</el-button>
+      </div>
+    </div>
+    <div style="padding:12px;">
+      <ve-line :data="chartData" :settings="chartSettings"/>
+    </div>
+
+    <!--<el-row style="height: 12px;background-color: #ebebeb"/>-->
+    <!--<div style="padding: 10px 10px 0px 10px">-->
+      <!--<el-tabs v-model="activeName" type="card" @tab-click="lineSearch">-->
+        <!--<el-tab-pane-->
+          <!--v-for="(item, index) in tabs"-->
+          <!--:key="item.name"-->
+          <!--:label="item.title"-->
+          <!--:name="item.name"/>-->
+      <!--</el-tabs>-->
+    <!--</div>-->
+
+    <normal-table :data="list" :head="tableOption.head" :query="listQuery" :total="total" :columns="columns"
+                  :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption"
+                  size="small" @change="changePage">
       <template slot="btns"/>
-      <template slot="columns">
-        <el-table-column label="历史数据" align="center" width="140">
-          <template slot-scope="scope">
-            <el-button type="text" size="small" @click.stop="goDetail(scope.row)">历史数据</el-button>
-          </template>
-        </el-table-column>
-      </template>
     </normal-table>
   </app-container>
 </template>
 
 <script>
-export default {
-  name: 'EnvironmentPoint',
-  components: { },
-  data() {
-    return {
-      listQuery: {
-        keywords: '',
-        offset: 1,
-        limit: 20
-      }, // 筛选条件
-      columns: [
-        {
-          text: '名称',
-          value: 'name',
-          align: 'center'
+  import {getToday} from '@/utils/dateutils'
+  import ElSlPanel from "element-ui/packages/color-picker/src/components/sv-panel";
+
+  export default {
+    name: 'PointData',
+    components: {ElSlPanel, getToday},
+    data() {
+      return {
+        deviceList: [], //所有设备列表
+        currentDevice: {
+          id: "1",
+          deviceNo: "2021030803100001",
+          deviceName: "王泥岭",
+          area: '崇仁县',
+          online: '1',
+          deptName: "城管局",
+          areaCode: '361024',
+          lat: 27.77740600,
+          lng: 116.05673800,
+          notes: "无",
+          position: "王泥岭",
+          ts: "2021-01-12",
+          deptid: '24',
+          installDate: "2021-07-01"
+
+        },// 当前设备
+        searchTypes:[
+          {name:'分钟平均值', value:'minute'},
+          {name:'小时平均值', value:'hour'},
+          {name:'日平均值', value:'day'}
+        ], // 查询类别
+        paramsList:[
+          {name: 'PM2.5', unit:'ug/m³', value:'pm25'},
+          {name: 'PM10', unit:'ug/m³', value:'pm10'},
+          {name: 'TSP', unit:'ug/m³', value:'tsp'},
+          {name: '噪声', unit:'db', value:'noise'},
+          {name: '风速', unit:'m/s', value:'windSpeed'},
+          {name: '风力', unit:'级', value:'windPower'},
+          {name: '风向', unit:'°', value:'windDirection'},
+          {name: '温度', unit:'℃', value:'temperature'},
+          {name: '湿度', unit:'%RH', value:'humidity'},
+          {name: '气压', unit:'kpa', value:'pressure'},
+        ], // 数据类型列表
+        chartData: {
+          columns: ['date', 'standard', 'value'],
+          rows: []
         },
-        {
-          text: 'PM2.5',
-          value: 'PM25',
-          align: 'center',
-          width: 100
+        chartSettings: {
+          labelMap: {
+            '': '指标值',
+            'standard': '标准值'
+          },
+          metrics: ['standard', 'value'],
+          dimension: ['date']
         },
-        {
-          text: 'PM10',
-          value: 'PM10',
-          align: 'center',
-          width: 100
-        },
-        {
-          text: 'SO2',
-          value: 'SO2',
-          align: 'center',
-          width: 100
-        },
-        {
-          text: 'NO2',
-          value: 'NO2',
-          align: 'center',
-          width: 100
-        },
-        {
-          text: 'CO',
-          value: 'CO',
-          align: 'center',
-          width: 100
-        },
-        {
-          text: 'O3',
-          value: 'O3',
-          align: 'center',
-          width: 100
-        },
-        {
-          text: '温度',
-          value: 'temperature',
-          align: 'center',
-          width: 100
-        },
-        {
-          text: '湿度',
-          value: 'humidity',
-          align: 'center',
-          width: 100
-        },
-        {
-          text: '风速',
-          value: 'windSpeed',
-          align: 'center',
-          width: 100
-        },
-        {
-          text: '风向',
-          value: 'windDirection',
-          align: 'center',
-          width: 100
-        },
-        {
-          text: '时间',
-          value: 'time',
-          align: 'center'
-        }
-      ], // 显示列
-      timeRange: [], // 时间范围
-      list: [], // 列表数据
-      total: 0, // 数据总数
-      listLoading: true, // 列表加载动画
-      tableOption: {
-        head: {
-          show: true, // 是否需要标题栏，
-          text: '数据列表' // 标题名称
-        },
-        options: {
-          needIndex: false // 是否需要序号列
-        },
-        toolsOption: {
-          selectColumns: false, // 是否需要筛选列
-          refresh: false // 是否需要刷新按钮
-        }
-      } // 表格属性
-    }
-  },
-  created() {
-    this.fetchData()
-  },
-  methods: {
-    goDetail(row) {
-      this.$router.push({
-        name: 'EnvironmentData',
-        query: {
-          name: row.name
-        }
-      })
-    },
-    fetchData() {
-      this.listLoading = true
-      const that = this
-      setTimeout(function() {
-        that.list = [
-          { name: '宝水新城监控点', PM25: '23.40', PM10: '25.80', SO2: '0.00', NO2: '3.40', CO: '0.40', O3: '7.40', temperature: '22.50', humidity: '80.50', windSpeed: '2.50', windDirection: '122.50', time: '05-07 11:15' },
-          { name: '宝水新城监控点', PM25: '23.40', PM10: '25.80', SO2: '0.00', NO2: '3.40', CO: '0.40', O3: '7.40', temperature: '22.50', humidity: '80.50', windSpeed: '2.50', windDirection: '122.50', time: '05-07 11:15' },
-          { name: '宝水新城监控点', PM25: '23.40', PM10: '25.80', SO2: '0.00', NO2: '3.40', CO: '0.40', O3: '7.40', temperature: '22.50', humidity: '80.50', windSpeed: '2.50', windDirection: '122.50', time: '05-07 11:15' },
-          { name: '宝水新城监控点', PM25: '23.40', PM10: '25.80', SO2: '0.00', NO2: '3.40', CO: '0.40', O3: '7.40', temperature: '22.50', humidity: '80.50', windSpeed: '2.50', windDirection: '122.50', time: '05-07 11:15' }
-        ]
-        that.total = 200
-        that.listLoading = false
-      }, 500)
-    },
-    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
-    changePage(val) {
-      if (val && val.size) {
-        this.listQuery.limit = val.size
+        listQuery: {
+          deviceNo:'', // 设备编号
+          searchType:'minute', // 查询类型,
+          params:[],
+          startDate: '', // 开始时间
+          endDate: '', // 结束时间
+          offset: 1,
+          limit: 20
+        }, // 筛选条件
+        columns: [], // 显示列
+        timeRange: [], // 时间范围
+        list: [], // 列表数据
+        total: 0, // 数据总数
+        listLoading: true, // 列表加载动画
+        tableOption: {
+          head: {
+            show: true, // 是否需要标题栏，
+            text: '历史数据列表' // 标题名称
+          },
+          options: {
+            needIndex: false // 是否需要序号列
+          },
+          toolsOption: {
+            selectColumns: false, // 是否需要筛选列
+            refresh: false // 是否需要刷新按钮
+          }
+        } // 表格属性
       }
-      if (val && val.page) {
-        this.listQuery.offset = val.page
+    },
+    watch: {
+      timeRange(val) {
+        if (val && val.length > 0) {
+          this.listQuery.startDate = val[0]
+          this.listQuery.endDate = val[1]
+          this.fetchData()
+        } else {
+          this.listQuery.startDate = ''
+          this.listQuery.endDate = ''
+        }
       }
+    },
+    activated() {
+      if (this.$route.query) {
+        this.listQuery.keywords = this.$route.query.name
+      }
+    },
+    created() {
+      if (this.$route.query) {
+        this.listQuery.keywords = this.$route.query.name
+      }
+      this.listQuery.startDate = getToday('yyyy-MM-dd 00:00:00')
+      this.listQuery.endDate = getToday('yyyy-MM-dd hh:mm:ss')
+      this.timeRange = [this.listQuery.startDate, this.listQuery.endDate]
       this.fetchData()
     },
-    // 重置后的操作， 若不需要显示重置按钮则不需要写
-    clearInput() {
-      this.$message.success('clearInput')
+    methods: {
+      fetchData() {
+        this.lineSearch()
+        // this.listLoading = true
+        const that = this
+        // setTimeout(function () {
+        //       that.list = [
+        //         { deviceNo:'1245521111141', deviceName: '宝水新城监控点', pm25: '23.40', pm10: 25.80, tsp: 0.00, noise: 3.40, windPower: 0.40, windDirection: 7.40, temperature: 22.50, humidity: 80.50, windSpeed: 2.50, pressure: 122.50, ts: '2021-05-07 11:15' },
+        //         { deviceNo:'1245521111141', deviceName: '宝水新城监控点', pm25: '23.40', pm10: 25.80, tsp: 0.00, noise: 3.40, windPower: 0.40, windDirection: 7.40, temperature: 22.50, humidity: 80.50, windSpeed: 2.50, pressure: 122.50, ts: '2021-05-07 11:15' },
+        //         { deviceNo:'1245521111141', deviceName: '宝水新城监控点', pm25: '23.40', pm10: 25.80, tsp: 0.00, noise: 3.40, windPower: 0.40, windDirection: 7.40, temperature: 22.50, humidity: 80.50, windSpeed: 2.50, pressure: 122.50, ts: '2021-05-07 11:15' },
+        //         { deviceNo:'1245521111141', deviceName: '宝水新城监控点', pm25: '23.40', pm10: 25.80, tsp: 0.00, noise: 3.40, windPower: 0.40, windDirection: 7.40, temperature: 22.50, humidity: 80.50, windSpeed: 2.50, pressure: 122.50, ts: '2021-05-07 11:15' }
+        //       ]
+        //       that.total = 4
+        //   that.listLoading = false
+        // }, 500)
+      },
+      lineSearch() {
+        const labelMap = {}
+        const metrics = []
+        const columns = [{text: '名称', value: 'ts', align: 'center'}]
+        for(const item of this.paramsList){
+          if(this.listQuery.params.length==0){
+            labelMap[item.value] = item.name
+            metrics.push(item.value)
+            columns.push({text:item.name, value:item.value})
+          }else{
+            if(this.listQuery.params.indexOf(item.value)>-1){
+              labelMap[item.value] = item.name
+              metrics.push(item.value)
+            }
+          }
+        }
+        this.columns = columns
+        this.chartSettings = {
+          labelMap: labelMap,
+          metrics: metrics,
+          dimension: ['ts']
+        }
+        this.chartData.rows = this.list = [
+          {ts: '9月20日', pm25: 153, pm10: 43, tsp: 0.00, noise: 3.40, windPower: 0.40, windDirection: 7.40, temperature: 22.50, humidity: 80.50, windSpeed: 2.50, pressure: 122.50 },
+          {ts: '9月21日', pm25: 150, pm10: 30, tsp: 0.00, noise: 3.40, windPower: 0.40, windDirection: 7.40, temperature: 22.50, humidity: 80.50, windSpeed: 2.50, pressure: 122.50 },
+          {ts: '9月22日', pm25: 143, pm10: 23, tsp: 0.00, noise: 3.40, windPower: 0.40, windDirection: 7.40, temperature: 22.50, humidity: 80.50, windSpeed: 2.50, pressure: 122.50 },
+          {ts: '9月23日', pm25: 173, pm10: 23, tsp: 0.00, noise: 3.40, windPower: 0.40, windDirection: 7.40, temperature: 22.50, humidity: 80.50, windSpeed: 2.50, pressure: 122.50 },
+          {ts: '9月24日', pm25: 272, pm10: 52, tsp: 0.00, noise: 3.40, windPower: 0.40, windDirection: 7.40, temperature: 22.50, humidity: 80.50, windSpeed: 2.50, pressure: 122.50 },
+          {ts: '9月25日', pm25: 253, pm10: 53, tsp: 0.00, noise: 3.40, windPower: 0.40, windDirection: 7.40, temperature: 22.50, humidity: 80.50, windSpeed: 2.50, pressure: 122.50 }
+        ]
+        this.listLoading = false
+      },
+      // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+      changePage(val) {
+        if (val && val.size) {
+          this.listQuery.limit = val.size
+        }
+        if (val && val.page) {
+          this.listQuery.offset = val.page
+        }
+        this.fetchData()
+      },
+      // 重置后的操作， 若不需要显示重置按钮则不需要写
+      clearInput() {
+        this.$message.success('clearInput')
+      }
     }
   }
-}
 </script>
 
-<style scoped>
-
+<style rel="stylesheet/scss" lang="scss">
+  .choose-device {
+    padding: 12px 12px 0px 12px;
+    .detail {
+      padding: 0px 10px;
+      font-size: 14px;
+      .title {
+        color: #8c939d;
+      }
+    }
+  }
+  .data-container{
+    border-top:12px solid #ebebeb ;
+    padding: 12px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    .title-header{
+      font-size:15px;
+      color: #606266;
+    }
+  }
 </style>