From dff9fb32c1bac52d378a6d196f670b92610c01d3 Mon Sep 17 00:00:00 2001
From: ZZJ <zzjdsg2300@163.com>
Date: 星期四, 16 十二月 2021 17:21:49 +0800
Subject: [PATCH] 自适应2
---
src/pages/settings/views/generalSettings.vue | 86 ++++++++++++++++++++++++++++++-------------
1 files changed, 60 insertions(+), 26 deletions(-)
diff --git a/src/pages/settings/views/generalSettings.vue b/src/pages/settings/views/generalSettings.vue
index b2cd669..4b6f2a1 100644
--- a/src/pages/settings/views/generalSettings.vue
+++ b/src/pages/settings/views/generalSettings.vue
@@ -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},'*')
}
},
};
@@ -582,10 +604,12 @@
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;
@@ -619,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)
@@ -634,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;
@@ -662,16 +687,23 @@
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: calc(100% - 132px);
+ height: calc(100% - 100px);
.general-bar {
height: 48px;
- background-color: #f8f8f8;
+ background: #F2F2F7;
border-radius: 10px;
line-height: 48px;
box-sizing: border-box;
@@ -680,7 +712,8 @@
display: flex;
justify-content: space-between;
margin-bottom: 2px;
- border: 2px solid #fff;
+ border:2px solid #F2F2F7;
+ margin-bottom: 4px;
.name {
font-size: 14px;
}
@@ -860,7 +893,7 @@
height: 30px;
border-radius:50% ;
background-color: #fff;
- padding: 3px;
+ padding: 4px;
.color-option-content {
width: 100%;
height: 100%;
@@ -1112,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;
@@ -1121,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 {
--
Gitblit v1.8.0