1.交换机引导页面

陶杰

2024-11-14 0967b9f3ddaaf901a68d78edb7a80df0245425bd

 src/views/screen1/itm.vue

@@ -83,7 +83,18 @@
          </div>
        </div>
      </div>
      <div class="itm-container container-alert" style="cursor: pointer;margin-top: 3rem" @click="showSwitchBoardInfoTable=true">
      <div class="itm-container container-alert" style="cursor: pointer;margin-top: 1rem" @click="showSwitchBoardInfoTableAdd=true">
        <div class="flex1">
          <div class="reg-num flex">
            <span class="div1">{{ switchInfo.switchInfo && switchInfo.switchInfo.length || 0 }}</span>
            <span class="div2">个</span>
          </div>
          <div class="reg-desc">
           新增交换机
          </div>
        </div>
      </div>
      <div class="itm-container container-alert" style="cursor: pointer;margin-top: 1rem" @click="showSwitchBoardInfoTable=true">
        <div class="flex1">
          <div class="reg-num flex">
            <span class="div1">{{ switchInfo.switchInfo && switchInfo.switchInfo.length || 0 }}</span>
@@ -94,7 +105,7 @@
          </div>
        </div>
      </div>
      <div class="itm-container container-alert" style="cursor: pointer;margin-top: 3rem" @click="showSwitchBoard">
      <div class="itm-container container-alert" style="cursor: pointer;margin-top: 1rem" @click="showSwitchBoard">
        <div class="flex1">
          <div class="reg-desc">
            交换机机柜
@@ -102,6 +113,64 @@
        </div>
      </div>
      <el-dialog :visible.sync="showSwitchBoardInfoTable" title="交换机清单" append-to-body>
        <el-table
            :data="switchInfo.lackSwitchInfo||[]"
            border
            style="width: 100%;max-height: 650px;overflow-y: scroll">
<!--          <el-table-column-->
<!--              fixed-->
<!--              label="index"-->
<!--              width="80"-->
<!--              type="index">-->
<!--          </el-table-column>-->
<!--          <el-table-column-->
<!--              prop="assetName"-->
<!--              label="asset name">-->
<!--          </el-table-column>-->
<!--          <el-table-column-->
<!--              prop="clentSiteCode"-->
<!--              label="clent site code"-->
<!--          >-->
<!--          </el-table-column>-->
<!--          <el-table-column-->
<!--              prop="createdTime"-->
<!--              label="created time">-->
<!--          </el-table-column>-->
<!--          <el-table-column-->
<!--              prop="dateTimeConnected"-->
<!--              label="connected datetime">-->
<!--          </el-table-column>-->
          <el-table-column
              prop="deviceName"
              label="device name">
          </el-table-column>
          <el-table-column
              prop="deviceNameDNS"
              label="DNS">
          </el-table-column>
          <el-table-column
              prop="ipAddress"
              label="ip address">
          </el-table-column>
          <el-table-column
              width="180"
              prop="macAddress"
              label="mac address">
          </el-table-column>
          <el-table-column
              prop="nasPort"
              label="nas port">
          </el-table-column>
          <el-table-column
              prop="switchType"
              label="switch type">
          </el-table-column>
        </el-table>
      </el-dialog>

      <!-- 新增交换机弹窗 -->

      <el-dialog :visible.sync="showSwitchBoardInfoTableAdd" title="新增交换机" append-to-body>
        <el-table
            :data="switchInfo.lackSwitchInfo||[]"
            border
@@ -171,10 +240,12 @@
    chartclose: false,
    switchDeviceStatus: {},
    switchInfo: {},
    switchInfoAdd:{}
  },
  data() {
    return {
      showSwitchBoardInfoTable: false,
      showSwitchBoardInfoTableAdd:false,
    }
  },
  methods: {
@@ -303,7 +374,7 @@
  }

  .itm-container {
    padding: 2rem;
    padding: 1rem;
    margin-top: 2rem;
    background: #e9f4fd;
    box-shadow: 0.5rem 0.33rem 2rem 0rem rgba(198, 212, 228, 0.38),