From 9d8b830b1bc0ff91d86b718e4cdef53367496cc3 Mon Sep 17 00:00:00 2001
From: 陶杰 <1378534974@qq.com>
Date: 星期五, 29 十一月 2024 13:33:39 +0800
Subject: [PATCH] 1.背景图url变换
---
src/views/screen1/itm.vue | 176 +++++++++++++++++++++++++++++++++++++++++++++-------------
1 files changed, 135 insertions(+), 41 deletions(-)
diff --git a/src/views/screen1/itm.vue b/src/views/screen1/itm.vue
index 2da3906..d748dc8 100644
--- a/src/views/screen1/itm.vue
+++ b/src/views/screen1/itm.vue
@@ -44,21 +44,21 @@
<div class="flex1 reg-img-service">
<div class="reg-img-2-1"></div>
<div class="reg-num flex">
- <span class="div1">{{ switchDeviceStatus['1'] && switchDeviceStatus['1'].online || 0 }}</span>
+ <span class="div1">{{ switchDeviceStatus['3'] && switchDeviceStatus['3'].online || 0 }}</span>
<span class="div2">个</span>
</div>
<div class="reg-desc">
- Online
+ 从无到有
</div>
</div>
<div class="flex1 reg-img-service">
<div class="reg-img-2-2"></div>
<div class="reg-num flex">
- <span class="div1">{{ switchDeviceStatus['1'] && switchDeviceStatus['1'].offline || 0 }}</span>
+ <span class="div1">{{ switchDeviceStatus['3'] && switchDeviceStatus['3'].offline || 0 }}</span>
<span class="div2">个</span>
</div>
<div class="reg-desc">
- Offline
+ 从有到无
</div>
</div>
</div>
@@ -83,7 +83,7 @@
</div>
</div>
</div>
- <div class="itm-container container-alert" style="cursor: pointer;margin-top: 3rem" @click="showSwitchInfoTable=true">
+ <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,61 +94,93 @@
</div>
</div>
</div>
- <el-dialog :visible.sync="showSwitchInfoTable" title="新增交换机" append-to-body>
+ <div class="itm-container container-alert" style="cursor: pointer;margin-top: 1rem" @click="showSwitchBoard">
+ <div class="flex1">
+ <div class="reg-desc">
+ 交换机机柜
+ </div>
+ </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
+ 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">
+ label="Ip Address"
+ width="150"
+ >
</el-table-column>
<el-table-column
width="180"
prop="macAddress"
- label="mac address">
+ label="Mac Address">
</el-table-column>
<el-table-column
prop="nasPort"
- label="nas port">
+ label="Nas Port">
</el-table-column>
<el-table-column
prop="switchType"
- label="switch type">
+ label="Switch Type">
</el-table-column>
+
+ <el-table-column
+ prop="cabinetName"
+ label="Cabinet Name" width="150">
+ <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>
+
</div>
<div v-if="!chartclose" @click="closeself" class="chart-close"></div>
</div>
@@ -156,6 +188,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},
@@ -165,14 +198,75 @@
switchDeviceStatus: {},
switchInfo: {},
},
+ mounted(){
+ this.getSwitchBord()
+ this.getAreaCode()
+ },
data() {
return {
- showSwitchInfoTable: false,
+ showSwitchBoardInfoTable: false,
+ cabinetList:[],
+ areaList:[],
}
},
methods: {
+ async handleConfirm(row) {
+ // 检查必填项
+ if (!row.cabinetName || !row.areaCode) {
+ this.$message.error('交换机柜名和区域代码不能为空');
+ return;
+ }
+
+ // if (!row.cabinetName) {
+ // 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 || [];
+ });
},
},
};
@@ -227,7 +321,7 @@
border-radius: 0.83rem;
padding: 2.5rem;
margin-top: 2rem;
- height: 53.5rem;
+ height: 58.5rem;
padding-top: 1rem;
}
@@ -292,7 +386,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),
--
Gitblit v1.9.3