From 758d6d078ef2fb99907a1a78de6548c542768b37 Mon Sep 17 00:00:00 2001
From: ZZJ <zzjdsg2300@163.com>
Date: 星期五, 24 九月 2021 18:38:14 +0800
Subject: [PATCH] zzjv0
---
src/pages/settings/views/clusterManagement.vue | 4
vue.config.js | 9 +
public/index.html | 7
src/pages/settings/views/keyboardLanguage.vue | 64 ++++---
src/pages/vindicate/views/updateSettings.vue | 4
src/pages/settings/views/deviceInfo.vue | 76 +++++++-
src/pages/settings/views/NetSettings.vue | 4
public/apps.json | 4
src/pages/settings/index/index.vue | 6
src/assets/css/globalVariable.scss | 4
public/css/common.scss | 1
src/pages/vindicate/index/App.vue | 10 +
src/pages/vindicate/views/backUp.vue | 4
src/pages/settings/views/generalSettings.vue | 273 +++++++++++++++++++++++++---------
14 files changed, 337 insertions(+), 133 deletions(-)
diff --git a/public/apps.json b/public/apps.json
index 68d76fa..062f1c0 100644
--- a/public/apps.json
+++ b/public/apps.json
@@ -262,8 +262,8 @@
"type": "2",
"url": "/view/settings/",
"title": "绯荤粺璁剧疆",
- "width": 1200,
- "height": 650,
+ "width": 1024,
+ "height": 768,
"iconBlob": "",
"icon": "../../images/app-mid/settings.png",
"version": "1.0.0",
diff --git a/public/css/common.scss b/public/css/common.scss
index a840ee6..cbcce41 100644
--- a/public/css/common.scss
+++ b/public/css/common.scss
@@ -1,4 +1,5 @@
+
/*瀹氫綅*/
.tl{text-align: left;}
.tc{text-align: center;}
diff --git a/public/index.html b/public/index.html
index caded48..d706fbf 100644
--- a/public/index.html
+++ b/public/index.html
@@ -5,11 +5,13 @@
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
+ <link rel="stylesheet" href="/public//css/globalVariable.css">
<link rel="icon" type="image/png" href="<%= BASE_URL %>favicon.png" sizes="32x32" />
<link rel="stylesheet" href="/fonts/alibaba/iconfont.css">
<title><%= htmlWebpackPlugin.options.title %></title>
<style>
+
html,
body {
font-family: "Avenir", Helvetica, Arial, sans-serif;
@@ -61,6 +63,11 @@
color: #909399;
}
+ /* 鍏ㄥ眬鍙橀噺 */
+ :root {
+ --colorCard:#4E94FF;
+ }
+
/* reset */
html {
color: #000;
diff --git a/src/assets/css/globalVariable.scss b/src/assets/css/globalVariable.scss
new file mode 100644
index 0000000..b02a2b7
--- /dev/null
+++ b/src/assets/css/globalVariable.scss
@@ -0,0 +1,4 @@
+/* 鍏ㄥ眬鍙橀噺 */
+:root {
+ --colorCard:#4E94FF;
+}
\ No newline at end of file
diff --git a/src/pages/settings/index/index.vue b/src/pages/settings/index/index.vue
index 8a5d52e..6f35c34 100644
--- a/src/pages/settings/index/index.vue
+++ b/src/pages/settings/index/index.vue
@@ -1414,11 +1414,11 @@
}
}
.left-card-active {
- background-color: rgba(61, 104, 225, 1);
+ background-color: var(--colorCard);
color: #fff;
}
.left-card:hover {
- background-color: rgba(61, 104, 225, 1);
+ background-color: var(--colorCard);
color: #fff;
}
}
@@ -1474,7 +1474,7 @@
}
.account-card-active {
- background-color: rgba(61, 104, 225, 1);
+ background-color: var(--colorCard);
color: #fff;
}
}
diff --git a/src/pages/settings/views/NetSettings.vue b/src/pages/settings/views/NetSettings.vue
index 9b2d2cf..5cc0c70 100644
--- a/src/pages/settings/views/NetSettings.vue
+++ b/src/pages/settings/views/NetSettings.vue
@@ -591,11 +591,11 @@
}
}
.menu-item-active {
- background-color: #3d68e1;
+ background-color: var(--colorCard);
color: white;
}
.menu-item:hover {
- background-color: #3d68e1;
+ background-color: var(--colorCard);
color: white;
}
}
diff --git a/src/pages/settings/views/clusterManagement.vue b/src/pages/settings/views/clusterManagement.vue
index 9910df1..a104e68 100644
--- a/src/pages/settings/views/clusterManagement.vue
+++ b/src/pages/settings/views/clusterManagement.vue
@@ -644,11 +644,11 @@
padding: 0 20px;
}
.menu-item-active {
- background-color: #3d68e1;
+ background-color: var(--colorCard);
color: white;
}
.menu-item:hover {
- background-color: #3d68e1;
+ background-color: var(--colorCard);
color: white;
}
}
diff --git a/src/pages/settings/views/deviceInfo.vue b/src/pages/settings/views/deviceInfo.vue
index ebe0002..fec3ae0 100644
--- a/src/pages/settings/views/deviceInfo.vue
+++ b/src/pages/settings/views/deviceInfo.vue
@@ -3,43 +3,47 @@
<div class="general-set">
<div class="general-right">
<div class="lang" >
- <div class="bar">
+ <div class="general-title">
+ <span class="iconfont">{{info}}</span>
+ <span class="general-info">璁惧淇℃伅</span>
+ </div>
+ <div class=" info-bar">
<span class="name">璁惧ID</span>
<span class="desc">{{ deviceInfo.server_id }}</span>
</div>
- <div class="bar">
+ <div class=" info-bar">
<span class="name">璁惧鍨嬪彿</span>
<span class="desc">{{ deviceInfo.deviceModel }}</span>
</div>
- <div class="bar">
+ <div class=" info-bar">
<span class="name">璁惧绫诲瀷</span>
<span class="desc">{{ deviceInfo.deviceDesc }}</span>
</div>
- <div class="bar">
+ <div class=" info-bar">
<span class="name">閫氶亾涓暟</span>
<span class="desc">{{ deviceInfo.channelCount }}</span>
</div>
- <div class="bar">
+ <div class=" info-bar">
<span class="name">涓绘帶鐗堟湰</span>
<span class="desc">{{ deviceInfo.masterVersion }}</span>
</div>
- <div class="bar">
+ <div class=" info-bar">
<span class="name">web鐗堟湰</span>
<span class="desc">{{ deviceInfo.webVersion }}</span>
</div>
- <div class="bar">
+ <div class=" info-bar">
<span class="name">纭洏淇℃伅</span>
<span class="desc">{{ deviceInfo.disks }}</span>
</div>
- <div class="bar">
+ <div class=" info-bar">
<span class="name">CPU</span>
<span class="desc">{{ deviceInfo.cpu }}</span>
</div>
- <div class="bar">
+ <div class=" info-bar">
<span class="name">鍐呭瓨</span>
<span class="desc">{{ deviceInfo.memory }}</span>
</div>
- <div class="bar">
+ <div class=" info-bar">
<span class="name">杩愯鏃堕棿</span>
<span class="desc">{{ deviceInfo.runningTime }}</span>
</div>
@@ -58,6 +62,7 @@
return {
min_len: 0,
max_len: 0,
+ info:"\ue6e8",
fakeObj: {
min: 0,
max: 0,
@@ -122,7 +127,9 @@
flex: 1;
flex-basis: auto;
box-sizing: border-box;
- .general-center {
+ background-color: #F2F2F7;
+
+ /* .general-center {
height: 100%;
width: 280px;
overflow: auto;
@@ -157,15 +164,54 @@
background-color: #3d68e1;
color: white;
}
+ } */
+ .general-title {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-bottom:10px ;
+ height: 110px;
+ background-color: #fff;
+ .general-info {
+ margin-left: 10px;
+ font-size: 16px;
+ color:#333 ;
+ font-weight: 700;
+ }
+ .iconfont {
+ margin-right: 10px;
+ font-size: 40px;
+ }
}
+
+ .general-right .lang .info-bar {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom:10px ;
+ padding: 0 40px;
+ height: 45px;
+ color: #4F4F4F;
+ font-size: 16px !important;
+ font-weight: 700;
+ background-color: #fff;
+ .desc {
+ color: #4F4F4F;
+ font-size: 16px;
+ font-weight: 700;
+ }
+ &:hover {
+ background-color: #F8F8FF;
+ }
+ }
+
.general-right {
flex: 1;
flex-basis: auto;
overflow: auto;
box-sizing: border-box;
-
- padding: 20px 40px;
- .el-form-item.is-required:not(.is-no-asterisk)
+ padding: 10px 15px !important;
+ /* .el-form-item.is-required:not(.is-no-asterisk)
> .el-form-item__label:before,
.el-form-item.is-required:not(.is-no-asterisk)
.el-form-item__label-wrap
@@ -431,7 +477,7 @@
}
}
}
- }
+ } */
}
}
</style>
diff --git a/src/pages/settings/views/generalSettings.vue b/src/pages/settings/views/generalSettings.vue
index ba74441..b80b46c 100644
--- a/src/pages/settings/views/generalSettings.vue
+++ b/src/pages/settings/views/generalSettings.vue
@@ -1,6 +1,6 @@
<template>
<div class="all" ref="curPage">
- <div class="general-set">
+ <div class="general-seting">
<div class="general-center" ref="left">
<div
class="menu-item"
@@ -123,7 +123,7 @@
<div class="save-btn" @click="submitAlarm">淇濆瓨</div>
</div>
<div class="lang" v-if="activePage == 1">
- <div class="title">浜嬩欢澹伴煶</div>
+ <div class="bar title voice-title" style="border: 2px solid #fff;">浜嬩欢澹伴煶</div>
<div class="bar-group">
<div
class="bar"
@@ -133,32 +133,31 @@
ref="soundBar"
>
<div class="left-part">
- <span
- class="icon iconfont"
- style="margin-right: 12px; color: dodgerblue"
- ></span
- >
<span class="name">{{ item.name }}</span>
</div>
<div class="btns">
<span @click="togglePlay(item, i)">
+
+ <span class="iconfont" v-if="!item.isPlay" style="cursor: pointer;">{{playSpan}}</span>
+ <span class="iconfont" v-else style="cursor: pointer;">{{playSpan2}}</span>
+<!--
<i
v-if="!item.isPlay"
class="el-icon-video-play"
style=""
></i>
- <i v-else class="el-icon-video-pause"></i>
+ <i v-else class="el-icon-video-pause"></i> -->
</span>
<span
- class="icon iconfont"
- style="cursor: pointer; color: indianred"
+ class="icon iconfont del"
+ style="cursor: pointer;"
@click="removeSound(item)"
- ></span
+ >{{delspan}}</span
>
</div>
</div>
</div>
- <div v-if="showUpload" @click.stop>
+ <div v-if="showUpload" @click.stop >
<el-upload
class="upload-demo"
drag
@@ -166,14 +165,11 @@
:http-request="uploadSound"
:show-file-list="false"
>
- <i class="el-icon-upload"></i>
- <div class="el-upload__text">
- 浜嬩欢澹伴煶鏂囦欢鎷栧埌姝ゅ锛屾垨
- <em>鐐瑰嚮涓婁紶</em>
- <br />浠呮敮鎸乵p3/wma绛夋牸寮�
- </div>
- </el-upload>
+ <div class="info">璇峰皢澹伴煶浜嬩欢鏂囦欢鎷栨嫿鍒版澶勶紝鎴�<span class="info-click" >鐐瑰嚮涓婁紶</span></div>
+ <div class="des" v-if="showUpload" @click.stop>浠呮敮鎸乵p3銆亀av绛夋牸寮�</div>
+ </el-upload>
</div>
+
<div class="add-group">
<div class="add-btn">
@@ -202,6 +198,7 @@
class="entity-img"
v-for="(item, i) in realIconList"
:key="i"
+ @click="colorCard(item.color)"
>
<img :src="item.url" alt="" />
</div>
@@ -254,6 +251,10 @@
export default {
data() {
return {
+ playSpan:"\ue6e8",
+ playSpan2:"\ue6e8",
+ delspan:"\ue6e8",
+ warnSpn:"\ue6e8",
curPlayingIndex: null,
showUpload: false,
activeIcons: 0,
@@ -287,9 +288,9 @@
},
isPlay: false,
realIconList: [
- { url: "/images/settings/鏃ュ織绠＄悊.png" },
- { url: "/images/settings/瀹炴椂鐩戞帶.png" },
- { url: "/images/settings/鏁版嵁鍙鍖�.png" },
+ { url: "/images/settings/鏃ュ織绠＄悊.png",color:"green" },
+ { url: "/images/settings/瀹炴椂鐩戞帶.png",color:"yellow" },
+ { url: "/images/settings/鏁版嵁鍙鍖�.png",color:"pink" },
],
flatIconList: [
{ url: "/images/settings/鏁版嵁鎺ㄩ��.png" },
@@ -429,11 +430,18 @@
this.activeIcons = i;
},
removeSound(item) {
- this.$confirm("鎮ㄦ槸鍚︾‘璁ゅ垹闄や簨浠跺０闊�", "鍒犻櫎浜嬩欢澹伴煶", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning",
- }).then(() => {
+ const h = this.$createElement;
+ const icon =
+ this.$msgbox({
+ message: h('div', {style: 'display: flex; flex-direction: column; justify-content: center; align-items: center;'}, [
+ h('span',{class:'iconfont warn-icon'},`${this.warnSpn}`),
+ h('span', {class:'warn-title'}, '鍒犻櫎浜嬩欢澹伴煶 '),
+ h('span', {class:'warn-dec'}, '鎮ㄦ槸鍚︾‘璁ゅ垹闄や簨浠跺０闊�?')
+ ]),
+ showCancelButton: true,
+ confirmButtonText: '纭畾',
+ cancelButtonText: '鍙栨秷',
+ }).then(() => {
deleteSound({
id: item.id,
}).then(
@@ -455,10 +463,10 @@
},
clickSound(item, i) {
this.$refs["soundBar"].forEach((x) => {
- x.style.backgroundColor = "rgba(248, 248, 248, 1)";
+ x.style = "border: 2px solid #FFF;";
});
- this.$refs["soundBar"][i].style.backgroundColor =
- "rgba(233, 233, 233, 1)";
+ this.$refs["soundBar"][i].style =
+ "border: 2px solid #4E94FF;";
},
submitAlarm() {
saveAlarmConfig({
@@ -474,15 +482,21 @@
}
});
},
+ colorCard(color) {
+ document.documentElement.style.setProperty('--colorCard',`${color}`)
+ localStorage.setItem('--colorCard',`${color}`)
+ }
},
};
</script>
-<style lang="scss">
+
+<style scoped lang="scss">
+
.all {
width: 100%;
}
-.general-set {
+.general-seting {
height: 100%;
display: flex;
flex-direction: row;
@@ -491,39 +505,43 @@
box-sizing: border-box;
.general-center {
height: 100%;
- width: 280px;
+ width: 300px;
overflow: auto;
box-sizing: border-box;
flex-shrink: 0;
- padding: 10px;
- border-right: 5px solid #f8f8f8;
+ padding: 24px 10px;
+ border-right: 4px solid #F2F2F7;
+ background-color: #FBFAFF;
+
+
.menu-item {
- background-color: #f8f8f8;
- height: 50px;
- margin-bottom: 10px;
- border-radius: 10px;
- line-height: 50px;
+
+ height: 56px;
+ margin-bottom: 4px;
+ border-radius: 8px;
+ line-height: 56px;
box-sizing: border-box;
- font-size: 14px;
- padding: 0 20px;
+ font-size: 16px;
+ padding-left: 15px;
cursor: pointer;
display: flex;
.iconfont {
- margin-right: 8px;
+ margin: 0 17px;
+ font-size: 24px !important;
}
.title {
- font-size: 15px;
+ font-size: 16px;
+ font-weight: 700;
}
}
.menu-item-active {
- background-color: #3d68e1;
- color: white;
+ background-color: var(--colorCard) !important;
+ color: white !important;
}
- .menu-item:hover {
- background-color: #3d68e1;
- color: white;
- }
+ /* .menu-item:hover {
+ background-color: #F2F2F7;
+ } */
}
.general-right {
flex: 1;
@@ -531,7 +549,7 @@
overflow: auto;
box-sizing: border-box;
- padding: 20px 40px;
+ padding: 10px 18px 10px 10px;
.el-form-item.is-required:not(.is-no-asterisk)
> .el-form-item__label:before,
.el-form-item.is-required:not(.is-no-asterisk)
@@ -573,36 +591,35 @@
text-align: left;
margin-bottom: 5px;
}
+ .voice-title {
+ justify-content: center !important;
+ font-weight: 700 ;
+ }
.bar-group {
overflow: auto;
- height: 100%;
+ height: 520px;
}
.bar {
- height: 44px;
+ height: 48px;
background-color: #f8f8f8;
border-radius: 10px;
- line-height: 44px;
+ line-height: 48px;
box-sizing: border-box;
- padding: 0 30px 0 20px;
+ padding: 0 20px 0 20px;
+ font-weight: 700;
display: flex;
justify-content: space-between;
- margin-bottom: 10px;
- .left-part {
- .icon {
- color: rgba(191, 191, 191, 1);
- font-size: 16px;
- margin-right: 5px;
- }
- }
+ margin-bottom: 2px;
+ border: 2px solid #fff;
.name {
- font-size: 15px;
- }
+ font-size: 14px;
+ }
.btns {
- width: 50px;
+ width: 52px;
display: flex;
justify-content: space-between;
color: rgba(191, 191, 191, 1);
- .el-icon-video-pause {
+ /* .el-icon-video-pause {
cursor: pointer;
font-size: 23px;
vertical-align: middle;
@@ -613,6 +630,12 @@
font-size: 23px;
vertical-align: middle;
color: #409eff;
+ } */
+ span {
+ color: #333
+ }
+ .del:hover {
+ color:#FC4958;
}
}
.desc {
@@ -620,11 +643,11 @@
color: rgba(134, 134, 134, 1);
}
}
- .bar:hover {
- background-color: rgba(233, 233, 233, 1);
- }
+ /* .bar:hover {
+ border: 2px solid #4E94FF !important;
+ } */
.add-group {
- margin: 10px auto;
+ margin: 54px auto;
width: fit-content;
}
.upload-demo {
@@ -644,7 +667,7 @@
cursor: pointer;
width: fit-content;
.icon {
- font-size: 32px;
+ font-size: 40px;
color: rgba(61, 104, 225, 1);
}
}
@@ -800,4 +823,110 @@
}
}
}
+.v-modal {
+ opacity:0.35 !important;
+ border-radius: 8px !important;
+}
+
+.el-message-box {
+position: absolute;
+width: 420px;
+height: 210px;
+left: 302px;
+top: 279px;
+
+background: #FFFFFF;
+border-radius: 8px;
+}
+
+.upload-demo {
+top: 452px;
+left: 2px !important;
+width: 452px;
+height: 150px;
+background: #FFFFFF;
+box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1);
+border-radius: 8px;
+
+::v-deep .el-upload-dragger {
+display: flex;
+justify-content: center;
+align-items: center;
+overflow: visible;
+width: 340px;
+height: 72px;
+margin-top:30px ;
+}
+
+
+.info {
+
+font-weight: bold;
+font-size: 14px;
+color: #828282;
+}
+
+.info-click {
+ color: #4E94FF;
+ text-decoration: underline;
+}
+
+}
+
+.des {
+ position: absolute;
+ top: 78px;
+ left: 109px;
+ z-index: 999;
+ color: #4F4F4F;
+ font-weight: bold;
+ font-size: 12px;
+}
+
+</style>
+
+<style lang="scss">
+.el-message-box {
+ .warn-icon {
+ color:rgba(254, 109, 104, 1) ;
+ font-size: 50px;
+ margin-top:26px ;
+ }
+ .warn-title {
+ font-weight: bold;
+ font-size: 16px;
+ margin: 5px;
+ }
+ .warn-dec {
+ font-weight: bold;
+ font-size: 14px;
+ color: #828282;
+ }
+ .el-message-box__btns {
+ display: flex;
+ justify-content: center;
+ margin-top: 10px;
+ button {
+ width: 175px;
+ height: 40px;
+ border-radius: 25px;
+ span {
+ font-size: 16px;
+ font-weight: 700;
+ }
+ }
+ button:first-child {
+ background-color: #E0E0E0;
+ span {
+ color: #333333;
+ }
+ }
+ button:last-child {
+ background-color: #4E94FF !important;
+ span {
+ color: #fff;
+ }
+ }
+ }
+}
</style>
diff --git a/src/pages/settings/views/keyboardLanguage.vue b/src/pages/settings/views/keyboardLanguage.vue
index 396f128..77ed72e 100644
--- a/src/pages/settings/views/keyboardLanguage.vue
+++ b/src/pages/settings/views/keyboardLanguage.vue
@@ -16,7 +16,7 @@
</div>
<div class="language-right">
<div class="lang" v-if="activePage == 0">
- <div class="title">璇█鍒楄〃</div>
+ <div class="bar title">璇█鍒楄〃</div>
<div
class="bar"
v-for="(item, i) in langList"
@@ -26,14 +26,14 @@
<span class="name">{{ item.Name }}</span>
<span
class="icon iconfont"
- style="color: #3d68e1;font-size:18px;"
+ style="color: #4E94FF;font-size:16px;"
v-show="activeLang == item.Lang"
></span
>
</div>
</div>
<div class="lang" v-if="activePage == 1">
- <div class="title">閿洏甯冨眬</div>
+ <div class="title bar">閿洏甯冨眬</div>
<div
class="bar"
v-for="(item, i) in keyboardList"
@@ -43,7 +43,7 @@
<span class="name">{{ item.name }}</span>
<span
class="icon iconfont"
- style="color: #3d68e1;font-size:18px;"
+ style="color: #4E94FF;font-size:16px;"
v-show="activeKb == item.id"
></span
>
@@ -155,6 +155,7 @@
}
.kb-content {
+ font-weight: 700;
height: 100%;
display: flex;
flex-direction: row;
@@ -163,37 +164,39 @@
box-sizing: border-box;
.kb-center {
height: 100%;
- width: 280px;
+ width: 300px;
overflow: auto;
box-sizing: border-box;
flex-shrink: 0;
- padding: 10px;
- border-right: 5px solid #f8f8f8;
+ padding: 24px 10px 0px 10px;
+ background-color: #FBFAFF;
+ border-right: 4px solid #F2F2F7;
.menu-item {
- background-color: #f8f8f8;
- height: 50px;
- margin-bottom: 10px;
+ /* background-color: #F2F2F7; */
+ height: 56px;
+ margin-bottom: 4px;
border-radius: 8px;
- line-height: 50px;
+ line-height: 56px;
box-sizing: border-box;
- font-size: 14px;
padding: 0 20px;cursor: pointer;
display: flex;
align-items: center;
+ color: #333;
.title {
- font-size: 15px;
+ font-size: 16px;
+ font-weight: 700;
}
.iconfont {
- margin-right: 8px;
- font-size: 18px;
+ margin: 15px;
+ font-size: 24px;
}
}
.menu-item-active {
- background-color: #3d68e1;
+ background-color: var(--colorCard);
color: white;
}
.menu-item:hover {
- background-color: #3d68e1;
+ background-color: var(--colorCard);
color: white;
}
}
@@ -203,7 +206,7 @@
overflow: auto;
box-sizing: border-box;
position: relative;
- padding: 20px 40px;
+ padding: 10px;
.el-form-item.is-required:not(.is-no-asterisk)
> .el-form-item__label:before,
.el-form-item.is-required:not(.is-no-asterisk)
@@ -236,29 +239,30 @@
max-width: none !important;
}
.lang {
- .title {
- height: 30px;
- line-height: 30px;
- font-size: 16px;
- margin-bottom: 10px;
- }
.bar {
height: 48px;
background-color: #f8f8f8;
- border-radius: 10px;
+ border-radius: 8px;
line-height: 50px;
- box-sizing: border-box;
- padding: 0 20px;
+ box-sizing: content-box;
+ padding: 0 15px 0 20px;
display: flex;
justify-content: space-between;
cursor: pointer;
- margin-bottom: 12px;
+ margin-bottom: 4px;
+ border: 2px solid #f8f8f8;
.name{
- font-size: 15px;
+ font-size: 14px;
}
}
.bar:hover{
- background-color: #e9e9e9;
+ border: 2px solid #4E94FF;
+ }
+ .title {
+ cursor:default ;
+ font-size: 16px;
+ justify-content: center;
+ border: 2px solid #f8f8f8 !important;
}
}
.save-btn {
diff --git a/src/pages/vindicate/index/App.vue b/src/pages/vindicate/index/App.vue
index a82f94f..eb915de 100644
--- a/src/pages/vindicate/index/App.vue
+++ b/src/pages/vindicate/index/App.vue
@@ -52,6 +52,12 @@
full: 0,
};
},
+ created() {
+ let color = localStorage.getItem('--colorCard')
+ if(color) {
+ document.documentElement.style.setProperty('--colorCard',`${color}`)
+ }
+ },
mounted() {
const menu = getUrlKey("menu");
if (menu) {
@@ -125,7 +131,7 @@
}
.left-card-active {
color: #fff;
- background-color: #4E94FF;
+ background-color: var(--colorCard);
.icon_black {
visibility: hidden;
}
@@ -139,7 +145,7 @@
}
.left-card:hover {
- background-color: #4E94FF;
+ background-color: var(--colorCard);
color: #fff;
.iconfont {
color: #333333;
diff --git a/src/pages/vindicate/views/backUp.vue b/src/pages/vindicate/views/backUp.vue
index b9537aa..2f3071f 100644
--- a/src/pages/vindicate/views/backUp.vue
+++ b/src/pages/vindicate/views/backUp.vue
@@ -184,11 +184,11 @@
}
.menu-item-active {
color: #fff;
- background-color: rgba(61, 104, 225, 1);
+ background-color: var(--colorCard);
}
.menu-item:hover {
color: #fff;
- background-color: rgba(61, 104, 225, 1);
+ background-color: var(--colorCard);
}
}
.backup-right {
diff --git a/src/pages/vindicate/views/updateSettings.vue b/src/pages/vindicate/views/updateSettings.vue
index 73b3fe4..263af29 100644
--- a/src/pages/vindicate/views/updateSettings.vue
+++ b/src/pages/vindicate/views/updateSettings.vue
@@ -364,7 +364,7 @@
}
}
.menu-item-active {
- background-color: #4E94FF;
+ background-color: var(--colorCard);
.iconfont {
color: #fff !important;
}
@@ -373,7 +373,7 @@
}
}
.menu-item:hover {
- background-color: #4E94FF;
+ background-color: var(--colorCard);
.iconfont {
color: #fff;
}
diff --git a/vue.config.js b/vue.config.js
index 850cc39..9710019 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -125,5 +125,12 @@
changeOrigin: true, //寮�鍚唬鐞�
}
}
- }
+ },
+ /* css:{
+ loaderOptions:{
+ scss:{
+ prependData:`@import"@/assets/css/globalVariable.scss"`
+ }
+ }
+ } */
}
--
Gitblit v1.8.0