From b4902c47c0ffd80276ffd9cb0ea6bf6908b0420c Mon Sep 17 00:00:00 2001 From: zhangzengfei <zhangzengfei@iotlink.com> Date: 星期四, 30 七月 2020 11:15:40 +0800 Subject: [PATCH] 添加数据推送, 日志管理 --- src/pages/desktop/index/components/Tools.vue | 109 ++++++++++++++++++++++++------------------------------ 1 files changed, 49 insertions(+), 60 deletions(-) diff --git a/src/pages/desktop/index/components/Tools.vue b/src/pages/desktop/index/components/Tools.vue index 124e00a..72b59ef 100644 --- a/src/pages/desktop/index/components/Tools.vue +++ b/src/pages/desktop/index/components/Tools.vue @@ -1,67 +1,56 @@ <template> <div class="tools"> - - <div class="tools-left"> - <div - :class="['tools-icon','tools-show-desktop', {clicked:this.$store.state.desktop.preferenceVisiable}]" - @click="togglePreference()" - > - <img class="system" :src="`${publicPath}images/header-icon/system.png`" /> - <!-- <span class="fa fa-apple"></span> --> - </div> - <div class="tools-icon" > - <!-- <span class="fa fa-safari"></span> --> - <img class="smart-ai" :src="`${publicPath}images/header-icon/SmartAI.png`" alt /> - </div> + <div class="tools-left"> + <div + :class="['tools-icon','tools-show-desktop', {clicked:this.$store.state.desktop.preferenceVisiable}]" + @click="togglePreference()" + > + <img class="system" :src="`${publicPath}images/header-icon/system.png`" /> + <!-- <span class="fa fa-apple"></span> --> </div> - <div class="tools-middle"> - <div - v-for="dock in this.$store.state.desktop.minDocks" - :key="dock.id" - class="dock-item-wrap" - - > - <a @click="dockClick(dock)"> - <img class="dock-item" :src="dock.src" :alt="dock.alt" /> - </a> - </div> + <div class="tools-icon"> + <!-- <span class="fa fa-safari"></span> --> + <img class="smart-ai" :src="`${publicPath}images/header-icon/SmartAI.png`" alt /> </div> - <div class="tools-right"> - <div class="tools-icon"> - <!-- <span class="fa fa-battery-full"></span> --> - <img :src="`${publicPath}images/header-icon/search.png`" alt /> - </div> - <div class="tools-icon"> - <!-- <span class="fa fa-battery-full"></span> --> - <img :src="`${publicPath}images/header-icon/help.png`" alt /> - </div> - <div class="tools-icon" @click="notificationCenterClick()"> - <!-- <span class="fa fa-battery-full"></span> --> - <img :src="`${publicPath}images/header-icon/notice.png`" alt /> - </div> - <div class="tools-icon"> - <!-- <span class="fa fa-battery-full"></span> --> - <img :src="`${publicPath}images/header-icon/user.png`" alt /> - </div> - <!-- <timer></timer> --> - <!-- <div class="tools-icon tools-notification-center" @click="notificationCenterClick()"> + </div> + <div class="tools-middle"> + <div v-for="dock in this.$store.state.desktop.minDocks" :key="dock.id" class="dock-item-wrap"> + <a @click="dockClick(dock)"> + <img class="dock-item" :src="dock.src" :alt="dock.alt" /> + </a> + </div> + </div> + <div class="tools-right"> + <div class="tools-icon"> + <!-- <span class="fa fa-battery-full"></span> --> + <img :src="`${publicPath}images/header-icon/search.png`" alt /> + </div> + <div class="tools-icon"> + <!-- <span class="fa fa-battery-full"></span> --> + <img :src="`${publicPath}images/header-icon/help.png`" alt /> + </div> + <div class="tools-icon" @click="notificationCenterClick()"> + <!-- <span class="fa fa-battery-full"></span> --> + <img :src="`${publicPath}images/header-icon/notice.png`" alt /> + </div> + <div class="tools-icon"> + <!-- <span class="fa fa-battery-full"></span> --> + <img :src="`${publicPath}images/header-icon/user.png`" alt /> + </div> + <!-- <timer></timer> --> + <!-- <div class="tools-icon tools-notification-center" @click="notificationCenterClick()"> <span :class="['fa', {'fa-list-ul':notificationCenterNoMessage()}, {'fa-comment-o on-new-msg':!notificationCenterNoMessage()},{'fa-commenting-o':notificationCenterMessageFlicker()}]" ></span> - </div> --> - </div> - + </div>--> + </div> </div> </template> <script> -import Timer from "./Timer"; export default { name: "Tools", - components: { - Timer - }, data() { return { publicPath: process.env.BASE_URL, @@ -75,23 +64,23 @@ window.toolIntervalArr.forEach(item => clearInterval(item)); } window.toolIntervalArr = [ - setInterval(function() { + setInterval(function () { _that.notificationCenterMessageCount += 1; }, 600) ]; }, methods: { - notificationCenterClick: function() { + notificationCenterClick: function () { this.notificationCenterVisible = !this.notificationCenterVisible; this.$store.commit( "desktop/changeNotificationCenterVisible", this.notificationCenterVisible ); }, - notificationCenterNoMessage: function() { + notificationCenterNoMessage: function () { return this.$store.state.desktop.messageNotices.length === 0; }, - notificationCenterMessageFlicker: function() { + notificationCenterMessageFlicker: function () { return ( this.notificationCenterMessageCount % 2 === 0 && !this.notificationCenterNoMessage() @@ -102,7 +91,7 @@ //this.$store.commit("desktop/togglePreference"); //鏄剧ず妗岄潰,鏈�灏忓寲宸叉墦寮�鐨勫簲鐢� debugger; - this.$store.state.desktop.frames.forEach(frame=>{ + this.$store.state.desktop.frames.forEach(frame => { this.$store.commit('desktop/addMinDock', { id: frame.id, src: frame.icon, @@ -152,14 +141,14 @@ float: left; margin-left: 14px; } -.tools .tools-middle{ +.tools .tools-middle { float: left; position: relative; } -.tools .tools-middle::before{ +.tools .tools-middle::before { width: 1px; height: 20px; - content: ''; + content: ""; position: absolute; top: 10px; left: 0; @@ -174,10 +163,10 @@ border-bottom: 2px solid transparent; } .tools .tools-middle .dock-item-wrap:hover, -.tools .tools-middle .dock-item-wrap.clicked{ +.tools .tools-middle .dock-item-wrap.clicked { color: white; background-color: #98aabe; - border-color: #40C3FF; + border-color: #40c3ff; cursor: pointer; } .dock-item-wrap a { -- Gitblit v1.8.0