✨ 支持系统菜单功能

src/common/utils/localConfig.ts

@@ -2,6 +2,7 @@ import path from "path";
 import fs from "fs";
 import getLocalDataFile from "./getLocalDataFile";
 import { app } from "electron";
+import commonConst from "./commonConst";
 
 const configPath = path.join(getLocalDataFile(), "./rubick-config.json");
 
@@ -17,7 +18,7 @@ const defaultConfigForAnyPlatform = {
       start: true,
       space: true,
       // 是否失焦隐藏。默认在dev环境不隐藏，在打包后隐藏。
-      hideOnBlur: app.isPackaged,
+      hideOnBlur: commonConst.production(),
     },
     local: {
       search: true,

src/core/db/index.ts

@@ -71,7 +71,6 @@ export default class {
       result._id = this.replaceDocId(name, result._id);
       return result;
     } catch (e) {
-      console.log(e);
       return null;
     }
   }

src/main/browsers/main.ts

@@ -53,7 +53,10 @@ export default () => {
 
     // 判断失焦是否隐藏
     win.on("blur", () => {
-      app.isPackaged && win.hide();
+      const config = { ...global.OP_CONFIG.get() };
+      if (config.perf.common.hideOnBlur) {
+        win.hide();
+      }
     });
   };
 

src/main/browsers/runner.ts

@@ -51,6 +51,7 @@ export default () => {
       view.webContents.openDevTools();
       executeHooks("PluginEnter", plugin.ext);
       executeHooks("PluginReady", plugin.ext);
+      window.webContents.executeJavaScript(`window.pluginLoaded()`);
     });
   };
 

src/renderer/App.vue

@@ -9,6 +9,7 @@
         @changeSelect="changeSelect"
         :searchValue="searchValue"
         :placeholder="placeholder"
+        :pluginLoading="pluginLoading"
         @choosePlugin="choosePlugin"
       />
     </div>
@@ -39,6 +40,7 @@ const {
   openPlugin,
   currentPlugin,
   placeholder,
+  pluginLoading,
 } = createPluginManager();
 
 initPlugins();

src/renderer/components/search.vue

@@ -18,11 +18,20 @@
       "
     >
       <template #suffix>
-        <div @click="() => emit('openMenu')" class="suffix-tool" >
+        <div class="suffix-tool" >
+          <MoreOutlined
+            @click="showSeparate()"
+            class="icon-more"
+          />
           <div v-if="currentPlugin && currentPlugin.logo" style="position: relative">
+            <a-spin v-show="pluginLoading" class="loading">
+              <template #indicator>
+                <LoadingOutlined style="font-size: 42px" />
+              </template>
+            </a-spin>
             <img class="icon-tool" :src="currentPlugin.logo" />
           </div>
-          <div v-else class="rubick-logo">
+          <div @click="() => emit('openMenu')" v-else class="rubick-logo">
             <img src="../assets/logo.png" />
           </div>
         </div>
@@ -33,7 +42,12 @@
 
 <script setup lang="ts">
 import { defineProps, defineEmits, ref } from "vue";
-import { ipcRenderer } from "electron";
+import { ipcRenderer, remote } from "electron";
+import { LoadingOutlined, MoreOutlined } from "@ant-design/icons-vue";
+const opConfig = remote.getGlobal("OP_CONFIG");
+const { Menu } = remote;
+
+const config = ref(opConfig.get());
 
 const props = defineProps({
   searchValue: {
@@ -45,6 +59,7 @@ const props = defineProps({
     default: "",
   },
   currentPlugin: {},
+  pluginLoading: Boolean,
 });
 
 const changeValue = (e) => {
@@ -83,6 +98,53 @@ const closeTag = () => {
     type: "removePlugin",
   });
 };
+
+const showSeparate = () => {
+  let pluginMenu = [
+    {
+      label: config.value.perf.common.hideOnBlur ? "钉住" : "自动隐藏",
+      click: changeHideOnBlur,
+    },
+  ];
+  if (props.currentPlugin && props.currentPlugin.logo) {
+    pluginMenu = pluginMenu.concat([
+      {
+        label: "开发者工具",
+        click: () => {
+          // todo
+        },
+      },
+      {
+        label: "当前插件信息",
+        submenu: [
+          {
+            label: "简介",
+          },
+          {
+            label: "功能",
+          },
+        ],
+      },
+      {
+        label: "分离窗口",
+        click: newWindow,
+      },
+    ]);
+  }
+  let menu = Menu.buildFromTemplate(pluginMenu);
+  menu.popup();
+};
+
+const changeHideOnBlur = () => {
+  let cfg = { ...config.value };
+  cfg.perf.common.hideOnBlur = !cfg.perf.common.hideOnBlur;
+  opConfig.set("perf", cfg.perf);
+  config.value = cfg;
+};
+
+const newWindow = () => {
+  // todo
+};
 </script>
 
 <style lang="less">
@@ -141,5 +203,20 @@ const closeTag = () => {
     border: none;
     box-shadow: none;
   }
+  .suffix-tool {
+    display: flex;
+    align-items: center;
+    .icon-more {
+      font-size: 26px;
+      font-weight: bold;
+      cursor: pointer;
+    }
+    .loading {
+      color: #ff4ea4;
+      position: absolute;
+      top: 0;
+      left: 0;
+    }
+  }
 }
 </style>

src/renderer/plugins-manager/index.ts

@@ -18,6 +18,7 @@ const createPluginManager = (): any => {
     plugins: [],
     localPlugins: [],
     currentPlugin: {},
+    pluginLoading: false,
   });
 
   const appList = ref([]);
@@ -28,6 +29,10 @@ const createPluginManager = (): any => {
 
   const openPlugin = (plugin) => {
     if (plugin.pluginType === "ui") {
+      if (state.currentPlugin && state.currentPlugin.name === plugin.name) {
+        return;
+      }
+      state.pluginLoading = true;
       state.currentPlugin = plugin;
       ipcRenderer.sendSync("msg-trigger", {
         type: "openPlugin",
@@ -84,7 +89,6 @@ const createPluginManager = (): any => {
   };
 
   window.setCurrentPlugin = ({ currentPlugin }) => {
-    console.log(currentPlugin);
     state.currentPlugin = currentPlugin;
     setSearchValue("");
   };
@@ -95,6 +99,10 @@ const createPluginManager = (): any => {
     window.setSubInput({ placeholder: "" });
   };
 
+  window.pluginLoaded = () => {
+    state.pluginLoading = false;
+  };
+
   return {
     ...toRefs(state),
     initPlugins,

src/renderer/shims-vue.d.ts

@@ -20,4 +20,5 @@ interface Window {
   updatePlugin: (plugin: any) => void;
   initRubick: () => void;
   setCurrentPlugin: (plugin: any) => void;
+  pluginLoaded: () => void;
 }