<template>
  <div id="main" class="h-all">
    <el-container class="h-all">
      <el-header height="auto">
        <!-- 条件查询工具栏 -->
        <div class="header-search">
          <div class="search-input-box">
            <label>{{ $t("AlarmStatistics.beginTimestamp") }}</label>
            <el-date-picker
              v-model="beginTimestamp"
              type="datetime"
              size="mini"
              format="yyyy-MM-dd HH:mm"
              :clearable="false"
              align="center"
              :picker-options="startDatePicker"
              @change="beginDateChange"
              :placeholder="$t('AlarmStatistics.chooseStartTime')">
            </el-date-picker>
          </div>
          <div class="search-input-box">
            <label>{{ $t("AlarmStatistics.endTimestamp") }}</label>
            <el-date-picker
              v-model="endTimestamp"
              type="datetime"
              size="mini"
              format="yyyy-MM-dd HH:mm"
              :clearable="false"
              align="center"
              :picker-options="endDatePicker"
              @change="endDateChange"
              :placeholder="$t('AlarmStatistics.chooseEndTime')">
            </el-date-picker>
          </div>
          <div class="search-input-box">
            <label>{{ $t("AlarmStatistics.valuePeriod") }}</label>
            <el-select size='mini' v-model="valuePeriod" placeholder="请选择">
              <el-option
                v-for="item in optionsPeriod"
                :key="item.value"
                :label="item.label"
                :value="item.value"
                :disabled="item.disabled">
              </el-option>
            </el-select>
          </div>
          <div class="search-input-box">
            <label>{{ $t("AlarmStatistics.DeviceType") }}</label>
            <el-select size='mini' v-model="queryDeviceType" placeholder="请选择" @clear="clearDevice"
                       @change="changeNodeType" :clearable="true">
              <el-option
                v-for="item in deviceTypeList"
                :key="item.deviceTypeKey"
                :label="item.deviceTypeKey"
                :value="item.deviceTypeKey">
              </el-option>
            </el-select>
          </div>
          <div class="search-input-box">
            <label>{{ $t("AlarmStatistics.DeviceName") }}</label>
            <el-select size='mini' v-model="queryDeviceKeyList" placeholder="请选择" @clear="clearDevice"
                       @change="changeDevice" :clearable="true"
                       multiple
                       collapse-tags
                       multiple-limit="5"
                       :disabled="deviceNameSelectDisable">
              <el-option
                v-for="item in deviceList1"
                :key="item.deviceKey"
                :label="item.displayName"
                :value="item.displayName">
              </el-option>
            </el-select>
          </div>
          <div class="search-input-box">
            <label>{{ $t("AlarmStatistics.AlarmCause") }}</label>
            <el-select size='mini' v-model="queryAlarmCause" placeholder="请选择" @clear="clearCause"
                       @change="changeCause" :clearable="true">
              <el-option
                v-for="item in optionsAlarmCause"
                :key="item.alarmCode"
                :label="item.alarmName"
                :value="item.alarmCode">
              </el-option>
            </el-select>
          </div>
          <div class="search-input-box">
            <label>{{ $t("AlarmStatistics.AlarmLevel") }}</label>
            <el-select size='mini' v-model="alarmLevel" placeholder="请选择" @clear="clearAlarmLevel"
                       @change="changeAlarmLevel" :clearable="true">
              <el-option
                v-for="item in optionsAlarmLevel"
                :key="item.value"
                :label="item.label"
                :value="item.value">
              </el-option>
            </el-select>
          </div>
          <div class="search-input-box">
            <label>{{ $t("AlarmStatistics.AlarmStatus") }}</label>
            <el-select size='mini' v-model="alarmStatus" placeholder="请选择"
                       @clear="clearAlarmStatus" @change="changeAlarmStatus" :clearable="true">
              <el-option
                v-for="item in optionsAlarmStauts"
                :key="item.value"
                :label="item.label"
                :value="item.value">
              </el-option>
            </el-select>
          </div>
          <div class="search-input-box">
            <label>{{ $t("AlarmStatistics.valueAspect") }}</label>
            <el-select size='mini' v-model="valueAspect" placeholder="请选择"
                       @change="changeValueAspect">
              <el-option
                v-for="item in optionsAspect"
                :key="item.value"
                :label="item.label"
                :value="item.value">
              </el-option>
            </el-select>
          </div>
          <div class="search-input-box">
            <el-button size='mini' icon="el-icon-search" type="primary" @click="queryAlarmDataByCondition"
                       v-loading.fullscreen.lock="fullscreenLoading">{{ $t("AlarmStatistics.statistic") }}
            </el-button>
            <el-button size='mini' icon="el-icon-download" type="primary" @click="exportFile"
                       v-loading.fullscreen.lock="fullscreenLoading">{{msg}}
            </el-button>
          </div>
        </div>
      </el-header>
      <!-- table数据表格 -->
      <el-main class="adapt-height-box">
        <el-tabs v-model="activeName" type="card" class="statistic-tab-box h-all adapt-height adapt-height-box"
                 :before-leave="handleClick">
          <el-tab-pane :label="$t('AlarmStatistics.statisticResult')" name="first" class="h-all adapt-height adapt-height-box">
            <el-table
              id="myTable"
              :empty-text="$t('common.noData')"
              header-row-class-name="table-header"
              cell-class-name="table-cell"
              class="adapt-height"
              ref="multipleTable"
              :data="alarmList"
              stripe
              tooltip-effect="dark"
              height="auto"
              border
              :highlight-current-row="true">
              <el-table-column
                type="selection"
                v-if="false"
                width="28">
              </el-table-column>
              <el-table-column
                type="index"
                :label="$t('AlarmStatistics.No')"
                width="50">
              </el-table-column>
              <el-table-column
                prop="curTime"
                :label="$t('AlarmStatistics.alarmTime')"
                :formatter="formatCurDate"
                :show-overflow-tooltip="true">
              </el-table-column>
              <el-table-column
                v-for="(item, index) in tableLabel"
                :key="index"
                :prop="item.prop"
                :width="item.width"
                :label="item.label"
              >
              </el-table-column>
            </el-table>
          </el-tab-pane>
          <el-tab-pane :label="$t('AlarmStatistics.statisticGraph')" name="second" :lazy='true' class="h-all adapt-height adapt-height-box">
            <div id="print-content" class="h-all adapt-height">
              <ve-line :data="chartData" :settings="chartSettings" :extend="chartExtend" align="center"></ve-line>
            </div>
          </el-tab-pane>
        </el-tabs>
      </el-main>
    </el-container>
  </div>
</template>

<script>
import FileSaver from 'file-saver'
import XLSX from 'xlsx'
import DeviceService from '@/domain/services/DeviceService.js'
import ServerService from '@/domain/services/ServerService.js'
import AlarmManagerService from '@/domain/services/AlarmManagerService.js'
import HelperUtil from '../../utils/HelperUtil'

export default {
  name: 'AlarmStatistics',
  data: function () {
    return {
      fullscreenLoading: false,

      msg: this.$t('AlarmStatistics.exportStatisticResult'),

      // Table表头
      deviceNameShow: false,
      causeShow: false,
      alarmLevelShow: true,
      alarmStatusShow: false,
      // 导出文件名称
      exportName: '告警统计结果',

      // Tab页
      activeName: 'first',

      // 统计周期
      optionsPeriod: [
        {
          value: 0,
          label: this.$t('AlarmStatistics.minute'),
          disabled: false
        },
        {
          value: 1,
          label: this.$t('AlarmStatistics.TenMinute'),
          disabled: false
        },
        {
          value: 2,
          label: this.$t('AlarmStatistics.hour'),
          disabled: false
        },
        {
          value: 3,
          label: this.$t('AlarmStatistics.day'),
          disabled: false
        },
        // {
        //  value: 4,
        //  label: this.$t('AlarmStatistics.week'),
        //  disabled: false
        //  },
        {
          value: 5,
          label: this.$t('AlarmStatistics.month'),
          disabled: false
        }
      ],
      valuePeriod: 0,
      // 统计维度
      optionsAspect: [
        {
          value: 'deviceModel',
          label: this.$t('AlarmStatistics.deviceType'),
          disabled: false
        },
        {
          value: 'displayName',
          label: this.$t('AlarmStatistics.deviceKey'),
          disabled: false
        },
        {
          value: 'alarmCode',
          label: this.$t('AlarmStatistics.alarmType'),
          disabled: false
        },
        {
          value: 'alarmLevel',
          label: this.$t('AlarmStatistics.alarmLevel1'),
          disabled: false
        },
        {
          value: 'alarmStatus',
          label: this.$t('AlarmStatistics.alarmStatus1'),
          disabled: false
        }
      ],
      valueAspect: 'alarmLevel', // 统计维度
      // 设备名称选择域
      optionsDeviceName: [],
      queryDeviceKeyList: [],
      // 告警原因选择域
      optionsAlarmCause1: [],
      // 告警原因选择域（备份：包含全部的告警原因）
      optionsAlarmCause0: [],
      // 设备对应的内容
      optionsAlarmCause: [],
      // 告警等级选择域
      optionsAlarmLevel: [{
        value: '0',
        label: this.$t('AlarmStatistics.MinorAlarm')
      }, {
        value: '1',
        label: this.$t('AlarmStatistics.MajorAlarm')
      }, {
        value: '2',
        label: this.$t('AlarmStatistics.CriticalAlarm')
      }
      ],
      // 告警状态选择域
      optionsAlarmStauts: [{
        value: '0',
        label: this.$t('AlarmStatistics.Notconfirmed')
      }, {
        value: '1',
        label: this.$t('AlarmStatistics.Confirmed')
      }, {
        value: '2',
        label: this.$t('AlarmStatistics.Cleared')
      }, {
        value: '3',
        label: this.$t('AlarmStatistics.Restored')
      }, {
        value: '4',
        label: this.$t('AlarmStatistics.Delete')
      }
      ],
      // 设备类型选择域
      deviceTypeList: [],

      // 日期控件
      beginTimestamp: '', // 开始时间
      endTimestamp: '', // 结束时间
      addTimestamp: '00.000', // 查询开始时间默认添加
      addTimestamp1: '59.999', // 查询结束时间默认添加
      startDatePicker: this.beginDate(),
      endDatePicker: this.endDate(),

      // 双向绑定数据
      queryDeviceType: '', // 设备类型
      queryDeviceName: '', // 设备名称
      queryAlarmCause: '', // 告警原因
      alarmStatus: '', // 状态：0未确认；1已确认；2已清除；3已恢复
      alarmLevel: '', // 告警等级
      alarmList: [],
      alarmListStatistics: [], // 告警统计列表
      alarmListStatistics1: [], // 上面列表的备用（区别，该维度名称是英文key）
      deviceNameSelectDisable: false, // 设备名称选项是否禁用（根据设备类型，网元正常，服务器禁用）
      // 统计条件
      statisticsList: [],

      // 告警列表
      alarmCode: '', // 告警码
      alarmCount: '', // 频次
      firstTime: '', // 首次发生时间
      curTime: '', // 最近发生时间
      recoverTime: '', // 恢复时间
      clearTime: '', // 清除时间
      confirmTime: '', // 确认时间
      confirmUser: '', // 确认用户
      note: '', // 其他信息

      // 表格内容
      count: 10000,
      beginItem: 1,
      endItem: 100,
      total: 100,
      currentPage: 1,
      pageSize: 100,

      // 查询条件
      selectList: [],

      // 统计图数据
      chartData: {
        columns: [],
        rows: []
      },
      chartSettings: {
        yAxisName: [],
        yAxisType: []
      },
      chartExtend: {
        backgroundColor: '#ffffff',
        // 纵轴标尺固定
        yAxis: {},
        xAxis: {
          axisLabel: {}
        },
        grid: {
          x: 25,
          y: 80,
          x2: 25,
          y2: 80
        },
        tooltip: {
          confine: true,
          enterable: true,
          formatter: function (params) {
            let list = []
            let listItem = ''
            list.push(
              params[0].name
            )
            if (params.length > 16) { // 显示个数超过16个时，分两列显示
              let next = 0
              for (let i = 0; i < params.length; i++) {
                if (params.length % 2 === 0) { // 显示个数为双数时
                  next = i + parseInt(params.length / 2)
                  if (next < params.length) {
                    list.push(
                      '<i style="display:inline-block; width: 10px; height: 10px; background: ' + params[i].color +
                        '; margin-right: 5px; border-radius: 50%;"></i><span style="display:inline-block;">' +
                        '</span>' + params[i].seriesName + '：' +
                        (params[i].value[1] === null ? 0.0 : params[i].value[1]) +
                        '<span style="mso-tab-count:1">&nbsp;&nbsp;</span>' +
                        '<i style="display:inline-block; width: 10px; height: 10px; background: ' + params[next].color +
                        '; margin-right: 5px; border-radius: 50%;"></i><span style="display:inline-block;">' +
                        '</span>' + params[next].seriesName + '：' +
                        (params[next].value[1] === null ? 0.0 : params[next].value[1])
                    )
                  }
                } else { // 显示个数为单数时
                  if (i === params.length - 1) {
                    list.push(
                      '<i style="float:left; display:inline-block; width: 10px; height: 10px; background: ' + params[i].color +
                        '; margin-top: 5px; margin-right: 5px; border-radius: 50%;"></i><span style="float:left; display:inline-block;">' +
                        params[i].seriesName + '：' +
                        (params[i].value[1] === null ? 0.0 : params[i].value[1]) + '</span>'
                    )
                  } else {
                    next = i + parseInt((params.length - 1) / 2)
                    if (next < params.length - 1) {
                      list.push(
                        '<i style="display:inline-block; width: 10px; height: 10px; background: ' + params[i].color +
                          '; margin-right: 5px; border-radius: 50%;"></i><span style="display:inline-block;">' +
                          '</span>' + params[i].seriesName + '：' +
                          (params[i].value[1] === null ? 0.0 : params[i].value[1]) +
                          '<span style="mso-tab-count:1">&nbsp;&nbsp;</span>' +
                          '<i style="display:inline-block; width: 10px; height: 10px; background: ' + params[next].color +
                          '; margin-right: 5px; border-radius: 50%;"></i><span style="display:inline-block;">' +
                          '</span>' + params[next].seriesName + '：' +
                          (params[next].value[1] === null ? 0.0 : params[next].value[1])
                      )
                    }
                  }
                }
              }
            } else {
              for (let i = 0; i < params.length; i++) {
                list.push(
                  '<i style="display:inline-block; width: 10px; height: 10px; background: ' +
                    params[i].color +
                    '; margin-right: 5px; border-radius: 50%;"></i><span style="display:inline-block;">' + '</span>' +
                    params[i].seriesName +
                    '：' +
                    (params[i].value[1] === null ? 0.0 : params[i].value[1])
                )
              }
            }
            listItem = list.join('<br>')
            return '<div class="showBox">' + listItem + '</div>'
          },
          extraCssText: 'z-index: 996'
        }
      },
      deviceList: [], // 设备列表
      deviceList1: [],
      rowDeviceKey: 'deviceKey', // 表格的设备编号（有deviceKey , serverKey两种）

      tableLabel: [] // 统计表格表头
    }
  },
  created: function () {
    this.setDefaultDateTime()
    this.getAlarmTypeList()
    this.getAllDevice()
    this.getAllDeviceType()
    this.getAllDevice1()
  },
  methods: {
    // 导出按钮显示
    handleClick (activeName, oldActiveName) {
      if (activeName === 'first') {
        this.msg = this.$t('AlarmStatistics.exportStatisticResult')
      } else {
        this.msg = this.$t('AlarmStatistics.exportStatisticGraph1')
      }
      return true
    },

    /**
       * ----------时间处理函数------------------------------------------------------------
       * */
    /***
       * @Description  : 检测时间合法
       * @author       : zf
       * @date         : 2019/1/21 13:37
       */
    // 设置禁止选择当前日期之后的时间，且开始时间小于结束时间
    beginDate: function () {
      let self = this
      return {
        disabledDate (time) {
          return time.getTime() > self.endTimestamp.getTime() || time.getTime() > Date.now()
        }
      }
    },
    // 结束时间必须大于开始时间
    endDate: function () {
      let self = this
      return {
        disabledDate (time) {
          return time.getTime() < self.beginTimestamp.getTime() || time.getTime() > Date.now()
        }
      }
    },
    // 开始时间被清空后重新赋值
    beginDateChange: function () {
      const setTimes = new Date()
      if (this.beginTimestamp === null) {
        setTimes.setTime(this.endTimestamp.getTime() - (60 * 60 * 1000))
        this.beginTimestamp = setTimes
        this.InfoTip.warningTip_alarm(this, {message: this.$t('AlarmStatistics.startTimeEmpty')})
      }
      if (this.beginTimestamp > this.endTimestamp) {
        setTimes.setTime(this.endTimestamp.getTime() - (60 * 60 * 1000))
        this.beginTimestamp = setTimes
        this.InfoTip.warningTip_alarm(this, {message: this.$t('AlarmStatistics.startGreaterEnd')})
      }
      this.changeValuePeriod()
    },
    // 结束时间被清空后重新赋值
    endDateChange: function () {
      const setTimes = new Date()
      const curTimes = new Date()
      if (this.endTimestamp === null) {
        if ((this.beginTimestamp.getTime() + (60 * 60 * 1000)) > curTimes.getTime()) {
          this.endTimestamp = curTimes
        } else {
          setTimes.setTime(this.beginTimestamp.getTime() + (60 * 60 * 1000))
          this.endTimestamp = setTimes
        }
        this.InfoTip.warningTip_alarm(this, {message: this.$t('AlarmStatistics.endTimeEmpty')})
      }
      if (this.endTimestamp < this.beginTimestamp) {
        if ((this.beginTimestamp.getTime() + (60 * 60 * 1000)) > curTimes.getTime()) {
          this.endTimestamp = curTimes
        } else {
          setTimes.setTime(this.beginTimestamp.getTime() + (60 * 60 * 1000))
          this.endTimestamp = setTimes
        }
        this.InfoTip.warningTip_alarm(this, {message: this.$t('AlarmStatistics.endSmallerStart')})
      }
      if (this.endTimestamp > curTimes) {
        if ((this.beginTimestamp.getTime() + (60 * 60 * 1000)) > curTimes.getTime()) {
          this.endTimestamp = curTimes
        } else {
          setTimes.setTime(this.beginTimestamp.getTime() + (60 * 60 * 1000))
          this.endTimestamp = setTimes
        }
        this.InfoTip.warningTip_alarm(this, {message: this.$t('AlarmStatistics.endGreaterNow')})
      }
      this.changeValuePeriod()
    },

    /***
       * @Description  : 开始结束时间联动统计周期
       * @author       : zf
       * @date         : 2019/1/8 16:27
       */
    changeValuePeriod: function () {
      var judgeTime = this.endTimestamp - this.beginTimestamp
      if (judgeTime > (6 * 60 * 60 * 1000) && judgeTime <= (3 * 24 * 60 * 60 * 1000)) { // >6小时
        this.optionsPeriod[0].disabled = true
        this.optionsPeriod[1].disabled = false
        this.optionsPeriod[2].disabled = false
        this.optionsPeriod[3].disabled = false
        this.valuePeriod = 1
      } else if (judgeTime > (3 * 24 * 60 * 60 * 1000) && judgeTime <= (24 * 60 * 60 * 1000 * 15)) { // >3天
        this.optionsPeriod[0].disabled = true
        this.optionsPeriod[1].disabled = true
        this.optionsPeriod[2].disabled = false
        this.optionsPeriod[3].disabled = false
        this.valuePeriod = 2
      } else if (judgeTime > (24 * 60 * 60 * 1000 * 15) && judgeTime <= (24 * 60 * 60 * 1000 * 365)) { // >15天
        this.optionsPeriod[0].disabled = true
        this.optionsPeriod[1].disabled = true
        this.optionsPeriod[2].disabled = true
        this.optionsPeriod[3].disabled = false
        this.valuePeriod = 3
      } else if (judgeTime > (24 * 60 * 60 * 1000 * 365)) { // >1年
        this.optionsPeriod[0].disabled = true
        this.optionsPeriod[1].disabled = true
        this.optionsPeriod[2].disabled = true
        this.optionsPeriod[3].disabled = true
        this.valuePeriod = 5
      } else {
        this.optionsPeriod[0].disabled = false
        this.optionsPeriod[1].disabled = false
        this.optionsPeriod[2].disabled = false
        this.optionsPeriod[3].disabled = false
        this.valuePeriod = 0
      }
    },

    /***
       * @Description  : 统计维度下拉列表联动表头
       * @author       : zf
       * @date         : 2019/1/9 13:36
       */
    changeValueAspect: function () {
      if (this.valueAspect === 'alarmLevel') {
        this.alarmLevelShow = true
        if (this.queryDeviceName === '') {
          this.deviceNameShow = false
        } else {
          this.deviceNameShow = true
        }
      } else {
        this.deviceNameShow = true
        if (this.alarmLevel === '') {
          this.alarmLevelShow = false
        } else {
          this.alarmLevelShow = true
        }
      }
    },

    /***
       * @Description  : 设备下拉列表切换时联动统计维度和表头
       * @author       : zf
       * @date         : 2018/12/24 14:25
       */
    changeDevice: function () {
      this.deviceNameShow = true
    },

    /***
       * @Description  : 网元下拉列表切换时联动设备名称
       * @author       : zyh
       * @date         : 2018/12/24 14:25
       */
    changeNodeType: function () {
      this.queryDeviceKeyList = ''
      this.queryAlarmCause = ''
      // this.queryDeviceType = [];
      this.deviceList1 = []

      for (var i = 0; i < this.deviceList.length; i++) {
        if (this.queryDeviceType === null || this.queryDeviceType === '') {
          this.deviceList1.push(this.deviceList[i])
        }
        if (this.queryDeviceType === this.deviceList[i]['deviceTypeKey']) {
          this.deviceList1.push(this.deviceList[i])
        }
        console.log(this.deviceList1)
      }

      // for (var j=0; j< this.optionsAlarmCause.length;j++){
      //   if (this.deviceTypeKey === null || this.deviceTypeKey === ''){
      //     this.optionsAlarmCause1.push(this.optionsAlarmCause[j])
      //   }
      //   if (this.deviceTypeKey === this.optionsAlarmCause[j]['deviceTypeKey'] && this.optionsAlarmCause[j]['isLink']===0 ){
      //     this.optionsAlarmCause1.push(this.optionsAlarmCause[j])
      //   }
      // }
    },

    /***
       * @Description  : 设备下拉列表清空时联动统计维度和表头
       * @author       : zf
       * @date         : 2018/12/24 14:33
       */
    clearDevice: function () {
      if (this.valueAspect === 'deviceKey') {
        this.deviceNameShow = true
      } else {
        this.deviceNameShow = false
      }
    },

    /***
       * @Description  : 告警等级下拉列表切换时联动统计维度和表头
       * @author       : zf
       * @date         : 2018/12/24 14:25
       */
    changeAlarmLevel: function () {
      this.alarmLevelShow = true
    },

    /***
       * @Description  : 告警等级下拉列表清空时联动统计维度和表头
       * @author       : zf
       * @date         : 2018/12/24 14:33
       */
    clearAlarmLevel: function () {
      if (this.valueAspect === 'alarmLevel') {
        this.alarmLevelShow = true
      } else {
        this.alarmLevelShow = false
      }
    },

    /***
       * @Description  : 告警状态下拉列表切换联动表头
       * @author       : zf
       * @date         : 2019/1/9 13:49
       */
    changeAlarmStatus: function () {
      this.alarmStatusShow = true
    },

    /***
       * @Description  : 告警状态下拉列表清空联动表头
       * @author       : zf
       * @date         : 2019/1/9 13:50
       */
    clearAlarmStatus: function () {
      this.alarmStatusShow = false
    },

    /***
       * @Description  : 告警原因下拉列表切换联动表头
       * @author       : zf
       * @date         : 2019/1/9 13:50
       */
    changeCause: function () {
      this.causeShow = true
    },

    /***
       * @Description  : 告警原因下拉列表清空联动表头
       * @author       : zf
       * @date         : 2019/1/9 13:51
       */
    clearCause: function () {
      this.causeShow = false
    },

    /***
       * @Description  : 设备名称过滤器
       * @author       : zf
       * @date         : 2018/12/24 16:07
       */
    formatDeviceKey: function (row, column) {
      let flag = '0'
      // 网元
      for (var i = 0; i < this.deviceList.length; i++) {
        if (this.deviceList[i]['deviceKey'] === row.deviceKey) {
          flag = '1'
          return this.deviceList[i]['deviceName']
        }
      }
      // 服务器
      if (flag === '0') {
        for (var i = 0; i < this.serverList.length; i++) {
          if (this.serverList[i]['serverKey'] === row.serverList) {
            flag = '1'
            return this.serverList[i]['serverName']
          }
        }
      }
      //        console.log(flag)
      if (flag === '0') {
        return row.deviceKey
      }
    },

    /***
       * @Description  : 告警等级过滤器
       * @author       : zf
       * @date         : 2018/12/24 16:07
       */
    formatAlarmLevel: function (row, column) {
      if (row.alarmLevel === 0 || row.alarmLevel === '0') {
        return '警告'
      } else if (row.alarmLevel === 1 || row.alarmLevel === '1') {
        return '严重'
      } else if (row.alarmLevel === 2 || row.alarmLevel === '2') {
        return '紧急'
      } else {
        return row.alarmLevel
      }
    },

    /***
       * @Description  : 告警状态过滤器
       * @author       : zf
       * @date         : 2018/12/24 16:07
       */
    formatAlarmStatus: function (row, column) {
      if (row.alarmStatus === '0' || row.alarmStatus === 0) {
        return '未确认'
      } else if (row.alarmStatus === '1' || row.alarmStatus === 1) {
        return '已确认'
      } else if (row.alarmStatus === '2' || row.alarmStatus === 2) {
        return '已清除'
      } else if (row.alarmStatus === '3' || row.alarmStatus === 3) {
        return '已恢复'
      } else {
        return row.alarmStatus
      }
    },

    /***
       * @Description  : 告警日期过滤
       * @author       : zf
       * @date         : 2019/1/2 19:40
       */
    formatCurDate: function (row, column) {
      var showDate
      var arr
      if (row.curTime.length === 13) {
        arr = row.curTime.split('.')
        showDate = '' + arr[0].substring(0, 4) + '-' + arr[0].substring(4, 6) + '-' + arr[0].substring(6, 8) + ' '
        showDate = showDate + arr[1].substring(0, 2) + ':' + arr[1].substring(2, 4)
      } else if (row.curTime.length === 12) {
        arr = row.curTime.split('.')
        showDate = '' + arr[0].substring(0, 4) + '-' + arr[0].substring(4, 6) + '-' + arr[0].substring(6, 8) + ' '
        showDate = showDate + arr[1].substring(0, 2) + ':' + arr[1].substring(2, 3) + '0'
      } else if (row.curTime.length === 11) {
        arr = row.curTime.split('.')
        showDate = '' + arr[0].substring(0, 4) + '-' + arr[0].substring(4, 6) + '-' + arr[0].substring(6, 8) + ' '
        showDate = showDate + arr[1].substring(0, 2)
      } else if (row.curTime.length === 8) {
        showDate = '' + row.curTime.substring(0, 4) + '-' + row.curTime.substring(4, 6) + '-' + row.curTime.substring(6, 8)
      } else if (row.curTime.length === 6) {
        showDate = '' + row.curTime.substring(0, 4) + '-' + row.curTime.substring(4, 6)
      } else {
        showDate = row.curTime
      }
      return showDate
    },

    /***
       * @Description  : 确认日期过滤
       * @author       : zf
       * @date         : 2019/1/2 19:40
       */
    formatConfirmDate: function (row, column) {
      var showDate
      var arr
      if (row.confirmTime === '') {
        showDate = ''
      } else {
        arr = row.confirmTime.split('.')
        showDate = '' + arr[0].substring(0, 4) + '-' + arr[0].substring(4, 6) + '-' + arr[0].substring(6, 8) + ' '
        showDate = showDate + arr[1].substring(0, 2) + ':' + arr[1].substring(2, 4) + ':' + arr[1].substring(4, 6) + '.' + arr[2]
      }
      return showDate
    },

    /***
       * @Description  : 恢复日期过滤
       * @author       : zf
       * @date         : 2019/1/2 19:40
       */
    formatRecoverDate: function (row, column) {
      var showDate
      var arr
      if (row.recoverTime === '') {
        showDate = ''
      } else {
        arr = row.recoverTime.split('.')
        showDate = '' + arr[0].substring(0, 4) + '-' + arr[0].substring(4, 6) + '-' + arr[0].substring(6, 8) + ' '
        showDate = showDate + arr[1].substring(0, 2) + ':' + arr[1].substring(2, 4) + ':' + arr[1].substring(4, 6) + '.' + arr[2]
      }
      return showDate
    },

    /**
       * ---------------------------初始化页面数据---------------------------
       * */

    // 获取默认时间
    setDefaultDateTime: function () {
      const start = new Date()
      const end = new Date()
      start.setTime(start.getTime() - 3600 * 1000)
      this.beginTimestamp = start
      this.endTimestamp = end
    },

    /***
       * @Description  : 获取告警列表
       * @author       : lxy
       * @date         : 2018/12/20 20:17
       */
    getAlarmTypeList: function () {
      //        console.log('获取告警列表')
      let _this = this
      AlarmManagerService.getAlarmTypeList().then(result => {
        // 成功
        _this.optionsAlarmCause = Object.values(result)
        // _this.handleAlarmCause();
      }).catch(err => {
        // 失败
        _this.InfoTip.errorTip(_this, err)
      })
    },

    /**
       * @Description  :获取全部网元
       * @author       :zyh
       * @date         :2020/1/7
       */
    getAllDevice: function () {
      let _this = this
      this.deviceList1 = []
      DeviceService.getAllDeviceCollection().then(result => {
        _this.deviceList = Object.values(result)
        _this.deviceList1 = Object.values(result)
      }).catch(err => {
        _this.InfoTip.errorTip(_this, err)
      })
    },

    /**
       * @Description  :获取全部网元类型
       * @author       :zyh
       * @date         :2020/1/7
       */
    getAllDeviceType: function () {
      let _this = this
      DeviceService.getAllDeviceTypeCollection().then(result => {
        _this.deviceTypeList = Object.values(result)
      }).catch(err => {
        _this.InfoTip.errorTip(_this, err)
      })
    },

    /**
       * ---------------------------统计功能实现---------------------------
       * */

    // 获取查询条件列表
    setQuerySelectList: function () {
      this.selectList = []
      this.statisticsList = []
      var year
      var month
      var day
      var hours
      var minutes
      if (this.beginTimestamp !== '' && this.beginTimestamp !== null) {
        year = '' + this.beginTimestamp.getFullYear()
        month = '' + (this.beginTimestamp.getMonth() + 1)
        day = '' + this.beginTimestamp.getDate()
        hours = '' + this.beginTimestamp.getHours()
        minutes = '' + this.beginTimestamp.getMinutes()
        if (month.length === 1) {
          month = '0' + month
        }
        if (day.length === 1) {
          day = '0' + day
        }
        if (hours.length === 1) {
          hours = '0' + hours
        }
        if (minutes.length === 1) {
          minutes = '0' + minutes
        }
        var begin = '' + year + month + day + '.' + hours + minutes + this.addTimestamp
        this.selectList.push({
          quaryAttribute: 'firstTime',
          compareSymbol: '>=',
          compareValue: begin
        })
        this.statisticsList.push({
          quaryAttribute: 'firstTime',
          compareSymbol: '>=',
          compareValue: begin
        })
      }
      if (this.endTimestamp !== '' && this.endTimestamp !== null) {
        year = '' + this.endTimestamp.getFullYear()
        month = '' + (this.endTimestamp.getMonth() + 1)
        day = '' + this.endTimestamp.getDate()
        hours = '' + this.endTimestamp.getHours()
        minutes = '' + this.endTimestamp.getMinutes()
        if (month.length === 1) {
          month = '0' + month
        }
        if (day.length === 1) {
          day = '0' + day
        }
        if (hours.length === 1) {
          hours = '0' + hours
        }
        if (minutes.length === 1) {
          minutes = '0' + minutes
        }
        var end = '' + year + month + day + '.' + hours + minutes + this.addTimestamp1
        this.selectList.push({
          quaryAttribute: 'firstTime',
          compareSymbol: '<=',
          compareValue: end
        })
        this.statisticsList.push({
          quaryAttribute: 'firstTime',
          compareSymbol: '<=',
          compareValue: end
        })
      }
      if (this.queryDeviceType !== '' && this.queryDeviceType !== null) { // 设备类型，新加
        this.selectList.push({
          quaryAttribute: 'deviceTypeKey',
          compareSymbol: 'like',
          compareValue: this.queryDeviceType
        })
        this.statisticsList.push({
          quaryAttribute: 'deviceTypeKey',
          compareSymbol: 'like',
          compareValue: this.queryDeviceType
        })
      }
      if (this.queryDeviceKeyList.length !== 0) {
        this.selectList.push({
          quaryAttribute: 'displayName',
          compareSymbol: 'in',
          compareValue: this.queryDeviceKeyList.join(',')
        })
        this.statisticsList.push({
          quaryAttribute: 'displayName',
          compareSymbol: 'in',
          compareValue: this.queryDeviceKeyList.join(',')
        })
      }
      if (this.queryAlarmCause !== '' && this.queryAlarmCause !== null) {
        this.selectList.push({
          quaryAttribute: 'alarmCode',
          compareSymbol: 'like',
          compareValue: this.queryAlarmCause
        })
        this.statisticsList.push({
          quaryAttribute: 'alarmCode',
          compareSymbol: 'like',
          compareValue: this.queryAlarmCause
        })
      }
      if (this.alarmLevel !== '' && this.alarmLevel !== null) {
        this.selectList.push({
          quaryAttribute: 'alarmLevel',
          compareSymbol: 'like',
          compareValue: parseInt(this.alarmLevel)
        })
        this.statisticsList.push({
          quaryAttribute: 'alarmLevel',
          compareSymbol: 'like',
          compareValue: parseInt(this.alarmLevel)
        })
      }
      if (this.alarmStatus !== '' && this.alarmStatus !== null) {
        this.selectList.push({
          quaryAttribute: 'alarmStatus',
          compareSymbol: 'like',
          compareValue: parseInt(this.alarmStatus)
        })
        this.statisticsList.push({
          quaryAttribute: 'alarmStatus',
          compareSymbol: 'like',
          compareValue: parseInt(this.alarmStatus)
        })
      }
    },

    // 获取统计条件列表
    setStatisticsList: function () {
      if (this.valueAspect !== '' && this.valueAspect !== null) {
        this.statisticsList.push({
          groupByType: this.valueAspect,
          choiceCode: '0',
          timeValue: this.valuePeriod
        })
        this.statisticsList.push({
          groupByType: 'firstTime',
          choiceCode: '1',
          timeValue: this.valuePeriod
        })
      }
    },

    // 图表数据规范
    standardStatisticsData: function () {
      this.chartSettings.yAxisName[0] = '计数'
      this.chartSettings.yAxisType[0] = 'normal'
      var maxExtend = 1.0
      var maxExtendNum = 1
      var n
      for (n = 0; n < this.alarmListStatistics.length; n++) {
        if (parseFloat(this.alarmListStatistics[n][2]) > maxExtend) {
          maxExtend = parseFloat(this.alarmListStatistics[n][2])
        }
      }
      maxExtendNum = Math.ceil(parseFloat(maxExtend))
      if (maxExtendNum > 5 && maxExtendNum <= 10) {
        maxExtendNum = 10
      } else if (maxExtendNum >= 1 && maxExtendNum <= 5) {
        maxExtendNum = 5
      } else if (maxExtendNum <= 0) {
        maxExtendNum = 1
      } else if (maxExtendNum > 10) {
        var numString = '' + maxExtendNum
        var numInt
        numInt = parseInt(numString.substring(0, 1)) + 1
        for (n = 1; n < numString.length; n++) {
          numInt = numInt * 10
        }
        maxExtendNum = numInt
      } else {
        maxExtendNum = 1
      }
      this.chartExtend.yAxis['scale'] = true
      this.chartExtend.yAxis['max'] = maxExtendNum
      this.chartExtend.yAxis['min'] = 0
      this.chartData.columns = []
      this.chartData.columns[0] = '时间'

      // 确定columns
      var columnsI = 1
      var i
      this.chartData.columns[columnsI] = this.alarmListStatistics[0][1]
      var flagRow = this.alarmListStatistics[0][1]
      for (i = 0; i < this.alarmListStatistics.length; i++) {
        if (this.alarmListStatistics[i][1] !== flagRow) {
          columnsI++
          this.chartData.columns[columnsI] = this.alarmListStatistics[i][1]
          flagRow = this.alarmListStatistics[i][1]
        }
      }

      // 确定rows
      var time
      var addTime
      var hours
      var minutes
      var month
      var day
      var arr
      var performTime
      var data
      var flag = 0
      this.chartData.rows = []
      if (this.valuePeriod === 0) {
        time = new Date(this.beginTimestamp)
        while (time.getTime() <= this.endTimestamp) {
          data = {}
          month = '' + (time.getMonth() + 1)
          day = '' + time.getDate()
          if (month.length === 1) {
            month = '0' + month
          }
          if (day.length === 1) {
            day = '0' + day
          }
          hours = '' + time.getHours()
          if (hours.length === 1) {
            hours = '0' + hours
          }
          minutes = '' + time.getMinutes()
          if (minutes.length === 1) {
            minutes = '0' + minutes
          }
          addTime = '' + time.getFullYear() + '-' + month + '-' + day + ' ' + hours + ':' + minutes
          data[this.chartData.columns[0]] = addTime

          // 加载其他数据
          flagRow = this.alarmListStatistics[0][1]
          for (i = 0; i < this.alarmListStatistics.length; i++) {
            if (this.alarmListStatistics[i][1] !== flagRow) {
              if (flag === 0) {
                data[this.alarmListStatistics[i - 1][1]] = '0'
                flagRow = this.alarmListStatistics[i][1]
              } else {
                flagRow = this.alarmListStatistics[i][1]
                flag = 0
              }
            }
            arr = this.alarmListStatistics[i][0].split('.')
            performTime = arr[0].substring(0, 4) + '-' + arr[0].substring(4, 6) + '-' + arr[0].substring(6, 8) + ' ' + arr[1].substring(0, 2) + ':' + arr[1].substring(2, 4)
            if (addTime === performTime) {
              data[this.alarmListStatistics[i][1]] = this.alarmListStatistics[i][2]
              flag = 1
            }
            if (i === this.alarmListStatistics.length - 1) {
              if (flag === 0) {
                data[this.alarmListStatistics[i][1]] = '0'
              }
            }
          }
          this.chartData.rows.push(data)
          flag = 0
          time = new Date(time.getTime() + (1000 * 60))
        }
      }
      if (this.valuePeriod === 1) {
        time = new Date(this.beginTimestamp)
        while (time.getTime() <= this.endTimestamp) {
          data = {}
          month = '' + (time.getMonth() + 1)
          day = '' + time.getDate()
          if (month.length === 1) {
            month = '0' + month
          }
          if (day.length === 1) {
            day = '0' + day
          }
          hours = '' + time.getHours()
          if (hours.length === 1) {
            hours = '0' + hours
          }
          minutes = '' + time.getMinutes()
          if (minutes.length === 1) {
            minutes = '0' + minutes
          }
          addTime = '' + time.getFullYear() + '-' + month + '-' + day + ' ' + hours + ':' + minutes.substring(0, 1) + '0'
          data[this.chartData.columns[0]] = addTime

          // 加载其他数据
          flagRow = this.alarmListStatistics[0][1]
          for (i = 0; i < this.alarmListStatistics.length; i++) {
            if (this.alarmListStatistics[i][1] !== flagRow) {
              if (flag === 0) {
                data[this.alarmListStatistics[i - 1][1]] = '0'
                flagRow = this.alarmListStatistics[i][1]
              } else {
                flagRow = this.alarmListStatistics[i][1]
                flag = 0
              }
            }
            arr = this.alarmListStatistics[i][0].split('.')
            performTime = arr[0].substring(0, 4) + '-' + arr[0].substring(4, 6) + '-' + arr[0].substring(6, 8) + ' ' + arr[1].substring(0, 2) + ':' + arr[1].substring(2, 3) + '0'
            if (addTime === performTime) {
              data[this.alarmListStatistics[i][1]] = this.alarmListStatistics[i][2]
              flag = 1
            }
            if (i === this.alarmListStatistics.length - 1) {
              if (flag === 0) {
                data[this.alarmListStatistics[i][1]] = '0'
              }
            }
          }
          this.chartData.rows.push(data)
          flag = 0
          time = new Date(time.getTime() + (1000 * 60 * 10))
        }
      }
      if (this.valuePeriod === 2) {
        time = new Date(this.beginTimestamp)
        while (time.getTime() <= this.endTimestamp) {
          data = {}
          month = '' + (time.getMonth() + 1)
          day = '' + time.getDate()
          if (month.length === 1) {
            month = '0' + month
          }
          if (day.length === 1) {
            day = '0' + day
          }
          hours = '' + time.getHours()
          if (hours.length === 1) {
            addTime = '' + time.getFullYear() + '-' + month + '-' + day + ' ' + '0' + hours + ':00'
          } else {
            addTime = '' + time.getFullYear() + '-' + month + '-' + day + ' ' + hours + ':00'
          }
          data[this.chartData.columns[0]] = addTime

          // 加载其他数据
          flagRow = this.alarmListStatistics[0][1]
          for (i = 0; i < this.alarmListStatistics.length; i++) {
            if (this.alarmListStatistics[i][1] !== flagRow) {
              if (flag === 0) {
                data[this.alarmListStatistics[i - 1][1]] = '0'
                flagRow = this.alarmListStatistics[i][1]
              } else {
                flagRow = this.alarmListStatistics[i][1]
                flag = 0
              }
            }
            arr = this.alarmListStatistics[i][0].split('.')
            performTime = arr[0].substring(0, 4) + '-' + arr[0].substring(4, 6) + '-' + arr[0].substring(6, 8) + ' ' + arr[1].substring(0, 2) + ':00'
            if (addTime === performTime) {
              data[this.alarmListStatistics[i][1]] = this.alarmListStatistics[i][2]
              flag = 1
            }
            if (i === this.alarmListStatistics.length - 1) {
              if (flag === 0) {
                data[this.alarmListStatistics[i][1]] = '0'
              }
            }
          }
          this.chartData.rows.push(data)
          flag = 0
          time = new Date(time.getTime() + (1000 * 60 * 60))
        }
      }
      // 统计周期为日
      if (this.valuePeriod === 3) {
        time = new Date(this.beginTimestamp)
        while (time.getTime() <= this.endTimestamp) {
          data = {}
          addTime = '' + time.getFullYear()
          month = '' + (time.getMonth() + 1)
          day = '' + time.getDate()
          if (month.length === 1) {
            month = '0' + month
          }
          if (day.length === 1) {
            day = '0' + day
          }
          addTime = addTime + '-' + month + '-' + day
          data[this.chartData.columns[0]] = addTime

          // 加载其他数据
          flagRow = this.alarmListStatistics[0][1]
          for (i = 0; i < this.alarmListStatistics.length; i++) {
            if (this.alarmListStatistics[i][1] !== flagRow) {
              if (flag === 0) {
                data[this.alarmListStatistics[i - 1][1]] = '0'
                flagRow = this.alarmListStatistics[i][1]
              } else {
                flagRow = this.alarmListStatistics[i][1]
                flag = 0
              }
            }
            arr = this.alarmListStatistics[i][0].split('.')
            performTime = arr[0].substring(0, 4) + '-' + arr[0].substring(4, 6) + '-' + arr[0].substring(6, 8)
            if (addTime === performTime) {
              data[this.alarmListStatistics[i][1]] = this.alarmListStatistics[i][2]
              flag = 1
            }
          }
          if (flag === 0) {
            data[this.alarmListStatistics[this.alarmListStatistics.length - 1][1]] = '0'
          }
          this.chartData.rows.push(data)
          flag = 0
          time = new Date(time.getTime() + (1000 * 60 * 60 * 24))
        }
      }
      if (this.valuePeriod === 4) {
        time = new Date(this.beginTimestamp)
        while (time.getTime() <= this.endTimestamp) {
          data = {}
          addTime = '' + time.getFullYear()
          month = '' + (time.getMonth() + 1)
          day = '' + time.getDate()
          if (month.length === 1) {
            month = '0' + month
          }
          if (day.length === 1) {
            day = '0' + day
          }
          addTime = addTime + '-' + month + '-' + day
          data[this.chartData.columns[0]] = addTime

          // 加载其他数据
          flagRow = this.alarmListStatistics[0][1]
          for (i = 0; i < this.alarmListStatistics.length; i++) {
            if (this.alarmListStatistics[i][1] !== flagRow) {
              if (flag === 0) {
                data[this.alarmListStatistics[i - 1][1]] = '0'
                flagRow = this.alarmListStatistics[i][1]
              } else {
                flagRow = this.alarmListStatistics[i][1]
                flag = 0
              }
            }
            arr = this.alarmListStatistics[i][0].split('.')
            performTime = arr[0].substring(0, 4) + '-' + arr[0].substring(4, 6) + '-' + arr[0].substring(6, 8)
            if (addTime === performTime) {
              data[this.alarmListStatistics[i][1]] = this.alarmListStatistics[i][2]
              flag = 1
            }
          }
          if (flag === 0) {
            data[this.alarmListStatistics[this.alarmListStatistics.length - 1][1]] = 0
          }
          this.chartData.rows.push(data)
          flag = 0
          time = new Date(time.getTime() + (1000 * 60 * 60 * 24 * 7))
        }
      }
      if (this.valuePeriod === 5) {
        var yearFlag
        var monthFlag
        yearFlag = this.beginTimestamp.getFullYear()
        monthFlag = this.beginTimestamp.getMonth()
        while (yearFlag < this.endTimestamp.getFullYear() || (yearFlag === this.endTimestamp.getFullYear() && monthFlag <= this.endTimestamp.getMonth())) {
          data = {}
          month = '' + (monthFlag + 1)
          if (month.length === 1) {
            addTime = '' + yearFlag + '-0' + month
          } else {
            addTime = '' + yearFlag + '-' + month
          }
          data[this.chartData.columns[0]] = addTime

          // 加载其他数据
          flagRow = this.alarmListStatistics[0][1]
          for (i = 0; i < this.alarmListStatistics.length; i++) {
            if (this.alarmListStatistics[i][1] !== flagRow) {
              if (flag === 0) {
                data[this.alarmListStatistics[i - 1][1]] = '0'
                flagRow = this.alarmListStatistics[i][1]
              } else {
                flagRow = this.alarmListStatistics[i][1]
                flag = 0
              }
            }
            arr = this.alarmListStatistics[i][0].split('.')
            performTime = arr[0].substring(0, 4) + '-' + arr[0].substring(4, 6)
            if (addTime === performTime) {
              data[this.alarmListStatistics[i][1]] = this.alarmListStatistics[i][2]
              flag = 1
            }
          }
          if (flag === 0) {
            data[this.alarmListStatistics[this.alarmListStatistics.length - 1][1]] = 0
          }
          this.chartData.rows.push(data)
          flag = 0
          monthFlag++
          if (monthFlag > 11) {
            monthFlag = 0
            yearFlag++
          }
        }
      }
    },

    // 统计结果数据规范
    standardQueryData: function () {
      this.alarmList = []
      // 遍历chartData.rows，用于alarmList
      for (let i = 0; i < this.chartData.rows.length; i++) {
        let map = {}
        map['curTime'] = this.chartData.rows[i]['时间']
        for (let j = 1; j < this.chartData.columns.length; j++) {
          // TODO：设备类型时应剔除 "."
          let propName = ''
          if (this.valueAspect === 'deviceModel') {
            let propList = new Array()
            propList = this.chartData.columns[j].split('.')
            propName = propList.join('')
          } else {
            propName = this.chartData.columns[j]
          }
          map[propName] = this.chartData.rows[i][this.chartData.columns[j]]
        }
        this.alarmList.push(map)
      }
      console.log(this.chartData.rows)
      console.log(this.alarmList)
    },

    /***
       * @Description  : 点击查询按钮事件
       * @author       : lxy
       * @date         : 2018/12/13 16:37
       */
    queryAlarmDataByCondition: function () {
      console.log('告警书数据按条件统计')
      this.alarmList = []
      this.alarmListStatistics = []
      this.chartData.rows = []
      this.chartData.columns = []
      this.chartSettings.yAxisName = []
      this.chartSettings.yAxisType = []
      this.chartExtend.yAxis = {}
      this.chartExtend.xAxis.axisLabel = {}
      this.tableLabel = []
      this.setQuerySelectList()
      this.setStatisticsList()
      this.queryAlarmStatisticsData()
    },

    /***
       * @Description  : 获取统计图数据
       * @author       : zf
       * @date         : 2018/12/24 17:42
       */
    queryAlarmStatisticsData: function () {
      let _this = this
      let loadingInstance = _this.Loading.openLoading()
      AlarmManagerService.queryAlarmStatistic(this.statisticsList).then(result => {
        // 成功
        _this.alarmListStatistics = Object.values(result)
        _this.Loading.closeLoading(loadingInstance)
        if (_this.alarmListStatistics.length > 0) {
          // TODO：清除统计结果中项目为空的数据
          for (let j = 0; j < _this.alarmListStatistics.length; j++) {
            if (_this.alarmListStatistics[j][1] === '') {
              _this.alarmListStatistics.splice(j, 1)
              j--
            }
          }
          if (_this.alarmListStatistics.length > 0) {
            if (_this.valueAspect === 'deviceKey') { // 维度：（设备/服务器）名称
              var flag = 0
              for (var k = 0; k < _this.alarmListStatistics.length; k++) {
                for (var h = 0; h < _this.deviceList.length; h++) {
                  if (_this.alarmListStatistics[k][1] === _this.deviceList[h]['deviceKey']) {
                    _this.alarmListStatistics[k][1] = _this.deviceList[h]['displayName']
                    flag = 1
                  }
                  if (flag === 0) {
                    _this.alarmListStatistics[k][1] = _this.alarmListStatistics[k][1]
                  } else {
                    flag = 0
                  }
                }
              }
            }
            // 维度：设备/服务器型号
            if (_this.valueAspect === 'deviceModel') {
              // if(_this.nodeType === 0){   //设备型号deviceModel，不需要进行名称过滤，直接进行显示
              //
              // }
              // else{    //服务器型号serverType，需要进行过滤
              //   var flag = 0;
              //   for (var k = 0; k < _this.alarmListStatistics.length; k++) {
              //     for (var h = 0; h < _this.serverTypeList.length; h++) {
              //       if (_this.alarmListStatistics[k][0] === _this.serverTypeList[h]['value']) {
              //         _this.alarmListStatistics[k][0] = _this.serverTypeList[h]['label'];
              //         flag = 1
              //       }
              //       if (flag === 0) {
              //         _this.alarmListStatistics[k][0] = _this.alarmListStatistics[k][0]
              //       }
              //       else {
              //         flag = 0
              //       }
              //     }
              //   }
              // }
            }
            // 维度：告警类型
            if (_this.valueAspect === 'alarmCode') {
              for (var m = 0; m < _this.alarmListStatistics.length; m++) {
                for (let k = 0; k < _this.optionsAlarmCause0.length; k++) {
                  if (_this.alarmListStatistics[m][1] === _this.optionsAlarmCause0[k]['alarmCode']) {
                    _this.alarmListStatistics[m][1] = _this.optionsAlarmCause0[k]['alarmCode']
                  }
                }
              }
            }
            // 维度：告警等级
            if (_this.valueAspect === 'alarmLevel') {
              for (var m = 0; m < _this.alarmListStatistics.length; m++) {
                if (_this.alarmListStatistics[m][1] === '0') {
                  _this.alarmListStatistics[m][1] = this.$t('AlarmStatistics.MinorAlarm')
                } else if (_this.alarmListStatistics[m][1] === '1') {
                  _this.alarmListStatistics[m][1] = this.$t('AlarmStatistics.MajorAlarm')
                } else if (_this.alarmListStatistics[m][1] === '2') {
                  _this.alarmListStatistics[m][1] = this.$t('AlarmStatistics.CriticalAlarm')
                }
              }
            }
            // 维度：告警状态
            if (_this.valueAspect === 'alarmStatus') {
              for (var m = 0; m < _this.alarmListStatistics.length; m++) {
                if (_this.alarmListStatistics[m][1] === '0') {
                  _this.alarmListStatistics[m][1] = this.$t('AlarmStatistics.Notconfirmed')
                } else if (_this.alarmListStatistics[m][1] === '1') {
                  _this.alarmListStatistics[m][1] = this.$t('AlarmStatistics.Confirmed')
                } else if (_this.alarmListStatistics[m][1] === '2') {
                  _this.alarmListStatistics[m][1] = this.$t('AlarmStatistics.Cleared')
                } else if (_this.alarmListStatistics[m][1] === '3') {
                  _this.alarmListStatistics[m][1] = this.$t('AlarmStatistics.Restored')
                } else if (_this.alarmListStatistics[m][1] === '4') {
                  _this.alarmListStatistics[m][1] = this.$t('AlarmStatistics.Delete')
                }
              }
            }
            console.log(this.alarmListStatistics)
            this.standardStatisticsData()
            this.standardQueryData()
            this.handleTableLabel()
          } else {
            _this.InfoTip.warningTip_alarm(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.QUERY_NULL_CODE))
          }
        } else {
          _this.InfoTip.warningTip_alarm(_this, HelperUtil.getCheckStatusCodeObjectByCode(_this.successCode.QUERY_NULL_CODE))
        }
      }).catch(err => {
        // 失败
        _this.Loading.closeLoading(loadingInstance)
        _this.InfoTip.errorTip(_this, err)
      })
    },

    // 处理alarmListStatistics，提取出统计表的动态表头
    handleTableLabel: function () {
      this.tableLabel = []
      for (let i = 0; i < this.alarmListStatistics.length; i++) {
        let flag1 = 0 // 标记该维度是否已经存在在表头列表中了，0是不存在
        for (let j = 0; j < this.tableLabel.length; j++) {
          if (this.tableLabel[j].label === this.alarmListStatistics[i][1]) {
            console.log(this.tableLabel)
            flag1 = 1
          }
        }

        // 判断，如果不存在就把该维度添加到表头列表当中
        if (flag1 === 0) {
          let map = {}
          map['label'] = this.alarmListStatistics[i][1]
          map['width'] = ''
          map['prop'] = this.alarmListStatistics[i][1]
          // TODO：设备类型时应剔除 "."
          if (this.valueAspect === 'deviceModel') {
            let propList = this.alarmListStatistics[i][1].split('.')
            map['prop'] = propList.join('')
          }
          this.tableLabel.push(map)
        }
      }
      console.log(this.tableLabel)
    },

    /**
       * ---------------------------导出功能实现---------------------------
       * */
    exportFile () {
      if (this.alarmList.length === 0 || this.alarmListStatistics.length === 0) {
        this.InfoTip.warningTip_alarm(this, {message: '暂无统计结果!'})

        //          this.$message({
        //            type: 'warning',
        //            message: '暂无统计结果！ ',
        //            duration: 10000,
        //            showClose: true,
        //          })
      } else {
        const loading = this.$loading({
          lock: true,
          text: 'Loading',
          spinner: 'el-icon-loading',
          background: 'rgba(0, 0, 0, 0.7)',
          target: document.querySelector('.el-row')
        })
        if (this.activeName === 'first') {
          this.exportExcel()
        } else {
          this.createImage()
        }
        loading.close()
      }
    },
    // chart图标导出图片
    createImage () {
      //        this.$nextTick(()=>{});
      const canvas = document.getElementsByTagName('canvas')[0]
      //        const box = this.$refs.box;
      let image = canvas.toDataURL({
        type: 'png',
        pixelRatio: 2,
        backgroundColor: '#fff' // 不设置此项，导出图片的底色是黑色
      })
      //        box.innerHTML = '<img src="'+image+'" alt="">';
      //        console.log(image);
      var dlLink = document.createElement('a')
      dlLink.download = '告警统计图.png'
      dlLink.href = image
      //        dlLink.dataset.downloadurl = [MIME_TYPE, dlLink.download, dlLink.href].join(':');
      //        dlLink.setAttribute('download', '性能统计数据.png');
      document.body.appendChild(dlLink)
      dlLink.click()
      document.body.removeChild(dlLink)
    },

    // table download
    exportExcel () {
      this.exportName1()
      /* generate workbook object from table */
      var wb = XLSX.utils.table_to_book(document.querySelector('#myTable'))
      /* get binary string as output */
      var wbout = XLSX.write(wb, {bookType: 'xlsx', bookSST: true, type: 'array'})
      try {
        FileSaver.saveAs(new Blob([wbout], {type: 'application/octet-stream'}), this.exportName)
      } catch (e) {
        if (typeof console !== 'undefined') console.log(e, wbout)
      }
      return wbout
    },

    // 导出名称
    exportName1: function () {
      let aspect = ''
      for (let i = 0; i < this.optionsAspect.length; i++) {
        if (this.optionsAspect[i].value === this.valueAspect) {
          aspect = this.optionsAspect[i].label
        }
      }
      this.exportName = this.exportName + '-统计维度-' + aspect + '.xlsx'
    }
  },
  computed: {
    queryNodeTypeChange () {
      this.optionsPeriod[0].label = this.$t('AlarmStatistics.minute')
      this.optionsPeriod[1].label = this.$t('AlarmStatistics.TenMinute')
      this.optionsPeriod[2].label = this.$t('AlarmStatistics.hour')
      this.optionsPeriod[3].label = this.$t('AlarmStatistics.day')
      this.optionsPeriod[4].label = this.$t('AlarmStatistics.week')
      this.optionsPeriod[5].label = this.$t('AlarmStatistics.month')
      // 统计维度
      this.optionsAspect[0].label = this.$t('AlarmStatistics.deviceType')
      this.optionsAspect[1].label = this.$t('AlarmStatistics.deviceKey')
      this.optionsAspect[2].label = this.$t('AlarmStatistics.alarmType')
      this.optionsAspect[3].label = this.$t('AlarmStatistics.alarmLevel1')
      this.optionsAspect[4].label = this.$t('AlarmStatistics.alarmStatus1')
      // 告警等级选择域
      this.optionsAlarmLevel[0].label = this.$t('AlarmStatistics.MinorAlarm')
      this.optionsAlarmLevel[1].label = this.$t('AlarmStatistics.MajorAlarm')
      this.optionsAlarmLevel[2].label = this.$t('AlarmStatistics.CriticalAlarm')
      // 告警状态选择域
      this.optionsAlarmStauts[0].label = this.$t('AlarmStatistics.Notconfirmed')
      this.optionsAlarmStauts[1].label = this.$t('AlarmStatistics.Confirmed')
      this.optionsAlarmStauts[2].label = this.$t('AlarmStatistics.Cleared')
      this.optionsAlarmStauts[3].label = this.$t('AlarmStatistics.Restored')
    }
  },
  watch: {
    '$i18n.locale' () {
      this.queryNodeTypeChange()
    }
  }
}
</script>

<style>
</style>
