From 1e09a7a01a6c1888e1a2a832eb007fb8c2b653a0 Mon Sep 17 00:00:00 2001
From: ZZJ <zzjdsg2300@163.com>
Date: 星期三, 26 一月 2022 11:06:27 +0800
Subject: [PATCH] Merge branch 'bhomebus' of http://192.168.5.5:10010/r/web/vue-smart-ai into bhomebus
---
src/pages/settings/views/generalSettings.vue | 150 +++++++++++++++++++++++++++++++-------------------
1 files changed, 93 insertions(+), 57 deletions(-)
diff --git a/src/pages/settings/views/generalSettings.vue b/src/pages/settings/views/generalSettings.vue
index fa4e6d4..4b6f2a1 100644
--- a/src/pages/settings/views/generalSettings.vue
+++ b/src/pages/settings/views/generalSettings.vue
@@ -139,7 +139,7 @@
</div>
<div class="bar-group">
<div
- class="bar"
+ class="general-bar"
v-for="(item, i) in soundList"
:key="i"
@click="clickSound(item, i)"
@@ -148,7 +148,7 @@
<div class="left-part">
<span class="name">{{ item.name }}</span>
</div>
- <div class="btns">
+ <div class="sound-btns">
<span @click="togglePlay(item, i)">
<span
class="iconfont"
@@ -216,13 +216,13 @@
>
<div class="color-option"
v-if="universalColor != index"
- :style="{cursor: pointer,backgroundColor:item.color}"
+ :style="{cursor: 'pointer',backgroundColor:item.color}"
@click="colorCard(item.color,index)"
/>
<div class="color-option color-option-active"
v-else
- :style="{cursor: pointer,border:`2px solid ${item.color}`}"
+ :style="{cursor: 'pointer',border:`2px solid ${item.color}`}"
@click="colorCard(item.color,index)">
<div
:style="{backgroundColor:item.color}"
@@ -298,7 +298,9 @@
<script>
import { saveAlarmConfig, getDevInfo } from "@/api/system";
import { uploadSound, getSoundList, deleteSound } from "@/api/event";
-
+import {
+ updateUser,
+} from "@/api/user";
export default {
data() {
return {
@@ -349,9 +351,9 @@
{ url: "/images/settings/绯荤粺璁剧疆.png" },
],
tableBGList: [
- { name: "background", url: "/images/settings/background.png" },
- { name: "message", url: "/images/settings/鏁版嵁鎺ㄩ��.png" },
- { name: "weather", url: "/images/settings/绯荤粺璁剧疆.png" },
+ { name: "background", url: "/images/desktop/background.png" },
+ { name: "message", url: "/images/desktop/message.png" },
+ { name: "weather", url: "/images/desktop/weather.png" },
],
universalColor:'',
colorList: [
@@ -377,11 +379,12 @@
_this.curPlayingIndex = null;
}
});
- const url = localStorage.getItem("backgroundPic");
+ const url = this.curUser.backgroundpic;
+ this.activeIcons = this.curUser.useIconType-1
if (url) {
- const arr = url.split("/");
+ // const arr = url.split("/");
this.activeBg = this.tableBGList.findIndex((x) => {
- return x.url.includes(arr[arr.length - 1]);
+ return x.url == url;
});
} else {
this.activeBg = 0;
@@ -403,6 +406,10 @@
max_video_len() {
return Math.round(this.fakeObj.max * 1.2);
},
+ curUser() {
+ const info = JSON.parse(sessionStorage.getItem("userInfo"));
+ return info;
+ },
},
methods: {
formatTooltip(v) {
@@ -411,12 +418,16 @@
pickBg(item, i) {
this.activeBg = i;
let message = "changeBackground?" + item.name;
- window.parent.postMessage(
- {
- msg: message,
- },
- "*"
- );
+ window.parent.postMessage( {msg: message, }, "*" );
+ updateUser({
+ id: this.curUser.id,
+ backgroundpic: item.url,
+ }).then((res) => {
+ if (res.success) {
+ sessionStorage.setItem("userInfo", JSON.stringify(res.data))
+ this.$message.success(res.msg);
+ }
+ });
this.$forceUpdate()
},
togglePlay(item, i) {
@@ -492,6 +503,16 @@
},
selectIcons(i) {
this.activeIcons = i;
+ updateUser({
+ id: this.curUser.id,
+ iconType: i+1,
+ }).then((res) => {
+ if (res.success) {
+ window.parent.postMessage({ msg: "AppUpdate" }, "*");
+ sessionStorage.setItem("userInfo", JSON.stringify(res.data))
+ this.$message.success(res.msg);
+ }
+ });
},
removeSound(item) {
const h = this.$createElement;
@@ -556,6 +577,7 @@
this.universalColor = index
document.documentElement.style.setProperty('--colorCard',`${color}`)
localStorage.setItem('--colorCard',`${color}`)
+ window.parent.postMessage({msg:'changeColor',color},'*')
}
},
};
@@ -573,16 +595,21 @@
flex: 1;
flex-basis: auto;
box-sizing: border-box;
+ .el-input__inner {
+ height: 24px !important;
+}
.general-center {
height: 100%;
width: 300px;
overflow: auto;
box-sizing: border-box;
flex-shrink: 0;
- padding: 24px 10px;
+ padding: 10px 10px;
+ padding-top: 6px;
border-right: 4px solid #f2f2f7;
+ border-top: 4px solid #f2f2f7;
+ border-left: 4px solid #f2f2f7;
background-color: #fbfaff;
-
.menu-item {
height: 56px;
margin-bottom: 4px;
@@ -616,8 +643,9 @@
overflow: auto;
box-sizing: border-box;
background-color: rgb(251, 250, 255);
+ border-top: 4px solid #f2f2f7;
- padding: 10px 18px 10px 10px;
+ padding: 6px 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)
@@ -631,7 +659,7 @@
.el-form-item {
margin-bottom: 10px;
height: 50px;
- background: #f8f8f8;
+ background: #F2F2F7;
padding: 4px 20px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
@@ -659,35 +687,42 @@
text-align: left;
margin-bottom: 5px;
}
- .voice-title {
+ .bar.title.voice-title {
justify-content: center !important;
+ text-align: center;
font-weight: 700;
- }
+ border: none;
+ background: #F2F2F7;
+ border-radius: 8px;
+ height: 48px;
+ margin-bottom: 4px;
+ border:2px solid #F2F2F7 !important;
+ }
.bar-group {
overflow: auto;
- height: 400px;
- }
- .bar {
- height: 48px;
- background-color: #f8f8f8;
- border-radius: 10px;
- line-height: 48px;
- box-sizing: border-box;
- padding: 0 20px 0 20px;
- font-weight: 700;
- display: flex;
- justify-content: space-between;
- margin-bottom: 2px;
- border: 2px solid #fff;
- .name {
- font-size: 14px;
- }
- .btns {
- width: 52px;
+ height: calc(100% - 100px);
+ .general-bar {
+ height: 48px;
+ background: #F2F2F7;
+ border-radius: 10px;
+ line-height: 48px;
+ box-sizing: border-box;
+ padding: 0 20px 0 20px;
+ font-weight: 700;
display: flex;
justify-content: space-between;
- color: rgba(191, 191, 191, 1);
- /* .el-icon-video-pause {
+ margin-bottom: 2px;
+ border:2px solid #F2F2F7;
+ margin-bottom: 4px;
+ .name {
+ font-size: 14px;
+ }
+ .sound-btns {
+ width: 52px;
+ display: flex;
+ justify-content: space-between;
+ color: rgba(191, 191, 191, 1);
+ /* .el-icon-video-pause {
cursor: pointer;
font-size: 23px;
vertical-align: middle;
@@ -699,18 +734,20 @@
vertical-align: middle;
color: #409eff;
} */
- span {
- color: #333;
+ span {
+ color: #333;
+ }
+ .del:hover {
+ color: #fc4958;
+ }
}
- .del:hover {
- color: #fc4958;
+ .desc {
+ font-size: 14px;
+ color: rgba(134, 134, 134, 1);
}
- }
- .desc {
- font-size: 14px;
- color: rgba(134, 134, 134, 1);
}
}
+
/* .bar:hover {
border: 2px solid #4E94FF !important;
} */
@@ -856,7 +893,7 @@
height: 30px;
border-radius:50% ;
background-color: #fff;
- padding: 3px;
+ padding: 4px;
.color-option-content {
width: 100%;
height: 100%;
@@ -1108,7 +1145,7 @@
.videoTime .el-input-number.el-input-number--small {
width: 90px;
- height: 24px;
+ height: 24px !important;
border-radius: 4px;
line-height: 24px !important;
font-weight: 700 !important;
@@ -1117,6 +1154,7 @@
.videoTime .el-input-number.el-input-number--small .el-input__inner {
font-size: 12px !important;
+height: 24px !important;
}
.el-input-number__decrease {
@@ -1144,9 +1182,7 @@
color: #4E94FF;
}
-.el-input__inner {
- height: 24px !important;
-}
+
/* .el-tooltip__popper {
--
Gitblit v1.8.0