From 4aa13af3c74cf57d70bad9c4bc53b2c26e04fb5d Mon Sep 17 00:00:00 2001 From: heyujie <516346543@qq.com> Date: 星期三, 26 一月 2022 13:46:53 +0800 Subject: [PATCH] 集群管理搜索集群 --- src/pages/vindicate/views/backUp.vue | 225 ++++++++++++++++++++++++++++++++++++------------------- 1 files changed, 147 insertions(+), 78 deletions(-) diff --git a/src/pages/vindicate/views/backUp.vue b/src/pages/vindicate/views/backUp.vue index 075b2a4..e82e73c 100644 --- a/src/pages/vindicate/views/backUp.vue +++ b/src/pages/vindicate/views/backUp.vue @@ -2,14 +2,18 @@ <div class="all"> <div class="backup-content"> <div class="backup-center" ref="left"> - <div class="menu-item" @click="openRight(i)" v-for="(item, i) in tabList" :class="activePage == i ? 'menu-item-active' : ''" - :key="i"> + <div + class="menu-item" + @click="openRight(i)" + v-for="(item, i) in tabList" + :class="activePage == i ? 'menu-item-active' : ''" + :key="i" + > <div class="con"> <span class="icon iconfont">{{ item.icon }}</span> <span class="menu-text">{{ item.name }}</span> </div> </div> - </div> <div class="backup-right"> <div class="auto" v-if="activePage == 0"> @@ -24,14 +28,18 @@ </div> <div class="bar"> <div class="name">澶囦唤鐩綍</div> - <input type="file" id="file_input" webkitdirectory directory /> + <!-- <input type="file" id="file_input" webkitdirectory directory /> --> + <el-input + v-model="dir" + :placeholder="'璇疯緭鍏ュ浠界洰褰�'" + size="small" + ></el-input> </div> <div class="bar"> <div class="name">澶囦唤闂撮殧 / 澶�</div> <el-input - v-model="interval" + v-model.number="interval" :placeholder="'璇疯緭鍏ュぉ鏁�'" - @change="handleChange" size="small" ></el-input> <!-- :controls="false" --> @@ -39,9 +47,8 @@ <div class="bar"> <div class="name">澶囦唤鏁版嵁淇濆瓨鏃堕棿 / 澶�</div> <el-input - v-model="lifeSpan" + v-model.number="lifeSpan" placeholder="璇疯緭鍏ュぉ鏁�" - @change="handleChange" size="small" ></el-input> </div> @@ -51,6 +58,10 @@ >绔嬪嵆澶囦唤</el-button > </div> + + <el-button class="save-btn" type="primary" @click="saveBakConfig" + >淇濆瓨</el-button + > </div> <div class="recover" v-if="activePage == 1"> <div class="title">鏄剧ず澶囦唤鐨勬枃浠惰寖鍥达細{{ 5 }}</div> @@ -62,9 +73,9 @@ </div> <div class="bar" v-for="(item, i) in fileList" :key="i"> - <span class="time">{{ item.time }}</span> - <span class="time">{{ item.name }}</span> - <span class="operation">鎭㈠</span> + <span class="time">{{ item }}</span> + <span class="time">{{ item }}</span> + <span class="operation" @click="recoverFile(item)">鎭㈠</span> </div> </div> </div> @@ -73,70 +84,121 @@ </template> <script> +import { + getBakConfig, + setBakConfig, + backupRN, + getBackupList, + recoverBackup, +} from "@/api/system"; export default { mounted() {}, + created() { + this.getBakConfig(); + this.getBakFileList(); + }, data() { return { - tabList: [ + tabList: [ { name: "鑷姩澶囦唤璁剧疆", icon: "\ue6f2" }, { name: "浠庡浠戒腑鎭㈠", icon: "\ue6db" }, ], - fileList: [ - { time: "2010-10-02 12:30:09", name: "鏂囦欢1" }, - { time: "2010-10-02 12:30:09", name: "鏂囦欢12121212121" }, - { time: "2010-10-02", name: "鏂囦欢2211" }, - { time: "2011", name: "澶囦唤鏂囦欢2" }, - ], + warnSpn: "\ue71c", + fileList: [], activePage: 0, - interval: "", - lifeSpan: "", - options: [ - { - value: "閫夐」1", - label: "鎵嬪姩", - }, - { - value: "閫夐」2", - label: "鑷姩", - }, - ], - isBackUp: true, + interval: null, + lifeSpan: null, + dir: "", + isBackUp: false, }; }, methods: { + getBakFileList() { + getBackupList().then((res) => { + this.fileList = res.data; + }); + }, + getBakConfig() { + getBakConfig().then((res) => { + this.isBackUp = res.data.enable; + this.lifeSpan = res.data.saveDays; + this.interval = res.data.period; + this.dir = res.data.dir; + }); + }, openRight(i) { this.activePage = i; }, handleChange() {}, backUpNow() { - this.$confirm("鎮ㄦ槸鍚︾‘璁ょ珛鍗冲浠芥墍鏈夊簲鐢ㄧ殑閰嶇疆鏁版嵁锛�", "绔嬪嵆澶囦唤", { + const h = this.$createElement; + const icon = 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" }, `${this.warnSpn}`), + h("span", { class: "warn-title" }, "绔嬪嵆澶囦唤"), + h( + "span", + { class: "warn-dec" }, + "纭绔嬪嵆澶囦唤鎵�鏈夊簲鐢ㄧ殑閰嶇疆鏁版嵁锛�" + ), + ] + ), + showCancelButton: true, confirmButtonText: "纭畾", cancelButtonText: "鍙栨秷", }).then(() => { - this.$message({ - type: "success", - message: "澶囦唤鎴愬姛", - }); + backupRN({ + enable: this.isBackUp, + dir: this.dir, + period: this.interval, + saveDays: this.lifeSpan, + }) + .then((res) => { + if (res.code == 200) { + this.$notify.success(res.msg); + } else { + this.$notify.error(res.msg); + } + }) + .catch((err) => { + this.$notify.error(err.msg); + }); }); - // .then((resp) => { - // if (resp.success) { - // this.$message({ - // type: "success", - // message: "鍒犻櫎鏁版嵁鎴愬姛", - // }); - // this.loading = false; - // } - // }) - // .catch((err) => { - // this.$message({ - // type: "error", - // message: "鍒犻櫎鏁版嵁澶辫触锛�", - // }); - // this.loading = false; - // }); + }, + recoverFile(bakDir) { + recoverBackup({bakDir}).then((res) => { + debugger + res.data + }) + }, + saveBakConfig() { + setBakConfig({ + enable: this.isBackUp, + dir: this.dir, + period: this.interval, + saveDays: this.lifeSpan, + }) + .then((res) => { + if (res.code == 200) { + this.$notify.success(res.msg); + this.getBakConfig(); + } else { + this.$notify.error(res.msg); + } + }) + .catch((err) => { + this.$notify.error(err.msg); + }); }, switchChange(val) { - console.log(val); + this.saveBakConfig(); }, }, }; @@ -144,7 +206,7 @@ <style lang="scss"> .all { width: 100%; - background-color: #FBFAFF; + background-color: #fbfaff; } .backup-content { @@ -154,44 +216,55 @@ flex: 1; flex-basis: auto; box-sizing: border-box; - border-top:2px solid #E1E0E6 ; - border-left:2px solid #E1E0E6 ; + border-top: 4px solid rgb(242, 242, 247); + border-left: 4px solid rgb(242, 242, 247); + .backup-center { height: 100%; - width: 280px; + width: 300px; overflow: auto; box-sizing: border-box; flex-shrink: 0; - padding: 10px; - border-right: 5px solid #f8f8f8; + padding: 9px 10px 0 10px; + border-right: 4px solid rgb(242, 242, 247); .menu-item { background-color: #f8f8f8; - height: 50px; - margin-bottom: 10px; + height: 56px; + margin-bottom: 4px; border-radius: 8px; - line-height: 50px; + line-height: 56px; box-sizing: border-box; font-size: 14px; cursor: pointer; - padding: 0 20px; + padding: 0 15px; display: flex; justify-content: space-between; .con { .iconfont { + font-size: 20px; + line-height: 32px; + width: 32px; + height: 26px; margin-right: 10px; + color: #333; } .menu-text { - font-size: 15px; + font-size: 16px; + font-weight: 700; } } } .menu-item-active { - color: #fff; - background-color: var(--colorCard); + background-color: var(--colorCard) !important; + .iconfont { + color: #fff !important; + } + .menu-text { + color: #fff; + } } .menu-item:hover { - color: #fff; - background-color: var(--colorCard); + background-color: #f2f2f7; } } .backup-right { @@ -200,7 +273,6 @@ overflow: auto; box-sizing: border-box; position: relative; - padding: 20px 40px; .el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label:before, .el-form-item.is-required:not(.is-no-asterisk) @@ -303,7 +375,7 @@ text-align: left; } .operation { - color: rgba(26, 115, 232, 1); + color: var(--colorCard); cursor: pointer; width: 10%; text-align: right; @@ -311,15 +383,12 @@ } } .save-btn { - background-color: #3d68e1; - width: 240px; + width: 251px; height: 40px; - margin: 0 auto; - border-radius: 10px; - color: #fff; - line-height: 40px; - font-size: 14px; - margin-top: 20px; + margin-top: 80px; + background: var(--colorCard) !important; + border: 1px solid var(--colorCard) !important; + border-radius: 25px; } } } -- Gitblit v1.8.0