From 85da22c4861736f7b0cabbc75daecbe4fea1bf80 Mon Sep 17 00:00:00 2001
From: heyujie <516346543@qq.com>
Date: 星期日, 04 七月 2021 21:01:12 +0800
Subject: [PATCH] 周天更改
---
src/pages/settings/components/CloudNode.vue | 69 +++++++++++++++++++++++++++++-----
1 files changed, 59 insertions(+), 10 deletions(-)
diff --git a/src/pages/settings/components/CloudNode.vue b/src/pages/settings/components/CloudNode.vue
index c285ab4..e99063f 100644
--- a/src/pages/settings/components/CloudNode.vue
+++ b/src/pages/settings/components/CloudNode.vue
@@ -20,18 +20,20 @@
ref="inside-nodes"
:members="insideNodes"
:agent="agentName"
- :sizeX="400"
- :sizeY="330"
+ :sizeX="insideSizeX"
+ :sizeY="insideSizeY"
+ :startX="insideStartX"
+ :isShowHover="true"
class="inside-nodes"
></serfDiagram>
</div>
</div>
- <div class="outer">
+ <div class="outer" v-if="outsideNodes.length">
<serfDiagram
ref="outer-nodes"
:members="outsideNodes"
:agent="agentName"
- :sizeX="230"
+ :sizeX="280"
:sizeY="370"
:startX="60"
class="outer-nodes"
@@ -131,10 +133,47 @@
nodeName: "kfl20.15-127586",
role: 'master'
},
+ {
+ cluster_id: "b6132bfe-d3af-710-ba89-436f614cf",
+ hardwareType: "02",
+ id: "DSVAD0101201906",
+ node_id: "DSVAD001209063",
+ node_ip: "192.168.20.10:30190",
+ nodeName: "k20.15-128437586",
+ role: 'master'
+ },
+ {
+ cluster_id: "b612bfe-d3af-710-ba89-436f614cf",
+ hardwareType: "02",
+ id: "DSVAD01010906",
+ node_id: "DSVAD012063",
+ node_ip: "192.168.20.107:30190",
+ nodeName: "kfl20.15-127586",
+ role: 'master'
+ },
+ {
+ cluster_id: "b6132bfe-d3af-710-ba89-436f614cf",
+ hardwareType: "02",
+ id: "DSVAD0101201906",
+ node_id: "DSVAD0012063",
+ node_ip: "192.168.20.10:30190",
+ nodeName: "k20.15-128437586",
+ role: 'master'
+ },
+ {
+ cluster_id: "b612bfe-d3af-710-ba89-436f614cf",
+ hardwareType: "02",
+ id: "DSVAD01010906",
+ node_id: "DSVAD01012063",
+ node_ip: "192.168.20.107:30190",
+ nodeName: "kfl20.15-127586",
+ role: 'master'
+ },
]
}
},
mounted () {
+ console.log(this.nodes)
//this.getInsideNodes();
},
methods: {
@@ -148,7 +187,7 @@
getInsideNodes () {
//return this.nodes.filter(item=>item.hardwareType=='01'||item.hardwareType=='02');
//return this.mockData.filter(item => item.hardwareType == '01' || item.hardwareType == '02');
- let arr = this.mockData.filter(item => item.hardwareType == '01' || item.hardwareType == '02');
+ let arr = this.nodes.filter(item => item.hardwareType == '01' || item.hardwareType == '02');
let len = arr.length;
let lefts = [];
let tops = [];
@@ -175,6 +214,15 @@
insideNodes () {
return this.nodes.filter(item => item.hardwareType == '01' || item.hardwareType == '02');
},
+ insideSizeX () {
+ return 160 + 200 * 0.2 * (this.insideNodes.length) <= 400 ? 160 + 200 * 0.2 * (this.insideNodes.length) : 400;
+ },
+ insideSizeY () {
+ return 140 + 200 * 0.2 * (this.insideNodes.length) <= 380 ? 140 + 200 * 0.2 * (this.insideNodes.length) : 380;
+ },
+ insideStartX () {
+ return this.insideSizeX / 3
+ },
// insideNodes () {
// //return this.nodes.filter(item=>item.hardwareType=='01'||item.hardwareType=='02');
// //return this.mockData.filter(item => item.hardwareType == '01' || item.hardwareType == '02');
@@ -196,8 +244,8 @@
// return temp;
// },
outsideNodes () {
- //return this.nodes.filter(item=>item.hardwareType=='03');
- return this.mockData.filter(item => item.hardwareType == '03');
+ return this.nodes.filter(item=>item.hardwareType=='03');
+ //return this.mockData.filter(item => item.hardwareType == '03');
}
}
}
@@ -205,15 +253,15 @@
<style lang="scss">
.cloud {
width: 100%;
- height: 500px;
display: flex;
.inner {
- background: url('/images/settings/cloud.png') no-repeat;
+ background: url('/images/settings/easy-cloud.png') no-repeat;
background-size: 100%;
+ margin-top: -80px;
.rect {
//background: rgba(176, 203, 253, 0.3);
position: relative;
- margin: 100px;
+ margin: 130px 100px 100px;
.node {
position: absolute;
.node-icon {
@@ -230,6 +278,7 @@
.outer {
width: 40%;
position: relative;
+ text-align: left;
.node {
position: absolute;
}
--
Gitblit v1.8.0