From 211cd7469ebc7df813ffd320c90f64fd1c2f1aee Mon Sep 17 00:00:00 2001
From: heyujie <516346543@qq.com>
Date: 星期三, 09 二月 2022 10:55:20 +0800
Subject: [PATCH] 备份还原ui新
---
src/pages/vindicate/views/backUp.vue | 153 +++++++++++++++++++++++++++++---------------------
1 files changed, 89 insertions(+), 64 deletions(-)
diff --git a/src/pages/vindicate/views/backUp.vue b/src/pages/vindicate/views/backUp.vue
index e82e73c..aa2b81e 100644
--- a/src/pages/vindicate/views/backUp.vue
+++ b/src/pages/vindicate/views/backUp.vue
@@ -28,7 +28,6 @@
</div>
<div class="bar">
<div class="name">澶囦唤鐩綍</div>
- <!-- <input type="file" id="file_input" webkitdirectory directory /> -->
<el-input
v-model="dir"
:placeholder="'璇疯緭鍏ュ浠界洰褰�'"
@@ -66,16 +65,20 @@
<div class="recover" v-if="activePage == 1">
<div class="title">鏄剧ず澶囦唤鐨勬枃浠惰寖鍥达細{{ 5 }}</div>
- <div class="table-head">
- <span class="line1">鑷姩澶囦唤鏃堕棿</span>
- <span class="line1">澶囦唤鏂囦欢鍚嶇О</span>
- <span class="line2">鎿嶄綔</span>
- </div>
+ <div class="table-body">
+ <div class="table-head">
+ <span class="line1">鑷姩澶囦唤鏃堕棿</span>
+ <span class="line1">澶囦唤鏂囦欢鍚嶇О</span>
+ <span class="line2">鎭㈠澶囦唤</span>
+ </div>
- <div class="bar" v-for="(item, i) in fileList" :key="i">
- <span class="time">{{ item }}</span>
- <span class="time">{{ item }}</span>
- <span class="operation" @click="recoverFile(item)">鎭㈠</span>
+ <div class="bar" v-for="(item, i) in fileList" :key="i">
+ <span class="time">{{ item }}</span>
+ <span class="time">{{ item }}</span>
+ <span class="operation iconfont" @click="recoverFile(item)"
+ >
+ </span>
+ </div>
</div>
</div>
</div>
@@ -92,7 +95,6 @@
recoverBackup,
} from "@/api/system";
export default {
- mounted() {},
created() {
this.getBakConfig();
this.getBakFileList();
@@ -173,10 +175,10 @@
});
},
recoverFile(bakDir) {
- recoverBackup({bakDir}).then((res) => {
- debugger
- res.data
- })
+ recoverBackup({ bakDir }).then((res) => {
+ debugger;
+ res.data;
+ });
},
saveBakConfig() {
setBakConfig({
@@ -208,7 +210,6 @@
width: 100%;
background-color: #fbfaff;
}
-
.backup-content {
height: 100%;
display: flex;
@@ -270,6 +271,7 @@
.backup-right {
flex: 1;
flex-basis: auto;
+ padding: 10px;
overflow: auto;
box-sizing: border-box;
position: relative;
@@ -308,16 +310,25 @@
.bar {
display: flex;
align-items: center;
- height: 50px;
padding: 0 25px;
- background-color: #f8f8f8;
justify-content: space-between;
- border-radius: 12px;
margin-bottom: 10px;
+ border-radius: 8px;
+ margin-bottom: 10px;
+ height: 48px;
+ background-color: #f2f2f7;
+ .el-button--small,
+ .el-button--small.is-round {
+ padding: 9px 19px;
+ background: var(--colorCard) !important;
+ border-radius: 25px;
+ border-color: var(--colorCard) !important;
+ }
.name {
- font-size: 15px;
+ font-size: 14px;
text-align: left;
- min-width: 180px;
+ font-weight: 600;
+ min-width: 170px;
}
.el-input {
width: 100%;
@@ -327,65 +338,79 @@
.el-input__inner {
border: none;
border-radius: 8px;
- background-color: rgba(240, 240, 240, 1);
text-align: left;
+ background: #fbfaff;
+ border-radius: 20px;
}
}
}
}
.recover {
.title {
- font-size: 13px;
- color: #868686;
- text-align: left;
- padding: 0 10px;
- margin-bottom: 10px;
- }
- .table-head {
- height: 30px;
- line-height: 30px;
- display: flex;
- // justify-content: space-between;
- box-sizing: border-box;
- font-size: 15px;
- padding: 0 10px;
- margin-bottom: 5px;
- .line1 {
- flex: 4;
- text-align: left;
- }
- .line2 {
- flex: 1;
- text-align: right;
- }
- }
- .bar {
- height: 40px;
- background-color: rgba(248, 248, 248, 1);
- display: flex;
- box-sizing: border-box;
- padding: 0 10px;
- align-items: center;
- border-radius: 8px;
- color: #797979;
font-size: 14px;
+ color: #333333;
+ text-align: left;
margin-bottom: 10px;
- .time {
- width: 45%;
- text-align: left;
+ line-height: 18px;
+ font-weight: bold;
+ }
+ .table-body {
+ box-sizing: border-box;
+ padding: 10px 20px;
+ padding-bottom: 5px;
+ background: #f2f2f7;
+ border-radius: 8px;
+ .table-head {
+ height: 30px;
+ line-height: 30px;
+ display: flex;
+ box-sizing: border-box;
+ font-size: 15px;
+ padding: 0 10px;
+ margin-bottom: 5px;
+ font-size: 14px;
+ color: #666666;
+ .line1 {
+ flex: 3;
+ text-align: left;
+ }
+ .line2 {
+ flex: 1;
+ text-align: left;
+ min-width: 60px;
+ }
}
- .operation {
- color: var(--colorCard);
- cursor: pointer;
- width: 10%;
- text-align: right;
+ .bar {
+ height: 32px;
+ background-color: #ffffff;
+ display: flex;
+ box-sizing: border-box;
+ padding: 0 10px;
+ align-items: center;
+ border-radius: 20px;
+ color: #333333;
+ font-size: 12px;
+ margin-bottom: 8px;
+ font-weight: bold;
+ .time {
+ width: 42.857%;
+ text-align: left;
+ }
+ .operation {
+ color: var(--colorCard);
+ cursor: pointer;
+ width: 14.2857%;
+ min-width: 60px;
+ text-align: left;
+ font-size: 20px;
+ }
}
}
}
.save-btn {
width: 251px;
height: 40px;
- margin-top: 80px;
+ margin-top: 100px;
background: var(--colorCard) !important;
border: 1px solid var(--colorCard) !important;
border-radius: 25px;
--
Gitblit v1.8.0