hanbaoshan
2020-10-15 355de6d28489e9ff3d17138575c2fef32266930e
src/pages/settings/components/ClusterManagement.vue
@@ -100,16 +100,19 @@
          </el-form>
        </div>
      </el-col>
      <el-col :span="12" style="height: 100%;" v-if="members.length !== 0">
      <el-col :span="12" style="height: 100%;" v-if="members.length !== 0 && isSearch" class="node-container">
        <serfDiagram
          ref="diagram"
          :members="members"
          :searchNodes="nodes"
          :agent="agentName"
          v-loading="loading"
          @selected-node="joinNode"
          class="nodes-svg"
        ></serfDiagram>
      </el-col>
      <el-col :span="12" style="height: 100%;" v-if="innerNodes.length !== 0 && !isSearch" class="node-container">
        <cloud-node :nodes="innerNodes">
        </cloud-node>
      </el-col>
    </el-row>
@@ -189,14 +192,15 @@
import {
  getDevInfo
} from "@/api/system";
import cloudNode from "./CloudNode";
import serfDiagram from "@/components/serfDiagram";
import ipInput from "@/components/subComponents/IPInput";
import {isIPv4} from "@/scripts/validate";
export default {
  components: {
    serfDiagram,
    ipInput
    ipInput,
    cloudNode
  },
  data() {
    const checkPwd = (rule, value, callback) => {
@@ -268,13 +272,14 @@
      esNodes: [],
      scheduleId: "",
      isHasColony: false,
      isSearch: false,
      currentCluster: {},
      searchNum: "",
      loading: false,
      searchDis: false,
      agentName: "",
      members: [],
      nodes: [],
      innerNodes: [],
    };
  },
  mounted() {
@@ -372,6 +377,7 @@
      }
    },
    async searchColony() {
      this.isSearch = true;
      this.$refs["joinForm"].validate(valid => {
        if (valid) {
          this.members = [];
@@ -389,10 +395,12 @@
            .catch(() => {
              this.searchDis = false;
              this.loading = false;
              this.isSearch = false;
            });
        } else {
          this.searchDis = false;
          this.loading = false;
          this.isSearch = false;
          return false;
        }
      });
@@ -429,8 +437,7 @@
            return element.node_id === i.node_id;
          });
          if (found === undefined) {
            //this.members.push(i);
            this.nodes.push(i);
            this.members.push(i);
          }
        });
      }
@@ -475,8 +482,9 @@
          this.ruleForm.clustername = res.data.clusterName;
          this.ruleForm.clusterpwd = res.data.clusterpwd
          this.ruleForm.virtualIp = res.data.virtualIp
          let list = res.data.nodes.map(i => {
            debugger
          //let list = res.data.nodes.map(i => {
          this.isSearch = false;
          this.innerNodes = res.data.nodes.map(i => {
            let obj = {};
            obj.device_type = i.device_type;
            obj.workType = i.device_type.substr(2,2);
@@ -492,7 +500,8 @@
            obj.role = i.role ? i.role : "pc";
            return obj;
          });
          this.members = this.members.concat(list);
          //this.members = this.members.concat(list);
          console.log(this.members)
        } else {
          this.isHasColony = false;
@@ -550,6 +559,7 @@
          this.isHasColony = false;
          this.activeName = "1";
          this.members = [];
          this.innerNodes = [];
        }
      }).catch(() => { });
@@ -778,6 +788,6 @@
  line-height: 30px;
}
.nodes-svg{
  background-color: rgba(127, 255, 212, 0.459);
  background-color: rgba(127, 172, 255, 0.459);
}
</style>