添加数据推送, 日志管理

zhangzengfei

2020-07-30 b4902c47c0ffd80276ffd9cb0ea6bf6908b0420c

 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 {