桌面主菜单层级逻辑

public/index.html

@@ -2801,7 +2801,7 @@
                     </div>
                 </div>
                 <div class="x-window synopkg-window sds-window-v5 x-resizable-pinned active-win tjDetail"
-                    style="position: absolute; z-index: 9053; visibility: visible; left: 50%; top: 0px; width: 1254px;transform: translateX(-50%);">
+                    style="position: absolute; z-index: 9050; visibility: visible; left: 50%; top: 0px; width: 1254px;transform: translateX(-50%);">
                     <div class="x-dlg-focus tjCenter" tabindex="0" role="application" aria-label="套件中心"></div>
                     <div class="x-window-tl">
                         <div class="x-window-tr">

public/index.js

@@ -62,8 +62,6 @@ window.onload = () => {
             let window = toolClose.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement
             window.style.display = 'none'
             let windowTitle = window.children[0].className.slice(12)
-            console.log(windowTitle)
-            
         })
     })
 

src/App.vue

@@ -1,50 +1,75 @@
 <template>
   <div class="container">
     <div class="contain">
-      <Header></Header>
-      <Desktop :defaultZIndex="defaultZIndex"></Desktop>
-      <DesktopAppView :defaultZIndex="defaultZIndex"></DesktopAppView>
+      <Container></Container>
     </div>
   </div>
 </template>
 
 <script>
-import Header from "./component/Header";
-import Desktop from "./component/Desktop";
-import DesktopAppView from "./component/DesktopAppView";
+import Container from "./component/Container";
 
 import { getCurrentInstance } from "vue";
 import mitt from "mitt";
 export default {
   data() {
-    return {
-      defaultZIndex: 9053,
-    };
+    return {}
   },
+    
   beforeCreate() {
     const ins = getCurrentInstance();
     ins.appContext.config.globalProperties.$bus = mitt();
   },
-  mounted(){
-    this.$bus.on('changeDefaultZIndex',this.changeDefaultZIndex)
-  },
-  methods:{
-    // 改变公共zIndex
-    changeDefaultZIndex(zIndex){
-      if(this.defaultZIndex > 999999990){
-        this.defaultZIndex = 999999990
-      }
-      this.defaultZIndex = zIndex
-    },
-  },
+  // mounted() {
+  //   this.$bus.on("changeDefaultZIndex", this.changeDefaultZIndex);
+  // },
+  // methods: {
+  //   // 改变公共zIndex
+  //   changeDefaultZIndex(zIndex) {
+  //     if (this.defaultZIndex > 999999990) {
+  //       this.defaultZIndex = 999999990;
+  //     }
+  //     this.defaultZIndex = zIndex;
+  //   },
+  // },
+  // watch: {
+  //   defaultZIndex() {
+  //     console.log(
+  //       this.fixWindowData,
+  //       this.appViewData,
+  //       this.openUserSettingData,
+  //     );
+  //     let appViewIndex =  this.appViewData.findIndex(item=>{
+  //       return item.zIndex >= this.defaultZIndex && item.display === 'block'
+  //     })
+  //     console.log(appViewIndex)
+  //     if(appViewIndex !== -1){
+  //       this.appViewData[appViewIndex].cls = 'active-win'
+  //     }else if(this.fixWindowData.zIndex >= this.defaultZIndex && this.fixWindowData.display === 'block'){
+  //       this.fixWindowData.cls = 'active-win'
+  //       this.openUserSettingData.cls = 'deactive-win'
+  //       this.appViewData.forEach(item=>{
+  //         if(item.cls === 'active-win'){
+  //           item.cls = 'deactive-win'
+  //         }
+  //       })
+  //     }else if(this.openUserSettingData.zIndex >= this.defaultZIndex && this.openUserSettingData.display === 'block'){
+  //       this.openUserSettingData.cls = 'active-win'
+  //       this.fixWindowData.cls = 'deactive-win'
+  //       this.appViewData.forEach(item=>{
+  //         if(item.cls === 'active-win'){
+  //           item.cls = 'deactive-win'
+  //         }
+  //       })
+  //     }
   components: {
-    Header,
-    Desktop,
-    DesktopAppView,
+    // Header,
+    // Desktop,
+    // DesktopAppView,
+    Container
   },
 };
 </script>
 
 <style lang="">
-
 </style>

src/component/Container/index.vue

@@ -0,0 +1,589 @@
+<template>
+    <!-- 容器 -->
+    <div>
+      <Header></Header>
+      <Desktop
+        :defaultZIndex="defaultZIndex"
+        :openUserSettingData="openUserSettingData"
+        :fixWindowData="fixWindowData"
+      ></Desktop>
+      <DesktopAppView
+        :defaultZIndex="defaultZIndex"
+        :appViewData="appViewData"
+      ></DesktopAppView>
+    </div>
+</template>
+
+<script>
+import Header from "../Header";
+import Desktop from "../Desktop";
+import DesktopAppView from "../DesktopAppView";
+export default {
+  data() {
+    return {
+      defaultZIndex: 9050,
+      appViewData: [
+        {
+          id: 0,
+          width: "1150px",
+          height: "calc(100vh - 120px)",
+          minHeight: "520px",
+          title: "控制中心",
+          spacialCls: "controlCenter",
+          cls: "deactive-win",
+          titleImgUrl: "../../../../public/image/index/controlCenter.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 1,
+          width: "1010px",
+          height: "calc(100vh - 220px)",
+          minHeight: "420px",
+          title: "DSM 说明",
+          spacialCls: "question",
+          cls: "deactive-win",
+          titleImgUrl: "../../../../public/image/index/question.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 2,
+          width: "1254px",
+          height: "calc(100vh - 80px)",
+          minHeight: "560px",
+          title: "套件中心",
+          spacialCls: "tjCenter",
+          cls: "deactive-win",
+          titleImgUrl: "../../../../public/image/index/tjCenter.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 3,
+          width: "1230px",
+          height: "calc(100vh - 200px)",
+          minHeight: "560px",
+          title: "资源监控",
+          spacialCls: "resourceMonitor",
+          cls: "deactive-win",
+          titleImgUrl:
+            "../../../../public/image/DesktopAppView/resourceMonitor.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 4,
+          width: "1220px",
+          height: "calc(100vh - 210px)",
+          minHeight: "560px",
+          title: "存储管理器",
+          spacialCls: "storageManager",
+          cls: "deactive-win",
+          titleImgUrl:
+            "../../../../public/image/DesktopAppView/storageManager.png",
+
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 5,
+          width: "1210px",
+          height: "calc(100vh - 190px)",
+          minHeight: "560px",
+          title: "logCenter",
+          spacialCls: "controlCenter",
+          cls: "deactive-win",
+          titleImgUrl: "../../../../public/image/DesktopAppView/logCenter.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 6,
+          width: "1200px",
+          height: "calc(100vh - 180px)",
+          minHeight: "560px",
+          title: "安全顾问",
+          spacialCls: "securityScan",
+          cls: "deactive-win",
+          titleImgUrl:
+            "../../../../public/image/DesktopAppView/securityScan.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 7,
+          width: "1190px",
+          height: "calc(100vh - 170px)",
+          minHeight: "560px",
+          title: "技术支持中心",
+          spacialCls: "supportCenter",
+          cls: "deactive-win",
+          titleImgUrl:
+            "../../../../public/image/DesktopAppView/supportCenter.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 8,
+          width: "1170px",
+          height: "calc(100vh - 160px)",
+          minHeight: "560px",
+          title: "Storage Manager",
+          spacialCls: "storageManager",
+          cls: "deactive-win",
+          titleImgUrl:
+            "../../../../public/image/DesktopAppView/storageManager.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 9,
+          width: "1160px",
+          height: "calc(100vh - 150px)",
+          minHeight: "560px",
+          title: "Synology MailPlus Server",
+          spacialCls: "mailPlusServer",
+          cls: "deactive-win",
+          titleImgUrl:
+            "../../../../public/image/DesktopAppView/mailPlusServer.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 10,
+          width: "1150px",
+          height: "calc(100vh - 140px)",
+          minHeight: "560px",
+          title: "Synology Chat 管理控制台",
+          spacialCls: "chatAdminpng",
+          cls: "deactive-win",
+          titleImgUrl:
+            "../../../../public/image/DesktopAppView/chatAdminpng.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 11,
+          width: "1140px",
+          height: "calc(100vh - 130px)",
+          minHeight: "560px",
+          title: "Synology Chat",
+          spacialCls: "chat",
+          cls: "deactive-win",
+          titleImgUrl: "../../../../public/image/DesktopAppView/chat.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 12,
+          width: "1010px",
+          height: "calc(100vh - 200px)",
+          minHeight: "440px",
+          title: "File Station",
+          spacialCls: "file",
+          cls: "deactive-win",
+          titleImgUrl: "../../../../public/image/index/file.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 13,
+          width: "1120px",
+          height: "calc(100vh - 110px)",
+          minHeight: "560px",
+          title: "Hyper Backup",
+          spacialCls: "hyperBackup",
+          cls: "deactive-win",
+          titleImgUrl:
+            "../../../../public/image/DesktopAppView/hyperBackup.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 14,
+          width: "1110px",
+          height: "calc(100vh - 100px)",
+          minHeight: "560px",
+          title: "Advanced Media Extensions",
+          spacialCls: "aME",
+          cls: "deactive-win",
+          titleImgUrl: "../../../../public/image/DesktopAppView/aME.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 15,
+          width: "1100px",
+          height: "calc(100vh - 90px)",
+          minHeight: "560px",
+          title: "Synology Calendar",
+          spacialCls: "synologyCalendar",
+          cls: "deactive-win",
+          titleImgUrl:
+            "../../../../public/image/DesktopAppView/synologyCalendar.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 16,
+          width: "1090px",
+          height: "calc(100vh - 80px)",
+          minHeight: "560px",
+          title: "Synology Contacts",
+          spacialCls: "contacts",
+          cls: "deactive-win",
+          titleImgUrl: "../../../../public/image/DesktopAppView/contacts.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 17,
+          width: "1070px",
+          height: "calc(100vh - 70px)",
+          minHeight: "560px",
+          title: "Universal Search",
+          spacialCls: "universalSearch",
+          cls: "deactive-win",
+          titleImgUrl:
+            "../../../../public/image/DesktopAppView/universalSearch.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 18,
+          width: "1060px",
+          height: "calc(100vh - 60px)",
+          minHeight: "560px",
+          title: "Synology Photos",
+          spacialCls: "photos",
+          cls: "deactive-win",
+          titleImgUrl: "../../../../public/image/DesktopAppView/photos.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 19,
+          width: "1260px",
+          height: "calc(100vh - 210px)",
+          minHeight: "560px",
+          title: "Audio Station",
+          spacialCls: "audioStation",
+          cls: "deactive-win",
+          titleImgUrl:
+            "../../../../public/image/DesktopAppView/audioStation.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 20,
+          width: "1050px",
+          height: "calc(100vh - 30px)",
+          minHeight: "560px",
+          title: "Synology Drive 管理控制台",
+          spacialCls: "driveAdminConsole",
+          cls: "deactive-win",
+          titleImgUrl:
+            "../../../../public/image/DesktopAppView/driveAdminConsole.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 21,
+          width: "1060px",
+          height: "calc(100vh - 60px)",
+          minHeight: "560px",
+          title: "Download Station",
+          spacialCls: "downloadStation",
+          cls: "deactive-win",
+          titleImgUrl:
+            "../../../../public/image/DesktopAppView/downloadStation.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 22,
+          width: "1240px",
+          height: "calc(100vh - 170px)",
+          minHeight: "560px",
+          title: "Synology Drive",
+          spacialCls: "synologyDrive",
+          display: "none",
+          cls: "deactive-win",
+          titleImgUrl:
+            "../../../../public/image/DesktopAppView/synologyDrive.png",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 23,
+          width: "1130px",
+          height: "calc(100vh - 50px)",
+          minHeight: "560px",
+          title: "Synology MailPlus",
+          spacialCls: "mailPlus",
+          cls: "deactive-win",
+          titleImgUrl: "../../../../public/image/DesktopAppView/mailPlus.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 24,
+          width: "1050px",
+          height: "calc(100vh - 90px)",
+          minHeight: "560px",
+          title: "媒体服务器",
+          spacialCls: "mediaServer",
+          cls: "deactive-win",
+          titleImgUrl:
+            "../../../../public/image/DesktopAppView/mediaServer.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 25,
+          width: "1120px",
+          height: "calc(100vh - 100px)",
+          minHeight: "560px",
+          title: "Note Station",
+          spacialCls: "noteStation",
+          display: "none",
+          cls: "deactive-win",
+          titleImgUrl:
+            "../../../../public/image/DesktopAppView/noteStation.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 26,
+          width: "1130px",
+          height: "calc(100vh - 80px)",
+          minHeight: "560px",
+          title: "OAuth Service",
+          spacialCls: "authenticator",
+          cls: "deactive-win",
+          titleImgUrl:
+            "../../../../public/image/DesktopAppView/authenticator.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 27,
+          width: "1070px",
+          height: "calc(100vh - 180px)",
+          minHeight: "560px",
+          title: "PDF 查看器",
+          spacialCls: "documentViewer",
+          display: "none",
+          cls: "deactive-win",
+          titleImgUrl:
+            "../../../../public/image/DesktopAppView/documentViewer.png",
+          zIndex: "9050",
+        },
+        {
+          id: 28,
+          width: "1030px",
+          height: "calc(100vh - 200px)",
+          minHeight: "560px",
+          title: "Synology Drive ShareSync",
+          spacialCls: "package",
+          cls: "deactive-win",
+          titleImgUrl: "../../../../public/image/DesktopAppView/package.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 29,
+          width: "1110px",
+          height: "calc(100vh - 110px)",
+          minHeight: "560px",
+          title: "Video Station",
+          spacialCls: "videoStation",
+          cls: "deactive-win",
+          titleImgUrl:
+            "../../../../public/image/DesktopAppView/videoStation.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+        {
+          id: 30,
+          width: "1120px",
+          height: "calc(100vh - 120px)",
+          minHeight: "560px",
+          title: "文本编辑器",
+          spacialCls: "textEditor",
+          cls: "deactive-win",
+          titleImgUrl: "../../../../public/image/DesktopAppView/textEditor.png",
+          display: "none",
+          zIndex: 9050,
+          iconRestore: "none",
+          iconMaximize: "block",
+        },
+      ],
+      openUserSettingData: {
+        id: 1111,
+        display: "none",
+        width: "850px",
+        zIndex: 9040,
+        cls: "active-win",
+        title: "个人设置",
+        iconRestore: "none",
+        iconMaximize: "block",
+        restoreWidth: "850px",
+      },
+      fixWindowData: { 
+        zIndex: 9050, 
+        display: "block" ,
+        cls: "deactve-win"
+      },
+    };
+  },
+  mounted() {
+    this.$bus.on("changeDefaultZIndex", this.changeDefaultZIndex);
+  },
+  methods: {
+    // 改变公共zIndex
+    changeDefaultZIndex(zIndex) {
+      if (this.defaultZIndex > 999999990) {
+        this.defaultZIndex = 999999990;
+      }
+      this.defaultZIndex = zIndex;
+    },
+    // 按z-index 给窗口排序
+    arraySort(array, key) {
+      return array.sort(function (a, b) {
+        var x = a[key]; //如果要从大到小,把x,y互换就好
+        var y = b[key];
+        return x < y ? -1 : x > y ? 1 : 0;
+      });
+    },
+  },
+  watch: {
+    defaultZIndex() {
+      console.log(
+        this.fixWindowData,
+        this.appViewData,
+        this.openUserSettingData,
+      );
+      let appViewIndex =  this.appViewData.findIndex(item=>{
+        return item.zIndex >= this.defaultZIndex && item.display === 'block'
+      })
+      let fixWindowZIndexIsMax = this.fixWindowData.zIndex >= this.defaultZIndex && this.fixWindowData.display === 'block'
+      let openUserSettingZIndexMax = this.openUserSettingData.zIndex >= this.defaultZIndex && this.openUserSettingData.display === 'block'
+      if(appViewIndex !== -1){
+        this.appViewData[appViewIndex].cls = 'active-win'
+         this.openUserSettingData.cls = 'deactive-win'
+        this.fixWindowData.cls = 'deactive-win'
+      }else if(fixWindowZIndexIsMax){
+        this.fixWindowData.cls = 'active-win'
+        this.openUserSettingData.cls = 'deactive-win'
+        this.appViewData.forEach(item=>{
+          if(item.cls === 'active-win'){
+            item.cls = 'deactive-win'
+          }
+        })
+      }else if(openUserSettingZIndexMax){
+        this.openUserSettingData.cls = 'active-win'
+        this.fixWindowData.cls = 'deactive-win'
+        this.appViewData.forEach(item=>{
+          if(item.cls === 'active-win'){
+            item.cls = 'deactive-win'
+          }
+        })
+      }
+      if(appViewIndex === -1 && ! fixWindowZIndexIsMax && ! openUserSettingZIndexMax){
+          let appViewData = this.appViewData.filter(item=>{
+              return item.display === 'block'
+          })
+          appViewData = this.arraySort(appViewData, 'zIndex')
+          if(this.openUserSettingData.display === 'block'){
+              console.log(appViewData.length)
+              if(appViewData.length && appViewData[appViewData.length - 1].zIndex >= this.openUserSettingData.zIndex){
+              let index = this.appViewData.findIndex(item=>{
+                  return item.id ===  appViewData[appViewData.length - 1].id
+              })
+              this.appViewData[index].cls = 'active-win'
+            }else{
+                this.openUserSettingData.cls = 'active-win'
+            }
+          }else{
+              if(appViewData.length){
+                let index = this.appViewData.findIndex(item=>{
+                    return item.id ===  appViewData[appViewData.length - 1].id
+                })
+                this.appViewData[index].cls = 'active-win'
+              }
+          }
+          
+      }
+      
+    },
+  },
+  components: {
+    Header,
+    Desktop,
+    DesktopAppView,
+  },
+  name:'Container'
+};
+</script>
+
+<style lang="">
+</style>

src/component/Desktop/FixWindow/index.vue

@@ -9,14 +9,14 @@
       min-height: 164px !important;
     "
     :style="{
-      zIndex: zIndex,
-      display: display,
+      zIndex: fixWindowMessage.zIndex,
+      display: fixWindowMessage.display,
       top: top ? top : '',
       bottom: bottom ? bottom : '',
       left: left ? left : '',
       right: right ? right : '',
     }"
-    :class="cls"
+    :class="fixWindowMessage.cls"
     @click="clickFixWindow"
   >
     <div
@@ -144,17 +144,21 @@ import PortalSelectDialogWindow from "../PortalSelectDialogWindow";
 // 弹出位置选择框
 import PortaSelectPosition from "../PortaSelectPosition";
 export default {
-  props: ["defaultZIndex"],
+  props: ["defaultZIndex","fixWindowData"],
   data() {
     return {
-      zIndex: 9040,
-      cls: "deactve-win",
+      fixWindowMessage:{
+        zIndex:9050,
+        display:'block',
+        cls: "deactve-win",
+      },
       selectedNum: 2,
       display: "block",
       top: 0,
       bottom: "10px",
       right: "10px",
       left: 0,
+      widgetZindexIsMax: false,
       progrecssFirstClick: {
         lastY: 0,
         clickY: 0,
@@ -291,6 +295,8 @@ export default {
       "changeOrHiddenWidgetPosition",
       this.changeOrHiddenWidgetPosition
     )
+    this.$bus.on('dialogWindowZIndexIsMax',this.dialogWindowZIndexIsMax) 
+    this.fixWindowMessage = this.fixWindowData
     let el = document.querySelector(".v-widget-window .ps__thumb-y");
     let el1 = document.querySelector(".v-widget-window .v-window-header-wrapper");
     el.addEventListener("mouseup", this.mouseupProgress);
@@ -315,12 +321,13 @@ export default {
   methods: {
     //点击固定窗口
     clickFixWindow() {
-      if (this.zIndex < this.defaultZIndex) {
-        this.zIndex = this.defaultZIndex + 10;
+      if(! this.widgetZindexIsMax  && this.fixWindowMessage.cls === 'deactive-win'){
+        this.fixWindowMessage.zIndex = this.defaultZIndex + 10;
         this.$bus.emit("changeDefaultZIndex", this.defaultZIndex + 10);
-        this.$bus.emit("changeMinDefaultZindexWindowCls");
         this.$bus.emit("fixWindowZIndexMax", true);
+        this.widgetZindexIsMax = true
       }
+      console.log(this.fixWindowMessage.zIndex)
     },
     //点击进度条
     mousedownProgress(e) {
@@ -376,8 +383,6 @@ export default {
     // 进度条鼠标抬起/离开
     mouseupProgress() {
       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 .v-widget-list");
       el.removeEventListener("mousemove", this.moveProgress);
     },
     // 滚动窗口列表
@@ -485,22 +490,21 @@ export default {
     //显示或隐藏固定窗口
     showOrHiddenWidget(e) {
       let el = document.querySelector(".v-widget-window .v-widget-header-tool-icon.pin");
-      if (this.display === "block") {
+      if (this.fixWindowMessage.display === "block") {
         if(e.srcElement.className.includes(' pressed')){
           e.srcElement.className = e.srcElement.className.replace(' pressed','')
         }
-        this.display = "none";
-        if(this.zIndex >= this.defaultZIndex){
-           this.zIndex = this.defaultZIndex - 10;
+        this.fixWindowMessage.display = "none";
+        if(this.fixWindowMessage.zIndex >= this.defaultZIndex){
+           this.fixWindowMessage.zIndex = this.defaultZIndex - 10;
           this.$bus.emit("changeDefaultZIndex", this.defaultZIndex - 10);
           this.$bus.emit("fixWindowZIndexMax", false);
         }
         
       } else {
-        this.display = "block";
-        this.zIndex = this.defaultZIndex + 10;
+        this.fixWindowMessage.display = "block";
+        this.fixWindowMessage.zIndex = this.defaultZIndex + 10;
         this.$bus.emit("changeDefaultZIndex", this.defaultZIndex + 10);
-        console.log(this.defaultZIndex)
         this.$bus.emit("fixWindowZIndexMax", true);
         if(! e.srcElement.className.includes(' pressed')){
           e.srcElement.className = e.srcElement.className + ' pressed'
@@ -509,9 +513,9 @@ export default {
     },
     //最小化固定窗口
     minimizeFixWndow() {
-      this.display = "none";
-      if(this.zIndex >= this.defaultZIndex){
-        this.zIndex = this.defaultZIndex - 10;
+      this.fixWindowMessage.display = "none";
+      if(this.fixWindowMessage.zIndex >= this.defaultZIndex){
+        this.fixWindowMessage.zIndex = this.defaultZIndex - 10;
       this.$bus.emit("changeDefaultZIndex", this.defaultZIndex - 10);
       this.$bus.emit("fixWindowZIndexMax", false);
       }
@@ -556,25 +560,27 @@ export default {
       if (el.className.includes("active")) {
         el.className = el.className.replace(" active", "");
         this.$bus.emit("fixWindowZIndexMax", false);
-        this.zIndex = this.defaultZIndex;
+        this.fixWindowMessage.zIndex = this.defaultZIndex - 10;
         this.$bus.emit("changeDefaultZIndex", this.defaultZIndex -10);
-        this.$bus.emit("fixWindowZIndexMax", true);
       } else {
         el.className = el.className + " active";
-        this.zIndex = 999999999;
+        this.fixWindowMessage.zIndex = 999999999;
         this.$bus.emit("changeDefaultZIndex", this.defaultZIndex + 10);
         this.$bus.emit("fixWindowZIndexMax", true);
       }
     },
-    //判断弹出窗ZIndex是不是比较大
-    dialogWindowZIndexIsMax(bol) {
-      if (bol) {
-        this.cls = "deactive-win";
-      } else {
-        this.cls = "active-win";
-      }
+    // 弹出窗的zIndex是最大的
+    dialogWindowZIndexIsMax(bol){
+      // if(bol){
+      //   if(this.fixWindowMessage.zIndex >= this.defaultZIndex){
+      //     this.fixWindowMessage.zIndex = this.defaultZIndex - 10
+          this.widgetZindexIsMax = false
+      //   }
+      // }else{
+      //   this.fixWindowMessage.zIndex = this.defaultZIndex + 10
+      //   this.$bus.emit("changeDefaultZIndex", this.defaultZIndex + 10);
+      // }
     },
-
     //节流函数
     throttle(fn, time, e) {
       var lastTime = 0;
@@ -588,12 +594,16 @@ export default {
     },
   },
   watch:{
-    defaultZIndex(newVal){
-      if(this.zIndex < newVal){
-        this.cls = 'deactive-win'
-      }else{
-        this.cls = 'active-win'
-      }
+    // defaultZIndex(){
+    //   console.log(this.fixWindowMessage.zIndex,this.defaultZIndex,this.fixWindowData.zIndex)
+    //   if(this.fixWindowMessage.zIndex < this.defaultZIndex){
+    //     this.fixWindowMessage.cls = 'deactive-win'
+    //   }else{
+    //     this.fixWindowMessage.cls = 'active-win'
+    //   }
+    // },
+    fixWindowData(){  
+      this.fixWindowMessage = this.fixWindowData
     }
   },
   beforeDestroy() {

src/component/Desktop/Menu/index.vue

@@ -3,7 +3,7 @@
   <div class="menu sds-desktop">
     <ul class="menushow" v-if="menuList.length">
       <li :class="menu.spacialCls" v-for="(menu,menuIndex) in menuList" :key="menu.index" :style="{background:menu.backgroundColor}"
-      @click="clickMenuItem(menu.imgUrl,menuIndex)">
+      @click="clickMenuItem(menu.id,menuIndex)">
         <div :class="menu.spacialCls" :style="{backgroundImage:`url(${menu.imgUrl})`}"></div>
       </li>
     </ul>
@@ -23,7 +23,7 @@ export default {
     this.$bus.on('clickShortcutItem',this.clickShortcutItem)
     this.$bus.on("changeDialogWindow",this.changeDialogWindow)
     this.$bus.on('closeDialogWindow',this.closeDialogWindow)
-    this.$bus.emit('showZindexMaxMenuItem',this.showZindexMaxMenuItem)
+    this.$bus.on('showZindexMaxMenuItem',this.showZindexMaxMenuItem)
   },
   methods:{
     // 点击大图标打开小图标
@@ -43,7 +43,6 @@ export default {
           })
         }
       }
-      console.log(spacialCls)
       if(!this.isHaveMenuItem){
         let menuItem = {
           id:new Date().getTime(),
@@ -51,29 +50,27 @@ export default {
           imgUrl:obj.imgUrl,
           zIndex:obj.zIndex,
           title:obj.title,
+          id: obj.id,
           backgroundColor:'rgba(225,225,225,0.5)'
         }
         this.menuList.push(menuItem)
         this.$bus.emit('menuItemChanged',this.menuList)
       }
-      
     },
-    // 点击小图标打开大图标
-    clickMenuItem(imgUrl,menuIndex){
+    // 点击小图标切换弹出窗口
+    clickMenuItem(id,menuIndex){
       this.menuList.forEach(menu => {
         menu.backgroundColor = 'rgba(50,60,70,0.9)'
       })
        this.menuList[menuIndex].backgroundColor = 'rgba(225,225,225,0.5)'
-       console.log(this.menuList[menuIndex].spacialCls)
       // 打开个人设置页面
-      if(this.menuList[menuIndex].spacialCls === 'personalSetting'){
+      if(id === 1111){
         this.$bus.emit('openUserSetting')
       }
-      this.$bus.emit('clickMenuItem',imgUrl)
+      this.$bus.emit('changeDialogMenuWindow',id)
     },
     // 点击弹出窗页面切换小图标选中状态
     changeDialogWindow(menu){
-      console.log(menu)
       if(typeof(menu) == 'string'){
         this.getMenuItem(menu)
         if(this.menuIndex != -1){
@@ -83,7 +80,7 @@ export default {
           this.menuList[this.menuIndex].backgroundColor = 'rgba(225,225,225,0.5)'
         }
       }else if (typeof(menu) == 'object'){
-        this.getMenuItem(menu.imgUrl)
+        this.getMenuItem(menu.id)
         this.menuList.forEach(menu => {
           menu.backgroundColor = 'rgba(50,60,70,0.9)'
         })
@@ -96,8 +93,8 @@ export default {
       }
     },
     // 点击弹出窗页面叉号删去小图标
-    closeDialogWindow(imgUrl){
-      this.getMenuItem(imgUrl)
+    closeDialogWindow(id){
+      this.getMenuItem(id)
       this.menuList.splice(this.menuIndex,1)
       if(!this.menuList.length){
         this.isHaveMenuItem = false
@@ -110,15 +107,14 @@ export default {
         }
       }
     },
-    // 通过imgUrl获取对应的小图标下标
-    getMenuItem(imgUrl){
+    // 通过id获取对应的小图标下标
+    getMenuItem(id){
       this.menuIndex = this.menuList.findIndex(item =>{
-        return item.imgUrl === imgUrl
+        return item.id === id
       })
     },
     // 显示zindex最大的menuItem
     showZindexMaxMenuItem(){
-      console.log(this.menuList)
     }
   },
   beforeDestroy() {

src/component/Desktop/NotifyTrayPanel/index.vue

@@ -491,7 +491,6 @@ export default {
     },
     //打开详情页面
     openNotifyDetail(detailMessage, detailMessageIndex,e) {
-      console.log(e)
       this.hiddenNotifyAndchangeIconColor(e)
       // openNotifyDetail(detailMessage, detailMessageIndex,e) 
       this.$bus.emit("openNotifyDetail", detailMessage);

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

@@ -231,7 +231,7 @@ export default {
           //   cls: "deactive-win",
           //   titleImgUrl: "../../../../public/image/index/tjCenter.png",
           //   display: "none",
-          //   zIndex: 9053,
+          //   zIndex: 9050,
           //   iconRestore: "none",
           //   iconMaximize: "block",
           // },
@@ -245,7 +245,7 @@ export default {
           //   cls: "deactive-win",
           //   titleImgUrl: "../../../../public/image/index/controlCenter.png",
           //   display: "none",
-          //   zIndex: 9053,
+          //   zIndex: 9050,
           //   iconRestore: "none",
           //   iconMaximize: "block",
           // },
@@ -259,7 +259,7 @@ export default {
           //   cls: "deactive-win",
           //   titleImgUrl: "../../../../public/image/index/file.png",
           //   display: "none",
-          //   zIndex: 9053,
+          //   zIndex: 9050,
           //   iconRestore: "none",
           //   iconMaximize: "block",
           // },
@@ -273,7 +273,7 @@ export default {
           //   cls: "deactive-win",
           //   titleImgUrl: "../../../../public/image/index/question.png",
           //   display: "none",
-          //   zIndex: 9053,
+          //   zIndex: 9050,
           //   iconRestore: "none",
           //   iconMaximize: "block",
           // },
@@ -303,6 +303,7 @@ export default {
     this.$bus.on("clickMenuItem", this.clickMenuItem);
     this.$bus.on("openDSMWindow", this.openDSMWindow);
     this.$bus.on("changeDialogMenuWindow", this.changeDialogMenuWindow);
+    this.$bus.on("fixWindowZIndexMax", this.fixWindowZIndexMax);
     this.resizablePinnedDetail.detailMessageList = JSON.parse(JSON.stringify(this.detailMessageList))
      JSON.parse(JSON.stringify(this.detailMessageList)).forEach((item,index)=>{
       this.detailMessageWidthList[index] = item.width
@@ -326,7 +327,6 @@ export default {
     },
     // 打开弹出窗口
     openDialogWindow(detailMessageIndex) {
-      console.log(detailMessageIndex);
       if (
         (!detailMessageIndex && detailMessageIndex != 0) ||
         detailMessageIndex == -1
@@ -343,9 +343,6 @@ export default {
         "block";
       this.resizablePinnedDetail.detailMessageList[detailMessageIndex].cls =
         "active-win";
-      // this.$bus.emit("changeFixWindowZIndex");
-     
-      console.log('1121')
       this.resizablePinnedDetail.detailMessageList.forEach((item) => {
         item.cls = "deactive-win";
       });
@@ -361,12 +358,10 @@ export default {
     },
     // 切换弹出的menu窗口
     changeDialogMenuWindow(title) {
-      console.log(title)
       let menuIndex = this.resizablePinnedDetail.detailMessageList.findIndex(item =>{
         return item.title === title
       })
       if((menuIndex || menuIndex == 0) && menuIndex != -1){
-        this.openDialogWindow(menuIndex);
       }
     },
     // 打开DSM 说明
@@ -377,9 +372,6 @@ export default {
       if(detailMessageIndex && detailMessageIndex != -1){
         this.openDialogWindow(detailMessageIndex);
       }
-      
-        console.log('title',this.resizablePinnedDetail.detailMessageList[detailMessageIndex]
-        .title)
       let obj={
         imgUrl:
         this.resizablePinnedDetail.detailMessageList[detailMessageIndex]
@@ -472,7 +464,7 @@ export default {
       });
       if (this.openWindowNum == 0) {
         this.resizablePinnedDetail.detailMessageList.forEach((item) => {
-          item.zIndex = 9053;
+          item.zIndex = 9050;
         });
       }
     },
@@ -495,16 +487,10 @@ export default {
         this.resizablePinnedDetail.detailMessageList.findIndex((item) => {
           return item.zIndex >= this.defaultZIndex && item.display === "block";
         });
-      console.log(this.dialogZIndexMaxIndex);
       if (
         this.dialogZIndexMaxIndex != -1 &&
         this.dialogZIndexMaxIndex != undefined
       ) {
-        console.log(
-          this.resizablePinnedDetail.detailMessageList[
-            this.dialogZIndexMaxIndex
-          ].titleImgUrl
-        );
         this.resizablePinnedDetail.detailMessageList.forEach((item) => {
           if (item.cls === "active-win") {
             item.cls = "deactive-win";
@@ -513,7 +499,6 @@ export default {
         this.resizablePinnedDetail.detailMessageList[
           this.dialogZIndexMaxIndex
         ].cls = "active-win";
-        console.log('title',this.resizablePinnedDetail.detailMessageList[this.dialogZIndexMaxIndex].title)
         let obj = {
           imgUrl: this.resizablePinnedDetail.detailMessageList[this.dialogZIndexMaxIndex].titleImgUrl,
           zIndex: this.resizablePinnedDetail.detailMessageList[this.dialogZIndexMaxIndex].zIndex,
@@ -540,7 +525,7 @@ export default {
   name: "ResizablePinned",
 };
 </script>
-<style scope lang="css">
+<style scoped lang="css">
 @media screen and (max-height: 600px){
   .x-window.synopkg-window{
     top:0 !important;

src/component/Desktop/Shortcut/index.vue

@@ -7,16 +7,10 @@
           class="launch-icon icon-item"
           :class="detailMessage.spacialCls"
           tabindex="0"
-          v-for="(
-            detailMessage, detailMessageIndex
-          ) in shortcutDetail.detailMessageList"
+          v-for="detailMessage in shortcutDetail.detailMessageList"
           :key="detailMessage.id"
           @click="
-            clickShortcutItem(
-              detailMessageIndex,
-              detailMessage.spacialCls,
-              detailMessage.titleImgUrl
-            )
+            clickShortcutItem(detailMessage.id)
           "
         >
           <div
@@ -34,7 +28,7 @@
         </li>
       </div>
     </ul>
-    <ResizablePinned :defaultZIndex="defaultZIndex" :detailMessageList = shortcutDetail.detailMessageList></ResizablePinned>
+    <!-- <ResizablePinned :defaultZIndex="defaultZIndex" :detailMessageList = shortcutDetail.detailMessageList></ResizablePinned> -->
   </div>
 </template>
 
@@ -47,7 +41,7 @@ export default {
       shortcutDetail: {
         detailMessageList: [
           {
-            id: 0,
+            id: 2,
             width: "1254px",
             height: "calc(100vh - 80px)",
             minHeight: "560px",
@@ -56,12 +50,12 @@ export default {
             cls: "deactive-win",
             titleImgUrl: "../../../../public/image/index/tjCenter.png",
             display: "none",
-            zIndex: 9053,
+            zIndex: 9050,
             iconRestore: "none",
             iconMaximize: "block",
           },
           {
-            id: 1,
+            id: 0,
             width: "1150px",
             height: "calc(100vh - 120px)",
             minHeight: "520px",
@@ -70,12 +64,12 @@ export default {
             cls: "deactive-win",
             titleImgUrl: "../../../../public/image/index/controlCenter.png",
             display: "none",
-            zIndex: 9053,
+            zIndex: 9050,
             iconRestore: "none",
             iconMaximize: "block",
           },
           {
-            id: 2,
+            id: 12,
             width: "1010px",
             height: "calc(100vh - 200px)",
             minHeight: "440px",
@@ -84,12 +78,12 @@ export default {
             cls: "deactive-win",
             titleImgUrl: "../../../../public/image/index/file.png",
             display: "none",
-            zIndex: 9053,
+            zIndex: 9050,
             iconRestore: "none",
             iconMaximize: "block",
           },
           {
-            id: 3,
+            id: 1,
             width: "1010px",
             height: "calc(100vh - 220px)",
             minHeight: "420px",
@@ -98,7 +92,7 @@ export default {
             cls: "deactive-win",
             titleImgUrl: "../../../../public/image/index/question.png",
             display: "none",
-            zIndex: 9053,
+            zIndex: 9050,
             iconRestore: "none",
             iconMaximize: "block",
           },
@@ -107,9 +101,8 @@ export default {
     };
   },
   methods: {
-    clickShortcutItem(detailMessageIndex, spacialCls, imgUrl) {
-      let obj = { detailMessageIndex, spacialCls, imgUrl };
-      this.$bus.emit("clickShortcutItem", obj);
+    clickShortcutItem(id) {
+      this.$bus.emit("clickAppViewItem", id);
     },
   },
   components: {

src/component/Desktop/UserSetting/index.vue

@@ -1,12 +1,7 @@
 <template>
   <!-- userSetting -->
   <div
-    class="
-      v-layout
-      sds-personal-settings-window
-      layout-window-app
-      v-window
-    "
+    class="v-layout sds-personal-settings-window layout-window-app v-window"
     style="
       position: absolute;
       height: 574px;
@@ -14,9 +9,13 @@
       left: 50%;
       transform: translate(-50%, -50%);
     "
-    :style="{ display: display, zIndex: zIndex, width:width}"
-    :class="cls"
+    :style="{
+      zIndex: openUserSettingDetail.zIndex,
+      width: openUserSettingDetail.width,
+    }"
+    :class="openUserSettingDetail.cls"
     @click="clickUserSetting"
+    v-if="openUserSettingDetail.display === 'block'"
   >
     <div class="v-window-header-wrapper draggable">
       <div
@@ -26,13 +25,23 @@
         "
       ></div>
       <div class="v-window-header-text">
-        <div class="v-window-header-title">{{title}}</div>
+        <div class="v-window-header-title">
+          {{ openUserSettingDetail.title }}
+        </div>
       </div>
       <div class="window-header-tool-wrapper light">
         <div class="tool help" @click.stop="openDSMWindow"></div>
         <div class="tool minimize" @click.stop="minUserSetting"></div>
-        <div class="tool maximize" :style="{display:iconMaximize}" @click="maxiMizeUserSetting"></div>
-        <div class="tool restore" :style="{display:iconRestore}" @click="RestoreUserSetting"></div>
+        <div
+          class="tool maximize"
+          :style="{ display: openUserSettingDetail.iconMaximize }"
+          @click="maxiMizeUserSetting"
+        ></div>
+        <div
+          class="tool restore"
+          :style="{ display: openUserSettingDetail.iconRestore }"
+          @click="RestoreUserSetting"
+        ></div>
         <div class="tool close" @click.stop="closeUserSetting"></div>
       </div>
     </div>
@@ -1532,84 +1541,90 @@
 </template>
 <script>
 export default {
-  props: ["defaultZIndex"],
+  props: ["defaultZIndex", "openUserSettingData"],
   mounted() {
     this.$bus.on("openUserSetting", this.openUserSetting);
+    this.openUserSettingDetail = this.openUserSettingData;
   },
   data() {
     return {
-      display: "none",
-      width:'850px',
-      zIndex: 9040,
-      cls: 'active-win',
-      title:'个人设置',
-      iconRestore: "none",
-      iconMaximize: "block",
-      restoreWidth: '850px'
+      openUserSettingDetail: {},
     };
   },
   methods: {
     // 打开本页面
     openUserSetting() {
-      this.zIndex = this.defaultZIndex + 10;
+      console.log(11112);
+      this.openUserSettingDetail.zIndex = this.defaultZIndex + 10;
+      console.log(this.openUserSettingDetail.zIndex, this.defaultZIndex);
       this.$bus.emit("changeDefaultZIndex", this.defaultZIndex + 10);
-      this.display = "block";
+      this.openUserSettingDetail.display = "block";
       let obj = {
         spacialCls: "personalSetting",
         imgUrl: "../../../public/image/index/personalSetting.png",
-        zIndex: this.zIndex,
-        title: this.title,
-
+        zIndex: this.openUserSettingDetail.zIndex,
+        title: this.openUserSettingDetail.title,
+        id: this.openUserSettingDetail.id,
       };
       this.$bus.emit("clickShortcutItem", obj);
     },
     // 关闭本页面
     closeUserSetting() {
-      this.display = "none";
-      this.zIndex = this.defaultZIndex - 10;
+      this.openUserSettingDetail.display = "none";
+      this.openUserSettingDetail.zIndex = this.defaultZIndex - 10;
       this.$bus.emit("changeDefaultZIndex", this.defaultZIndex - 10);
-      this.$bus.emit("closeDialogWindow", '../../../public/image/index/personalSetting.png');
+      this.$bus.emit(
+        "closeDialogWindow",
+        "../../../public/image/index/personalSetting.png"
+      );
     },
     // 点击本页面
-    clickUserSetting(){
-      console.log('clickUserSetting')
-      if(this.zIndex < this.defaultZIndex){
-        this.zIndex = this.defaultZIndex + 10;
+    clickUserSetting() {
+      if (this.openUserSettingDetail.zIndex < this.defaultZIndex) {
+        this.openUserSettingDetail.zIndex = this.defaultZIndex + 10;
         this.$bus.emit("changeDefaultZIndex", this.defaultZIndex + 10);
-        this.$bus.emit("changeDialogWindow", '../../../public/image/index/personalSetting.png');
+        this.$bus.emit(
+          "changeDialogWindow",
+          "../../../public/image/index/personalSetting.png"
+        );
       }
     },
     // 打开DSM 说明
-    openDSMWindow(){
-      this.$bus.emit('openDSMWindow')
+    openDSMWindow() {
+      this.$bus.emit("openDSMWindow");
     },
     // 最小化本页面
-    minUserSetting(){
-      this.display = "none";
-      this.zIndex = this.defaultZIndex - 10;
+    minUserSetting() {
+      this.openUserSettingDetail.display = "none";
+      this.openUserSettingDetail.zIndex = this.defaultZIndex - 10;
       this.$bus.emit("changeDefaultZIndex", this.defaultZIndex - 10);
     },
     // 最大化本页面
-    maxiMizeUserSetting( ) {
-      this.iconRestore = 'block'
-      this.iconMaximize = 'none'
-      this.width = '100%'
+    maxiMizeUserSetting() {
+      this.openUserSettingDetail.iconRestore = "block";
+      this.openUserSettingDetail.iconMaximize = "none";
+      this.openUserSettingDetail.width = "100%";
     },
     // 重置本页面的宽度
-    RestoreUserSetting(){
-      this.iconRestore = 'none'
-      this.iconMaximize = 'block'
-      this.width = this.restoreWidth
-    }
+    RestoreUserSetting() {
+      this.openUserSettingDetail.iconRestore = "none";
+      this.openUserSettingDetail.iconMaximize = "block";
+      this.openUserSettingDetail.width =
+        this.openUserSettingDetail.restoreWidth;
+    },
   },
-  watch:{
-    defaultZIndex(newVal){
-      if(this.zIndex < newVal){
-        this.cls = 'deactive-win'
-      }else{
-        this.cls = 'active-win'
-      }
-    }
+  watch: {
+    openUserSettingData() {
+      this.openUserSettingDetail = openUserSettingData;
+    },
   },
 };
 </script>
+<style lang="css" scoped>
+@media screen and (max-height: 600px) {
+  .x-window.synopkg-window {
+    top: 0 !important;
+    transform: translate(-50%, 0px) !important;
+  }
+}
+</style>

src/component/Desktop/index.vue

@@ -3,13 +3,13 @@
     <div id="sds-desktop" :style="{display:display}">
         <Menu></Menu>
         <Shortcut :defaultZIndex='defaultZIndex'></Shortcut>
-        <FixWindow :defaultZIndex='defaultZIndex'></FixWindow>
+        <FixWindow :defaultZIndex='defaultZIndex' :fixWindowData="fixWindowData"></FixWindow>
         <NotifyTrayPanel></NotifyTrayPanel>
         <NotifyTrayPanelDetail :defaultZIndex='defaultZIndex'></NotifyTrayPanelDetail>
         <NotifyShowall :defaultZIndex='defaultZIndex'></NotifyShowall>
         <NotifySetting :defaultZIndex='defaultZIndex'></NotifySetting>
         <UserTrayPanel></UserTrayPanel>
-        <UserSetting :defaultZIndex='defaultZIndex'></UserSetting>
+        <UserSetting :defaultZIndex='defaultZIndex' :openUserSettingData="openUserSettingData"></UserSetting>
         <DeleteNotifyMessage></DeleteNotifyMessage>
         <Mask></Mask>
     </div>
@@ -30,7 +30,7 @@ import UserTrayPanel from './UserTrayPanel'
 
 
 export default {
-  props: ["defaultZIndex"],
+  props: ["defaultZIndex","openUserSettingData","fixWindowData"],
   data() {
     return {
       display: 'block',
@@ -50,6 +50,14 @@ export default {
       }
     }
   },
+  watch:{
+    openUserSettingData(){
+      this.openUserSettingData = this.openUserSettingData
+    },
+    fixWindowZIndex(){
+      this.fixWindowZIndex = this.fixWindowZIndex
+    }
+  },
   components:{
     Menu,
     Shortcut,

src/component/DesktopAppView/AppViewItem/index.vue

@@ -1,6 +1,6 @@
 <template>
   <!-- 菜单弹窗 -->
-  <div v-if="resizablePinnedDetail.detailMessageList.length">
+  <div v-if="resizablePinnedDetail.detailMessageList.length" :style="{display:display}">
     <div
       class="x-window synopkg-window sds-window-v5 x-resizable-pinned"
       style="
@@ -19,11 +19,9 @@
         zIndex: detailMessage.zIndex,
       }"
       :class="detailMessage.cls"
-      v-for="(
-        detailMessage, detailMessageIndex
-      ) in resizablePinnedDetail.detailMessageList"
+      v-for="detailMessage in resizablePinnedDetail.detailMessageList"
       :key="detailMessage.id"
-      @click="changeDialogMenuWindow(detailMessage.title)"
+      @click="changeDialogMenuWindow(detailMessage.id)"
     >
       <div class="x-dlg-focus tjCenter" tabindex="0" role="application"></div>
       <div class="x-window-tl" @click="moveWindowPosition">
@@ -37,7 +35,7 @@
                 <div
                   class="x-tool x-tool-close"
                   role="option"
-                  @click.stop="closeWindow(detailMessageIndex)"
+                  @click.stop="closeWindow(detailMessage.id)"
                 >
                   &nbsp;
                 </div>
@@ -45,14 +43,14 @@
                   class="x-tool x-tool-restore"
                   role="option"
                   :style="{ display: `${detailMessage.iconRestore}` }"
-                  @click.stop="restoreMizeWindow(detailMessageIndex)"
+                  @click.stop="restoreMizeWindow(detailMessage.id)"
                 >
                   &nbsp;
                 </div>
                 <div
                   class="x-tool x-tool-maximize"
                   role="option"
-                  @click.stop="maxiSizeWindow(detailMessageIndex)"
+                  @click.stop="maxiSizeWindow(detailMessage.id)"
                   :style="{ display: `${detailMessage.iconMaximize}` }"
                 >
                   &nbsp;
@@ -60,7 +58,7 @@
                 <div
                   class="x-tool x-tool-minimize"
                   role="option"
-                  @click.stop="miniMizeWindow(detailMessageIndex)"
+                  @click.stop="miniMizeWindow(detailMessage.id)"
                 >
                   &nbsp;
                 </div>
@@ -219,93 +217,26 @@ export default {
   props: ["defaultZIndex", "detailMessageList"],
   data() {
     return {
+      display:'block',
       resizablePinnedDetail: {
-        detailMessageList: [
-          // {
-          //   id: "0",
-          //   width: "1254px",
-          //   height: "calc(100vh - 80px)",
-          //   minHeight: "560px",
-          //   title: "套件中心",
-          //   spacialCls: "tjCenter",
-          //   cls: "deactive-win",
-          //   titleImgUrl: "../../../../public/image/index/tjCenter.png",
-          //   display: "none",
-          //   zIndex: 9053,
-          //   iconRestore: "none",
-          //   iconMaximize: "block",
-          // },
-          // {
-          //   id: "1",
-          //   width: "1150px",
-          //   height: "calc(100vh - 120px)",
-          //   minHeight: "520px",
-          //   title: "控制中心",
-          //   spacialCls: "controlCenter",
-          //   cls: "deactive-win",
-          //   titleImgUrl: "../../../../public/image/index/controlCenter.png",
-          //   display: "none",
-          //   zIndex: 9053,
-          //   iconRestore: "none",
-          //   iconMaximize: "block",
-          // },
-          // {
-          //   id: "2",
-          //   width: "1010px",
-          //   height: "calc(100vh - 200px)",
-          //   minHeight: "440px",
-          //   title: "File Station",
-          //   spacialCls: "file",
-          //   cls: "deactive-win",
-          //   titleImgUrl: "../../../../public/image/index/file.png",
-          //   display: "none",
-          //   zIndex: 9053,
-          //   iconRestore: "none",
-          //   iconMaximize: "block",
-          // },
-          // {
-          //   id: "3",
-          //   width: "1010px",
-          //   height: "calc(100vh - 220px)",
-          //   minHeight: "420px",
-          //   title: "DSM 说明",
-          //   spacialCls: "question",
-          //   cls: "deactive-win",
-          //   titleImgUrl: "../../../../public/image/index/question.png",
-          //   display: "none",
-          //   zIndex: 9053,
-          //   iconRestore: "none",
-          //   iconMaximize: "block",
-          // },
-        ],
+        detailMessageList: [],
       },
       lastCheckIndex: -1,
       openWindowNum: 0,
-      detailMessageWidthList: [
-        // {
-        //   width: "1254px",
-        // },
-        // {
-        //   width: "1150px",
-        // },
-        // {
-        //   width: "1010px",
-        // },
-        // {
-        //   width: "1010px",
-        // },
-      ],
-      fixWindowZIndedxIsMax: false,
+      detailMessageWidthList: [],
       // 已经被打开的弹出窗口
       openedmenuList: [],
     };
   },
   mounted() {
+    this.$bus.on("showDialogWindow", this.showDialogWindow);
+    this.$bus.on("hiddenDialogWindow", this.hiddenDialogWindow);
     this.$bus.on("clickAppViewItem", this.clickAppViewItem);
-    this.$bus.on("clickMenuItem", this.clickMenuItem);
     this.$bus.on("openDSMWindow", this.openDSMWindow);
     this.$bus.on("changeDialogMenuWindow", this.changeDialogMenuWindow);
     this.$bus.on("menuItemChanged", this.menuItemChanged);
+    this.$bus.on("clickMenuItem", this.clickMenuItem);
+    // this.$bus.on("fixWindowZIndexchange", this.fixWindowZIndexchange);
     this.resizablePinnedDetail.detailMessageList = JSON.parse(
       JSON.stringify(this.detailMessageList)
     );
@@ -316,16 +247,28 @@ export default {
     );
   },
   methods: {
+    // 显示本页面
+    showDialogWindow(){
+      if(this.display === 'none'){
+        this.display = 'block'
+      }
+    },
+    // 隐藏本页面
+    hiddenDialogWindow(){
+      if(this.display === 'block'){
+        this.display = 'none'
+      }
+    },
     // 点击大菜单图标
-    clickAppViewItem(obj) {
-      let { detailMessageIndex } = obj;
-      this.openDialogWindow(detailMessageIndex);
+    clickAppViewItem(id) {
+      this.showDialogWindow()
+      this.changeDialogMenuWindow(id)
     },
     // 点击小菜单图标
-    clickMenuItem(imgUrl) {
+    clickMenuItem(id) {
       let detailMessageIndex =
         this.resizablePinnedDetail.detailMessageList.findIndex((item) => {
-          return item.titleImgUrl == imgUrl;
+          return item.id === id;
         });
       if (detailMessageIndex != -1) {
         this.openDialogWindow(detailMessageIndex);
@@ -333,39 +276,19 @@ export default {
     },
     // 打开弹出窗口
     openDialogWindow(detailMessageIndex) {
-        console.log(this.openedmenuList)
-      let repeatDialog = this.openedmenuList.some((item) => {
-          console.log(item.title)
-        return (
-          item.title ===
-          this.resizablePinnedDetail.detailMessageList[detailMessageIndex].title
-        );
-      });
-      console.log(
-        repeatDialog,
-        this.resizablePinnedDetail.detailMessageList[detailMessageIndex].title
-      );
-      console.log(
-        (!detailMessageIndex && detailMessageIndex != 0) ||
-          detailMessageIndex == -1 ||
-          this.lastCheckIndex == detailMessageIndex ||
-          repeatDialog
-      );
+      this.resizablePinnedDetail.detailMessageList[detailMessageIndex].display =
+        "block";
       if (
         (!detailMessageIndex && detailMessageIndex != 0) ||
         detailMessageIndex == -1 ||
-        this.lastCheckIndex == detailMessageIndex ||
         this.resizablePinnedDetail.detailMessageList[detailMessageIndex].cls ===
-          "active-win" ||
-        repeatDialog
+          "active-win"
       ) {
         return;
       }
       console.log(11231)
-      this.resizablePinnedDetail.detailMessageList[detailMessageIndex].display =
-        "block";
-      this.resizablePinnedDetail.detailMessageList[detailMessageIndex].cls =
-        "active-win";
+      // this.resizablePinnedDetail.detailMessageList[detailMessageIndex].cls =
+      //   "active-win";
       this.resizablePinnedDetail.detailMessageList.forEach((item) => {
         item.cls = "deactive-win";
       });
@@ -380,23 +303,24 @@ export default {
       this.lastCheckIndex = detailMessageIndex;
     },
     // 切换弹出的menu窗口
-    changeDialogMenuWindow(title) {
-      console.log(title);
+    changeDialogMenuWindow(id) {
       let menuIndex = this.resizablePinnedDetail.detailMessageList.findIndex(
         (item) => {
-          return item.title === title;
+          return item.id === id;
         }
       );
       if ((menuIndex || menuIndex == 0) && menuIndex != -1) {
         this.openDialogWindow(menuIndex);
       }
+      this.$bus.emit('dialogWindowZIndexIsMax',true)  
     },
     // 打开DSM 说明
     openDSMWindow() {
       let detailMessageIndex =
         this.resizablePinnedDetail.detailMessageList.findIndex((item) => {
-          return item.title === "DSM 说明";
+          return item.id === 1;
         });
+        console.log(this.resizablePinnedDetail.detailMessageList[detailMessageIndex])
       if (detailMessageIndex && detailMessageIndex != -1) {
         this.openDialogWindow(detailMessageIndex);
       }
@@ -413,11 +337,16 @@ export default {
         zIndex:
           this.resizablePinnedDetail.detailMessageList[detailMessageIndex]
             .zIndex,
+        id:this.resizablePinnedDetail.detailMessageList[detailMessageIndex]
+            .id,
       };
       this.$bus.emit("changeDialogWindow", obj);
     },
     // 最小化弹出框口
-    miniMizeWindow(detailMessageIndex) {
+    miniMizeWindow(id) {
+      let detailMessageIndex = this.resizablePinnedDetail.detailMessageList.findIndex(item=>{
+        return item.id === id
+      })
       this.resizablePinnedDetail.detailMessageList[detailMessageIndex].display =
         "none";
       this.countOpenWindowNum();
@@ -436,7 +365,10 @@ export default {
       }
     },
     //最大化弹出窗口
-    maxiSizeWindow(detailMessageIndex) {
+    maxiSizeWindow(id) {
+      let detailMessageIndex = this.resizablePinnedDetail.detailMessageList.findIndex(item=>{
+        return item.id === id
+      })
       this.resizablePinnedDetail.detailMessageList[detailMessageIndex].width =
         "100%";
       this.resizablePinnedDetail.detailMessageList[
@@ -445,12 +377,17 @@ export default {
       this.resizablePinnedDetail.detailMessageList[
         detailMessageIndex
       ].iconMaximize = "none";
-      this.openDialogWindow(detailMessageIndex);
+      if (detailMessageIndex && detailMessageIndex != -1) {
+        this.openDialogWindow(detailMessageIndex);
+      }
     },
     //恢复弹出窗口宽度
-    restoreMizeWindow(detailMessageIndex) {
+    restoreMizeWindow(id) {
+      let detailMessageIndex = this.resizablePinnedDetail.detailMessageList.findIndex(item=>{
+        return item.id === id
+      })
       this.resizablePinnedDetail.detailMessageList[detailMessageIndex].width =
-        this.detailMessageWidthList[detailMessageIndex].width;
+        this.detailMessageWidthList[detailMessageIndex];
       this.resizablePinnedDetail.detailMessageList[
         detailMessageIndex
       ].iconRestore = "none";
@@ -458,16 +395,18 @@ export default {
         detailMessageIndex
       ].iconMaximize = "block";
       this.countOpenWindowNum();
-      this.openDialogWindow(detailMessageIndex);
+      if (detailMessageIndex && detailMessageIndex != -1) {
+        this.openDialogWindow(detailMessageIndex);
+      }
     },
     //关闭弹出窗口
-    closeWindow(detailMessageIndex) {
+    closeWindow(id) {
+      let detailMessageIndex = this.resizablePinnedDetail.detailMessageList.findIndex(item=>{
+        return item.id === id
+      })
       this.resizablePinnedDetail.detailMessageList[detailMessageIndex].display =
         "none";
-      let imgUrl =
-        this.resizablePinnedDetail.detailMessageList[detailMessageIndex]
-          .titleImgUrl;
-      this.$bus.emit("closeDialogWindow", imgUrl);
+      this.$bus.emit("closeDialogWindow", id);
       let detailMessageList =
         this.resizablePinnedDetail.detailMessageList.filter((item) => {
           return item.display === "block";
@@ -491,10 +430,11 @@ export default {
           this.openWindowNum++;
         }
       });
-      if (this.openWindowNum == 0) {
+      if (! this.openWindowNum) {
         this.resizablePinnedDetail.detailMessageList.forEach((item) => {
-          item.zIndex = 9053;
+          item.zIndex = 9050;
         });
+        this.$bus.emit("changeDefaultZIndex", 9050);
       }
     },
     // 按z-index 给menuItem排序
@@ -505,11 +445,12 @@ export default {
         return x < y ? -1 : x > y ? 1 : 0;
       });
     },
+    // 当固定窗口的zIndex改变时
+    fixWindowZIndexchange(){},
     // 移动弹出框窗口位置
     moveWindowPosition(e) {},
     // 小图标被改变了
     menuItemChanged(menuList) {
-      console.log(menuList);
       this.openedmenuList = menuList;
     },
   },
@@ -520,24 +461,10 @@ export default {
         this.resizablePinnedDetail.detailMessageList.findIndex((item) => {
           return item.zIndex >= this.defaultZIndex && item.display === "block";
         });
-      console.log(this.dialogZIndexMaxIndex);
       if (
         this.dialogZIndexMaxIndex != -1 &&
         this.dialogZIndexMaxIndex != undefined
       ) {
-        console.log(
-          this.resizablePinnedDetail.detailMessageList[
-            this.dialogZIndexMaxIndex
-          ].titleImgUrl
-        );
-        this.resizablePinnedDetail.detailMessageList.forEach((item) => {
-          if (item.cls === "active-win") {
-            item.cls = "deactive-win";
-          }
-        });
-        this.resizablePinnedDetail.detailMessageList[
-          this.dialogZIndexMaxIndex
-        ].cls = "active-win";
         let obj = {
           imgUrl:
             this.resizablePinnedDetail.detailMessageList[
@@ -555,16 +482,17 @@ export default {
             this.resizablePinnedDetail.detailMessageList[
               this.dialogZIndexMaxIndex
             ].title,
+          id:
+            this.resizablePinnedDetail.detailMessageList[
+              this.dialogZIndexMaxIndex
+            ].id,
         };
         this.$bus.emit("changeDialogWindow", obj);
-      } else {
-        this.resizablePinnedDetail.detailMessageList.forEach((item) => {
-          if (item.cls === "active-win") {
-            item.cls = "deactive-win";
-          }
-        });
       }
     },
+    detailMessageList(){
+     this.resizablePinnedDetail.detailMessageList =this.detailMessageList
+    }
   },
   beforeDestroy() {
     this.$bus.off("clickShortcutItem", this.clickShortcutItem);
@@ -574,7 +502,7 @@ export default {
   name: "AppViewItem",
 };
 </script>
-<style scope lang="css">
+<style scoped lang="css">
 @media screen and (max-height: 600px) {
   .x-window.synopkg-window {
     top: 0 !important;