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 | 686 +++++++++++++++++++++++++++++++++++++++++++++----------- 1 files changed, 550 insertions(+), 136 deletions(-) diff --git a/src/pages/settings/views/generalSettings.vue b/src/pages/settings/views/generalSettings.vue index 62220d2..4b6f2a1 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" @@ -58,7 +58,7 @@ <span class="desc">{{ deviceInfo.runningTime }}</span> </div> </div> --> - <div class="lang" v-if="activePage == 0"> + <div class="lang videoTime" v-if="activePage == 0"> <div class="min-dur"> <div class="title">鎶撴媿鍓嶅綍鍍忔椂闀�</div> <div class="entity"> @@ -73,10 +73,11 @@ @input="min_len = min_video_len" show-stops :show-tooltip="true" + tooltip-class="toolClass" :format-tooltip="formatTooltip" ></el-slider> </div> - <el-input-number + <!-- <el-input-number v-model="min_len" @change="fakeObj.min = +(min_len / 1.2)" controls-position="right" @@ -86,7 +87,17 @@ step-strictly size="small" ></el-input-number - > s + > s --> + + <el-input-number + v-model="min_len" + @change="fakeObj.min = +(min_len / 1.2)" + :min="5" + :step="5" + :max="120" + step-strictly + size="small" + ></el-input-number> s </div> </div> <div class="min-dur"> @@ -109,7 +120,6 @@ <el-input-number v-model="max_len" @change="fakeObj.max = +(max_len / 1.2)" - controls-position="right" :min="5" :step="5" step-strictly @@ -117,43 +127,53 @@ size="small" ></el-input-number > s + </div> </div> <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" + class="general-bar" v-for="(item, i) in soundList" :key="i" @click="clickSound(item, i)" 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"> + <div class="sound-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> --> + + <img v-else src="/images/settings/鏆傚仠.png" alt="" style="width:16px;hight:16px;cursor: pointer;margin-top:15px;"> + <!-- <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> @@ -166,11 +186,13 @@ :http-request="uploadSound" :show-file-list="false" > - <i class="el-icon-upload"></i> - <div class="el-upload__text"> - 浜嬩欢澹伴煶鏂囦欢鎷栧埌姝ゅ锛屾垨 - <em>鐐瑰嚮涓婁紶</em> - <br />浠呮敮鎸乵p3/wma绛夋牸寮� + <div class="info"> + 璇峰皢澹伴煶浜嬩欢鏂囦欢鎷栨嫿鍒版澶勶紝鎴�<span class="info-click" + >鐐瑰嚮涓婁紶</span + > + </div> + <div class="des" v-if="showUpload" @click.stop> + 浠呮敮鎸乵p3銆亀av绛夋牸寮� </div> </el-upload> </div> @@ -185,15 +207,41 @@ </div> <div class="self-setting" v-if="activePage == 2"> - <div class="top-title">鍥炬爣涓婚</div> + <div class="top-title">棰滆壊涓婚</div> + <div class="color-bar"> + <div + v-for="(item,index) in colorList" + :key="index" + style="border:none;" + > + <div class="color-option" + v-if="universalColor != index" + :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}`}" + @click="colorCard(item.color,index)"> + <div + :style="{backgroundColor:item.color}" + class="color-option-content"> + </div> + + </div> + </div> + </div> + + + + <div class="top-title">鍥炬爣涓婚</div> <div class="icon-bar" style="cursor: pointer" @click="selectIcons(0)"> <div class="bar-title"> <span class="title">鎵佸钩鍐欏疄鍥炬爣</span> <span class="icon iconfont" - style="color: #3d68e1; font-size: 18px" - v-show="activeIcons == 0" + :class="activeIcons == 0 ? 'icon-active' : 'icon-normal'" ></span > </div> @@ -212,8 +260,7 @@ <span class="title">鎵佸钩鍖栧浘鏍�</span> <span class="icon iconfont" - style="color: #3d68e1; font-size: 18px" - v-show="activeIcons == 1" + :class="activeIcons == 1 ? 'icon-active' : 'icon-normal'" ></span > </div> @@ -227,13 +274,14 @@ </div> </div> </div> + <div class="top-title">妗岄潰鑳屾櫙涓婚</div> <div class="bg-bar"> <div class="bg-list"> <div - class="bg-img" - :class="activeBg == i ? 'bg-list-active' : ''" v-for="(item, i) in tableBGList" + class="bg-img" + :class="activeBg == i ? 'bg-list-active' : ''" :key="i" @click="pickBg(item, i)" > @@ -250,10 +298,16 @@ <script> import { saveAlarmConfig, getDevInfo } from "@/api/system"; import { uploadSound, getSoundList, deleteSound } from "@/api/event"; - +import { + updateUser, +} from "@/api/user"; export default { data() { return { + playSpan: "\ue75e", + playSpan2: "\ue75f", + delspan: "\ue715", + warnSpn: "\ue71c", curPlayingIndex: null, showUpload: false, activeIcons: 0, @@ -265,9 +319,9 @@ }, menuArr: [ // { name: "璁惧淇℃伅", icon: "\ue933" ,size:18}, - { name: "浜嬩欢褰曞儚鏃堕暱", icon: "\ue6f3", size: 20 }, - { name: "浜嬩欢澹伴煶", icon: "\ue6e1", size: 16 }, - { name: "涓�у寲璁剧疆", icon: "\ue756", size: 18 }, + { name: "浜嬩欢褰曞儚鏃堕暱", icon: "\ue74f", size: 20 }, + { name: "浜嬩欢澹伴煶", icon: "\ueb5e", size: 16 }, + { name: "涓�у寲璁剧疆", icon: "\ue750", size: 18 }, ], soundList: [], activePage: 0, @@ -287,9 +341,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" }, @@ -297,10 +351,22 @@ { 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: [ + {name:1 ,color:"#FC6B9E"}, + {name:2 ,color:"#F38F56"}, + {name:3 ,color:"#FDD33A"}, + {name:4 ,color:"#53D999"}, + {name:5 ,color:"#21CDB2"}, + {name:6 ,color:"#61E2EB"}, + {name:7 ,color:"#4E94FF"}, + {name:8 ,color:"#8E8CD8"}, + {name:9 ,color:"#4C4A48"}, + ] }; }, mounted() { @@ -313,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; @@ -339,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) { @@ -347,12 +418,17 @@ 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) { if (this.curPlayingIndex !== null) { @@ -427,12 +503,36 @@ }, 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) { - this.$confirm("鎮ㄦ槸鍚︾‘璁ゅ垹闄や簨浠跺0闊�", "鍒犻櫎浜嬩欢澹伴煶", { + const h = this.$createElement; + const icon = this.$msgbox({ + title: "", + message: h( + "div", + { + style: + "display: flex; flex-direction: column; justify-content: center; align-items: center;", + }, + [ + h("span", { class: "icon iconfont warn-icon" }, `${this.warnSpn}`), + h("span", { class: "warn-title" }, "鍒犻櫎浜嬩欢澹伴煶 "), + h("span", { class: "warn-dec" }, "鎮ㄦ槸鍚︾‘璁ゅ垹闄や簨浠跺0闊�?"), + ] + ), + showCancelButton: true, confirmButtonText: "纭畾", cancelButtonText: "鍙栨秷", - type: "warning", }).then(() => { deleteSound({ id: item.id, @@ -455,10 +555,9 @@ }, 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,55 +573,68 @@ } }); }, + colorCard(color,index) { + this.universalColor = index + document.documentElement.style.setProperty('--colorCard',`${color}`) + localStorage.setItem('--colorCard',`${color}`) + window.parent.postMessage({msg:'changeColor',color},'*') + } }, }; </script> -<style lang="scss"> + +<style scoped lang="scss"> .all { width: 100%; } -.general-set { +.general-seting { height: 100%; display: flex; flex-direction: row; flex: 1; flex-basis: auto; box-sizing: border-box; + .el-input__inner { + height: 24px !important; +} .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: 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 { - 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; + background-color: #F2F2F7; } } .general-right { @@ -530,8 +642,10 @@ flex-basis: auto; overflow: auto; box-sizing: border-box; + background-color: rgb(251, 250, 255); + border-top: 4px solid #f2f2f7; - padding: 20px 40px; + 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) @@ -545,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; @@ -573,36 +687,42 @@ text-align: left; margin-bottom: 5px; } + .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: 100%; - } - .bar { - height: 44px; - background-color: #f8f8f8; - border-radius: 10px; - line-height: 44px; - box-sizing: border-box; - padding: 0 30px 0 20px; - display: flex; - justify-content: space-between; - margin-bottom: 10px; - .left-part { - .icon { - color: rgba(191, 191, 191, 1); - font-size: 16px; - margin-right: 5px; - } - } - .name { - font-size: 15px; - } - .btns { - width: 50px; + 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; @@ -613,18 +733,26 @@ font-size: 23px; vertical-align: middle; color: #409eff; + } */ + span { + color: #333; + } + .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 { - 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 { @@ -632,7 +760,6 @@ transition: all 0.5s; position: absolute; bottom: -40px; - left: calc(50% - 145px); .el-upload-dragger { width: 290px; @@ -645,31 +772,32 @@ cursor: pointer; width: fit-content; .icon { - font-size: 32px; - color: rgba(61, 104, 225, 1); + font-size: 40px; + color: var(--colorCard); } } .min-dur { box-sizing: border-box; padding: 0 20px; - background-color: rgba(248, 248, 248, 1); + background-color: #F2F2F7; height: 105px; - margin-bottom: 20px; + margin-bottom: 4px; border-radius: 15px; .title { + color: #333; height: 45px; line-height: 45px; - text-align: left; box-sizing: border-box; padding: 0 6px; - font-size: 14px; + font-size: 16px; + font-weight: 700; } } - .min-dur:hover { + /* .min-dur:hover { background-color: rgba(233, 233, 233, 1); - } + } */ .entity { display: flex; @@ -680,8 +808,8 @@ min-width: 30px; line-height: 80px; margin-right: 10px; - color: rgba(120, 120, 120, 1); - font-size: 14px; + color:#333 ; + font-size: 8px; } .block { flex: 1; @@ -719,34 +847,67 @@ } } .save-btn { - background-color: #3d68e1; - width: 240px; + background-color: var(--colorCard); + width: 180px; height: 40px; margin: 0 auto; - border-radius: 10px; + border-radius: 25px; color: #fff; line-height: 40px; cursor: pointer; - font-size: 14px; - margin-top: 20px; + font-size: 16px; + font-weight: 700; + margin-top: 55px; } .self-setting { .top-title { + text-align: left; font-size: 16px; - height: 30px; - line-height: 30px; margin-bottom: 10px; + font-weight: 700; + margin-top: 20px; } - .icon-bar:hover { + /* .icon-bar:hover { background-color: rgba(233, 233, 233, 1); + } */ + .color-bar { + display: flex; + justify-content: center; + align-items: center; + width: 412px; + height: 96px; + background-color: #fff; + border-radius: 8px; + padding-left:7px ; + .color-option { + margin-right:12px ; + width: 30px; + height: 30px; + border-radius:50% ; + } + + .color-option-active { + box-sizing: border-box; + margin-right:12px ; + width: 30px; + height: 30px; + border-radius:50% ; + background-color: #fff; + padding: 4px; + .color-option-content { + width: 100%; + height: 100%; + border-radius:50% ; + } + } } .icon-bar { cursor: pointer; - background-color: rgba(248, 248, 248, 1); box-sizing: border-box; - padding: 15px 25px; - border-radius: 12px; - margin-bottom: 12px; + padding: 15px 13px 14px 20px; + background: #F2F2F7; + border-radius: 8px; + margin-bottom: 10px; .bar-title { line-height: 20px; height: 20px; @@ -755,10 +916,20 @@ justify-content: space-between; .title { font-size: 14px; + font-weight: 700; + } + .icon-active { + font-size: 16px; + color: var(--colorCard); + } + .icon-normal { + font-size: 16px; + color: #E0E0E0; } } .entity { display: flex; + margin-left:5px ; .entity-img { background-color: rgba(248, 248, 248, 1); width: 50px; @@ -772,7 +943,7 @@ } } .bg-bar { - background-color: rgba(248, 248, 248, 1); + background-color: #F2F2F7; box-sizing: border-box; padding: 15px 25px; border-radius: 12px; @@ -783,22 +954,265 @@ margin-right: 12px; cursor: pointer; // width: 120px; - height: 80px; + height: 66px; border: 2px solid transparent; img { border-radius: 5px; height: 100%; } } - .bg-img:hover { + /* .bg-img:hover { border: 2px solid yellow; - } + } */ .bg-list-active { - border: 2px solid yellow; + border: 2px solid var(--colorCard); + border-radius: 8px; } } } } } } +.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-click { + color: var(--colorCard); + text-decoration: underline; +} + + .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 { + padding-bottom: 20px !important; + border-radius: 8px !important; + .el-message-box__content { + color: #333333; + padding: 0; + font-size: 14px; + } + .warn-icon { + color: #fe6d68; + font-size: 40px; + margin-top: 11px; + } + .warn-title { + font-weight: bold; + font-size: 16px; + margin: 6px; + line-height: 22px; + } + .warn-dec { + font-weight: bold; + font-size: 14px; + color: #828282; + line-height: 20px; + } + .el-message-box__headerbtn { + top: 12px; + } + .el-message-box__headerbtn .el-message-box__close { + color: #333333; + font-weight: bold; + } + .el-message-box__btns { + display: flex; + justify-content: center; + margin-top: 20px; + .el-button:focus, + .el-button:hover { + background-color: none; + border: none; + } + button { + width: 175px; + height: 40px; + border-radius: 25px; + span { + font-size: 16px; + font-weight: 700; + } + &:hover { + border: 1px solid var(--colorCard) !important; + } + } + button:first-child { + background-color: #e0e0e0; + span { + color: #333333; + } + } + button:last-child { + background-color: var(--colorCard) !important; + border: 1px solid var(--colorCard) !important; + span { + color: #fff; + } + } + } +} +</style> + +<style> + +.videoTime .el-slider__button { + margin-top: -25px !important; + border: none !important; + +} + +.videoTime .el-slider__button::after { + display: block; + position: relative; +content: "\e75d"; + color: var(--colorCard); + font-family: "iconfont" !important; + font-size: 16px; + font-style: normal; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.videoTime .el-tooltip { +background-color: #F2F2F7 !important; + border: none !important; +} + +.videoTime .el-slider__runway { + background-color: #fff !important; + height: 3px !important; +} + +.videoTime .el-slider__stop { + background-color: #C4C4C4 !important; + height: 3px !important; + width: 8px !important; + border-radius:0 !important; +} + +.videoTime .el-slider__bar { + z-index: 999999999 !important; + background-color: var(--colorCard) !important; +} + +.videoTime .el-input-number.el-input-number--small { + width: 90px; + height: 24px !important; + border-radius: 4px; + line-height: 24px !important; + font-weight: 700 !important; +} + + +.videoTime .el-input-number.el-input-number--small .el-input__inner { +font-size: 12px !important; +height: 24px !important; +} + +.el-input-number__decrease { +color: #333 !important; +/* top: 4px !important; */ + height: 22px !important; + width: 20px !important; + line-height: 22px !important; +} + +/* .el-input-number__decrease:hover i{ + color: var(--colorCard); +} */ + +.el-input-number__increase { +color: #333 !important; + /* top: 4px !important; */ + height: 22px !important; + width: 24px !important; + line-height: 22px !important; +} + +.el-input-number__increase:hover i{ + /* color: var(--colorCard); */ + color: #4E94FF; +} + + + + +/* .el-tooltip__popper { + font-size: 12px !important; + background-color: transparent !important; + color:var(--colorCard) !important; +} + +.popper__arrow::after { + border-color: transparent !important; + border: none !important; +} + +.popper__arrow:after { + border-bottom-color: green !important; +} + +.popper__arrow:after { + border-top-color: pink !important; +} + +.toolClass { + border: none !important; +} + +.toolClass { + border: none !important; +} + +.el-slider__button::after { + border: none !important; +} */ </style> -- Gitblit v1.8.0