控制轮询

ZZJ

2022-07-15 a3f357e8a60443b74b64c7479113c68eb35ce1f5

 src/pages/settings/views/clusterManagement.vue

@@ -206,6 +206,7 @@
            </el-form-item>

          </el-form>

          <div class="clu-list">

            <!-- :class="pickedNodeI == index ? 'clu-item-active' : ''" -->

            <div

              class="clu-item"

              v-for="(item, index) in members"

@@ -245,20 +246,20 @@
export default {

  data() {

    const checkPwd = (rule, value, callback) => {

      if (!value) {

      if (value == "") {

        return callback(new Error("密码不能为空"));

      }

      setTimeout(() => {

        if (value.length != 6) {

          callback(new Error("密码应为6位!"));

        } else {

          callback();

        }

      }, 1000);

      // setTimeout(() => {

      if (value.length != 6) {

        callback(new Error("密码应为6位!"));

      } else {

        callback();

      }

      // }, 1000);

    };

    const checkID = (rule, value, callback) => {

      if (!value) {

        return callback(new Error("密码不能为空"));

        return callback(new Error("ID不能为空"));

      }

    };

    return {

@@ -302,13 +303,13 @@
        clustername: [

          { required: true, message: "请输入集群名称", trigger: "blur" },

        ],

        clusterpwd: [{ validator: checkPwd, required: true }],

        clusterpwd: [{ validator: checkPwd, required: true, trigger: "blur" }],

        virtualIp: [{ required: true, validator: isIPv4, trigger: "change" }],

      },

      joinExistRules: {

        clusterid: [{ validator: checkID, trigger: "blur" }],

        clusterip: [{ validator: isIPv4, trigger: "blur" }],

        clusterpwd: [{ validator: checkPwd, required: true }],

        clusterpwd: [{ validator: checkPwd, required: true, trigger: "blur" }],

      },

    };

  },

@@ -328,7 +329,55 @@
  },

  methods: {

    pickNode(index) {

      // this.pickedNodeI=index

      this.pickedNodeI = index;

      const node = this.members[index];

      const h = this.$createElement;

      // Address: "192.168.20.189:30190"

      // cluster_id: "5ee1dfa8-e3fb-4d62-8692-388d7632859b"

      // create_time: ""

      // id: "DSVAD010120190703"

      // nodeName: "192.168.20.189:30190"

      // node_id: "DSVAD010120190703"

      // role: "pc"

      this.$msgbox({

        title: "",

        message: h(

          "div",

          {

            style:

              "display: flex;  flex-direction: column; justify-content: center; align-items: center;",

          },

          [

            h("span", { class: "icon iconfont warn-icon" }, "\ue71c"),

            h("span", { class: "warn-title" }, "加入集群"),

            h(

              "span",

              { class: "warn-dec" },

              `您是否要加入 ${node.Address} 吗？`

            ),

          ]

        ),

        showCancelButton: true,

        showClose: true,

        confirmButtonText: "确定",

        cancelButtonText: "取消",

        customClass: "del-account-message-box",

      }).then(() => {

        this.joinLoading = true;

        let data = {

          clusterId: node.cluster_id,

          password: this.joinForm.clusterpwd,

          nodeIps: [node.Address],

        };

        this.joinCluster(data)

          .then(() => {

            this.joinLoading = false;

            this.findCluster();

          })

          .catch((e) => {

            this.joinLoading = false;

          });

      });

    },

    async createCluster(json) {

      let res = await createSerfCluster(json);

@@ -379,10 +428,6 @@
      this.$refs[formName].validate((valid) => {

        if (valid) {

          _this.joinLoading = true;

          // let nodeIps = _this.members.map((i) => {

          //   return i.Address;

          // });

          debugger;

          let data = {

            clusterId: _this.joinForm.clusterid,

            password: _this.joinForm.clusterpwd,

@@ -497,6 +542,8 @@
    },

    exitCluster() {

      const h = this.$createElement;

      let res = {};



      this.$msgbox({

        title: "",

        message: h(

@@ -517,20 +564,33 @@
        cancelButtonText: "取消",

        customClass: "del-account-message-box",

      }).then(

        // () => {

        //   this.showCurCluster = false;

        // }

        async () => {

          let res = await leave();

          this.$notify({

            title: res.success ? "成功" : "失败",

            message: res.msg,

            type: res.success ? "success" : "error",

          });

          if (res && res.success) {

            clearInterval(this.intervalTimer);

            this.showCurCluster = false;

            this.ruleForm.virtualIp = "";

            this.ruleForm.clustername = "";

            this.ruleForm.clusterpwd = "";

            this.clusterid = "";

          try {

            res = await leave();

            if (res && res.success) {

              clearInterval(this.intervalTimer);

              this.showCurCluster = false;

              this.ruleForm.virtualIp = "";

              this.ruleForm.clustername = "";

              this.ruleForm.clusterpwd = "";

              this.clusterid = "";

            }



            this.$notify({

              title: res.success ? "成功" : "失败",

              message: res.msg,

              type: res.success ? "success" : "error",

            });

            this.findCluster();

          } catch (err) {

            console.log(err);

            this.$notify.error({

              title: "失败",

              message: err.msg,

            });

          }

        },

        (err) => {

@@ -642,7 +702,7 @@
}

.cluster-guanli {

  margin: 0 auto;

  width: 760px;

  // width: 760px;

  padding: 0 10px;

  .btns {

    margin-top: 30px !important;

@@ -806,7 +866,7 @@
      .clu-item {

        border-radius: 8px;

        height: 40px;

        // cursor: pointer;

        cursor: pointer;

        line-height: 40px;

        text-align: left;

        padding: 0 20px;

@@ -815,10 +875,14 @@
          margin-right: 8px;

        }

      }

      // .clu-item:hover {

      //   background: var(--colorCard);

      //   color: #fff;

      // }

      .clu-item:hover {

        background: var(--colorCard);

        color: #fff;

      }

      .clu-item-active {

        background: var(--colorCard);

        color: #fff;

      }

    }

    .el-form-item__content {

      line-height: 48px;

@@ -851,7 +915,7 @@
      left: 20px;

    }

    .el-form-item {

      margin-bottom: 10px;

      margin-bottom: 16px;

      .el-input__inner {

        background-color: #ffffff;

        border: 2px solid transparent;