zhangzengfei
2020-10-16 f79c0703617d25dbb6328dd58e4f693d3d2809c4
src/pages/settings/components/ClusterManagement.vue
@@ -100,7 +100,7 @@
          </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"
@@ -109,6 +109,10 @@
          @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>
@@ -188,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) => {
@@ -267,17 +272,18 @@
      esNodes: [],
      scheduleId: "",
      isHasColony: false,
      isSearch: false,
      currentCluster: {},
      searchNum: "",
      loading: false,
      searchDis: false,
      agentName: "",
      members: []
      members: [],
      innerNodes: [],
    };
  },
  mounted() {
    this.findCluster();
    this.getVrrpInfo();
    this.getEsClusterNodes();
  },
  methods: {
@@ -290,7 +296,6 @@
    submitForm(formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          debugger
          //alert("submit!");
          let json = {
            clusterId: this.clusterid,
@@ -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;
        }
      });
@@ -409,6 +417,7 @@
        this.stopSearch();
      }, 10 * 1000);
    },
    //搜索集群
    async getSearchNodes() {
      let res = await getSearchNodes();
      if (res && res.success) {
@@ -473,10 +482,13 @@
          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);
            obj.hardwareType = i.device_type.substr(4,2);
            obj.cluster_id = i.cluster_id;
            obj.clusterName = res.data.clusterName;
            obj.create_time = i.create_time;
@@ -488,7 +500,9 @@
            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;
          // this.activeName = '1'
@@ -545,11 +559,13 @@
          this.isHasColony = false;
          this.activeName = "1";
          this.members = [];
          this.innerNodes = [];
        }
      }).catch(() => { });
    },
    joinNode(event, node) {
      debugger
      this.currentCluster.cluster_id = node.cluster_id;
      if (this.activeName === "3") {
        this.manageForm.clustername = node.clusterName;
@@ -695,14 +711,9 @@
      this.ruleForm.virtualIp = ip;
      console.log(this.ruleForm.virtualIp)
    }
  },
  mounted () {
    this.findCluster();
  },
  created () { }
};
@@ -777,6 +788,6 @@
  line-height: 30px;
}
.nodes-svg{
  background-color: aquamarine;
  background-color: rgba(127, 172, 255, 0.459);
}
</style>