<template>
  <div id="main" class="h-all">
    <el-container class="h-all">
      <el-header height="auto">
        <!-- 网元管理页面 -->
        <!-- 通用工具栏 -->
        <div class="header-button-box">
          <!-- <el-button
            class="btnstyle"
          size="mini"
            type="primary"
            v-if="createAndCopyCommand.visible"
            @click="createDeviceInit"
          >
            {{ $t("common.createBtn")}}
          </el-button> -->
          <el-button
           class="btnstyle" 
          size="mini"
            type="primary"
            @click="exportToExcelInit"
          >
            {{ $t("common.exportBtn") +'列表'}}
          </el-button>
        </div>
        <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-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="small"
              :placeholder="$t('common.placeholder')"
              v-model="querySelectNetworkName"
              clearable
            ></el-input>
          </div>
          <div class="search-input-box">
            <label>{{ $t("DeviceConfigurationManagement.ipAddress2") }}：</label>
            <el-input
              size="small"
              :placeholder="$t('common.placeholder')"
              v-model="querySelectNetworkAddress"
              clearable
            >
            </el-input>
          </div>
          <!-- <div class="search-input-box">
            <label
              >{{ $t("DeviceConfigurationManagement.bussIpAddress") }}：</label
            >
            <el-input
              size="small"
              :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="small"
              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="small"
              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='small':placeholder="$t('common.placeholder')" v-model="querySelectlocationKey" clearable></el-input>-->
          </div>
          <div class="search-input-box">
            <!-- <label
              >{{ $t("DeviceConfigurationManagement.stationSite") }}：</label
            > -->
              <label
              >{{ $t("DeviceConfigurationManagement.controlNode") }}：</label
            >
            <el-input
              size="small"
              :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="small"
              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="small"
              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>
         <div class="header-button-box">
  <!-- 查询 -->
        
            <el-button
            class="btnstyle"
              size="mini"
              
              type="primary"
              @click="queryDeviceDataByCondition"
            >
              {{ $t("common.queryBtn") }}
            </el-button>
          
          <!-- 重置 -->
           
            <el-button
             class="btnstyle"
              size="mini"
              type="primary"
              @click="reset()"
            >
              {{ $t("common.reset") }}
            </el-button>
          <br>
          <!-- 删除 -->
          <!-- <el-button
           class="btnstyle"
            size="mini"
          
            :disabled="multipleSelection.length ? false : true"
            :type="multipleSelection.length ? 'primary' : 'info'"
            v-if="deleteCommand.visible"
            @click="deleteDeviceInit"
            >{{ $t("common.deleteBtn") }}
          </el-button> -->
 </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"
            :header-cell-style="{ textAlign: 'center' }"
          :cell-style="{ textAlign: 'center' }"
          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="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="controlMode"
            width="80px"
            :label="$t('DeviceConfigurationManagement.controlMode')"
          >
          </el-table-column>
          <!-- 所属管控节点 -->
          <el-table-column
            prop="station"
            width="100"
            :label="$t('DeviceConfigurationManagement.controlNode')"
          >
          </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>
          <!-- MAC -->
          <el-table-column
            prop="mac"
            width="100px"
            :label="$t('DeviceConfigurationManagement.mac')"
            style="font-size: 10px"
          >
         
          </el-table-column>
          <!-- 网元地址 -->
          <!-- <el-table-column
            prop="ipAddress"
            width="115px"
            :label="$t('DeviceConfigurationManagement.ipAddress')"
          >
         
          </el-table-column> -->
          <!-- ip地址 上为网元地址,下为业务ip地址-->
          <el-table-column
         
            prop="ipAddress,bussIpAddress"
            width="115px"
            :label="$t('DeviceConfigurationManagement.ipAddress2')"
          >
           <template slot-scope="scope">
            {{scope.row.ipAddress}}<br>{{scope.row.bussIpAddress}}
          </template>
          </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
            width="200"
            
            :label="$t('DeviceConfigurationManagement.caozuo')"
            show-overflow-tooltip="true"
          >
          <el-button type="text" @click="lookinfo()">查看详情</el-button>
          <!-- <el-button type="text"  @click="deleteDeviceInit">shanchu</el-button> -->

          </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> 
    <v-vwyxq :obj="obj"></v-vwyxq>
  </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";
import vwyxq from "./components/wyxq.vue";
import {EventBus} from "../../domain/EventBus"
export default {
  components: {
    CommandExecuteContext,
   vwyxq
  },
  name: "DeviceManagement",
  props: ["deviceCollection", "alarmCollection"],
  data: function () {
  
    // 存放 数据
    return { 
    //假数据 
    obj:{
      isTrue:false
    },
    deviceList123:[
      {displayName:"172.2.11.10",
        deviceTypeName:"交换机",
        deviceModel:"s5720",
        controlMode:'2',
        station:"八楼",
        uuid:"16485181518615165fs41685481",
        mac:"123.456",
        ipAddress:"123.123.12",
        bussIpAddress:"168.168.12",
        deviceStatus:"再用",
        deviceVersion:"1.0.1",
        startTime:"20210406.141726",
        deviceDesc:"描述信息styleffvnjsfglhflsdhjsdbvfhslvlfsdbghgreilfvdvsnvnzx,cvajlkjdsnvksnvszcv hajkfdsvbhj bxvkas",
      },
       {displayName:"172.2.11.10",
        deviceTypeName:"交换机",
        deviceModel:"s5720",
        controlMode:'2',
        station:"八楼",
        uuid:"16485181518615165fs41685481",
        mac:"123.456",
        ipAddress:"123.123.12",
        bussIpAddress:"168.168.12",
        deviceStatus:"再用",
        deviceVersion:"1.0.1",
        startTime:"20210406.141726",
        deviceDesc:"描述信息",
      },
       {displayName:"172.2.11.10",
        deviceTypeName:"交换机",
        deviceModel:"s5720",
        controlMode:'2',
        station:"八楼",
        uuid:"16485181518615165fs41685481",
        mac:"123.456",
        ipAddress:"123.123.12",
        bussIpAddress:"168.168.12",
        deviceStatus:"再用",
        deviceVersion:"1.0.1",
        startTime:"20210406.141726",
        deviceDesc:"描述信息",
      }
    ],
      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: {
    lookinfo(){
      this.obj.isTrue=true
console.log(this.showDeviceDetailsCommand);
  EventBus.$emit("is", this.isTrue);
console.log(this.obj.isTrue);

    },
    /**
     * @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";
      console.log(this.contextCommands);
      console.log(this.deviceDetailInfo);
    },
    /**
     * @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();
      console.log(this.deviceList);
    },
    //重置
        reset(){
           //  查询条件变量
      this.querySelectNetworkName= "", // 网元名称"
      this.querySelectNetworkType= "", // 网元类型"
      this.querySelectModel= "", // 网元型号
      this.querySelectStationSite= "", // 所属站点
      this.querySelectIpNetworkSegment= "", // Ip网段"
      this.querySelectNetworkStatus= null, // 网元状态"
      this.querySelectSubnet= null, // 所属子网"
      this.querySelectNetworkAddress= "", // 网元地址
      this.bussIpAddress= "" // 网元业务地址
      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);
          console.log(_this.deviceList);
        })
        .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();
      }
    },
    //   deleteDeviceInit(val) {
    //  this.deleteList=val;
    //     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,
        
      );
      console.log(this.deviceDetailInfo)
    },
    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;
}
.btnstyle {
  
  height: 36px;
  width: 106px;
}
</style>