<template>
  <div id="main" class="h-all">
    <el-container class="h-all">
      <!-- table数据表格 -->
      <el-main class="adapt-height-box">
        <el-table
          :span-method="cellMerge"
          :empty-text="$t('common.noData')"
          header-row-class-name="table-header"
          cell-class-name="table-cell"
          class="adapt-height"
          ref="multipleTable"
          :data="performList"
          stripe
          tooltip-effect="dark"
          :highlight-current-row="true"
          height="auto"
          border>
          <el-table-column
            prop="deviceType"
            :label="$t('Performance.networkElementType')"
            :show-overflow-tooltip="true">
          </el-table-column>
          <el-table-column
            prop="deviceModel"
            :label="$t('Performance.deviceModel')"
            :show-overflow-tooltip="true">
          </el-table-column>
          <el-table-column
            prop="performTypeName"
            :label="$t('Performance.performanceEvent')"
            :show-overflow-tooltip="true">
          </el-table-column>
          <el-table-column
            prop="lowerLimit0"
            :label="$t('Performance.minorAlarmLowerLimit')"
            :show-overflow-tooltip="true">
            <template slot-scope="scope">
              {{hanldeData(scope.row.lowerLimit0)}}
            </template>
          </el-table-column>
          <el-table-column
            prop="upperLimit0"
            :label="$t('Performance.minorAlarmUpperLimit')"
            :show-overflow-tooltip="true">
            <template slot-scope="scope">
              {{hanldeData(scope.row.upperLimit0)}}
            </template>
          </el-table-column>
          <el-table-column
            prop="lowerLimit1"
            :label="$t('Performance.majorAlarmLowerLimit')"
            :show-overflow-tooltip="true">
            <template slot-scope="scope">
              {{hanldeData(scope.row.lowerLimit1)}}
            </template>
          </el-table-column>
          <el-table-column
            prop="upperLimit1"
            :label="$t('Performance.majorAlarmUpperLimit')"
            :show-overflow-tooltip="true">
            <template slot-scope="scope">
              {{hanldeData(scope.row.upperLimit1)}}
            </template>
          </el-table-column>
          <el-table-column
            prop="lowerLimit2"
            :label="$t('Performance.criticalAlarmLowerLimit')"
            :show-overflow-tooltip="true">
            <template slot-scope="scope">
              {{hanldeData(scope.row.lowerLimit2)}}
            </template>
          </el-table-column>
          <el-table-column
            :label="$t('Performance.criticalAlarmUpperLimit')"
            :show-overflow-tooltip="true">
            <template slot-scope="scope">
              {{hanldeData(scope.row.upperLimit2)}}
            </template>
          </el-table-column>
          <el-table-column
            prop="unit"
            :label="$t('Performance.unit')"
            :show-overflow-tooltip="true"
            width="60">
          </el-table-column>
<!--          <el-table-column-->
<!--            width="60px"-->
<!--            :label="$t('Performance.enablementOption')">-->
<!--            <template slot-scope="scope">-->
<!--              <el-switch-->
<!--                v-model="scope.row.status"-->
<!--                :active-value=0-->
<!--                :inactive-value=1-->
<!--                active-color="#00A854"-->
<!--                inactive-color="#F04134"-->
<!--                @change="changeStatus(scope.row)"/>-->
<!--            </template>-->
<!--          </el-table-column>-->
          <el-table-column
            width="54px"
            v-if="updatePerformanceThresholdCommand.visible"
            :label="$t('common.operation')">
            <template slot-scope="scope">
              <el-button
                size="mini"
                style="background: #008000"
                :title="$t('common.updateBtn')"
                @click="updatePerformType(scope.row)">
                <svg class="icon" aria-hidden="true">
                  <use xlink:href="#icon-bianji"></use>
                </svg>
              </el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-main>
    </el-container>
    <CommandExecuteContext v-bind:commands="commandContext"></CommandExecuteContext>
  </div>
</template>

<script>
import CommandExecuteContext from '../../commands/CommandExecuteContext'
import DeviceService from '@/domain/services/DeviceService.js'
import PerformanceCommands from '../../commands/PerformanceCommands'
import PerformanceMonitorService from '../../domain/services/PerformanceMonitorService'
import HelperUtil from '../../utils/HelperUtil'

export default {
  name: 'PerformanceThreshold',

  components: {
    CommandExecuteContext
  },
  created: function () {
    this.getAllDeviceType()
    this.getAllDeviceModel()
    this.getAllPerformType()
  },
  // 存放数据
  data: function () {
    return {
      // 命令
      commandContext: {},
      // 为修改传参数
      updateInitList: [],
      updateStatusList: [],
      multipleSelection: [],
      deviceTypeList: [],
      deviceModelList: [],

      // form参数
      formLabelWidth: '120px',
      labelPosition: 'right',

      querySelectModel: '',
      querySelectNetworkType: '',
      selectList: [],

      // 双向绑定展示数据
      performList: [],

      enableChecked: true,

      spanArr: [],
      pos: 0
    }
  },

  computed: {
    // 命令
    updatePerformanceThresholdCommand () {
      return PerformanceCommands.updatePerformanceThresholdCommand(this.updateInitList, this.commandContext)
    }
  },

  methods: {
    /**
     * @Description  : habdleData
     * @author       : ls
     * @date         : 2020/12/19 22:34
     * @param        :
     * @return       :
     */
    hanldeData (val) {
      if (val === -999) {
        return ''
      } else {
        return val
      }
    },
    /**
     * @Description  : 判断是否合并
     * @author       : ls
     * @date         : 2020/4/26 14:15
     * @param        :
     * @return       :
     */
    getSpanArr (data) {
      this.spanArr = []
      for (var i = 0; i < data.length; i++) {
        if (i === 0) {
          this.spanArr.push(1)
          this.pos = 0
        } else {
          if (data[i].deviceModel === data[i - 1].deviceModel) {
            this.spanArr[this.pos] += 1
            this.spanArr.push(0)
          } else {
            this.spanArr.push(1)
            this.pos = i
          }
        }
      }
    },
    /**
     * @Description  : hebing
     * @author       : ls
     * @date         : 2020/4/26 14:13
     * @param        :
     * @return       :
     */
    cellMerge ({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 0 || columnIndex === 1) {
        const _row = this.spanArr[rowIndex]
        const _col = _row > 0 ? 1 : 0
        return {
          rowspan: _row,
          colspan: _col
        }
      }
    },
    /**
     * @Description  : chaxuntiaojian
     * @author       : ls
     * @date         : 2020/4/26 13:14
     * @param        :
     * @return       :
     */
    setSelectList: function () {
      this.selectList = []
      if (this.querySelectNetworkType != null && this.querySelectNetworkType !== '') {
        this.selectList.push({
          quaryAttribute: 'deviceTypeKey',
          compareSymbol: '=',
          compareValue: this.querySelectNetworkType
        })
      }
      if (this.querySelectModel !== '' && this.querySelectModel !== null) {
        this.selectList.push({
          quaryAttribute: 'deviceModel',
          compareSymbol: '=',
          compareValue: this.querySelectModel
        })
      }
    },
    /**
     * @Description  : tianjianchaxun
     * @author       : ls
     * @date         : 2020/4/26 12:57
     * @param        :
     * @return       :
     */
    queryThresholdByCondition: function () {
      let _this = this
      _this.setSelectList()
      let loadingInstance = _this.Loading.openLoading()
      PerformanceMonitorService.serviceConditionQueryThreshold(_this.selectList).then(result => {
        // 关闭loading
        _this.Loading.closeLoading(loadingInstance)
        // 成功
        _this.performList = Object.values(result)
        if (_this.performList.length === 0) {
          _this.InfoTip.warningTip(_this, HelperUtil.getCheckStatusCodeObjectByCode(_this.successCode.QUERY_NULL_CODE))
        } else {
          this.getSpanArr(_this.performList)
          _this.InfoTip.successTip(_this, HelperUtil.getStatusCodeObjectByCode(_this.successCode.QUERY_CODE))
        }
      }).catch(err => {
        // 关闭loading
        _this.Loading.closeLoading(loadingInstance)
        // 失败
        _this.InfoTip.errorTip(_this, err)
      })

      // }
    },
    /**
     * @Description  : 获取网元类型
     * @author       : ls
     * @date         : 2020/4/26 12:44
     * @param        :
     * @return       :
     */
    getAllDeviceType: function () {
      let _this = this
      DeviceService.getAllDeviceTypeCollection().then(result => {
        _this.deviceTypeList = Object.values(result)
      }).catch(err => {
        _this.InfoTip.errorTip(_this, err)
      })
    },
    /**
     * @Description  : 获取网元型号
     * @author       : ls
     * @date         : 2020/5/19 18:10
     * @param        :
     * @return       :
     */
    getAllDeviceModel: function () {
      let _this = this
      DeviceService.getAllDeviceModelCollection().then(result => {
        _this.deviceModelList = Object.values(result)
      }).catch(err => {
        _this.InfoTip.errorTip(_this, err)
      })
    },
    /**
     * @Description  :  修改启用停用状态
     * @author       : ls
     * @date         : 2020/4/26 10:58
     * @param        :
     * @return       :
     */
    changeStatus: function (val) {
      let _this = this
      this.updateStatusList = []
      let formRow = {}
      formRow.deviceTypeKey = val.deviceTypeKey
      formRow.deviceParam = val.deviceParam
      formRow.deviceModel = val.deviceModel
      formRow.period = val.period
      formRow.status = val.status
      formRow.lowerLimit0 = val.lowerLimit0
      formRow.upperLimit0 = val.upperLimit0
      formRow.lowerLimit1 = val.lowerLimit1
      formRow.upperLimit1 = val.upperLimit1
      formRow.lowerLimit2 = val.lowerLimit2
      formRow.upperLimit2 = val.upperLimit2
      formRow.unit = val.unit
      formRow.peformTypeName = val.peformTypeName
      formRow.deviceType = val.deviceType

      this.updateStatusList.push(formRow)
      PerformanceMonitorService.postChangeStatus(this.updateStatusList).then(result => {
        _this.InfoTip.successTip(_this, HelperUtil.getStatusCodeObjectByCode(_this.successCode.MODIFY_CODE))
      }).catch(err => {
        _this.InfoTip.errorTip(_this, err)
      })
      // this.getAllPerformType()
    },
    /***
       * @Description  : 获取性能配置数据
       * @author       : zf
       * @date         : 2019/02/25 15:31:08
       */
    getAllPerformType: function () {
      let _this = this
      PerformanceMonitorService.getAllPerformanceMonitorCollection().then(result => {
        // 成功
        _this.performList = Object.values(result)
        this.getSpanArr(_this.performList)
        console.log(this.performList)
      }).catch(err => {
        // 失败
        _this.InfoTip.errorTip(_this, err)
      })
    },

    /* ---------------------------修改选择--------------------------- */

    /***
       * @Description  : 修改选中性能配置初始化
       * @author       :
       * @date         : 2019/5/6
       */
    updatePerformType: function (val) {
      // this.updateInitList = {
      //   'deviceTypeKey': val.deviceTypeKey,
      //   'deviceModel': val.deviceModel,
      //   'deviceParam': val.deviceParam,
      //   'status': val.status,
      //   'lowerLimit0': val.lowerLimit0,
      //   'upperLimit0': val.upperLimit0,
      //   'lowerLimit1': val.lowerLimit1,
      //   'upperLimit1': val.upperLimit1,
      //   'lowerLimit2': val.lowerLimit2,
      //   'upperLimit2': val.upperLimit2,
      //   'showLowerLimit': val.showLowerLimit,
      //   'showUpperLimit': val.showUpperLimit,
      //   'peformTypeName': val.peformTypeName,
      //   'deviceType': val.deviceType,
      //   'delFlag': val.delFlag,
      //   'modifyTime': val.modifyTime
      // }
      this.updateInitList = val
      this.updatePerformanceThresholdCommand.execute()
    }
  },

  watch: {
    commandContext (newVal, oldVal) {
      if (JSON.stringify(newVal) === '{}') {
        this.getAllPerformType()
      }
      deep: true
    }
  }
}
</script>

<style scoped>
</style>
