From f7ac77c7cc193502aff7e2a70f636253ada12386 Mon Sep 17 00:00:00 2001
From: 陶杰 <1378534974@qq.com>
Date: 星期二, 19 十一月 2024 10:14:52 +0800
Subject: [PATCH] 1.区域页面
---
src/views/screen1/itm.vue | 203 ++++++++++++++++++++++++++------------------------
1 files changed, 104 insertions(+), 99 deletions(-)
diff --git a/src/views/screen1/itm.vue b/src/views/screen1/itm.vue
index abdd525..895ef4e 100644
--- a/src/views/screen1/itm.vue
+++ b/src/views/screen1/itm.vue
@@ -83,17 +83,6 @@
</div>
</div>
</div>
- <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">
@@ -101,7 +90,7 @@
<span class="div2">个</span>
</div>
<div class="reg-desc">
- 交换机清单
+ 新增交换机
</div>
</div>
</div>
@@ -117,37 +106,15 @@
: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"
+
+ <el-table-column
+ prop="deviceNameDNS"
label="device name">
</el-table-column>
- <el-table-column
+ <!-- <el-table-column
prop="deviceNameDNS"
label="DNS">
- </el-table-column>
+ </el-table-column> -->
<el-table-column
prop="ipAddress"
label="ip address">
@@ -165,66 +132,53 @@
prop="switchType"
label="switch type">
</el-table-column>
+
+ <el-table-column
+ prop="cabinetName"
+ label="Cabinet Name">
+ <template slot-scope="scope">
+ <el-select v-model="scope.row.cabinetName" placeholder="请选择机柜" filterable clearable="" >
+ <el-option
+ v-for="item in cabinetList"
+ :key="item.id"
+ :label="item.name"
+ :value="item.id"
+ >
+ </el-option>
+ </el-select>
+ </template>
+ </el-table-column>
+
+ <el-table-column
+ prop="areaCode"
+ label="Area Code">
+ <template slot-scope="scope">
+ <el-select v-model="scope.row.areaCode" placeholder="请选择区域" filterable clearable="" >
+ <el-option
+ v-for="item in areaList"
+ :key="item.id"
+ :label="item.name"
+ :value="item.id"
+ >
+ </el-option>
+ </el-select>
+ </template>
+ </el-table-column>
+
+ <el-table-column
+ label="Operator">
+ <template slot-scope="scope">
+ <el-button
+ size="mini"
+ type="primary"
+
+ @click="handleConfirm(scope.row)">确认</el-button>
+ </template>
+ </el-table-column>
+
</el-table>
</el-dialog>
- <!-- 新增交换机弹窗 -->
-
- <el-dialog :visible.sync="showSwitchBoardInfoTableAdd" 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>
</div>
<div v-if="!chartclose" @click="closeself" class="chart-close"></div>
</div>
@@ -232,6 +186,7 @@
<script>
import itmEqu from "./components/chart-itm";
import itmLine from "./components/chart-itm-line";
+import {getSwitchBord,getAreaCode,AssignSwitch} from "@/api/area";
export default {
components: {itmEqu, itmLine},
@@ -240,22 +195,72 @@
chartclose: false,
switchDeviceStatus: {},
switchInfo: {},
- switchInfoAdd:{}
+ },
+ mounted(){
+ this.getSwitchBord()
+ this.getAreaCode()
},
data() {
return {
showSwitchBoardInfoTable: false,
- showSwitchBoardInfoTableAdd:false,
+ cabinetList:[],
+ areaList:[],
}
},
methods: {
+ async handleConfirm(row) {
+ // 检查必填项
+ if (!row.cabinetName || !row.areaCode) {
+ this.$message.error('交换机柜名和区域代码不能为空');
+ return;
+ }
+
+ let confirmRes= await this.$confirm('确认提交吗？', '提示', {
+ confirmButtonText: '确定',
+ cancelButtonText: '取消',
+ type: 'warning'
+ })
+
+ if(confirmRes=="confirm"){
+ let deviceInfo = {
+ deviceInfo: {
+ cabinetName: row.cabinetName,
+ switchName: row.deviceNameDNS,
+ port: row.nasPort,
+ macAddress: row.macAddress,
+ ipAddress: row.ipAddress,
+ areaCode: row.areaCode,
+ }
+ };
+
+ let res= await AssignSwitch(deviceInfo)
+
+ if(res.isSuccess){
+ this.showSwitchBoardInfoTable=false
+ this.$emit("refresh", "")
+ }
+
+ }
+ },
closeself() {
this.$emit("show", false);
},
showSwitchBoard(){
this.$router.push({path: "/switch-board"});
// this.$router.push({path: "/area", query: {code: '01'}});
- }
+ },
+
+ getSwitchBord(){
+ getSwitchBord().then((res) => {
+ this.cabinetList = res.cabinetList || [];
+ });
+ },
+
+ getAreaCode(){
+ getAreaCode().then((res) => {
+ this.areaList = res.cabinetList || [];
+ });
+ },
},
};
</script>
--
Gitblit v1.9.3