优化应用中心卸载

zhangzengfei

2023-11-29 0d3db253cad1fb49c4fae9b9a537c8c318c7172f

 src/pages/settings/views/clusterManagement.vue

@@ -5,8 +5,16 @@
      <!-- <cloud-node :nodes="innerNodes"></cloud-node> -->

      <net-node :innerNodes="innerNodes"></net-node>



      <div class="cls-bar">视频分析集群管理</div>



      <div class="cls-bar">

        <div class="title">节点状态</div>

        <div class="input-area">

          <div class="text" v-show="!isFillingName">

            {{ ruleForm.state }}

          </div>

          <el-switch v-model="masterNode" :disabled="masterNode" style="margin-top:5px" @change="change2Master">

          </el-switch>

        </div>

      </div>

      <div class="cls-bar">

        <div class="title">集群名称</div>

        <div class="input-area">

@@ -168,7 +176,8 @@
  stopSearching,

  findCluster,

  updateClusterName,

  joinCluster

  joinCluster,

  update2Master

} from "@/api/clusterManage"

// import cloudNode from "../components/CloudNode";

import NetNode from "../components/NetNode"

@@ -195,6 +204,7 @@
      }

    }

    return {

      masterNode: false,

      innerNodes: [],

      intervalTimer: null,

      isFillingName: false,

@@ -210,7 +220,9 @@
      ruleForm: {

        clustername: "",

        clusterpwd: "",

        virtualIp: ""

        virtualIp: "",

        state: "",

        localId: ""

      },

      selfForm: {

        virtualIp: "",

@@ -222,7 +234,7 @@
        clusterpwd: ""

      },

      isSearch: false,

      showCurCluster: true,

      showCurCluster: false,

      loading: false,

      joinLoading: false,

      isHasColony: false,

@@ -240,7 +252,9 @@
        clusterid: [{ validator: checkID, trigger: "blur" }],

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

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

      }

      },

      clusterPassword: "",

      clusterPasswordInput: ""

    }

  },

  components: {

@@ -250,9 +264,9 @@
  },

  mounted() {

    this.findCluster()

    this.intervalTimer = setInterval(() => {

      this.findCluster()

    }, 30000)

    // this.intervalTimer = setInterval(() => {

    //   this.findCluster()

    // }, 30000)

  },

  beforeDestroy() {

    clearInterval(this.intervalTimer)

@@ -350,25 +364,27 @@
    },

    join(formName) {

      let _this = this

      _this.joinLoading = true

      let data = {

        clusterId: _this.joinForm.clusterid,

        password: _this.joinForm.clusterpwd,

        nodeIps: [_this.joinForm.clusterip]

      }

      _this

        .joinCluster(data)

        .then(() => {

          _this.joinLoading = false

          _this.findCluster()

        })

        .catch((e) => {

          _this.joinLoading = false

        })



      this.$refs[formName].validate((valid) => {

        console.log("join")

        if (valid) {

          _this.joinLoading = true

          let data = {

            clusterId: _this.joinForm.clusterid,

            password: _this.joinForm.clusterpwd,

            nodeIps: [_this.joinForm.clusterip]

          }

          debugger

          _this

            .joinCluster(data)

            .then(() => {

              _this.joinLoading = false

              _this.findCluster()

            })

            .catch((e) => {

              _this.joinLoading = false

            })

        } else {

          onsole.log("参数错误")

          return false

        }

      })

@@ -467,7 +483,7 @@
    exitCluster() {

      const h = this.$createElement

      let res = {}



      this.clusterPasswordInput = ""

      this.$msgbox({

        title: "",

        message: h(

@@ -478,9 +494,14 @@
          [

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

            h("span", { class: "warn-title" }, "退出集群"),

            h("span", { class: "warn-dec" }, "确定退出集群吗？")

            h("input", {

              attrs: { placeholder: "请输入集群密码", id: "cluster-password", class: "warn-title" },

              value: "",

              on: { input: this.onQuitInputChange }

            })

          ]

        ),

        // showInput: true,

        showCancelButton: true,

        showClose: true,

        confirmButtonText: "确定",

@@ -491,10 +512,10 @@
        //   this.showCurCluster = false;

        // }

        async () => {

          clearInterval(this.intervalTimer)

          try {

            res = await leave()

            res = await leave({ password: this.clusterPasswordInput })

            if (res && res.success) {

              clearInterval(this.intervalTimer)

              this.showCurCluster = false

              this.ruleForm.virtualIp = ""

              this.ruleForm.clustername = ""

@@ -515,16 +536,11 @@
              message: err.msg

            })

          }

        },

        (err) => {

          clearInterval(this.intervalTimer)

          this.showCurCluster = false

          this.ruleForm.virtualIp = ""

          this.ruleForm.clustername = ""

          this.ruleForm.clusterpwd = ""

          this.clusterid = ""

        }

      )

    },

    onQuitInputChange() {

      this.clusterPasswordInput = document.getElementById("cluster-password").value

    },

    clearInput(typ) {

      if (typ == 1) {

@@ -586,6 +602,7 @@
      if (res && res.success) {

        if (res.data && res.data.clusterId) {

          this.isHasColony = true

          this.showCurCluster = true

          this.clusterid = res.data.clusterId

          this.ruleForm.clustername = res.data.clusterName

          this.ruleForm.clusterpwd = "******"

@@ -605,6 +622,13 @@
            obj.nodeName = i.node_name

            obj.Address = i.node_ip

            obj.role = i.drift_state ? i.drift_state : "pc"

            obj.online = i.online



            if (obj.id == res.data.localId) {

              this.ruleForm.state = i.drift_state

              this.ruleForm.localId = res.data.localId

              this.masterNode = i.drift_state === "master"

            }

            return obj

          })

        } else {

@@ -614,6 +638,65 @@
    },

    clearInnerNodes() {

      this.innerNodes = []

    },

    async change2Master() {

      const h = this.$createElement

      this.clusterPasswordInput = ""

      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("input", {

              attrs: { placeholder: "请输入集群密码", id: "cluster-password", class: "warn-title" },

              value: "",

              on: { input: this.onQuitInputChange }

            })

          ]

        ),

        // showInput: true,

        showCancelButton: true,

        showClose: true,

        confirmButtonText: "确定",

        cancelButtonText: "取消",

        customClass: "del-account-message-box"

      })

        .then(

          // () => {

          //   this.showCurCluster = false;

          // }

          async () => {

            clearInterval(this.intervalTimer)

            try {

              let res = await update2Master({

                clusterId: this.clusterid,

                nodeId: this.ruleForm.localId,

                password: this.clusterPasswordInput

              })

              if (res && res.success) {

                this.$message.success("切换成功")

                this.findCluster()

              } else {

                this.$message.warning("切换失败, 请检查密码")

                this.masterNode = false

              }

            } catch (err) {

              console.log(err)

              this.$notify.error({

                title: "失败",

                message: err.msg

              })

            }

          }

        )

        .catch(() => {

          this.masterNode = false

        })

    }

  }

}

@@ -625,7 +708,7 @@
}

.cluster-guanli {

  margin: 0 auto;

  width: 760px;

  // width: 760px;

  padding: 0 10px;

  .btns {

    margin-top: 30px !important;