逻辑完善及页面动态效果

public/static/css/style/style.css

@@ -368,6 +368,13 @@ ul.sds-desktop-shortcut {
     box-sizing: border-box;
 }
 
+.sds-desktop-select-range {
+    position: absolute;
+    background-color: rgba(255,255,255,0.3);
+    border: solid 1px white;
+    opacity: 1;
+}
+
 .sds-desktop-layout {
     width: 100%;
     height: 100%;
@@ -496,6 +503,11 @@ ul.sds-desktop-shortcut {
 .x-tool-maximize {
     background-position: 0 -30px;
 }
+
+.v-window{
+    transition:height ease 0.2s;
+}
+
 .x-panel-ghost.v-window .v-window-body{
     background-color: #f2f2f2;
 }
@@ -509,6 +521,11 @@ ul.sds-desktop-shortcut {
     opacity: 0.9;
 }
 
+.x-window-bwrap {
+    background-color: #fff;
+    height: 100%;
+}
+
 /* 右侧固定栏 */
 .v-widget-window {
     opacity: 0;
@@ -1751,6 +1768,10 @@ ul.sds-desktop-shortcut {
     cursor: pointer;
 }
 
+.launch-icon.app-item-icon:active {
+    transform: scale(0.9, 0.9);
+}
+
 .launch-icon.app-item-icon .image {
     width: 72px;
     height: 72px;
@@ -1904,6 +1925,10 @@ ul.sds-desktop-shortcut {
     background-color: rgba(198,212,224,0.2);
 }
 
+.sds-notify-tray-panel .item:hover {
+    background-color: rgba(198,212,224,0.3);
+}
+
 .sds-notify-tray-panel .item.unread {
     background-color: rgba(5,127,235,0.1);
 }
@@ -2116,7 +2141,8 @@ ul.sds-desktop-shortcut {
     border-radius: 4px;
 }
 
-.taskbar-menu.user-menu.v-menu .v-menu-item:hover {
+.taskbar-menu.user-menu.v-menu .v-menu-item:hover,
+.taskbar-menu.user-menu.v-menu .v-menu-item.active {
     background-color: rgba(198,212,224,0.4);
 }
 
@@ -2673,9 +2699,9 @@ ul.sds-desktop-shortcut {
 }
 
 /* userAbout消息弹出框 */
-.sds-user-about-mask {
+.sds-user-about-mask, 
+.sds-menu-repeat-mask{
     background-color: #000000;
-    /* z-index: 90000 !important; */
     opacity: 0.2;
 }
 

src/common/common.js

@@ -2,21 +2,132 @@
 export function moveWindow(e, el, firstLayerX, firstLayerY, firstScrollX, firstScrollY) {
   // X轴
   let moveX = e.pageX - firstLayerX;
-  // if (moveX > firstScrollX - el.offsetWidth) {
-  //   moveX = firstScrollX - el.offsetWidth;
-  // }
-  // if (moveX < 0) {
-  //   moveX = 0;
-  // }
+  if (moveX > firstScrollX - 100) {
+    moveX = firstScrollX - 100;
+  }
+  if (moveX < 100 - el.offsetWidth) {
+    moveX = 100 - el.offsetWidth;
+  }
   // Y轴
 
   let moveY = e.pageY - firstLayerY;
-  // if (moveY > firstScrollY - el.offsetHeight) {
-  //   moveY = firstScrollY - el.offsetHeight;
-  // }
-  // if (moveY < 0) {
-  //   moveY = 0;
-  // }
+  if (moveY > firstScrollY - 25) {
+    moveY = firstScrollY - 25;
+  }
+  if (moveY < 0) {
+    moveY = 0;
+  }
   let obj = { moveX, moveY }
   return obj
+}
+
+// 页面尺寸变化和打开窗口时的窗口位置
+export function windowResize(el) {
+  console.log(el)
+  let elTop, elLeft
+  if (el.offsetTop < 0) {
+    elTop = 0
+  } else {
+    if (
+      document.documentElement.scrollHeight <
+      el.offsetHeight + el.offsetTop &&
+      document.documentElement.scrollHeight > el.offsetHeight
+    ) {
+      let top = document.documentElement.scrollHeight - el.offsetHeight;
+      elTop =
+        top + "px";
+      if (top < 0) {
+        elTop = 0;
+      }
+    } else if (
+      document.documentElement.scrollHeight >
+      el.offsetHeight
+    ) {
+      elTop =
+        (document.documentElement.scrollHeight - el.offsetHeight) / 2 + 'px'
+    } else if (
+      document.documentElement.scrollHeight < el.offsetHeight
+    ) {
+      elTop = 0;
+    }
+  }
+  if (el.offsetLeft < 0) {
+    elLeft = 0
+  }else{
+    if (
+      document.documentElement.scrollWidth <
+      el.offsetWidth + el.offsetLeft &&
+      document.documentElement.scrollWidth > el.offsetWidth
+    ) {
+      let left = document.documentElement.scrollWidth - el.offsetWidth;
+      elLeft =
+        left + "px";
+      console.log(left);
+      if (left < 0) {
+        elLeft = 0;
+      }
+    } else if (
+      document.documentElement.scrollWidth >
+      el.offsetWidth
+    ) {
+      elLeft = (document.documentElement.scrollWidth -
+        el.offsetWidth) / 2 + 'px'
+    } else if (document.documentElement.scrollWidth < el.offsetWidth) {
+      elLeft = 0;
+    }
+  }
+  console.log(
+    document.documentElement.scrollWidth,
+    document.documentElement.scrollHeight,
+    el.offsetHeight,
+    el.offsetWidth
+  );
+  console.log(elTop, elLeft)
+  return { elTop, elLeft }
+}
+
+// 窗口恢复大小时的窗口位置
+export function restoreWindowResize(el,restoreTop,restoreLeft){
+  console.log(el)
+  let elTop, elLeft
+  if (typeof restoreTop === "string") {
+    if (
+      document.documentElement.scrollHeight >=
+      el.offsetHeight + parseFloat(restoreTop.replace("px", ""))
+    ) {
+      elTop = restoreTop;
+    } else if (document.documentElement.scrollHeight >= el.offsetHeight) {
+      elTop =
+        document.documentElement.scrollHeight - el.offsetHeight + "px";
+    } else if (document.documentElement.scrollHeight < el.offsetHeight) {
+      elTop = 0;
+    }
+  }
+  if (typeof restoreLeft === "string") {
+    if (
+      document.documentElement.scrollWidth >=
+      el.offsetWidth + parseFloat(restoreLeft.replace("px", ""))
+    ) {
+      elLeft = restoreLeft;
+    } else if (document.documentElement.scrollWidth >= el.offsetWidth) {
+      elLeft =
+        document.documentElement.scrollWidth - el.offsetWidth + "px";
+    } else if (document.documentElement.scrollWidth < el.offsetWidth) {
+      elLeft = 0;
+    }
+  }
+  // if (
+  //   typeof elTop === "string" &&
+  //   parseFloat(elTop.replace("px", "")) < 0
+  // ) {
+  //   elTop = 0;
+  // }
+  // if (
+  //   typeof elLeft === "string" &&
+  //   parseFloat(elLeft.replace("px", "")) < 0
+  // ) {
+  //   elLeft = 0;
+  // }
+  console.log(elTop, elLeft)
+  return { elTop, elLeft }
 }

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

@@ -269,10 +269,12 @@ export default {
     }, 400);
     window.addEventListener("resize", (e) => {
       let left = document.documentElement.clientWidth - el4.offsetWidth;
-      if (left >= 0 && left < el4.offsetWidth) {
-        this.left = left + "px";
-      } else if (left < 0) {
-        this.left = 0;
+      if(typeof(this.left) === 'string'){
+        if(parseFloat(this.left.replace('px','')) > left){
+          this.left = left + "px";
+        }else if(parseFloat(this.left.replace('px','')) < 0){
+          this.left = 0
+        }
       }
     });
   },

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

@@ -7,20 +7,22 @@
         sds-notify-setting-dialog sds-window-v5
         x-resizable-pinned
       "
-      style="
-        position: absolute;
-      "
-      :style="{ display: notifySettingContant.display,zIndex:notifySettingContant.zIndex,
-      left:notifySettingContant.left,
-      top:notifySettingContant.top,
-      width:notifySettingContant.width
+      style="position: absolute"
+      :style="{
+        display: notifySettingContant.display,
+        zIndex: notifySettingContant.zIndex,
+        left: notifySettingContant.left,
+        top: notifySettingContant.top,
+        width: notifySettingContant.width,
       }"
       :class="notifySettingContant.cls"
       @mousedown="clickNotifySetting"
     >
       <div class="x-dlg-focus"></div>
-      <div class="x-window-tl"
-      @mousedown.capture="mousedownNotifyTrayPanelDetail">
+      <div
+        class="x-window-tl"
+        @mousedown.capture="mousedownNotifyTrayPanelDetail"
+      >
         <div class="x-window-tr">
           <div class="x-window-tc">
             <div class="x-window-header x-panel-icon x-window-draggable">
@@ -838,28 +840,37 @@
 </template>
 
 <script>
-import {moveWindow} from '../../../../common/common'
+import { moveWindow, windowResize } from "../../../../common/common";
 export default {
-  props: ["defaultZIndex","notifySettingData"],
+  props: ["defaultZIndex", "notifySettingData"],
   mounted() {
     this.$bus.on("openNotifySetting", this.openNotifySetting);
-    this.notifySettingContant = this.notifySettingData
+    this.notifySettingContant = this.notifySettingData;
+    window.addEventListener("resize", () => {
+      if (this.notifySettingContant.display === "block") {
+        let el = document.querySelector(".x-window.sds-notify-setting-dialog");
+        console.log(el);
+        let { elTop, elLeft } = windowResize(el);
+        this.notifySettingContant.top = elTop;
+        this.notifySettingContant.left = elLeft;
+      }
+    });
   },
   data() {
     return {
-      windowFirstClick:{
-        layerX:0,
-        layerY:0,
-        screenX:0,
-        screenY:0,
+      windowFirstClick: {
+        layerX: 0,
+        layerY: 0,
+        screenX: 0,
+        screenY: 0,
       },
-      notifySettingContant:{
+      notifySettingContant: {
         display: "none",
         zIndex: 9050,
-        cls: 'active-win',
+        cls: "active-win",
         top: 0,
         left: 0,
-        width:'626px'
+        width: "626px",
       },
       notifySettingDetail: {
         tableHeaderContant1: {
@@ -1001,17 +1012,31 @@ export default {
       },
     };
   },
-
+  created() {
+    
+  },
   methods: {
     // 打开本页面
     openNotifySetting() {
-      this.notifySettingContant.display = "block";
-      if(this.notifySettingContant.cls === 'deactive-win'){
+      if(this.notifySettingContant.display === "none"){
+        this.notifySettingContant.display = "block";
+        
+        this.$nextTick(() => {
+          let el = document.querySelector(".x-window.sds-notify-setting-dialog");
+          let { elTop, elLeft } = windowResize(el);
+          this.notifySettingContant.top = elTop;
+          this.notifySettingContant.left = elLeft;
+        });
+        let left =
+        (document.documentElement.clientWidth -
+          parseInt(this.notifySettingContant.width.replace("px", ""))) /
+        2;
+        this.notifySettingContant.left = left + "px";
+      }
+      if (this.notifySettingContant.cls === "deactive-win") {
         this.notifySettingContant.zIndex = this.defaultZIndex + 10;
         this.$bus.emit("changeDefaultZIndex", this.defaultZIndex + 10);
       }
-      let left = (document.documentElement.clientWidth - parseInt(this.notifySettingContant.width.replace('px',''))) / 2
-      this.notifySettingContant.left = left + 'px'
     },
     // 关闭本页面
     closeNotifySetting() {
@@ -1019,8 +1044,8 @@ export default {
       this.$bus.emit("changeDefaultZIndex", this.defaultZIndex - 10);
     },
     // 点击本页面
-    clickNotifySetting(){
-      if(this.notifySettingContant.zIndex < this.defaultZIndex){
+    clickNotifySetting() {
+      if (this.notifySettingContant.zIndex < this.defaultZIndex) {
         this.notifySettingContant.zIndex = this.defaultZIndex + 10;
         this.$bus.emit("changeDefaultZIndex", this.defaultZIndex + 10);
       }
@@ -1116,36 +1141,41 @@ export default {
       }
     },
     // 鼠标按下该页面头部
-    mousedownNotifyTrayPanelDetail(e){
+    mousedownNotifyTrayPanelDetail(e) {
       // document.documentElement.click()
       this.windowFirstClick.layerX = e.layerX;
       this.windowFirstClick.screenX = document.documentElement.clientWidth;
       this.windowFirstClick.layerY = e.layerY;
       this.windowFirstClick.screenY = document.documentElement.clientHeight;
-      document.addEventListener(
-        "mousemove",
-        this.moveWindowPosition
-      );
-      document.addEventListener(
-        "mouseup",
-        this.upWindowPosition
-      );
+      document.addEventListener("mousemove", this.moveWindowPosition);
+      document.addEventListener("mouseup", this.upWindowPosition);
     },
     // 移动弹出框窗口位置
     moveWindowPosition(e) {
-      let window = document.querySelector('.sds-notify-setting-dialog.sds-window-v5')
-      let obj = moveWindow(e,window,this.windowFirstClick.layerX,this.windowFirstClick.layerY,this.windowFirstClick.screenX,this.windowFirstClick.screenY)
-      this.notifySettingContant.left = obj.moveX +'px'
-      this.notifySettingContant.top = obj.moveY +'px'
-      if (!window.className.includes(' x-panel-ghost')){
-        window.className = window.className + ' x-panel-ghost'
+      let window = document.querySelector(
+        ".sds-notify-setting-dialog.sds-window-v5"
+      );
+      let obj = moveWindow(
+        e,
+        window,
+        this.windowFirstClick.layerX,
+        this.windowFirstClick.layerY,
+        this.windowFirstClick.screenX,
+        this.windowFirstClick.screenY
+      );
+      this.notifySettingContant.left = obj.moveX + "px";
+      this.notifySettingContant.top = obj.moveY + "px";
+      if (!window.className.includes(" x-panel-ghost")) {
+        window.className = window.className + " x-panel-ghost";
       }
     },
     // 鼠标松开
-    upWindowPosition(e){
-      let window = document.querySelector('.sds-notify-setting-dialog.sds-window-v5')
-      if (window.className.includes(' x-panel-ghost')){
-        window.className = window.className.replace(' x-panel-ghost','')
+    upWindowPosition(e) {
+      let window = document.querySelector(
+        ".sds-notify-setting-dialog.sds-window-v5"
+      );
+      if (window.className.includes(" x-panel-ghost")) {
+        window.className = window.className.replace(" x-panel-ghost", "");
       }
       document.removeEventListener("mousemove", this.moveWindowPosition);
       document.removeEventListener("mouseup", this.upWindowPosition);

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

@@ -4,7 +4,7 @@
     <div
       class="v-layout sds-notify-showall-dialog layout-window-app v-window"
       :class="notifyShowAllContant.cls"
-      style="position: absolute;"
+      style="position: absolute"
       :style="{
         display: notifyShowAllContant.display,
         width: width,
@@ -15,8 +15,10 @@
       }"
       @mousedown.capture="clickNotifyShowall"
     >
-      <div class="v-window-header-wrapper draggable"
-      @mousedown.capture="mousedownNotifyTrayPanelDetail">
+      <div
+        class="v-window-header-wrapper draggable"
+        @mousedown.capture="mousedownNotifyTrayPanelDetail"
+      >
         <div class="app-icon"></div>
         <div class="v-window-header-text">
           <div class="v-window-header-title">消息</div>
@@ -419,23 +421,27 @@
 </template>
 
 <script>
-import {moveWindow} from '../../../../common/common'
+import {
+  moveWindow,
+  windowResize,
+  restoreWindowResize,
+} from "../../../../common/common";
 export default {
   props: ["defaultZIndex", "notifyShowAllData"],
   data() {
     return {
-      windowFirstClick:{
-        layerX:0,
-        layerY:0,
-        screenX:0,
-        screenY:0,
+      windowFirstClick: {
+        layerX: 0,
+        layerY: 0,
+        screenX: 0,
+        screenY: 0,
       },
       notifyShowAllContant: {
         display: "none",
         zIndex: 9050,
         cls: "active-win",
-        left:0,
-        top:0,
+        left: 0,
+        top: 0,
         clearAllNotifyData: {
           clearAllNotifyMessageDisplay: "none",
           clearAllNotifyMessageCls: "deactive-win",
@@ -446,6 +452,11 @@ export default {
       maskDisplay: "none",
       width: "840px",
       height: "480px",
+      restoreHeight: "",
+
+      restoreWidth: "",
+      restoreTop: "",
+      restoreLeft: "",
       thContantArray: [
         {
           id: 0,
@@ -482,23 +493,46 @@ export default {
     this.$bus.on("openNotifyShowall", this.openNotifyShowall);
     this.$bus.on("closeNotifyShowall", this.closeNotifyShowall);
     this.notifyShowAllContant = this.notifyShowAllData;
+    this.restoreWidth = this.width;
+    this.restoreHeight = this.height;
+    window.addEventListener("resize", () => {
+      if (this.notifyShowAllContant.display === "block" && !this.windowIsMax) {
+        let el = document.querySelector(".v-layout.sds-notify-showall-dialog");
+        let { elTop, elLeft } = windowResize(el);
+        this.notifyShowAllContant.top = elTop;
+        this.notifyShowAllContant.left = elLeft;
+      }
+    });
   },
   methods: {
     // 打开本页面
     openNotifyShowall(detailMessageList) {
-      this.maskDisplay = "block";
-      this.loading = true;
-      this.notifyShowAllContant.display = "block";
-      this.clickNotifyShowall();
-      setTimeout(() => {
-        this.maskDisplay = "none";
-        this.loading = false;
-        let detailMessageList1 = JSON.parse(JSON.stringify(detailMessageList));
-        detailMessageList1.forEach((item) => {
-          item.cls1 = "";
-        });
-        this.notifyShowallDetail.detailMessageList = detailMessageList1;
-      }, 1000);
+      if (this.notifyShowAllContant.display === "none") {
+        this.maskDisplay = "block";
+        this.loading = true;
+        this.notifyShowAllContant.display = "block";
+        this.clickNotifyShowall();
+        setTimeout(() => {
+          this.maskDisplay = "none";
+          this.loading = false;
+          let detailMessageList1 = JSON.parse(
+            JSON.stringify(detailMessageList)
+          );
+          detailMessageList1.forEach((item) => {
+            item.cls1 = "";
+          });
+          this.notifyShowallDetail.detailMessageList = detailMessageList1;
+        }, 1000);
+        this.notifyShowAllContant.top = "10px";
+        this.notifyShowAllContant.left = "10px";
+      }
+
+      // this.$nextTick(() => {
+      // let el = document.querySelector('.v-layout.sds-notify-showall-dialog')
+      //   let { elTop, elLeft } = windowResize(el);
+      //   this.notifyShowAllContant.top = elTop;
+      //   this.notifyShowAllContant.left = elLeft;
+      // });
     },
     // 关闭本页面
     closeNotifyShowall() {
@@ -509,16 +543,19 @@ export default {
     // 点击本页面
     clickNotifyShowall() {
       if (
-        this.notifyShowAllContant.cls === "deactive-win" && (
+        this.notifyShowAllContant.cls === "deactive-win" &&
+        this.notifyShowAllContant.clearAllNotifyData
+          .clearAllNotifyMessageZIndex < this.defaultZIndex &&
         this.notifyShowAllContant.clearAllNotifyData
-          .clearAllNotifyMessageZIndex < this.defaultZIndex && this.notifyShowAllContant.clearAllNotifyData
-          .clearAllNotifyMessageDisplay === 'block')
+          .clearAllNotifyMessageDisplay === "block"
       ) {
         this.notifyShowAllContant.zIndex = this.defaultZIndex + 10;
         this.$bus.emit("changeDefaultZIndex", this.defaultZIndex + 10);
-      }else if (
-        this.notifyShowAllContant.cls === "deactive-win" &&  this.notifyShowAllContant.clearAllNotifyData
-          .clearAllNotifyMessageDisplay === 'none'){
+      } else if (
+        this.notifyShowAllContant.cls === "deactive-win" &&
+        this.notifyShowAllContant.clearAllNotifyData
+          .clearAllNotifyMessageDisplay === "none"
+      ) {
         this.notifyShowAllContant.zIndex = this.defaultZIndex + 10;
         this.$bus.emit("changeDefaultZIndex", this.defaultZIndex + 10);
       }
@@ -582,25 +619,35 @@ export default {
     },
     // 页面最大化
     maxWindow() {
-      this.notifyShowAllContant.top = '40px';
-      this.notifyShowAllContant.left = 0;
+      this.restoreTop = this.notifyShowAllContant.top;
+      this.restoreLeft = this.notifyShowAllContant.left;
       this.width = "100%";
+      this.height = "calc(100vh - 40px)";
       this.windowIsMax = true;
-      let el = document.querySelector('.v-layout.sds-notify-showall-dialog')
-      if(! el.className.includes(' x-window-maximized')){
-        el.className = el.className + ' x-window-maximized'
+      let el = document.querySelector(".v-layout.sds-notify-showall-dialog");
+      if (!el.className.includes(" x-window-maximized")) {
+        el.className = el.className + " x-window-maximized";
       }
+      this.notifyShowAllContant.top = "40px";
+      this.notifyShowAllContant.left = 0;
     },
     // 恢复页面宽度
     restoreWindow() {
-      this.notifyShowAllContant.top = 0;
-      this.notifyShowAllContant.left= '10px';
-      this.width = "840px";
+      this.width = this.restoreWidth;
+      this.height = this.restoreHeight;
       this.windowIsMax = false;
-      this.$bus.emit("changeDefaultZIndex", this.defaultZIndex - 10);
-      let el = document.querySelector('.v-layout.sds-notify-showall-dialog')
-      if(el.className.includes(' x-window-maximized')){
-        el.className = el.className.replace(' x-window-maximized','')
+      let el = document.querySelector(".v-layout.sds-notify-showall-dialog");
+      this.$nextTick(() => {
+        let { elTop, elLeft } = restoreWindowResize(
+          el,
+          this.restoreTop,
+          this.restoreLeft
+        );
+        this.notifyShowAllContant.top = elTop;
+        this.notifyShowAllContant.left = elLeft;
+      });
+      if (el.className.includes(" x-window-maximized")) {
+        el.className = el.className.replace(" x-window-maximized", "");
       }
     },
     // 显示清除全部信息弹出框
@@ -621,9 +668,7 @@ export default {
     },
     // 点击清除全部信息弹出框
     mousedownClearAllNotifyMessage() {
-      let el = document.querySelector(
-        ".notifyShowall .v-message-box-window"
-      );
+      let el = document.querySelector(".notifyShowall .v-message-box-window");
       if (el.className && el.className.includes(" no-shadow")) {
         el.className = el.className.replace(" no-shadow", "");
       }
@@ -649,13 +694,11 @@ export default {
           this.defaultZIndex + 10;
         this.$bus.emit("changeDefaultZIndex", this.defaultZIndex + 10);
       }
-      let el = document.querySelector(
-        ".notifyShowall .v-message-box-window"
-      );
+      let el = document.querySelector(".notifyShowall .v-message-box-window");
       if (!el.className.includes(" no-shadow")) {
-        this.$nextTick(()=>{
+        this.$nextTick(() => {
           el.className = el.className + " no-shadow";
-        })
+        });
         setTimeout(() => {
           el.className = el.className.replace(" no-shadow", "");
         }, 500);
@@ -678,38 +721,43 @@ export default {
       this.cancelDeleteAllNotifyMessage(e);
     },
     // 鼠标按下该页面头部
-    mousedownNotifyTrayPanelDetail(e){
+    mousedownNotifyTrayPanelDetail(e) {
       // document.documentElement.click()
-      if(!this.windowIsMax){
+      if (!this.windowIsMax) {
         this.windowFirstClick.layerX = e.layerX;
         this.windowFirstClick.screenX = document.documentElement.clientWidth;
         this.windowFirstClick.layerY = e.layerY;
         this.windowFirstClick.screenY = document.documentElement.clientHeight;
-        document.addEventListener(
-          "mousemove",
-          this.moveWindowPosition
-        );
-        document.addEventListener(
-          "mouseup",
-          this.upWindowPosition
-        );
+        document.addEventListener("mousemove", this.moveWindowPosition);
+        document.addEventListener("mouseup", this.upWindowPosition);
       }
     },
     // 移动弹出框窗口位置
     moveWindowPosition(e) {
-      let window = document.querySelector('.v-layout.sds-notify-showall-dialog')
-      let obj = moveWindow(e,window,this.windowFirstClick.layerX,this.windowFirstClick.layerY,this.windowFirstClick.screenX,this.windowFirstClick.screenY)
-      this.notifyShowAllContant.left = obj.moveX +'px'
-      this.notifyShowAllContant.top = obj.moveY +'px'
-      if (!window.className.includes(' x-panel-ghost')){
-        window.className = window.className + ' x-panel-ghost'
+      let window = document.querySelector(
+        ".v-layout.sds-notify-showall-dialog"
+      );
+      let obj = moveWindow(
+        e,
+        window,
+        this.windowFirstClick.layerX,
+        this.windowFirstClick.layerY,
+        this.windowFirstClick.screenX,
+        this.windowFirstClick.screenY
+      );
+      this.notifyShowAllContant.left = obj.moveX + "px";
+      this.notifyShowAllContant.top = obj.moveY + "px";
+      if (!window.className.includes(" x-panel-ghost")) {
+        window.className = window.className + " x-panel-ghost";
       }
     },
     // 鼠标松开
-    upWindowPosition(e){
-      let window = document.querySelector('.v-layout.sds-notify-showall-dialog')
-      if (window.className.includes(' x-panel-ghost')){
-        window.className = window.className.replace(' x-panel-ghost','')
+    upWindowPosition(e) {
+      let window = document.querySelector(
+        ".v-layout.sds-notify-showall-dialog"
+      );
+      if (window.className.includes(" x-panel-ghost")) {
+        window.className = window.className.replace(" x-panel-ghost", "");
       }
       document.removeEventListener("mousemove", this.moveWindowPosition);
       document.removeEventListener("mouseup", this.upWindowPosition);

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

@@ -2,22 +2,20 @@
   <!-- notifyTrayPanelDetail -->
   <div
     class="v-layout sds-notify-detail-dialog layout-window-app v-window"
-    style="
-      position: absolute;
-      width: 680px;
-      height: 420px;
-    "
+    style="position: absolute; width: 680px; height: 420px"
     :style="{
       display: notifyTrayPanelDetailContant.display,
       zIndex: notifyTrayPanelDetailContant.zIndex,
-      left:notifyTrayPanelDetailContant.left,
-      top:notifyTrayPanelDetailContant.top
+      left: notifyTrayPanelDetailContant.left,
+      top: notifyTrayPanelDetailContant.top,
     }"
     :class="notifyTrayPanelDetailContant.cls"
     @mousedown.capture="openNotifyDetail"
   >
-    <div class="v-window-header-wrapper draggable"
-      @mousedown.capture="mousedownNotifyTrayPanelDetail">
+    <div
+      class="v-window-header-wrapper draggable"
+      @mousedown.capture="mousedownNotifyTrayPanelDetail"
+    >
       <div class="app-icon"></div>
       <div class="v-window-header-text">
         <div class="v-window-header-title">事件详情</div>
@@ -27,10 +25,7 @@
         <div class="tool close" @click.capture="closeNotifyDetail"></div>
       </div>
     </div>
-    <div
-      class="v-window-body"
-      v-if="notifyTrayPanelDetail.detailMessage.title"
-    >
+    <div class="v-window-body" v-if="notifyTrayPanelDetail.detailMessage.title">
       <div class="v-trap-focus-indicator"></div>
       <div class="v-trap-focus-body">
         <div role="application" class="v-trap-focus-indicator"></div>
@@ -74,9 +69,7 @@
                         <div class="v-form-item-control v-form-displayfield">
                           <div>
                             <div
-                              v-html="
-                                notifyTrayPanelDetail.detailMessage.text
-                              "
+                              v-html="notifyTrayPanelDetail.detailMessage.text"
                             ></div>
                           </div>
                         </div>
@@ -160,23 +153,21 @@
 </template>
 
 <script>
-import {moveWindow} from '../../../../common/common'
+import { moveWindow } from "../../../../common/common";
 export default {
   props: ["defaultZIndex", "notifyTrayPanelDetailData"],
   mounted() {
     this.$bus.on("openNotifyDetail", this.openNotifyDetail);
     this.$bus.on("closeNotifyDetail", this.closeNotifyDetail);
     this.notifyTrayPanelDetailContant = this.notifyTrayPanelDetailData;
-    this.notifyTrayPanelDetailContant.top = '10px'
-    this.notifyTrayPanelDetailContant.left = '10px'
   },
   data() {
     return {
-      windowFirstClick:{
-        layerX:0,
-        layerY:0,
-        screenX:0,
-        screenY:0,
+      windowFirstClick: {
+        layerX: 0,
+        layerY: 0,
+        screenX: 0,
+        screenY: 0,
       },
       notifyTrayPanelDetail: {
         detailMessage: [],
@@ -185,8 +176,8 @@ export default {
         zIndex: 9050,
         cls: "deactive-win",
         display: "none",
-        top:0,
-        left:0
+        top: 0,
+        left: 0,
       },
     };
   },
@@ -196,6 +187,8 @@ export default {
     openNotifyDetail(detailMessage) {
       if (this.notifyTrayPanelDetailContant.display === "none") {
         this.notifyTrayPanelDetailContant.display = "block";
+        this.notifyTrayPanelDetailContant.top = "10px";
+        this.notifyTrayPanelDetailContant.left = "10px";
       }
       if (this.notifyTrayPanelDetailContant.cls === "deactive-win") {
         this.notifyTrayPanelDetailContant.zIndex = this.defaultZIndex + 10;
@@ -212,35 +205,36 @@ export default {
       this.$bus.emit("changeDefaultZIndex", this.defaultZIndex - 10);
     },
     // 鼠标按下该页面头部
-    mousedownNotifyTrayPanelDetail(e){
+    mousedownNotifyTrayPanelDetail(e) {
       this.windowFirstClick.layerX = e.layerX;
       this.windowFirstClick.screenX = document.documentElement.clientWidth;
       this.windowFirstClick.layerY = e.layerY;
       this.windowFirstClick.screenY = document.documentElement.clientHeight;
-      document.addEventListener(
-        "mousemove",
-        this.moveWindowPosition
-      );
-      document.addEventListener(
-        "mouseup",
-        this.upWindowPosition
-      );
+      document.addEventListener("mousemove", this.moveWindowPosition);
+      document.addEventListener("mouseup", this.upWindowPosition);
     },
     // 移动弹出框窗口位置
     moveWindowPosition(e) {
-      let window = document.querySelector('.v-layout.sds-notify-detail-dialog')
-      let obj = moveWindow(e,window,this.windowFirstClick.layerX,this.windowFirstClick.layerY,this.windowFirstClick.screenX,this.windowFirstClick.screenY)
-      this.notifyTrayPanelDetailContant.left = obj.moveX +'px'
-      this.notifyTrayPanelDetailContant.top = obj.moveY +'px'
-      if (!window.className.includes(' x-panel-ghost')){
-        window.className = window.className + ' x-panel-ghost'
+      let window = document.querySelector(".v-layout.sds-notify-detail-dialog");
+      let obj = moveWindow(
+        e,
+        window,
+        this.windowFirstClick.layerX,
+        this.windowFirstClick.layerY,
+        this.windowFirstClick.screenX,
+        this.windowFirstClick.screenY
+      );
+      this.notifyTrayPanelDetailContant.left = obj.moveX + "px";
+      this.notifyTrayPanelDetailContant.top = obj.moveY + "px";
+      if (!window.className.includes(" x-panel-ghost")) {
+        window.className = window.className + " x-panel-ghost";
       }
     },
     // 鼠标松开
-    upWindowPosition(e){
-      let window = document.querySelector('.v-layout.sds-notify-detail-dialog')
-      if (window.className.includes(' x-panel-ghost')){
-        window.className = window.className.replace(' x-panel-ghost','')
+    upWindowPosition(e) {
+      let window = document.querySelector(".v-layout.sds-notify-detail-dialog");
+      if (window.className.includes(" x-panel-ghost")) {
+        window.className = window.className.replace(" x-panel-ghost", "");
       }
       document.removeEventListener("mousemove", this.moveWindowPosition);
       document.removeEventListener("mouseup", this.upWindowPosition);

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

@@ -0,0 +1,16 @@
+<template>
+  <div
+    class="sds-desktop-select-range"
+    style="left: 111px; top: 155px; width: 207px; height: 235px"
+  ></div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {};
+  },
+  components: {},
+  name: "SelectRange",
+};
+</script>

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

@@ -40,12 +40,14 @@
         </li>
       </div>
       <PortalTarget></PortalTarget>
+      <!-- <SelectRange></SelectRange> -->
     </ul>
   </div>
 </template>
 
 <script>
 import PortalTarget from "../../DesktopAppView/PortalTarget";
+import SelectRange from "./SelectRange";
 export default {
   props: ["defaultZIndex"],
   mounted() {
@@ -222,7 +224,7 @@ export default {
             {
               id: 0,
               text: "确认",
-              cls:'v-btn-main',
+              cls: "v-btn-main",
               event: () => {
                 this.$bus.emit("closeMessage");
                 this.$bus.emit("closeMask");
@@ -231,7 +233,7 @@ export default {
           ],
         };
         this.$bus.emit("openMessage", obj);
-        this.$bus.emit("openMask");
+        this.$bus.emit("openMask", "sds-menu-repeat-mask");
       }
     },
     // 鼠标点击右键
@@ -252,6 +254,7 @@ export default {
   },
   components: {
     PortalTarget,
+    SelectRange
   },
   name: "Shortcut",
 };

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

@@ -2,10 +2,11 @@
   <!-- userSetting -->
   <div
     class="v-layout sds-personal-settings-window layout-window-app v-window"
-    style="position: absolute; height: 574px;"
+    style="position: absolute"
     :style="{
       zIndex: userSettingDetail.zIndex,
       width: userSettingDetail.width,
+      height: userSettingDetail.height,
       top: userSettingDetail.top,
       left: userSettingDetail.left,
     }"
@@ -13,8 +14,10 @@
     @mousedown.capture="mousedownUserSetting"
     v-if="userSettingDetail.display === 'block'"
   >
-    <div class="v-window-header-wrapper draggable"
-      @mousedown.capture="mousedownUserSettingHeader">
+    <div
+      class="v-window-header-wrapper draggable"
+      @mousedown.capture="mousedownUserSettingHeader"
+    >
       <div
         class="app-icon"
         :style="{
@@ -46,20 +49,38 @@
   </div>
 </template>
 <script>
-import {moveWindow} from '../../../../common/common'
+import {
+  moveWindow,
+  windowResize,
+  restoreWindowResize,
+} from "../../../../common/common";
 export default {
   props: ["defaultZIndex", "userSettingData"],
   mounted() {
     this.$bus.on("openUserSetting", this.openUserSetting);
     this.userSettingDetail = this.userSettingData;
+
+    window.addEventListener("resize", () => {
+      if (
+        this.userSettingDetail.display === "block" &&
+        this.userSettingDetail.iconRestore === "none"
+      ) {
+        let el = document.querySelector(
+          ".v-layout.sds-personal-settings-window"
+        );
+        let { elTop, elLeft } = windowResize(el);
+        this.userSettingDetail.top = elTop;
+        this.userSettingDetail.left = elLeft;
+      }
+    });
   },
   data() {
     return {
-      windowFirstClick:{
-        layerX:0,
-        layerY:0,
-        screenX:0,
-        screenY:0,
+      windowFirstClick: {
+        layerX: 0,
+        layerY: 0,
+        screenX: 0,
+        screenY: 0,
       },
       userSettingDetail: {
         display: "none",
@@ -67,12 +88,17 @@ export default {
         iconRestore: "",
         iconMaximize: "",
         width: "",
+        height: "",
         restoreWidth: "",
+        restoreHeight: "",
+        restoreTop: "",
+        restoreLeft: "",
         top: 0,
         left: 0,
       },
     };
   },
+  created() {},
   methods: {
     // 打开本页面
     openUserSetting() {
@@ -83,10 +109,21 @@ export default {
         this.userSettingDetail.zIndex = this.defaultZIndex + 10;
         this.$bus.emit("changeDefaultZIndex", this.defaultZIndex + 10);
         this.userSettingDetail.display = "block";
-      }
-      if(this.userSettingDetail.width !== '100%'){
-        let left = (document.documentElement.clientWidth - parseInt(this.userSettingDetail.width.replace('px',''))) / 2
-        this.userSettingDetail.left = left + 'px'
+        this.$nextTick(() => {
+          let el = document.querySelector(
+            ".v-layout.sds-personal-settings-window"
+          );
+          let { elTop, elLeft } = windowResize(el);
+          this.userSettingDetail.top = elTop;
+          this.userSettingDetail.left = elLeft;
+        });
+        if (this.userSettingDetail.width !== "100%") {
+          let left =
+            (document.documentElement.clientWidth -
+              parseInt(this.userSettingDetail.width.replace("px", ""))) /
+            2;
+          this.userSettingDetail.left = left + "px";
+        }
       }
     },
     // 关闭本页面
@@ -122,65 +159,78 @@ export default {
     },
     // 最大化本页面
     maxiMizeUserSetting() {
+      this.restoreTop = this.userSettingDetail.top;
+      this.restoreLeft = this.userSettingDetail.left;
       this.userSettingDetail.iconRestore = "block";
       this.userSettingDetail.iconMaximize = "none";
       this.userSettingDetail.width = "100%";
-      this.userSettingDetail.left = 0
-      this.userSettingDetail.top = '40px'
-      let el = document.querySelector('.v-layout.sds-personal-settings-window')
-      if(! el.className.includes(' x-window-maximized')){
-        el.className = el.className + ' x-window-maximized'
+      this.userSettingDetail.left = 0;
+      this.userSettingDetail.height = "calc(100vh - 40px)";
+      this.userSettingDetail.top = "40px";
+      let el = document.querySelector(".v-layout.sds-personal-settings-window");
+      if (!el.className.includes(" x-window-maximized")) {
+        el.className = el.className + " x-window-maximized";
       }
     },
     // 重置本页面的宽度
     RestoreUserSetting() {
       this.userSettingDetail.iconRestore = "none";
       this.userSettingDetail.iconMaximize = "block";
-      this.userSettingDetail.width =
-        this.userSettingDetail.restoreWidth;
-      let left = (document.documentElement.clientWidth - parseInt(this.userSettingDetail.width.replace('px',''))) / 2
-      this.userSettingDetail.left = left + 'px'
-      this.userSettingDetail.top = 0
-      let el = document.querySelector('.v-layout.sds-personal-settings-window')
-      if(el.className.includes(' x-window-maximized')){
-        el.className = el.className.replace(' x-window-maximized','')
+      this.userSettingDetail.width = this.userSettingDetail.restoreWidth;
+      this.userSettingDetail.height = this.userSettingDetail.restoreHeight;
+      let el = document.querySelector(".v-layout.sds-personal-settings-window");
+      this.$nextTick(() => {
+        let { elTop, elLeft } = restoreWindowResize(
+          el,
+          this.restoreTop,
+          this.restoreLeft
+        );
+        this.userSettingDetail.top = elTop;
+        this.userSettingDetail.left = elLeft;
+      });
+      if (el.className.includes(" x-window-maximized")) {
+        el.className = el.className.replace(" x-window-maximized", "");
       }
     },
     // 鼠标按下该页面头部
-    mousedownUserSettingHeader(e){
-      document.documentElement.click()
-      this.mousedownUserSetting()
-      if(this.userSettingDetail.iconMaximize === "block"){
+    mousedownUserSettingHeader(e) {
+      document.documentElement.click();
+      this.mousedownUserSetting();
+      if (this.userSettingDetail.iconMaximize === "block") {
         this.windowFirstClick.layerX = e.layerX;
         this.windowFirstClick.screenX = document.documentElement.clientWidth;
         this.windowFirstClick.layerY = e.layerY;
         this.windowFirstClick.screenY = document.documentElement.clientHeight;
-        document.addEventListener(
-          "mousemove",
-          this.moveWindowPosition
-        );
-        document.addEventListener(
-          "mouseup",
-          this.upWindowPosition
-        );
+        document.addEventListener("mousemove", this.moveWindowPosition);
+        document.addEventListener("mouseup", this.upWindowPosition);
       }
-      
     },
     // 移动弹出框窗口位置
     moveWindowPosition(e) {
-      let window = document.querySelector('.v-layout.sds-personal-settings-window')
-      let obj = moveWindow(e,window,this.windowFirstClick.layerX,this.windowFirstClick.layerY,this.windowFirstClick.screenX,this.windowFirstClick.screenY)
-      this.userSettingDetail.left = obj.moveX +'px'
-      this.userSettingDetail.top = obj.moveY +'px'
-      if (!window.className.includes(' x-panel-ghost')){
-        window.className = window.className + ' x-panel-ghost'
+      let window = document.querySelector(
+        ".v-layout.sds-personal-settings-window"
+      );
+      let obj = moveWindow(
+        e,
+        window,
+        this.windowFirstClick.layerX,
+        this.windowFirstClick.layerY,
+        this.windowFirstClick.screenX,
+        this.windowFirstClick.screenY
+      );
+      this.userSettingDetail.left = obj.moveX + "px";
+      this.userSettingDetail.top = obj.moveY + "px";
+      if (!window.className.includes(" x-panel-ghost")) {
+        window.className = window.className + " x-panel-ghost";
       }
     },
     // 鼠标松开
-    upWindowPosition(e){
-      let window = document.querySelector('.v-layout.sds-personal-settings-window')
-      if (window.className.includes(' x-panel-ghost')){
-        window.className = window.className.replace(' x-panel-ghost','')
+    upWindowPosition(e) {
+      let window = document.querySelector(
+        ".v-layout.sds-personal-settings-window"
+      );
+      if (window.className.includes(" x-panel-ghost")) {
+        window.className = window.className.replace(" x-panel-ghost", "");
       }
       document.removeEventListener("mousemove", this.moveWindowPosition);
       document.removeEventListener("mouseup", this.upWindowPosition);

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

@@ -10,26 +10,26 @@
     <div class="v-trap-focus-indicator"></div>
     <div class="v-trap-focus-body">
       <div class="taskbar-title">{{userTrayPanelDetail.title}}</div>
-      <div class="v-menu-item" @click.stop="openUserSetting">
+      <div class="v-menu-item" @click.stop="openUserSetting" :class="userTrayPanelDetail.settingCls" @mouseenter="mouseenterMenuItem">
         <span class="menu-icon setting"></span>
         个人设置
       </div>
       <div class="v-menu-item-divider"></div>
-      <div class="v-menu-item">
+      <div class="v-menu-item" @mouseenter="mouseenterMenuItem">
         <span class="menu-icon reboot"></span>
         重新启动
       </div>
-      <div class="v-menu-item" @click.stop="openUserPoweroff">
+      <div class="v-menu-item" @click.stop="openUserPoweroff" @mouseenter="mouseenterMenuItem">
         <span class="menu-icon poweroff"></span>
         关机
       </div>
       <div class="v-menu-item-divider"></div>
-      <div class="v-menu-item" @click.stop="openUserAbout">
+      <div class="v-menu-item" @click.stop="openUserAbout" @mouseenter="mouseenterMenuItem">
         <span class="menu-icon about"></span>
         关于
       </div>
       <div class="v-menu-item-divider"></div>
-      <div class="v-menu-item">
+      <div class="v-menu-item" @mouseenter="mouseenterMenuItem">
         <span class="menu-icon logout"></span>
         退出
       </div>
@@ -47,6 +47,7 @@ export default {
     return {
       display: 'none',
       userTrayPanelDetail: {
+        settingCls:'active',
         title:'synology',
         detailMessage: [],
       },
@@ -70,6 +71,7 @@ export default {
           );
         }
       }
+      this.userTrayPanelDetail.settingCls = 'active'
     },
     // 点击本页面
     clickUserTrayPanel(e){
@@ -121,6 +123,10 @@ export default {
       this.$bus.emit("openMask",'v-window-container-mask');
 
     },
+    // 移入每一项
+    mouseenterMenuItem(){
+      this.userTrayPanelDetail.settingCls = ''
+    },
     // 打开关于页面
     openUserAbout(e){
       this.hiddenUserAndchangeIconColor(e)
@@ -135,8 +141,7 @@ export default {
     },
     // 确认关机
     confirmPoweroff(){
-      this.$bus.emit("closeMessage");
-      this.$bus.emit("closeMask")
+      this.cancelPoweroff()
     }
   },
   components: {},

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

@@ -10,6 +10,7 @@
       style="position: absolute; visibility: visible"
       :style="{
         width: detailMessage.width,
+        height: detailMessage.height,
         minHeight: detailMessage.minHeight,
         display: detailMessage.display,
         zIndex: detailMessage.zIndex,
@@ -198,7 +199,7 @@
               </div>
               <div
                 class="x-window-body x-border-layout-ct"
-                style="width: 100%; height: 484px"
+                style="width: 100%"
               ></div>
             </div>
           </div>
@@ -278,7 +279,12 @@
 </template>
 
 <script>
-import { moveWindow } from "../../../../common/common";
+import {
+  moveWindow,
+  windowResize,
+  restoreWindowResize,
+} from "../../../../common/common";
+
 export default {
   props: ["defaultZIndex", "detailMessageList"],
   data() {
@@ -297,6 +303,7 @@ export default {
       lastCheckIndex: -1,
       openWindowNum: 0,
       detailMessageWidthList: [],
+      detailMessageHeightList: [],
       // 已经被打开的弹出窗口
       openedmenuList: [],
     };
@@ -313,6 +320,7 @@ export default {
     this.resizablePinnedDetail.detailMessageList = this.detailMessageList;
     this.resizablePinnedDetail.detailMessageList.forEach((item, index) => {
       this.detailMessageWidthList[index] = item.width;
+      this.detailMessageHeightList[index] = item.height;
     });
     window.addEventListener("resize", () => {
       let windowList = document.querySelectorAll(
@@ -325,55 +333,58 @@ export default {
           }
         );
         if (item.style.display === "block") {
-          if (
-            document.documentElement.scrollHeight <
-              item.offsetHeight + item.offsetTop &&
-            document.documentElement.scrollHeight > item.offsetHeight
-          ) {
-            let top = document.documentElement.scrollHeight - item.offsetHeight;
-            this.resizablePinnedDetail.detailMessageList[index].top =
-              top + "px";
-            if (top < 0) {
-              this.resizablePinnedDetail.detailMessageList[index].top = 0;
-            }
-          } else if (
-            document.documentElement.scrollHeight >
-            item.offsetHeight
-          ) {
-            this.resizablePinnedDetail.detailMessageList[index].top =
-              (document.documentElement.scrollHeight - item.offsetHeight) / 2 +'px'
-          } else if (
-            document.documentElement.scrollHeight < item.offsetHeight
-          ) {
-            this.resizablePinnedDetail.detailMessageList[index].top = 0;
-          }
-          console.log(
-            document.documentElement.scrollWidth,
-            document.documentElement.scrollHeight,
-            item.offsetHeight,
-            item.offsetWidth
-          );
-          if (
-            document.documentElement.scrollWidth <
-              item.offsetWidth + item.offsetLeft &&
-            document.documentElement.scrollWidth > item.offsetWidth
-          ) {
-            let left = document.documentElement.scrollWidth - item.offsetWidth;
-            this.resizablePinnedDetail.detailMessageList[index].left =
-              left + "px";
-            console.log(left);
-            if (left < 0) {
-              this.resizablePinnedDetail.detailMessageList[index].left = 0;
-            }
-          } else if (
-            document.documentElement.scrollWidth >
-            item.offsetWidth
-          ) {
-            this.resizablePinnedDetail.detailMessageList[index].left = (document.documentElement.scrollWidth-
-            item.offsetWidth)/2 +'px'
-          } else if (document.documentElement.scrollWidth < item.offsetWidth) {
-            this.resizablePinnedDetail.detailMessageList[index].left = 0;
-          }
+          let { elTop, elLeft } = windowResize(item);
+          this.resizablePinnedDetail.detailMessageList[index].top = elTop;
+          this.resizablePinnedDetail.detailMessageList[index].left = elLeft;
+          // if (
+          //   document.documentElement.scrollHeight <
+          //     item.offsetHeight + item.offsetTop &&
+          //   document.documentElement.scrollHeight > item.offsetHeight
+          // ) {
+          //   let top = document.documentElement.scrollHeight - item.offsetHeight;
+          //   this.resizablePinnedDetail.detailMessageList[index].top =
+          //     top + "px";
+          //   if (top < 0) {
+          //     this.resizablePinnedDetail.detailMessageList[index].top = 0;
+          //   }
+          // } else if (
+          //   document.documentElement.scrollHeight >
+          //   item.offsetHeight
+          // ) {
+          //   this.resizablePinnedDetail.detailMessageList[index].top =
+          //     (document.documentElement.scrollHeight - item.offsetHeight) / 2 +'px'
+          // } else if (
+          //   document.documentElement.scrollHeight < item.offsetHeight
+          // ) {
+          //   this.resizablePinnedDetail.detailMessageList[index].top = 0;
+          // }
+          // console.log(
+          //   document.documentElement.scrollWidth,
+          //   document.documentElement.scrollHeight,
+          //   item.offsetHeight,
+          //   item.offsetWidth
+          // );
+          // if (
+          //   document.documentElement.scrollWidth <
+          //     item.offsetWidth + item.offsetLeft &&
+          //   document.documentElement.scrollWidth > item.offsetWidth
+          // ) {
+          //   let left = document.documentElement.scrollWidth - item.offsetWidth;
+          //   this.resizablePinnedDetail.detailMessageList[index].left =
+          //     left + "px";
+          //   console.log(left);
+          //   if (left < 0) {
+          //     this.resizablePinnedDetail.detailMessageList[index].left = 0;
+          //   }
+          // } else if (
+          //   document.documentElement.scrollWidth >
+          //   item.offsetWidth
+          // ) {
+          //   this.resizablePinnedDetail.detailMessageList[index].left = (document.documentElement.scrollWidth-
+          //   item.offsetWidth)/2 +'px'
+          // } else if (document.documentElement.scrollWidth < item.offsetWidth) {
+          //   this.resizablePinnedDetail.detailMessageList[index].left = 0;
+          // }
         }
       });
     });
@@ -414,8 +425,106 @@ export default {
     },
     // 打开弹出窗口
     openDialogWindow(detailMessageIndex) {
-      this.resizablePinnedDetail.detailMessageList[detailMessageIndex].display =
-        "block";
+      if (
+        this.resizablePinnedDetail.detailMessageList[detailMessageIndex]
+          .display === "none"
+      ) {
+        this.resizablePinnedDetail.detailMessageList[
+          detailMessageIndex
+        ].display = "block";
+        this.$nextTick(() => {
+          let windowList = document.querySelectorAll(
+            ".sds-window-v5.x-resizable-pinned"
+          );
+          windowList.forEach((item) => {
+            if (
+              item.dataset.id ==
+              this.resizablePinnedDetail.detailMessageList[detailMessageIndex]
+                .id
+            ) {
+              item.style.height = "580px";
+              let { elTop, elLeft } = windowResize(item);
+              this.resizablePinnedDetail.detailMessageList[
+                detailMessageIndex
+              ].top = elTop;
+              this.resizablePinnedDetail.detailMessageList[
+                detailMessageIndex
+              ].left = elLeft;
+              // if (
+              //   document.documentElement.scrollHeight >
+              //     item.offsetHeight + item.offsetTop &&
+              //   document.documentElement.scrollHeight > item.offsetHeight
+              // ) {
+              //   top =
+              //     (document.documentElement.clientHeight - item.offsetHeight) / 2;
+              //   this.resizablePinnedDetail.detailMessageList[
+              //     detailMessageIndex
+              //   ].top = top + "px";
+              // } else if (
+              //   document.documentElement.scrollHeight <
+              //     item.offsetHeight + item.offsetTop &&
+              //   document.documentElement.scrollHeight > item.offsetHeight
+              // ) {
+              //   this.resizablePinnedDetail.detailMessageList[
+              //     detailMessageIndex
+              //   ].top =
+              //     document.documentElement.scrollHeight -
+              //     item.offsetHeight +
+              //     "px";
+              // } else if (
+              //   document.documentElement.scrollHeight < item.offsetHeight
+              // ) {
+              //   this.resizablePinnedDetail.detailMessageList[
+              //     detailMessageIndex
+              //   ].top = 0;
+              // }
+              // if (
+              //   typeof this.resizablePinnedDetail.detailMessageList[
+              //     detailMessageIndex
+              //   ].top === "string"
+              // ) {
+              //   if (
+              //     parseFloat(
+              //       this.resizablePinnedDetail.detailMessageList[
+              //         detailMessageIndex
+              //       ].top.replace("px", "")
+              //     ) < 0
+              //   ) {
+              //     this.resizablePinnedDetail.detailMessageList[
+              //       detailMessageIndex
+              //     ].top = 0;
+              //   }
+              // }
+
+              // if (
+              //   document.documentElement.scrollHeight <
+              //     item.offsetHeight + item.offsetTop &&
+              //   document.documentElement.scrollHeight > item.offsetHeight
+              // ) {
+              //   this.resizablePinnedDetail.detailMessageList[
+              //     detailMessageIndex
+              //   ].top =
+              //     document.documentElement.scrollHeight -
+              //     item.offsetHeight +
+              //     "px";
+              //   if (
+              //     document.documentElement.scrollHeight - item.offsetHeight <
+              //     0
+              //   ) {
+              //     this.resizablePinnedDetail.detailMessageList[
+              //       detailMessageIndex
+              //     ].top = 0;
+              //   }
+              // } else {
+              //   this.resizablePinnedDetail.detailMessageList[
+              //     detailMessageIndex
+              //   ].top = "40px";
+              // }
+            }
+          });
+        });
+      }
+
       if (
         (!detailMessageIndex && detailMessageIndex !== 0) ||
         detailMessageIndex === -1 ||
@@ -437,119 +546,38 @@ export default {
       this.resizablePinnedDetail.detailMessageList[detailMessageIndex].zIndex =
         defaultZIndex;
       this.lastCheckIndex = detailMessageIndex;
-      let left, top;
-      if (
-        this.resizablePinnedDetail.detailMessageList[detailMessageIndex]
-          .width !== "100%"
-      ) {
-        left =
-          (document.documentElement.clientWidth -
-            parseInt(
-              this.resizablePinnedDetail.detailMessageList[
-                detailMessageIndex
-              ].width.replace("px", "")
-            )) /
-          2;
-        this.resizablePinnedDetail.detailMessageList[detailMessageIndex].left =
-          left + "px";
-      }
-      if (
-        typeof this.resizablePinnedDetail.detailMessageList[detailMessageIndex]
-          .left === "string"
-      ) {
-        if (
-          parseFloat(
-            this.resizablePinnedDetail.detailMessageList[
-              detailMessageIndex
-            ].left.replace("px", "")
-          ) < 0
-        ) {
-          this.resizablePinnedDetail.detailMessageList[
-            detailMessageIndex
-          ].left = 0;
-        }
-      }
-      this.$nextTick(() => {
-        let windowList = document.querySelectorAll(
-          ".sds-window-v5.x-resizable-pinned"
-        );
-        windowList.forEach((item) => {
-          if (
-            item.dataset.id ==
-            this.resizablePinnedDetail.detailMessageList[detailMessageIndex].id
-          ) {
-            if (
-              document.documentElement.scrollHeight >
-                item.offsetHeight + item.offsetTop &&
-              document.documentElement.scrollHeight > item.offsetHeight
-            ) {
-              top =
-                (document.documentElement.clientHeight - item.offsetHeight) / 2;
-              this.resizablePinnedDetail.detailMessageList[
-                detailMessageIndex
-              ].top = top + "px";
-            } else if (
-              document.documentElement.scrollHeight <
-                item.offsetHeight + item.offsetTop &&
-              document.documentElement.scrollHeight > item.offsetHeight
-            ) {
-              this.resizablePinnedDetail.detailMessageList[
-                detailMessageIndex
-              ].top =
-                document.documentElement.scrollHeight -
-                item.offsetHeight +
-                "px";
-            } else if (
-              document.documentElement.scrollHeight < item.offsetHeight
-            ) {
-              this.resizablePinnedDetail.detailMessageList[
-                detailMessageIndex
-              ].top = 0;
-            }
-            if (
-              typeof this.resizablePinnedDetail.detailMessageList[
-                detailMessageIndex
-              ].top === "string"
-            ) {
-              if (
-                parseFloat(
-                  this.resizablePinnedDetail.detailMessageList[
-                    detailMessageIndex
-                  ].top.replace("px", "")
-                ) < 0
-              ) {
-                this.resizablePinnedDetail.detailMessageList[
-                  detailMessageIndex
-                ].top = 0;
-              }
-            }
-            // if (
-            //   document.documentElement.scrollHeight <
-            //     item.offsetHeight + item.offsetTop &&
-            //   document.documentElement.scrollHeight > item.offsetHeight
-            // ) {
-            //   this.resizablePinnedDetail.detailMessageList[
-            //     detailMessageIndex
-            //   ].top =
-            //     document.documentElement.scrollHeight -
-            //     item.offsetHeight +
-            //     "px";
-            //   if (
-            //     document.documentElement.scrollHeight - item.offsetHeight <
-            //     0
-            //   ) {
-            //     this.resizablePinnedDetail.detailMessageList[
-            //       detailMessageIndex
-            //     ].top = 0;
-            //   }
-            // } else {
-            //   this.resizablePinnedDetail.detailMessageList[
-            //     detailMessageIndex
-            //   ].top = "40px";
-            // }
-          }
-        });
-      });
+      // let left;
+      // if (
+      //   this.resizablePinnedDetail.detailMessageList[detailMessageIndex]
+      //     .width !== "100%"
+      // ) {
+      //   left =
+      //     (document.documentElement.clientWidth -
+      //       parseInt(
+      //         this.resizablePinnedDetail.detailMessageList[
+      //           detailMessageIndex
+      //         ].width.replace("px", "")
+      //       )) /
+      //     2;
+      //   this.resizablePinnedDetail.detailMessageList[detailMessageIndex].left =
+      //     left + "px";
+      // }
+      // if (
+      //   typeof this.resizablePinnedDetail.detailMessageList[detailMessageIndex]
+      //     .left === "string"
+      // ) {
+      //   if (
+      //     parseFloat(
+      //       this.resizablePinnedDetail.detailMessageList[
+      //         detailMessageIndex
+      //       ].left.replace("px", "")
+      //     ) < 0
+      //   ) {
+      //     this.resizablePinnedDetail.detailMessageList[
+      //       detailMessageIndex
+      //     ].left = 0;
+      //   }
+      // }
     },
     // 切换弹出的menu窗口
     changeDialogMenuWindow(id) {
@@ -609,6 +637,16 @@ export default {
         this.resizablePinnedDetail.detailMessageList.findIndex((item) => {
           return item.id === id;
         });
+      this.resizablePinnedDetail.detailMessageList[
+        detailMessageIndex
+      ].restoreTop =
+        this.resizablePinnedDetail.detailMessageList[detailMessageIndex].top;
+      this.resizablePinnedDetail.detailMessageList[
+        detailMessageIndex
+      ].restoreLeft =
+        this.resizablePinnedDetail.detailMessageList[detailMessageIndex].left;
+      this.resizablePinnedDetail.detailMessageList[detailMessageIndex].height =
+        "calc(100vh - 40px)";
       this.resizablePinnedDetail.detailMessageList[detailMessageIndex].top =
         "40px";
       this.resizablePinnedDetail.detailMessageList[detailMessageIndex].width =
@@ -629,15 +667,15 @@ export default {
         window.className = window.className + " x-window-maximized";
       }
     },
-    //恢复弹出窗口宽度
+    //恢复弹出窗口宽度和高度
     restoreMizeWindow(id) {
       let detailMessageIndex =
         this.resizablePinnedDetail.detailMessageList.findIndex((item) => {
           return item.id === id;
         });
       if (
-       typeof ( this.resizablePinnedDetail.detailMessageList[detailMessageIndex]
-          .top) === 'string'
+        typeof this.resizablePinnedDetail.detailMessageList[detailMessageIndex]
+          .top === "string"
       ) {
         if (
           parseFloat(
@@ -650,27 +688,46 @@ export default {
             detailMessageIndex
           ].top = 0;
       }
+      // let windowList = document.querySelectorAll(
+      //     ".sds-window-v5.x-resizable-pinned"
+      //   );
+      //   windowList.forEach((item) => {
+      //     if (
+      //       item.dataset.id ==
+      //       this.resizablePinnedDetail.detailMessageList[detailMessageIndex].id
+      //     ) {
+      //       // item.style.height = ''
+      //     }
+      //   })
+
       this.resizablePinnedDetail.detailMessageList[detailMessageIndex].width =
         this.detailMessageWidthList[detailMessageIndex];
+      this.resizablePinnedDetail.detailMessageList[detailMessageIndex].height =
+        this.detailMessageHeightList[detailMessageIndex];
       this.resizablePinnedDetail.detailMessageList[
         detailMessageIndex
       ].iconRestore = "none";
       this.resizablePinnedDetail.detailMessageList[
         detailMessageIndex
       ].iconMaximize = "block";
-      let left =
-        (document.documentElement.clientWidth -
-          parseInt(
-            this.resizablePinnedDetail.detailMessageList[
-              detailMessageIndex
-            ].width.replace("px", "")
-          )) /
-        2;
-      this.resizablePinnedDetail.detailMessageList[detailMessageIndex].left =
-        left + "px";
+
       let window = document.querySelector(
         ".sds-window-v5.x-resizable-pinned.active-win"
       );
+      this.$nextTick(() => {
+        let { elTop, elLeft } = restoreWindowResize(
+          window,
+          this.resizablePinnedDetail.detailMessageList[detailMessageIndex]
+            .restoreTop,
+          this.resizablePinnedDetail.detailMessageList[detailMessageIndex]
+            .restoreLeft
+        );
+        this.resizablePinnedDetail.detailMessageList[detailMessageIndex].top =
+          elTop;
+        this.resizablePinnedDetail.detailMessageList[detailMessageIndex].left =
+          elLeft;
+      });
+
       if (window.className.includes(" x-window-maximized")) {
         window.className = window.className.replace(" x-window-maximized", "");
       }

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

@@ -2,6 +2,7 @@
   <div
     class="vue-portal-target"
     :style="{ left: left, top: top, display: display }"
+    @mousedown.stop=""
   >
     <div
       class="v-menu"
@@ -18,6 +19,7 @@
           @mouseenter="mouseenterSelect(selectIndex)"
           @mouseleave="mouseleaveSelect(selectIndex)"
           @click="clickSelect(select)"
+
         >
           {{ select.text }}
         </div>
@@ -58,13 +60,16 @@ export default {
       });
       if (this.display === "none") {
         this.display = "block";
+        window.addEventListener('mousedown',this.hiddenPortalTarget)
       }
     },
     // 隐藏本页面
     hiddenPortalTarget() {
+      console.log(1)
       if (this.display === "block") {
         this.display = "none";
       }
+      window.removeEventListener('mousedown',this.hiddenPortalTarget)
     },
     // 移入选择项改变背景颜色
     mouseenterSelect(selectIndex) {

src/component/Container/DesktopAppView/index.vue

@@ -112,7 +112,6 @@ export default {
     showAppView() {
       this.display = "block";
       this.$bus.emit("hiddenOrShowOtherWindow", true);
-      this.$bus.emit("hiddenPortalTarget");
       window.addEventListener("click", this.WindowClick);
       if (this.firstOpen) {
         this.desktopAppViewDetail.detailMessageList.forEach((item) => {

src/component/Container/index.vue

@@ -41,6 +41,7 @@ export default {
         {
           id: 0,
           width: "1150px",
+          height:'580px',
           minHeight: "520px",
           title: "控制中心",
           spacialCls: "controlCenter",
@@ -54,6 +55,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -68,6 +71,7 @@ export default {
         {
           id: 1,
           width: "1010px",
+          height:'580px',
           minHeight: "420px",
           title: "DSM 说明",
           spacialCls: "question",
@@ -81,6 +85,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -95,6 +101,7 @@ export default {
         {
           id: 2,
           width: "1254px",
+          height:'580px',
           minHeight: "560px",
           title: "套件中心",
           spacialCls: "tjCenter",
@@ -108,6 +115,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -122,6 +131,7 @@ export default {
         {
           id: 3,
           width: "1230px",
+          height:'580px',
           minHeight: "560px",
           title: "资源监控",
           spacialCls: "resourceMonitor",
@@ -136,6 +146,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -150,6 +162,7 @@ export default {
         {
           id: 4,
           width: "1220px",
+          height:'580px',
           minHeight: "560px",
           title: "存储管理器",
           spacialCls: "storageManager",
@@ -165,6 +178,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -179,6 +194,7 @@ export default {
         {
           id: 5,
           width: "1210px",
+          height:'580px',
           minHeight: "560px",
           title: "logCenter",
           spacialCls: "controlCenter",
@@ -192,6 +208,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -206,6 +224,7 @@ export default {
         {
           id: 6,
           width: "1200px",
+          height:'580px',
           minHeight: "560px",
           title: "安全顾问",
           spacialCls: "securityScan",
@@ -220,6 +239,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -234,6 +255,7 @@ export default {
         {
           id: 7,
           width: "1190px",
+          height:'580px',
           minHeight: "560px",
           title: "技术支持中心",
           spacialCls: "supportCenter",
@@ -248,6 +270,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -266,6 +290,7 @@ export default {
         {
           id: 8,
           width: "1170px",
+          height:'580px',
           minHeight: "560px",
           title: "Storage Manager",
           spacialCls: "storageManager",
@@ -280,6 +305,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -294,6 +321,7 @@ export default {
         {
           id: 9,
           width: "1160px",
+          height:'580px',
           minHeight: "560px",
           title: "Synology MailPlus Server",
           spacialCls: "mailPlusServer",
@@ -308,6 +336,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -322,6 +352,7 @@ export default {
         {
           id: 10,
           width: "1150px",
+          height:'580px',
           minHeight: "560px",
           title: "Synology Chat 管理控制台",
           spacialCls: "chatAdminpng",
@@ -336,6 +367,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -350,6 +383,7 @@ export default {
         {
           id: 11,
           width: "1140px",
+          height:'580px',
           minHeight: "560px",
           title: "Synology Chat",
           spacialCls: "chat",
@@ -363,6 +397,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -377,6 +413,7 @@ export default {
         {
           id: 12,
           width: "1010px",
+          height:'580px',
           minHeight: "440px",
           title: "File Station",
           spacialCls: "file",
@@ -390,6 +427,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -404,6 +443,7 @@ export default {
         {
           id: 13,
           width: "1120px",
+          height:'580px',
           minHeight: "560px",
           title: "Hyper Backup",
           spacialCls: "hyperBackup",
@@ -418,6 +458,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -432,6 +474,7 @@ export default {
         {
           id: 14,
           width: "1110px",
+          height:'580px',
           minHeight: "560px",
           title: "Advanced Media Extensions",
           spacialCls: "aME",
@@ -445,6 +488,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -459,6 +504,7 @@ export default {
         {
           id: 15,
           width: "1100px",
+          height:'580px',
           minHeight: "560px",
           title: "Synology Calendar",
           spacialCls: "synologyCalendar",
@@ -473,6 +519,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -487,6 +535,7 @@ export default {
         {
           id: 16,
           width: "1090px",
+          height:'580px',
           minHeight: "560px",
           title: "Synology Contacts",
           spacialCls: "contacts",
@@ -500,6 +549,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -514,6 +565,7 @@ export default {
         {
           id: 17,
           width: "1070px",
+          height:'580px',
           minHeight: "560px",
           title: "Universal Search",
           spacialCls: "universalSearch",
@@ -528,6 +580,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -542,6 +596,7 @@ export default {
         {
           id: 18,
           width: "1060px",
+          height:'580px',
           minHeight: "560px",
           title: "Synology Photos",
           spacialCls: "photos",
@@ -555,6 +610,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -569,6 +626,7 @@ export default {
         {
           id: 19,
           width: "1260px",
+          height:'580px',
           minHeight: "560px",
           title: "Audio Station",
           spacialCls: "audioStation",
@@ -583,6 +641,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -597,6 +657,7 @@ export default {
         {
           id: 20,
           width: "1050px",
+          height:'580px',
           minHeight: "560px",
           title: "Synology Drive 管理控制台",
           spacialCls: "driveAdminConsole",
@@ -611,6 +672,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -625,6 +688,7 @@ export default {
         {
           id: 21,
           width: "1060px",
+          height:'580px',
           minHeight: "560px",
           title: "Download Station",
           spacialCls: "downloadStation",
@@ -639,6 +703,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -653,6 +719,7 @@ export default {
         {
           id: 22,
           width: "1240px",
+          height:'580px',
           minHeight: "560px",
           title: "Synology Drive",
           spacialCls: "synologyDrive",
@@ -667,6 +734,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -681,6 +750,7 @@ export default {
         {
           id: 23,
           width: "1130px",
+          height:'580px',
           minHeight: "560px",
           title: "Synology MailPlus",
           spacialCls: "mailPlus",
@@ -694,6 +764,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -708,6 +780,7 @@ export default {
         {
           id: 24,
           width: "1050px",
+          height:'580px',
           minHeight: "560px",
           title: "媒体服务器",
           spacialCls: "mediaServer",
@@ -722,6 +795,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -736,6 +811,7 @@ export default {
         {
           id: 25,
           width: "1120px",
+          height:'580px',
           minHeight: "560px",
           title: "Note Station",
           spacialCls: "noteStation",
@@ -750,6 +826,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -764,6 +842,7 @@ export default {
         {
           id: 26,
           width: "1130px",
+          height:'580px',
           minHeight: "560px",
           title: "OAuth Service",
           spacialCls: "authenticator",
@@ -778,6 +857,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -792,6 +873,7 @@ export default {
         {
           id: 27,
           width: "1070px",
+          height:'580px',
           minHeight: "560px",
           title: "PDF 查看器",
           spacialCls: "documentViewer",
@@ -804,6 +886,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -818,6 +902,7 @@ export default {
         {
           id: 28,
           width: "1030px",
+          height:'580px',
           minHeight: "560px",
           title: "Synology Drive ShareSync",
           spacialCls: "package",
@@ -831,6 +916,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -845,6 +932,7 @@ export default {
         {
           id: 29,
           width: "1110px",
+          height:'580px',
           minHeight: "560px",
           title: "Video Station",
           spacialCls: "videoStation",
@@ -859,6 +947,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -873,6 +963,7 @@ export default {
         {
           id: 30,
           width: "1120px",
+          height:'580px',
           minHeight: "560px",
           title: "文本编辑器",
           spacialCls: "textEditor",
@@ -886,6 +977,8 @@ export default {
           unReadyMessageCls: "",
           left: 0,
           top: 0,
+        restoreTop: "",
+        restoreLeft: "",
           selectList: [
             {
               id: 10,
@@ -903,6 +996,7 @@ export default {
         id: 1111,
         display: "none",
         width: "850px",
+        height:'574px',
         zIndex: 9040,
         top: 0,
         left: 0,
@@ -912,6 +1006,7 @@ export default {
         iconRestore: "none",
         iconMaximize: "block",
         restoreWidth: "850px",
+        restoreHeight: "574px",
       },
       fixWindowData: {
         zIndex: 9050,