封装拖拽组件，悬浮窗加入防抖

package.json

@@ -11,7 +11,7 @@
     "postinstall": "electron-builder install-app-deps",
     "postuninstall": "electron-builder install-app-deps"
   },
-  "main": "background.ts",
+  "main": "background.js",
   "dependencies": {
     "@types/lowdb": "1.0.9",
     "@wangeditor/editor": "^5.1.1",
@@ -79,4 +79,4 @@
     "not dead",
     "not ie 11"
   ]
-}
+}

src/background.ts

@@ -1,16 +1,11 @@
 'use strict'
 
-import { app, protocol, BrowserWindow, ipcMain, session, MessageChannelMain } from 'electron'
+import { app, protocol, BrowserWindow, ipcMain, session, MessageChannelMain, screen } from 'electron'
 import { createProtocol } from 'vue-cli-plugin-electron-builder/lib'
 import installExtension, { VUEJS3_DEVTOOLS } from 'electron-devtools-installer'
 const isDevelopment = process.env.NODE_ENV !== 'production'
 const path = require('path');
 const mainProcess = require('./mainProcess')
-
-const appFolder = path.dirname(process.execPath);
-const updateExe = path.resolve(appFolder, "..", "Update.exe");
-const exeName = path.basename(process.execPath);
-
 const logo = mainProcess.logo()
 
 import('@/on')
@@ -55,30 +50,15 @@ app.on('ready', async () => {
 
 })
 
-function launchAtStartup() {
-  if (process.platform === "darwin") {
-    app.setLoginItemSettings({
-      openAtLogin: true,
-      openAsHidden: true
-    });
-  } else {
-    app.setLoginItemSettings({
-      openAtLogin: true,
-      openAsHidden: true,
-      path: updateExe,
-      args: [
-        "--processStart",
-        `"${exeName}"`,
-        "--process-start-args",
-        `"--hidden"`
-      ]
-    });
-  }
-}
+
 
 async function createWindow() {
   const mainWindows = mainProcess.mainWindows()
   const { config, winURL } = mainWindows
+  const size = screen.getPrimaryDisplay().workAreaSize
+  console.log('size', size)
+  config.x = size.width - 380
+  config.y = size.height - 700
   const win = new BrowserWindow(config)
   win.setIcon(logo)
   await mainProcess.initDevTool(session)

src/components/drag.vue

@@ -0,0 +1,118 @@
+<template>
+  <div class="drag_main" @mousedown="onMouseDown" @mouseup="end">
+    <slot></slot>
+  </div>
+</template>
+
+
+<script>
+const { ipcRenderer } = require("electron");
+import { mapState } from "vuex";
+let mouseX, mouseY;
+let beforeX, beforeY, afterX, afterY;
+export default {
+  computed: {
+    ...mapState("header", {
+      pageTypeText: (state) => state.pageTypeText,
+    }),
+  },
+  props: {},
+  watch: {
+    pageTypeText: function () {
+      this.init();
+    },
+  },
+  data() {
+    return {
+      isDrag: false,
+      width: 350,
+      height: 600,
+    };
+  },
+  created() {
+    const that = this;
+    that.init();
+    window.addEventListener("mousemove", that.move);
+    window.addEventListener("dblclick", that.end);
+    window.addEventListener("mouseup", that.end);
+    const pageTypeText = that.pageTypeText;
+    if (pageTypeText === "edited") {
+      window.addEventListener("resize", function (e) {
+        if (!that.isDrag) {
+          let currentTarget = e.currentTarget;
+          that.width = currentTarget.outerWidth;
+          that.height = currentTarget.outerHeight;
+        }
+      });
+    }
+  },
+  methods: {
+    init() {
+      const pageTypeText = this.pageTypeText;
+      switch (pageTypeText) {
+        case "edited":
+          {
+            this.width = 700;
+            this.height = 500;
+          }
+          break;
+        case "menu":
+          {
+            this.width = 100;
+            this.height = 100;
+          }
+          break;
+        default:
+          break;
+      }
+    },
+    end(e) {
+      [afterX, afterY] = [e.offsetX, e.offsetY];
+      this.isDrag = false;
+      if (beforeX === afterX && beforeY === afterY) {
+        this.$emit("click");
+      }
+
+      // this.debounce(this.openMenu, 500, true);
+    },
+    onMouseDown(e) {
+      this.isDrag = true;
+      mouseX = e.clientX;
+      mouseY = e.clientY;
+      beforeX = e.offsetX;
+      beforeY = e.offsetY;
+    },
+    move() {
+      const that = this;
+      //   console.log(that);
+      if (that.isDrag) {
+        let config = {
+          mouseX,
+          mouseY,
+        };
+        if (that.height) {
+          config.height = that.height;
+        }
+        if (that.width) {
+          config.width = that.width;
+        }
+        // console.log("config", config);
+        ipcRenderer.send("windowMoving", config);
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.drag_main {
+  position: relative;
+  cursor: auto;
+  width: 100%;
+  height: 100%;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+</style>

src/on.ts

@@ -3,7 +3,7 @@ const mainProcess = require('./mainProcess')
 const dayjs = require('dayjs')
 import db from './server'
 const path = require('path');
-
+const fs = require("fs")
 const logo = mainProcess.logo()
 
 type note = {
@@ -14,18 +14,7 @@ type note = {
     timinGtimeStamp: any,
 }
 
-const isAutoApp = app.getLoginItemSettings()
-console.log('isAutoApp', isAutoApp)
-const appFolder = path.dirname(process.execPath)
-const updateExe = path.resolve(appFolder, '..', '便利贴.exe')
-console.log('updateExe', updateExe)
-//开机自启(登陆时打开)
-app.setLoginItemSettings({
-    openAtLogin: true,
-    args: ["--openAsHidden"],
-    // openAsHidde: true,
-    path: 'D:/Note/便利贴.exe'
-})
+
 
 
 const getUser = function () {
@@ -38,6 +27,7 @@ ipcMain.on('setUser', (event, config) => {
     for (const item of winList) {
         item.webContents.send('sendUser', { config })
     }
+    selfStarting(config.startUp)
 })
 
 ipcMain.handle('getUser', (event) => {
@@ -56,6 +46,11 @@ ipcMain.on('zoomInAndOut', (event) => {
 })
 
 app.whenReady().then(() => {
+    let config = getUser()
+    if (typeof config.startUp != 'undefined') {
+        selfStarting(config.startUp)
+    }
+
     setInterval(() => {
         const currentTimeStamp = dayjs().valueOf()
 
@@ -79,6 +74,26 @@ app.whenReady().then(() => {
     }, 2000);
 })
 
+const selfStarting = function (openAtLogin: boolean = true) {
+    // const isAutoApp = app.getLoginItemSettings()
+    const appFolder = path.dirname(process.execPath)
+    const updateExe = path.resolve(appFolder, '\\', '便利贴.exe')
+    console.log('appFolder', appFolder)
+    console.log('updateExe', updateExe)
+    console.log('app.getAppPath()', app.getAppPath())
+    let exePath = appFolder + "\\便利贴.exe"
+    //开机自启(登陆时打开)
+    app.setLoginItemSettings({
+        openAtLogin,
+        args: ["--openAsHidden"],
+        path: exePath
+    })
+    if (!global.isDevelopment) {
+        fs.writeFile('便利贴写入.txt', JSON.stringify({ appFolder, updateExe, exePath, openAtLogin }), function (err: any) { });
+    }
+
+}
+
 ipcMain.on('closeSuspensionWin', (event, id) => {
     const webContents = event.sender
     const win: any = BrowserWindow.fromWebContents(webContents)
@@ -122,6 +137,7 @@ ipcMain.on('windowMoving', (event, { mouseX, mouseY, width, height }) => {
     const win: any = BrowserWindow.fromWebContents(webContents)
     const { x, y } = screen.getCursorScreenPoint()
     // win.setPosition(x - mouseX, y - mouseY)
+
     win.setBounds({ x: x - mouseX, y: y - mouseY, width, height })
 });
 
@@ -294,6 +310,7 @@ ipcMain.on('closeWindow', async (event, id) => {
     const webContents = event.sender
     const win: any = BrowserWindow.fromWebContents(webContents)
     win.setSkipTaskbar(true)
+    // suspensionWin()
     if (!id) {
         if (!global.isMenu) {
             const tray = new Tray(logo);
@@ -311,7 +328,7 @@ ipcMain.on('closeWindow', async (event, id) => {
                 console.log('win.isVisible()', win.isVisible())
                 win.isVisible() ? win.show() : win.hide()
             });
-            // suspensionWin()
+
             global.isMenu = true
         }