逻辑完善及页面动态效果

public/static/css/style/style.css

@@ -634,7 +634,7 @@ ul.sds-desktop-shortcut {
     border: 1px solid rgba(40, 50, 60, 0.3);
     border-radius: 3px;
     padding-bottom: 4px;
-    height: 208px;
+    /* height: 208px; */
     box-shadow: none;
     overflow: hidden;
     transition: height ease-in 0.2s;
@@ -813,8 +813,9 @@ ul.sds-desktop-shortcut {
     }
 }
 
-.v-widget-item .v-widget-item-header .v-widget-item-header-tools .v-widget-item-header-tool-icon.close {
-    background-size: 24px 72px
+.v-widget-item .v-widget-item-header .v-widget-item-header-tools .v-widget-item-header-tool-icon.maximize {
+    background-size: 24px 72px;
+    background-image: url(../../../../public/image/index/windowDown.png);
 }
 
 @media(-webkit-min-device-pixel-ratio: 1.5),

src/component/Container/Desktop/FixWindow/Changelog/index.vue

@@ -1,87 +1,153 @@
 <template>
-    <!-- 文件更改日志 -->
-    <div class="v-widget-item sds-window-v5 syno-sds-widget-item" >
-        <div class="v-widget-item-header"><img
-                :src="ChangeLog.titleImgUrl"
-                class="v-widget-item-header-icon">
-            <div class="v-widget-item-header-title"><span
-                    class="v-widget-item-header-title-text">
-                    {{ChangeLog.title}}
-                </span></div>
-            <div class="v-widget-item-header-tools">
-                <div class="v-widget-item-header-tool-icon minimize"></div>
-                <div class="v-widget-item-header-tool-icon close"></div>
-            </div>
-        </div>
-        <div class="v-widget-item-content">
-            <div class=" x-panel sds-widget-gridpanel x-panel-noborder x-grid-panel x-masked-relative x-masked"
-                style="width: 318px;">
-                <div class="x-panel-bwrap">
-                    <div class="x-panel-body x-panel-body-noheader x-panel-body-noborder"
-                        style="width: 318px; height: 168px;">
-                        <div class="x-grid3" hidefocus="true"
-                            style="width: 318px; height: 168px;">
-                            <div class="x-grid3-viewport">
-                                <div class="x-grid3-scroller"
-                                    style="overflow: hidden; width: 318px; height: 168px;">
-                                    <div class="x-grid3-body" style="width:287px;">
-                                        &nbsp;</div><a href="#"
-                                        class="x-grid3-focus" tabindex="-1"
-                                        style="left: 0px; top: 0px;"></a>
-                                </div>
-                                <div class="arrow-scroller">
-                                    <div class="up arrow-disabled">
-                                        <div class="arrow-up"></div>
-                                    </div>
-                                    <div class="down arrow-disabled">
-                                        <div class="arrow-down"></div>
-                                    </div>
-                                </div>
-                            </div>
-                            <div class="x-grid3-resize-marker">
-                                &nbsp;</div>
-                            <div class="x-grid3-resize-proxy">&nbsp;
-                            </div>
-                        </div>
-                    </div>
+  <!-- 文件更改日志 -->
+  <div
+    :style="{ height: height + 'px' }"
+    :class="cls">
+    <div class="v-widget-item-header">
+      <img
+        :src="ChangeLogDetail.titleImgUrl"
+        class="v-widget-item-header-icon"
+      />
+      <div class="v-widget-item-header-title">
+        <span class="v-widget-item-header-title-text">
+          {{ ChangeLogDetail.title }}
+        </span>
+      </div>
+      <div class="v-widget-item-header-tools">
+        <div class="v-widget-item-header-tool-icon toolbar"></div>
+        <div
+          class="v-widget-item-header-tool-icon minimize"
+          @click="minWidgetItem"
+          v-if="maxHeight"
+        ></div>
+        <div
+          class="v-widget-item-header-tool-icon maximize"
+          @click="maxWidgetItem"
+          v-else
+        ></div>
+        <div
+          class="v-widget-item-header-tool-icon close"
+          @click="closeWidgetItem(ChangeLogDetail.title)"
+        ></div>
+      </div>
+    </div>
+    <div class="v-widget-item-content">
+      <div
+        class="
+          x-panel
+          sds-widget-gridpanel
+          x-panel-noborder x-grid-panel x-masked-relative x-masked
+        "
+        style="width: 318px"
+      >
+        <div class="x-panel-bwrap">
+          <div
+            class="x-panel-body x-panel-body-noheader x-panel-body-noborder"
+            style="width: 318px; height: 168px"
+          >
+            <div
+              class="x-grid3"
+              hidefocus="true"
+              style="width: 318px; height: 168px"
+            >
+              <div class="x-grid3-viewport">
+                <div
+                  class="x-grid3-scroller"
+                  style="overflow: hidden; width: 318px; height: 168px"
+                >
+                  <div class="x-grid3-body" style="width: 287px">&nbsp;</div>
+                  <a
+                    href="#"
+                    class="x-grid3-focus"
+                    tabindex="-1"
+                    style="left: 0px; top: 0px"
+                  ></a>
                 </div>
-                <div class="ext-el-mask"></div>
-                <div class="ext-el-mask-msg" style="left: 105px; top: 66px;">
-                    <div tabindex="0" class="x-loading-message-inner"
-                        role="article">
-                        无可用日志</div>
+                <div class="arrow-scroller">
+                  <div class="up arrow-disabled">
+                    <div class="arrow-up"></div>
+                  </div>
+                  <div class="down arrow-disabled">
+                    <div class="arrow-down"></div>
+                  </div>
                 </div>
+              </div>
+              <div class="x-grid3-resize-marker">&nbsp;</div>
+              <div class="x-grid3-resize-proxy">&nbsp;</div>
             </div>
+          </div>
+        </div>
+        <div class="ext-el-mask"></div>
+        <div class="ext-el-mask-msg" style="left: 105px; top: 66px">
+          <div tabindex="0" class="x-loading-message-inner" role="article">
+            无可用日志
+          </div>
         </div>
+      </div>
     </div>
+  </div>
 </template>
 <script>
-
 export default {
+  mounted() {
+    this.$bus.on("showOrHiddenWidgetItem", this.showOrHiddenWidgetItem);
+  },
   data() {
     return {
-        ChangeLog:{
-            id: 1,
-            title: '文件更改日志',
-            titleImgUrl: '../../../../../../public/image/index/wdgt_icn_title_file_change_logs.png',
-            detailMessageList: [],
-            cls:'',
-        }
-    }
+      height: 208,
+      cls: "v-widget-item sds-window-v5 syno-sds-widget-item",
+      maxHeight: true,
+      ChangeLogDetail: {
+        id: 1,
+        title: "文件更改日志",
+        titleImgUrl:
+          "../../../../../../public/image/index/wdgt_icn_title_file_change_logs.png",
+        detailMessageList: [],
+        cls: "",
+        height: 208,
+      },
+    };
   },
-  components:{
+  methods: {
+    // 高度变小
+    minWidgetItem() {
+      this.height = 122;
+      this.maxHeight = false;
+    },
+    // 恢复高度
+    maxWidgetItem() {
+      this.height = 208;
+      this.maxHeight = true;
+    },
+    // 关闭widgetItem
+    closeWidgetItem(title) {
+      this.cls = "v-widget-item sds-window-v5 syno-sds-widget-item";
+      this.$bus.emit("closeWidgetItem", title);
+      let widgetItemArray = document.querySelectorAll(
+        ".v-widget-window .v-widget-item.active"
+      );      
+      this.$bus.emit("changeThumbHeight", widgetItemArray.length - 1);
+    },
+    // 显示或隐藏本页面
+    showOrHiddenWidgetItem(obj) {
+      if (obj.title === this.ChangeLogDetail.title) {
+        this.cls = obj.cls;
+        this.height = 208
+      }
+    },
   },
-  name:'ChangeLog'
-
-}
+  components: {},
+  name: "ChangeLogDetail",
+};
 </script>
 <style scoped lang="css">
 .v-widget-item-content .ext-el-mask {
-    z-index: 1;
+  z-index: 1;
 }
 
-.v-widget-item-content .ext-el-mask-msg{
-    z-index: 2;
+.v-widget-item-content .ext-el-mask-msg {
+  z-index: 2;
+  width: 107px;
+  height: 36px;
 }
-    
 </style>

src/component/Container/Desktop/FixWindow/ConnectedUser/index.vue

@@ -1,6 +1,8 @@
 <template>
     <!-- 已连接用户 -->
-    <div class="v-widget-item sds-window-v5 syno-sds-widget-item">
+    <div 
+    :style="{ height: height + 'px' }"
+    :class="cls">
         <div class="v-widget-item-header"><img
                 :src="connectedUserDetail.titleImgUrl"
                 class="v-widget-item-header-icon">
@@ -8,10 +10,20 @@
                     class="v-widget-item-header-title-text">
                     {{connectedUserDetail.title}}
                 </span></div>
-            <div class="v-widget-item-header-tools">
-                <div class="v-widget-item-header-tool-icon minimize"></div>
-                <div class="v-widget-item-header-tool-icon close"></div>
-            </div>
+            
+      <div class="v-widget-item-header-tools">
+        <div
+          class="v-widget-item-header-tool-icon minimize"
+          @click="minWidgetItem"
+          v-if="maxHeight"
+        ></div>
+        <div
+          class="v-widget-item-header-tool-icon maximize"
+          @click="maxWidgetItem"
+          v-else
+        ></div>
+        <div class="v-widget-item-header-tool-icon close" @click="closeWidgetItem(connectedUserDetail.title)"></div>
+      </div>
         </div>
         <div class="v-widget-item-content">
             <div class=" x-panel sds-widget-gridpanel x-panel-noborder x-grid-panel"
@@ -108,12 +120,16 @@
         </div>
     </div>
 </template>
-
 <script>
-
 export default {
+  mounted() {
+    this.$bus.on("showOrHiddenWidgetItem", this.showOrHiddenWidgetItem);
+  },
   data() {
     return {
+      height: 208,
+      cls: "v-widget-item sds-window-v5 syno-sds-widget-item",
+      maxHeight: true,
         connectedUserDetail:{
             id: 1,
             title: '已连接用户',
@@ -139,6 +155,35 @@ export default {
         }
     }
   },
+  
+  methods: {
+    // 高度变小
+    minWidgetItem() {
+      this.height = 122;
+      this.maxHeight = false;
+    },
+    // 恢复高度
+    maxWidgetItem() {
+      this.height = 208;
+      this.maxHeight = true;
+    },
+    // 关闭widgetItem
+    closeWidgetItem(title){
+      this.cls =  "v-widget-item sds-window-v5 syno-sds-widget-item",
+        this.$bus.emit('closeWidgetItem',title)
+        let widgetItemArray = document.querySelectorAll(
+            ".v-widget-window .v-widget-item.active"
+        );
+        this.$bus.emit("changeThumbHeight", widgetItemArray.length - 1);
+    },
+    // 显示或隐藏本页面
+    showOrHiddenWidgetItem(obj) {
+      if (obj.title === this.connectedUserDetail.title) {
+        this.cls = obj.cls;
+        this.height = 208
+      }
+    },
+  },
   components:{
   },
   name:'ConnectedUser',

src/component/Container/Desktop/FixWindow/Copy/index.vue

@@ -1,6 +1,8 @@
 <template>
     <!-- 备份 -->
-    <div class="v-widget-item sds-window-v5 syno-sds-widget-item">
+    <div
+    :style="{ height: height + 'px' }"
+    :class="cls">
         <div class="v-widget-item-header"><img
                 :src="copyDetail.titleImgUrl"
                 class="v-widget-item-header-icon">
@@ -9,9 +11,18 @@
                     {{copyDetail.title}}
                 </span></div>
             <div class="v-widget-item-header-tools">
-                <div class="v-widget-item-header-tool-icon minimize"></div>
-                <div class="v-widget-item-header-tool-icon close"></div>
-            </div>
+        <div
+          class="v-widget-item-header-tool-icon minimize"
+          @click="minWidgetItem"
+          v-if="maxHeight"
+        ></div>
+        <div
+          class="v-widget-item-header-tool-icon maximize"
+          @click="maxWidgetItem"
+          v-else
+        ></div>
+        <div class="v-widget-item-header-tool-icon close" @click="closeWidgetItem(copyDetail.title)"></div>
+      </div>
         </div>
         <div class="v-widget-item-content">
             <div class=" x-panel sds-widget-gridpanel syno-sds-backupapp-widget-panel x-panel-noborder x-grid-panel"
@@ -99,8 +110,14 @@
 
 <script>
 export default {
+  mounted() {
+    this.$bus.on("showOrHiddenWidgetItem", this.showOrHiddenWidgetItem);
+  },
   data() {
     return {
+      height: 208,
+      cls: "v-widget-item sds-window-v5 syno-sds-widget-item",
+      maxHeight: true,
         copyDetail:{
             id: 1,
             title: '备份',
@@ -124,6 +141,34 @@ export default {
         }
     }
   },
+  methods: {
+    // 高度变小
+    minWidgetItem() {
+      this.height = 122;
+      this.maxHeight = false;
+    },
+    // 恢复高度
+    maxWidgetItem() {
+      this.height = 208;
+      this.maxHeight = true;
+    },
+    // 关闭widgetItem
+    closeWidgetItem(title) {
+      this.cls = "v-widget-item sds-window-v5 syno-sds-widget-item";
+      this.$bus.emit("closeWidgetItem", title);
+      let widgetItemArray = document.querySelectorAll(
+        ".v-widget-window .v-widget-item.active"
+      );      
+      this.$bus.emit("changeThumbHeight", widgetItemArray.length - 1);
+    },
+    // 显示或隐藏本页面
+    showOrHiddenWidgetItem(obj) {
+      if (obj.title === this.copyDetail.title) {
+        this.cls = obj.cls;
+        this.height = 208
+      }
+    },
+  },
   components:{
   },
   name:'Copy',

src/component/Container/Desktop/FixWindow/NewLog/index.vue

@@ -1,7 +1,9 @@
  
 <template>
     <!-- 最新日志 -->
-    <div class="v-widget-item sds-window-v5 syno-sds-widget-item">
+    <div
+    :style="{ height: height + 'px' }"
+    :class="cls">
         <div class="v-widget-item-header"><img
                 :src="logDetail.titleImgUrl"
                 class="v-widget-item-header-icon">
@@ -10,9 +12,18 @@
                     {{logDetail.title}}
                 </span></div>
             <div class="v-widget-item-header-tools">
-                <div class="v-widget-item-header-tool-icon minimize"></div>
-                <div class="v-widget-item-header-tool-icon close"></div>
-            </div>
+        <div
+          class="v-widget-item-header-tool-icon minimize"
+          @click="minWidgetItem"
+          v-if="maxHeight"
+        ></div>
+        <div
+          class="v-widget-item-header-tool-icon maximize"
+          @click="maxWidgetItem"
+          v-else
+        ></div>
+        <div class="v-widget-item-header-tool-icon close" @click="closeWidgetItem(logDetail.title)"></div>
+      </div>
         </div>
         <div class="v-widget-item-content">
             <div class=" x-panel sds-widget-gridpanel x-panel-noborder x-grid-panel"
@@ -84,8 +95,14 @@
 <script>
 
 export default {
+  mounted() {
+    this.$bus.on("showOrHiddenWidgetItem", this.showOrHiddenWidgetItem);
+  },
   data() {
     return {
+      height: 208,
+      cls: "v-widget-item sds-window-v5 syno-sds-widget-item",
+      maxHeight: true,
         logDetail:{
             id: 1,
             title: '最新日志',
@@ -130,6 +147,34 @@ export default {
         }
     }
   },
+  methods: {
+    // 高度变小
+    minWidgetItem() {
+      this.height = 122;
+      this.maxHeight = false;
+    },
+    // 恢复高度
+    maxWidgetItem() {
+      this.height = 208;
+      this.maxHeight = true;
+    },
+    // 关闭widgetItem
+    closeWidgetItem(title) {
+      this.cls = "v-widget-item sds-window-v5 syno-sds-widget-item";
+      this.$bus.emit("closeWidgetItem", title);
+      let widgetItemArray = document.querySelectorAll(
+        ".v-widget-window .v-widget-item.active"
+      );      
+      this.$bus.emit("changeThumbHeight", widgetItemArray.length - 1);
+    },
+    // 显示或隐藏本页面
+    showOrHiddenWidgetItem(obj) {
+      if (obj.title === this.logDetail.title) {
+        this.cls = obj.cls;
+        this.height = 208
+      }
+    },
+  },
   components:{
   },
   name:'NewLog',

src/component/Container/Desktop/FixWindow/ResourceMonitor/index.vue

@@ -1,6 +1,8 @@
 <template>
     <!-- 资源监控 -->
-    <div class="v-widget-item sds-window-v5 syno-sds-widget-item active">
+    <div
+    :style="{ height: height + 'px' }"
+    :class="cls">
         <div class="v-widget-item-header"><img
                 :src="resourceMonitorDetail.titleImgUrl"
                 class="v-widget-item-header-icon">
@@ -9,10 +11,19 @@
                     {{resourceMonitorDetail.title}}
                 </span></div>
             <div class="v-widget-item-header-tools">
-                <div class="v-widget-item-header-tool-icon toolbar"></div>
-                <div class="v-widget-item-header-tool-icon minimize"></div>
-                <div class="v-widget-item-header-tool-icon close"></div>
-            </div>
+        <div class="v-widget-item-header-tool-icon toolbar"></div>
+        <div
+          class="v-widget-item-header-tool-icon minimize"
+          @click="minWidgetItem"
+          v-if="maxHeight"
+        ></div>
+        <div
+          class="v-widget-item-header-tool-icon maximize"
+          @click="maxWidgetItem"
+          v-else
+        ></div>
+        <div class="v-widget-item-header-tool-icon close" @click="closeWidgetItem(resourceMonitorDetail.title)"></div>
+      </div>
         </div>
         <div class="v-widget-item-content">
             <div class=" x-panel resource-monitor-widget x-panel-noborder"
@@ -99,8 +110,14 @@
 <script>
 
 export default {
+  mounted() {
+    this.$bus.on("showOrHiddenWidgetItem", this.showOrHiddenWidgetItem);
+  },
   data() {
     return {
+      height: 208,
+      cls:'v-widget-item sds-window-v5 syno-sds-widget-item active',
+      maxHeight: true,
         resourceMonitorDetail:{
             id: 1,
             title: '资源监控',
@@ -141,6 +158,34 @@ export default {
 
     }
   },
+  methods: {
+    // 高度变小
+    minWidgetItem() {
+      this.height = 122;
+      this.maxHeight = false;
+    },
+    // 恢复高度
+    maxWidgetItem() {
+      this.height = 208;
+      this.maxHeight = true;
+    },
+    // 关闭widgetItem
+    closeWidgetItem(title){
+        this.cls = 'v-widget-item sds-window-v5 syno-sds-widget-item'
+        this.$bus.emit('closeWidgetItem',title)
+       let widgetItemArray = document.querySelectorAll(
+            ".v-widget-window .v-widget-item.active"
+        );
+    this.$bus.emit("changeThumbHeight", widgetItemArray.length - 1);
+    },
+    // 显示或隐藏本页面
+    showOrHiddenWidgetItem(obj) {
+      if (obj.title === this.resourceMonitorDetail.title) {
+        this.cls = obj.cls;
+        this.height = 208
+      }
+    },
+  },
   components:{
   },
   name:'ResourceMonitor'

src/component/Container/Desktop/FixWindow/RunningState/index.vue

@@ -1,87 +1,133 @@
 <template>
-    <!-- 系统状况 -->
-    <div class="v-widget-item sds-window-v5 syno-sds-widget-item active">
-        <div class="v-widget-item-header"><img
-                :src="runningStateDetail.titleImgUrl"
-                class="v-widget-item-header-icon">
-            <div class="v-widget-item-header-title"><span
-                    class="v-widget-item-header-title-text">
-                    {{runningStateDetail.title}}
-                </span></div>
-            <div class="v-widget-item-header-tools">
-                <div class="v-widget-item-header-tool-icon toolbar"></div>
-                <div class="v-widget-item-header-tool-icon minimize"></div>
-                <div class="v-widget-item-header-tool-icon close"></div>
-            </div>
-        </div>
-        <div class="v-widget-item-content">
-            <div class=" x-panel x-panel-noborder"
-                style="width: 318px; height: 172px;">
-                <div class="x-panel-bwrap">
-                    <div class="x-panel-body x-panel-body-noheader x-panel-body-noborder"
-                        style="width: 318px; height: 168px;">
-                        <div class=" x-panel syno-sysinfo-system-health x-panel-noborder"
-                            style="width: 318px;">
+  <!-- 系统状况 -->
+  <div
+    :style="{ height: height + 'px' }"
+    :class="cls"
+  >
+    <div class="v-widget-item-header">
+      <img
+        :src="runningStateDetail.titleImgUrl"
+        class="v-widget-item-header-icon"
+      />
+      <div class="v-widget-item-header-title">
+        <span class="v-widget-item-header-title-text">
+          {{ runningStateDetail.title }}
+        </span>
+      </div>
+      <div class="v-widget-item-header-tools">
+        <div class="v-widget-item-header-tool-icon toolbar"></div>
+        <div
+          class="v-widget-item-header-tool-icon minimize"
+          @click="minWidgetItem"
+          v-if="maxHeight"
+        ></div>
+        <div
+          class="v-widget-item-header-tool-icon maximize"
+          @click="maxWidgetItem"
+          v-else
+        ></div>
+        <div class="v-widget-item-header-tool-icon close" @click="closeWidgetItem(runningStateDetail.title)"></div>
+      </div>
+    </div>
+    <div class="v-widget-item-content">
+      <div class="x-panel x-panel-noborder" style="width: 318px; height: 172px">
+        <div class="x-panel-bwrap">
+          <div
+            class="x-panel-body x-panel-body-noheader x-panel-body-noborder"
+            style="width: 318px; height: 168px"
+          >
+            <div
+              class="x-panel syno-sysinfo-system-health x-panel-noborder"
+              style="width: 318px"
+            >
+              <div class="x-panel-bwrap">
+                <div
+                  class="
+                    x-panel-body
+                    x-panel-body-noheader
+                    x-panel-body-noborder
+                    x-box-layout-ct
+                  "
+                  style="padding: 0px 11px 5px; width: 296px; height: 163px"
+                >
+                  <div class="x-box-inner" style="width: 296px; height: 164px">
+                    <div
+                      class="syno-sysinfo-system-health-status x-box-item"
+                      style="width: 296px; height: 76px; left: 0px; top: 0px"
+                    >
+                      <div>
+                        <div :class="runningStateDetail.centerDetail.cls"></div>
+                      </div>
+                      <div>
+                        <div class="syno-sysinfo-system-health-content-wrap">
+                          <div
+                            class="
+                              syno-sysinfo-system-health-summary
+                              syno-sysinfo-system-health-content-header-normal
+                            "
+                          >
+                            {{ runningStateDetail.centerDetail.title }}
+                          </div>
+                          <div class="syno-sysinfo-system-health-content">
+                            {{ runningStateDetail.centerDetail.text }}
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      class="x-panel x-panel-noborder x-box-item"
+                      style="width: 296px; left: 0px; top: 80px"
+                    >
+                      <div class="x-panel-bwrap">
+                        <div
+                          class="
+                            x-panel-body
+                            x-panel-body-noheader
+                            x-panel-body-noborder
+                          "
+                          style="width: 296px; height: 84px"
+                        >
+                          <div class="x-panel sys-info-south-table">
                             <div class="x-panel-bwrap">
-                                <div class="x-panel-body x-panel-body-noheader x-panel-body-noborder x-box-layout-ct"
-                                    style="padding: 0px 11px 5px; width: 296px; height: 163px;">
-                                    <div class="x-box-inner"
-                                        style="width: 296px; height: 164px;">
-                                        <div class=" syno-sysinfo-system-health-status x-box-item"
-                                            style="width: 296px; height: 76px; left: 0px; top: 0px;">
-                                            <div>
-                                                <div
-                                                    :class="runningStateDetail.centerDetail.cls">
-                                                </div>
-                                            </div>
-                                            <div>
-                                                <div
-                                                    class="syno-sysinfo-system-health-content-wrap">
-                                                    <div
-                                                        class="syno-sysinfo-system-health-summary syno-sysinfo-system-health-content-header-normal">
-                                                        {{runningStateDetail.centerDetail.title}}</div>
-                                                    <div
-                                                        class="syno-sysinfo-system-health-content">
-                                                        {{runningStateDetail.centerDetail.text}}</div>
-                                                </div>
-                                            </div>
+                              <div
+                                class="
+                                  x-panel-body
+                                  x-panel-body-noheader
+                                  x-table-layout-ct
+                                "
+                                style="height: 82px"
+                              >
+                                <table class="x-table-layout" cellspacing="0">
+                                  <tbody>
+                                    <tr
+                                      v-for="detailMessage in runningStateDetail.detailMessageList"
+                                      :key="detailMessage.id"
+                                    >
+                                      <td class="x-table-layout-cell">
+                                        <div>
+                                          <p
+                                            class="
+                                              syno-sysinfo-system-health-south-title
+                                            "
+                                          >
+                                            {{ detailMessage.title }}
+                                          </p>
                                         </div>
-                                        <div class=" x-panel x-panel-noborder x-box-item"
-                                            style="width: 296px; left: 0px; top: 80px;">
-                                            <div class="x-panel-bwrap">
-                                                <div class="x-panel-body x-panel-body-noheader x-panel-body-noborder"
-                                                    style="width: 296px; height: 84px;">
-                                                    <div
-                                                        class=" x-panel sys-info-south-table">
-                                                        <div class="x-panel-bwrap">
-                                                            <div class="x-panel-body x-panel-body-noheader x-table-layout-ct"
-                                                                style="height: 82px;">
-                                                                <table
-                                                                    class="x-table-layout"
-                                                                    cellspacing="0">
-                                                                    <tbody>
-                                                                        <tr v-for="detailMessage in runningStateDetail.detailMessageList" :key="detailMessage.id">
-                                                                            <td
-                                                                                class="x-table-layout-cell">
-                                                                                <div>
-                                                                                    <p
-                                                                                        class="syno-sysinfo-system-health-south-title">
-                                                                                        {{detailMessage.title}}
-                                                                                    </p>
-                                                                                </div>
-                                                                            </td>
-                                                                            <td
-                                                                                class="x-table-layout-cell">
-                                                                                <div>
-                                                                                    <p
-                                                                                        class="syno-sysinfo-system-health-south-data">
-                                                                                       {{detailMessage.text}}
-                                                                                    </p>
-                                                                                </div>
-                                                                            </td>
-                                                                        </tr>
+                                      </td>
+                                      <td class="x-table-layout-cell">
+                                        <div>
+                                          <p
+                                            class="
+                                              syno-sysinfo-system-health-south-data
+                                            "
+                                          >
+                                            {{ detailMessage.text }}
+                                          </p>
+                                        </div>
+                                      </td>
+                                    </tr>
 
-                                                                        <!-- 
+                                    <!-- 
                                                                         <tr>
                                                                             <td
                                                                                 class="x-table-layout-cell sys-info-row x-row-alt row-left">
@@ -137,66 +183,97 @@
                                                                             </td>
                                                                         </tr>
                                                                         -->
-                                                                    </tbody>
-                                                                </table>
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
+                                  </tbody>
+                                </table>
+                              </div>
                             </div>
+                          </div>
                         </div>
+                      </div>
                     </div>
+                  </div>
                 </div>
+              </div>
             </div>
+          </div>
         </div>
+      </div>
     </div>
+  </div>
 </template>
 
 <script>
-
 export default {
+  mounted() {
+    this.$bus.on("showOrHiddenWidgetItem", this.showOrHiddenWidgetItem);
+  },
   data() {
     return {
-        runningStateDetail:{
-            id: 1,
-            title: '系统状况',
-            titleImgUrl: '../../../../public/image/index/windowInfo.png',
-            centerDetail:{
-                title:'正常',
-                text:'您的 VirtualDSM 运转正常。',
-                cls:'syno-sysinfo-system-health-west-normal',
-            },
-            
-            detailMessageList: [
-                {
-                    id: 10,
-                    title: '服务器名称',
-                    text: 'DSM-Demo',
-                    cls: '',
-                },
-                {
-                    id: 11,
-                    title: '局域网',
-                    text: '172.21.2.64',
-                    cls: '',
-                },
-                 {
-                    id: 11,
-                    title: '运行时间',
-                    text: '04:22:02',
-                    cls: '',
-                }
-            ]
-        }
-    }
+      height: 208,
+      cls:'v-widget-item sds-window-v5 syno-sds-widget-item active',
+      maxHeight: true,
+      runningStateDetail: {
+        id: 1,
+        title: "系统状况",
+        titleImgUrl: "../../../../public/image/index/windowInfo.png",
+        centerDetail: {
+          title: "正常",
+          text: "您的 VirtualDSM 运转正常。",
+          cls: "syno-sysinfo-system-health-west-normal",
+        },
+
+        detailMessageList: [
+          {
+            id: 10,
+            title: "服务器名称",
+            text: "DSM-Demo",
+            cls: "",
+          },
+          {
+            id: 11,
+            title: "局域网",
+            text: "172.21.2.64",
+            cls: "",
+          },
+          {
+            id: 11,
+            title: "运行时间",
+            text: "04:22:02",
+            cls: "",
+          },
+        ],
+      },
+    };
   },
-  components:{
+  methods: {
+    // 高度变小
+    minWidgetItem() {
+      this.height = 122;
+      this.maxHeight = false;
+    },
+    // 恢复高度
+    maxWidgetItem() {
+      this.height = 208;
+      this.maxHeight = true;
+    },
+    // 关闭widgetItem
+    closeWidgetItem(title){
+        this.cls = 'v-widget-item sds-window-v5 syno-sds-widget-item'
+        this.$bus.emit('closeWidgetItem',title)
+        let widgetItemArray = document.querySelectorAll(
+            ".v-widget-window .v-widget-item.active"
+        );
+      this.$bus.emit("changeThumbHeight", widgetItemArray.length - 1);
+    },
+    // 显示或隐藏本页面
+    showOrHiddenWidgetItem(obj) {
+      if (obj.title === this.runningStateDetail.title) {
+        this.cls = obj.cls;
+        this.height = 208
+      }
+    },
   },
-  name:'RunningState',
-
-}
+  components: {},
+  name: "RunningState",
+};
 </script>

src/component/Container/Desktop/FixWindow/ScheduledTask/index.vue

@@ -1,6 +1,8 @@
 <template>
     <!-- 计划的任务 -->
-    <div class="v-widget-item sds-window-v5 syno-sds-widget-item">
+    <div 
+    :style="{ height: height + 'px' }"
+    :class="cls">
         <div class="v-widget-item-header"><img
                 :src="scheduledTaskDetail.titleImgUrl"
                 class="v-widget-item-header-icon">
@@ -8,10 +10,19 @@
                     class="v-widget-item-header-title-text">
                     {{scheduledTaskDetail.title}}
                 </span></div>
-            <div class="v-widget-item-header-tools">
-                <div class="v-widget-item-header-tool-icon minimize"></div>
-                <div class="v-widget-item-header-tool-icon close"></div>
-            </div>
+             <div class="v-widget-item-header-tools">
+        <div
+          class="v-widget-item-header-tool-icon minimize"
+          @click="minWidgetItem"
+          v-if="maxHeight"
+        ></div>
+        <div
+          class="v-widget-item-header-tool-icon maximize"
+          @click="maxWidgetItem"
+          v-else
+        ></div>
+        <div class="v-widget-item-header-tool-icon close" @click="closeWidgetItem(scheduledTaskDetail.title)"></div>
+      </div>
         </div>
         <div class="v-widget-item-content">
             <div class=" x-panel sds-widget-gridpanel x-panel-noborder x-grid-panel"
@@ -96,8 +107,14 @@
 <script>
 
 export default {
+  mounted() {
+    this.$bus.on("showOrHiddenWidgetItem", this.showOrHiddenWidgetItem);
+  },
   data() {
     return {
+      height: 208,
+      cls: "v-widget-item sds-window-v5 syno-sds-widget-item",
+      maxHeight: true,
         scheduledTaskDetail:{
             id: 1,
             title: '计划的任务',
@@ -119,6 +136,34 @@ export default {
         }
     }
   },
+  methods: {
+    // 高度变小
+    minWidgetItem() {
+      this.height = 122;
+      this.maxHeight = false;
+    },
+    // 恢复高度
+    maxWidgetItem() {
+      this.height = 208;
+      this.maxHeight = true;
+    },
+    // 关闭widgetItem
+    closeWidgetItem(title) {
+      this.cls = "v-widget-item sds-window-v5 syno-sds-widget-item";
+      this.$bus.emit("closeWidgetItem", title);
+      let widgetItemArray = document.querySelectorAll(
+        ".v-widget-window .v-widget-item.active"
+      );      
+      this.$bus.emit("changeThumbHeight", widgetItemArray.length - 1);
+    },
+    // 显示或隐藏本页面
+    showOrHiddenWidgetItem(obj) {
+      if (obj.title === this.scheduledTaskDetail.title) {
+        this.cls = obj.cls;
+        this.height = 208
+      }
+    },
+  },
   components:{
   },
   name:'ScheduledTask'

src/component/Container/Desktop/FixWindow/Storage/index.vue

@@ -1,6 +1,8 @@
 <template>
     <!-- 存储 -->
-    <div class="v-widget-item sds-window-v5 syno-sds-widget-item">
+    <div
+    :style="{ height: height + 'px' }"
+    :class="cls">
         <div class="v-widget-item-header"><img
                 :src="storageDetail.titleImgUrl"
                 class="v-widget-item-header-icon">
@@ -9,10 +11,17 @@
                     {{storageDetail.title}}
                 </span></div>
             <div class="v-widget-item-header-tools">
-                <!---->
-                <div class="v-widget-item-header-tool-icon minimize"></div>
-                <!---->
-                <div class="v-widget-item-header-tool-icon close"></div>
+                <div
+                    class="v-widget-item-header-tool-icon minimize"
+                    @click="minWidgetItem"
+                    v-if="maxHeight"
+                    ></div>
+                    <div
+                        class="v-widget-item-header-tool-icon maximize"
+                        @click="maxWidgetItem"
+                        v-else
+                    ></div>
+                <div class="v-widget-item-header-tool-icon close" @click="closeWidgetItem(storageDetail.title)"></div>
             </div>
         </div>
         <div class="v-widget-item-content">
@@ -79,8 +88,14 @@
 <script>
 
 export default {
+  mounted() {
+    this.$bus.on("showOrHiddenWidgetItem", this.showOrHiddenWidgetItem);
+  },
   data() {
     return {
+      height: 208,
+      cls: "v-widget-item sds-window-v5 syno-sds-widget-item",
+      maxHeight: true,
         storageDetail:{
             id: 1,
             title: '存储',
@@ -101,6 +116,34 @@ export default {
         }
     }
   },
+  methods: {
+    // 高度变小
+    minWidgetItem() {
+      this.height = 122;
+      this.maxHeight = false;
+    },
+    // 恢复高度
+    maxWidgetItem() {
+      this.height = 208;
+      this.maxHeight = true;
+    },
+    // 关闭widgetItem
+    closeWidgetItem(title) {
+      this.cls = "v-widget-item sds-window-v5 syno-sds-widget-item";
+      this.$bus.emit("closeWidgetItem", title);
+      let widgetItemArray = document.querySelectorAll(
+        ".v-widget-window .v-widget-item.active"
+      );      
+      this.$bus.emit("changeThumbHeight", widgetItemArray.length - 1);
+    },
+    // 显示或隐藏本页面
+    showOrHiddenWidgetItem(obj) {
+      if (obj.title === this.storageDetail.title) {
+        this.cls = obj.cls;
+        this.height = 208
+      }
+    },
+  },
   components:{
   }
 

src/component/Container/Desktop/FixWindow/index.vue

@@ -6,7 +6,7 @@
       position: absolute;
       width: 344px;
       height: 466px;
-      min-height: 164px !important;
+      min-height: 165px !important;
     "
     :style="{
       zIndex: fixWindowMessage.zIndex,
@@ -155,7 +155,7 @@ export default {
       top: 0,
       bottom: '10px',
       right: 0,
-      left: '120px',
+      left: '220px',
       // widgetZindexIsMax: false,
       progrecssFirstClick: {
         lastY: 0,
@@ -277,12 +277,11 @@ export default {
     PortaSelectPosition,
   },
   mounted() {
-    // this.$bus.on("changeFixWindowZIndex", this.changeFixWindowZIndex);
     this.$bus.on("showOrHiddenWidgetItem", this.showOrHiddenWidgetItem);
     this.$bus.on("changeThumbHeight", this.changeThumbHeight);
     this.$bus.on("showOrHiddenWidget", this.showOrHiddenWidget);
     this.$bus.on("changeWidgetPosition", this.changeWidgetPosition);
-    // this.$bus.on('dialogWindowZIndexIsMax',this.dialogWindowZIndexIsMax)
+    this.$bus.on('closeWidgetItem',this.closeWidgetItem)
     this.fixWindowMessage = this.fixWindowData;
     let el = document.querySelector(".v-widget-window .ps__thumb-y");
     let el1 = document.querySelector(
@@ -292,24 +291,31 @@ export default {
     el1.addEventListener("mouseup", this.mouseupWidgetHeader);
     let el2 = document.querySelector(".v-widget-window .v-widget-list");
     let el3 = document.querySelector(".v-widget-window .ps__rail-y");
+    let el4 = document.querySelector(".v-widget-window");
     if (el2.offsetHeight > el3.offsetHeight) {
-      this.bottom = "0";
+      this.top = 0;
+      this.bottom = 0;
       this.thumbYDisplay = "block";
       this.thumbYHeight = "calc((100vh - 52px) / 2)";
     }
+    setTimeout(()=>{
+      this.left = 0 
+      this.right = '10px'
+    },400)
     window.addEventListener("resize", (e) => {
       if (el2.offsetHeight > el3.offsetHeight) {
-        this.bottom = "0";
         this.thumbYDisplay = "block";
         this.thumbYHeight = "calc((100vh - 52px) / 2)";
       } else {
         this.thumbYDisplay = "none";
       }
+      let left = document.documentElement.clientWidth - el4.offsetWidth
+      if(left >= 0 && left < el4.offsetWidth){
+        this.left = left + 'px'
+      }else if(left < 0) {
+        this.left = 0
+      }
     });
-    setTimeout(()=>{
-      this.left = 0 
-      this.right = '10px'
-    },0)
   },
   methods: {
     //点击固定窗口
@@ -325,7 +331,6 @@ export default {
       let el = document.querySelector(".v-widget-window .ps__thumb-y");
       let el1 = document.querySelector(".v-widget-window");
       el.addEventListener("mousemove", this.moveProgress);
-
       if (el.style.top && el.style.top.includes("px")) {
         let top = parseInt(el.style.top.replace("px", ""));
         this.progrecssFirstClick.thumbStyletop = top;
@@ -363,6 +368,7 @@ export default {
           (el2.offsetHeight - el1.offsetHeight) /
           (el1.offsetHeight - el.offsetHeight)
         ) * moveY;
+      console.log(moveY)
       el.style.top = moveY + "px";
       el2.style.top = moveY2 + "px";
       el.addEventListener("mouseup", this.mouseupProgress);
@@ -380,13 +386,12 @@ export default {
       let el = document.querySelector(".v-widget-window .ps__thumb-y");
       let el1 = document.querySelector(".v-widget-window .ps__rail-y");
       let el2 = document.querySelector(".v-widget-window .ps--active-y");
-      // if(! this.widgetListIsBottom){
       let moveY =
         ((el1.offsetHeight - el.offsetHeight) /
           (e.target.scrollHeight - el2.offsetHeight)) *
         e.target.scrollTop;
       el.style.top = moveY + e.target.scrollTop + "px";
-      // }
+      console.log(moveY,el.style.top)
     },
     // 点击勾选小窗口的加号
     selectWidgetItem() {
@@ -394,10 +399,6 @@ export default {
     },
     // 点击小窗口选择框的每一项
     showOrHiddenWidgetItem(obj) {
-      let widgetItemArray = document.querySelectorAll(
-        ".v-widget-window .v-widget-item"
-      );
-      Array.from(widgetItemArray)[obj.index].className = obj.cls;
       this.portalDetail.detailMessageList[obj.index].cls = obj.cls1;
       this.portalDetail.detailMessageList.forEach((item, index) => {
         if (item.cls && item.cls.includes("active") && index !== 0) {
@@ -409,20 +410,25 @@ export default {
     changeThumbHeight(selectedNum) {
       let el1 = document.querySelector(".v-widget-window .v-widget-list");
       let el2 = document.querySelector(".v-widget-window .ps__rail-y");
-      if (selectedNum > 2) {
+      this.$nextTick(()=>{
+        this.$nextTick(()=>{
+        if (el1.offsetHeight > el2.offsetHeight) {
         if (selectedNum >= 6) {
           selectedNum = 6;
         }
         this.thumbYDisplay = "block";
-        this.thumbYHeight = (7 - selectedNum) * 70 + "px";
+        if(el2.offsetHeight > (7 - selectedNum) * 70){
+          this.thumbYHeight = (7 - selectedNum) * 70 + "px";
+        }else{
+          this.thumbYHeight = "calc((100vh - 52px) / 2)";
+        }
       } else {
         this.thumbYDisplay = "none";
       }
-      if (el2.offsetHeight < 424 && el1.offsetHeight > el2.offsetHeight) {
-        this.thumbYDisplay = "block";
-        this.thumbYHeight = "calc((100vh - 52px) / 2)";
-      }
-      this.selectedNum = selectedNum;
+        this.selectedNum = selectedNum;
+        })
+      })
+      
     },
     //点击固定窗口头部
     mousedownWidgetHeader(e) {
@@ -446,20 +452,21 @@ export default {
       el2.style.display = "none";
       // X轴
       let moveX = e.pageX - this.widgetFirstClick.layerX;
+      if (moveX > this.widgetFirstClick.screenX - el1.offsetWidth) {
+        moveX = this.widgetFirstClick.screenX - el1.offsetWidth;
+      }
       if (moveX < 0) {
         moveX = 0;
       }
-      if (moveX > this.widgetFirstClick.screenX - el1.style.width) {
-        moveX = this.widgetFirstClick.screenX - el1.style.width;
-      }
       // Y轴
       let moveY = e.pageY - this.widgetFirstClick.layerY;
+      if (moveY > this.widgetFirstClick.screenY - el1.offsetHeight) {
+        moveY = this.widgetFirstClick.screenY - el1.offsetHeight;
+      }
       if (moveY < 0) {
         moveY = 0;
       }
-      if (moveY > this.widgetFirstClick.screenY - el1.style.height) {
-        moveY = this.widgetFirstClick.screenY - el1.style.height;
-      }
+
       this.left = moveX + "px";
       this.top = moveY + "px";
       if (!el1.className.includes(" move")) {
@@ -559,6 +566,14 @@ export default {
         this.$bus.emit("fixWindowZIndexMax", true);
       }
     },
+     // 关闭widgetItem
+    closeWidgetItem(title){
+      this.portalDetail.detailMessageList.forEach(item=>{
+        if(item.title === title){
+          item.cls = item.cls.replace('v-menu-item-select-selected selected','')
+        }
+      })
+    },
     //节流函数
     throttle(fn, time, e) {
       var lastTime = 0;

src/component/Container/Desktop/Menu/index.vue

@@ -71,6 +71,8 @@ export default {
       // 打开个人设置页面
       if(id === 1111){
         this.$bus.emit('openUserSetting')
+      }else{
+        this.$bus.emit("changeDialogMenuWindow", id);
       }
     },
     // 点击弹出窗页面切换小图标选中状态

src/component/Container/Desktop/PortalSelectDialogWindow/index.vue

@@ -5,8 +5,14 @@
         tabindex="-1"
         role="listbox"
         class="v-menu v-menu-icon-menu"
-        style="height: auto; width: auto; left: 0px; top: 0px; z-index: 15000"
-        :style="{ display: portalDetail.display }"
+        style="
+          width: auto;
+          left: 0px;
+          top: 0px;
+          z-index: 15000;
+          overflow: scroll;
+        "
+        :style="{ display: portalDetail.display, height: height }"
         @click.capture="clickMenuSelectWidget"
       >
         <div tabindex="0" class="v-trap-focus-indicator"></div>
@@ -26,7 +32,6 @@
           >
             <i class="v-icon v-icon--select"></i>
             <span class="title">{{ detailMessage.title }}</span>
-            
           </div>
         </div>
         <div tabindex="0" class="v-trap-focus-indicator"></div>
@@ -39,6 +44,7 @@
 export default {
   data() {
     return {
+      height: "auto",
       portalDetail: {
         display: "none",
         selectedNum: 0,
@@ -89,9 +95,9 @@ export default {
   },
   methods: {
     // 点击本页面
-    clickMenuSelectWidget(){
+    clickMenuSelectWidget() {
       this.portalDetail.display = "block";
-      window.addEventListener("click", this.hiddenSelectWidgetItem,true);
+      window.addEventListener("click", this.hiddenSelectWidgetItem, true);
     },
     // 点击选择框的每一项
     clickMenuItem(detailMessageIndex) {
@@ -102,6 +108,7 @@ export default {
           index: detailMessageIndex,
           cls: "v-widget-item sds-window-v5 syno-sds-widget-item",
           cls1: this.portalDetail.detailMessageList[detailMessageIndex].cls,
+          title: this.portalDetail.detailMessageList[detailMessageIndex].title,
         };
         this.$bus.emit("showOrHiddenWidgetItem", obj);
       } else {
@@ -111,6 +118,7 @@ export default {
           index: detailMessageIndex,
           cls: "v-widget-item sds-window-v5 syno-sds-widget-item active",
           cls1: this.portalDetail.detailMessageList[detailMessageIndex].cls,
+          title: this.portalDetail.detailMessageList[detailMessageIndex].title,
         };
         this.$bus.emit("showOrHiddenWidgetItem", obj);
       }
@@ -151,19 +159,22 @@ export default {
         if (this.portalDetail.display === "none") {
           this.portalDetail.display = "block";
           this.$bus.emit("showOrHiddenSelectWidgetPosition", "none");
-          window.addEventListener("click", this.hiddenSelectWidgetItem,true);
+          window.addEventListener("click", this.hiddenSelectWidgetItem, true);
+          this.changeSelectedMenuItem();
+          window.addEventListener("resize", this.changeSelectedMenuItem());
         } else if (this.portalDetail.display === "block") {
           this.portalDetail.display = "none";
+          window.removeEventListener("resize", this.changeSelectedMenuItem());
         }
       }
     },
     // 隐藏选择框
-    hiddenSelectWidgetItem(e){
-        let el = document.querySelector(".v-widget-header-tool-icon.add");
-        if (e.srcElement !== el) {
-            this.portalDetail.display = "none";
-        }
-        window.removeEventListener("click", this.hiddenSelectWidgetItem,true);
+    hiddenSelectWidgetItem(e) {
+      let el = document.querySelector(".v-widget-header-tool-icon.add");
+      if (e.srcElement !== el) {
+        this.portalDetail.display = "none";
+      }
+      window.removeEventListener("click", this.hiddenSelectWidgetItem, true);
     },
     //统计已选择的个数
     countSelectedMenuItem() {
@@ -177,6 +188,13 @@ export default {
         }
       });
     },
+    changeSelectedMenuItem() {
+      if (document.documentElement.clientHeight < 290) {
+        this.height = "calc(100vh - 50px)";
+      } else {
+        this.height = "auto";
+      }
+    },
   },
   mounted() {
     this.$bus.on(
@@ -187,3 +205,12 @@ export default {
   components: {},
 };
 </script>
+<style lang="css" scroped>
+.v-menu {
+  min-height: 124px;
+}
+
+.v-menu::-webkit-scrollbar {
+  display: none !important;
+}
+</style>

src/component/Container/Desktop/Shortcut/index.vue

@@ -43,18 +43,21 @@ export default {
       "clickAppViewItemClearUnReady",
       this.clickAppViewItemClearUnReady
     );
-    this.shortcutDetail.detailMessageList.forEach((item) => {
-      if (item.unReadyMessage.length) {
-        item.unReadyMessageCls = "bounce-effect";
-      }
-    });
+    setTimeout(() => {
+      this.shortcutDetail.detailMessageList.forEach((item) => {
+        if (item.unReadyMessage.length) {
+          item.unReadyMessageCls = "bounce-effect";
+        }
+      });
+    },800);
+    
     setTimeout(() => {
       this.shortcutDetail.detailMessageList.forEach((item) => {
         if (item.unReadyMessageCls === "bounce-effect") {
           item.unReadyMessageCls = "";
         }
       });
-    },800);
+    },1800);
   },
   data() {
     return {

src/component/Container/DesktopAppView/AppViewItem/index.vue

@@ -4,6 +4,7 @@
     v-if="resizablePinnedDetail.detailMessageList.length"
     :style="{ display: display, height: '100vh' }"
     class="menuWindow"
+    data-id="1111"
   >
     <div
       class="x-window synopkg-window sds-window-v5 x-resizable-pinned"
@@ -302,7 +303,6 @@ export default {
     this.$bus.on("menuItemChanged", this.menuItemChanged);
     this.$bus.on("clickMenuItem", this.clickMenuItem);
     this.$bus.on("hiddenOrShowOtherWindow", this.hiddenDialogWindow);
-    // this.$bus.on("fixWindowZIndexchange", this.fixWindowZIndexchange);
     this.resizablePinnedDetail.detailMessageList = JSON.parse(
       JSON.stringify(this.detailMessageList)
     );
@@ -358,8 +358,6 @@ export default {
       ) {
         return;
       }
-      // this.resizablePinnedDetail.detailMessageList[detailMessageIndex].cls =
-      //   "active-win";
       this.resizablePinnedDetail.detailMessageList.forEach((item) => {
         item.cls = "deactive-win";
       });
@@ -383,7 +381,6 @@ export default {
       if ((menuIndex || menuIndex == 0) && menuIndex != -1) {
         this.openDialogWindow(menuIndex);
       }
-      // this.$bus.emit('dialogWindowZIndexIsMax',true)
     },
     // 打开DSM 说明
     openDSMWindow() {
@@ -462,10 +459,6 @@ export default {
       this.resizablePinnedDetail.detailMessageList[
         detailMessageIndex
       ].iconMaximize = "block";
-      // this.countOpenWindowNum();
-      // if (detailMessageIndex || detailMessageIndex === 0 && detailMessageIndex !== -1) {
-      //   this.openDialogWindow(detailMessageIndex);
-      // }
     },
     //关闭弹出窗口
     closeWindow(id) {
@@ -476,14 +469,6 @@ export default {
       this.resizablePinnedDetail.detailMessageList[detailMessageIndex].display =
         "none";
       this.$bus.emit("closeDialogWindow", id);
-      // let detailMessageList =
-      //   this.resizablePinnedDetail.detailMessageList.filter((item) => {
-      //     return item.display === "block";
-      //   });
-      // if (detailMessageList.length) {
-      //   detailMessageList = JSON.parse(
-      //     JSON.stringify(this.arraySort(detailMessageList, "zIndex"))
-      //   );
       this.resizablePinnedDetail.detailMessageList[detailMessageIndex].zIndex =
         this.defaultZIndex - 10;
       this.$bus.emit("changeDefaultZIndex", this.defaultZIndex - 10);
@@ -503,7 +488,6 @@ export default {
           item.zIndex = 9050;
           item.cls = "deactive-win";
         });
-        // this.$bus.emit("changeDefaultZIndex", 9050);
       }
     },
     // 按z-index 给menuItem排序
@@ -514,20 +498,9 @@ export default {
         return x < y ? -1 : x > y ? 1 : 0;
       });
     },
-    // 当固定窗口的zIndex改变时
-    fixWindowZIndexchange() {},
 
     // 鼠标按下弹出框窗口头部
     mousedownWindowHeader(e, index) {
-      let el = console.log();
-      // index.left =
-      // let el = document.querySelector(
-      //   ".v-widget-window .v-window-header-wrapper"
-      // // );
-      // this.widgetFirstClick.layerX = e.layerX;
-      // this.widgetFirstClick.screenX = document.documentElement.clientWidth;
-      // this.widgetFirstClick.layerY = e.layerY;
-      // this.widgetFirstClick.screenY = document.documentElement.clientHeight;
       document.addEventListener(
         "mousemove",
         this.moveWindowPosition
@@ -540,13 +513,6 @@ export default {
     },
     // 移动弹出框窗口位置
     moveWindowPosition(e) {
-      console.log(e);
-      // console.log(this.resizablePinnedDetail.detailMessageList[index].left);
-      
-      // document.addEventListener("mouseup", () => {
-      //   console.log(1111)
-      //   
-      // });
     },
     // 鼠标松开
     upWindowPosition(e){

src/component/Container/DesktopAppView/index.vue

@@ -92,7 +92,6 @@ export default {
     };
   },
   mounted() {
-    console.log("mount");
     this.$bus.on("showAppView", this.showAppView);
     this.desktopAppViewDetail.detailMessageList = this.appViewData;
   },
@@ -102,11 +101,6 @@ export default {
       this.display = "block";
       this.$bus.emit("hiddenOrShowOtherWindow", true);
       window.addEventListener("click", this.WindowClick);
-      this.$nextTick(() => {
-        console.log(22);
-        // conso
-        // this.cls = "syno-sds-appview-animate";
-      });
       if (this.firstOpen) {
         this.desktopAppViewDetail.detailMessageList.forEach((item) => {
           if (item.unReadyMessage.length) {
@@ -165,15 +159,6 @@ export default {
       this.WindowClick();
     },
   },
-  watch: {
-    desktopAppViewDetail: {
-      handler() {
-        console.log("wath");
-      },
-      deep: true,
-      immediate: true,
-    },
-  },
   components: {
     AppViewItem,
   },