From 7656962ded2a6ccbe3eae75304b3789662d82711 Mon Sep 17 00:00:00 2001 From: heyujie <516346543@qq.com> Date: 星期三, 26 一月 2022 16:01:56 +0800 Subject: [PATCH] 集群改动 --- src/pages/settings/views/clusterManagement.vue | 134 +++++++++++++++++++++++++++++++------------- 1 files changed, 93 insertions(+), 41 deletions(-) diff --git a/src/pages/settings/views/clusterManagement.vue b/src/pages/settings/views/clusterManagement.vue index 5115d54..3f706a5 100644 --- a/src/pages/settings/views/clusterManagement.vue +++ b/src/pages/settings/views/clusterManagement.vue @@ -164,7 +164,7 @@ class="join-form" v-loading="joinLoading" > - <el-form-item prop="clusterid"> + <!-- <el-form-item prop="clusterid"> <div class="p-title">闆嗙兢ID</div> <el-input v-model="joinForm.clusterid" size="small"></el-input> </el-form-item> @@ -177,7 +177,7 @@ size="small" autocomplete="new-password" ></el-input> - </el-form-item> + </el-form-item> --> <el-form-item prop="clusterpwd"> <div class="p-title">闆嗙兢瀵嗙爜</div> <el-input @@ -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" @@ -216,9 +217,9 @@ {{ item.Address }} </div> </div> - <div class="btns"> + <!-- <div class="btns"> <div class="ok" @click="join('joinForm')">鍔犲叆闆嗙兢</div> - </div> + </div> --> </div> </div> </div> @@ -245,16 +246,16 @@ export default { data() { const checkPwd = (rule, value, callback) => { - if (!value) { + if (value=="") { return callback(new Error("瀵嗙爜涓嶈兘涓虹┖")); } - setTimeout(() => { + // setTimeout(() => { if (value.length != 6) { callback(new Error("瀵嗙爜搴斾负6浣�!")); } else { callback(); } - }, 1000); + // }, 1000); }; const checkID = (rule, value, callback) => { if (!value) { @@ -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, @@ -517,30 +562,33 @@ cancelButtonText: "鍙栨秷", customClass: "del-account-message-box", }).then( - 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 = ""; - } - }, - (err) => { - clearInterval(this.intervalTimer); + () => { this.showCurCluster = false; - this.ruleForm.virtualIp = ""; - this.ruleForm.clustername = ""; - this.ruleForm.clusterpwd = ""; - this.clusterid = ""; } + // 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 = ""; + // } + // }, + // (err) => { + // clearInterval(this.intervalTimer); + // this.showCurCluster = false; + // this.ruleForm.virtualIp = ""; + // this.ruleForm.clustername = ""; + // this.ruleForm.clusterpwd = ""; + // this.clusterid = ""; + // } ); }, clearInput(typ) { @@ -806,7 +854,7 @@ .clu-item { border-radius: 8px; height: 40px; - // cursor: pointer; + cursor: pointer; line-height: 40px; text-align: left; padding: 0 20px; @@ -815,10 +863,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; -- Gitblit v1.8.0