From 46b274e6b5d0bd7f2afe46a8adeac4faaa446dc9 Mon Sep 17 00:00:00 2001
From: ZZJ <zzjdsg2300@163.com>
Date: 星期三, 29 九月 2021 17:59:18 +0800
Subject: [PATCH] 系统设置/维护v0
---
src/pages/vindicate/views/updateSettings.vue | 240 +++++++++++++++++++++++++++++++++++++++++++++++++----------
1 files changed, 198 insertions(+), 42 deletions(-)
diff --git a/src/pages/vindicate/views/updateSettings.vue b/src/pages/vindicate/views/updateSettings.vue
index 9e2a0b6..94ba62e 100644
--- a/src/pages/vindicate/views/updateSettings.vue
+++ b/src/pages/vindicate/views/updateSettings.vue
@@ -47,8 +47,14 @@
<div class="desc desc-suc" v-if="!checking && !hasNewVersion">
褰撳墠宸茬粡鏄渶鏂扮増鏈�
</div>
+
+
+ <div class="text-desc" v-if="hasNewVersion && !checking&& !upgrading">
+ {{verText}}
+ </div>
+
<el-button
- v-if="hasNewVersion && !checking"
+ v-if="hasNewVersion && !checking&&!upgrading"
:loading="upgrading"
type="primary"
style="width: 150px"
@@ -56,21 +62,37 @@
@click="upgradeNewVersion"
>鏇存柊</el-button
>
-
- <div class="text-desc" v-if="hasNewVersion && !checking&& !upgrading">
- {{verText}}
- </div>
</div>
+
+
+
<div class="upload-center" v-if="radio2 == '涓婁紶鏇存柊'">
+ <div class="upload-info"><span class="icon iconfont"></span> 涓婁紶瀹夎杞欢</div>
<div class="upload-top">
- <el-upload
+
+ <div class="upload-container">
+ <div class="upload-fail " v-if="upStatus===0">
+ <i class="icon iconfont upload-icon">
+ 
+ </i>
+ <p>涓婁紶澶辫触锛岃閲嶆柊涓婁紶銆�</p>
+ </div>
+
+ <div class="upload-success" v-if="upStatus===1">
+ <i class="icon iconfont upload-icon">
+ 
+ </i>
+ <p>涓婁紶鎴愬姛锛岃鐐瑰嚮鏇存柊鎸夐挳寮�濮嬫洿鏂般��</p>
+ </div>
+
+ <el-upload
class="upload-demo"
drag
action
v-show="!shengjiing"
:http-request="uploadPkg"
:limit="1"
- >
+ >
<i class="el-icon-upload"></i>
<div
class="el-upload__text"
@@ -83,6 +105,8 @@
<div class="el-upload__tip" slot="tip"></div>
</el-upload>
+ </div>
+
<span
class="icon iconfont spin-bg"
:class="shengjiing ? 'spin-bg-rot' : ''"
@@ -91,6 +115,7 @@
>
<div class="desc" v-if="shengjiing">姝ｅ湪杩涜鏇存柊鈥︹��</div>
<el-button
+ v-if="!upgrading"
type="primary"
style="width: 150px; font-size: 15px"
@click="upgrade"
@@ -168,7 +193,8 @@
upgrading: false,
checking: true,
newVersionName: "",
- hasNewVersion: true,
+ hasNewVersion: false,
+ upStatus:'',
sysSetList: [
{ title: "鑷姩娓呯悊杞欢鍖呯紦瀛�", val: false, name: "sys_auto_clean" },
{ title: "鏇存柊鎻愰啋", val: false, name: "sys_update_notice" },
@@ -251,7 +277,16 @@
uploadUpgradePkg(param).then((res) => {
this.upgrading = false;
this.pkgID = res.data.id;
- });
+ this.upStatus = 1
+ setTimeout(() => {
+ this.upStatus =''
+ }, 2000);
+ }).catch(()=>{
+ this.upStatus = 0
+ setTimeout(() => {
+ this.upStatus =''
+ }, 2000);
+ })
},
upgrade() {
this.shengjiing = true;
@@ -314,6 +349,7 @@
}
});
},
+
},
};
</script>
@@ -341,7 +377,6 @@
border-right: 4px solid #f8f8f8;
.menu-item {
- background-color: #F2F2F7;
height: 56px;
margin-bottom: 4px;
border-radius: 8px;
@@ -365,7 +400,7 @@
}
}
.menu-item-active {
- background-color: var(--colorCard);
+ background-color: var(--colorCard) !important;
.iconfont {
color: #fff !important;
}
@@ -374,13 +409,7 @@
}
}
.menu-item:hover {
- background-color: var(--colorCard);
- .iconfont {
- color: #fff;
- }
- .menu-text {
- color: #fff;
- }
+ background-color: #F2F2F7;
}
}
.cluster-right {
@@ -423,8 +452,35 @@
.net-set {
display: flex;
flex-direction: column;
- justify-content: space-between;
+ justify-content: start;
height: 95%;
+ padding: 0 30px;
+ .el-radio-group {
+ margin-top:33px ;
+ .el-radio-button__inner {
+ font-size: 14px;
+ width: 84px;
+ height: 28px;
+ padding: 0;
+ border-radius: 20px;
+ text-align: center;
+ line-height: 28px;
+ background: #F2F2F7 !important;
+ border: none !important;
+ box-shadow:none !important;
+ &:hover {
+ color: var(--colorCard) !important;
+ }
+
+ }
+ & label.is-active .el-radio-button__inner {
+ background: var(--colorCard) !important;
+ border: none !important;
+ &:hover {
+ color: white !important;
+ }
+ }
+ }
@keyframes spin {
from {
transform: rotate(0deg);
@@ -436,19 +492,17 @@
.spin-bg {
color: rgb(206, 205, 205);
- font-size: 100px;
- margin-bottom: 20px;
+ font-size: 60px;
+ margin-top: 60px;
+ margin-bottom:15px ;
}
.spin-bg-rot {
animation: spin 0.8s linear infinite;
}
.desc {
- height: 20px;
- line-height: 20px;
- font-size: 15px;
- color: rgb(231, 121, 58);
- margin-bottom: 20px;
- font-weight: 600;
+ font-weight: bold;
+ font-size: 16px;
+ color: #333333;
}
.update-center {
display: flex;
@@ -456,26 +510,72 @@
align-items: center;
.desc-suc {
- color: #3a8120;
+ color: #333;
+ border-radius: 8px;
}
.el-button {
- width: 100px;
+ margin-top: 48px;
+ width: 150px;
+ height: 40px;
+ border-radius: 25px;
font-size: 15px;
+ background: var(--colorCard) !important;
+ border: none !important;
+ &:hover {
+ color: white !important;
+ }
}
.text-desc{
- width: 260px;
+ width: 90%;
+ height: 150px;
margin-top: 20px;
- background-color: rgba(250, 250, 250, 1);
- border: 1px dashed rgba(220, 220, 220, 1);
- height: 100px;
- padding: 10px 20px;
- color: rgba(94, 94, 94, 1);
+ background-color: #F2F2F7;
+ padding: 20px 30px;
+ color: #333;
text-align: left;
- font-size: 14px;
- border-radius:5px ;
+ font-size: 12px;
+ border-radius:8px ;
}
}
.upload-center {
+ margin-top:44px ;
+ .upload-info {
+ margin-bottom:20px ;
+ text-align: left;
+ font-weight: bold;
+ font-size: 14px;
+ color: #333333;
+ }
+ .upload-container {
+ position: relative;
+ width: 412px;
+ height: 174px;
+ background-color: #fff;
+ border-radius: 8px;
+ .upload-success,.upload-fail {
+ position: absolute;
+ z-index: 1;
+ width: 100%;
+ height: 174px;
+ top: 0;
+ left: 0;
+ background-color: #fff;
+ font-weight: bold;
+ font-size: 10px;
+
+ transition: all 1000ms linear 0;
+ -o-transition: all 1000ms linear 0; /*鍏煎parsto鍐呮牳*/
+ -moz-transition: all 1000ms linear 0; /*鍏煎gecko鍐呮牳*/
+ -webkit-transition: all 1000ms linear 0; /*鍏煎webkit鍐呮牳*/
+ }
+ .upload-icon {
+ display: block;
+ margin-top: 32px;
+ margin-bottom:42px ;
+ font-size: 50px;
+ }
+ }
+
.update-center {
height: 160px;
@@ -494,7 +594,13 @@
margin-bottom: 10px;
}
.el-button {
- width: 120px;
+ width: 150px;
+ height: 40px;
+ background: var(--colorCard) !important;
+ border: none !important;
+ &:hover {
+ color: white !important;
+ }
}
.el-button--small {
font-size: 14px;
@@ -507,8 +613,47 @@
box-sizing: border-box;
flex-direction: column;
+ .el-upload {
+ width: 340px !important;
+ height: 117.87px !important;
+ margin: 28px auto;
+ .el-upload-dragger {
+ width: 100% !important;
+ height: 100% !important;
+ i {
+ display: none !important;
+ }
+ .el-upload__text {
+ color: #828282 !important;
+ margin-top: 52px !important;
+ font-size: 14px !important;
+ }
+ .el-loading-text {
+ font-size: 14px !important;
+ color: #333333 !important;
+ }
+ }
+ }
+
+ .el-upload.el-upload--text .el-upload-dragger:hover {
+ border-color: var(--colorCard) !important;
+ }
+
+ em {
+ color: var(--colorCard) !important;
+ }
+
.uploader-btn {
- margin-top: 15px;
+ width: 150px;
+ height: 40px;
+ margin-top: 158px;
+ margin-bottom:25px ;
+ background: var(--colorCard) !important;
+ border: none !important;
+ border-radius: 25px !important;
+ &:hover {
+ color: white !important;
+ }
}
}
.up-text {
@@ -525,6 +670,10 @@
}
}
.cur-version {
+ position: absolute;
+ bottom: 50px;
+ left: 50%;
+ transform: translateX(-50%);
font-size: 14px;
}
}
@@ -537,7 +686,7 @@
background-color: #f8f8f8;
justify-content: space-between;
border-radius: 12px;
- margin-bottom: 10px;
+ margin-bottom: 4px;
padding-left:20px ;
.name {
font-size: 14px;
@@ -557,12 +706,12 @@
margin-right: 17px;
}
.is-checked .el-switch__core{
- background-color: #4E97FF !important;
+ background-color: var(--colorCard) !important;
+ border: 1px solid var(--colorCard) !important;
}
}
.save-btn {
- background-color: #3d68e1;
width: 240px;
height: 40px;
margin: 0 auto;
@@ -571,7 +720,14 @@
line-height: 40px;
font-size: 14px;
margin-top: 20px;
+ background: var(--colorCard) !important;
+ border: none !important;
+ &:hover {
+ color: white !important;
+ }
}
}
+
}
+
</style>
--
Gitblit v1.8.0