<template>
  <div id="main" class="h-all">
    <el-container class="h-all">
      <el-header height="auto">
        <!-- 通用工具栏 -->
        <div class="header-button-box">
          <el-button size='mini' icon="el-icon-upload2" type="success"
                     @click="importToExcelInit"
                     v-if="importCommand.visible">
            {{$t("common.importBtn")}}
          </el-button>
          <el-button size='mini' icon="el-icon-download" type="success"
                     @click="exportToExcelInit">
            {{$t("common.exportBtn")}}
          </el-button>
          <el-button size='mini' icon="el-icon-circle-plus-outline" type="primary"
                     v-if="createAndCopyCommand.visible"
                     @click="createDeviceInit">
            {{$t("common.createBtn")}}
          </el-button>
          <el-button size='mini' icon="el-icon-delete" type="danger"
                     v-if="deleteCommand.visible"
                     @click="deleteDeviceInit">{{$t("common.deleteBtn")}}
          </el-button>
          <!--          <el-button size='mini'  icon="el-icon-upload2" type="primary" @click="uploadConfigInit">-->
          <!--            {{$t("DeviceConfigurationManagement.profileUpload")}}-->
          <!--          </el-button>-->
          <!--          <el-button size='mini' icon="el-icon-refresh" type="primary"-->
          <!--                     v-if="downloadConfigToDeviceCommand.visible"-->
          <!--                     @click="updateConfigInit">-->
          <!--            {{$t("DeviceConfigurationManagement.profileUpdate")}}-->
          <!--          </el-button>-->
          <!--          <el-button size='mini' icon="el-icon-document" type="primary"-->
          <!--                     v-if="historyConfigToDeviceCommand.visible"-->
          <!--                     @click="restoryConfigInit">-->
          <!--            {{$t("DeviceConfigurationManagement.profileHistory")}}-->
          <!--          </el-button>-->
        </div>

        <div class="header-search">
          <div class="search-input-box">
            <label>{{ $t('DeviceConfigurationManagement.nodeName')}}：</label>
            <el-input size='mini' :placeholder="$t('common.placeholder')" v-model="querySelectNetworkName"
                      clearable></el-input>
          </div>
          <div class="search-input-box">
            <label>{{ $t('DeviceConfigurationManagement.ipAddress')}}：</label>
            <el-input size='mini' :placeholder="$t('common.placeholder')"
                      v-model="querySelectNetworkAddress" clearable>
            </el-input>
          </div>
          <div class="search-input-box">
            <label>{{ $t('DeviceConfigurationManagement.bussIpAddress')}}：</label>
            <el-input size='mini' :placeholder="$t('common.placeholder')"
                      v-model="bussIpAddress" clearable>
            </el-input>
          </div>
          <div class="search-input-box">
            <label>{{ $t('DeviceConfigurationManagement.nodeType')}}：</label>
            <el-select clearable size='mini' v-model="querySelectNetworkType"
                       @change="deviceTypeChange"
                       @clear="deviceModelChange"
                       :placeholder="$t('common.placeholderSelect')" autocomplete="off">
              <el-option v-for="item in deviceTypeList"
                         :key="item.deviceTypeKey"
                         :label="item.deviceTypeName"
                         :value="item.deviceTypeKey"></el-option>
            </el-select>
          </div>
          <div class="search-input-box">
            <label>{{ $t('DeviceConfigurationManagement.nodeModel')}}：</label>
            <el-select clearable size="mini" v-model="querySelectModel"
                       :placeholder="$t('common.placeholderSelect')" autocomplete="off">
              <el-option
                v-for="item in deviceModelList1"
                :key="item.deviceModelKey"
                :label="item.deviceModel"
                :value="item.deviceModel">
              </el-option>
            </el-select>
            <!--<el-input size='mini':placeholder="$t('common.placeholder')" v-model="querySelectlocationKey" clearable></el-input>-->
          </div>
          <div class="search-input-box">
            <label>{{ $t('DeviceConfigurationManagement.stationSite')}}：</label>
            <el-input size='mini' :placeholder="$t('common.placeholder')" v-model="querySelectStationSite" clearable></el-input>
          </div>
          <div class="search-input-box">
            <label>{{ $t('DeviceConfigurationManagement.subnetKey') }}：</label>
            <el-select clearable="true" size='mini' v-model="querySelectSubnet" :placeholder="$t('common.placeholderSelect')"  autocomplete="off">
              <el-option v-for="item in subnetList"
                         :key="item.subnetKey"
                         :label="item.subnetName"
                         :value="item.subnetKey">
              </el-option>
            </el-select>
          </div>
          <div class="search-input-box">
            <label>{{ $t('DeviceConfigurationManagement.nodeStatus')}}：</label>
            <el-select clearable size='mini' v-model="querySelectNetworkStatus"
                       :placeholder="$t('common.placeholderSelect')"
                       autocomplete="off">
              <el-option v-for="item in deviceStatusList"
                         :key="item.key"
                         :label="item.label"
                         :value="item.key">
              </el-option>
            </el-select>
          </div>
          <div class="search-input-box">
            <el-button size='mini' icon="el-icon-search" type="primary" @click="queryDeviceDataByCondition">
              {{ $t("common.queryBtn")}}
            </el-button>
          </div>
        </div>
      </el-header>

      <el-main class="adapt-height-box">
        <el-table
          :empty-text="$t('common.noData')"
          border
          header-row-class-name="table-header"
          cell-class-name="table-cell"
          class="adapt-height"
          height="auto"
          ref="singleTable"
          :data="deviceList"
          highlight-current-row
          stripe
          tooltip-effect="dark"
          @row-contextmenu="handleContextmenu"
          @selection-change="handleSelectionChange">
          <el-table-column
            type="selection"
            width="28">
          </el-table-column>
          <!--:selectable='checkboxForMain'-->
          <el-table-column
            show-overflow-tooltip="true"
            prop="displayName"
            :label="$t('DeviceConfigurationManagement.nodeName')">
          </el-table-column>
          <el-table-column
            prop="ipAddress"
            width="115px"
            :label="$t('DeviceConfigurationManagement.ipAddress')">
          </el-table-column>
          <el-table-column
            prop="bussIpAddress"
            width="115px"
            :label="$t('DeviceConfigurationManagement.bussIpAddress')">
          </el-table-column>
          <el-table-column
            prop="uuid"
            width="100px"
            :label="$t('DeviceConfigurationManagement.uuid')"
            show-overflow-tooltip="true"
            style="font-size: 10px;">
          </el-table-column>
          <el-table-column
            prop="deviceTypeName"
            :label="$t('DeviceConfigurationManagement.nodeType')">
          </el-table-column>
          <el-table-column
            prop="deviceModel"
            :label="$t('DeviceConfigurationManagement.nodeModel')"
            width="130">
          </el-table-column>
          <el-table-column
            prop="station"
            width="100"
            :label="$t('DeviceConfigurationManagement.stationSite')">
          </el-table-column>
          <el-table-column
            prop="subnetName"
            width="100"
            :label="$t('DeviceConfigurationManagement.subnetKey')"
            show-overflow-tooltip="true">
<!--            :formatter="formatSubnetKey">-->
          </el-table-column>
          <el-table-column
            prop="deviceStatus"
            :label="$t('DeviceConfigurationManagement.nodeStatus')"
            width="100"
            :formatter="formatdeviceStatus">
          </el-table-column>
          <el-table-column
            prop="deviceVersion"
            width="100"
            :label="$t('DeviceConfigurationManagement.nodeVersion')">
          </el-table-column>
          <el-table-column
            width="200"
            prop="startTime"
            :formatter="formatTime"
            :label="$t('DeviceConfigurationManagement.startTime')"
            show-overflow-tooltip="true">
          </el-table-column>
          <el-table-column
            width="200"
            prop="deviceDesc"
            :label="$t('DeviceConfigurationManagement.nodeDesc')"
            show-overflow-tooltip="true">
          </el-table-column>
          <!--          <el-table-column-->
          <!--            fixed="right"-->
          <!--            width="360px"-->
          <!--            :label="$t('common.operation')">-->
          <!--            <template slot-scope="scope">-->
          <!--              <el-button-->
          <!--                size="mini"-->
          <!--                style="background: #53D214"-->
          <!--                :title="$t('common.view')"-->
          <!--                @click="viewDetail(scope.row)">-->
          <!--                <svg class="icon" aria-hidden="true">-->
          <!--                  <use xlink:href="#icon-chakan"></use>-->
          <!--                </svg>-->
          <!--              </el-button>-->
          <!--              <el-button-->
          <!--                size="mini"-->
          <!--                style="background: #175BE3"-->
          <!--                :title="$t('common.copyBtn')"-->
          <!--                @click="copyDeviceInit(scope.row)">-->
          <!--                <svg class="icon" aria-hidden="true">-->
          <!--                  <use xlink:href="#icon-fuzhi"></use>-->
          <!--                </svg>-->
          <!--              </el-button>-->
          <!--              <el-button-->
          <!--                size="mini"-->
          <!--                style="background: #008000"-->
          <!--                :title="$t('common.updateBtn')"-->
          <!--                @click="updateDeviceInit(scope.row)">-->
          <!--                <svg class="icon" aria-hidden="true">-->
          <!--                  <use xlink:href="#icon-bianji"></use>-->
          <!--                </svg>-->
          <!--              </el-button>-->
          <!--              <el-button-->
          <!--                size="mini"-->
          <!--                style="background: #0366CB"-->
          <!--                :title="$t('DeviceConfigurationManagement.profileCopyAgain')"-->
          <!--                @click="handleProfileAgain(scope.row)">-->
          <!--                <svg class="icon" aria-hidden="true">-->
          <!--                  <use xlink:href="#icon-beifen"></use>-->
          <!--                </svg>-->
          <!--              </el-button>-->
          <!--              <el-button-->
          <!--                size="mini"-->
          <!--                style="background: #167180"-->
          <!--                :title="$t('DeviceConfigurationManagement.profileUpdateTitle')"-->
          <!--                @click="handleUpdateProfile(scope.row)">-->
          <!--                <svg class="icon" aria-hidden="true">-->
          <!--                  <use xlink:href="#icon-shuaxin">-->
          <!--                    <svg class="icon" aria-hidden="true">-->
          <!--                      <use xlink:href="#icon-gengxin"></use>-->
          <!--                    </svg>-->
          <!--                  </use>-->
          <!--                </svg>-->
          <!--              </el-button>-->
          <!--              <el-button-->
          <!--                size="mini"-->
          <!--                style="background: #006FFF"-->
          <!--                :title="$t('DeviceConfigurationManagement.downloadLog')"-->
          <!--                @click="downloadLog(scope.row)">-->
          <!--                <svg class="icon" aria-hidden="true">-->
          <!--                  <use xlink:href="#icon-xiazai"></use>-->
          <!--                </svg>-->
          <!--              </el-button>-->
          <!--              <el-button-->
          <!--                size="mini"-->
          <!--                style="background: #4B74E3"-->
          <!--                :title="$t('common.restart')"-->
          <!--                @click="handleCopy(scope.row)">-->
          <!--                <svg class="icon" aria-hidden="true">-->
          <!--                  <use xlink:href="#icon-chongqi"></use>-->
          <!--                </svg>-->
          <!--              </el-button>-->
          <!--            </template>-->
          <!--          </el-table-column>-->
        </el-table>
        <el-pagination
          background
          @current-change="handleCurrentChange"
          :current-page.sync="currentPage"
          :page-size="pageSize"
          layout="total, prev, pager, next, jumper"
          :total="total">
        </el-pagination>
      </el-main>
    </el-container>
    <v-contextmenu ref="deviceContextmenu" id="rightMenu">
      <v-contextmenu-item v-for="command in contextCommands" :key="command.key" @click="command.execute" :disabled="command.disabled">{{command.name}}</v-contextmenu-item>
    </v-contextmenu>
    <CommandExecuteContext v-bind:commands="commandContext"></CommandExecuteContext>
  </div>
</template>

<script>
import DeviceService from '@/domain/services/DeviceService.js'
import SubnetService from '@/domain/services/SubnetService.js'
import ConfigFileService from '@/domain/services/ConfigFileService.js'
import CommandExecuteContext from '@/commands/CommandExecuteContext'
import DeviceCommands from '@/commands/DeviceCommands'
import ConfigFileCommands from '@/commands/ConfigFileCommands'
import HelperUtil from '../../utils/HelperUtil'

export default {

  components: {
    CommandExecuteContext
  },
  name: 'DeviceManagement',
  props: ['deviceCollection', 'alarmCollection'],
  data: function () { // 存放 数据
    return {
      commands: {},
      contextCommands: [],
      // 命令
      commandContext: {},
      deviceList: [],
      deviceModelList: [],
      deviceModelList1: [],
      subnetList: [],
      deviceTypeList: [],

      // 设备配置更新时传的devicekey
      updateConfigFileKey: null,
      deviceDetailInfo: {},
      selectList: [],
      // 网元状态下拉菜单
      deviceStatusList: [
        {
          key: '0',
          label: this.$t('DeviceConfigurationManagement.inUse')
        },
        {
          key: '1',
          label: this.$t('DeviceConfigurationManagement.notInUse')
        }
      ],
      // 网元状态表格过滤
      deviceStatusListForTable: [
        {
          key: '0',
          label: this.$t('DeviceConfigurationManagement.inUse')
        },
        {
          key: '1',
          label: this.$t('DeviceConfigurationManagement.notInUse')
        }
      ],
      valueState: '1',
      // SNMP版本下拉菜单
      deviceSNMPList: [
        {
          key: '0',
          label: 'v1'
        },
        {
          key: '1',
          label: 'v2c'
        },
        {
          key: '3',
          label: 'v3'
        }
      ],
      deviceSNMP: '1',
      flag: 0,

      //  查询条件变量
      querySelectNetworkName: '', // 网元名称"
      querySelectNetworkType: '', // 网元类型"
      querySelectModel: '', // 网元型号
      querySelectStationSite: '', // 所属站点
      querySelectIpNetworkSegment: '', // Ip网段"
      querySelectNetworkStatus: null, // 网元状态"
      querySelectSubnet: null, // 所属子网"
      querySelectNetworkAddress: '', // 网元地址
      bussIpAddress: '', // 网元业务地址

      formLabelWidth: '120px',

      // 存创建初始化信息和复制初始化信息，传给子组件用
      createAndCopyInitList: {},
      createAndCopyTitle: '',
      updateInitList: {},
      deleteList: [],
      multipleSelection: [],
      beginItem: 1,
      endItem: 100,
      total: 100,
      currentPage: 1,
      pageSize: 100
    }
  },

  methods: {
    /**
     * @Description  : handleClick
     * @author       : ls
     * @date         : 2020/11/11 12:00
     * @param        :
     * @return       :
     */
    handleClick: function () {
      if (document.getElementById('rightMenu') !== null) {
        document.getElementById('rightMenu').style.display = 'none'
      }
    },
    handleContextmenu (row, column, event) {
      this.deviceDetailInfo = row
      this.updateInitList = row
      this.createAndCopyTitle = this.$t('DeviceConfigurationManagement.copyDeviceInfo')
      this.createAndCopyInitList = row
      this.updateConfigFileKey = row.deviceKey
      this.contextCommands = []
      var disableFlag = 0
      disableFlag = HelperUtil.handleDisa(disableFlag, this.deviceCollection[row.deviceKey], this.alarmCollection)
      this.flag = disableFlag
      this.contextCommands.push(this.showDeviceDetailsCommand)
      this.contextCommands.push(this.createAndCopyCommand)
      this.contextCommands.push(this.updateCommand)
      if (row.deviceModel.indexOf('CZ.T-T65D') !== -1) {
        this.contextCommands.push(this.downloadConfigToDeviceCommand)
        // this.contextCommands.push(this.updateProfileToDevice)
        this.contextCommands.push(this.copyConfigToServerInit)
        this.contextCommands.push(this.downloadToLocalCommand)
        this.contextCommands.push(this.downloadDeviceLogCommand)
      }
      // this.contextCommands.push(this.historyConfigToDeviceCommand)
      let menu = document.getElementById('rightMenu')
      let yy = document.body.clientHeight - event.clientY
      let xx = document.body.clientWidth - event.clientX
      console.log(event.clientX + ' ' + event.clientY)
      if (yy < 120) {
        menu.style.top = event.clientY - 100 + 'px'
      } else {
        menu.style.top = event.clientY + 'px'
      }
      if (xx < 200) {
        menu.style.left = event.clientX - 100 + 'px'
      } else {
        menu.style.left = event.clientX + 'px'
      }
      menu.style.display = 'block'
    },
    /**
     * @Description  : deviceTypeChange
     * @author       : ls
     * @date         : 2020/11/11 12:03
     * @param        :
     * @return       :
     */
    deviceTypeChange: function () {
      var a = HelperUtil.deviceTypeChange(this.deviceModelList, this.querySelectNetworkType, this.querySelectModel)
      this.deviceModelList1 = a[0]
      this.querySelectModel = a[1]
    },
    /**
     * @Description  : deviceModelChange
     * @author       : ls
     * @date         : 2020/11/11 12:06
     * @param        :
     * @return       :
     */
    deviceModelChange: function () {
      this.deviceModelList1 = this.deviceModelList
    },
    /**
       * @Description  : 分页变化
       * @author       : ls
       * @date         : 2020/5/6 15:44
       * @param        :
       * @return       :
       */
    handleCurrentChange (val) {
      this.currentPage = val
      this.beginItem = ((val - 1) * 100) + 1
      this.endItem = this.beginItem + 99
      if (this.endItem > this.total) {
        this.endItem = this.total
      }
      this.deviceByConditionCurrentPage()
    },
    /**
       * @Description  : 首次加载
       * @author       : ls
       * @date         : 2020/5/6 15:55
       * @param        :
       * @return       :
       */
    queryDevice: function () {
      this.beginItem = 1
      this.setSelectList()
      let _this = this
      let loadingInstance = _this.Loading.openLoading()
      DeviceService.queryDeviceTotalNumber(this.selectList).then(result => {
        _this.Loading.closeLoading(loadingInstance)
        _this.total = result
        if (_this.total === 0 || _this.total < 0) {
          _this.deviceList = []
        } else {
          if (_this.total < 100 && _this.total > 0) {
            _this.endItem = _this.total
          } else {
            _this.endItem = 100
          }
          _this.deviceByConditionCurrentPage()
        }
      }).catch(err => {
        _this.endItem = 100
        _this.Loading.closeLoading(loadingInstance)
        _this.InfoTip.errorTip(_this, err)
      })
    },
    /**
       * @Description  : 条件查询
       * @author       : ls
       * @date         : 2020/6/11 14:27
       * @param        :
       * @return       :
       */
    queryDeviceDataByCondition: function () {
      this.beginItem = 1
      this.setSelectList()
      this.queryDeviceTotalNumber()
    },
    /**
       * @Description  : 查询总页数
       * @author       : ls
       * @date         : 2020/5/6 16:01
       * @param        :
       * @return       :
       */
    queryDeviceTotalNumber: function () {
      let _this = this
      let loadingInstance = _this.Loading.openLoading()
      DeviceService.queryDeviceTotalNumber(_this.selectList).then(result => {
        _this.Loading.closeLoading(loadingInstance)
        _this.total = result
        if (_this.total === 0 || _this.total < 0) {
          _this.deviceList = []
          _this.InfoTip.warningTip_alarm(_this, HelperUtil.getCheckStatusCodeObjectByCode(_this.successCode.QUERY_NULL_CODE))
        } else {
          if (_this.total < 100 && _this.total > 0) {
            _this.endItem = _this.total
          } else {
            _this.endItem = 100
          }
          _this.InfoTip.successTip(_this, HelperUtil.getStatusCodeObjectByCode(_this.successCode.QUERY_CODE))
          _this.deviceByConditionCurrentPage()
        }
      }).catch(err => {
        _this.endItem = 100
        _this.Loading.closeLoading(loadingInstance)
        _this.InfoTip.errorTip(_this, err)
      })
    },
    /**
       * @Description  : 分页查询
       * @author       : ls
       * @date         : 2020/5/6 15:46
       * @param        :
       * @return       :
       */
    deviceByConditionCurrentPage: function () {
      let _this = this
      let loadingInstance = _this.Loading.openLoading()
      DeviceService.queryDeviceDataSplitNumber(this.beginItem, this.endItem, this.selectList).then(result => {
        // 成功
        _this.deviceList = Object.values(result)
        _this.Loading.closeLoading(loadingInstance)
      }).catch(err => {
        // 失败
        _this.Loading.closeLoading(loadingInstance)
        _this.InfoTip.errorTip(_this, err)
      })
    },
    /**
       * @Description  :获取全部网元信息
       * @author       ::
       * @date         :
       */
    getAllDeviceInit: function () {
      let _this = this
      DeviceService.getAllDeviceCollection().then(result => {
        // 成功
        _this.deviceList = Object.values(result)
      }).catch(err => {
        // 失败
        _this.InfoTip.errorTip(_this, err)
      })
    },

    /**
       * @Description  :增删改后调用，重新加载table
       * @author       :
       * @param        :
       * @return       :
       * @exception    :
       * @date         :
       */
    getAllDevice: function (vue) {
      let _this = this
      DeviceService.getAllDeviceCollection().then(result => {
        // 成功
        vue.deviceList = 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)
      })
    },
    /**
       * @Description  :主表格多选框改变时，将所选行进行保存
       * @author       :
       * @param        :
       * @return       :
       * @exception    :
       * @date         :
       */
    handleSelectionChange (val) {
      this.multipleSelection = val
    },
    /**
       * @Description  : 导入
       * @author       : ls
       * @date         : 2020/4/24 16:46
       * @param        :
       * @return       :
       */
    importToExcelInit: function () {
      this.importCommand.execute()
    },
    /**
       * @Description  : 设置条件
       * @author       : ls
       * @date         : 2020/5/1 17:08
       * @param        :
       * @return       :
       */
    setSelectList: function () {
      this.selectList = []
      if (this.querySelectNetworkName !== '' && this.querySelectNetworkName !== null) {
        this.selectList.push({
          quaryAttribute: 'displayName',
          compareSymbol: 'like',
          compareValue: this.querySelectNetworkName
        })
      }
      if (this.querySelectNetworkAddress !== null && this.querySelectNetworkAddress !== '') {
        this.selectList.push({
          quaryAttribute: 'ipAddress',
          compareSymbol: '=',
          compareValue: this.querySelectNetworkAddress
        })
      }
      if (this.bussIpAddress !== null && this.bussIpAddress !== '') {
        this.selectList.push({
          quaryAttribute: 'bussIpAddress',
          compareSymbol: '=',
          compareValue: this.bussIpAddress
        })
      }
      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
        })
      }
      if (this.querySelectSubnet !== '' && this.querySelectSubnet !== null) {
        this.selectList.push({
          quaryAttribute: 'subnetKey',
          compareSymbol: '=',
          compareValue: this.querySelectSubnet
        })
      }
      if (this.querySelectStationSite !== '' && this.querySelectStationSite !== null) {
        this.selectList.push({
          quaryAttribute: 'station',
          compareSymbol: '=',
          compareValue: this.querySelectStationSite
        })
      }
      if (this.querySelectNetworkStatus !== null && this.querySelectNetworkStatus !== '') {
        this.selectList.push({
          quaryAttribute: 'deviceStatus',
          compareSymbol: '=',
          compareValue: this.querySelectNetworkStatus
        })
      }
    },
    /**
       * @Description  : 导出
       * @author       : ls
       * @date         : 2020/4/24 16:46
       * @param        :
       * @return       :
       */
    exportToExcelInit: function () {
      let _this = this
      _this.setSelectList()
      let loadingInstance = _this.Loading.openLoading()
      DeviceService.downloadDeviceFile(_this.selectList).then(result => {
        // 关闭loading
        _this.Loading.closeLoading(loadingInstance)
        // 成功
      }).catch(err => {
        // 关闭loading
        _this.Loading.closeLoading(loadingInstance)
        // 失败
        _this.InfoTip.errorTip(_this, err)
      })
    },
    /**
       * @Description  : 查看详细
       * @author       : ls
       * @date         : 15:43
       * @param        :
       * @return       :
       */
    viewDetail: function (row) {
      this.deviceDetailInfo = row
      this.showDeviceDetailsCommand.execute()
    },
    /**
       * @Description  : chuangjian
       * @author       : ls
       * @date         : 2020/4/24 15:44
       * @param        :
       * @return       :
       */
    createDeviceInit () {
      this.createAndCopyTitle = this.$t('DeviceConfigurationManagement.createDeviceInfo')
      this.createAndCopyInitList = {
        'deviceKey': '',
        'uuid': '',
        'hostName': '',
        'displayName': '',
        'deviceTypeKey': '',
        'deviceModel': '',
        'subnetKey': '',
        'ipAddress': '',
        'bussIpAddress': '',
        'mac': '',
        'manageType': 0,
        'bussManageType': 0,
        'snmpVersion': 0,
        'snmpPort': 161,
        'trapPort': 162,
        'snmpGroup': 'publicCrscd',
        'ipmiUserName': '',
        'ipmiPassword': '',
        'deviceStatus': 0,
        'deviceVersion': '',
        'deviceDesc': '',
        'startTime': '',
        'firmwareKey': '',
        'firmwareFileName': '',
        'station': '',
        'locationName': '',
        'brand': '',
        'manufacturerLiaison': '',
        'manufacturerPhone': '',
        'manager': '',
        'managerPhone': '',
        'delFlag': 0,
        'modifyTime': ''
      }
      this.createAndCopyCommand.execute()
    },
    /**
       * @Description  : fuzhi
       * @author       : ls
       * @date         : 2020/4/24 15:10
       * @param        :
       * @return       :
       */
    copyDeviceInit (row) {
      this.createAndCopyTitle = this.$t('DeviceConfigurationManagement.copyDeviceInfo')
      this.createAndCopyInitList = row
      this.createAndCopyCommand.execute()
    },
    /**
       * @Description  : xiugai
       * @author       : ls
       * @date         : 2020/4/24 15:19
       * @param        :
       * @return       :
       */
    updateDeviceInit (row) {
      this.updateInitList = row
      this.updateCommand.execute()
    },
    /**
       * @Description  : 配置文件备份
       * @author       : ls
       * @date         : 2020/6/11 14:49
       * @param        :
       * @return       :
       */
    handleProfileAgain (row) {
      this.deleteList = []
      this.deleteList.push(row.deviceKey)
      let _this = this
      let loadingInstance = _this.Loading.openLoading()
      ConfigFileService.copyProfile(_this.deleteList).then(result => {
        _this.InfoTip.successTip(_this, HelperUtil.getStatusCodeObjectByCode(_this.successCode.OTHERS_CODE))
        _this.Loading.closeLoading(loadingInstance)
      }).catch(err => {
        _this.InfoTip.errorTip(_this, err)
        _this.Loading.closeLoading(loadingInstance)
      })
    },
    /**
       * @Description  : 配置文件更新
       * @author       : ls
       * @date         : 2020/6/11 15:51
       * @param        :
       * @return       :
       */
    handleUpdateProfile (row) {
      this.updateInitList = row
      this.updateProfileToDevice.execute()
    },
    /**
       * @Description  :上传配置信息初始化
       * @author       :
       * @param        :
       * @date         :
       */
    uploadConfigInit: function () {
      if (this.multipleSelection.length == 0) {
        this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.PLEASE_SELECT_AT_LEASE_ONE_CONFIGURATION_FILE_TO_UPLOAD))
      } else {
        //          上传配置信息
        this.$options.methods.uploadProfile(this)
      }
    },

    /**
       * @Description  :上传配置信息过程
       * @author       :
       * @param        :
       * @date         :
       */
    uploadProfile: function (vue) {
      // 开始上传到后台

      var selectList = new Array()
      for (var i = 0; i < vue.multipleSelection.length; i++) {
        selectList[i] = vue.multipleSelection[i]['deviceKey']
        console.log(vue.multipleSelection[i]['deviceKey'])
      }

      let _this = vue
      // 调用函数
      // 打开loading
      let loadingInstance = _this.Loading.openLoading()
      ConfigFileService.batchUploadConfigFile(selectList).then(result => {
        // 关闭loading
        _this.Loading.closeLoading(loadingInstance)
        // 成功
        _this.InfoTip.successTip(_this, HelperUtil.getStatusCodeObjectByCode(_this.successCode.OTHERS_CODE))
      }).catch(err => {
        // 关闭loading
        _this.Loading.closeLoading(loadingInstance)
        // 失败
        _this.InfoTip.errorTip(_this, err)
      })
    },

    /**
       * @Description  :第一步：更新配置信息初始化
       * @author       :
       * @param        :
       * @date         :
       */
    updateConfigInit: function () {
      if (this.multipleSelection.length == 0) {
        this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.PLEASE_SELECT_AT_LEASE_ONE_DEVICE_TO_UPDATE_CONFIGURATION))
      } else if (this.multipleSelection.length > 1) {
        this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.PLEASE_SELECT_ONLY_ONE_DEVICE_DATA_TO_UPDATE_THE_CONFIGURATION))
      } else {
        this.updateConfigFileKey = this.multipleSelection[0].deviceKey
        this.downloadConfigToDeviceCommand.execute()
      }
    },

    /**
       * @Description  :第一步：恢复配置信息初始化
       * @author       :
       * @param        :
       * @date         :
       */
    restoryConfigInit: function () {
      if (this.multipleSelection.length == 0) {
        this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.PLEASE_SELECT_AT_LEASE_ONE_DEVICE_TO_QUERY_CONFIGURATION_HISTORY))
      } else if (this.multipleSelection.length > 1) {
        this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.PLEASE_SELECT_ONLY_ONE_DEVICE_DATA_FOR_CONFIGURATION_HISTORY_QUERY))
      } else {
        this.updateConfigFileKey = this.multipleSelection[0].deviceKey
        this.historyConfigToDeviceCommand.execute()
      }
    },
    /**
       * @Description  :deviceStatusKey，转为显示deviceStatusName
       * @author       :
       */
    formatdeviceStatus: function (row, column) {
      let result = row.deviceStatus
      if (row.deviceStatus === 0) {
        result = this.$t('DeviceConfigurationManagement.inUse')
      }
      if (row.deviceStatus === 1) {
        result = this.$t('DeviceConfigurationManagement.notInUse')
      }
      return result
    },
    /**
       * @Description  : 时间处理
       * @author       : ls
       * @date         : 2020/5/21 11:46
       * @param        :
       * @return       :
       */
    formatTime: function (val) {
      return HelperUtil.timeTran(val.startTime)
    },
    /**
       * @Description  :
       * @author       :
       */
    formatsnmpPort: function (row, column) {
      //        for (var i = 0; i < this.deviceList.length; i++) {
      if (row.snmpPort == -999) {
        return ''
      }
      if (row.snmpPort != -999) {
        return row.snmpPort
      }

      //      }
    },
    /**
       * @Description  :
       * @author       :
       */
    formattrapPort: function (row, column) {
      //        for (var i = 0; i < this.deviceList.length; i++) {
      if (row.trapPort == -999) {
        return ''
      }
      if (row.trapPort != -999) {
        return row.trapPort
      }
    },

    /**
       * @Description  :snmpVersionKey，转为显示snmpVersionName
       * @author       :
       */
    formatsnmpVersion: function (row, column) {
      for (var j = 0; j < this.deviceSNMPList.length; j++) {
        if (row.snmpVersion == this.deviceSNMPList[j]['key']) {
          return this.deviceSNMPList[j]['label']
        }
      }
    },

    /**
       * @Description  :marster节点过滤
       * @author       :
       */
    formatMasterNode: function (row, colum) {
      let result = row.masterNode
      if (row.masterNode === 0) {
        result = this.$t('DeviceConfigurationManagement.yes')
      }
      if (row.masterNode === 1) {
        result = this.$t('DeviceConfigurationManagement.no')
      }
      return result
    },

    formatManageType: function (row, colum) {
      let result = row.manageType
      if (row.manageType === 0) {
        result = this.$t('DeviceConfigurationManagement.SNMP')
      }
      if (row.manageType === 1) {
        result = this.$t('DeviceConfigurationManagement.ping')
      }
      if (row.manageType === 2) {
        result = this.$t('DeviceConfigurationManagement.byStatus')
      }
      return result
    },
    /**
       * @Description  : 条件查询
       * @author       : ls
       * @date         : 16:41
       * @param        :
       * @return       :
       */
    queryDeviceByCondition: function () {
      let _this = this
      _this.setSelectList()
      let loadingInstance = _this.Loading.openLoading()
      DeviceService.conditionQueryDevice(_this.selectList).then(result => {
        // 关闭loading
        _this.Loading.closeLoading(loadingInstance)
        // 成功
        _this.deviceList = Object.values(result)
        if (_this.deviceList.length === 0) {
          _this.InfoTip.warningTip(_this, HelperUtil.getCheckStatusCodeObjectByCode(_this.successCode.QUERY_NULL_CODE))
        } else {
          _this.InfoTip.successTip(_this, HelperUtil.getStatusCodeObjectByCode(_this.successCode.QUERY_CODE))
        }
      }).catch(err => {
        // 关闭loading
        _this.Loading.closeLoading(loadingInstance)
        // 失败
        _this.InfoTip.errorTip(_this, err)
      })

      // }
    },

    /**
       * @Description  : shanchu
       * @author       : ls
       * @date         : 2020/4/24 15:48
       * @param        :
       * @return       :
       */
    deleteDeviceInit () {
      if (this.multipleSelection.length === 0) {
        this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.DELETE_SELECT_CODE))
      } else {
        this.deleteList = []
        for (var i = 0; i < this.multipleSelection.length; i++) {
          var obj = {'deviceKey': this.multipleSelection[i]['deviceKey']}
          this.deleteList.push(obj)
        }
        this.deleteCommand.execute()
      }
    },
    /**
       * @Description  : 下载日志
       * @author       : ls
       * @date         : 2020/4/24 15:52
       * @param        :
       * @return       :
       */
    downloadLog: function (row) {
      let _this = this
      let loadingInstance = this.Loading.openLoading()
      DeviceService.downloadDeviceLog(row.deviceKey).then(result => {
        // 关闭loading
        _this.Loading.closeLoading(loadingInstance)
        // 成功
        _this.InfoTip.successTip(_this, HelperUtil.getStatusCodeObjectByCode(_this.successCode.OTHERS_CODE))
      }).catch(err => {
        // 关闭loading
        _this.Loading.closeLoading(loadingInstance)
        // 失败
        _this.InfoTip.errorTip(_this, err)
      })
    },
    /**
       * @Description  :获取全部子网信息，
       * @author       :
       * @date         : 2018/12/13
       */
    getAllSubnet () {
      let _this = this
      SubnetService.getAllSubnetCollection().then(result => {
        // 成功
        _this.subnetList = Object.values(result)
      }).catch(err => {
        // 失败
        _this.InfoTip.errorTip(_this, err)
      })
    },
    /**
       * @Description  : 获取网元型号
       * @author       : ls
       * @date         : 2020/5/20 9:15
       * @param        :
       * @return       :
       */
    getAllDeviceModel: function () {
      let _this = this
      DeviceService.getAllDeviceModelCollection().then(result => {
        _this.deviceModelList = Object.values(result)
        _this.deviceModelList1 = Object.values(result)
      }).catch(err => {
        _this.InfoTip.errorTip(_this, err)
      })
    },
    /**
       * @Description  :由机房转入设备（已调通）
       * @author       : ly
       * @date         : 2018/12/21 20:55
       */
    TurnFromLocation: function (msg) {
      let _this = this
      var selectList = new Array()
      selectList.push({
        quaryAttribute: 'locationKey',
        compareSymbol: 'like',
        compareValue: msg
      })
      // 按条件查询
      DeviceService.conditionQueryDevice(selectList).then(result => {
        // 成功
        _this.deviceList = Object.values(result)
        if (_this.deviceList.length === 0) {
          _this.InfoTip.warningTip(_this, HelperUtil.getCheckStatusCodeObjectByCode(_this.successCode.QUERY_NULL_CODE))
        }
      }).catch(err => {
        // 失败
        _this.InfoTip.errorTip(_this, err)
      })
    },

    TurnFromCabinet: function (msg) {
      let _this = this
      var selectList = new Array()
      selectList.push({
        quaryAttribute: 'cabinetKey',
        compareSymbol: 'like',
        compareValue: msg
      })
      // 按条件查询
      DeviceService.conditionQueryDevice(selectList).then(result => {
        // 成功
        _this.deviceList = Object.values(result)
        if (_this.deviceList.length === 0) {
          _this.InfoTip.warningTip(_this, HelperUtil.getCheckStatusCodeObjectByCode(_this.successCode.QUERY_NULL_CODE))
        }
      }).catch(err => {
        // 失败
        _this.InfoTip.errorTip(_this, err)
      })
    },

    /**
       * @Description  :由子网转入设备
       * @author       : bjh
       * @param        :
       * @return       :
       * @exception    :
       * @date         : 2018/12/22 13:55
       */
    TurnFromSubnet: function (msg) {
      let _this = this
      var selectList = new Array()
      selectList.push({
        quaryAttribute: 'subnetKey',
        compareSymbol: 'like',
        compareValue: msg
      })
      // 按条件查询
      DeviceService.conditionQueryDevice(selectList).then(result => {
        // 成功
        _this.deviceList = Object.values(result)

        if (_this.deviceList.length === 0) {
          _this.InfoTip.warningTip(_this, HelperUtil.getCheckStatusCodeObjectByCode(_this.successCode.QUERY_NULL_CODE))
        }
      }).catch(err => {
        // 失败
        _this.InfoTip.errorTip(_this, err)
      })
    },

    clear: function () {
      this.querySelectNetworkName = ''
      this.querySelectlocationKey = null
      this.querySelectSubnet = null
      this.querySelectNetworkType = null
      this.querySelectNetworkStatus = null
      this.querySelectFrame = null
      this.querySelectNetworkAddress = ''
    }
  },
  // 初始化函数，加载数据
  created: function () {
    // 判断是否由机房、机架页面转入，是的话初始化执行条件查询，否则查询所有设备
    if (this.$route.query.locationKey != null) {
      this.querySelectlocationKey = this.$route.query.locationKey
      this.TurnFromLocation(this.$route.query.locationKey)
    }
    if (this.$route.query.cabinetKey != null) {
      this.querySelectlocationKey = this.$route.query.locationFromCabinet
      this.querySelectFrame = this.$route.query.cabinetKey
      this.TurnFromCabinet(this.$route.query.cabinetKey)
    }
    if (this.$route.query.subnetKey != null) {
      this.querySelectSubnet = this.$route.query.subnetKey
      this.TurnFromSubnet(this.$route.query.subnetKey)
    }
    if (this.$route.query.locationKey == null && this.$route.query.cabinetKey == null && this.$route.query.subnetKey == null) {
      // 获取所有设备信息
      // this.getAllDeviceInit()
      this.queryDevice()
    }
    // this.getAllDeviceInit()
    this.getAllSubnet()
    this.getAllDeviceModel()
    this.getAllDeviceType()
  },
  mounted () {
    document.addEventListener('click', this.handleClick)
  },

  computed: {
    showDeviceDetailsCommand () {
      return DeviceCommands.showDeviceDetailsCommand(this.deviceDetailInfo, this.commandContext)
    },
    createAndCopyCommand () {
      return DeviceCommands.createAndCopyDeviceCommand(this.createAndCopyTitle, this.createAndCopyInitList, this.commandContext)
    },
    deleteCommand () {
      return DeviceCommands.deleteDeviceCommand(this.deleteList, this.commandContext)
    },
    updateCommand () {
      return DeviceCommands.updateDeviceCommand(this.updateInitList, this.commandContext)
    },
    importCommand () {
      return DeviceCommands.importDeviceCommand(this.commandContext)
    },
    downloadConfigToDeviceCommand () {
      return DeviceCommands.downloadConfigToDeviceCommand(this.updateInitList, this.commandContext, this.flag)
    },
    updateProfileToDevice () {
      // 更新配置文件名称
      return ConfigFileCommands.updateConfigCommand(this.updateInitList, this.commandContext)
    },
    copyConfigToServerInit () {
      var copyList = []
      copyList.push(this.updateInitList.deviceKey)
      return DeviceCommands.copyConfigToServer(copyList, this.commandContext, this.flag)
    },
    downloadToLocalCommand () {
      return DeviceCommands.downloadToLocalCommand(this.updateInitList, this.commandContext, this.flag)
    },
    downloadDeviceLogCommand () {
      return DeviceCommands.downloadDeviceLogCommand(this.updateInitList, this.commandContext, this.flag)
    }
  },
  watch: {
    '$route' (to, from) {
      // 对路由变化作出响应...
      if (to.name === '网元配置' && to.query.locationKey !== undefined) {
        this.querySelectlocationKey = to.query.locationKey
        this.TurnFromLocation(to.query.locationKey)
      }
      if (to.name === '网元配置' && to.query.cabinetKey !== undefined) {
        this.querySelectlocationKey = to.query.locationFromCabinet
        this.querySelectFrame = to.query.cabinetKey
        this.TurnFromCabinet(to.query.cabinetKey)
      }
      if (to.name === '网元配置' && to.query.subnetKey !== undefined) {
        this.querySelectSubnet = to.query.subnetKey
        this.TurnFromSubnet(to.query.subnetKey)
      }
      if (to.path !== '/TheLayout/DeviceManagement') {
        document.getElementById('rightMenu').style.display = 'none'
      }
    },
    commandContext (newVal, oldVal) {
      if (JSON.stringify(newVal) === '{}') {
        this.clear()
        this.queryDevice()
        this.$refs.singleTable.clearSelection()
      }
      deep: true
    },
    '$i18n.locale' () {
      this.deviceStatusList[0].label = this.$t('DeviceConfigurationManagement.inUse')
      this.deviceStatusList[1].label = this.$t('DeviceConfigurationManagement.notInUse')
      this.deviceStatusList[2].label = this.$t('DeviceConfigurationManagement.unplanned')
      // this.deviceTypeList[0].deviceTypeName = this.$t('DeviceConfigurationManagement.traditional');
    }
  }

}
</script>

<style scoped>
  /*!* 外层布局容器样式 *!*/

  .el-table .warning-row {
    background: oldlace;
  }

  body .el-table colgroup.gutter {
    display: table-cell !important;
  }

  .el-table .current-row {
    background: #FF8040;
  }

</style>
