策略配置功能

src/assets/styles/common.css

@@ -66,34 +66,51 @@ html,body{
 /* form表单样式 */
 .common-form .ivu-form-item-label {
   color: #F5F5F5;
+  line-height: 32px;
+  height: 32px;
+  padding: 0;
+  padding-right: 12PX;
+}
+.common-form .ivu-form-item-content {
+  line-height: 32px;
 }
 .common-form .ivu-form-item {
   color: #F5F5F5;
   margin-bottom: 20px;
 }
-.common-form .ivu-input {
+/* .common-form .ivu-input {
   background: #06214D;
   border: 1px solid #204A8F;
   border-radius: 6px;
   color: #F5F5F5;
+  height: 32px;
 }
 .common-form .ivu-input-word-count {
   background: transparent;
 }
+.common-form .ivu-input-number-input-wrap {
+  height: 32px;
+}
 .common-form .ivu-input-number{
   border: 1px solid #204A8F;
   background-color: transparent;
   width: -webkit-fill-available;
+  height: 32px;
 }
 .common-form .ivu-input-number-input {
   background: #06214D;
-  /* border: 1px solid #0185EA; */
   border-radius: 6px;
   color: #F5F5F5;
+  height: 32px;
+  line-height: 32px;
+}
+.common-form  .ivu-input-number-handler {
+  height: 16px;
 }
 .common-form .ivu-input-number-handler-wrap {
   background: #06214D;
   border-left: 1px solid #0185EA;
+ 
 }
 .common-form .ivu-input-number-handler-down {
   border-top: 1px solid #0185EA;
@@ -107,6 +124,57 @@ html,body{
 .common-form .ivu-input-number-focused {
   border: 1px solid #0185EA;
 }
+textarea.ivu-input {
+  min-height: 32px;
+} */
+.ivu-input {
+  background: #06214D;
+  border: 1px solid #204A8F;
+  border-radius: 6px;
+  color: #F5F5F5;
+  height: 32px;
+}
+.ivu-input-word-count {
+  background: transparent;
+}
+.ivu-input-number-input-wrap {
+  height: 32px;
+}
+.ivu-input-number{
+  border: 1px solid #204A8F;
+  background-color: transparent;
+  width: -webkit-fill-available;
+  height: 32px;
+}
+.ivu-input-number-input {
+  background: #06214D;
+  border-radius: 6px;
+  color: #F5F5F5;
+  height: 32px;
+  line-height: 32px;
+}.ivu-input-number-handler {
+  height: 16px;
+}
+.ivu-input-number-handler-wrap {
+  background: #06214D;
+  border-left: 1px solid #0185EA;
+ 
+}
+.ivu-input-number-handler-down {
+  border-top: 1px solid #0185EA;
+}
+.ivu-input-number-handler-down-inner, ..ivu-input-number-handler-up-inner {
+  color: #0185EA;
+}
+.ivu-input:focus{
+  border: 1px solid #0185EA;
+}
+.ivu-input-number-focused {
+  border: 1px solid #0185EA;
+}
+textarea.ivu-input {
+  min-height: 32px;
+}
 /*输入框样式*/
 .ivu-input-wrapper .ivu-input-icon {
   height: 32px;
@@ -124,11 +192,12 @@ html,body{
 }
 .ivu-select-single .ivu-select-selection div{
   height: 100%;
+  display: flex;
+  align-items: center;
 }
 .ivu-select-single .ivu-select-selection div span{
-  height: 100% !important;
-  display: flex !important;
-  align-items: center !important;
+  height: 30px !important;
+  line-height: 30px !important;
 }
 .ivu-select-dropdown {
   background-color: #06214D;
@@ -268,6 +337,11 @@ html,body{
   color: #fff;
   background-color: #0185ea;
  }
+ /* 操作按钮的样式 */
+ .common-operate-btn>i,  .common-operate-btn>span{
+  display: flex;
+  align-items: center;
+ }
  /* 表格的样式 */
  .common-table {
   overflow: inherit;
@@ -302,6 +376,18 @@ html,body{
  .common-table .ivu-table-stripe-odd td{
   background-color: #072453;
  }
+ .common-table .ivu-checkbox .ivu-checkbox-inner {
+  border-color: #3565BC;
+  background-color: transparent;
+ }
+ .common-table .ivu-checkbox-checked .ivu-checkbox-inner {
+  /* border: none; */
+  background-color: #0185EA;
+ }
+ .common-table .ivu-checkbox-disabled .ivu-checkbox-inner {
+  border-color: #3565BC;
+  background-color: transparent;
+ }
  /*表格暂无数据*/
  /* .ivu-table-tip {
   min-height: 300px;
@@ -393,3 +479,6 @@ html,body{
 .common-date-picker .ivu-date-picker-cells-cell-range:before {
   background:#2e4e89;
 }
+.common-date-picker .ivu-input-prefix i, .common-date-picker .ivu-input-suffix i {
+  line-height: 32px;
+}

src/components/common/RollingDetailTable.vue

@@ -83,6 +83,7 @@ export default {
         if (res.httpCode == 1) {
           if (res.data.data && res.data.data.length==0) {
             this.detailTotal = 0
+            this.detailTabData = []
           } else {
             this.detailTabData = res.data.data
             this.detailTotal = Number(res.data.count)

src/components/test.vue

@@ -0,0 +1,29 @@
+<template>
+<div>
+ <div class="container" style="height:100%;overflow-x: hidden;overflow-y: auto;">
+    <div style="height: 2000px;background:yellow;position:relative;overflow:auto">
+     <span style="height: 500px;background:red;display:block">fggggggggggg</span>
+     <span style="height: 500px;background:blue;display:block">fggggggggggg</span>
+    </div>
+  </div>
+</div>
+</template>
+<script>
+export default {
+  name: "",
+  components:{
+  },
+  data() {
+    return {
+    };
+  },
+  mounted() {
+  },
+  methods: {
+   
+  }
+};
+</script>
+<style scoped lang="stylus">
+
+</style>

src/libs/http.js

@@ -31,9 +31,16 @@ return Promise.reject(error)
  */
 
 export function get(url,params={}){
+  let arr = Object.entries(params).map(([key, value]) => {
+    if(typeof(value) === "undefined") { // 参数如果值是undefined的时候，传参时会默认无这个字段。现在处理成空字符串
+      value = ''
+    }
+    return  [key,value]
+  })
+  let newParams = Object.fromEntries(arr)
   return new Promise((resolve,reject) => {
     axios.get(url,{
-      params:params
+      params:newParams
     })
     .then(response => {
       resolve(response.data)
@@ -53,13 +60,20 @@ export function get(url,params={}){
  */
 
  export function post(url,data = {}){
+  let arr = Object.entries(data).map(([key, value]) => {
+    if(typeof(value) === "undefined") { // 参数如果值是undefined的时候，传参时会默认无这个字段。现在处理成空字符串
+      value = ''
+    }
+    return  [key,value]
+  })
+  let newData = Object.fromEntries(arr)
    return new Promise((resolve,reject) => {
-     axios.post(url,data)
-          .then(response => {
-            resolve(response.data)
-          },err => {
-            reject(err)
-          })
+     axios.post(url,newData)
+        .then(response => {
+          resolve(response.data)
+        },err => {
+          reject(err)
+        })
    })
  }
 

src/router/index.js

@@ -114,8 +114,17 @@ const routes = [
   { path: '*', redirect: '/' }
 ]
 
+// const router = new VueRouter({
+//   routes
+// })
+// 3. 创建 router 实例，然后传 `routes` 配置
 const router = new VueRouter({
-  routes
+  // mode: 'history',
+  base: process.env.BASE_URL,
+  routes,
+  scrollBehavior(to, from, savedPosition) {
+    return { x: 0, y: 0 }
+  }
 })
 //全局前置守卫
 router.beforeEach(function (to, from, next) {

src/views/homecomponents/BasicInfomation/ApplicationEquip.vue

@@ -361,6 +361,7 @@ export default {
     modalChange (modalStatus) {
      if (!modalStatus) {
       this.$refs.formOption.resetFields();
+      this.equipTypeData = []
      }
     },
     modalOk (formName) {

src/views/homecomponents/BasicInfomation/ApplicationStation.vue

@@ -240,8 +240,7 @@ export default {
             title: '应用名称',
             key: 'appName',
             align: 'center',
-            ellipsis: true,
-            tooltip: true
+           
           },
           // {
           //   title: '层级',
@@ -323,7 +322,9 @@ export default {
           {
             title: '设备类型名称',
             key: 'equipmentName',
-            align: 'center'
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
           },
           {
             title: '监测模型指标数',
@@ -633,7 +634,7 @@ export default {
      height: 100%;
    }
     >>> .ivu-input {
-     width: 150px;
+     width: 155px;
      height: 32px;
    }
 }

src/views/homecomponents/BasicInfomation/DeviceManageIndex.vue

@@ -4,13 +4,13 @@
       <div class="search-left">
         <Form class="common-form common-form-list" ref="tableParams" :model="tableParams" inline>
           <FormItem label="" prop="lineId">
-            <Select v-model="tableParams.lineId" placeholder="线路" @on-select="selectLine">
-              <Option v-for="item in lineTypeData" :value="String(item.id)" :key="item.id">{{ item.lineName }}</Option>
+            <Select v-model="tableParams.lineId" placeholder="线路" @on-select="changeLine" label-in-value>
+              <Option v-for="item in lineTypeData" :value="item.id" :key="item.id">{{ item.lineName }}</Option>
             </Select>
           </FormItem>
           <FormItem label="" prop="stationId">
             <Select v-model="tableParams.stationId" placeholder="站点">
-              <Option v-for="item in stationTypeData" :value="String(item.id)" :key="item.id">{{ item.stationName }}</Option>
+              <Option v-for="item in stationTypeData" :value="item.id" :key="item.id">{{ item.stationName }}</Option>
             </Select>
           </FormItem>
           <FormItem label="" prop="equipmentStatus">
@@ -48,12 +48,12 @@
         <template slot="loading">
             <Loading-animation></Loading-animation>
         </template>
-        <template slot-scope="{ row }" slot="lineName">
+        <!-- <template slot-scope="{ row }" slot="lineName">
           <span>{{!row.lineName ? '/' : row.lineName}}</span>
         </template>
         <template slot-scope="{ row }" slot="stationName">
           <span>{{!row.stationName ? '/' : row.stationName}}</span>
-        </template>
+        </template> -->
          <template slot-scope="{ row }" slot="action">
            <Tooltip content="详情" placement="top">
               <i class="iconfont icon-xiangqingmingxi" style="cursor:pointer;color:#B8B532;fontSize:20px;marginRight:6px" @click="detailClick(row)"></i>
@@ -268,7 +268,7 @@ export default {
           },
           {
             title: '归属线路',
-            slot: 'lineName',
+            key: 'lineName',
             align: 'center',
             ellipsis: true,
             tooltip: true
@@ -276,7 +276,7 @@ export default {
           {
             title: '归属站点',
             align: 'center',
-            slot: 'stationName',
+            key: 'stationName',
             ellipsis: true,
             tooltip: true
           },
@@ -422,7 +422,7 @@ export default {
         }
       })
     },
-    selectLine (val) {
+    changeLine (val) {
       // 获取站点类型
       this.tableParams.stationId = ''
       this.tableParams.lineId = val.value
@@ -443,11 +443,6 @@ export default {
         })
       }
     },
-    // selectChange (selection) {
-    //  console.log(selection)
-    //  let user = selection.map(item => item.id)
-    //  console.log(user)
-    // },
     // 获取表格数据
     getTableData (keywords,arr,level) {
        if (level) {
@@ -472,8 +467,11 @@ export default {
         }
       }
       let params = JSON.parse(JSON.stringify(this.tableParams))
+      // params.lineId = params.lineId == '-1' || !params.lineId ? '':params.lineId
+      // params.stationId = params.stationId == '-1' || !params.stationId ?'':params.stationId
+      // params.equipmentStatus = params.equipmentStatus == '-1' || !params.equipmentStatus ?'':params.equipmentStatus
       params.lineId = params.lineId == '-1' ? '':params.lineId
-      params.stationId = params.stationId == '-1' ?'':params.stationId
+      params.stationId = params.stationId == '-1'?'':params.stationId
       params.equipmentStatus = params.equipmentStatus == '-1' ?'':params.equipmentStatus
       this.loading = true
       this.$get('metroapi/equipment/queryEquipmentPage', params).then(res=>{
@@ -511,7 +509,7 @@ export default {
       this.appParams.applicationId = val
       this.formOption.equipmentType = ''
       if (val) {
-        this.getAddEquipType( this.appParams)
+        this.getAddEquipType(this.appParams)
       }
     },
     // 获取新增设备类型 
@@ -532,8 +530,8 @@ export default {
      this.dateRange = []
      this.tableParams.useDateBegin = ''
      this.tableParams.useDateEnd = ''
-     this.$refs[name].resetFields()
      this.stationTypeData = [{ id: '-1', stationName: '站点' }]
+     this.$refs[name].resetFields()
      this.getTableData()
     },   
     changeMoldaPicker (val) {
@@ -577,6 +575,8 @@ export default {
     modalChange (modalStatus) {
      if (!modalStatus) {
       this.$refs.formOption.resetFields();
+      this.stationTypeData = [{ id: '-1', stationName: '站点' }]
+      this.equipTypeModalData = []
      }
     },
     modalOk (formName) {
@@ -651,7 +651,7 @@ export default {
 }
 .search-list {
   display: flex;
-  padding: 10px 0;
+  padding: 10px 0 0;
 }
 .search-left {
   display: flex;
@@ -691,10 +691,9 @@ export default {
 .common-form {
   display: flex;
   flex-wrap: wrap;
-  justify-content: space-between;
 }
 >>> .common-form-list .ivu-form-item {
-  margin-bottom: 0;
+  margin-bottom: 10px;
 }
 .manage-main-center {
   width: 100%;

src/views/homecomponents/BasicInfomation/DeviceTypeManage.vue

@@ -191,7 +191,9 @@ export default {
         {
           title: '应用名称',
           key: 'appName',
-          align: 'center'
+          align: 'center',
+          ellipsis: true,
+          tooltip: true
         },
         {
           title: '设备数量',
@@ -213,23 +215,26 @@ export default {
          {
             title: '设备名称',
             key: 'equipmentName',
-            align: 'center'
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
          },
          {
             title: '归属线路',
             key: 'lineName',
             align: 'center',
-            render:(h,params)=>{
-              return h('div', [ h('span',!params.row.lineName ? '/' : params.row.lineName) ])
-            }
+            ellipsis: true,
+            tooltip: true
+            // render:(h,params)=>{
+            //   return h('div', [ h('span',!params.row.lineName ? '/' : params.row.lineName) ])
+            // }
          },
          {
             title: '归属站点',
             key: 'stationName',
             align: 'center',
-             render:(h,params)=>{
-              return h('div', [ h('span',!params.row.stationName ? '/' : params.row.stationName) ])
-            }
+            ellipsis: true,
+            tooltip: true
          },
          {
             title: '状态',

src/views/homecomponents/BasicInfomation/LineManage.vue

@@ -214,17 +214,17 @@ export default {
                 nativeOn:{
                     "mousedown":(event)=>{ // 监听组件原生事件mousedown,此事件在click之前触发
                       this.rowObj =  params.row
-                      if (params.row.enabled == 0) {
-                        this.commonTitle = '确认启用'
-                        this.activeColor = '#57C44F'
-                        this.activeClass = 'icon-qiyong'
-                        this.modalTitle = '启用后此线路统计数据将在各管理模块及前端显示页面生效。'
-                        this.modalStatus = true
-                      } else {
+                      if (params.row.enabled == 1) {
                         this.commonTitle = '确认关闭'
                         this.activeColor = '#E92E2E'
                         this.activeClass = 'icon-guanbi'
                         this.modalTitle = '关闭后线路下所有站点将同时关闭，线路及站点统计数据不可见。'
+                        this.modalStatus = true         
+                      } else {
+                        this.commonTitle = '确认启用'
+                        this.activeColor = '#57C44F'
+                        this.activeClass = 'icon-qiyong'
+                        this.modalTitle = '启用后此线路统计数据将在各管理模块及前端显示页面生效。'
                         this.modalStatus = true
                       }
                     },
@@ -483,7 +483,7 @@ export default {
 .common-page-total {
   color: #fff;
   padding-right: 10px;
-  font-size: 14px;
+  font-size: 14px; 
   span {
     color #409EFF;
   }

src/views/homecomponents/BasicInfomation/StationManage.vue

@@ -250,18 +250,19 @@ export default {
                 nativeOn:{
                     "mousedown":(event)=>{ // 监听组件原生事件mousedown,此事件在click之前触发
                       this.rowObj =  params.row
-                      if (params.row.enabled == 0) {
-                        this.commonTitle = '确认启用'
-                        this.activeColor = '#57C44F'
-                        this.activeClass = 'icon-qiyong'
-                        this.modalTitle = '启用后此站点统计数据将在各管理模块及前端显示页面生效。'
-                        this.modalStatus = true
-                      } else {
+                      if (params.row.enabled == 1) {
                         this.commonTitle = '确认关闭'
                         this.activeColor = '#E92E2E'
                         this.activeClass = 'icon-guanbi'
                         this.modalTitle = '关闭后站点下所有设备、仪表、客流统计数据将同时关闭，相关管理模块不可见。'
                         this.modalStatus = true
+                      } else {
+                        this.commonTitle = '确认启用'
+                        this.activeColor = '#57C44F'
+                        this.activeClass = 'icon-qiyong'
+                        this.modalTitle = '启用后此站点统计数据将在各管理模块及前端显示页面生效。'
+                        this.modalStatus = true
+                        
                       }
                     },
                   }

src/views/homecomponents/Content.vue

@@ -22,7 +22,7 @@ export default {
     };
   },
   watch: {
-      '$route' (to, from) {
+      '$route' (to, from) {     
         this.menuName = JSON.parse(sessionStorage.getItem('menuNameArr'))
       }
     },

src/views/homecomponents/EquipmentAnalysis/AlarmFilterConfig.vue

@@ -3,11 +3,11 @@
     <div class="search-list">
       <div class="search-left">
         <Form class="common-form common-form-list" ref="tableParams" :model="tableParams" inline>
-          <FormItem label="" prop="lineId">
+          <!-- <FormItem label="" prop="lineId">
             <Select v-model="tableParams.lineId" placeholder="来源应用">
               <Option v-for="item in lineTypeData" :value="String(item.id)" :key="item.id">{{ item.lineName }}</Option>
             </Select>
-          </FormItem>
+          </FormItem> -->
          <FormItem label="" prop="lineId">
             <Select v-model="tableParams.lineId" placeholder="线路" @on-select="selectLine">
               <Option v-for="item in lineTypeData" :value="String(item.id)" :key="item.id">{{ item.lineName }}</Option>
@@ -18,9 +18,9 @@
               <Option v-for="item in stationTypeData" :value="String(item.id)" :key="item.id">{{ item.stationName }}</Option>
             </Select>
           </FormItem>
-          <FormItem label="" prop="lineId">
-            <Select v-model="tableParams.lineId" placeholder="告警等级">
-              <Option v-for="item in lineTypeData" :value="String(item.id)" :key="item.id">{{ item.lineName }}</Option>
+          <FormItem label="" prop="rankId">
+            <Select v-model="tableParams.rankId" placeholder="告警等级">
+              <Option v-for="item in alarmLevelData" :value="item.id" :key="item.id">{{ item.name }}</Option>
             </Select>
           </FormItem>
           <FormItem label="">
@@ -31,8 +31,8 @@
               <Option v-for="item in equipTypeData" :value="(item.id)" :key="item.id">{{ item.name }}</Option>
             </Select>
           </FormItem> -->
-          <FormItem label="" prop="equipmentName">
-            <Input placeholder="请输入关键字查询" clearable search v-model="tableParams.equipmentName" />
+          <FormItem label="" prop="name">
+            <Input placeholder="请输入关键字查询" clearable search v-model="tableParams.name" />
           </FormItem>
           <FormItem label="" >
             <Button type="primary" class="common-btn-search" @click="searchClick">
@@ -53,6 +53,12 @@
         <template slot="loading">
             <Loading-animation></Loading-animation>
         </template>
+        <!-- <template slot-scope="{ row }" slot="lineName">
+          <span>{{!row.lineName ? '/' : row.lineName}}</span>
+        </template> -->
+        <!-- <template slot-scope="{ row }" slot="stationName">
+          <span>{{!row.stationName ? '/' : row.stationName}}</span>
+        </template> -->
          <template slot-scope="{ row }" slot="action">
            <Tooltip content="编辑" placement="top">
               <i class="iconfont icon-bianji" style="cursor:pointer;color:#64ACFE;fontSize:20px;marginRight:6px" @click="editClick(row)"></i>
@@ -63,7 +69,12 @@
         </template>
       </Table>
     </div>
-    <Page :total="tableTotal" :current="tableParams.pageNum" :page-size="tableParams.pageSize" @on-change="changePage" @on-page-size-change="sizeChange" show-elevator class="common-page"/>
+    <div class="common-page">
+      <div class="common-page-total">
+        共<span>{{tablePage}}</span>页 / <span>{{tableTotal}}</span>条数据
+      </div>
+      <Page :total="tableTotal" :current="tableParams.pageNum" :page-size="tableParams.pageSize" @on-change="changePage" @on-page-size-change="sizeChange" show-elevator />
+    </div>
     <Modal
       v-model="showModal"
       :title="title"
@@ -74,32 +85,32 @@
       @on-visible-change="modalChange"
       :mask-closable="false"
       class-name="common-modal">
-      <Form class="common-form" ref="formOption" :model="formOption" :rules="ruleValidate" :label-width="120" inline>
-        <FormItem label="过滤策略名称：" prop="supplier" style="width:100%">
-          <Input v-model="formOption.supplier" maxlength="20" show-word-limit />  
+      <Form class="common-form" ref="formOption" :model="formOption" :rules="ruleValidate" :label-width="130" inline>
+        <FormItem label="过滤策略名称：" prop="filterName" style="width:100%">
+          <Input v-model.trim="formOption.filterName" maxlength="20" show-word-limit />  
         </FormItem>
-        <FormItem label="来源应用：" prop="appId" style="width:100%">
-           <Select v-model="formOption.appId" placeholder="来源应用" @on-change="selectModalApp">
-             <Option v-for="item in equipAppModalData" :value="String(item.id)" :key="item.id">{{ item.appName }}</Option>
+        <FormItem label="来源应用：" prop="appId" style="width:100%" :rules="{type:'number'}">
+           <Select v-model="formOption.appId" placeholder="来源应用">
+             <Option v-for="item in equipAppModalData" :value="item.id" :key="item.id">{{ item.appName }}</Option>
           </Select>
         </FormItem>
-        <FormItem label="所属线路：" prop="lineId" style="width:48%">
+        <FormItem label="所属线路：" prop="lineId" style="width:48%" :rules="{type:'number'}">
           <Select v-model="formOption.lineId" placeholder="线路" @on-change="selectModalLine" label-in-value>
-              <Option v-for="item in lineTypeData" :value="String(item.id)" :key="item.id">{{ item.lineName }}</Option>
+              <Option v-for="item in lineTypeModalData" :value="item.id" :key="item.id">{{ item.lineName }}</Option>
           </Select>
 				</FormItem>
-				<FormItem label="所属站点：" prop="stationId" style="width:48%">
+				<FormItem label="所属站点：" prop="stationId" style="width:48%" :rules="{type:'number'}">
            <Select v-model="formOption.stationId" placeholder="站点" @on-change="selectModalStation" label-in-value>
-            <Option v-for="item in stationTypeData" :value="String(item.id)" :key="item.id">{{ item.stationName }}</Option>
+            <Option v-for="item in stationTypeModalData" :value="item.id" :key="item.id">{{ item.stationName }}</Option>
           </Select>
         </FormItem>
-        <FormItem label="告警等级：" prop="equipmentType" style="width:100%">
-          <Select v-model="formOption.equipmentType" placeholder="告警等级">
-             <Option v-for="item in equipTypeModalData" :value="item.equipmentTypeId" :key="item.equipmentTypeId">{{ item.equipmentName }}</Option>
+        <FormItem label="告警等级：" prop="rankId" style="width:100%" :rules="{type:'number'}">
+          <Select v-model="formOption.rankId" placeholder="告警等级">
+             <Option v-for="item in alarmLevelModalData" :value="item.id" :key="item.id">{{ item.name }}</Option>
           </Select>
         </FormItem>
          <FormItem label="过滤时间：" prop="dates" style="width:100%">
-          <DatePicker type="daterange" v-model="formOption.dates" style="width:100%" :clearable="false" class="common-date-picker date-picker-main" placement="bottom-start" placeholder="过滤时间范围" @on-change="changeModalPicker"></DatePicker>
+          <DatePicker type="daterange" :value="formOption.dates" style="width:100%" :clearable="false" class="common-date-picker date-picker-main" placement="bottom-start" placeholder="过滤时间范围" @on-change="changeModalPicker"></DatePicker>
         </FormItem>
 			</Form>
       <div slot="footer">
@@ -126,13 +137,21 @@
   </div>
 </template>
 <script>
-const defaultFrom = {lineId: '',stationId: '',appId:'',equipmentName: '',equipmentType:'',equipmentStatus: '',equipmentVersion: '',supplier: '',remark: ''}
+const defaultFrom = {filterName: '',lineId: '',stationId: '',appId:'',rankId: '',filterBeginTime: '',filterEndTime: '',dates:[]}
 export default {
   name: "AlarmFilterConfig",
   components:{
   },
   data() {
     return {
+       alarmParams: {
+        keywords: '',
+        enabled: 1,
+        beginDate: '',
+        endDate: '',
+        pageNum: 1,
+        pageSize: 10
+      },
       applicationParams: {
         level: '',
         lineId: '',
@@ -154,116 +173,114 @@ export default {
       tableParams: {
         lineId: '',
         stationId: '',
-        equipmentStatus: '',
         keywords: '',
         applicationId:'',
-        equipmentType: '',
-        useDateBegin: '',
-        useDateEnd: '',
-        equipmentName: '',
+        equipmentTypeId: '',
+        rankId: '',
+        filterBeginTime: '',
+        filterEndTime: '',
+        name: '',
         pageNum: 1,
         pageSize: 10
       },
       tableData: [],
       tableTotal: 0,
+      tablePage: 0,
       rowObj: {},
       lineTypeData: [],
       stationTypeData: [],
-      indicatorsNum: [
-         {
-          value: '-1',
-          label: '监测指标数量'
-        },
-        {
-          value: '1',
-          label: '有'
-        },
-        {
-          value: '0',
-          label: '无'
-        },
-      ],
-      strategyIndicNum: [
-         {
-          value: '-1',
-          label: '策略覆盖指标数量'
-        },
-        {
-          value: '1',
-          label: '有'
-        },
-        {
-          value: '0',
-          label: '无'
-        },
-      ],
-      strategyEquipNum: [
-         {
-          value: '-1',
-          label: '策略覆盖设备数量'
-        },
-        {
-          value: '1',
-          label: '有'
-        },
-        {
-          value: '0',
-          label: '无'
-        },
-      ],
+      lineTypeModalData: [],
+      stationTypeModalData: [],
+      alarmLevelData: [],
+      alarmLevelModalData: [],
       lineTypeData: [],
       stationTypeData: [],
-      equipStateData: [],
-      equipStateModalData: [],
       equipTypeData: [],
       equipTypeModalData: [],
       equipAppModalData: [],
       columns: [
-        //  {
-        //     type: 'selection',
-        //     width: 60,
-        //     align: 'center'
-        //   },
           {
-            title: '等级判定策略名称',
-            key: 'equipmentId',
+            title: '过滤策略名称',
+            key: 'filterName',
             align: 'center',
             ellipsis: true,
             tooltip: true
           },
           {
             title: '来源应用',
-            key: 'equipmentName',
+            key: 'appName',
             align: 'center',
             ellipsis: true,
             tooltip: true
-          },
+          }, 
           {
-            title: '设备类型',
-            key: 'equipmentTypeName',
-            align: 'center'
+            title: '线路',
+            key: 'lineName',
+            // width: 160,
+            ellipsis: true,
+            tooltip: true,
+            align: 'center',
+            // render: (h, params) => {
+            //     let lineName = ''
+            //     if (params.row.lineName && params.row.lineName.length > 10) {
+            //       lineName = params.row.lineName.substring(0, 10) + "...";
+            //     } else {
+            //       lineName = params.row.lineName
+            //     }
+            //     return h('div', [
+            //   　　　　h('Tooltip', {
+            //   　　　　props: { placement: 'bottom', transfer: true,disabled:params.row.lineName.length<=10,}
+            //   　　　　}, [
+            //   　　　　h('span', {
+            //   　　　　　　style: {
+            //   　　　　　　　　overflow: 'hidden',
+            //   　　　　　　　　textOverflow: 'ellipsis',
+            //   　　　　　　　　whiteSpace: 'nowrap',
+            //   　　　　　　},
+            //   　　　　　　}, lineName),
+            //   　　　　　　h('span', {
+            //   　　　　　　　　slot: 'content',
+            //   　　　　　　　　style: { whiteSpace: 'normal', wordBreak: 'break-all' }
+            //   　　　　　　},params.row.lineName)
+            //   　　　　])
+            //   　　])
+            //   }
+           },
+           {
+            title: '站点',
+            ellipsis: true,
+            tooltip: true,
+            key: 'stationName',
+            align: 'center',
+            // render: (h, params) => {
+            //   this.$set(this.columns[3], 'tooltip', true)
+            //   return h('span', params.row.stationName)
+            // },
+            // tooltip: true,
           },
           {
-            title: '监测指标数量',
-            key: 'appName',
-            align: 'center'
+            title: '设备名称',
+            key: 'equipmentName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
           },
           {
-            title: '策略覆盖指标数量',
-            key: 'lineName',
+            title: '告警等级',
+            key: 'rankName',
             align: 'center',
-            // width: 80,
+            ellipsis: true,
+            tooltip: true
           },
           {
-            title: '策略覆盖设备数量',
-            key: 'stationName',
+            title: '开始时间',
+            key: 'filterBeginTime',
             align: 'center',
-            // width: 80,
           },
           {
-            title: '设备状态',
-            key: 'equipmentStatusValue',
-            align: 'center'
+            title: '结束时间',
+            key: 'filterEndTime',
+            align: 'center',
           },
           {
           title: '是否启用',
@@ -278,18 +295,17 @@ export default {
                 nativeOn:{
                     "mousedown":(event)=>{ // 监听组件原生事件mousedown,此事件在click之前触发
                       this.rowObj =  params.row
-                      if (params.row.enabled == 0) {
+                      if (params.row.enabled == 1) {this.commonTitle = '确认关闭'
+                        this.activeColor = '#E92E2E'
+                        this.activeClass = 'icon-guanbi'
+                        this.modalTitle = '可能影响新数据判断结果。'
+                        this.modalStatus = true
+                      } else {
                         this.commonTitle = '确认启用'
                         this.activeColor = '#57C44F'
                         this.activeClass = 'icon-qiyong'
                         this.modalTitle = '当前时间点后所有告警信息，将使用策略自动判定。'
                         this.modalStatus = true
-                      } else {
-                        this.commonTitle = '确认关闭'
-                        this.activeColor = '#E92E2E'
-                        this.activeClass = 'icon-guanbi'
-                        this.modalTitle = '可能影响新数据判断结果。'
-                        this.modalStatus = true
                       }
                     },
                   }
@@ -312,59 +328,25 @@ export default {
       activeClass: '',
       modalTitle: '',
       dateModalRange: [],
-      formOption: {lineId: '',stationId: '',appId:'',equipmentName: '',equipmentType:'',equipmentStatus: '',dates:[],equipmentVersion: '',supplier: '',remark: ''},
+      formOption: {filterName: '',lineId: '',stationId: '',appId:'',rankId: '',filterBeginTime: '',filterEndTime: '',dates:[]},
       ruleValidate: {
-        appName: [{
+        filterName: [{
           required: true,
-          message: '请输入设备名称',
+          message: '请输入过滤策略名称',
           trigger: 'blur'
         }],
         dates: [{
-                  type: "array", required: true, message: '过滤时间',
-                  // fields: {
-                  //   0: {type: 'date', required: true, message: '过滤时间'},
-                  //   1: {type: 'date', required: true, message: '过滤时间'}
-                  // }
-              }]
-        //   required: true,
-        //   type: 'number',
-        //   message: '请选择',
-        //   trigger: 'change'
-        // }],
-        // useDate: [{
-        //   required: true,
-        //   type: 'date',
-        //    message: '请选择',
-        //   // validator: checkDate,
-        //   trigger: 'change'
-        // }],
+            type: "array", required: true, message: '请选择过滤时间',
+            // fields: {
+            //   0: {type: 'string', required: true, message: '过滤时间'},
+            //   1: {type: 'string', required: true, message: '过滤时间'}
+            // }
+        }]
       },
-      formCustom: {
-        formDynamic: [
-          {
-            name: "策略",
-            formItems: [
-              {
-                logic: "",
-                baohan: "",
-                disabled: false,
-                sublogic: '',
-                status: 1
-              },
-            ],
-            text: "判定为",
-            alarmType: "",
-            disabled: false,
-          },
-        ],
-        logical : ''
-      },
-      clickbtn: 1, // 1点击策略增加按钮 2点击子策略增加按钮 3点击子策略删除按钮
     };
   },
   mounted() {
     this.getType()
-    this.getTableData()
   },
   methods: {
     go (){
@@ -373,13 +355,13 @@ export default {
       this.$router.push({ name: 'ApplicationManage', params: { type:2 }}) // -> /home/123
     },
     changePicker (date) {
-      this.tableParams.useDateBegin = date[0]
-      this.tableParams.useDateEnd = date[1]
+      this.tableParams.filterBeginTime = date[0]
+      this.tableParams.filterEndTime = date[1]
     },
     changeModalPicker (date) {
       this.formOption.dates = date
-      this.formOption.useDate = date[0]
-      this.formOption.endDate = date[1]
+      this.formOption.filterBeginTime = date[0]
+      this.formOption.filterEndTime = date[1]
     },
     rowClassName(row, index) {
       if (index % 2 == 0) {
@@ -402,22 +384,13 @@ export default {
       //获取所属线路
       this.$get('metroapi/lineStation/queryLine', {lineName:''}).then(res=>{
         if (res.httpCode == 1 ){
+          this.lineTypeModalData = JSON.parse(JSON.stringify(res.data))
           this.lineTypeData = res.data
           this.lineTypeData.unshift({ id: '-1', lineName: '线路' })
           this.getStationData ('-1')
         } else {
           this.lineTypeData = []
-        }
-      })
-      // 获取设备状态
-      this.$get('metroapi/dic/queryDictionary', {name:'设备状态'}).then(res=>{
-        if (res.httpCode == 1 ){
-          this.equipStateModalData = JSON.parse(JSON.stringify(res.data))
-          this.equipStateData = res.data
-          this.equipStateData.unshift({ id: '-1', value: '设备状态' })
-        } else {
-          this.equipStateData = []
-          this.equipStateModalData = []
+          this.lineTypeModalData = []
         }
       })
       // 获取归属应用
@@ -428,6 +401,17 @@ export default {
           this.equipAppModalData = []
         }
       })
+      // 告警等级
+      this.$get('metroapi/alert/rank/list', this.alarmParams).then(res=>{
+        if (res.httpCode == 1 ){
+          this.alarmLevelModalData = JSON.parse(JSON.stringify(res.data.data))
+          this.alarmLevelData = res.data.data
+          this.alarmLevelData.unshift({ id: '-1', name: '告警等级' })
+        } else {
+          this.alarmLevelData = []
+          this.alarmLevelModalData = []
+        }
+      })
       //  // 获取设备类型
       // this.$get('metroapi/equipment/queryEquipmentType', {name:''}).then(res=>{
       //   if (res.httpCode == 1 ){
@@ -450,11 +434,12 @@ export default {
     },
     // 获取所属站点
     getStationData (lineId) {
-      if(lineId == '-1') {
+      if(lineId == -1) {
         this.stationTypeData = [{ id: '-1', stationName: '站点' }]
       } else {
         this.$get('metroapi/lineStation/queryStationByLineId', {lineId:lineId}).then(res=>{
           if (res.httpCode == 1 ){
+            this.stationTypeModalData = JSON.parse(JSON.stringify(res.data))
             this.stationTypeData = res.data
             this.stationTypeData.unshift({ id: '-1', stationName: '站点' })
           }
@@ -472,17 +457,17 @@ export default {
         this.tableParams.keywords = ''
         if (level == 2) {
           this.tableParams.applicationId = arr[arr.length-1]
-          this.tableParams.equipmentType = ''
+          this.tableParams.equipmentTypeId = ''
         } else if (level == 3) {
           this.tableParams.applicationId = arr[arr.length-2]
-          this.tableParams.equipmentType = arr[arr.length-1]
+          this.tableParams.equipmentTypeId = arr[arr.length-1]
         } else {
           this.tableParams.applicationId = ''
-          this.tableParams.equipmentType = ''
+          this.tableParams.equipmentTypeId = ''
         }
       } else {
         this.tableParams.applicationId = ''
-        this.tableParams.equipmentType = ''
+        this.tableParams.equipmentTypeId = ''
         if (keywords == '合肥轨道交通' || keywords == '' || !keywords) {
           this.tableParams.keywords = ''
         } else {
@@ -490,14 +475,20 @@ export default {
         }
       }
       let params = JSON.parse(JSON.stringify(this.tableParams))
-      params.lineId = params.lineId == '-1' ? '':params.lineId
-      params.stationId = params.stationId == '-1' ?'':params.stationId
+      params.lineId = params.lineId == -1 ? '':params.lineId
+      params.stationId = params.stationId == -1 ?'':params.stationId
+      params.rankId = params.rankId == '-1' ?'':params.rankId
       this.loading = true
-      this.$get('metroapi/equipment/queryEquipmentPage', params).then(res=>{
+      this.$get('metroapi/alertfilter/queryStrategyFilterPage', params).then(res=>{
         this.loading = false
           if (res.httpCode == 1 ){
             this.tableData = res.data.data
             this.tableTotal = res.data.count
+            if (res.data.data.length==0) {
+              this.tablePage = 0
+            } else {
+              this.tablePage = res.data.count<= 10 ? 1: Math.ceil(res.data.count/this.tableParams.pageSize)
+            }
             if (res.data.data.length==0 && this.tableParams.pageNum>1) {
               this.tableParams.pageNum--
               return this.getTableData()
@@ -519,14 +510,13 @@ export default {
        this.formOption.stationId =val.value
       }
     },
-    selectModalApp (val) {
-      this.appParams.applicationId = val
-      this.formOption.equipmentType = ''
-      if (val) {
-        this.getAddEquipType( this.appParams)
-      }
-    },
-    // 获取新增设备类型 
+    // selectModalApp (val) {
+    //   this.appParams.applicationId = val
+    //   if (val) {
+    //     this.getAddEquipType( this.appParams)
+    //   }
+    // },
+    // 获取设备类型 
     getAddEquipType (params) {
       this.$get('metroapi/application/equipmentTypeInfo', params).then(res=>{
         if (res.httpCode == 1 ){
@@ -542,8 +532,9 @@ export default {
     },
     resetClick (name) {
      this.dateRange = []
-     this.tableParams.useDateBegin = ''
-     this.tableParams.useDateEnd = ''
+     this.tableParams.filterBeginTime = ''
+     this.tableParams.filterEndTime = ''
+     this.stationTypeData = [{ id: -1, stationName: '站点' }]
      this.$refs[name].resetFields()
      this.getTableData()
     },   
@@ -558,8 +549,7 @@ export default {
     editClick (row) {
       this.rowObj = row
       this.formOption = JSON.parse(JSON.stringify(row));
-      this.formOption.lineId = this.formOption.lineId ? String(this.formOption.lineId) : '-1'
-      this.formOption.stationId = this.formOption.stationId ? String(this.formOption.stationId) : '-1'
+      this.formOption.dates = [row.filterBeginTime,row.filterEndTime]
       this.getStationData(this.formOption.lineId)
       this.appParams.applicationId = this.formOption.appId
       this.getAddEquipType(this.appParams)
@@ -577,33 +567,22 @@ export default {
     modalChange (modalStatus) {
      if (!modalStatus) {
       this.$refs.formOption.resetFields();
+      this.stationTypeModalData = []
      }
     },
     modalOk (formName) {
-      console.log(this.formOption.useDate)
       let params = JSON.parse(JSON.stringify(this.formOption)) //把对象中的数据给了某个变量，改变一个对象的值，另一个对象也变化的解决方法
-      params.lineId = params.lineId == '-1' ? '':params.lineId
-      params.stationId = params.stationId == '-1' ? '':params.stationId
-      if (this.title == '新增设备') {
-        this.$refs[formName].validate((valid) => {
-          if (valid) {
-            this.$post('metroapi/equipment/addEquipment', params).then(res=>{
-              if ( res.httpCode == 1 ){
-                this.showModal = false
-                this.$Message.info(res.msg)
-                this.getTableData()
-              } else {
-                this.$Message.info(res.msg)
-              }
-            })
-          } else {
-            this.showModal = true
-          }
-       })
+      // params.lineId = params.lineId == '-1' ? '':params.lineId
+      // params.stationId = params.stationId == '-1' ? '':params.stationId
+      let url = ''
+      if (this.title == '新增策略') {
+        url = 'metroapi/alertfilter/addStrategyFilter'
       } else {
-        this.$refs[formName].validate((valid) => {
+        url = 'metroapi/alertfilter/editStrategyFilter'
+      }
+      this.$refs[formName].validate((valid) => {
           if (valid) {
-            this.$post('metroapi/equipment/editEquipment', params).then(res=>{
+            this.$post(url, params).then(res=>{
               if (res.httpCode == 1 ){
                 this.showModal = false
                 this.$Message.info(res.msg)
@@ -616,23 +595,52 @@ export default {
             this.showModal = true
           }
        })
-      }
     },
     modalCancel () {
       this.showModal = false
     },
     commonOk () {
-      let params = {
-        id: this.rowObj.id
+       if (this.commonTitle == '确认启用') {
+        let params = {
+          strategyFilterId: this.rowObj.id,
+          enabled: 1
+        }
+        this.getSwitchStatus(params)
+      } else if (this.commonTitle == '确认关闭') {
+        let params = {
+          strategyFilterId: this.rowObj.id,
+          enabled:0
+        }
+        this.getSwitchStatus(params)
+      } else {
+        let params = {
+          strategyFilterId: this.rowObj.id
+        }
+        this.delData(params)
       }
-      this.delData(params)
     },
     commonCancel () {
       this.modalStatus = false
     },
+    // 启用 关闭/接口
+    getSwitchStatus (params) {
+      this.$get('metroapi/alertfilter/enableStrategyFilter',params).then(res=>{
+        if (res.httpCode == 1 ){
+          if (params.enabled == 0) {
+            this.rowObj.enabled = 0
+          } else {
+            this.rowObj.enabled = 1
+          }
+          this.modalStatus = false
+        } else {
+          this.rowObj.enabled = 0
+          this.$Message.info(res.msg)
+        }
+      })
+    },    
     // 删除接口
     delData (params) {
-      this.$get('metroapi/equipment/delEquipment',params).then(res=>{
+      this.$get('metroapi/alertfilter/delStrategyFilter',params).then(res=>{
         if (res.httpCode == 1 ){
           this.modalStatus = false
           this.$Message.info(res.msg)
@@ -648,11 +656,11 @@ export default {
 <style scoped lang="stylus">
 .content-main-manage {
   position: relative;
-  height: calc(100% - 50px);
+  height: 100%;
 }
 .search-list {
   display: flex;
-  padding: 10px 0;
+  padding: 10px 0 0;
 }
 .search-left {
   display: flex;
@@ -669,6 +677,9 @@ export default {
      width: 160px;
      height: 32px;
    }
+    >>> .common-date-picker .ivu-input {
+    width: 210px;
+   }
    >>> .ivu-input-prefix, >>> .ivu-input-suffix {
      height: 32px;
      line-height: 32px;
@@ -689,10 +700,9 @@ export default {
 .common-form {
   display: flex;
   flex-wrap: wrap;
-  justify-content: space-between;
 }
 >>> .common-form-list .ivu-form-item {
-  margin-bottom: 0;
+  margin-bottom: 1px;
 }
 .manage-main-center {
   width: 100%;
@@ -702,13 +712,13 @@ export default {
   max-height: 100%;
 }
 >>> .common-table .ivu-table th {
-  height: 51px;
+  height: 50px;
  }
  >>> .common-table .ivu-table td {
-  height: 51px;
+  height: 49.5px;
  }
   >>> .common-table .ivu-spin-fix {
-   top: 51px;
+   top: 50px;
  }
   >>> .app-table .ivu-spin-fix {
    height: calc(100vh - 375px);
@@ -734,11 +744,20 @@ export default {
 .common-page {
   margin-top: 15px;
   display: flex;
+  align-items: center;
   justify-content: flex-end;
   position: absolute;
   bottom: 0;
   right: 0;
 }
+.common-page-total {
+  color: #fff;
+  padding-right: 10px;
+  font-size: 14px;
+  span {
+    color #409EFF;
+  }
+}
 /deep/ .ivu-input::-webkit-input-placeholder{
   color: #718EBD;
 }

src/views/homecomponents/EquipmentAnalysis/AlarmHandling.vue

@@ -1,29 +1,288 @@
 <template>
-<div>
- <!-- <div class="container" style="height:100%;overflow-x: hidden;overflow-y: auto;">
-    <div style="height: 2000px;background:yellow;position:relative;overflow:auto">
-     <span style="height: 500px;background:red;display:block">fggggggggggg</span>
-     <span style="height: 500px;background:blue;display:block">fggggggggggg</span>
-    </div>
-  </div> -->
-</div>
+  <div class="content-main">
+    <!-- <div class="content-body-wrap">
+     <div class="content-body">
+        <Tabs :value="currentTabs" @on-click="tabsClick" class="common-tabs">
+          <TabPane v-for="tab in tabsData" :key="tab.label" :label="tab.label" :name="tab.label"></TabPane>
+        </Tabs>
+         <Row :gutter="8" style="width:100%;height: calc(100% - 50px)">
+          <i-col span="5" style="height:100%">
+            <div class="station-tree">
+              <div class="station-tree-body">
+                <div class="station-tree-top">
+                  <Input suffix="ios-search" placeholder="请输入关键字查询" clearable search v-model="currentStation" class="common-search"  @on-search="iconChange" @on-clear="clearChange"/>
+                </div>
+                <div class="station-tree-center">
+                  <div class="station-tree-left common-scroll" v-show="showTree">
+                    <tree-list :defaultData="stationData" :currentStaData="currentStaData" :clickAllNode="true" v-if="stationData && stationData.length>0" @treeChange="treeChange" ref="tree"></tree-list>
+                  </div>
+                  <div class="station-tree-left-notree" v-show="!showTree">
+                    站点输入错误！
+                  </div>
+                </div>
+              </div>
+            </div>
+          </i-col>
+          <i-col span="19" style="height:100%">
+            <div class="right-main">
+              <unable-deter-alarm  ref="unableDeter" class="content-body-manage" v-if="currentTabs == '告警信息-无法判定等级'"></unable-deter-alarm>
+              <to-confirmed-alarm  ref="toConfirmed" class="content-body-manage" v-if="currentTabs == '告警信息-待确认'"></to-confirmed-alarm>
+              <confirmed-alarm  ref="confirmed" class="content-body-manage" v-if="currentTabs == '告警信息-已确认'"></confirmed-alarm>
+              <cleared-alarm ref="cleared" class="content-body-manage" v-if="currentTabs == '告警信息-已清除'"></cleared-alarm>
+              <filtered-alarm ref="filtered" class="content-body-manage" v-if="currentTabs == '告警信息-已过滤'"></filtered-alarm>
+              <comprehensive-infor ref="comprehensive" class="content-body-manage" v-if="currentTabs == '综合处理告警信息'"></comprehensive-infor>
+            </div>
+          </i-col>
+        </Row>
+     </div>
+    </div> -->
+  </div>
 </template>
 <script>
+import UnableDeterAlarm from './UnableDeterAlarm.vue'
+import ToConfirmedAlarm from './ToConfirmedAlarm.vue'
+import ConfirmedAlarm from './ConfirmedAlarm.vue'
+import ClearedAlarm from './ClearedAlarm.vue'
+import FilteredAlarm from './FilteredAlarm.vue'
+import ComprehensiveInfor from './ComprehensiveInfor.vue'
 export default {
   name: "AlarmHandling",
-  components:{
+   components:{
+    UnableDeterAlarm,ToConfirmedAlarm,ConfirmedAlarm,ClearedAlarm,FilteredAlarm,ComprehensiveInfor
   },
   data() {
     return {
+      currentStation: '',
+      currentStaData: [], // 当前搜索框搜索的站台数组对象，传给子组件，用来判断单选站台名当前选中状态
+      showTree: true,// 是否显示树形组件
+		  stationData: [],
+      tabsData: [{label:'告警信息-无法判定等级'},{label:'告警信息-待确认'},{label:'告警信息-已确认'},{label:'告警信息-已清除'},{label:'告警信息-已过滤'},{label:'综合处理告警信息'}],
+      currentTabs: '告警信息-无法判定等级',
     };
   },
   mounted() {
+    this.getCurrentTab (sessionStorage.getItem('currentTabs'))
+    this.getMetroLevel()
+  },
+   // 离开当前路由之前的钩子函数 
+  beforeRouteLeave(to, form, next) {
+    sessionStorage.removeItem('currentTabs')
+    next()
   },
   methods: {
-   
+     // 获取树形数据
+    getMetroLevel () {
+      this.$get('metroapi/lineStation/lineStationTree').then(res => {
+				if (res.httpCode == 1) {
+          this.stationData = res.data
+				}
+		  })
+    },
+    // 递归函数 每层数组的第一个对象里的属性expand 全展开(true)
+    getTree(arr) {
+      return arr.map((v,index) => {
+        if (index==0) {
+          v.expand = true
+        }
+        if (v.children) v.children = this.getTree(v.children);
+        return v;
+      });
+    },
+    iconChange: _.throttle(function() {
+      this.currentStaData = []
+      this.treeName = []
+      this.$nextTick(()=> {
+       this.getCurrentTab(this.currentTabs,this.currentStation)
+      })
+      if(this.currentStation != ''){
+        this.showTree = false
+        document.querySelector(".common-scroll").scrollTo(0, 0); // 滚动条回到顶部
+      } else {
+        document.querySelector(".common-scroll").scrollTo(0, 0); // 滚动条回到顶部
+        this.showTree = true
+        this.stationData = this.getTree(this.stationData)
+        return 
+      }
+      this.getSelectedItem()
+		}, 500),
+    clearChange () {
+      this.getSelectedItem()
+      this.getCurrentTab(this.currentTabs,this.currentStation)
+    },
+    getSelectedItem  () {
+      this.stationData.forEach((item, index,itemArr) => {
+        item.expand = false;
+        item.disabled = false; 
+        item.selected = false;
+        if (item.title == this.currentStation) {
+            item.selected = true;
+            item.disabled = true; // disabled 是否禁止选中 
+            item.expand = true;
+            this.currentStaData.push(item)
+            this.showTree = true
+        }
+        if (this.currentStation == '' && index == 0) {
+          item.expand = true
+        }
+        if (item.children) {
+          item.children.forEach((val, i,valArr) => {
+          val.expand = false; //expand 是否展开直子节点 
+          val.disabled = false; // disabled 是否禁止选中
+          val.selected = false;
+          if (val.title == this.currentStation) {
+            val.selected = true;
+            val.disabled = true; // disabled 是否禁止选中 
+            val.expand = true;
+            item.expand = true;
+            this.currentStaData.push(val)
+            this.showTree = true
+          }
+          if (this.currentStation == '' && i==0) {
+            val.expand = true
+          }
+          if (val.children) {
+            val.children.forEach ((lastVal,lastIndex) => {
+              lastVal.selected = false; //expand 是否展开直子节点 
+              lastVal.disabled = false; 
+              lastVal.expand = false;
+              if (lastVal.title == this.currentStation) {
+                lastVal.selected = true;
+                lastVal.disabled = true; // disabled 是否禁止选中 
+                lastVal.expand = true;
+                val.expand = true
+                item.expand = true
+                this.currentStaData.push(lastVal)
+                this.showTree = true
+              } 
+            })
+          } 
+        });
+        }    
+      });
+    },
+    treeChange(val,arr,level) {
+      this.currentStation = val
+      this.getCurrentTab(this.currentTabs,this.currentStation,arr,level)
+		},
+    tabsClick (name) {
+      this.stationData = this.getElseTree(this.stationData) // 切换tab页时，清除tree选中情况
+      this.currentStation = ''
+      sessionStorage.setItem("currentTabs",name)
+      this.getCurrentTab (name)
+      if (document.querySelector(".station-tree-left")) {
+        document.querySelector(".station-tree-left").scrollTo(0, 0) 
+      }
+    },
+    getCurrentTab (currentTabs,currentStation,arr,level) {
+      this.currentTabs = currentTabs || '告警信息-无法判定等级'
+      if (currentTabs == '告警信息-无法判定等级' || !currentTabs) {
+         this.$nextTick(()=> {
+          this.$refs.unableDeter.getTableData(currentStation,arr,level)
+          this.$refs.unableDeter.getType()
+        })
+      } else if(currentTabs == '告警信息-待确认'){       
+        this.$nextTick(()=> {
+          this.$refs.toConfirmed.getTableData(currentStation,arr,level)
+          this.$refs.toConfirmed.getType()
+        })
+      } else if(currentTabs == '告警信息-已确认'){
+        this.$nextTick(()=> {
+          this.$refs.confirmed.getTableData(currentStation,arr,level)
+          this.$refs.confirmed.getType()
+        })
+      } else if(currentTabs == '告警信息-已清除'){
+        this.$nextTick(()=> {
+          this.$refs.cleared.getTableData(currentStation,arr,level)
+          this.$refs.cleared.getType()
+        })
+      } else if(currentTabs == '告警信息-已过滤'){
+        this.$nextTick(()=> {
+          this.$refs.filtered.getTableData(currentStation,arr,level)
+          this.$refs.filtered.getType()
+        })
+      } else {
+         this.$nextTick(()=> {
+          this.$refs.comprehensive.getTableData(currentStation,arr,level)
+          this.$refs.comprehensive.getType()
+        })
+      }
+    },
+    // 递归函数 每层数组的第一个对象里的属性expand 全展开(true)
+    getElseTree(arr) {
+      return arr.map((v,index) => {
+        if (v.title==this.currentStation) {
+          v.selected = false
+          v.disabled = false
+        }
+        if (index == 0) {
+          v.expand = true
+        } else {
+          v.expand = false
+        }
+        if (v.children) v.children = this.getElseTree(v.children);
+        return v;
+      });
+    },
   }
 };
 </script>
 <style scoped lang="stylus">
-
+.content-main {
+  width: 100%;
+  height: calc(100% - 50px);
+  overflow: hidden;
+}
+.content-body-wrap {
+  width: 100%;
+  height: 100%;
+  background: #06214D;
+}
+.content-body {
+  width: 100%;
+  height: 100%;
+  background: #06214D;
+  padding: 10px;
+}
+.common-search {
+  width: 100%;
+}
+>>> .common-search .ivu-input {
+  background-color: #06214D;
+  border: 1px solid #2355A6;
+  border-radius: 15px;
+  color: #fff;
+  height: 32px;
+}
+>>> .common-search .ivu-input:focus {
+    border-color: #0185ea;
+}
+.station-tree {
+  height: 100%;
+  padding: 10px;
+}
+.station-tree-body {
+  border: 1px solid #204384;
+  height: 100%;
+  padding: 10px;
+}
+.station-tree-center {
+  height: calc(100% - 32px);
+  padding-top: 10px;
+}
+.station-tree-left {
+  height: 100%;
+  overflow: auto;
+}
+.station-tree-left-notree {
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #fff;
+  fon-size: 14px;
+}
+.right-main {
+  height: 100%;
+  padding: 10px 0;
+}
 </style>

src/views/homecomponents/EquipmentAnalysis/AlarmLevelConfig.vue

@@ -139,7 +139,7 @@
             <span class="modal-content-item-value"  v-if="val.name == '警示颜色'">
               <i class="iconfont icon-gaojing1" style="vertical-align: middle" :style="'color:' + val.value"></i>
             </span>
-            <span class="modal-content-item-value" v-else :class="{'item-especial-value': val.name == '已标注告警'}">
+            <span class="modal-content-item-value" v-else :class="{'item-especial-value': val.name == '已标注告警'}" @click="go(val)">
               <Tooltip placement="top-start" transfer max-width="350" v-if="val.value || val.value===0">
                 {{val.name == '已标注告警' ?  val.value+'次' : val.value}}
                 <div slot="content">
@@ -167,6 +167,7 @@ export default {
       modalLoading: true,
       tableParams: {
         keywords: '',
+        enabled: '',
         beginDate: '',
         endDate: '',
         pageNum: 1,
@@ -218,18 +219,19 @@ export default {
                 nativeOn:{
                     "mousedown":(event)=>{ // 监听组件原生事件mousedown,此事件在click之前触发
                       this.rowObj =  params.row
-                      if (params.row.enabled == 0) {
-                        this.commonTitle = '确认启用'
-                        this.activeColor = '#57C44F'
-                        this.activeClass = 'icon-qiyong'
-                        this.modalTitle = '启用后，请手动开启等级对应策略。'
-                        this.modalStatus = true
-                      } else {
+                      if (params.row.enabled == 1) {
                         this.commonTitle = '确认关闭'
                         this.activeColor = '#E92E2E'
                         this.activeClass = 'icon-guanbi'
                         this.modalTitle = '关闭后将无法新增类型对应策略，该等级将从系统筛选选择项中消失。'
                         this.modalStatus = true
+                      } else {
+                         this.commonTitle = '确认启用'
+                        this.activeColor = '#57C44F'
+                        this.activeClass = 'icon-qiyong'
+                        this.modalTitle = '启用后，请手动开启等级对应策略。'
+                        this.modalStatus = true
+                        
                       }
                     },
                   }
@@ -275,6 +277,16 @@ export default {
     this.getTableData()
   },
   methods: {
+    // 跳转到综合查询页面
+    go (val) {
+      if (val.name == '已标注告警') {
+        let menuNameArr = []
+        menuNameArr = ['设备分析','告警分析','综合查询']
+        sessionStorage.setItem('routname', '/MainPage/ComprehensiveQuery')
+        sessionStorage.setItem('menuNameArr',JSON.stringify(menuNameArr))
+        this.$router.push({ name: 'ComprehensiveQuery', params: { alertRankId:this.rowObj.id }})
+      }
+    },
     changePicker (date) {
       this.tableParams.beginDate = date[0]
       this.tableParams.endDate = date[1]
@@ -470,9 +482,12 @@ export default {
      height: 100%;
    }
     >>> .ivu-input {
-     width: 150px;
+     width: 160px;
      height: 32px;
    }
+   >>> .common-date-picker .ivu-input {
+    width: 210px;
+   }
     >>> .ivu-input-prefix, >>> .ivu-input-suffix {
      height: 32px;
      line-height: 32px;
@@ -589,7 +604,7 @@ export default {
 >>> .item-especial-bot .modal-content-item-value {
   border-bottom: 1px solid #21437B;
 }
->>> .item-especial-value {
+>>> .item-especial-value .ivu-tooltip-rel{
   cursor: pointer;
   text-decoration: underline;
 }

src/views/homecomponents/EquipmentAnalysis/AlarmMonitor.vue

@@ -1,13 +1,8 @@
 <template>
   <div class="container">
-    <!-- <Input
-          prefix="ios-search"
-          v-model="searchName"
-          clearable
-          placeholder="请输入名称"
-          @on-enter="searchTree"
-        />
-        <Tree :data="treeData" @on-select-change="selectChange"></Tree> -->
+    <!-- 模糊查询 -->
+    <!-- <Input placeholder="输入关键字进行过滤" v-model="filterText"/>
+    <Tree :data="data" show-checkbox></Tree> -->
     <!-- 简单模糊查询 -->
     <!-- <input type="text" placeholder="请输入..." v-model="searchVal" />
     <ul>
@@ -22,7 +17,6 @@
 </template>
 <script>
 import _ from "lodash";
-import { listToTree } from "./listToTree.js";
 export default {
   name: "AlarmMonitor",
   components: {},
@@ -55,52 +49,62 @@ export default {
           value: "jd",
         },
       ],
-       treeRawData:[{
-          id: 1,
-          title: '一级 1',
-          children: [{
-            id: 4,
-            title: '二级 1-1',
-            children: [{
-              id: 9,
-              title: '三级 1-1-1'
-            }, {
-              id: 10,
-              title: '三级 1-1-2'
-            }]
-          }]
-        }, {
-          id: 2,
-          title: '一级 2',
-          children: [{
-            id: 5,
-            title: '二级 2-1'
-          }, {
-            id: 6,
-            title: '二级 2-2'
-          }]
-        }, {
-          id: 3,
-          title: '一级 3',
-          children: [{
-            id: 7,
-            title: '二级 3-1'
-          }, {
-            id: 8,
-            title: '二级 3-2'
-          }]
-        }],
-      treeData: [], //前端处理后的数据
-      searchName: "", //输入框绑定的数据
-      currentId: "", //需要选中的节点id
-      newList: []
+       filterText:null,
+                flag:0,
+                data:[],
+                data2:  [{
+                    expand: true,
+                    title: '一级 1',
+                    children: [{
+                        expand: true,
+                        title: '二级 1-1',
+                        children: [
+                            {
+                            expand: true,
+                            title: '三级 1-1-2',
+                            children: [
+                                {
+                                expand: true,
+                                title: '四级 1-1-3-4'
+                                }]
+                            }, 
+                            {
+                            expand: true,
+                            title: '三级 1-1-2'
+                            }
+                        ]
+                    }]
+                    }, {
+                    expand: true,
+                    title: '一级 2',
+                    children: [{
+                        expand: true,
+                        title: '二级 2-1'
+                    }, {
+                        expand: true,
+                        title: '二级 2-2'
+                    }]
+                    }, {
+                    expand: true,
+                    title: '一级 3',
+                    children: [{
+                        expand: true,
+                        title: '二级 3-1'
+                    }, {
+                        expand: true,
+                        title: '二级 3-2'
+                    }]
+                    }],
     };
   },
+  watch: {
+      filterText(val) {
+          let arr=JSON.parse(JSON.stringify(this.data2))
+          this.data=this.filterNode(val,arr)
+      }
+  },
   mounted() {
-    this.treeData = this.treeRawData
-    // this.treeData = listToTree(this.treeRawData); //将后端返回的list数据转化为树结构
-    // console.log(this.treeData)
-    // this.getMetroLevel()
+    this.data=this.data2
   },
   computed: {
     NewItems() {
@@ -115,59 +119,31 @@ export default {
     },
   },
   methods: {
-    // 获取树形数据
-    getMetroLevel () {
-      this.$get('metroapi/application/appEquipmentTypeTree').then(res => {
-				if (res.httpCode == 1) {
-          this.treeData = res.data
-				}
-		  })
-    },
-     getTree(arr) {
-      return arr.map((v,index) => {
-         if (v.title.indexOf(this.searchName) !== -1) {
-            this.currentId = v.id
-            this.treeData = this.fineCurrentIdRecursive(v)
-          }
-          if (v.children) v.children = this.getTree(v.children);
-          return v;
-        });
-    },
-    getTree(arr) {},
-      //输入节点名称后按回车健搜索
-    searchTree() {
-      this.treeData = this.getTree(this.treeData)
-    },
-
-            //通过节点id选中树中节点并展开它的父节点-递归方式
-            fineCurrentIdRecursive(list) {
-                for (var i = 0; i < list.length; i++) {
-                    if (list[i].id === this.currentId) {
-                      this.newList.push(list[i])
-                        // list[i].selected = true; //如果节点id等于currentId，则选中该节点
-                        break;
-                    } else {
-                        if (list[i].children && list[i].children.length > 0) {
-                            list[i].children = this.fineCurrentIdRecursive(list[i].children); //找不到想要的节点则继续找孩子的（递归）
-                            for (var j = 0; j < list[i].children.length; j++) {
-                                if (list[i].children[j].selected || list[i].children[j].expand) {
-                                   this.newList.push(list[i])
-                                    // list[i].expand = true; //如果子节点（末端节点）选中或者子节点（非末端节点）展开，则展开该子节点的父节点
-                                    break;
-                                }
+     //过滤树节点
+            filterNode(val,List){
+                //过滤出满足条件的数组
+                let List1=List.filter(item=>{
+                    //如果该元素有children，则优先处理children的
+                    if(item.children){
+                        //过滤children里面满足条件的
+                        item.children=this.filterNode(val,item.children)
+                        //如果children里面没有满足条件的，则进入，否则返回true
+                        if(!item.children.some(item1=>item1.title.indexOf(val) !== -1)){
+                            //判断children里面是否还有一层children,如果有则对内层children继续调用函数判断，否则返回title中含有关键字的元素
+                            if(item.children.some(item1=>item1.children)){
+                                item.children.forEach(item2 => {
+                                    item2.children&&this.filterNode(val,item2.children)
+                                });
+                            }else{
+                                return item.title.indexOf(val) > -1
                             }
-                        }
+                        }   
+                        return true
                     }
-                }
-                console.log(this.newList)
-                return this.newList
-                // console.log(list)
-                // return list;
-            },
-
-            // 点击节点文字展开收起
-            selectChange(data, selectedNode) {
-                // this.$set(selectedNode, "expand", !selectedNode.expand);
+                    //返回title中含有关键字的元素
+                    return item.title.indexOf(val) > -1
+                })
+                return List1
             }
   },
 };

src/views/homecomponents/EquipmentAnalysis/ClearedAlarm.vue

@@ -0,0 +1,629 @@
+<template>
+  <div class="content-main-manage">
+    <div class="search-list">
+      <div class="search-left">
+        <Form class="common-form common-form-list" ref="tableParams" :model="tableParams" inline>
+           <FormItem label="" prop="alertRankId">
+            <Select v-model="tableParams.alertRankId" placeholder="告警等级">
+              <Option v-for="item in alarmLevelData" :value="item.id" :key="item.id">{{ item.name }}</Option>
+            </Select>
+          </FormItem>
+          <FormItem label="" prop="applicationId">
+            <Select v-model="tableParams.applicationId" placeholder="来源应用" @on-change="selectApp">
+              <Option v-for="item in appData" :value="item.id" :key="item.id">{{ item.appName }}</Option>
+            </Select>
+          </FormItem>
+          <FormItem label="" prop="equipmentTypeId">
+            <Select v-model="tableParams.equipmentTypeId" placeholder="设备类型">
+              <Option v-for="item in equipTypeData" :value="item.equipmentTypeId" :key="item.equipmentTypeId">{{ item.equipmentName }}</Option>
+            </Select>
+          </FormItem>
+          <FormItem label="">
+            <DatePicker type="daterange" :value="dateRange" :clearable="false" class="common-date-picker date-picker-main" placement="bottom-end" placeholder="告警时间范围" @on-change="changePicker"></DatePicker>
+          </FormItem>
+          <FormItem label="">
+            <DatePicker type="daterange" :value="dateOperateRange" :clearable="false" class="common-date-picker date-picker-main" placement="bottom-end" placeholder="操作时间范围" @on-change="changeOperatePicker"></DatePicker>
+          </FormItem>
+          <FormItem label="" prop="keywords">
+            <Input placeholder="请输入关键字查询" clearable search v-model="tableParams.keywords" />
+          </FormItem>
+          <FormItem label="" >
+            <Button type="primary" class="common-btn-search" @click="searchClick">
+              <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 筛选
+            </Button> 
+            <Button type="primary" class="common-btn-search" style="margin-left:10px" @click="resetClick('tableParams')">
+              <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 重置
+            </Button>   
+          </FormItem>
+        </Form>
+      </div>
+    </div>
+     <div class="btn-container">
+      <span class="btn-container-download" style="opacity: 0">
+        <i class="iconfont icon-xiazai" style="cursor:pointer;color:#0185EA;fontSize:20px;marginRight:6px"></i>下载列表筛选结果
+      </span>
+      <div>
+        <Button class="common-operate-btn common-corrections" @click="correctClick"> 
+          <i class="iconfont icon-gengzhenggonggao" style="vertical-align: middle;cursor:pointer;color:#ffffff;fontSize:20px;marginRight:6px"></i>
+          批量手动修正
+        </Button>
+        <!-- <Button class="common-add-btn common-forward">
+          <i class="iconfont icon-zhuanfafenxiang" style="cursor:pointer;color:#ffffff;fontSize:20px;marginRight:6px"></i>
+          批量转发通知
+        </Button> -->
+      </div>
+    </div>
+    <div class="manage-main-center">
+      <Table :columns="columns" :data="tableData" class="common-table app-table" no-data-text="" :row-class-name="rowClassName" :loading="loading" @on-selection-change="selectChange">
+        <template slot="loading">
+            <Loading-animation></Loading-animation>
+        </template>
+        <template slot-scope="{ row }" slot="alertRankColor">
+          <i class="iconfont icon-gaojing1" style="vertical-align: middle" :style="'color:' + row.alertRankColor"></i>
+        </template>
+         <template slot-scope="{ row }" slot="action">
+           <Tooltip content="详情" placement="top">
+              <i class="iconfont icon-xiangqingmingxi" style="cursor:pointer;color:#B8B532;fontSize:20px;marginRight:6px" @click="detailClick(row)"></i>
+           </Tooltip>
+           <Tooltip content="修正" placement="top">
+              <i class="iconfont icon-gengzhenggonggao" style="cursor:pointer;color:#0BB0DE;fontSize:20px;marginRight:6px" @click="correctClick(row)"></i>
+           </Tooltip>
+        </template>
+      </Table>
+    </div>
+    <div class="common-page">
+      <div class="common-page-total">
+        共<span>{{tablePage}}</span>页 / <span>{{tableTotal}}</span>条数据
+      </div>
+      <Page :total="tableTotal" :current="tableParams.pageNum" :page-size="tableParams.pageSize" @on-change="changePage" @on-page-size-change="sizeChange" show-elevator />
+    </div>
+    <Modal
+      v-model="showModal"
+      :title="title"
+      width="25"
+      ref="modalGrag"
+      draggable
+      reset-drag-position
+      @on-visible-change="modalChange"
+      :mask-closable="false"
+      class-name="common-modal">
+      <Form class="common-form" ref="formOption" :model="formOption" :label-width="0">
+        <div class="common-form-item-text">
+          将选中的告警信息等级，修正为
+        </div>
+        <FormItem label="" prop="alertRankId" style="width:100%">
+          <Select v-model="formOption.alertRankId" placeholder="告警等级">
+            <Option v-for="item in alarmLevelModalData" :value="item.id" :key="item.id">{{ item.name }}</Option>
+          </Select> 
+        </FormItem>
+        <FormItem label="" prop="alertRankId" style="width:100%">
+          <Select v-model="formOption.alertRankId" placeholder="告警状态">
+            <Option v-for="item in alarmModalStatus" :value="item.id" :key="item.id">{{ item.value }}</Option>
+          </Select> 
+        </FormItem>
+			</Form>
+      <div slot="footer">
+          <Button @click="modalCancel">取消</Button>
+          <Button type="primary" @click="modalOk">确定</Button>
+        </div>
+    </Modal>
+  </div>
+</template>
+<script>
+const defaultFrom = {alertRankId: null,processingStatus:null}
+export default {
+  name: "ClearedAlarm",
+  components:{
+  },
+  data() {
+    return {
+       alarmParams: {
+        keywords: '',
+        enabled: 1,
+        beginDate: '',
+        endDate: '',
+        pageNum: 1,
+        pageSize: 10
+      },
+      applicationParams: {
+        level: '',
+        lineId: '',
+        stationId: '',
+        equipmentCheck: '',
+        instrumentCheck: '',
+        pageNum: 1,
+        pageSize: 9999
+      },
+      appParams: {
+        applicationId: '',
+        equipmentTypeId: '',
+        keywords: '',
+        pageNum: 1,
+        pageSize: 9999
+      },
+      loading: true,
+      dateRange: [],
+      dateOperateRange: [],
+      tableParams: {
+        processingStatus: 40,
+        keywords: '',
+        applicationId:'',
+        equipmentTypeId: '',
+        alertRankId: '',
+        beginAlertTime: '',
+        endAlertTime: '',
+        beginUpdateTime: '',
+        endUpdateTime: '',
+        alertRankEnabled: 1,
+        pageNum: 1,
+        pageSize: 10
+      },
+      tableData: [],
+      tableTotal: 0,
+      tablePage: 0,
+      rowObj: {},
+      lineTypeData: [],
+      stationTypeData: [],
+      alarmLevelData: [],
+      alarmLevelModalData: [],
+      equipTypeData: [],
+      appData: [],
+      alarmModalStatus: [],
+      columns: [
+          {
+            type: 'selection',
+            width: 60,
+            align: 'center'
+          },
+          {
+            title: '告警等级',
+            key: 'alertRankName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '警示颜色',
+            slot: 'alertRankColor',
+            align: 'center',
+          },
+          {
+            title: '设备类型',
+            key: 'equipmentTypeName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '设备名称',
+            key: 'equipmentName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+           {
+            title: '告警内容',
+            key: 'alertContent',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '来源应用',
+            key: 'appName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          }, 
+          {
+            title: '告警时间',
+            key: 'alertTime',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '处理状态',
+            key: 'processingStatusDesc',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+           {
+            title: '操作时间',
+            key: 'updateTime',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '操作人',
+            key: '',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+          title: '操作',
+          align: 'center',
+          slot: 'action',
+          width: 120,
+        }
+      ],
+      showModal: false,
+      title: '告警信息修正',
+      dateModalRange: [],
+      formOption: {alertRankId: null,processingStatus:null},
+      idArr: []
+    };
+  },
+  mounted() {
+  },
+  methods: {
+    go (){
+      // this.$router.push({path:'//ApplicationManage'})
+      // this.$router.push({path:'/MainPage/ApplicationManage/2'})
+      this.$router.push({ name: 'ApplicationManage', params: { type:2 }}) // -> /home/123
+    },
+    changePicker (date) {
+      this.tableParams.beginAlertTime = date[0]
+      this.tableParams.endAlertTime = date[1]
+    },
+    changeOperatePicker (date) {
+      this.tableParams.beginUpdateTime = date[0]
+      this.tableParams.endUpdateTime = date[1]
+    },
+    rowClassName(row, index) {
+      if (index % 2 == 0) {
+        return "ivu-table-stripe-even";
+      } else {
+        return "ivu-table-stripe-odd";
+      }
+    },
+    // 分页
+    changePage (val) {
+      this.tableParams.pageNum = val
+      this.getTableData()
+    },
+    //跳转
+    sizeChange (val) {
+      this.tableParams.pageSize = val
+      this.getTableData()
+    },
+    getType  () {
+      // 获取归属应用
+      this.$get('metroapi/application/info/list', this.applicationParams).then(res=>{
+        if (res.httpCode == 1 ){
+          this.appData = res.data.data
+          this.appData.unshift({ id: '-1', appName: '来源应用' })
+        } else {
+          this.appData = []
+        }
+      })
+      // 告警等级
+      this.$get('metroapi/alert/rank/list', this.alarmParams).then(res=>{
+        if (res.httpCode == 1 ){
+          this.alarmLevelModalData = JSON.parse(JSON.stringify(res.data.data))
+          this.alarmLevelData = res.data.data
+          this.alarmLevelData.unshift({ id: '-1', name: '告警等级' })
+        } else {
+          this.alarmLevelData = []
+          this.alarmLevelModalData = []
+        }
+      })
+      // 告警状态
+      this.$get('metroapi/dic/queryDictionary', {name:'告警处理状态'}).then(res=>{
+        if (res.httpCode == 1 ){
+          this.alarmModalStatus = res.data
+        } else {
+          this.alarmModalStatus = []
+        }
+      })
+    },
+    selectChange (selection) {
+      this.idArr = selection.map(item => item.id)
+    },
+    // 获取表格数据
+    getTableData (keywords,arr,level) {
+       if (level) {
+        this.tableParams.keywords = ''
+        if (level == 2) {
+          this.tableParams.lineId = arr[arr.length-1]
+          this.tableParams.stationId = ''
+        } else if (level == 3) {
+          this.tableParams.lineId = arr[arr.length-2]
+          this.tableParams.stationId = arr[arr.length-1]
+        } else {
+          this.tableParams.lineId = ''
+          this.tableParams.stationId = ''
+        }
+      } else {
+        this.tableParams.lineId = ''
+        this.tableParams.stationId = ''
+        if (keywords == '合肥轨道交通' || keywords == '' || !keywords) {
+          this.tableParams.oneKeywords = ''
+        } else {
+          this.tableParams.oneKeywords = keywords
+        }
+      }
+      let params = JSON.parse(JSON.stringify(this.tableParams))
+      params.alertRankId = params.alertRankId == '-1' ? '':params.alertRankId
+      params.applicationId = params.applicationId == '-1' ? '':params.applicationId
+      params.equipmentTypeId = params.equipmentTypeId == '-1' ? '':params.equipmentTypeId 
+      this.loading = true
+      this.$get('metroapi/alert/processing/details', params).then(res=>{
+        this.loading = false
+          if (res.httpCode == 1 ){
+            this.tableData = res.data.data
+            this.tableTotal = res.data.count
+            if (res.data.data.length==0) {
+              this.tablePage = 0
+            } else {
+              this.tablePage = res.data.count<= 10 ? 1: Math.ceil(res.data.count/this.tableParams.pageSize)
+            }
+            if (res.data.data.length==0 && this.tableParams.pageNum>1) {
+              this.tableParams.pageNum--
+              return this.getTableData()
+            }
+          } else {
+            this.tableData = []
+            this.tableTotal = 0
+          }
+        })
+    },
+    selectApp (val) {
+      this.appParams.applicationId = val
+      this.tableParams.equipmentTypeId = ''
+      if (val) {
+        this.getAddEquipType( this.appParams)
+      }
+    },
+    // 获取设备类型 
+    getAddEquipType (params) {
+      if (params.applicationId == '-1') {
+        this.equipTypeData = [{ equipmentTypeId: '-1', equipmentName: '设备类型' }]
+      } else {
+        this.$get('metroapi/application/equipmentTypeInfo', params).then(res=>{
+          if (res.httpCode == 1 ){
+            this.equipTypeData = res.data.data
+            this.equipTypeData.unshift({ equipmentTypeId: '-1', equipmentName: '设备类型' })
+          } else {
+            this.equipTypeData = []
+          }
+        })
+      }
+    },
+    searchClick () {
+      this.getTableData()
+      // this.$router.push({ path: '/MainPage/ApplicationManage',  query: {deptName: "2"}})
+    },
+    resetClick (name) {
+     this.dateRange = []
+     this.tableParams.beginAlertTime = ''
+     this.tableParams.endAlertTime = ''
+     this.dateOperateRange = []
+     this.tableParams.beginUpdateTime = ''
+     this.tableParams.endUpdateTime =  ''
+     this.equipTypeData = [{ equipmentTypeId: '-1', equipmentName: '设备类型' }]
+     this.$refs[name].resetFields()
+     this.getTableData()
+    },   
+    correctClick (row) {
+      this.rowObj = row
+      if (row.id || this.idArr.length>0) {
+        this.formOption = JSON.parse(JSON.stringify(defaultFrom))
+        this.title = '告警信息修正'
+        this.showModal = true
+      } else {
+        this.$Message.info('请至少选择一条数据')
+      }
+    },
+    correctData (params) {
+      this.$post('metroapi/alert/processing/update/status',params).then(res=>{
+        if (res.httpCode == 1 ){
+          this.showModal = false
+          this.$Message.info(res.msg)
+          this.getTableData()
+        } else {
+          this.$Message.info(res.msg)
+        }
+      })
+    },
+    modalChange (modalStatus) {
+     if (!modalStatus) {
+      this.$refs.formOption.resetFields();
+      this.idArr = []
+     }
+    },
+    modalOk () {
+      let params = {
+        alertIds: this.idArr.join() || Number(this.rowObj.id),
+        processingStatus: this.formOption.processingStatus,
+        alertRankId: this.formOption.alertRankId,
+      }
+      this.correctData(params)
+    },
+    modalCancel () {
+      this.showModal = false
+    },
+    commonOk () {
+      let params = {
+        id: this.rowObj.id
+      }
+      this.delData(params)
+    },
+    commonCancel () {
+      this.modalStatus = false
+    },
+    // 删除接口
+    delData (params) {
+      this.$get('metroapi/equipment/delEquipment',params).then(res=>{
+        if (res.httpCode == 1 ){
+          this.modalStatus = false
+          this.$Message.info(res.msg)
+          this.getTableData()
+        } else {
+          this.$Message.info(res.msg)
+        }
+      })
+    },
+  }
+};
+</script>
+<style scoped lang="stylus">
+.content-main-manage {
+  position: relative;
+  height: 100%;
+}
+.search-list {
+  display: flex;
+  padding: 10px 0 0;
+}
+.search-left {
+  display: flex;
+  align-items: center;
+   .ivu-select {
+     width: 155px;
+     padding-right: 10px;
+     height: 32px;
+   }
+   .ivu-select-single .ivu-select-selection {
+     height: 100%;
+   }
+   >>> .ivu-input {
+     width: 160px;
+     height: 32px;
+   }
+   >>> .common-date-picker .ivu-input {
+    width: 210px;
+   }
+   >>> .ivu-input-prefix, >>> .ivu-input-suffix {
+     height: 32px;
+     line-height: 32px;
+   }
+   >>> .ivu-input-icon {
+     height: 32px;
+     line-height: 32px;
+   }
+   >>> .date-picker-main .ivu-date-picker-header {
+    border-bottom: 0.0052083333rem solid #204384;
+ }
+}
+.btn-container {
+  display: flex;
+  justify-content: space-between;
+  padding-bottom: 10px;
+  color: #0185EA;
+  font-size: 14px;
+  .btn-container-download {
+    cursor: pointer;
+  }
+  .common-corrections {
+    background: #053B4A;
+    border: 1px solid #0098C2;
+    color: #FFFFFF;
+    margin-right: 5px;
+  }
+  .common-eliminate {
+    background: #4C2215;
+    border: 1px solid #8E1919;
+    color: #FFFFFF;
+    margin-right: 5px;
+  }
+  .common-confirm {
+    background: #0C3423;
+    border: 1px solid #08AF68;
+    color: #FFFFFF;
+    margin-right: 5px;
+  }
+  .common-forward {
+    background: #413A09;
+    border: 1px solid #A69311;
+    color: #FFFFFF;
+  }
+}
+.common-form {
+  display: flex;
+  flex-wrap: wrap;
+}
+>>> .common-form-list .ivu-form-item {
+  margin-bottom: 10px;
+}
+.manage-main-center {
+  width: 100%;
+  height: calc(100% - 150px);
+}
+.common-table {
+  max-height: 100%;
+}
+>>> .common-table .ivu-table th {
+  height: 50px;
+ }
+ >>> .common-table .ivu-table td {
+  height: 49.5px;
+ }
+  >>> .common-table .ivu-spin-fix {
+   top: 50px;
+ }
+  >>> .app-table .ivu-spin-fix {
+   height: calc(100vh - 375px);
+ }
+ >>> .ivu-table-tip {
+  background: url('../../../assets/images/noData.png') no-repeat center;
+}
+>>> .app-table .ivu-table-tip {
+  height: calc(100vh - 375px);
+ }
+ >>> .common-table .ivu-table-tip table {
+ display: none;
+}
+ >>> .modal-table {
+   overflow: auto !important;
+ }
+ >>> .modal-table .ivu-spin-fix {
+   height: 200px;
+ }
+  >>> .modal-table .ivu-table-tip {
+   height: 200px;
+ }
+.common-page {
+  margin-top: 15px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+}
+.common-page-total {
+  color: #fff;
+  padding-right: 10px;
+  font-size: 14px;
+  span {
+    color #409EFF;
+  }
+}
+.common-form-item-text {
+  font-size: 11px;
+  color: #85A3D4;
+  margin: 10px 0;
+}
+/deep/ .ivu-input::-webkit-input-placeholder{
+  color: #718EBD;
+}
+/deep/ .ivu-input::-moz-placeholder{   /* Mozilla Firefox 19+ */
+  color: #718EBD;
+}
+/deep/ .ivu-input::-moz-placeholder{    /* Mozilla Firefox 4 to 18 */
+  color: #718EBD;
+}
+/deep/ .ivu-input::-ms-input-placeholder{  /* Internet Explorer 10-11 */
+  color: #718EBD;
+}
+.common-modal-select {
+  color: #fff;
+  font-size: 14px;
+  margin-bottom: 10px;
+  margin-left: 35PX;
+}
+</style>

src/views/homecomponents/EquipmentAnalysis/ComprehensiveInfor.vue

@@ -0,0 +1,709 @@
+<template>
+  <div class="content-main-manage">
+    <div class="search-list">
+      <div class="search-left">
+        <Form class="common-form common-form-list" ref="tableParams" :model="tableParams" inline>
+           <FormItem label="" prop="alertRankId">
+            <Select v-model="tableParams.alertRankId" placeholder="告警等级">
+              <Option v-for="item in alarmLevelData" :value="item.id" :key="item.id">{{ item.name }}</Option>
+            </Select>
+          </FormItem>
+          <FormItem label="" prop="applicationId">
+            <Select v-model="tableParams.applicationId" placeholder="来源应用" @on-change="selectApp">
+              <Option v-for="item in appData" :value="item.id" :key="item.id">{{ item.appName }}</Option>
+            </Select>
+          </FormItem>
+          <FormItem label="" prop="equipmentTypeId">
+            <Select v-model="tableParams.equipmentTypeId" placeholder="设备类型">
+              <Option v-for="item in equipTypeData" :value="item.equipmentTypeId" :key="item.equipmentTypeId">{{ item.equipmentName }}</Option>
+            </Select>
+          </FormItem>
+           <FormItem label="" prop="processingStatus">
+            <Select v-model="tableParams.processingStatus" placeholder="处理状态">
+              <Option v-for="item in alarmStatus" :value="item.id" :key="item.id">{{ item.value }}</Option>
+            </Select>
+          </FormItem>
+          <FormItem label="">
+            <DatePicker type="daterange" :value="dateRange" :clearable="false" class="common-date-picker date-picker-main" placement="bottom-end" placeholder="告警时间范围" @on-change="changePicker"></DatePicker>
+          </FormItem>
+           <FormItem label="">
+            <DatePicker type="daterange" :value="dateOperateRange" :clearable="false" class="common-date-picker date-picker-main" placement="bottom-end" placeholder="操作时间范围" @on-change="changeOperatePicker"></DatePicker>
+          </FormItem>
+          <FormItem label="" prop="keywords">
+            <Input placeholder="请输入关键字查询" clearable search v-model="tableParams.keywords" />
+          </FormItem>
+          <FormItem label="" >
+            <Button type="primary" class="common-btn-search" @click="searchClick">
+              <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 筛选
+            </Button> 
+            <Button type="primary" class="common-btn-search" style="margin-left:10px" @click="resetClick('tableParams')">
+              <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 重置
+            </Button>   
+          </FormItem>
+        </Form>
+      </div>
+    </div>
+     <div class="btn-container">
+      <span class="btn-container-download" style="opacity: 0">
+        <i class="iconfont icon-xiazai" style="cursor:pointer;color:#0185EA;fontSize:20px;marginRight:6px"></i>下载列表筛选结果
+      </span>
+      <div>
+        <Button class="common-operate-btn common-corrections" @click="correctClick"> 
+          <i class="iconfont icon-gengzhenggonggao" style="cursor:pointer;color:#ffffff;fontSize:20px;marginRight:6px"></i>
+          批量手动修正
+        </Button>
+         <Button class="common-operate-btn common-eliminate" @click="delClick"> 
+          <i class="iconfont icon-shanchu" style="cursor:pointer;color:#ffffff;fontSize:20px;marginRight:6px"></i>
+          批量清除告警
+        </Button>
+         <Button class="common-operate-btn common-confirm" @click="queenClick"> 
+          <i class="iconfont icon-queren" style="cursor:pointer;color:#ffffff;fontSize:20px;marginRight:6px"></i>
+          批量确认告警
+        </Button>
+        <!-- <Button class="common-add-btn common-forward">
+          <i class="iconfont icon-zhuanfafenxiang" style="cursor:pointer;color:#ffffff;fontSize:20px;marginRight:6px"></i>
+          批量转发通知
+        </Button> -->
+      </div>
+    </div>
+    <div class="manage-main-center">
+      <Table :columns="columns" :data="tableData" class="common-table app-table" no-data-text="" :row-class-name="rowClassName" :loading="loading" @on-selection-change="selectChange">
+        <template slot="loading">
+            <Loading-animation></Loading-animation>
+        </template>
+        <template slot-scope="{ row }" slot="alertRankColor">
+          <i class="iconfont icon-gaojing1" style="vertical-align: middle" :style="'color:' + row.alertRankColor"></i>
+        </template>
+         <template slot-scope="{ row }" slot="action">
+           <Tooltip content="详情" placement="top">
+              <i class="iconfont icon-xiangqingmingxi" style="cursor:pointer;color:#B8B532;fontSize:20px;marginRight:6px" @click="detailClick(row)"></i>
+           </Tooltip>
+           <Tooltip content="修正" placement="top">
+              <i class="iconfont icon-gengzhenggonggao" style="cursor:pointer;color:#0BB0DE;fontSize:20px;marginRight:6px" @click="correctClick(row)"></i>
+           </Tooltip>
+           <Tooltip content="清除" placement="top">
+              <i class="iconfont icon-shanchu" style="cursor:pointer;color:#E92E2E;fontSize:20px;marginRight:6px" @click="delClick(row)"></i>
+           </Tooltip>
+            <Tooltip content="确认" placement="top">
+              <i class="iconfont icon-queren" style="cursor:pointer;color:#08AF68;fontSize:20px;marginRight:6px" @click="queenClick(row)"></i>
+           </Tooltip>
+           <!-- <Tooltip content="转发" placement="top">
+              <i class="iconfont icon-zhuanfafenxiang" style="cursor:pointer;color:#BCA507;fontSize:20px;marginRight:6px" @click="forwardClick(row)"></i>
+           </Tooltip> -->
+        </template>
+      </Table>
+    </div>
+    <div class="common-page">
+      <div class="common-page-total">
+        共<span>{{tablePage}}</span>页 / <span>{{tableTotal}}</span>条数据
+      </div>
+      <Page :total="tableTotal" :current="tableParams.pageNum" :page-size="tableParams.pageSize" @on-change="changePage" @on-page-size-change="sizeChange" show-elevator />
+    </div>
+    <Modal
+      v-model="showModal"
+      :title="title"
+      width="25"
+      ref="modalGrag"
+      draggable
+      reset-drag-position
+      @on-visible-change="modalChange"
+      :mask-closable="false"
+      class-name="common-modal">
+      <Form class="common-form" ref="formOption" :model="formOption" :label-width="0">
+        <div class="common-form-item-text">
+          将选中的告警信息等级，修正为
+        </div>
+        <FormItem label="" prop="alertRankId" style="width:100%">
+          <Select v-model="formOption.alertRankId" placeholder="告警等级">
+            <Option v-for="item in alarmLevelModalData" :value="item.id" :key="item.id">{{ item.name }}</Option>
+          </Select> 
+        </FormItem>
+        <FormItem label="" prop="alertRankId" style="width:100%">
+          <Select v-model="formOption.processingStatus" placeholder="告警状态">
+            <Option v-for="item in alarmModalStatus" :value="item.id" :key="item.id">{{ item.value }}</Option>
+          </Select> 
+        </FormItem>
+			</Form>
+      <div slot="footer">
+          <Button @click="modalCancel">取消</Button>
+          <Button type="primary" @click="modalOk">确定</Button>
+        </div>
+    </Modal>
+    <Modal
+      v-model="modalStatus"
+      :title="commonTitle"
+      width="30"
+      ref="modalGrag"
+      draggable
+      reset-drag-position
+      :mask-closable="false"
+      class-name="common-modal">
+      <div class="common-modal-select" :style="{ color: activeColor}" v-if="idArr.length>1">已选择：{{idArr.length}}条数据</div>
+      <i class="iconfont icon-queren" style="vertical-align: middle;cursor:pointer;color:#08AF68;fontSize:20px;marginRight:6px" v-show="commonTitle=='告警确认'"></i>
+      <i class="iconfont icon-shanchu" style="vertical-align: middle;cursor:pointer;color:#E92E2E;fontSize:20px;marginRight:6px" v-show="commonTitle=='确认清除'"></i>
+      <span class="modal-text">{{modalTitle}}</span>
+      <div slot="footer">
+          <Button @click="commonCancel">取消</Button>
+          <Button type="primary" @click="commonOk">确定</Button>
+        </div>
+    </Modal>
+  </div>
+</template>
+<script>
+const defaultFrom = {alertRankId: null,processingStatus: null}
+export default {
+  name: "ComprehensiveInfor",
+  components:{
+  },
+  data() {
+    return {
+       alarmParams: {
+        keywords: '',
+        enabled: 1,
+        beginDate: '',
+        endDate: '',
+        pageNum: 1,
+        pageSize: 10
+      },
+      applicationParams: {
+        level: '',
+        lineId: '',
+        stationId: '',
+        equipmentCheck: '',
+        instrumentCheck: '',
+        pageNum: 1,
+        pageSize: 9999
+      },
+      appParams: {
+        applicationId: '',
+        equipmentTypeId: '',
+        keywords: '',
+        pageNum: 1,
+        pageSize: 9999
+      },
+      loading: true,
+      dateRange: [],
+      dateOperateRange: [],
+      tableParams: {
+        processingStatus: '',
+        keywords: '',
+        applicationId:'',
+        equipmentTypeId: '',
+        alertRankId: '',
+        beginAlertTime: '',
+        endAlertTime: '',
+        beginUpdateTime: '',
+        endUpdateTime: '',
+        alertRankEnabled: 1,
+        pageNum: 1,
+        pageSize: 10
+      },
+      tableData: [],
+      tableTotal: 0,
+      tablePage: 0,
+      rowObj: {},
+      lineTypeData: [],
+      stationTypeData: [],
+      alarmLevelData: [],
+      alarmLevelModalData: [],
+      equipTypeData: [],
+      appData: [],
+      alarmStatus: [],
+      alarmModalStatus: [],
+      columns: [
+          {
+            type: 'selection',
+            width: 60,
+            align: 'center'
+          },
+          {
+            title: '告警等级',
+            key: 'alertRankName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '警示颜色',
+            slot: 'alertRankColor',
+            align: 'center',
+            width: 90,
+          },
+          {
+            title: '设备类型',
+            key: 'equipmentTypeName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '设备名称',
+            key: 'equipmentName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+           {
+            title: '告警内容',
+            key: 'alertContent',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '来源应用',
+            key: 'appName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          }, 
+          {
+            title: '告警时间',
+            key: 'alertTime',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '操作时间',
+            key: 'updateTime',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '处理状态',
+            key: 'processingStatusDesc',
+            align: 'center',
+            width: 114,
+            render:(h,params)=>{
+              let color = params.row.processingStatusDesc == '已清除' ? '#E92E2E' : '#ffffff'
+              return h('span', {style:{color: color}},params.row.processingStatusDesc)
+            }
+          },
+          {
+          title: '操作',
+          align: 'center',
+          slot: 'action',
+          width: 160,
+        }
+      ],
+      showModal: false,
+      modalStatus: false,
+      title: '告警信息修正',
+      commonTitle: "确认清除",
+      activeColor: '#E92E2E',
+      activeClass: '',
+      modalTitle: '',
+      dateModalRange: [],
+      formOption: {alertRankId: null,processingStatus: null},
+      idArr: []
+    };
+  },
+  mounted() {
+  },
+  methods: {
+    go (){
+      // this.$router.push({path:'//ApplicationManage'})
+      // this.$router.push({path:'/MainPage/ApplicationManage/2'})
+      this.$router.push({ name: 'ApplicationManage', params: { type:2 }}) // -> /home/123
+    },
+    changePicker (date) {
+      this.tableParams.beginAlertTime = date[0]
+      this.tableParams.endAlertTime = date[1]
+    },
+    changeOperatePicker (date) {
+      this.tableParams.beginUpdateTime = date[0]
+      this.tableParams.endUpdateTime = date[1]
+    },
+    rowClassName(row, index) {
+      if (index % 2 == 0) {
+        return "ivu-table-stripe-even";
+      } else {
+        return "ivu-table-stripe-odd";
+      }
+    },
+    // 分页
+    changePage (val) {
+      this.tableParams.pageNum = val
+      this.getTableData()
+    },
+    //跳转
+    sizeChange (val) {
+      this.tableParams.pageSize = val
+      this.getTableData()
+    },
+    getType  () {
+      // 获取归属应用
+      this.$get('metroapi/application/info/list', this.applicationParams).then(res=>{
+        if (res.httpCode == 1 ){
+          this.appData = res.data.data
+          this.appData.unshift({ id: '-1', appName: '来源应用' })
+        } else {
+          this.appData = []
+        }
+      })
+      // 告警等级
+      this.$get('metroapi/alert/rank/list', this.alarmParams).then(res=>{
+        if (res.httpCode == 1 ){
+          this.alarmLevelModalData = JSON.parse(JSON.stringify(res.data.data))
+          this.alarmLevelData = res.data.data
+          this.alarmLevelData.unshift({ id: '-1', name: '告警等级' })
+        } else {
+          this.alarmLevelData = []
+          this.alarmLevelModalData = []
+        }
+      })
+      // 告警状态
+      this.$get('metroapi/dic/queryDictionary', {name:'告警处理状态'}).then(res=>{
+        if (res.httpCode == 1 ){
+          this.alarmModalStatus = JSON.parse(JSON.stringify(res.data))
+          this.alarmStatus = res.data
+          this.alarmStatus.unshift({ id: '-1', value: '处理状态' })
+        } else {
+          this.alarmModalStatus = []
+          this.alarmStatus = []
+        }
+      })
+    },
+    selectChange (selection) {
+      this.idArr = selection.map(item => item.id)
+    },
+    // 获取表格数据
+    getTableData (keywords,arr,level) {
+       if (level) {
+        this.tableParams.keywords = ''
+        if (level == 2) {
+          this.tableParams.lineId = arr[arr.length-1]
+          this.tableParams.stationId = ''
+        } else if (level == 3) {
+          this.tableParams.lineId = arr[arr.length-2]
+          this.tableParams.stationId = arr[arr.length-1]
+        } else {
+          this.tableParams.lineId = ''
+          this.tableParams.stationId = ''
+        }
+      } else {
+        this.tableParams.lineId = ''
+        this.tableParams.stationId = ''
+        if (keywords == '合肥轨道交通' || keywords == '' || !keywords) {
+          this.tableParams.oneKeywords = ''
+        } else {
+          this.tableParams.oneKeywords = keywords
+        }
+      }
+      let params = JSON.parse(JSON.stringify(this.tableParams))
+      params.alertRankId = params.alertRankId == '-1' ? '':params.alertRankId
+      params.applicationId = params.applicationId == '-1' ? '':params.applicationId
+      params.equipmentTypeId = params.equipmentTypeId == '-1' ? '':params.equipmentTypeId 
+      params.processingStatus = params.processingStatus == '-1' ? '':params.processingStatus
+      this.loading = true
+      this.$get('metroapi/alert/processing/details', params).then(res=>{
+        this.loading = false
+          if (res.httpCode == 1 ){
+            this.tableData = res.data.data
+            this.tableTotal = res.data.count
+            if (res.data.data.length==0) {
+              this.tablePage = 0
+            } else {
+              this.tablePage = res.data.count<= 10 ? 1: Math.ceil(res.data.count/this.tableParams.pageSize)
+            }
+            if (res.data.data.length==0 && this.tableParams.pageNum>1) {
+              this.tableParams.pageNum--
+              return this.getTableData()
+            }
+          } else {
+            this.tableData = []
+            this.tableTotal = 0
+          }
+        })
+    },
+    selectApp (val) {
+      this.appParams.applicationId = val
+      this.tableParams.equipmentTypeId = ''
+      if (val) {
+        this.getAddEquipType( this.appParams)
+      }
+    },
+    // 获取设备类型 
+    getAddEquipType (params) {
+      if (params.applicationId == '-1') {
+        this.equipTypeData = [{ equipmentTypeId: '-1', equipmentName: '设备类型' }]
+      } else {
+        this.$get('metroapi/application/equipmentTypeInfo', params).then(res=>{
+          if (res.httpCode == 1 ){
+            this.equipTypeData = res.data.data
+            this.equipTypeData.unshift({ equipmentTypeId: '-1', equipmentName: '设备类型' })
+          } else {
+            this.equipTypeData = []
+          }
+        })
+      }
+    },
+    searchClick () {
+      this.getTableData()
+      // this.$router.push({ path: '/MainPage/ApplicationManage',  query: {deptName: "2"}})
+    },
+    resetClick (name) {
+     this.dateRange = []
+     this.tableParams.beginAlertTime = ''
+     this.tableParams.endAlertTime = ''
+     this.dateOperateRange = []
+     this.tableParams.beginUpdateTime = ''
+     this.tableParams.endUpdateTime =  ''
+     this.equipTypeData = [{ equipmentTypeId: '-1', equipmentName: '设备类型' }]
+     this.$refs[name].resetFields()
+     this.getTableData()
+    },
+    correctClick (row) {
+      this.rowObj = row
+      if (row.id || this.idArr.length>0) {
+        this.formOption = JSON.parse(JSON.stringify(defaultFrom))
+        this.title = '告警信息修正'
+        this.showModal = true
+      } else {
+        this.$Message.info('请至少选择一条数据')
+      }
+    },
+    correctData (params) {
+      this.$post('metroapi/alert/processing/update/status',params).then(res=>{
+        if (res.httpCode == 1 ){
+          this.showModal = false
+          this.$Message.info(res.msg)
+          this.getTableData()
+        } else {
+          this.$Message.info(res.msg)
+        }
+      })
+    },
+    queenClick (row) {
+      this.rowObj = row
+      this.commonTitle = '告警确认'
+      this.activeColor = '#08AF68'
+      this.activeClass = ''
+      this.modalTitle = '告警信息状态将被标注为【已确认】，告警将被确认为有效信息。'
+      this.modalStatus = true
+    },
+    forwardClick (row) {
+
+    },
+    // editClick (row) {
+    //   this.rowObj = row
+    //   this.formOption = JSON.parse(JSON.stringify(row));
+    //   this.formOption.lineId = this.formOption.lineId ? String(this.formOption.lineId) : '-1'
+    //   this.formOption.stationId = this.formOption.stationId ? String(this.formOption.stationId) : '-1'
+    //   this.getStationData(this.formOption.lineId)
+    //   this.appParams.applicationId = this.formOption.appId
+    //   this.getAddEquipType(this.appParams)
+    //   this.title = '告警信息-修正'
+    //   this.showModal = true
+    // },
+    delClick (row) {
+      this.rowObj = row
+      this.commonTitle = '确认清除'
+      this.activeColor = '#E92E2E'
+      this.activeClass = ''
+      this.modalTitle = '告警信息状态将被标注为【已清除】，从系统有效数据中脱钩。'
+      this.modalStatus = true
+    },
+    modalChange (modalStatus) {
+     if (!modalStatus) {
+      this.$refs.formOption.resetFields();
+      this.idArr = []
+     }
+    },
+    modalOk () {
+      let params = {
+        alertIds: this.idArr.join() || Number(this.rowObj.id),
+        processingStatus: this.formOption.processingStatus,
+        alertRankId: this.formOption.alertRankId,
+      }
+      this.correctData(params)
+    },
+    modalCancel () {
+      this.showModal = false
+    },
+    commonOk () {
+      let params = {
+        id: this.rowObj.id
+      }
+      this.delData(params)
+    },
+    commonCancel () {
+      this.modalStatus = false
+    },
+    // 删除接口
+    delData (params) {
+      this.$get('metroapi/equipment/delEquipment',params).then(res=>{
+        if (res.httpCode == 1 ){
+          this.modalStatus = false
+          this.$Message.info(res.msg)
+          this.getTableData()
+        } else {
+          this.$Message.info(res.msg)
+        }
+      })
+    },
+  }
+};
+</script>
+<style scoped lang="stylus">
+.content-main-manage {
+  position: relative;
+  height: 100%;
+}
+.search-list {
+  display: flex;
+  padding: 10px 0 0;
+}
+.search-left {
+  display: flex;
+  align-items: center;
+   .ivu-select {
+     width: 125px;
+     padding-right: 10px;
+     height: 32px;
+   }
+   .ivu-select-single .ivu-select-selection {
+     height: 100%;
+   }
+   >>> .ivu-input {
+     width: 152px;
+     height: 32px;
+   }
+    >>> .common-date-picker .ivu-input {
+    width: 198px;
+   }
+   >>> .ivu-input-prefix, >>> .ivu-input-suffix {
+     height: 32px;
+     line-height: 32px;
+   }
+   >>> .ivu-input-icon {
+     height: 32px;
+     line-height: 32px;
+   }
+   >>> .date-picker-main .ivu-date-picker-header {
+    border-bottom: 0.0052083333rem solid #204384;
+ }
+}
+.btn-container {
+  display: flex;
+  justify-content: space-between;
+  padding-bottom: 10px;
+  color: #0185EA;
+  font-size: 14px;
+  .btn-container-download {
+    cursor: pointer;
+  }
+  .common-corrections {
+    background: #053B4A;
+    border: 1px solid #0098C2;
+    color: #FFFFFF;
+    margin-right: 5px;
+  }
+  .common-eliminate {
+    background: #4C2215;
+    border: 1px solid #8E1919;
+    color: #FFFFFF;
+    margin-right: 5px;
+  }
+  .common-confirm {
+    background: #0C3423;
+    border: 1px solid #08AF68;
+    color: #FFFFFF;
+    margin-right: 5px;
+  }
+  .common-forward {
+    background: #413A09;
+    border: 1px solid #A69311;
+    color: #FFFFFF;
+  }
+}
+.common-form {
+  display: flex;
+  flex-wrap: wrap;
+}
+>>> .common-form-list .ivu-form-item {
+  margin-bottom: 10px;
+}
+.manage-main-center {
+  width: 100%;
+  height: calc(100% - 150px);
+}
+.common-table {
+  max-height: 100%;
+}
+// >>> .common-table .table-state-clear .ivu-table-cell-tooltip-content{
+//  color:#E92E2E;
+// }
+>>> .common-table .ivu-table th {
+  height: 50px;
+ }
+ >>> .common-table .ivu-table td {
+  height: 49.5px;
+ }
+  >>> .common-table .ivu-spin-fix {
+   top: 50px;
+ }
+  >>> .app-table .ivu-spin-fix {
+   height: calc(100vh - 375px);
+ }
+ >>> .ivu-table-tip {
+  background: url('../../../assets/images/noData.png') no-repeat center;
+}
+>>> .app-table .ivu-table-tip {
+  height: calc(100vh - 375px);
+ }
+ >>> .common-table .ivu-table-tip table {
+ display: none;
+}
+ >>> .modal-table {
+   overflow: auto !important;
+ }
+ >>> .modal-table .ivu-spin-fix {
+   height: 200px;
+ }
+  >>> .modal-table .ivu-table-tip {
+   height: 200px;
+ }
+.common-page {
+  margin-top: 15px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+}
+.common-page-total {
+  color: #fff;
+  padding-right: 10px;
+  font-size: 14px;
+  span {
+    color #409EFF;
+  }
+}
+.common-form-item-text {
+  font-size: 11px;
+  color: #85A3D4;
+  margin: 10px 0;
+}
+/deep/ .ivu-input::-webkit-input-placeholder{
+  color: #718EBD;
+}
+/deep/ .ivu-input::-moz-placeholder{   /* Mozilla Firefox 19+ */
+  color: #718EBD;
+}
+/deep/ .ivu-input::-moz-placeholder{    /* Mozilla Firefox 4 to 18 */
+  color: #718EBD;
+}
+/deep/ .ivu-input::-ms-input-placeholder{  /* Internet Explorer 10-11 */
+  color: #718EBD;
+}
+.common-modal-select {
+  color: #fff;
+  font-size: 14px;
+  margin-bottom: 10px;
+  margin-left: 35PX;
+}
+</style>

src/views/homecomponents/EquipmentAnalysis/ComprehensiveQuery.vue

@@ -1,23 +1,597 @@
 <template>
-<div>
-</div>
+  <div class="content-main">
+    <div class="content-body-wrap">
+     <div class="content-body">
+       <div class="content-main-manage">
+          <div class="search-list">
+            <div class="search-left">
+              <Form class="common-form common-form-list" ref="tableParams" :model="tableParams" inline>
+                <FormItem label="" prop="applicationId">
+                  <Select v-model="tableParams.applicationId" placeholder="来源应用" @on-change="selectApp">
+                    <Option v-for="item in appData" :value="item.id" :key="item.id">{{ item.appName }}</Option>
+                  </Select>
+                </FormItem>
+                <FormItem label="" prop="equipmentTypeId">
+                  <Select v-model="tableParams.equipmentTypeId" placeholder="设备类型">
+                    <Option v-for="item in equipTypeData" :value="item.equipmentTypeId" :key="item.equipmentTypeId">{{ item.equipmentName }}</Option>
+                  </Select>
+                </FormItem>
+                <FormItem label="" prop="lineId">
+                  <Select v-model="tableParams.lineId" placeholder="线路" @on-select="selectLine">
+                    <Option v-for="item in lineTypeData" :value="String(item.id)" :key="item.id">{{ item.lineName }}</Option>
+                  </Select>
+                </FormItem>
+                <FormItem label="" prop="stationId">
+                  <Select v-model="tableParams.stationId" placeholder="站点">
+                    <Option v-for="item in stationTypeData" :value="String(item.id)" :key="item.id">{{ item.stationName }}</Option>
+                  </Select>
+                </FormItem>
+                 <FormItem label="" prop="alertRankId">
+                  <Select v-model="tableParams.alertRankId" placeholder="告警等级" ref="selectRank">
+                    <Option v-for="item in alarmLevelData" :value="item.id" :key="item.id">{{ item.name }}</Option>
+                  </Select>
+                </FormItem>
+                 <FormItem label="" prop="processingStatus">
+                  <Select v-model="tableParams.processingStatus" placeholder="处理状态">
+                    <Option v-for="item in alarmStatus" :value="item.id" :key="item.id">{{ item.value }}</Option>
+                  </Select>
+                </FormItem>
+                 <FormItem label="" prop="processingStatus">
+                  <Select v-model="tableParams.processingStatus" placeholder="处理人">
+                    <Option v-for="item in alarmStatus" :value="item.id" :key="item.id">{{ item.value }}</Option>
+                  </Select>
+                </FormItem>
+                <FormItem label="">
+                  <DatePicker type="daterange" :value="dateRange" :clearable="false" class="common-date-picker date-picker-main" placement="bottom-end" placeholder="告警时间范围" @on-change="changePicker"></DatePicker>
+                </FormItem>
+                <FormItem label="">
+                  <DatePicker type="daterange" :value="dateOperateRange" :clearable="false" class="common-date-picker date-picker-main" placement="bottom-end" placeholder="操作时间范围" @on-change="changeOperatePicker"></DatePicker>
+                </FormItem>
+                <FormItem label="" prop="keywords">
+                  <Input placeholder="请输入关键字查询" clearable search v-model="tableParams.keywords" />
+                </FormItem>
+                <FormItem label="" >
+                  <Button type="primary" class="common-btn-search" @click="searchClick">
+                    <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 筛选
+                  </Button> 
+                  <Button type="primary" class="common-btn-search" style="margin-left:10px" @click="resetClick('tableParams')">
+                    <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 重置
+                  </Button>   
+                </FormItem>
+              </Form>
+            </div>
+          </div>
+          <!-- <div class="btn-container">
+            <span class="btn-container-download" style="opacity: 1">
+              <i class="iconfont icon-xiazai" style="cursor:pointer;color:#0185EA;fontSize:20px;marginRight:6px"></i>下载列表筛选结果
+            </span>
+            <div>
+            </div>
+          </div> -->
+          <div class="manage-main-center">
+            <Table :columns="columns" :data="tableData" class="common-table app-table" no-data-text="" :row-class-name="rowClassName" :loading="loading" @on-selection-change="selectChange">
+              <template slot="loading">
+                  <Loading-animation></Loading-animation>
+              </template>
+              <template slot-scope="{ row }" slot="alertRankColor">
+                <i class="iconfont icon-gaojing1" style="vertical-align: middle" :style="'color:' + row.alertRankColor"></i>
+              </template>
+            </Table>
+          </div>
+          <div class="common-page">
+            <div class="common-page-total">
+              共<span>{{tablePage}}</span>页 / <span>{{tableTotal}}</span>条数据
+            </div>
+            <Page :total="tableTotal" :current="tableParams.pageNum" :page-size="tableParams.pageSize" @on-change="changePage" @on-page-size-change="sizeChange" show-elevator />
+          </div>
+        </div>
+     </div>
+    </div>
+  </div>
 </template>
 <script>
 export default {
   name: "ComprehensiveQuery",
-  components:{
+   components:{
   },
   data() {
     return {
+       alarmParams: {
+        keywords: '',
+        enabled: '',
+        beginDate: '',
+        endDate: '',
+        pageNum: 1,
+        pageSize: 10
+      },
+      applicationParams: {
+        level: '',
+        lineId: '',
+        stationId: '',
+        equipmentCheck: '',
+        instrumentCheck: '',
+        pageNum: 1,
+        pageSize: 9999
+      },
+      appParams: {
+        applicationId: '',
+        equipmentTypeId: '',
+        keywords: '',
+        pageNum: 1,
+        pageSize: 9999
+      },
+      loading: true,
+      dateRange: [],
+      dateOperateRange: [],
+      tableParams: {
+        processingStatus: '',
+        keywords: '',
+        applicationId:'',
+        equipmentTypeId: '',
+        lineId: '',
+        stationId: '',
+        alertRankId: '',
+        beginAlertTime: '',
+        endAlertTime: '',
+        beginUpdateTime: '',
+        endUpdateTime: '',
+        alertRankEnabled: '',
+        pageNum: 1,
+        pageSize: 10
+      },
+      tableData: [],
+      tableTotal: 0,
+      tablePage: 0,
+      rowObj: {},
+      lineTypeData: [],
+      stationTypeData: [],
+      alarmLevelData: [],
+      equipTypeData: [],
+      appData: [],
+      alarmStatus: [],
+      columns: [
+           {
+            title: '告警等级',
+            key: 'alertRankName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '警示颜色',
+            slot: 'alertRankColor',
+            align: 'center',
+            width: 90,
+          },
+          {
+            title: '告警时间',
+            key: 'alertTime',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '线路',
+            key: 'lineName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+           {
+            title: '站点',
+            key: 'stationName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+           {
+            title: '来源应用',
+            key: 'appName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          }, 
+          {
+            title: '设备类型',
+            key: 'equipmentTypeName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '设备名称',
+            key: 'equipmentName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '告警内容',
+            key: 'alertContent',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '处理状态',
+            key: 'processingStatusDesc',
+            align: 'center',
+            width: 114,
+            render:(h,params)=>{
+              let color = params.row.processingStatusDesc == '已清除' ? '#E92E2E' : '#ffffff'
+              return h('span', {style:{color: color}},params.row.processingStatusDesc)
+            }
+          },
+          {
+            title: '操作时间',
+            key: 'updateTime',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+           {
+            title: '操作人',
+            key: '',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+      ],
     };
   },
+  created () {
+    if (this.$route.params.alertRankId) {
+      this.tableParams.alertRankId = this.$route.params.alertRankId
+    } else {
+      this.tableParams.alertRankId = ''
+    }
+  },
   mounted() {
+    this.getType()
+    this.getTableData()
   },
+  //  // 离开当前路由之前的钩子函数 
+  // beforeRouteLeave(to, form, next) {
+  //   next()
+  // },
   methods: {
-   
+     changePicker (date) {
+      this.tableParams.beginAlertTime = date[0]
+      this.tableParams.endAlertTime = date[1]
+    },
+    changeOperatePicker (date) {
+      this.tableParams.beginUpdateTime = date[0]
+      this.tableParams.endUpdateTime = date[1]
+    },
+    rowClassName(row, index) {
+      if (index % 2 == 0) {
+        return "ivu-table-stripe-even";
+      } else {
+        return "ivu-table-stripe-odd";
+      }
+    },
+    // 分页
+    changePage (val) {
+      this.tableParams.pageNum = val
+      this.getTableData()
+    },
+    //跳转
+    sizeChange (val) {
+      this.tableParams.pageSize = val
+      this.getTableData()
+    },
+    getType  () {
+       //获取所属线路
+      this.$get('metroapi/lineStation/queryLine', {lineName:''}).then(res=>{
+        if (res.httpCode == 1 ){
+          this.lineTypeData = res.data
+          this.lineTypeData.unshift({ id: '-1', lineName: '线路' })
+          this.getStationData ('-1')
+        } else {
+          this.lineTypeData = []
+        }
+      })
+      // 获取归属应用
+      this.$get('metroapi/application/info/list', this.applicationParams).then(res=>{
+        if (res.httpCode == 1 ){
+          this.appData = res.data.data
+          this.appData.unshift({ id: '-1', appName: '来源应用' })
+        } else {
+          this.appData = []
+        }
+      })
+      // 告警等级
+      this.$get('metroapi/alert/rank/list', this.alarmParams).then(res=>{
+        if (res.httpCode == 1 ){
+          this.alarmLevelData = res.data.data
+          this.alarmLevelData.unshift({ id: '-1', name: '告警等级' })
+        } else {
+          this.alarmLevelData = []
+        }
+      })
+      // 告警状态
+      this.$get('metroapi/dic/queryDictionary', {name:'告警处理状态'}).then(res=>{
+        if (res.httpCode == 1 ){
+          this.alarmStatus = res.data
+        } else {
+          this.alarmStatus = []
+        }
+      })
+    },
+    selectLine (val) {
+      // 获取站点类型
+      this.tableParams.stationId = ''
+      this.tableParams.lineId = val.value
+      if (this.tableParams.lineId) {
+        this.getStationData(val.value)
+      }
+    },
+    // 获取所属站点
+    getStationData (lineId) {
+      if(lineId == -1) {
+        this.stationTypeData = [{ id: '-1', stationName: '站点' }]
+      } else {
+        this.$get('metroapi/lineStation/queryStationByLineId', {lineId:lineId}).then(res=>{
+          if (res.httpCode == 1 ){
+            this.stationTypeData = res.data
+            this.stationTypeData.unshift({ id: '-1', stationName: '站点' })
+          }
+        })
+      }
+    },
+    selectChange (selection) {
+      this.idArr = selection.map(item => item.id)
+    },
+    // 获取表格数据
+    getTableData (type) {
+      let params = {}
+      params = JSON.parse(JSON.stringify(this.tableParams))
+      if (type == 'reset') { // 页面跳转重置数据 params 不会随this.tableParams里属性值变化而变化，所以采用此种方法
+        params.alertRankId = ''
+      }
+      params.lineId = params.lineId == '-1' ? '':params.lineId
+      params.stationId = params.stationId == '-1' ? '':params.stationId
+      params.alertRankId = params.alertRankId == '-1' ? '':params.alertRankId
+      params.applicationId = params.applicationId == '-1' ? '':params.applicationId
+      params.equipmentTypeId = params.equipmentTypeId == '-1' ? '':params.equipmentTypeId 
+      params.processingStatusDesc = params.processingStatusDesc == '-1' ? '':params.processingStatusDesc
+      this.loading = true
+      this.$get('metroapi/alert/processing/details', params).then(res=>{
+        this.loading = false
+          if (res.httpCode == 1 ){
+            this.tableData = res.data.data
+            this.tableTotal = res.data.count
+            if (res.data.data.length==0) {
+              this.tablePage = 0
+            } else {
+              this.tablePage = res.data.count<= 10 ? 1: Math.ceil(res.data.count/this.tableParams.pageSize)
+            }
+            if (res.data.data.length==0 && this.tableParams.pageNum>1) {
+              this.tableParams.pageNum--
+              return this.getTableData()
+            }
+          } else {
+            this.tableData = []
+            this.tableTotal = 0
+          }
+        })
+    },
+    selectApp (val) {
+      this.appParams.applicationId = val
+      this.tableParams.equipmentTypeId = ''
+      if (val) {
+        this.getAddEquipType( this.appParams)
+      }
+    },
+    // 获取设备类型 
+    getAddEquipType (params) {
+      if (params.applicationId == '-1') {
+        this.equipTypeData = [{ equipmentTypeId: '-1', equipmentName: '设备类型' }]
+      } else {
+        this.$get('metroapi/application/equipmentTypeInfo', params).then(res=>{
+          if (res.httpCode == 1 ){
+            this.equipTypeData = res.data.data
+            this.equipTypeData.unshift({ equipmentTypeId: '-1', equipmentName: '设备类型' })
+          } else {
+            this.equipTypeData = []
+          }
+        })
+      }
+    },
+    searchClick () {
+      this.getTableData()
+      // this.$router.push({ path: '/MainPage/ApplicationManage',  query: {deptName: "2"}})
+    },
+    resetClick (name) {
+     this.dateRange = []
+     this.tableParams.beginAlertTime = ''
+     this.tableParams.endAlertTime = ''
+     this.dateOperateRange = []
+     this.tableParams.beginUpdateTime = ''
+     this.tableParams.endUpdateTime =  ''
+     this.tableParams.alertRankId = undefined 
+     this.$refs.selectRank.reset() // 默认值，清空select值
+     this.stationTypeData = [{ id: '-1', stationName: '站点' }]
+     this.equipTypeData = [{ equipmentTypeId: '-1', equipmentName: '设备类型' }]
+     this.$refs[name].resetFields()
+     this.getTableData('reset')
+    },   
   }
 };
 </script>
 <style scoped lang="stylus">
+.content-main {
+  width: 100%;
+  height: calc(100% - 50px);
+  overflow: hidden;
+}
+.content-body-wrap {
+  width: 100%;
+  height: 100%;
+  background: #06214D;
+}
+.content-body {
+  width: 100%;
+  height: 100%;
+  background: #06214D;
+  padding: 10px;
+}
 
+.right-main {
+  height: 100%;
+  padding: 10px 0 0;
+}
+.content-main-manage {
+  position: relative;
+  height: 100%;
+}
+.search-list {
+  display: flex;
+  padding: 10px 0;
+}
+.search-left {
+  display: flex;
+  align-items: center;
+   .ivu-select {
+     width: 164px;
+     padding-right: 10px;
+     height: 32px;
+   }
+   .ivu-select-single .ivu-select-selection {
+     height: 100%;
+   }
+   >>> .ivu-input {
+     width: 160px;
+     height: 32px;
+   }
+   >>> .common-date-picker .ivu-input {
+    width: 210px;
+   }
+   >>> .ivu-input-prefix, >>> .ivu-input-suffix {
+     height: 32px;
+     line-height: 32px;
+   }
+   >>> .ivu-input-icon {
+     height: 32px;
+     line-height: 32px;
+   }
+   >>> .date-picker-main .ivu-date-picker-header {
+    border-bottom: 0.0052083333rem solid #204384;
+ }
+}
+.btn-container {
+  display: flex;
+  justify-content: space-between;
+  padding-bottom: 10px;
+  color: #0185EA;
+  font-size: 14px;
+  .btn-container-download {
+    cursor: pointer;
+  }
+  .common-corrections {
+    background: #053B4A;
+    border: 1px solid #0098C2;
+    color: #FFFFFF;
+    margin-right: 5px;
+  }
+  .common-eliminate {
+    background: #4C2215;
+    border: 1px solid #8E1919;
+    color: #FFFFFF;
+    margin-right: 5px;
+  }
+  .common-confirm {
+    background: #0C3423;
+    border: 1px solid #08AF68;
+    color: #FFFFFF;
+    margin-right: 5px;
+  }
+  .common-forward {
+    background: #413A09;
+    border: 1px solid #A69311;
+    color: #FFFFFF;
+  }
+}
+.common-form {
+  display: flex;
+  flex-wrap: wrap;
+}
+>>> .common-form-list .ivu-form-item {
+  margin-bottom: 10px;
+}
+.manage-main-center {
+  width: 100%;
+  height: calc(100% - 150px);
+}
+.common-table {
+  max-height: 100%;
+}
+// >>> .common-table .ivu-table th {
+//   height: 50px;
+//  }
+//  >>> .common-table .ivu-table td {
+//   height: 50px;
+//  }
+//   >>> .common-table .ivu-spin-fix {
+//    top: 50px;
+//  }
+ >>> .common-table .ivu-table th {
+  height: 54px;
+ }
+ >>> .common-table .ivu-table td {
+  height: 54px;
+ }
+  >>> .common-table .ivu-spin-fix {
+   top: 54px;
+ }
+  >>> .app-table .ivu-spin-fix {
+   height: calc(100vh - 375px);
+ }
+ >>> .ivu-table-tip {
+  background: url('../../../assets/images/noData.png') no-repeat center;
+}
+>>> .app-table .ivu-table-tip {
+  height: calc(100vh - 375px);
+ }
+ >>> .common-table .ivu-table-tip table {
+ display: none;
+}
+ >>> .modal-table {
+   overflow: auto !important;
+ }
+ >>> .modal-table .ivu-spin-fix {
+   height: 200px;
+ }
+  >>> .modal-table .ivu-table-tip {
+   height: 200px;
+ }
+.common-page {
+  margin-top: 15px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+}
+.common-page-total {
+  color: #fff;
+  padding-right: 10px;
+  font-size: 14px;
+  span {
+    color #409EFF;
+  }
+}
+/deep/ .ivu-input::-webkit-input-placeholder{
+  color: #718EBD;
+}
+/deep/ .ivu-input::-moz-placeholder{   /* Mozilla Firefox 19+ */
+  color: #718EBD;
+}
+/deep/ .ivu-input::-moz-placeholder{    /* Mozilla Firefox 4 to 18 */
+  color: #718EBD;
+}
+/deep/ .ivu-input::-ms-input-placeholder{  /* Internet Explorer 10-11 */
+  color: #718EBD;
+}
 </style>

src/views/homecomponents/EquipmentAnalysis/ConfirmedAlarm.vue

@@ -0,0 +1,629 @@
+<template>
+  <div class="content-main-manage">
+    <div class="search-list">
+      <div class="search-left">
+        <Form class="common-form common-form-list" ref="tableParams" :model="tableParams" inline>
+           <FormItem label="" prop="alertRankId">
+            <Select v-model="tableParams.alertRankId" placeholder="告警等级">
+              <Option v-for="item in alarmLevelData" :value="item.id" :key="item.id">{{ item.name }}</Option>
+            </Select>
+          </FormItem>
+          <FormItem label="" prop="applicationId">
+            <Select v-model="tableParams.applicationId" placeholder="来源应用" @on-change="selectApp">
+              <Option v-for="item in appData" :value="item.id" :key="item.id">{{ item.appName }}</Option>
+            </Select>
+          </FormItem>
+          <FormItem label="" prop="equipmentTypeId">
+            <Select v-model="tableParams.equipmentTypeId" placeholder="设备类型">
+              <Option v-for="item in equipTypeData" :value="item.equipmentTypeId" :key="item.equipmentTypeId">{{ item.equipmentName }}</Option>
+            </Select>
+          </FormItem>
+          <FormItem label="">
+            <DatePicker type="daterange" :value="dateRange" :clearable="false" class="common-date-picker date-picker-main" placement="bottom-end" placeholder="告警时间范围" @on-change="changePicker"></DatePicker>
+          </FormItem>
+           <FormItem label="">
+            <DatePicker type="daterange" :value="dateOperateRange" :clearable="false" class="common-date-picker date-picker-main" placement="bottom-end" placeholder="操作时间范围" @on-change="changeOperatePicker"></DatePicker>
+          </FormItem>
+          <FormItem label="" prop="keywords">
+            <Input placeholder="请输入关键字查询" clearable search v-model="tableParams.keywords" />
+          </FormItem>
+          <FormItem label="" >
+            <Button type="primary" class="common-btn-search" @click="searchClick">
+              <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 筛选
+            </Button> 
+            <Button type="primary" class="common-btn-search" style="margin-left:10px" @click="resetClick('tableParams')">
+              <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 重置
+            </Button>   
+          </FormItem>
+        </Form>
+      </div>
+    </div>
+     <div class="btn-container">
+      <span class="btn-container-download" style="opacity: 0">
+        <i class="iconfont icon-xiazai" style="cursor:pointer;color:#0185EA;fontSize:20px;marginRight:6px"></i>下载列表筛选结果
+      </span>
+      <div>
+        <Button class="common-operate-btn common-corrections" @click="correctClick"> 
+          <i class="iconfont icon-gengzhenggonggao" style="vertical-align: middle;cursor:pointer;color:#ffffff;fontSize:20px;marginRight:6px"></i>
+          批量手动修正
+        </Button>
+        <!-- <Button class="common-add-btn common-forward">
+          <i class="iconfont icon-zhuanfafenxiang" style="cursor:pointer;color:#ffffff;fontSize:20px;marginRight:6px"></i>
+          批量转发通知
+        </Button> -->
+      </div>
+    </div>
+    <div class="manage-main-center">
+      <Table :columns="columns" :data="tableData" class="common-table app-table" no-data-text="" :row-class-name="rowClassName" :loading="loading" @on-selection-change="selectChange">
+        <template slot="loading">
+            <Loading-animation></Loading-animation>
+        </template>
+        <template slot-scope="{ row }" slot="alertRankColor">
+          <i class="iconfont icon-gaojing1" style="vertical-align: middle" :style="'color:' + row.alertRankColor"></i>
+        </template>
+         <template slot-scope="{ row }" slot="action">
+           <Tooltip content="详情" placement="top">
+              <i class="iconfont icon-xiangqingmingxi" style="cursor:pointer;color:#B8B532;fontSize:20px;marginRight:6px" @click="detailClick(row)"></i>
+           </Tooltip>
+           <Tooltip content="修正" placement="top">
+              <i class="iconfont icon-gengzhenggonggao" style="cursor:pointer;color:#0BB0DE;fontSize:20px;marginRight:6px" @click="correctClick(row)"></i>
+           </Tooltip>
+        </template>
+      </Table>
+    </div>
+    <div class="common-page">
+      <div class="common-page-total">
+        共<span>{{tablePage}}</span>页 / <span>{{tableTotal}}</span>条数据
+      </div>
+      <Page :total="tableTotal" :current="tableParams.pageNum" :page-size="tableParams.pageSize" @on-change="changePage" @on-page-size-change="sizeChange" show-elevator />
+    </div>
+    <Modal
+      v-model="showModal"
+      :title="title"
+      width="25"
+      ref="modalGrag"
+      draggable
+      reset-drag-position
+      @on-visible-change="modalChange"
+      :mask-closable="false"
+      class-name="common-modal">
+      <Form class="common-form" ref="formOption" :model="formOption" :label-width="0">
+        <div class="common-form-item-text">
+          将选中的告警信息等级，修正为
+        </div>
+        <FormItem label="" prop="alertRankId" style="width:100%">
+          <Select v-model="formOption.alertRankId" placeholder="告警等级">
+            <Option v-for="item in alarmLevelModalData" :value="item.id" :key="item.id">{{ item.name }}</Option>
+          </Select> 
+        </FormItem>
+        <FormItem label="" prop="processingStatus" style="width:100%">
+          <Select v-model="formOption.processingStatus" placeholder="告警状态">
+            <Option v-for="item in alarmModalStatus" :value="item.id" :key="item.id">{{ item.value }}</Option>
+          </Select> 
+        </FormItem>
+			</Form>
+      <div slot="footer">
+          <Button @click="modalCancel">取消</Button>
+          <Button type="primary" @click="modalOk">确定</Button>
+        </div>
+    </Modal>
+  </div>
+</template>
+<script>
+const defaultFrom = {alertRankId: null,processingStatus:null}
+export default {
+  name: "ConfirmedAlarm",
+  components:{
+  },
+  data() {
+    return {
+       alarmParams: {
+        keywords: '',
+        enabled: 1,
+        beginDate: '',
+        endDate: '',
+        pageNum: 1,
+        pageSize: 10
+      },
+      applicationParams: {
+        level: '',
+        lineId: '',
+        stationId: '',
+        equipmentCheck: '',
+        instrumentCheck: '',
+        pageNum: 1,
+        pageSize: 9999
+      },
+      appParams: {
+        applicationId: '',
+        equipmentTypeId: '',
+        keywords: '',
+        pageNum: 1,
+        pageSize: 9999
+      },
+      loading: true,
+      dateRange: [],
+      dateOperateRange: [],
+      tableParams: {
+        processingStatus: 39,
+        keywords: '',
+        applicationId:'',
+        equipmentTypeId: '',
+        alertRankId: '',
+        beginAlertTime: '',
+        endAlertTime: '',
+        beginUpdateTime: '',
+        endUpdateTime: '',
+        alertRankEnabled: 1,
+        pageNum: 1,
+        pageSize: 10
+      },
+      tableData: [],
+      tableTotal: 0,
+      tablePage: 0,
+      rowObj: {},
+      lineTypeData: [],
+      stationTypeData: [],
+      alarmLevelData: [],
+      alarmLevelModalData: [],
+      equipTypeData: [],
+      appData: [],
+      alarmModalStatus: [],
+      columns: [
+          {
+            type: 'selection',
+            width: 60,
+            align: 'center'
+          },
+          {
+            title: '告警等级',
+            key: 'alertRankName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '警示颜色',
+            slot: 'alertRankColor',
+            align: 'center',
+          },
+          {
+            title: '设备类型',
+            key: 'equipmentTypeName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '设备名称',
+            key: 'equipmentName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+           {
+            title: '告警内容',
+            key: 'alertContent',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '来源应用',
+            key: 'appName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          }, 
+          {
+            title: '告警时间',
+            key: 'alertTime',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '处理状态',
+            key: 'processingStatusDesc',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+           {
+            title: '操作时间',
+            key: 'updateTime',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '操作人',
+            key: '',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+          title: '操作',
+          align: 'center',
+          slot: 'action',
+          width: 120,
+        }
+      ],
+      showModal: false,
+      title: '告警信息修正',
+      dateModalRange: [],
+      formOption: {alertRankId: null,processingStatus:null},
+      idArr: []
+    };
+  },
+  mounted() {
+  },
+  methods: {
+    go (){
+      // this.$router.push({path:'//ApplicationManage'})
+      // this.$router.push({path:'/MainPage/ApplicationManage/2'})
+      this.$router.push({ name: 'ApplicationManage', params: { type:2 }}) // -> /home/123
+    },
+    changePicker (date) {
+      this.tableParams.beginAlertTime = date[0]
+      this.tableParams.endAlertTime = date[1]
+    },
+    changeOperatePicker (date) {
+      this.tableParams.beginUpdateTime = date[0]
+      this.tableParams.endUpdateTime = date[1]
+    },
+    rowClassName(row, index) {
+      if (index % 2 == 0) {
+        return "ivu-table-stripe-even";
+      } else {
+        return "ivu-table-stripe-odd";
+      }
+    },
+    // 分页
+    changePage (val) {
+      this.tableParams.pageNum = val
+      this.getTableData()
+    },
+    //跳转
+    sizeChange (val) {
+      this.tableParams.pageSize = val
+      this.getTableData()
+    },
+    getType  () {
+      // 获取归属应用
+      this.$get('metroapi/application/info/list', this.applicationParams).then(res=>{
+        if (res.httpCode == 1 ){
+          this.appData = res.data.data
+          this.appData.unshift({ id: '-1', appName: '来源应用' })
+        } else {
+          this.appData = []
+        }
+      })
+      // 告警等级
+      this.$get('metroapi/alert/rank/list', this.alarmParams).then(res=>{
+        if (res.httpCode == 1 ){
+          this.alarmLevelModalData = JSON.parse(JSON.stringify(res.data.data))
+          this.alarmLevelData = res.data.data
+          this.alarmLevelData.unshift({ id: '-1', name: '告警等级' })
+        } else {
+          this.alarmLevelData = []
+          this.alarmLevelModalData = []
+        }
+      })
+      // 告警状态
+      this.$get('metroapi/dic/queryDictionary', {name:'告警处理状态'}).then(res=>{
+        if (res.httpCode == 1 ){
+          this.alarmModalStatus = res.data
+        } else {
+          this.alarmModalStatus = []
+        }
+      })
+    },
+    selectChange (selection) {
+      this.idArr = selection.map(item => item.id)
+    },
+    // 获取表格数据
+    getTableData (keywords,arr,level) {
+       if (level) {
+        this.tableParams.keywords = ''
+        if (level == 2) {
+          this.tableParams.lineId = arr[arr.length-1]
+          this.tableParams.stationId = ''
+        } else if (level == 3) {
+          this.tableParams.lineId = arr[arr.length-2]
+          this.tableParams.stationId = arr[arr.length-1]
+        } else {
+          this.tableParams.lineId = ''
+          this.tableParams.stationId = ''
+        }
+      } else {
+        this.tableParams.lineId = ''
+        this.tableParams.stationId = ''
+        if (keywords == '合肥轨道交通' || keywords == '' || !keywords) {
+          this.tableParams.oneKeywords = ''
+        } else {
+          this.tableParams.oneKeywords = keywords
+        }
+      }
+      let params = JSON.parse(JSON.stringify(this.tableParams))
+      params.alertRankId = params.alertRankId == '-1' ? '':params.alertRankId
+      params.applicationId = params.applicationId == '-1' ? '':params.applicationId
+      params.equipmentTypeId = params.equipmentTypeId == '-1' ? '':params.equipmentTypeId 
+      this.loading = true
+      this.$get('metroapi/alert/processing/details', params).then(res=>{
+        this.loading = false
+          if (res.httpCode == 1 ){
+            this.tableData = res.data.data
+            this.tableTotal = res.data.count
+            if (res.data.data.length==0) {
+              this.tablePage = 0
+            } else {
+              this.tablePage = res.data.count<= 10 ? 1: Math.ceil(res.data.count/this.tableParams.pageSize)
+            }
+            if (res.data.data.length==0 && this.tableParams.pageNum>1) {
+              this.tableParams.pageNum--
+              return this.getTableData()
+            }
+          } else {
+            this.tableData = []
+            this.tableTotal = 0
+          }
+        })
+    },
+    selectApp (val) {
+      this.appParams.applicationId = val
+      this.tableParams.equipmentTypeId = ''
+      if (val) {
+        this.getAddEquipType( this.appParams)
+      }
+    },
+    // 获取设备类型 
+    getAddEquipType (params) {
+      if (params.applicationId == '-1') {
+        this.equipTypeData = [{ equipmentTypeId: '-1', equipmentName: '设备类型' }]
+      } else {
+        this.$get('metroapi/application/equipmentTypeInfo', params).then(res=>{
+          if (res.httpCode == 1 ){
+            this.equipTypeData = res.data.data
+            this.equipTypeData.unshift({ equipmentTypeId: '-1', equipmentName: '设备类型' })
+          } else {
+            this.equipTypeData = []
+          }
+        })
+      }
+    },
+    searchClick () {
+      this.getTableData()
+      // this.$router.push({ path: '/MainPage/ApplicationManage',  query: {deptName: "2"}})
+    },
+    resetClick (name) {
+     this.dateRange = []
+     this.tableParams.beginAlertTime = ''
+     this.tableParams.endAlertTime = ''
+     this.dateOperateRange = []
+     this.tableParams.beginUpdateTime = ''
+     this.tableParams.endUpdateTime =  ''
+     this.equipTypeData = [{ equipmentTypeId: '-1', equipmentName: '设备类型' }]
+     this.$refs[name].resetFields()
+     this.getTableData()
+    },   
+    correctClick (row) {
+      this.rowObj = row
+      if (row.id || this.idArr.length>0) {
+        this.formOption = JSON.parse(JSON.stringify(defaultFrom))
+        this.title = '告警信息修正'
+        this.showModal = true
+      } else {
+        this.$Message.info('请至少选择一条数据')
+      }
+    },
+    correctData (params) {
+      this.$post('metroapi/alert/processing/update/status',params).then(res=>{
+        if (res.httpCode == 1 ){
+          this.showModal = false
+          this.$Message.info(res.msg)
+          this.getTableData()
+        } else {
+          this.$Message.info(res.msg)
+        }
+      })
+    },
+    modalChange (modalStatus) {
+     if (!modalStatus) {
+      this.$refs.formOption.resetFields();
+      this.idArr = []
+     }
+    },
+    modalOk () {
+      let params = {
+        alertIds: this.idArr.join() || Number(this.rowObj.id),
+        processingStatus: this.formOption.processingStatus,
+        alertRankId: this.formOption.alertRankId,
+      }
+      this.correctData(params)
+    },
+    modalCancel () {
+      this.showModal = false
+    },
+    commonOk () {
+      let params = {
+        id: this.rowObj.id
+      }
+      this.delData(params)
+    },
+    commonCancel () {
+      this.modalStatus = false
+    },
+    // 删除接口
+    delData (params) {
+      this.$get('metroapi/equipment/delEquipment',params).then(res=>{
+        if (res.httpCode == 1 ){
+          this.modalStatus = false
+          this.$Message.info(res.msg)
+          this.getTableData()
+        } else {
+          this.$Message.info(res.msg)
+        }
+      })
+    },
+  }
+};
+</script>
+<style scoped lang="stylus">
+.content-main-manage {
+  position: relative;
+  height: 100%;
+}
+.search-list {
+  display: flex;
+  padding: 10px 0 0;
+}
+.search-left {
+  display: flex;
+  align-items: center;
+   .ivu-select {
+     width: 155px;
+     padding-right: 10px;
+     height: 32px;
+   }
+   .ivu-select-single .ivu-select-selection {
+     height: 100%;
+   }
+   >>> .ivu-input {
+     width: 160px;
+     height: 32px;
+   }
+   >>> .common-date-picker .ivu-input {
+    width: 210px;
+   }
+   >>> .ivu-input-prefix, >>> .ivu-input-suffix {
+     height: 32px;
+     line-height: 32px;
+   }
+   >>> .ivu-input-icon {
+     height: 32px;
+     line-height: 32px;
+   }
+   >>> .date-picker-main .ivu-date-picker-header {
+    border-bottom: 0.0052083333rem solid #204384;
+ }
+}
+.btn-container {
+  display: flex;
+  justify-content: space-between;
+  padding-bottom: 10px;
+  color: #0185EA;
+  font-size: 14px;
+  .btn-container-download {
+    cursor: pointer;
+  }
+  .common-corrections {
+    background: #053B4A;
+    border: 1px solid #0098C2;
+    color: #FFFFFF;
+    margin-right: 5px;
+  }
+  .common-eliminate {
+    background: #4C2215;
+    border: 1px solid #8E1919;
+    color: #FFFFFF;
+    margin-right: 5px;
+  }
+  .common-confirm {
+    background: #0C3423;
+    border: 1px solid #08AF68;
+    color: #FFFFFF;
+    margin-right: 5px;
+  }
+  .common-forward {
+    background: #413A09;
+    border: 1px solid #A69311;
+    color: #FFFFFF;
+  }
+}
+.common-form {
+  display: flex;
+  flex-wrap: wrap;
+}
+>>> .common-form-list .ivu-form-item {
+  margin-bottom: 10px;
+}
+.manage-main-center {
+  width: 100%;
+  height: calc(100% - 150px);
+}
+.common-table {
+  max-height: 100%;
+}
+>>> .common-table .ivu-table th {
+  height: 50px;
+ }
+ >>> .common-table .ivu-table td {
+  height: 49.5px;
+ }
+  >>> .common-table .ivu-spin-fix {
+   top: 50px;
+ }
+  >>> .app-table .ivu-spin-fix {
+   height: calc(100vh - 375px);
+ }
+ >>> .ivu-table-tip {
+  background: url('../../../assets/images/noData.png') no-repeat center;
+}
+>>> .app-table .ivu-table-tip {
+  height: calc(100vh - 375px);
+ }
+ >>> .common-table .ivu-table-tip table {
+ display: none;
+}
+ >>> .modal-table {
+   overflow: auto !important;
+ }
+ >>> .modal-table .ivu-spin-fix {
+   height: 200px;
+ }
+  >>> .modal-table .ivu-table-tip {
+   height: 200px;
+ }
+.common-page {
+  margin-top: 15px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+}
+.common-page-total {
+  color: #fff;
+  padding-right: 10px;
+  font-size: 14px;
+  span {
+    color #409EFF;
+  }
+}
+.common-form-item-text {
+  font-size: 11px;
+  color: #85A3D4;
+  margin: 10px 0;
+}
+/deep/ .ivu-input::-webkit-input-placeholder{
+  color: #718EBD;
+}
+/deep/ .ivu-input::-moz-placeholder{   /* Mozilla Firefox 19+ */
+  color: #718EBD;
+}
+/deep/ .ivu-input::-moz-placeholder{    /* Mozilla Firefox 4 to 18 */
+  color: #718EBD;
+}
+/deep/ .ivu-input::-ms-input-placeholder{  /* Internet Explorer 10-11 */
+  color: #718EBD;
+}
+.common-modal-select {
+  color: #fff;
+  font-size: 14px;
+  margin-bottom: 10px;
+  margin-left: 35PX;
+}
+</style>

src/views/homecomponents/EquipmentAnalysis/ContinuityMonitorConfig.vue

@@ -0,0 +1,1213 @@
+<template>
+  <div class="content-main-manage">
+    <!--今日告警表格 -->
+    <!-- <Table :columns="testColumns" :data="testTableData">
+        <template slot-scope="{ row }" v-for="(item,i) in testColumns" :slot="item.slot" >
+          <span v-if="i==0" style="text-decoration: underline;cursor: pointer;}">{{row.name}}</span>
+          <template v-else>
+            <span style="display:inline-block;width:49%;text-align:right;color:#F8952B;text-decoration: underline;cursor: pointer;}">{{row.alarmNum}}</span>
+            <span style="display:inline-block;width:2%;">丨</span>
+            <span style="display:inline-block;width:49%;text-align:left;padding-left:4px;text-decoration: underline;cursor: pointer;">{{row.alarmEquip}}</span>
+          </template>
+      </template>
+    </Table> -->
+    <div class="search-list">
+      <div class="search-left">
+        <Form class="common-form common-form-list" ref="tableParams" :model="tableParams" inline>
+          <FormItem label="" prop="coverTargetCount">
+            <Select v-model="tableParams.coverTargetCount" placeholder="策略覆盖指标数量">
+                <Option v-for="item in indicatorsNum" :value="item.value" :key="item.value">{{ item.label }}</Option>
+            </Select>
+          </FormItem>
+          <FormItem label="" prop="name">
+            <Input placeholder="请输入关键字查询" clearable search v-model="tableParams.name" />
+          </FormItem>
+          <FormItem label="" >
+            <Button type="primary" class="common-btn-search" @click="searchClick">
+              <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 筛选
+            </Button> 
+            <Button type="primary" class="common-btn-search" style="margin-left:10px" @click="resetClick('tableParams')">
+              <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 重置
+            </Button>   
+          </FormItem>
+        </Form>
+      </div>
+    </div>
+     <div class="btn-container">
+      <Button icon="ios-add" class="common-add-btn" @click="addClick">新增策略</Button>
+    </div>
+    <div class="manage-main-center">
+      <Table :columns="columns" :data="tableData" class="common-table app-table" no-data-text="" :row-class-name="rowClassName" :loading="loading">
+        <template slot="loading">
+            <Loading-animation></Loading-animation>
+        </template>
+         <template slot-scope="{ row }" slot="action">
+           <Tooltip content="详情" placement="top">
+              <i class="iconfont icon-xiangqingmingxi" style="cursor:pointer;color:#B8B532;fontSize:20px;marginRight:6px" @click="detailClick(row)"></i>
+           </Tooltip>
+           <Tooltip content="编辑" placement="top">
+              <i class="iconfont icon-bianji" style="cursor:pointer;color:#64ACFE;fontSize:20px;marginRight:6px" @click="editClick(row)"></i>
+           </Tooltip>
+           <Tooltip content="删除" placement="top">
+              <i class="iconfont icon-shanchu" style="cursor:pointer;color:#E92E2E;fontSize:20px;marginRight:6px" @click="delClick(row)"></i>
+           </Tooltip>
+        </template>
+      </Table>
+    </div>
+    <div class="common-page">
+      <div class="common-page-total">
+        共<span>{{tablePage}}</span>页 / <span>{{tableTotal}}</span>条数据
+      </div>
+      <Page :total="tableTotal" :current="tableParams.pageNum" :page-size="tableParams.pageSize" @on-change="changePage" @on-page-size-change="sizeChange" show-elevator />
+    </div>
+    <Modal
+      v-model="showModal"
+      :title="title"
+      width="40"
+      ref="modalGrag"
+      draggable
+      reset-drag-position
+      @on-visible-change="modalChange"
+      :mask-closable="false"
+      class-name="common-modal">
+      <div class="common-modal-top">
+        <span class="common-modal-top-text">基础信息</span>
+      </div>
+      <Form class="common-form" ref="formOption" :model="formOption" :rules="ruleValidate" :label-width="95" label-position="left">
+        <FormItem label="策略名称" prop="strategyName" style="width:100%">
+          <Input v-model.trim="formOption.strategyName" maxlength="20" show-word-limit /> 
+        </FormItem>
+        <FormItem label="来源应用：" prop="appId" style="width:100%">
+          <Select v-model="formOption.appId" placeholder="来源应用" @on-change="selectModalApp">
+             <Option v-for="item in appModalData" :value="item.id" :key="item.id">{{ item.appName }}</Option>
+          </Select>
+        </FormItem>
+        <FormItem label="设备类型：" prop="equipmentTypeId" style="width:100%">
+          <Select v-model="formOption.equipmentTypeId" placeholder="设备类型">
+             <Option v-for="item in equipTypeModalData" :value="item.equipmentTypeId" :key="item.equipmentTypeId">{{ item.equipmentName }}</Option>
+          </Select>
+        </FormItem>
+			</Form>
+      <div class="common-modal-top">
+        <span class="common-modal-top-text">处理策略</span>
+      </div>
+      <Form ref="formDynamic" :model="formCustom" :label-width="0" class="common-modal-bot">
+        <Row class="strategy-form-header">
+          <Col span="2" class="row-first"></Col>
+          <Col span="4">指标名称</Col>
+          <Col span="4">异常规则</Col>
+          <Col span="4">下限</Col>
+          <Col span="4">上限</Col>
+          <Col span="5">异常处理措施</Col>
+          <Col span="1" class="row-last"></Col>
+        </Row>
+        <div class="strategy-form-scroll common-scroll" v-if="showModal">
+          <div class="strategy-form">
+              <Row v-for="(item, index) in formCustom.alertStrategyDurativeDTOList" :key="index">
+              <Col span="2" :class="{'row-first': index == 0}" class="row-first-es">策略{{index + 1}}</Col>
+              <Col span="4" :class="{'row-first': index == 0}" class="row-select">
+                <FormItem
+                  :prop="'alertStrategyDurativeDTOList.'+index+'.targetId'" :rules="{required: true,type: 'number',message: '请选择监测指标',trigger: 'change'}">
+                  <Select v-model="item.targetId" style="width: 100%" placeholder="监测指标" transfer @on-change="selectTarget(item.targetId,index)" ref="targetId">
+                    <Option v-for="firstitem in indicatorsModalData" :value="firstitem.id" :key="firstitem.id">{{ firstitem.value }}</Option>
+                  </Select>
+                </FormItem>
+              </Col>
+              <Col span="4" :class="{'row-first': index == 0}" class="row-select">
+                <FormItem
+                  :prop="'alertStrategyDurativeDTOList.'+index+'.exceptionRule'" :rules="{required: true,type: 'number',message: '请选择异常规则',trigger: 'change'}">
+                  <Select v-model="item.exceptionRule" style="width: 100%" placeholder="异常规则" transfer @on-change="selectExceptionRule(item.exceptionRule,index)" ref="exceptionRule">
+                    <Option v-for="firstitem in exceptionRuleData" :value="firstitem.id" :key="firstitem.id">{{ firstitem.value }}</Option>
+                  </Select>
+                </FormItem>
+              </Col>
+              <Col span="4" :class="{'row-first': index == 0}" class="row-input">
+                <FormItem
+                  :prop="'alertStrategyDurativeDTOList.'+index+'.minValue'" :rules="{required: true,type: 'number',message: '请输入数字',trigger: 'blur'}">
+                 <InputNumber v-model.trim="item.minValue" placeholder="请输入数字" :active-change="false"></InputNumber>
+                </FormItem>
+              </Col>
+              <Col span="4" :class="{'row-first': index == 0}" class="row-input">
+                 <FormItem
+                  :prop="'alertStrategyDurativeDTOList.'+index+'.maxValue'" :rules="{required: true,type: 'number',message: '请输入数字',trigger: 'blur'}">
+                 <InputNumber v-model.trim="item.maxValue" placeholder="请输入数字" :active-change="false"></InputNumber>
+                </FormItem>
+              </Col>
+              <Col span="5" :class="{'row-first': index == 0}" class="row-es-last">
+                <FormItem
+                  :prop="'alertStrategyDurativeDTOList.'+index+'.rankId'" :rules="{required: true,type: 'number',message: '请选择告警等级',trigger: 'change'}" style="display:flex">
+                  <span class="row-es-last-text">判定为</span>
+                  <Select v-model="item.rankId" placeholder="告警等级" transfer style="width: 65%" @on-change="selectRank(item.rankId,index)" ref="rank">
+                    <Option v-for="firstitem in alarmLevelModalData" :value="firstitem.id" :key="firstitem.id">{{ firstitem.name }}</Option>
+                  </Select>
+                </FormItem>
+              </Col>
+              <Col span="1" class="ivu-col-btn">
+              <i class="iconfont icon-tianjia" style="cursor:pointer;color:#2DA0F8;padding-left:10px" @click="handleAdd('formDynamic')" v-if="index == formCustom.alertStrategyDurativeDTOList.length - 1 &&title=='新增策略'"></i>
+              <i class="iconfont icon-shanchu ivu-col-del" style="cursor:pointer; color:#BC2020;padding-left:10px" v-if="title=='编辑策略'" @click="handleRemove(index)"></i>
+              </Col>
+            </Row>
+          </div>
+        </div>
+        
+      </Form>
+      <div slot="footer">
+          <Button @click="modalCancel">取消</Button>
+          <Button type="primary" @click="modalOk">确定</Button>
+        </div>
+    </Modal>
+    <Modal
+      v-model="modalStatus"
+      :title="commonTitle"
+      width="30"
+      ref="modalGrag"
+      draggable
+      reset-drag-position
+      :mask-closable="false"
+      class-name="common-modal">
+      <Icon type="ios-information-circle" :style="{ color: activeColor}" class="modal-icon"></Icon>
+      <span class="modal-text">{{modalTitle}}</span>
+      <div slot="footer">
+          <Button @click="commonCancel">取消</Button>
+          <Button type="primary" @click="commonOk">确定</Button>
+        </div>
+    </Modal>
+     <Modal
+      v-model="detailStatus"
+      title="连续性监测策略详情"
+      width="45"
+      ref="modalGrag"
+      draggable
+      reset-drag-position
+      footer-hide
+      :mask-closable="false"
+      class-name="common-modal">
+      <div v-for="(item,index) in detailLabel" :key="index">
+        <div class="common-modal-top">
+         <span class="common-modal-top-text">{{item.name}}</span>
+        </div>
+        <div class="common-modal-content">
+          <div class="modal-content-item" v-for="(val,i) in item.arr" :key="i" :class="{'item-especial': val.name == '策略名称' && item.arr.length%2!=0,'item-especial-bot':(i==item.arr.length-1 || i==item.arr.length-2)}">
+            <span class="modal-content-item-name">
+            {{val.name}}
+            </span>
+            <div class="modal-content-item-value">
+                <Tooltip placement="top-start" transfer max-width="350" v-if="val.value || val.value===0">
+                  <span>{{val.value}}</span>
+                  <div slot="content">
+                    <span>{{val.value}}</span>
+                  </div>
+                </Tooltip>
+                <span v-else>{{val.value}}</span>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div>
+        <div class="common-modal-top">
+         <span class="common-modal-top-text">等级判定策略</span>
+        </div>
+        <Row class="strategy-form-header">
+          <Col span="2" class="row-first"></Col>
+          <Col span="4">指标名称</Col>
+          <Col span="5">异常规则</Col>
+          <Col span="4">下限</Col>
+          <Col span="4">上限</Col>
+          <Col span="5">异常处理措施</Col>
+        </Row>
+        <div class="strategy-form strategy-form-detail common-scroll" v-if="detailStatus">
+          <Row v-for="(item, index) in formCustom.alertStrategyDurativeDTOList" :key="index">
+            <Col span="2" :class="{'row-first': index == 0}" class="row-first-es row-first-es-detail">
+              <Tooltip placement="top-start" transfer max-width="350">
+                <span>策略{{index + 1}}</span>
+                <div slot="content">
+                  <span>策略{{index + 1}}</span>
+                </div>
+              </Tooltip>
+            </Col>
+             <Col span="4" :class="{'row-first': index == 0}" class="row-first-es row-first-es-border row-no-bg">
+              <Tooltip placement="top-start" transfer max-width="350">
+               <span>{{item.targetName}}</span>
+                <div slot="content">
+                   <span>{{item.targetName}}</span>
+                </div>
+              </Tooltip>
+            </Col>
+             <Col span="5" :class="{'row-first': index == 0}" class="row-first-es row-first-es-border row-no-bg">
+              <Tooltip placement="top-start" transfer max-width="350">
+                <span>{{item.exceptionRuleValue}}</span>
+                <div slot="content">
+                  <span>{{item.exceptionRuleValue}}</span>
+                </div>
+              </Tooltip>
+            </Col>
+            <Col span="4" :class="{'row-first': index == 0}" class="row-first-es row-first-es-border row-no-bg">
+              <Tooltip placement="top-start" transfer max-width="350">
+                <span>{{item.minValue}}</span>
+                <div slot="content">
+                  <span>{{item.minValue}}</span>
+                </div>
+              </Tooltip>
+            </Col>
+            <Col span="4" :class="{'row-first': index == 0}" class="row-first-es row-first-es-border row-no-bg">
+              <Tooltip placement="top-start" transfer max-width="350">
+                <span>{{item.maxValue}}</span>
+                <div slot="content">
+                  <span>{{item.maxValue}}</span>
+                </div>
+              </Tooltip>
+            </Col>
+            <Col span="5" :class="{'row-first': index == 0}" class="row-first-es row-es-last row-no-bg">
+            <Tooltip placement="top-start" transfer max-width="350">
+              <span style="color: #2b8ee2;" class="row-es-last-text row-detail-last-text">判定为</span>
+              <span style="width:70%;text-align: left;">{{item.rankName}}</span>
+              <div slot="content">
+                <span>{{item.rankName}}</span>
+              </div>
+            </Tooltip>
+            </Col>
+          </Row>
+        </div>
+      </div>
+    </Modal>
+  </div>
+</template>
+<script>
+const defaultFrom = {strategyName: '',appId:'',equipmentTypeId:''}
+export default {
+  name: "ContinuityMonitorConfig",
+  components:{
+  },
+  data() {
+    return {
+      alarmParams: {
+        keywords: '',
+        enabled: 1,
+        beginDate: '',
+        endDate: '',
+        pageNum: 1,
+        pageSize: 10
+      },
+      applicationParams: {
+        level: '',
+        lineId: '',
+        stationId: '',
+        equipmentCheck: '',
+        instrumentCheck: '',
+        pageNum: 1,
+        pageSize: 9999
+      },
+      appParams: {
+        applicationId: '',
+        equipmentTypeId: '',
+        keywords: '',
+        pageNum: 1,
+        pageSize: 9999
+      },
+      loading: true,
+      tableParams: {
+        keywords: '',
+        applicationId:'',
+        equipmentTypeId: '',
+        coverTargetCount: '',
+        name: '',
+        pageNum: 1,
+        pageSize: 10
+      },
+      tableData: [],
+      tableTotal: 0,
+      tablePage: 0,
+      rowObj: {},
+      indicatorsNum: [
+         {
+          value: '-1',
+          label: '策略覆盖指标数量'
+        },
+         {
+          value: '0-5',
+          label: '0-5'
+        },
+        {
+          value: '6-10',
+          label: '6-10'
+        },
+        {
+          value: '11-',
+          label: '11-'
+        }
+      ],
+      appModalData: [],
+      equipTypeModalData: [],
+      equipAppModalData: [],
+      exceptionRuleData: [],
+      alarmLevelModalData: [],
+      // testColumns: [{title:'设备',slot:'strategyName',align: 'center'},{title:'线网',slot:'appName',align: 'center'},{title:'1号线',slot:'equipmentTypeName',align: 'center'}],
+      // testTableData: [{alarmNum:1,alarmEquip: 2,name:'UPS'},{alarmNum:16767,alarmEquip: 67672,name:'UPS2'},{alarmNum:16767,alarmEquip: 67672,name:'UPS3'}],
+      columns: [
+          {
+            title: '连续性监测策略名称',
+            key: 'strategyName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '来源应用',
+            key: 'appName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '设备类型',
+            key: 'equipmentTypeName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '策略覆盖指标数量',
+            key: 'coverRankCount',
+            align: 'center'
+          },
+          {
+          title: '启用状态',
+          key: 'enabled',
+          align: 'center',
+          width: 120,
+          render: (h, params) => {
+            return h('div', [                             
+              h('i-switch', {
+                props: { value: params.row.enabled,'true-color': '#57C44F', trueValue:1,falseValue: 0
+                },
+                nativeOn:{
+                    "mousedown":(event)=>{ // 监听组件原生事件mousedown,此事件在click之前触发
+                      this.rowObj =  params.row
+                      if (params.row.enabled == 1) {
+                        this.commonTitle = '确认关闭'
+                        this.activeColor = '#E92E2E'
+                        this.activeClass = 'icon-guanbi'
+                        this.modalTitle = '可能影响新数据判断结果。'
+                        this.modalStatus = true
+                      } else {
+                         this.commonTitle = '确认启用'
+                        this.activeColor = '#57C44F'
+                        this.activeClass = 'icon-qiyong'
+                        this.modalTitle = '当前时间点后所有告警信息，将使用策略自动判定。'
+                        this.modalStatus = true
+                      }
+                    },
+                  }
+                }),
+              ])
+            }
+          },
+          {
+          title: '操作',
+          align: 'center',
+          slot: 'action',
+          width: 120,
+        }
+      ],
+      showModal: false,
+      detailStatus: false, 
+      modalStatus: false,
+      title: '新增策略',
+      commonTitle: "确认删除",
+      activeColor: '#E92E2E',
+      activeClass: '',
+      modalTitle: '',
+      formOption: {strategyName: '',appId:'',equipmentTypeId:''},
+      ruleValidate: {
+        strategyName: [{
+          required: true,
+          message: '请输入策略名称',
+          trigger: 'blur'
+        }],
+        appId: [{
+          required: true,
+          type: 'number',
+          message: '请选择来源应用',
+          trigger: 'change'
+        }],
+        equipmentTypeId: [{
+          required: true,
+          type: 'number',
+          message: '请输入设备名称',
+          trigger: 'change'
+        }],
+      }, 
+      detailLabel: [],
+      formCustom: {
+        alertStrategyDurativeDTOList: [
+          {
+            targetId: '',
+            targetName: '',
+            exceptionRule: '',
+            exceptionRuleValue: '',
+            minValue: null,
+            maxValue: null,
+            rankId: '',
+            rankName: ''
+          },
+        ],
+      },
+    };
+  },
+  mounted() {
+    this.getType()
+    // this.initTableColumn('testColumns');
+  },
+  methods: {
+    initTableColumn(columnName){
+      for(let i = 0; i < this[columnName].length; i++){
+        if(!this[columnName][i].renderHeader) {
+          // this.$set(this[columnName][i], 'ellipsis', true);
+          this.$set(this[columnName][i], 'renderHeader', (h, params) => {
+            let text = ''
+            if (i == 0) {
+              text = this[columnName][i].title
+            } else {
+              text = this[columnName][i].title + '<br/> <span style="color:#82ABEE">告警数丨告警设备数</span>';
+            }
+            return h('div', {
+                domProps:{
+                  innerHTML: text
+                }
+            })
+          });
+        }
+      }
+    },
+    go (){
+      // this.$router.push({path:'//ApplicationManage'})
+      // this.$router.push({path:'/MainPage/ApplicationManage/2'})
+      this.$router.push({ name: 'ApplicationManage', params: { type:2 }}) // -> /home/123
+    },
+    rowClassName(row, index) {
+      if (index % 2 == 0) {
+        return "ivu-table-stripe-even";
+      } else {
+        return "ivu-table-stripe-odd";
+      }
+    },
+    // 分页
+    changePage (val) {
+      this.tableParams.pageNum = val
+      this.getTableData()
+    },
+    //跳转
+    sizeChange (val) {
+      this.tableParams.pageSize = val
+      this.getTableData()
+    },
+    getType  () {
+     // 获取来源应用
+      this.$get('metroapi/application/info/list', this.applicationParams).then(res=>{
+        if (res.httpCode == 1 ){
+          this.appModalData = res.data.data
+        } else {
+          this.appModalData = []
+        }
+      })
+      // 获取监测指标
+      this.$get('metroapi/dic/queryDictionary', {name:'监测指标'}).then(res=>{
+        if (res.httpCode == 1 ){
+          this.indicatorsModalData = res.data
+        } else {
+          this.indicatorsModalData = []
+        }
+      })
+      // 获取异常规则
+      this.$get('metroapi/dic/queryDictionary', {name:'异常规则'}).then(res=>{
+        if (res.httpCode == 1 ){
+          this.exceptionRuleData = res.data
+        } else {
+          this.exceptionRuleData = []
+        }
+      })
+      // 告警等级
+      this.$get('metroapi/alert/rank/list', this.alarmParams).then(res=>{
+        if (res.httpCode == 1 ){
+          this.alarmLevelModalData = res.data.data
+        } else {
+          this.alarmLevelModalData = []
+        }
+      })
+    },
+    // 获取表格数据
+    getTableData (keywords,arr,level) {
+       if (level) {
+        this.tableParams.keywords = ''
+        if (level == 2) {
+          this.tableParams.applicationId = arr[arr.length-1]
+          this.tableParams.equipmentTypeId = ''
+        } else if (level == 3) {
+          this.tableParams.applicationId = arr[arr.length-2]
+          this.tableParams.equipmentTypeId = arr[arr.length-1]
+        } else {
+          this.tableParams.applicationId = ''
+          this.tableParams.equipmentTypeId = ''
+        }
+      } else {
+        this.tableParams.applicationId = ''
+        this.tableParams.equipmentTypeId = ''
+        if (keywords == '合肥轨道交通' || keywords == '' || !keywords) {
+          this.tableParams.keywords = ''
+        } else {
+          this.tableParams.keywords = keywords
+        }
+      }
+      let params = JSON.parse(JSON.stringify(this.tableParams))
+      params.coverTargetCount = params.coverTargetCount == '-1' ? '':params.coverTargetCount
+      this.loading = true
+      this.$get('metroapi/alertdurative/queryStrategyDurativePage', params).then(res=>{
+        this.loading = false
+          if (res.httpCode == 1 ){
+            this.tableData = res.data.data
+            this.tableTotal = res.data.count
+            if (res.data.data.length==0) {
+              this.tablePage = 0
+            } else {
+              this.tablePage = res.data.count<= 10 ? 1: Math.ceil(res.data.count/this.tableParams.pageSize)
+            }
+            if (res.data.data.length==0 && this.tableParams.pageNum>1) {
+              this.tableParams.pageNum--
+              return this.getTableData()
+            }
+          } else {
+            this.tableData = []
+            this.tableTotal = 0
+          }
+        })
+    },
+    selectModalApp (val) {
+      this.appParams.applicationId = val
+      this.formOption.equipmentTypeId = ''
+      if (val) {
+        this.getAddEquipType( this.appParams)
+      }
+    },
+    // 获取新增设备类型 
+    getAddEquipType (params) {
+      this.$get('metroapi/application/equipmentTypeInfo', params).then(res=>{
+        if (res.httpCode == 1 ){
+          this.equipTypeModalData = res.data.data
+        } else {
+          this.equipTypeModalData = []
+        }
+      })
+    },
+    searchClick () {
+      this.getTableData()
+    },
+    resetClick (name) {
+     this.$refs[name].resetFields()
+     this.getTableData()
+    },   
+    addClick () {
+      this.formOption = JSON.parse(JSON.stringify(defaultFrom))
+      this.formCustom.alertStrategyDurativeDTOList= [
+        {
+          targetId: '',
+          exceptionRule: '',
+          minValue: null,
+          maxValue: null,
+          rankId: ''
+        },
+      ],        
+      this.title = '新增策略'
+      this.showModal = true
+    },
+    detailClick (row) {
+      this.getstrategyData(row.id)
+      this.rowObj = row
+      this.$nextTick(()=> {
+         this.detailStatus = true
+      })
+    },
+    editClick (row) {
+      this.getstrategyData(row.id)
+      this.rowObj = row
+      this.formOption = JSON.parse(JSON.stringify(row));
+      this.appParams.applicationId = this.formOption.appId
+      this.getAddEquipType(this.appParams)
+      this.title = '编辑策略'
+      this.$nextTick(()=> {
+        this.showModal = true
+      })
+    },
+    getstrategyData (id) {
+      this.$get('metroapi/alertdurative/getStrategyDurative', {strategyId:id}).then(res=>{
+        if ( res.httpCode == 1 ){
+          this.detailLabel = [{name:'基础信息',arr:[{name:'策略名称',value:res.data.strategyName},{name:'设备类型',value:res.data.equipmentTypeName},{name:'来源应用',value:res.data.appName}]}]
+          this.formCustom.alertStrategyDurativeDTOList = res.data.alertStrategyDurativeDTOList
+        } else {
+          this.$Message.info(res.msg)
+        }
+      })
+    },
+    delClick (row) {
+      this.rowObj = row
+      this.commonTitle = '确认删除'
+      this.activeColor = '#E92E2E'
+      this.activeClass = ''
+      this.modalTitle = '删除的同时将解绑所有运营数据，且数据不可恢复，请慎重操作。'
+      this.modalStatus = true
+    },
+    modalChange (modalStatus) {
+     if (!modalStatus) {
+      this.$refs.formOption.resetFields();
+      this.$refs.formDynamic.resetFields();
+      this.equipTypeModalData = []
+     }
+    },
+    modalOk () {
+      let params = Object.assign({}, this.formOption, this.formCustom); // 合并对象 注意目标对象自身也会改变。假设目标对象{}是之前里的对象，他的值跟obj一样
+      this.$nextTick(()=> {
+        // 多个form表单验证
+        const p1 = new Promise((resolve,reject)=>{
+        this.$refs['formOption'].validate(valid=>{
+                if(valid) resolve()
+            })
+        })
+        const p2 = new Promise((resolve,reject)=>{
+            this.$refs['formDynamic'].validate(valid=>{
+                if(valid) resolve()
+            })
+        })
+        Promise.all([p1,p2]).then(()=>{
+          let canSave = true;
+          let arr = this.formCustom.alertStrategyDurativeDTOList
+          for (var i = 0; i < arr.length; i++) {
+            if (arr[i].maxValue <= arr[i].minValue) {
+               this.$Message['error']({
+                  background: true,
+                  content: '上限值必须大于下限值'
+               });
+              return
+            }
+              for (var j = i + 1; j < arr.length; j++) {
+                  if (arr[i].targetId == arr[j].targetId && arr[i].exceptionRule == arr[j].exceptionRule) 
+                  { 
+                    canSave = false; 
+                    break;
+                  }
+              }
+          }
+          if(canSave) {
+            this.saveStrategyData(params)
+          } else {
+            this.$Message['error']({
+              background: true,
+              content: '请勿设置重复对应指标-异常规则'
+            });
+          }
+        })
+      })
+    },
+    saveStrategyData (params) {
+      let url = ''
+      if (this.title == '新增策略') {
+        url = 'metroapi/alertdurative/addStrategyDurative'  
+      } else {
+        url = 'metroapi/alertdurative/editStrategyDurative'
+      }
+      this.$post(url, params).then(res=>{
+        if ( res.httpCode == 1 ){
+            this.showModal = false
+            this.$Message.info(res.msg)
+            this.getTableData()
+          } else {
+            this.$Message.info(res.msg)
+          }
+        })
+    },
+    modalCancel () {
+      this.showModal = false
+    },
+    commonOk () {
+      if (this.commonTitle == '确认启用') {
+        let params = {
+          strategyId: this.rowObj.id,
+          enabled: 1
+        }
+        this.getSwitchStatus(params)
+      } else if (this.commonTitle == '确认关闭') {
+        let params = {
+          strategyId: this.rowObj.id,
+          enabled:0
+        }
+        this.getSwitchStatus(params)
+      } else {
+        let params = {
+          strategyId: this.rowObj.id
+        }
+        this.delData(params)
+      }
+    },
+    commonCancel () {
+      this.modalStatus = false
+    },
+    // 启用 关闭/接口
+    getSwitchStatus (params) {
+      this.$get('metroapi/alertdurative/enableStrategyDurative',params).then(res=>{
+        if (res.httpCode == 1 ){
+          if (params.enabled == 0) {
+            this.rowObj.enabled = 0
+          } else {
+            this.rowObj.enabled = 1
+          }
+          this.modalStatus = false
+        } else {
+          this.rowObj.enabled = 0
+          this.$Message.info(res.msg)
+        }
+      })
+    },    
+    // 删除接口
+    delData (params) {
+      this.$get('metroapi/alertdurative/delStrategyDurative',params).then(res=>{
+        if (res.httpCode == 1 ){
+          this.modalStatus = false
+          this.$Message.info(res.msg)
+          this.getTableData()
+        } else {
+          this.$Message.info(res.msg)
+        }
+      })
+    },
+    handleAdd(name) {
+      this.$nextTick(()=> {
+        this.$refs[name].validate((valid) => {
+        if (valid) { 
+          this.formCustom.alertStrategyDurativeDTOList.push({
+            targetId: '',
+            targetName: '',
+            exceptionRule: '',
+            exceptionRuleValue: '',
+            minValue: null,
+            maxValue: null,
+            rankId: '',
+            rankName: ''
+          })
+        }
+       });
+      }) 
+    },
+    handleRemove(i) {
+      if (this.formCustom.alertStrategyDurativeDTOList.length == 1) {
+        this.$Message['error']({
+            background: true,
+            content: '请至少保留一条非空策略'
+        });
+      } else {
+        this.formCustom.alertStrategyDurativeDTOList.splice(i,1)
+      }
+    },
+    selectTarget (val,index) {
+      this.formCustom.alertStrategyDurativeDTOList[index].targetId = val
+      this.formCustom.alertStrategyDurativeDTOList[index].targetName = this.$refs.targetId[0].query
+    },
+    selectExceptionRule (val,index) {
+      this.formCustom.alertStrategyDurativeDTOList[index].exceptionRule = val
+      this.formCustom.alertStrategyDurativeDTOList[index].exceptionRuleValue = this.$refs.exceptionRule[0].query
+    },
+    selectRank (val,index) {
+      this.formCustom.alertStrategyDurativeDTOList[index].rankId = val
+      this.formCustom.alertStrategyDurativeDTOList[index].rankName = this.$refs.rank[0].query
+    }
+  }
+};
+</script>
+<style scoped lang="stylus">
+.content-main-manage {
+  position: relative;
+  height: 100%;
+}
+.search-list {
+  display: flex;
+  padding: 10px 0 0;
+}
+.search-left {
+  display: flex;
+  align-items: center;
+   .ivu-select {
+     width: 155px;
+     padding-right: 10px;
+     height: 32px;
+   }
+   .ivu-select-single .ivu-select-selection {
+     height: 100%;
+   }
+   >>> .ivu-input {
+     width: 160px;
+     height: 32px;
+   }
+   >>> .ivu-input-prefix, >>> .ivu-input-suffix {
+     height: 32px;
+     line-height: 32px;
+   }
+   >>> .ivu-input-icon {
+     height: 32px;
+     line-height: 32px;
+   }
+   >>> .date-picker-main .ivu-date-picker-header {
+    border-bottom: 0.0052083333rem solid #204384;
+ }
+}
+.btn-container {
+  display: flex;
+  justify-content: flex-end;
+  padding-bottom: 10px;
+}
+.common-form {
+  display: flex;
+  flex-wrap: wrap;
+}
+>>> .common-form-list .ivu-form-item {
+  margin-bottom: 10px;
+}
+.manage-main-center {
+  width: 100%;
+  height: calc(100% - 150px);
+}
+.common-table {
+  max-height: 100%;
+}
+>>> .common-table .ivu-table th {
+  height: 50px;
+ }
+ >>> .common-table .ivu-table td {
+  height: 49.5px;
+ }
+  >>> .common-table .ivu-spin-fix {
+   top: 50px;
+ }
+  >>> .app-table .ivu-spin-fix {
+   height: calc(100vh - 375px);
+ }
+ >>> .ivu-table-tip {
+  background: url('../../../assets/images/noData.png') no-repeat center;
+}
+>>> .app-table .ivu-table-tip {
+  height: calc(100vh - 375px);
+ }
+ >>> .common-table .ivu-table-tip table {
+ display: none;
+}
+ >>> .modal-table {
+   overflow: auto !important;
+ }
+ >>> .modal-table .ivu-spin-fix {
+   height: 200px;
+ }
+  >>> .modal-table .ivu-table-tip {
+   height: 200px;
+ }
+.common-page {
+  margin-top: 15px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+}
+.common-page-total {
+  color: #fff;
+  padding-right: 10px;
+  font-size: 14px;
+  span {
+    color #409EFF;
+  }
+}
+>>> .modal-tabs-item {
+  margin-top: 10px;
+}
+>>> .common-modal-top-text {
+  font-size: 14px;
+  font-weight: bold;
+  color: #29A0FF;
+  line-height: 42px;
+  border-left: 3px solid #1590F1;
+  padding-left: 12px;
+}
+>>> .common-modal-content {
+  display: flex;
+  width: 100%;
+  justify-content: space-between;
+  flex-wrap: wrap;
+  margin-bottom: 15px;
+  border-right: 1px solid #21437B;
+}
+>>> .modal-content-item {
+  width: 50%;
+  display: flex;
+}
+>>> .item-especial {
+  width: 100%;
+}
+>>> .modal-content-item-name {
+  width: 50%;
+  height: 45px;
+  line-height: 45px;
+  background: #13305F;
+  border-top: 1px solid #21437B;
+  border-left: 1px solid #21437B;
+  font-size: 14px;
+  color: #F5F5F5;
+  padding-left: 20px;
+}
+>>> .modal-content-item-value {
+  width: 50%;
+  height: 45px;
+  line-height: 45px;
+  background: #06214D;
+  border-top: 1px solid #21437B;
+  border-left: 1px solid #21437B;
+  font-size: 14px;
+  color: #F5F5F5;
+  padding-left: 20px;
+}
+>>> .item-especial .modal-content-item-name{
+  width: 25%;
+  height: 45px;
+  line-height: 45px;
+}
+>>> .item-especial .modal-content-item-value{
+  width: 75%;
+  height: 45px;
+  line-height: 45px;
+}
+>>> .item-especial-bot .modal-content-item-name {
+  border-bottom: 1px solid #21437B;
+}
+>>> .item-especial-bot .modal-content-item-value {
+  border-bottom: 1px solid #21437B;
+}
+>>> .common-modal-bot {
+  margin-bottom: 15px;
+}
+>>> .modal-content-item-value .ivu-tooltip {
+  width: 100%;
+}
+>>> .modal-content-item-value .ivu-tooltip-rel {
+  overflow: hidden;
+  text-overflow:ellipsis; 
+  white-space: nowrap;
+}
+>>> .strategy-form-scroll {
+  max-height: 360px;
+  overflow: hidden;
+  overflow-y: auto;  
+}
+>>> .strategy-form {
+margin-bottom: 20px;
+}
+>>> .strategy-form .ivu-col{
+  color: #2B8EE2;
+  font-size: 14PX;
+}
+>>> .row-first-es {
+  border-left: 1px solid #21437B;
+  border-bottom: 1px solid #21437B;
+  border-right: 1px solid #21437B;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  // background: #13305F;
+}
+>>> .strategy-form-header {
+  color: #2B8EE2;
+  font-size: 14PX;
+  display: flex;
+  align-items: center;
+  height: 55PX;
+  .ivu-col {
+    border-top: 1px solid #21437B;
+    border-right: 1px solid #21437B;
+    height: 100%;
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: #13305F;
+  }
+  .row-first {
+    border-left: 1px solid #21437B;
+  }
+  .row-last {
+    background: none;
+    border: none;
+  }
+}
+>>> .strategy-form .row-first{
+  border-top: 1px solid #21437B;
+}
+ >>> .strategy-form .row-first-es {
+     background: #13305F;
+  }
+>>> .strategy-form .ivu-form-item{
+  height: 100%;
+  margin-bottom: 0;
+}
+
+>>> .strategy-form .row-es-text {
+  border-left: none;
+  border-bottom: 1px solid #21437B;
+  border-right: 1px solid #21437B;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: #13305F;
+}
+>>> .row-select .ivu-form-item {
+  height: 100%;
+  border-right: 1px solid #21437B;
+  border-bottom: 1px solid #21437B;
+   .ivu-form-item-content {
+    padding: 10px 5px;
+  }
+}
+>>> .row-input {
+  border-bottom: 1px solid #21437B;
+  border-right: 1px solid #21437B;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  .ivu-input-number{
+   margin: 10px 5px;
+ }
+}
+>>> .strategy-form .row-es-last {
+  border-right: 1px solid #21437B;
+  border-bottom: 1px solid #21437B;
+  height: 100%;
+  // display: flex;
+  // justify-content: space-around;
+  // align-items: center;
+  .row-es-last-text {
+    font-size: 14PX;
+    margin-right: 5px;
+    display: inline-block;
+    width: 42px;
+  }
+  .ivu-form-item  {
+    // display: flex;
+    // flex: 1;
+    width: 100%;
+  }
+   .ivu-form-item-content {
+    // display: flex;
+    padding: 10px 5px;
+    width: 100%;
+  }
+}
+>>> .ivu-col-del {
+  cursor:pointer;
+  color:#BC2020;
+  padding-left:10px;
+}
+>>> .strategy-form .ivu-col-btn {
+  display: flex;
+  align-items: center;
+  border-top: none;
+  border-bottom: none;
+}
+>>> .strategy-form .ivu-form-item-error-tip {
+ padding-left: 6px;
+}
+>>> .strategy-form-detail {
+  max-height:350px;
+  overflow: hidden;
+  overflow-y: auto;
+}
+.strategy-form-detail .ivu-col{
+  text-align: center;
+  color: #fff;
+  height: 45px;
+  line-height: 45px
+}
+>>> .strategy-form-detail .row-first-es-detail {
+  color: #2b8ee2;
+}
+>>> .strategy-form-detail .row-first-es-border {
+  border-left: none;
+}
+>>> .strategy-form-detail .row-es-last {
+  border-left: none;
+}
+>>> .strategy-form-detail .row-no-bg {
+  background: none;
+}
+>>> .strategy-form-detail .strategy-form-row .ivu-col {
+  height: 100%;
+}
+>>> .strategy-form-detail .row-detail-last-text {
+  width: 30% !important;
+}
+>>> .strategy-form-detail .ivu-col{
+  .ivu-tooltip {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    align-items: center;
+  }
+  .ivu-tooltip-rel {
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+  span {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    padding-left: 4px;
+  }
+}
+/* 对话框里的input里的placeholder样式修改 */
+/deep/ .ivu-input::-webkit-input-placeholder , /deep/ .ivu-input-number-input::-webkit-input-placeholder{
+  color: #718EBD;
+}
+/deep/ .ivu-input::-moz-placeholder, /deep/ .ivu-input-number-input::-webkit-input-placeholder{   /* Mozilla Firefox 19+ */
+  color: #718EBD;
+}
+/deep/ .ivu-input::-moz-placeholde, /deep/ .ivu-input-number-input::-webkit-input-placeholderr{    /* Mozilla Firefox 4 to 18 */
+ color: #718EBD;
+}
+/deep/ .ivu-input::-ms-input-placeholder, /deep/ .ivu-input-number-input::-webkit-input-placeholder{  /* Internet Explorer 10-11 */
+  color: #718EBD;
+}
+>>> .ivu-input-number{
+  border: 1px solid #204A8F;
+  background-color: transparent;
+  width: -webkit-fill-available;
+}
+>>> .ivu-input-number-input {
+  background: #06214D;
+  /* border: 1px solid #0185EA; */
+  border-radius: 6px;
+  color: #F5F5F5;
+}
+>>> .ivu-input-number-handler-wrap {
+  background: #06214D;
+  border-left: 1px solid #0185EA;
+}
+>>> .ivu-input-number-handler-down {
+  border-top: 1px solid #0185EA;
+}
+>>> .ivu-input-number-handler-down-inner, >>> .ivu-input-number-handler-up-inner {
+  color: #0185EA;
+}
+.ivu-input:focus{
+  border: 1px solid #0185EA;
+}
+>>> .ivu-input-number-focused {
+  border: 1px solid #0185EA;
+}
+</style>

src/views/homecomponents/EquipmentAnalysis/FilteredAlarm.vue

@@ -0,0 +1,610 @@
+<template>
+  <div class="content-main-manage">
+    <div class="search-list">
+      <div class="search-left">
+        <Form class="common-form common-form-list" ref="tableParams" :model="tableParams" inline>
+           <FormItem label="" prop="alertRankId">
+            <Select v-model="tableParams.alertRankId" placeholder="告警等级">
+              <Option v-for="item in alarmLevelData" :value="item.id" :key="item.id">{{ item.name }}</Option>
+            </Select>
+          </FormItem>
+          <FormItem label="" prop="applicationId">
+            <Select v-model="tableParams.applicationId" placeholder="来源应用" @on-change="selectApp">
+              <Option v-for="item in appData" :value="item.id" :key="item.id">{{ item.appName }}</Option>
+            </Select>
+          </FormItem>
+          <FormItem label="" prop="equipmentTypeId">
+            <Select v-model="tableParams.equipmentTypeId" placeholder="设备类型">
+              <Option v-for="item in equipTypeData" :value="item.equipmentTypeId" :key="item.equipmentTypeId">{{ item.equipmentName }}</Option>
+            </Select>
+          </FormItem>
+          <FormItem label="">
+            <DatePicker type="daterange" :value="dateRange" :clearable="false" class="common-date-picker date-picker-main" placement="bottom-end" placeholder="告警时间范围" @on-change="changePicker"></DatePicker>
+          </FormItem>
+           <FormItem label="">
+            <DatePicker type="daterange" :value="dateOperateRange" :clearable="false" class="common-date-picker date-picker-main" placement="bottom-end" placeholder="操作时间范围" @on-change="changeOperatePicker"></DatePicker>
+          </FormItem>
+          <FormItem label="" prop="keywords">
+            <Input placeholder="请输入关键字查询" clearable search v-model="tableParams.keywords" />
+          </FormItem>
+          <FormItem label="" >
+            <Button type="primary" class="common-btn-search" @click="searchClick">
+              <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 筛选
+            </Button> 
+            <Button type="primary" class="common-btn-search" style="margin-left:10px" @click="resetClick('tableParams')">
+              <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 重置
+            </Button>   
+          </FormItem>
+        </Form>
+      </div>
+    </div>
+     <div class="btn-container">
+      <span class="btn-container-download" style="opacity: 0">
+        <i class="iconfont icon-xiazai" style="cursor:pointer;color:#0185EA;fontSize:20px;marginRight:6px"></i>下载列表筛选结果
+      </span>
+      <div>
+        <Button class="common-operate-btn common-corrections" @click="correctClick"> 
+          <i class="iconfont icon-gengzhenggonggao" style="vertical-align: middle;cursor:pointer;color:#ffffff;fontSize:20px;marginRight:6px"></i>
+          批量手动修正
+        </Button>
+        <!-- <Button class="common-add-btn common-forward">
+          <i class="iconfont icon-zhuanfafenxiang" style="cursor:pointer;color:#ffffff;fontSize:20px;marginRight:6px"></i>
+          批量转发通知
+        </Button> -->
+      </div>
+    </div>
+    <div class="manage-main-center">
+      <Table :columns="columns" :data="tableData" class="common-table app-table" no-data-text="" :row-class-name="rowClassName" :loading="loading" @on-selection-change="selectChange">
+        <template slot="loading">
+            <Loading-animation></Loading-animation>
+        </template>
+        <template slot-scope="{ row }" slot="alertRankColor">
+          <i class="iconfont icon-gaojing1" style="vertical-align: middle" :style="'color:' + row.alertRankColor"></i>
+        </template>
+         <template slot-scope="{ row }" slot="action">
+           <Tooltip content="详情" placement="top">
+              <i class="iconfont icon-xiangqingmingxi" style="cursor:pointer;color:#B8B532;fontSize:20px;marginRight:6px" @click="detailClick(row)"></i>
+           </Tooltip>
+           <Tooltip content="修正" placement="top">
+              <i class="iconfont icon-gengzhenggonggao" style="cursor:pointer;color:#0BB0DE;fontSize:20px;marginRight:6px" @click="correctClick(row)"></i>
+           </Tooltip>
+        </template>
+      </Table>
+    </div>
+    <div class="common-page">
+      <div class="common-page-total">
+        共<span>{{tablePage}}</span>页 / <span>{{tableTotal}}</span>条数据
+      </div>
+      <Page :total="tableTotal" :current="tableParams.pageNum" :page-size="tableParams.pageSize" @on-change="changePage" @on-page-size-change="sizeChange" show-elevator />
+    </div>
+    <Modal
+      v-model="showModal"
+      :title="title"
+      width="25"
+      ref="modalGrag"
+      draggable
+      reset-drag-position
+      @on-visible-change="modalChange"
+      :mask-closable="false"
+      class-name="common-modal">
+      <Form class="common-form" ref="formOption" :model="formOption" :label-width="0">
+        <div class="common-form-item-text">
+          将选中的告警信息等级，修正为
+        </div>
+        <FormItem label="" prop="alertRankId" style="width:100%">
+          <Select v-model="formOption.alertRankId" placeholder="告警等级">
+            <Option v-for="item in alarmLevelModalData" :value="item.id" :key="item.id">{{ item.name }}</Option>
+          </Select> 
+        </FormItem>
+        <FormItem label="" prop="processingStatus" style="width:100%">
+          <Select v-model="formOption.processingStatus" placeholder="告警状态">
+            <Option v-for="item in alarmModalStatus" :value="item.id" :key="item.id">{{ item.value }}</Option>
+          </Select> 
+        </FormItem>
+			</Form>
+      <div slot="footer">
+          <Button @click="modalCancel">取消</Button>
+          <Button type="primary" @click="modalOk">确定</Button>
+        </div>
+    </Modal>
+  </div>
+</template>
+<script>
+const defaultFrom = {alertRankId: null,processingStatus:null}
+export default {
+  name: "FilteredAlarm",
+  components:{
+  },
+  data() {
+    return {
+       alarmParams: {
+        keywords: '',
+        enabled: 1,
+        beginDate: '',
+        endDate: '',
+        pageNum: 1,
+        pageSize: 10
+      },
+      applicationParams: {
+        level: '',
+        lineId: '',
+        stationId: '',
+        equipmentCheck: '',
+        instrumentCheck: '',
+        pageNum: 1,
+        pageSize: 9999
+      },
+      appParams: {
+        applicationId: '',
+        equipmentTypeId: '',
+        keywords: '',
+        pageNum: 1,
+        pageSize: 9999
+      },
+      loading: true,
+      dateRange: [],
+      dateOperateRange: [],
+      tableParams: {
+        processingStatus: 41,
+        keywords: '',
+        applicationId:'',
+        equipmentTypeId: '',
+        alertRankId: '',
+        beginAlertTime: '',
+        endAlertTime: '',
+        beginUpdateTime: '',
+        endUpdateTime: '',
+        alertRankEnabled: 1,
+        pageNum: 1,
+        pageSize: 10
+      },
+      tableData: [],
+      tableTotal: 0,
+      tablePage: 0,
+      rowObj: {},
+      lineTypeData: [],
+      stationTypeData: [],
+      alarmLevelData: [],
+      alarmLevelModalData: [],
+      equipTypeData: [],
+      appData: [],
+      alarmModalStatus: [],
+      columns: [
+          {
+            type: 'selection',
+            width: 60,
+            align: 'center'
+          },
+          {
+            title: '操作时间',
+            key: 'updateTime',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '设备类型',
+            key: 'equipmentTypeName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '设备名称',
+            key: 'equipmentName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+           {
+            title: '告警内容',
+            key: 'alertContent',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '来源应用',
+            key: 'appName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          }, 
+          {
+            title: '告警时间',
+            key: 'alertTime',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '处理状态',
+            key: 'processingStatusDesc',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+          title: '操作',
+          align: 'center',
+          slot: 'action',
+          width: 120,
+        }
+      ],
+      showModal: false,
+      title: '告警信息修正',
+      dateModalRange: [],
+      formOption: {alertRankId: null,processingStatus:null},
+      idArr: []
+    };
+  },
+  mounted() {
+  },
+  methods: {
+    go (){
+      // this.$router.push({path:'//ApplicationManage'})
+      // this.$router.push({path:'/MainPage/ApplicationManage/2'})
+      this.$router.push({ name: 'ApplicationManage', params: { type:2 }}) // -> /home/123
+    },
+    changePicker (date) {
+      this.tableParams.beginAlertTime = date[0]
+      this.tableParams.endAlertTime = date[1]
+    },
+    changeOperatePicker (date) {
+      this.tableParams.beginUpdateTime = date[0]
+      this.tableParams.endUpdateTime = date[1]
+    },
+    rowClassName(row, index) {
+      if (index % 2 == 0) {
+        return "ivu-table-stripe-even";
+      } else {
+        return "ivu-table-stripe-odd";
+      }
+    },
+    // 分页
+    changePage (val) {
+      this.tableParams.pageNum = val
+      this.getTableData()
+    },
+    //跳转
+    sizeChange (val) {
+      this.tableParams.pageSize = val
+      this.getTableData()
+    },
+    getType  () {
+      // 获取归属应用
+      this.$get('metroapi/application/info/list', this.applicationParams).then(res=>{
+        if (res.httpCode == 1 ){
+          this.appData = res.data.data
+          this.appData.unshift({ id: '-1', appName: '来源应用' })
+        } else {
+          this.appData = []
+        }
+      })
+      // 告警等级
+      this.$get('metroapi/alert/rank/list', this.alarmParams).then(res=>{
+        if (res.httpCode == 1 ){
+          this.alarmLevelModalData = JSON.parse(JSON.stringify(res.data.data))
+          this.alarmLevelData = res.data.data
+          this.alarmLevelData.unshift({ id: '-1', name: '告警等级' })
+        } else {
+          this.alarmLevelData = []
+          this.alarmLevelModalData = []
+        }
+      })
+      // 告警状态
+      this.$get('metroapi/dic/queryDictionary', {name:'告警处理状态'}).then(res=>{
+        if (res.httpCode == 1 ){
+          this.alarmModalStatus = res.data
+        } else {
+          this.alarmModalStatus = []
+        }
+      })
+    },
+    selectChange (selection) {
+      this.idArr = selection.map(item => item.id)
+    },
+    // 获取表格数据
+    getTableData (keywords,arr,level) {
+       if (level) {
+        this.tableParams.keywords = ''
+        if (level == 2) {
+          this.tableParams.lineId = arr[arr.length-1]
+          this.tableParams.stationId = ''
+        } else if (level == 3) {
+          this.tableParams.lineId = arr[arr.length-2]
+          this.tableParams.stationId = arr[arr.length-1]
+        } else {
+          this.tableParams.lineId = ''
+          this.tableParams.stationId = ''
+        }
+      } else {
+        this.tableParams.lineId = ''
+        this.tableParams.stationId = ''
+        if (keywords == '合肥轨道交通' || keywords == '' || !keywords) {
+          this.tableParams.oneKeywords = ''
+        } else {
+          this.tableParams.oneKeywords = keywords
+        }
+      }
+      let params = JSON.parse(JSON.stringify(this.tableParams))
+      params.alertRankId = params.alertRankId == '-1' ? '':params.alertRankId
+      params.applicationId = params.applicationId == '-1' ? '':params.applicationId
+      params.equipmentTypeId = params.equipmentTypeId == '-1' ? '':params.equipmentTypeId 
+      this.loading = true
+      this.$get('metroapi/alert/processing/details', params).then(res=>{
+        this.loading = false
+          if (res.httpCode == 1 ){
+            this.tableData = res.data.data
+            this.tableTotal = res.data.count
+            if (res.data.data.length==0) {
+              this.tablePage = 0
+            } else {
+              this.tablePage = res.data.count<= 10 ? 1: Math.ceil(res.data.count/this.tableParams.pageSize)
+            }
+            if (res.data.data.length==0 && this.tableParams.pageNum>1) {
+              this.tableParams.pageNum--
+              return this.getTableData()
+            }
+          } else {
+            this.tableData = []
+            this.tableTotal = 0
+          }
+        })
+    },
+    selectApp (val) {
+      this.appParams.applicationId = val
+      this.tableParams.equipmentTypeId = ''
+      if (val) {
+        this.getAddEquipType( this.appParams)
+      }
+    },
+    // 获取设备类型 
+    getAddEquipType (params) {
+      if (params.applicationId == '-1') {
+        this.equipTypeData = [{ equipmentTypeId: '-1', equipmentName: '设备类型' }]
+      } else {
+        this.$get('metroapi/application/equipmentTypeInfo', params).then(res=>{
+          if (res.httpCode == 1 ){
+            this.equipTypeData = res.data.data
+            this.equipTypeData.unshift({ equipmentTypeId: '-1', equipmentName: '设备类型' })
+          } else {
+            this.equipTypeData = []
+          }
+        })
+      }
+    },
+    searchClick () {
+      this.getTableData()
+      // this.$router.push({ path: '/MainPage/ApplicationManage',  query: {deptName: "2"}})
+    },
+    resetClick (name) {
+     this.dateRange = []
+     this.tableParams.beginAlertTime = ''
+     this.tableParams.endAlertTime = ''
+     this.dateOperateRange = []
+     this.tableParams.beginUpdateTime = ''
+    this.tableParams.endUpdateTime =  ''
+     this.equipTypeData = [{ equipmentTypeId: '-1', equipmentName: '设备类型' }]
+     this.$refs[name].resetFields()
+     this.getTableData()
+    },   
+    correctClick (row) {
+      this.rowObj = row
+      if (row.id || this.idArr.length>0) {
+        this.formOption = JSON.parse(JSON.stringify(defaultFrom))
+        this.title = '告警信息修正'
+        this.showModal = true
+      } else {
+        this.$Message.info('请至少选择一条数据')
+      }
+    },
+    correctData (params) {
+      this.$post('metroapi/alert/processing/update/status',params).then(res=>{
+        if (res.httpCode == 1 ){
+          this.showModal = false
+          this.$Message.info(res.msg)
+          this.getTableData()
+        } else {
+          this.$Message.info(res.msg)
+        }
+      })
+    },
+    modalChange (modalStatus) {
+     if (!modalStatus) {
+      this.$refs.formOption.resetFields();
+      this.idArr = []
+     }
+    },
+    modalOk () {
+      let params = {
+        alertIds: this.idArr.join() || Number(this.rowObj.id),
+        processingStatus: this.formOption.processingStatus,
+        alertRankId: this.formOption.alertRankId,
+      }
+      this.correctData(params)
+    },
+    modalCancel () {
+      this.showModal = false
+    },
+    commonOk () {
+      let params = {
+        id: this.rowObj.id
+      }
+      this.delData(params)
+    },
+    commonCancel () {
+      this.modalStatus = false
+    },
+    // 删除接口
+    delData (params) {
+      this.$get('metroapi/equipment/delEquipment',params).then(res=>{
+        if (res.httpCode == 1 ){
+          this.modalStatus = false
+          this.$Message.info(res.msg)
+          this.getTableData()
+        } else {
+          this.$Message.info(res.msg)
+        }
+      })
+    },
+  }
+};
+</script>
+<style scoped lang="stylus">
+.content-main-manage {
+  position: relative;
+  height: 100%;
+}
+.search-list {
+  display: flex;
+  padding: 10px 0 0;
+}
+.search-left {
+  display: flex;
+  align-items: center;
+   .ivu-select {
+     width: 155px;
+     padding-right: 10px;
+     height: 32px;
+   }
+   .ivu-select-single .ivu-select-selection {
+     height: 100%;
+   }
+   >>> .ivu-input {
+     width: 160px;
+     height: 32px;
+   }
+   >>> .common-date-picker .ivu-input {
+    width: 210px;
+   }
+   >>> .ivu-input-prefix, >>> .ivu-input-suffix {
+     height: 32px;
+     line-height: 32px;
+   }
+   >>> .ivu-input-icon {
+     height: 32px;
+     line-height: 32px;
+   }
+   >>> .date-picker-main .ivu-date-picker-header {
+    border-bottom: 0.0052083333rem solid #204384;
+ }
+}
+.btn-container {
+  display: flex;
+  justify-content: space-between;
+  padding-bottom: 10px;
+  color: #0185EA;
+  font-size: 14px;
+  .btn-container-download {
+    cursor: pointer;
+  }
+  .common-corrections {
+    background: #053B4A;
+    border: 1px solid #0098C2;
+    color: #FFFFFF;
+    margin-right: 5px;
+  }
+  .common-eliminate {
+    background: #4C2215;
+    border: 1px solid #8E1919;
+    color: #FFFFFF;
+    margin-right: 5px;
+  }
+  .common-confirm {
+    background: #0C3423;
+    border: 1px solid #08AF68;
+    color: #FFFFFF;
+    margin-right: 5px;
+  }
+  .common-forward {
+    background: #413A09;
+    border: 1px solid #A69311;
+    color: #FFFFFF;
+  }
+}
+.common-form {
+  display: flex;
+  flex-wrap: wrap;
+}
+>>> .common-form-list .ivu-form-item {
+  margin-bottom: 10px;
+}
+.manage-main-center {
+  width: 100%;
+  height: calc(100% - 150px);
+}
+.common-table {
+  max-height: 100%;
+}
+>>> .common-table .ivu-table th {
+  height: 50px;
+ }
+ >>> .common-table .ivu-table td {
+  height: 49.5px;
+ }
+  >>> .common-table .ivu-spin-fix {
+   top: 50px;
+ }
+  >>> .app-table .ivu-spin-fix {
+   height: calc(100vh - 375px);
+ }
+ >>> .ivu-table-tip {
+  background: url('../../../assets/images/noData.png') no-repeat center;
+}
+>>> .app-table .ivu-table-tip {
+  height: calc(100vh - 375px);
+ }
+ >>> .common-table .ivu-table-tip table {
+ display: none;
+}
+ >>> .modal-table {
+   overflow: auto !important;
+ }
+ >>> .modal-table .ivu-spin-fix {
+   height: 200px;
+ }
+  >>> .modal-table .ivu-table-tip {
+   height: 200px;
+ }
+.common-page {
+  margin-top: 15px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+}
+.common-page-total {
+  color: #fff;
+  padding-right: 10px;
+  font-size: 14px;
+  span {
+    color #409EFF;
+  }
+}
+.common-form-item-text {
+  font-size: 11px;
+  color: #85A3D4;
+  margin: 10px 0;
+}
+/deep/ .ivu-input::-webkit-input-placeholder{
+  color: #718EBD;
+}
+/deep/ .ivu-input::-moz-placeholder{   /* Mozilla Firefox 19+ */
+  color: #718EBD;
+}
+/deep/ .ivu-input::-moz-placeholder{    /* Mozilla Firefox 4 to 18 */
+  color: #718EBD;
+}
+/deep/ .ivu-input::-ms-input-placeholder{  /* Internet Explorer 10-11 */
+  color: #718EBD;
+}
+.common-modal-select {
+  color: #fff;
+  font-size: 14px;
+  margin-bottom: 10px;
+  margin-left: 35PX;
+}
+</style>

src/views/homecomponents/EquipmentAnalysis/PolicyConfigManage.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="content-main">
-    <!-- <div class="content-body-wrap">
+    <div class="content-body-wrap">
      <div class="content-body">
         <Tabs :value="currentTabs" @on-click="tabsClick" class="common-tabs">
           <TabPane v-for="tab in tabsData" :key="tab.label" :label="tab.label" :name="tab.label"></TabPane>
@@ -29,11 +29,12 @@
               <level-deter-config  ref="levelDeter" class="content-body-manage" v-if="currentTabs == '等级判定策略配置'"></level-deter-config>
               <alarm-filter-config ref="alarmFilter" class="content-body-manage" v-if="currentTabs == '告警过滤策略配置'"></alarm-filter-config>
               <alarm-acknowledg-config ref="alarmAcknowledg" class="content-body-manage" v-if="currentTabs == '告警自动确认策略'"></alarm-acknowledg-config>
+              <continuity-monitor-config ref="continuityMonitor" class="content-body-manage" v-if="currentTabs == '连续性监测策略'"></continuity-monitor-config>
             </div>
           </i-col>
         </Row>
      </div>
-    </div> -->
+    </div>
   </div>
 </template>
 <script>
@@ -41,10 +42,11 @@ import AlarmLevelConfig from './AlarmLevelConfig.vue'
 import LevelDeterConfig from './LevelDeterConfig.vue'
 import AlarmFilterConfig from './AlarmFilterConfig.vue'
 import AlarmAcknowledgConfig from './AlarmAcknowledgConfig.vue'
+import ContinuityMonitorConfig from './ContinuityMonitorConfig.vue'
 export default {
   name: "PolicyConfigManage",
    components:{
-    AlarmLevelConfig,LevelDeterConfig,AlarmFilterConfig,AlarmAcknowledgConfig
+    AlarmLevelConfig,LevelDeterConfig,AlarmFilterConfig,AlarmAcknowledgConfig,ContinuityMonitorConfig
   },
   data() {
     return {
@@ -89,7 +91,7 @@ export default {
       this.currentStaData = []
       this.treeName = []
       this.$nextTick(()=> {
-        this.$refs.stationManage.getTableData(this.currentStation)
+       this.getCurrentTab(this.currentTabs,this.currentStation)
       })
       if(this.currentStation != ''){
         this.showTree = false
@@ -104,9 +106,7 @@ export default {
 		}, 500),
     clearChange () {
       this.getSelectedItem()
-      this.$nextTick(()=> {
-        this.$refs.stationManage.getTableData(this.currentStation)
-      })
+      this.getCurrentTab(this.currentTabs,this.currentStation)
     },
     getSelectedItem  () {
       this.stationData.forEach((item, index,itemArr) => {
@@ -123,7 +123,8 @@ export default {
         if (this.currentStation == '' && index == 0) {
           item.expand = true
         }
-        item.children.forEach((val, i,valArr) => {
+        if (item.children) {
+          item.children.forEach((val, i,valArr) => {
           val.expand = false; //expand 是否展开直子节点 
           val.disabled = false; // disabled 是否禁止选中
           val.selected = false;
@@ -138,28 +139,36 @@ export default {
           if (this.currentStation == '' && i==0) {
             val.expand = true
           }
-          val.children.forEach ((lastVal,lastIndex) => {
-            lastVal.selected = false; //expand 是否展开直子节点 
-            lastVal.disabled = false; 
-            lastVal.expand = false;
-            if (lastVal.title == this.currentStation) {
-              lastVal.selected = true;
-              lastVal.disabled = true; // disabled 是否禁止选中 
-              lastVal.expand = true;
-              val.expand = true
-              item.expand = true
-              this.currentStaData.push(lastVal)
-              this.showTree = true
-            } 
-          })
+          if (val.children) {
+            val.children.forEach ((lastVal,lastIndex) => {
+              lastVal.selected = false; //expand 是否展开直子节点 
+              lastVal.disabled = false; 
+              lastVal.expand = false;
+              if (lastVal.title == this.currentStation) {
+                lastVal.selected = true;
+                lastVal.disabled = true; // disabled 是否禁止选中 
+                lastVal.expand = true;
+                val.expand = true
+                item.expand = true
+                this.currentStaData.push(lastVal)
+                this.showTree = true
+              } 
+            })
+          } 
         });
+        }    
       });
     },
-    treeChange(val,arr) {
+    treeChange(val,arr,level) {
       this.currentStation = val
-      this.$nextTick(()=> {
-        this.$refs.stationManage.getTableData(this.currentStation)
-      })
+      this.getCurrentTab(this.currentTabs,this.currentStation,arr,level)
+      //  if (this.currentTabs == '设备管理') {
+      //   this.$refs.device.getTableData(this.currentStation,arr,level)
+      // } else if(this.currentTabs == '设备类型管理'){
+      //   this.$nextTick(()=> {
+      //     this.$refs.deviceType.getTableData(this.currentStation,arr,level)
+      //   })
+      // }
 		},
     tabsClick (name) {
       this.stationData = this.getElseTree(this.stationData) // 切换tab页时，清除tree选中情况
@@ -169,59 +178,27 @@ export default {
       if (document.querySelector(".station-tree-left")) {
         document.querySelector(".station-tree-left").scrollTo(0, 0) 
       }
-      // if (this.currentTabs == '告警等级配置') {
-      //    this.$nextTick(()=> {
-      //      this.$refs.alarmLevel.getTableData()
-      //      this.$refs.alarmLevel.getType()
-      //   })
-      // } else if(this.currentTabs == '等级判定策略配置'){
-      //   this.$nextTick(()=> {
-      //     this.$refs.levelDeter.getTableData(this.currentStation)
-      //     this.$refs.levelDeter.getType()
-      //   })
-      // } else if(this.currentTabs == '等级判定策略配置'){
-      //   this.$nextTick(()=> {
-      //     this.$refs.levelDeter.getTableData(this.currentStation)
-      //     this.$refs.levelDeter.getType()
-      //   })
-      // } else if(this.currentTabs == '等级判定策略配置'){
-      //   this.$nextTick(()=> {
-      //     this.$refs.levelDeter.getTableData(this.currentStation)
-      //     this.$refs.levelDeter.getType()
-      //   })
-      // } else if(this.currentTabs == '等级判定策略配置'){
-      //   this.$nextTick(()=> {
-      //     this.$refs.levelDeter.getTableData(this.currentStation)
-      //     this.$refs.levelDeter.getType()
-      //   })
-      // }
     },
-    getCurrentTab (currentTabs) {
+    getCurrentTab (currentTabs,currentStation,arr,level) {
       this.currentTabs = currentTabs || '告警等级配置'
       if (currentTabs == '告警等级配置' || !currentTabs) {
          this.$nextTick(()=> {
-          //  this.$refs.alarmLevel.getTableData()
-          //  this.$refs.alarmLevel.getType()
         })
       } else if(currentTabs == '等级判定策略配置'){       
         this.$nextTick(()=> {
-          // this.$refs.levelDeter.getTableData(this.currentStation)
-          // this.$refs.levelDeter.getType()
+          this.$refs.levelDeter.getTableData(currentStation,arr,level)
         })
-      } else if(currentTabs == '等级判定策略配置'){
+      } else if(currentTabs == '告警过滤策略配置'){
         this.$nextTick(()=> {
-          // this.$refs.levelDeter.getTableData(this.currentStation)
-          // this.$refs.levelDeter.getType()
+          this.$refs.alarmFilter.getTableData(currentStation,arr,level)
         })
-      } else if(currentTabs == '等级判定策略配置'){
+      } else if(currentTabs == '告警自动确认策略'){
         this.$nextTick(()=> {
-          // this.$refs.levelDeter.getTableData(this.currentStation)
-          // this.$refs.levelDeter.getType()
+          this.$refs.alarmAcknowledg.getTableData(currentStation,arr,level)
         })
-      } else if(currentTabs == '等级判定策略配置'){
+      } else if(currentTabs == '连续性监测策略'){
         this.$nextTick(()=> {
-          // this.$refs.levelDeter.getTableData(this.currentStation)
-          // this.$refs.levelDeter.getType()
+          this.$refs.continuityMonitor.getTableData(currentStation,arr,level)
         })
       }
     },

src/views/homecomponents/EquipmentAnalysis/ToConfirmedAlarm.vue

@@ -0,0 +1,677 @@
+<template>
+  <div class="content-main-manage">
+    <div class="search-list">
+      <div class="search-left">
+        <Form class="common-form common-form-list" ref="tableParams" :model="tableParams" inline>
+           <FormItem label="" prop="alertRankId">
+            <Select v-model="tableParams.alertRankId" placeholder="告警等级">
+              <Option v-for="item in alarmLevelData" :value="item.id" :key="item.id">{{ item.name }}</Option>
+            </Select>
+          </FormItem>
+          <FormItem label="" prop="applicationId">
+            <Select v-model="tableParams.applicationId" placeholder="来源应用" @on-change="selectApp">
+              <Option v-for="item in appData" :value="item.id" :key="item.id">{{ item.appName }}</Option>
+            </Select>
+          </FormItem>
+          <FormItem label="" prop="equipmentTypeId">
+            <Select v-model="tableParams.equipmentTypeId" placeholder="设备类型">
+              <Option v-for="item in equipTypeData" :value="item.equipmentTypeId" :key="item.equipmentTypeId">{{ item.equipmentName }}</Option>
+            </Select>
+          </FormItem>
+          <FormItem label="">
+            <DatePicker type="daterange" :value="dateRange" :clearable="false" class="common-date-picker date-picker-main" placement="bottom-end" placeholder="告警时间范围" @on-change="changePicker"></DatePicker>
+          </FormItem>
+          <FormItem label="" prop="keywords">
+            <Input placeholder="请输入关键字查询" clearable search v-model="tableParams.keywords" />
+          </FormItem>
+          <FormItem label="" >
+            <Button type="primary" class="common-btn-search" @click="searchClick">
+              <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 筛选
+            </Button> 
+            <Button type="primary" class="common-btn-search" style="margin-left:10px" @click="resetClick('tableParams')">
+              <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 重置
+            </Button>   
+          </FormItem>
+        </Form>
+      </div>
+    </div>
+     <div class="btn-container">
+      <span class="btn-container-download" style="opacity: 0">
+        <i class="iconfont icon-xiazai" style="cursor:pointer;color:#0185EA;fontSize:20px;marginRight:6px"></i>下载列表筛选结果
+      </span>
+      <div>
+        <Button class="common-operate-btn common-corrections" @click="correctClick"> 
+          <i class="iconfont icon-gengzhenggonggao" style="cursor:pointer;color:#ffffff;fontSize:20px;marginRight:6px"></i>
+          批量手动修正
+        </Button>
+         <Button class="common-operate-btn common-eliminate" @click="delClick"> 
+          <i class="iconfont icon-shanchu" style="cursor:pointer;color:#ffffff;fontSize:20px;marginRight:6px"></i>
+          批量清除告警
+        </Button>
+         <Button class="common-operate-btn common-confirm" @click="queenClick"> 
+          <i class="iconfont icon-queren" style="cursor:pointer;color:#ffffff;fontSize:20px;marginRight:6px"></i>
+          批量确认告警
+        </Button>
+        <!-- <Button class="common-add-btn common-forward">
+          <i class="iconfont icon-zhuanfafenxiang" style="cursor:pointer;color:#ffffff;fontSize:20px;marginRight:6px"></i>
+          批量转发通知
+        </Button> -->
+      </div>
+    </div>
+    <div class="manage-main-center">
+      <Table :columns="columns" :data="tableData" class="common-table app-table" no-data-text="" :row-class-name="rowClassName" :loading="loading" @on-selection-change="selectChange">
+        <template slot="loading">
+            <Loading-animation></Loading-animation>
+        </template>
+        <template slot-scope="{ row }" slot="alertRankColor">
+          <i class="iconfont icon-gaojing1" style="vertical-align: middle" :style="'color:' + row.alertRankColor"></i>
+        </template>
+         <template slot-scope="{ row }" slot="action">
+           <Tooltip content="详情" placement="top">
+              <i class="iconfont icon-xiangqingmingxi" style="cursor:pointer;color:#B8B532;fontSize:20px;marginRight:6px" @click="detailClick(row)"></i>
+           </Tooltip>
+           <Tooltip content="修正" placement="top">
+              <i class="iconfont icon-gengzhenggonggao" style="cursor:pointer;color:#0BB0DE;fontSize:20px;marginRight:6px" @click="correctClick(row)"></i>
+           </Tooltip>
+           <Tooltip content="清除" placement="top">
+              <i class="iconfont icon-shanchu" style="cursor:pointer;color:#E92E2E;fontSize:20px;marginRight:6px" @click="delClick(row)"></i>
+           </Tooltip>
+            <Tooltip content="确认" placement="top">
+              <i class="iconfont icon-queren" style="cursor:pointer;color:#08AF68;fontSize:20px;marginRight:6px" @click="queenClick(row)"></i>
+           </Tooltip>
+           <!-- <Tooltip content="转发" placement="top">
+              <i class="iconfont icon-zhuanfafenxiang" style="cursor:pointer;color:#BCA507;fontSize:20px;marginRight:6px" @click="forwardClick(row)"></i>
+           </Tooltip> -->
+        </template>
+      </Table>
+    </div>
+    <div class="common-page">
+      <div class="common-page-total">
+        共<span>{{tablePage}}</span>页 / <span>{{tableTotal}}</span>条数据
+      </div>
+      <Page :total="tableTotal" :current="tableParams.pageNum" :page-size="tableParams.pageSize" @on-change="changePage" @on-page-size-change="sizeChange" show-elevator />
+    </div>
+    <Modal
+      v-model="showModal"
+      :title="title"
+      width="25"
+      ref="modalGrag"
+      draggable
+      reset-drag-position
+      @on-visible-change="modalChange"
+      :mask-closable="false"
+      class-name="common-modal">
+      <Form class="common-form" ref="formOption" :model="formOption" :label-width="0">
+        <div class="common-form-item-text">
+          将选中的告警信息等级，修正为
+        </div>
+        <FormItem label="" prop="alertRankId" style="width:100%">
+          <Select v-model="formOption.alertRankId" placeholder="告警等级">
+            <Option v-for="item in alarmLevelModalData" :value="item.id" :key="item.id">{{ item.name }}</Option>
+          </Select> 
+        </FormItem>
+        <FormItem label="" prop="processingStatus" style="width:100%">
+          <Select v-model="formOption.processingStatus" placeholder="告警状态">
+            <Option v-for="item in alarmModalStatus" :value="item.id" :key="item.id">{{ item.value }}</Option>
+          </Select> 
+        </FormItem>
+			</Form>
+      <div slot="footer">
+          <Button @click="modalCancel">取消</Button>
+          <Button type="primary" @click="modalOk">确定</Button>
+        </div>
+    </Modal>
+    <Modal
+      v-model="modalStatus"
+      :title="commonTitle"
+      width="30"
+      ref="modalGrag"
+      draggable
+      reset-drag-position
+      :mask-closable="false"
+      class-name="common-modal">
+      <div class="common-modal-select" :style="{ color: activeColor}" v-if="idArr.length>1">已选择：{{idArr.length}}条数据</div>
+      <i class="iconfont icon-queren" style="vertical-align: middle;cursor:pointer;color:#08AF68;fontSize:20px;marginRight:6px" v-show="commonTitle=='告警确认'"></i>
+      <i class="iconfont icon-shanchu" style="vertical-align: middle;cursor:pointer;color:#E92E2E;fontSize:20px;marginRight:6px" v-show="commonTitle=='确认清除'"></i>
+      <span class="modal-text">{{modalTitle}}</span>
+      <div slot="footer">
+          <Button @click="commonCancel">取消</Button>
+          <Button type="primary" @click="commonOk">确定</Button>
+        </div>
+    </Modal>
+  </div>
+</template>
+<script>
+const defaultFrom = {alertRankId: null,processingStatus:null}
+export default {
+  name: "ToConfirmedAlarm",
+  components:{
+  },
+  data() {
+    return {
+       alarmParams: {
+        keywords: '',
+        enabled: 1,
+        beginDate: '',
+        endDate: '',
+        pageNum: 1,
+        pageSize: 10
+      },
+      applicationParams: {
+        level: '',
+        lineId: '',
+        stationId: '',
+        equipmentCheck: '',
+        instrumentCheck: '',
+        pageNum: 1,
+        pageSize: 9999
+      },
+      appParams: {
+        applicationId: '',
+        equipmentTypeId: '',
+        keywords: '',
+        pageNum: 1,
+        pageSize: 9999
+      },
+      loading: true,
+      dateRange: [],
+      tableParams: {
+        processingStatus: 38,
+        keywords: '',
+        applicationId:'',
+        equipmentTypeId: '',
+        alertRankId: '',
+        beginAlertTime: '',
+        endAlertTime: '',
+        alertRankEnabled: 1,
+        pageNum: 1,
+        pageSize: 10
+      },
+      tableData: [],
+      tableTotal: 0,
+      tablePage: 0,
+      rowObj: {},
+      lineTypeData: [],
+      stationTypeData: [],
+      alarmLevelData: [],
+      alarmLevelModalData: [],
+      equipTypeData: [],
+      appData: [],
+      alarmModalStatus: [],
+      columns: [
+          {
+            type: 'selection',
+            width: 60,
+            align: 'center'
+          },
+          {
+            title: '告警等级',
+            key: 'alertRankName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '警示颜色',
+            slot: 'alertRankColor',
+            align: 'center',
+          },
+          {
+            title: '设备类型',
+            key: 'equipmentTypeName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '设备名称',
+            key: 'equipmentName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+           {
+            title: '告警内容',
+            key: 'alertContent',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '来源应用',
+            key: 'appName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          }, 
+          {
+            title: '告警时间',
+            key: 'alertTime',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '处理状态',
+            key: 'processingStatusDesc',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+          title: '操作',
+          align: 'center',
+          slot: 'action',
+          width: 160,
+        }
+      ],
+      showModal: false,
+      modalStatus: false,
+      title: '告警信息修正',
+      commonTitle: "确认清除",
+      activeColor: '#E92E2E',
+      activeClass: '',
+      modalTitle: '',
+      dateModalRange: [],
+      formOption: {alertRankId: null,processingStatus: null},
+      idArr: []
+    };
+  },
+  mounted() {
+  },
+  methods: {
+    go (){
+      // this.$router.push({path:'//ApplicationManage'})
+      // this.$router.push({path:'/MainPage/ApplicationManage/2'})
+      this.$router.push({ name: 'ApplicationManage', params: { type:2 }}) // -> /home/123
+    },
+    changePicker (date) {
+      this.tableParams.beginAlertTime = date[0]
+      this.tableParams.endAlertTime = date[1]
+    },
+    changeModalPicker (date) {
+      this.formOption.dates = date
+      this.formOption.useDate = date[0]
+      this.formOption.endDate = date[1]
+    },
+    rowClassName(row, index) {
+      if (index % 2 == 0) {
+        return "ivu-table-stripe-even";
+      } else {
+        return "ivu-table-stripe-odd";
+      }
+    },
+    // 分页
+    changePage (val) {
+      this.tableParams.pageNum = val
+      this.getTableData()
+    },
+    //跳转
+    sizeChange (val) {
+      this.tableParams.pageSize = val
+      this.getTableData()
+    },
+    getType  () {
+      // 获取归属应用
+      this.$get('metroapi/application/info/list', this.applicationParams).then(res=>{
+        if (res.httpCode == 1 ){
+          this.appData = res.data.data
+          this.appData.unshift({ id: '-1', appName: '来源应用' })
+        } else {
+          this.appData = []
+        }
+      })
+      // 告警等级
+      this.$get('metroapi/alert/rank/list', this.alarmParams).then(res=>{
+        if (res.httpCode == 1 ){
+          this.alarmLevelModalData = JSON.parse(JSON.stringify(res.data.data))
+          this.alarmLevelData = res.data.data
+          this.alarmLevelData.unshift({ id: '-1', name: '告警等级' })
+        } else {
+          this.alarmLevelData = []
+          this.alarmLevelModalData = []
+        }
+      })
+      // 告警状态
+      this.$get('metroapi/dic/queryDictionary', {name:'告警处理状态'}).then(res=>{
+        if (res.httpCode == 1 ){
+          this.alarmModalStatus = res.data
+        } else {
+          this.alarmModalStatus = []
+        }
+      })
+    },
+    selectChange (selection) {
+      this.idArr = selection.map(item => item.id)
+    },
+    // 获取表格数据
+    getTableData (keywords,arr,level) {
+       if (level) {
+        this.tableParams.keywords = ''
+        if (level == 2) {
+          this.tableParams.lineId = arr[arr.length-1]
+          this.tableParams.stationId = ''
+        } else if (level == 3) {
+          this.tableParams.lineId = arr[arr.length-2]
+          this.tableParams.stationId = arr[arr.length-1]
+        } else {
+          this.tableParams.lineId = ''
+          this.tableParams.stationId = ''
+        }
+      } else {
+        this.tableParams.lineId = ''
+        this.tableParams.stationId = ''
+        if (keywords == '合肥轨道交通' || keywords == '' || !keywords) {
+          this.tableParams.oneKeywords = ''
+        } else {
+          this.tableParams.oneKeywords = keywords
+        }
+      }
+      let params = JSON.parse(JSON.stringify(this.tableParams))
+      params.alertRankId = params.alertRankId == '-1' ? '':params.alertRankId
+      params.applicationId = params.applicationId == '-1' ? '':params.applicationId
+      params.equipmentTypeId = params.equipmentTypeId == '-1' ? '':params.equipmentTypeId 
+      this.loading = true
+      this.$get('metroapi/alert/processing/details', params).then(res=>{
+        this.loading = false
+          if (res.httpCode == 1 ){
+            this.tableData = res.data.data
+            this.tableTotal = res.data.count
+            if (res.data.data.length==0) {
+              this.tablePage = 0
+            } else {
+              this.tablePage = res.data.count<= 10 ? 1: Math.ceil(res.data.count/this.tableParams.pageSize)
+            }
+            if (res.data.data.length==0 && this.tableParams.pageNum>1) {
+              this.tableParams.pageNum--
+              return this.getTableData()
+            }
+          } else {
+            this.tableData = []
+            this.tableTotal = 0
+          }
+        })
+    },
+    selectApp (val) {
+      this.appParams.applicationId = val
+      this.tableParams.equipmentTypeId = ''
+      if (val) {
+        this.getAddEquipType( this.appParams)
+      }
+    },
+    // 获取设备类型 
+    getAddEquipType (params) {
+      if (params.applicationId == '-1') {
+        this.equipTypeData = [{ equipmentTypeId: '-1', equipmentName: '设备类型' }]
+      } else {
+        this.$get('metroapi/application/equipmentTypeInfo', params).then(res=>{
+          if (res.httpCode == 1 ){
+            this.equipTypeData = res.data.data
+            this.equipTypeData.unshift({ equipmentTypeId: '-1', equipmentName: '设备类型' })
+          } else {
+            this.equipTypeData = []
+          }
+        })
+      }
+    },
+    searchClick () {
+      this.getTableData()
+      // this.$router.push({ path: '/MainPage/ApplicationManage',  query: {deptName: "2"}})
+    },
+    resetClick (name) {
+     this.dateRange = []
+     this.tableParams.beginAlertTime = ''
+     this.tableParams.endAlertTime = ''
+     this.equipTypeData = [{ equipmentTypeId: '-1', equipmentName: '设备类型' }]
+     this.$refs[name].resetFields()
+     this.getTableData()
+    },
+    correctClick (row) {
+      this.rowObj = row
+      if (row.id || this.idArr.length>0) {
+        this.formOption = JSON.parse(JSON.stringify(defaultFrom))
+        this.title = '告警信息修正'
+        this.showModal = true
+      } else {
+        this.$Message.info('请至少选择一条数据')
+      }
+    },
+    correctData (params) {
+      this.$post('metroapi/alert/processing/update/status',params).then(res=>{
+        if (res.httpCode == 1 ){
+          this.showModal = false
+          this.$Message.info(res.msg)
+          this.getTableData()
+        } else {
+          this.$Message.info(res.msg)
+        }
+      })
+    },
+    queenClick (row) {
+      this.rowObj = row
+      this.commonTitle = '告警确认'
+      this.activeColor = '#08AF68'
+      this.activeClass = ''
+      this.modalTitle = '告警信息状态将被标注为【已确认】，告警将被确认为有效信息。'
+      this.modalStatus = true
+    },
+    forwardClick (row) {
+
+    },
+    // editClick (row) {
+    //   this.rowObj = row
+    //   this.formOption = JSON.parse(JSON.stringify(row));
+    //   this.formOption.lineId = this.formOption.lineId ? String(this.formOption.lineId) : '-1'
+    //   this.formOption.stationId = this.formOption.stationId ? String(this.formOption.stationId) : '-1'
+    //   this.getStationData(this.formOption.lineId)
+    //   this.appParams.applicationId = this.formOption.appId
+    //   this.getAddEquipType(this.appParams)
+    //   this.title = '告警信息-修正'
+    //   this.showModal = true
+    // },
+    delClick (row) {
+      this.rowObj = row
+      this.commonTitle = '确认清除'
+      this.activeColor = '#E92E2E'
+      this.activeClass = ''
+      this.modalTitle = '告警信息状态将被标注为【已清除】，从系统有效数据中脱钩。'
+      this.modalStatus = true
+    },
+    modalChange (modalStatus) {
+     if (!modalStatus) {
+      this.$refs.formOption.resetFields();
+      this.idArr = []
+     }
+    },
+    modalOk () {
+      let params = {
+        alertIds: this.idArr.join() || Number(this.rowObj.id),
+        processingStatus: this.formOption.processingStatus,
+        alertRankId: this.formOption.alertRankId,
+      }
+      this.correctData(params)
+    },
+    modalCancel () {
+      this.showModal = false
+    },
+    commonOk () {
+      let params = {
+        id: this.rowObj.id
+      }
+      this.delData(params)
+    },
+    commonCancel () {
+      this.modalStatus = false
+    },
+    // 删除接口
+    delData (params) {
+      this.$get('metroapi/equipment/delEquipment',params).then(res=>{
+        if (res.httpCode == 1 ){
+          this.modalStatus = false
+          this.$Message.info(res.msg)
+          this.getTableData()
+        } else {
+          this.$Message.info(res.msg)
+        }
+      })
+    },
+  }
+};
+</script>
+<style scoped lang="stylus">
+.content-main-manage {
+  position: relative;
+  height: 100%;
+}
+.search-list {
+  display: flex;
+  padding: 10px 0 0;
+}
+.search-left {
+  display: flex;
+  align-items: center;
+   .ivu-select {
+     width: 155px;
+     padding-right: 10px;
+     height: 32px;
+   }
+   .ivu-select-single .ivu-select-selection {
+     height: 100%;
+   }
+   >>> .ivu-input {
+     width: 160px;
+     height: 32px;
+   }
+    >>> .common-date-picker .ivu-input {
+    width: 210px;
+   }
+   >>> .ivu-input-prefix, >>> .ivu-input-suffix {
+     height: 32px;
+     line-height: 32px;
+   }
+   >>> .ivu-input-icon {
+     height: 32px;
+     line-height: 32px;
+   }
+   >>> .date-picker-main .ivu-date-picker-header {
+    border-bottom: 0.0052083333rem solid #204384;
+ }
+}
+.btn-container {
+  display: flex;
+  justify-content: space-between;
+  padding-bottom: 10px;
+  color: #0185EA;
+  font-size: 14px;
+  .btn-container-download {
+    cursor: pointer;
+  }
+  .common-corrections {
+    background: #053B4A;
+    border: 1px solid #0098C2;
+    color: #FFFFFF;
+    margin-right: 5px;
+  }
+  .common-eliminate {
+    background: #4C2215;
+    border: 1px solid #8E1919;
+    color: #FFFFFF;
+    margin-right: 5px;
+  }
+  .common-confirm {
+    background: #0C3423;
+    border: 1px solid #08AF68;
+    color: #FFFFFF;
+    margin-right: 5px;
+  }
+  .common-forward {
+    background: #413A09;
+    border: 1px solid #A69311;
+    color: #FFFFFF;
+  }
+}
+.common-form {
+  display: flex;
+  flex-wrap: wrap;
+}
+>>> .common-form-list .ivu-form-item {
+  margin-bottom: 10px;
+}
+.manage-main-center {
+  width: 100%;
+  height: calc(100% - 150px);
+}
+.common-table {
+  max-height: 100%;
+}
+>>> .common-table .ivu-table th {
+  height: 50px;
+ }
+ >>> .common-table .ivu-table td {
+  height: 49.5px;
+ }
+  >>> .common-table .ivu-spin-fix {
+   top: 50px;
+ }
+  >>> .app-table .ivu-spin-fix {
+   height: calc(100vh - 375px);
+ }
+ >>> .ivu-table-tip {
+  background: url('../../../assets/images/noData.png') no-repeat center;
+}
+>>> .app-table .ivu-table-tip {
+  height: calc(100vh - 375px);
+ }
+ >>> .common-table .ivu-table-tip table {
+ display: none;
+}
+ >>> .modal-table {
+   overflow: auto !important;
+ }
+ >>> .modal-table .ivu-spin-fix {
+   height: 200px;
+ }
+  >>> .modal-table .ivu-table-tip {
+   height: 200px;
+ }
+.common-page {
+  margin-top: 15px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+}
+.common-page-total {
+  color: #fff;
+  padding-right: 10px;
+  font-size: 14px;
+  span {
+    color #409EFF;
+  }
+}
+.common-form-item-text {
+  font-size: 11px;
+  color: #85A3D4;
+  margin: 10px 0;
+}
+/deep/ .ivu-input::-webkit-input-placeholder{
+  color: #718EBD;
+}
+/deep/ .ivu-input::-moz-placeholder{   /* Mozilla Firefox 19+ */
+  color: #718EBD;
+}
+/deep/ .ivu-input::-moz-placeholder{    /* Mozilla Firefox 4 to 18 */
+  color: #718EBD;
+}
+/deep/ .ivu-input::-ms-input-placeholder{  /* Internet Explorer 10-11 */
+  color: #718EBD;
+}
+.common-modal-select {
+  color: #fff;
+  font-size: 14px;
+  margin-bottom: 10px;
+  margin-left: 35PX;
+}
+</style>

src/views/homecomponents/EquipmentAnalysis/UnableDeterAlarm.vue

@@ -0,0 +1,658 @@
+<template>
+  <div class="content-main-manage">
+    <div class="search-list">
+      <div class="search-left">
+        <Form class="common-form common-form-list" ref="tableParams" :model="tableParams" inline>
+           <FormItem label="" prop="alertRankId">
+            <Select v-model="tableParams.alertRankId" placeholder="告警等级">
+              <Option v-for="item in alarmLevelData" :value="item.id" :key="item.id">{{ item.name }}</Option>
+            </Select>
+          </FormItem>
+          <FormItem label="" prop="applicationId">
+            <Select v-model="tableParams.applicationId" placeholder="来源应用" @on-change="selectApp">
+              <Option v-for="item in appData" :value="item.id" :key="item.id">{{ item.appName }}</Option>
+            </Select>
+          </FormItem>
+          <FormItem label="" prop="equipmentTypeId">
+            <Select v-model="tableParams.equipmentTypeId" placeholder="设备类型">
+              <Option v-for="item in equipTypeData" :value="item.equipmentTypeId" :key="item.equipmentTypeId">{{ item.equipmentName }}</Option>
+            </Select>
+          </FormItem>
+          <FormItem label="">
+            <DatePicker type="daterange" :value="dateRange" :clearable="false" class="common-date-picker date-picker-main" placement="bottom-end" placeholder="告警时间范围" @on-change="changePicker"></DatePicker>
+          </FormItem>
+          <FormItem label="" prop="keywords">
+            <Input placeholder="请输入关键字查询" clearable search v-model="tableParams.keywords" />
+          </FormItem>
+          <FormItem label="" >
+            <Button type="primary" class="common-btn-search" @click="searchClick">
+              <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 筛选
+            </Button> 
+            <Button type="primary" class="common-btn-search" style="margin-left:10px" @click="resetClick('tableParams')">
+              <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 重置
+            </Button>   
+          </FormItem>
+        </Form>
+      </div>
+    </div>
+     <div class="btn-container">
+      <span class="btn-container-download" style="opacity: 0">
+        <i class="iconfont icon-xiazai" style="cursor:pointer;color:#0185EA;fontSize:20px;marginRight:6px"></i>下载列表筛选结果
+      </span>
+      <div>
+        <Button class="common-operate-btn common-corrections" @click="correctClick"> 
+          <i class="iconfont icon-gengzhenggonggao" style="cursor:pointer;color:#ffffff;fontSize:20px;marginRight:6px"></i>
+          批量修正等级
+        </Button>
+         <!-- <Button class="common-operate-btn common-eliminate" @click="addClick"> 
+          <i class="iconfont icon-lajitong" style="cursor:pointer;color:#ffffff;fontSize:20px;marginRight:6px"></i>
+          批量清除告警
+        </Button>
+         <Button class="common-operate-btn common-confirm" @click="addClick"> 
+          <i class="iconfont icon-queren" style="cursor:pointer;color:#ffffff;fontSize:20px;marginRight:6px"></i>
+          批量确认告警
+        </Button> -->
+        <!-- <Button class="common-operate-btn common-forward">
+          <i class="iconfont icon-zhuanfafenxiang" style="cursor:pointer;color:#ffffff;fontSize:20px;marginRight:6px"></i>
+          批量转发通知
+        </Button> -->
+      </div>
+    </div>
+    <div class="manage-main-center">
+      <Table :columns="columns" :data="tableData" class="common-table app-table" no-data-text="" :row-class-name="rowClassName" :loading="loading" @on-selection-change="selectChange">
+        <template slot="loading">
+            <Loading-animation></Loading-animation>
+        </template>
+         <template slot-scope="{ row }" slot="action">
+           <Tooltip content="详情" placement="top">
+              <i class="iconfont icon-xiangqingmingxi" style="cursor:pointer;color:#B8B532;fontSize:20px;marginRight:6px" @click="detailClick(row)"></i>
+           </Tooltip>
+           <Tooltip content="修正" placement="top">
+              <i class="iconfont icon-gengzhenggonggao" style="cursor:pointer;color:#0BB0DE;fontSize:20px;marginRight:6px" @click="correctClick(row)"></i>
+           </Tooltip>
+        </template>
+      </Table>
+    </div>
+    <div class="common-page">
+      <div class="common-page-total">
+        共<span>{{tablePage}}</span>页 / <span>{{tableTotal}}</span>条数据
+      </div>
+      <Page :total="tableTotal" :current="tableParams.pageNum" :page-size="tableParams.pageSize" @on-change="changePage" @on-page-size-change="sizeChange" show-elevator />
+    </div>
+    <Modal
+      v-model="showModal"
+      :title="title"
+      width="25"
+      ref="modalGrag"
+      draggable
+      reset-drag-position
+      @on-visible-change="modalChange"
+      :mask-closable="false"
+      class-name="common-modal">
+      <Form class="common-form" ref="formOption" :model="formOption" :rules="ruleValidate" :label-width="0">
+        <div class="common-form-item-text">
+          将选中的告警信息等级，修正为
+        </div>
+        <FormItem label="" prop="alertRankId" style="width:100%">
+          <Select v-model="formOption.alertRankId" placeholder="告警等级">
+            <Option v-for="item in alarmLevelModalData" :value="item.id" :key="item.id">{{ item.name }}</Option>
+          </Select> 
+        </FormItem>
+			</Form>
+      <div slot="footer">
+          <Button @click="modalCancel">取消</Button>
+          <Button type="primary" @click="modalOk('formOption')">确定</Button>
+        </div>
+    </Modal>
+    <Modal
+      v-model="modalStatus"
+      :title="commonTitle"
+      width="30"
+      ref="modalGrag"
+      draggable
+      reset-drag-position
+      :mask-closable="false"
+      class-name="common-modal">
+      <Icon type="ios-information-circle" :style="{ color: activeColor}" class="modal-icon"></Icon>
+      <span class="modal-text">{{modalTitle}}</span>
+      <div slot="footer">
+          <Button @click="commonCancel">取消</Button>
+          <Button type="primary" @click="commonOk">确定</Button>
+        </div>
+    </Modal>
+  </div>
+</template>
+<script>
+const defaultFrom = {alertRankId: ''}
+export default {
+  name: "UnableDeterAlarm",
+  components:{
+  },
+  data() {
+    return {
+       alarmParams: {
+        keywords: '',
+        enabled: 1,
+        beginDate: '',
+        endDate: '',
+        pageNum: 1,
+        pageSize: 10
+      },
+      applicationParams: {
+        level: '',
+        lineId: '',
+        stationId: '',
+        equipmentCheck: '',
+        instrumentCheck: '',
+        pageNum: 1,
+        pageSize: 9999
+      },
+      appParams: {
+        applicationId: '',
+        equipmentTypeId: '',
+        keywords: '',
+        pageNum: 1,
+        pageSize: 9999
+      },
+      loading: true,
+      dateRange: [],
+      tableParams: {
+        processingStatus:'',
+        keywords: '',
+        applicationId:'',
+        equipmentTypeId: '',
+        alertRankId: '',
+        beginAlertTime: '',
+        endAlertTime: '',
+        oneKeywords: '',
+        alertRankEnabled: 1,
+        pageNum: 1,
+        pageSize: 10
+      },
+      tableData: [],
+      tableTotal: 0,
+      tablePage: 0,
+      rowObj: {},
+      lineTypeData: [],
+      stationTypeData: [],
+      alarmLevelData: [],
+      alarmLevelModalData: [],
+      equipTypeData: [],
+      appData: [],
+      columns: [
+          {
+            type: 'selection',
+            width: 60,
+            align: 'center'
+          },
+          {
+            title: '告警时间',
+            key: 'alertTime',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '来源应用',
+            key: 'appName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          }, 
+           {
+            title: '设备类型',
+            key: 'equipmentTypeName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '设备名称',
+            key: 'equipmentName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '线路',
+            key: 'lineName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+           {
+            title: '站点',
+            key: 'stationName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '告警内容',
+            key: 'alertContent',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '告警等级',
+            key: 'alertRankName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+          title: '操作',
+          align: 'center',
+          slot: 'action',
+          width: 120,
+        }
+      ],
+      showModal: false,
+      modalStatus: false,
+      title: '告警信息修正',
+      commonTitle: "确认删除",
+      activeColor: '#E92E2E',
+      activeClass: '',
+      modalTitle: '',
+      dateModalRange: [],
+      formOption: {alertRankId: ''},
+      ruleValidate: {
+        alertRankId: [{
+          required: true,
+          type: 'number',
+          message: '请选择告警等级',
+          trigger: 'change'
+        }],
+      },
+      idArr: []
+    };
+  },
+  mounted() {
+  },
+  methods: {
+    go (){
+      // this.$router.push({path:'//ApplicationManage'})
+      // this.$router.push({path:'/MainPage/ApplicationManage/2'})
+      this.$router.push({ name: 'ApplicationManage', params: { type:2 }}) // -> /home/123
+    },
+    changePicker (date) {
+      this.tableParams.beginAlertTime = date[0]
+      this.tableParams.endAlertTime = date[1]
+    },
+    changeModalPicker (date) {
+      this.formOption.dates = date
+      this.formOption.useDate = date[0]
+      this.formOption.endDate = date[1]
+    },
+    rowClassName(row, index) {
+      if (index % 2 == 0) {
+        return "ivu-table-stripe-even";
+      } else {
+        return "ivu-table-stripe-odd";
+      }
+    },
+    // 分页
+    changePage (val) {
+      this.tableParams.pageNum = val
+      this.getTableData()
+    },
+    //跳转
+    sizeChange (val) {
+      this.tableParams.pageSize = val
+      this.getTableData()
+    },
+    getType  () {
+      // 获取归属应用
+      this.$get('metroapi/application/info/list', this.applicationParams).then(res=>{
+        if (res.httpCode == 1 ){
+          this.appData = res.data.data
+          this.appData.unshift({ id: '-1', appName: '来源应用' })
+        } else {
+          this.appData = []
+        }
+      })
+      // 告警等级
+      this.$get('metroapi/alert/rank/list', this.alarmParams).then(res=>{
+        if (res.httpCode == 1 ){
+          this.alarmLevelModalData = JSON.parse(JSON.stringify(res.data.data))
+          this.alarmLevelData = res.data.data
+          this.alarmLevelData.unshift({ id: '-1', name: '告警等级' })
+        } else {
+          this.alarmLevelData = []
+          this.alarmLevelModalData = []
+        }
+      })
+    },
+    selectChange (selection) {
+      this.idArr = selection.map(item => item.id)
+    },
+    // 获取表格数据
+    getTableData (keywords,arr,level) {
+       if (level) {
+        this.tableParams.keywords = ''
+        if (level == 2) {
+          this.tableParams.lineId = arr[arr.length-1]
+          this.tableParams.stationId = ''
+        } else if (level == 3) {
+          this.tableParams.lineId = arr[arr.length-2]
+          this.tableParams.stationId = arr[arr.length-1]
+        } else {
+          this.tableParams.lineId = ''
+          this.tableParams.stationId = ''
+        }
+      } else {
+        this.tableParams.lineId = ''
+        this.tableParams.stationId = ''
+        if (keywords == '合肥轨道交通' || keywords == '' || !keywords) {
+          this.tableParams.oneKeywords = ''
+        } else {
+          this.tableParams.oneKeywords = keywords
+        }
+      }
+      let params = JSON.parse(JSON.stringify(this.tableParams))
+      params.alertRankId = params.alertRankId == '-1' ? '':params.alertRankId
+      params.applicationId = params.applicationId == '-1' ? '':params.applicationId
+      params.equipmentTypeId = params.equipmentTypeId == '-1' ? '':params.equipmentTypeId 
+      console.log(params)
+      this.loading = true
+      this.$get('metroapi/alert/processing/details', params).then(res=>{
+        this.loading = false
+          if (res.httpCode == 1 ){
+            this.tableData = res.data.data
+            this.tableTotal = res.data.count
+            if (res.data.data.length==0) {
+              this.tablePage = 0
+            } else {
+              this.tablePage = res.data.count<= 10 ? 1: Math.ceil(res.data.count/this.tableParams.pageSize)
+            }
+            if (res.data.data.length==0 && this.tableParams.pageNum>1) {
+              this.tableParams.pageNum--
+              return this.getTableData()
+            }
+          } else {
+            this.tableData = []
+            this.tableTotal = 0
+          }
+        })
+    },
+    selectApp (val) {
+      this.appParams.applicationId = val
+      this.tableParams.equipmentTypeId = ''
+      if (val) {
+        this.getAddEquipType( this.appParams)
+      }
+    },
+    // 获取设备类型 
+    getAddEquipType (params) {
+      if (params.applicationId == '-1') {
+        this.equipTypeData = [{ equipmentTypeId: '-1', equipmentName: '设备类型' }]
+      } else {
+        this.$get('metroapi/application/equipmentTypeInfo', params).then(res=>{
+          if (res.httpCode == 1 ){
+            this.equipTypeData = res.data.data
+            this.equipTypeData.unshift({ equipmentTypeId: '-1', equipmentName: '设备类型' })
+          } else {
+            this.equipTypeData = []
+          }
+        })
+      }
+    },
+    searchClick () {
+      this.getTableData()
+      // this.$router.push({ path: '/MainPage/ApplicationManage',  query: {deptName: "2"}})
+    },
+    resetClick (name) {
+     this.dateRange = []
+     this.tableParams.beginAlertTime = ''
+     this.tableParams.endAlertTime = ''
+     this.equipTypeData = [{ equipmentTypeId: '-1', equipmentName: '设备类型' }]
+     this.$refs[name].resetFields()
+     this.getTableData()
+    },   
+    detailClick (row) {
+      this.rowObj = row
+      // this.currentModalTabs = '基础信息'   
+      // this.detailStatus = true
+      // this.$get('metroapi/alert/rank/info', {id:row.id}).then(res=>{
+      //   if (res.httpCode == 1 ){
+      //     this.detailLabel = res.data
+      //   } else {
+      //     this.$Message.info(res.msg)
+      //   }
+      // }) 
+    },
+    correctClick (row) {
+      this.rowObj = row
+      if (row.id || this.idArr.length>0) {
+        this.formOption = JSON.parse(JSON.stringify(defaultFrom))
+        this.title = '告警信息修正'
+        this.showModal = true
+      } else {
+        this.$Message.info('请至少选择一条数据')
+      }
+    },
+    correctData (params) {
+      this.$post('metroapi/alert/processing/update/status',params).then(res=>{
+        if (res.httpCode == 1 ){
+          this.showModal = false
+          this.$Message.info(res.msg)
+          this.getTableData()
+        } else {
+          this.$Message.info(res.msg)
+        }
+      })
+    },
+    editClick (row) {
+      this.rowObj = row
+      this.formOption = JSON.parse(JSON.stringify(row));
+      this.formOption.lineId = this.formOption.lineId ? String(this.formOption.lineId) : '-1'
+      this.formOption.stationId = this.formOption.stationId ? String(this.formOption.stationId) : '-1'
+      this.getStationData(this.formOption.lineId)
+      this.appParams.applicationId = this.formOption.appId
+      this.getAddEquipType(this.appParams)
+      this.title = '告警信息修正'
+      this.showModal = true
+    },
+    delClick (row) {
+      this.rowObj = row
+      this.commonTitle = '确认删除'
+      this.activeColor = '#E92E2E'
+      this.activeClass = ''
+      this.modalTitle = '删除的同时将解绑所有运营数据，且数据不可恢复，请慎重操作。'
+      this.modalStatus = true
+    },
+    modalChange (modalStatus) {
+     if (!modalStatus) {
+      this.$refs.formOption.resetFields();
+      this.idArr = []
+     }
+    },
+    modalOk (formName) {
+        this.$refs[formName].validate((valid) => {
+          if (valid) {
+            let params = {
+            alertIds: this.idArr.join() || Number(this.rowObj.id),
+            alertRankId: this.formOption.alertRankId,
+          }
+          this.correctData(params)
+          } else {
+            this.showModal = true
+          }
+       })
+    },
+    modalCancel () {
+      this.showModal = false
+    },
+    commonOk () {
+      let params = {
+        id: this.rowObj.id
+      }
+      this.delData(params)
+    },
+    commonCancel () {
+      this.modalStatus = false
+    },
+    // 删除接口
+    delData (params) {
+      this.$get('metroapi/equipment/delEquipment',params).then(res=>{
+        if (res.httpCode == 1 ){
+          this.modalStatus = false
+          this.$Message.info(res.msg)
+          this.getTableData()
+        } else {
+          this.$Message.info(res.msg)
+        }
+      })
+    },
+  }
+};
+</script>
+<style scoped lang="stylus">
+.content-main-manage {
+  position: relative;
+  height: 100%;
+}
+.search-list {
+  display: flex;
+  padding: 10px 0 0;
+}
+.search-left {
+  display: flex;
+  align-items: center;
+   .ivu-select {
+     width: 155px;
+     padding-right: 10px;
+     height: 32px;
+   }
+   .ivu-select-single .ivu-select-selection {
+     height: 100%;
+   }
+   >>> .ivu-input {
+     width: 160px;
+     height: 32px;
+   }
+   >>> .ivu-input-prefix, >>> .ivu-input-suffix {
+     height: 32px;
+     line-height: 32px;
+   }
+   >>> .ivu-input-icon {
+     height: 32px;
+     line-height: 32px;
+   }
+   >>> .date-picker-main .ivu-date-picker-header {
+    border-bottom: 0.0052083333rem solid #204384;
+ }
+}
+.btn-container {
+  display: flex;
+  justify-content: space-between;
+  padding-bottom: 10px;
+  color: #0185EA;
+  font-size: 14px;
+  .btn-container-download {
+    cursor: pointer;
+  }
+  .common-corrections {
+    background: #053B4A;
+    border: 1px solid #0098C2;
+    color: #FFFFFF;
+    margin-right: 5px;
+  }
+  .common-eliminate {
+    background: #4C2215;
+    border: 1px solid #8E1919;
+    color: #FFFFFF;
+    margin-right: 5px;
+  }
+  .common-confirm {
+    background: #0C3423;
+    border: 1px solid #08AF68;
+    color: #FFFFFF;
+    margin-right: 5px;
+  }
+  .common-forward {
+    background: #413A09;
+    border: 1px solid #A69311;
+    color: #FFFFFF;
+  }
+}
+.common-form {
+  display: flex;
+  flex-wrap: wrap;
+}
+>>> .common-form-list .ivu-form-item {
+  margin-bottom: 10px;
+}
+.manage-main-center {
+  width: 100%;
+  height: calc(100% - 150px);
+}
+.common-table {
+  max-height: 100%;
+}
+>>> .common-table .ivu-table th {
+  height: 50px;
+ }
+ >>> .common-table .ivu-table td {
+  height: 49.5px;
+ }
+  >>> .common-table .ivu-spin-fix {
+   top: 50px;
+ }
+  >>> .app-table .ivu-spin-fix {
+   height: calc(100vh - 375px);
+ }
+ >>> .ivu-table-tip {
+  background: url('../../../assets/images/noData.png') no-repeat center;
+}
+>>> .app-table .ivu-table-tip {
+  height: calc(100vh - 375px);
+ }
+ >>> .common-table .ivu-table-tip table {
+ display: none;
+}
+ >>> .modal-table {
+   overflow: auto !important;
+ }
+ >>> .modal-table .ivu-spin-fix {
+   height: 200px;
+ }
+  >>> .modal-table .ivu-table-tip {
+   height: 200px;
+ }
+.common-page {
+  margin-top: 15px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+}
+.common-page-total {
+  color: #fff;
+  padding-right: 10px;
+  font-size: 14px;
+  span {
+    color #409EFF;
+  }
+}
+.common-form-item-text {
+  font-size: 11px;
+  color: #85A3D4;
+  margin: 10px 0;
+}
+/deep/ .ivu-input::-webkit-input-placeholder{
+  color: #718EBD;
+}
+/deep/ .ivu-input::-moz-placeholder{   /* Mozilla Firefox 19+ */
+  color: #718EBD;
+}
+/deep/ .ivu-input::-moz-placeholder{    /* Mozilla Firefox 4 to 18 */
+  color: #718EBD;
+}
+/deep/ .ivu-input::-ms-input-placeholder{  /* Internet Explorer 10-11 */
+  color: #718EBD;
+}
+</style>

src/views/homecomponents/EquipmentAnalysis/listToTree.js

@@ -1,35 +0,0 @@
-//将后端返回的list数据转化为树结构
-export const listToTree = (list) => {
-  var arr = []
-  let items = {}
-  var idsStr = ''
-  // 获取每个节点的直属子节点（是直属，不是所有子节点）
-  for (let i = 0; i < list.length; i++) {
-      let key = list[i].parentId
-      if (items[key]) {
-          items[key].push(list[i])
-      } else {
-          items[key] = []
-          items[key].push(list[i])
-      }
-      idsStr += idsStr === '' ? list[i].id : ',' + list[i].id
-  }
-  for (var key in items) {
-      if (idsStr.indexOf(key) === -1) {//找到最大的父节点key
-          arr=formatTree(items, key)
-      }
-  }
-  delete arr[0].parentId
-  return arr
-}
-function formatTree(items, parentId) {
-  let result = []
-  if (!items[parentId]) {
-      return result
-  }
-  for (let t of items[parentId]) {
-      t.children = formatTree(items, t.id)//递归获取children
-      result.push(t)
-  }
-  return result
-}

vue.config.js

@@ -7,7 +7,7 @@ module.exports = {
       open: false,//配置自动启动浏览器 
       proxy: { // 设置代理
       '/metroapi': {
-        target: 'http://192.168.20.58:8088',// http://192.168.20.58:8086 http://192.168.20.188:8088
+        target: 'http://192.168.20.188:8088',// http://192.168.20.58:8086 http://192.168.20.188:8088
         changeOrigin: true, //允许跨域
         pathRewrite: {
             '^/metroapi': ''