✨ 支持本地启动，修改mac 下获取 APP icon 的方式

2025-12-26 04:19:27 +08:00 · 2023-09-15 16:17:52 +08:00
parent 61b4e37fe0
commit c21c08c370
24 changed files with 493 additions and 124 deletions
--- a/src/renderer/App.vue
+++ b/src/renderer/App.vue
@@ -12,6 +12,7 @@
      :searchValue="searchValue"
      :placeholder="placeholder"
      :pluginLoading="pluginLoading"
+      :pluginHistory="pluginHistory"
      :clipboardFile="clipboardFile || []"
      @choosePlugin="choosePlugin"
      @focus="searchFocus"
@@ -20,6 +21,7 @@
      @readClipboardContent="readClipboardContent"
    />
    <Result
+      :pluginHistory="pluginHistory"
      :currentPlugin="currentPlugin"
      :searchValue="searchValue"
      :currentSelect="currentSelect"
@@ -37,7 +39,6 @@ import Search from './components/search.vue';
 import getWindowHeight from '../common/utils/getWindowHeight';
 import createPluginManager from './plugins-manager';
 import useDrag from '../common/utils/dragWindow';
-import commonConst from '@/common/utils/commonConst';

 const { onMouseDown } = useDrag();
 const remote = window.require('@electron/remote');
@@ -58,6 +59,7 @@ const {
  setSearchValue,
  clearClipboardFile,
  readClipboardContent,
+  pluginHistory,
 } = createPluginManager();

 initPlugins();
@@ -74,24 +76,37 @@ getPluginInfo({
  remote.getGlobal('LOCAL_PLUGINS').addPlugin(res);
 });

-watch([options], () => {
+watch([options, pluginHistory], () => {
  currentSelect.value = 0;
  if (currentPlugin.value.name) return;
  nextTick(() => {
    ipcRenderer.sendSync('msg-trigger', {
      type: 'setExpendHeight',
-      data: getWindowHeight(options.value),
+      data: getWindowHeight(options.value, pluginHistory.value),
    });
  });
 });

 const changeIndex = (index) => {
-  if (!options.value.length) return;
+  if (!options.value.length) {
+    if (!pluginHistory.value.length) return;
+    if (
+      currentSelect.value + index > pluginHistory.value.length - 1 ||
+      currentSelect.value + index < 0
+    ) {
+      currentSelect.value = 0;
+      return;
+    }
+    currentSelect.value = currentSelect.value + index;
+    return;
+  }
  if (
    currentSelect.value + index > options.value.length - 1 ||
    currentSelect.value + index < 0
-  )
+  ) {
+    currentSelect.value = 0;
    return;
+  }
  currentSelect.value = currentSelect.value + index;
 };

@@ -101,14 +116,20 @@ const openMenu = (ext) => {
    feature: menuPluginInfo.value.features[0],
    cmd: '插件市场',
    ext,
+    click: () => openMenu(ext),
  });
 };

 window.rubick.openMenu = openMenu;

 const choosePlugin = () => {
-  const currentChoose = options.value[currentSelect.value];
-  currentChoose.click();
+  if (options.value.length) {
+    const currentChoose = options.value[currentSelect.value];
+    currentChoose.click();
+  } else {
+    const currentChoose = pluginHistory.value[currentSelect.value];
+    currentChoose.click();
+  }
 };

 const clearSearchValue = () => {
--- a/src/renderer/assets/var.less
+++ b/src/renderer/assets/var.less
@@ -5,7 +5,7 @@
  // 背景色
  --color-body-bg: #fff;
  --color-menu-bg: #f3efef;
-  --color-list-hover: #e2e2e2;
+  --color-list-hover: #ebeee8;
  --color-input-hover: #fff;
  // 边框
  --color-border-light: #f0f0f0;
--- a/src/renderer/components/result.vue
+++ b/src/renderer/components/result.vue
@@ -1,14 +1,24 @@
 <template>
  <div
-    v-show="
-      !!options.length &&
-      (searchValue || !!clipboardFile.length) &&
-      !currentPlugin.name
-    "
+    v-show="!currentPlugin.name"
    class="options"
    ref="scrollDom"
  >
-    <a-list item-layout="horizontal" :dataSource="sort(options)">
+    <div class="history-plugins" v-if="!options.length || !(searchValue || !!clipboardFile.length)">
+      <a-row>
+        <a-col
+          @click="() => item.click()"
+          :class="currentSelect === index ? 'active history-item' : 'history-item'"
+          :span="3"
+          v-for="(item, index) in pluginHistory"
+          :key="index"
+        >
+          <a-avatar style="border-radius: 0" :src="item.icon" />
+          <div class="name ellpise">{{item.pluginName || item._name || item.name}}</div>
+        </a-col>
+      </a-row>
+    </div>
+    <a-list v-else item-layout="horizontal" :dataSource="sort(options)">
      <template #renderItem="{ item, index }">
        <a-list-item
          @click="() => item.click()"
@@ -52,6 +62,7 @@ const props = defineProps({
    default: 0,
  },
  currentPlugin: {},
+  pluginHistory: (() => [])(),
  clipboardFile: (() => [])(),
 });

@@ -91,15 +102,45 @@ const sort = (options) => {
 </script>

 <style lang="less">
+.ellpise {
+  overflow:hidden;
+  text-overflow:ellipsis;
+  display:-webkit-box;
+  -webkit-line-clamp:1;
+  -webkit-box-orient:vertical;
+}
+
 .options {
  position: absolute;
-  top: 62px;
+  top: 60px;
  left: 0;
  width: 100%;
  z-index: 99;
-  max-height: calc(~'100vh - 64px');
+  max-height: calc(~'100vh - 60px');
  overflow: auto;
  background: var(--color-body-bg);
+  .history-plugins {
+    width: 100%;
+    border-top: 1px dashed #ddd;
+    box-sizing: border-box;
+    .history-item {
+      box-sizing: border-box;
+      height: 79px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      flex-direction: column;
+      border-right: 1px dashed #ddd;
+      &.active {
+        background: var(--color-list-hover);
+      }
+    }
+    .name {
+      margin-top: 4px;
+      width: 100%;
+      text-align: center;
+    }
+  }
  .op-item {
    padding: 0 10px;
    height: 60px;
--- a/src/renderer/components/search.vue
+++ b/src/renderer/components/search.vue
@@ -19,6 +19,7 @@
      class="main-input"
      @input="e => changeValue(e)"
      @keydown.down="e => keydownEvent(e, 'down')"
+      @keydown.tab="e => keydownEvent(e, 'down')"
      @keydown.up="e => keydownEvent(e, 'up')"
      @keydown="e => checkNeedInit(e)"
      :value="searchValue"
@@ -71,6 +72,7 @@ const props: any = defineProps({
    type: String,
    default: '',
  },
+  pluginHistory: (() => [])(),
  currentPlugin: {},
  pluginLoading: Boolean,
  clipboardFile: (() => [])(),
@@ -107,7 +109,7 @@ const keydownEvent = (e, key: string) => {
      modifiers,
    },
  });
-  const runPluginDisable = e.target.value === '' || props.currentPlugin.name;
+  const runPluginDisable = ((e.target.value === '' && !props.pluginHistory.length) || props.currentPlugin.name) ;
  switch (key) {
    case 'up':
      emit('changeCurrent', -1);
--- a/src/renderer/main.ts
+++ b/src/renderer/main.ts
@@ -7,6 +7,8 @@ import {
  Avatar,
  Tag,
  ConfigProvider,
+  Row,
+  Col,
 } from 'ant-design-vue';
 import App from './App.vue';
 import localConfig from './confOp';
@@ -26,4 +28,6 @@ createApp(App)
  .use(Input)
  .use(Avatar)
  .use(Tag)
+  .use(Row)
+  .use(Col)
  .mount('#app');
--- a/src/renderer/plugins-manager/clipboardWatch.ts
+++ b/src/renderer/plugins-manager/clipboardWatch.ts
@@ -56,7 +56,7 @@ export default ({ currentPlugin, optionsRef, openPlugin, setOptionsRef }) => {
              regImg.test(ext) &&
              fileList.length === 1
            ) {
-              options.push({
+              const option = {
                name: cmd.label,
                value: 'plugin',
                icon: plugin.logo,
@@ -75,17 +75,19 @@ export default ({ currentPlugin, optionsRef, openPlugin, setOptionsRef }) => {
                        .toDataURL(),
                    },
                    openPlugin,
+                    option,
                  });
                  clearClipboardFile();
                },
-              });
+              };
+              options.push(option);
            }
            // 如果是文件，且符合文件正则类型
            if (
              fileList.length > 1 ||
              (cmd.type === 'file' && new RegExp(cmd.match).test(ext))
            ) {
-              options.push({
+              const option = {
                name: cmd,
                value: 'plugin',
                icon: plugin.logo,
@@ -96,6 +98,7 @@ export default ({ currentPlugin, optionsRef, openPlugin, setOptionsRef }) => {
                    plugin,
                    fe,
                    cmd,
+                    option,
                    ext: {
                      code: fe.code,
                      type: cmd.type || 'text',
@@ -105,7 +108,8 @@ export default ({ currentPlugin, optionsRef, openPlugin, setOptionsRef }) => {
                  });
                  clearClipboardFile();
                },
-              });
+              };
+              options.push(option);
            }
          });
        });
@@ -155,7 +159,7 @@ export default ({ currentPlugin, optionsRef, openPlugin, setOptionsRef }) => {
      feature.forEach((fe) => {
        fe.cmds.forEach((cmd) => {
          if (cmd.type === 'img') {
-            options.push({
+            const option = {
              name: cmd.label,
              value: 'plugin',
              icon: plugin.logo,
@@ -172,10 +176,12 @@ export default ({ currentPlugin, optionsRef, openPlugin, setOptionsRef }) => {
                    payload: dataUrl,
                  },
                  openPlugin,
+                  option,
                });
                clearClipboardFile();
              },
-            });
+            };
+            options.push(option);
          }
        });
      });
--- a/src/renderer/plugins-manager/index.ts
+++ b/src/renderer/plugins-manager/index.ts
@@ -21,12 +21,35 @@ const createPluginManager = (): any => {
    localPlugins: [],
    currentPlugin: {},
    pluginLoading: false,
+    pluginHistory: [],
  });

-  const appList = ref([]);
+  const appList: any = ref([]);

  const initPlugins = async () => {
    appList.value = await appSearch(nativeImage);
+    initLocalStartPlugin();
+  };
+
+  const initLocalStartPlugin = () => {
+    const result = ipcRenderer.sendSync('msg-trigger', {
+      type: 'dbGet',
+      data: {
+        id: 'rubick-local-start-app',
+      },
+    });
+    if (result && result.value) {
+      appList.value = [...appList.value, ...result.value];
+    }
+  };
+
+  window.removeLocalStartPlugin = ({ plugin }) => {
+    appList.value = appList.value.filter((app) => app.desc !== plugin.desc);
+  };
+
+  window.addLocalStartPlugin = ({ plugin }) => {
+    window.removeLocalStartPlugin({ plugin });
+    appList.value.push(plugin);
  };

  const loadPlugin = async (plugin) => {
@@ -43,7 +66,7 @@ const createPluginManager = (): any => {
    state.pluginLoading = false;
  };

-  const openPlugin = async (plugin) => {
+  const openPlugin = async (plugin, option) => {
    if (plugin.pluginType === 'ui' || plugin.pluginType === 'system') {
      if (state.currentPlugin && state.currentPlugin.name === plugin.name) {
        return;
@@ -66,6 +89,23 @@ const createPluginManager = (): any => {
    if (plugin.pluginType === 'app') {
      execSync(plugin.action);
    }
+    window.initRubick();
+    changePluginHistory({
+      ...plugin,
+      ...option,
+    });
+  };
+
+  const changePluginHistory = (plugin) => {
+    if (state.pluginHistory.length >= 8) {
+      state.pluginHistory.pop();
+    }
+    state.pluginHistory.forEach((p, index) => {
+      if (p.name === plugin.name) {
+        state.pluginHistory.splice(index, 1);
+      }
+    });
+    state.pluginHistory.unshift(plugin);
  };

  const { searchValue, onSearch, setSearchValue, placeholder } =
--- a/src/renderer/plugins-manager/options.ts
+++ b/src/renderer/plugins-manager/options.ts
@@ -52,29 +52,33 @@ const optionsManager = ({
        const cmds = searchKeyValues(fe.cmds, value, strict);
        options = [
          ...options,
-          ...cmds.map((cmd) => ({
-            name: cmd.label || cmd,
-            value: 'plugin',
-            icon: plugin.logo,
-            desc: fe.explain,
-            type: plugin.pluginType,
-            zIndex: cmd.label ? 0 : 1, // 排序权重
-            click: () => {
-              pluginClickEvent({
-                plugin,
-                fe,
-                cmd,
-                ext: cmd.type
-                  ? {
-                      code: fe.code,
-                      type: cmd.type || 'text',
-                      payload: searchValue.value,
-                    }
-                  : null,
-                openPlugin,
-              });
-            },
-          })),
+          ...cmds.map((cmd) => {
+            const option = {
+              name: cmd.label || cmd,
+              value: 'plugin',
+              icon: plugin.logo,
+              desc: fe.explain,
+              type: plugin.pluginType,
+              zIndex: cmd.label ? 0 : 1, // 排序权重
+              click: () => {
+                pluginClickEvent({
+                  plugin,
+                  fe,
+                  cmd,
+                  ext: cmd.type
+                    ? {
+                        code: fe.code,
+                        type: cmd.type || 'text',
+                        payload: searchValue.value,
+                      }
+                    : null,
+                  openPlugin,
+                  option,
+                });
+              },
+            };
+            return option;
+          }),
        ];
      });
    });
@@ -106,13 +110,14 @@ const optionsManager = ({
          }
        })
        .map((plugin) => {
-          return {
+          const option = {
            ...plugin,
            zIndex: 1,
            click: () => {
-              openPlugin(plugin);
+              openPlugin(plugin, option);
            },
          };
+          return option;
        }),
    ];
    return options;
--- a/src/renderer/plugins-manager/pluginClickEvent.ts
+++ b/src/renderer/plugins-manager/pluginClickEvent.ts
@@ -3,7 +3,14 @@ import path from 'path';
 import { toRaw } from 'vue';
 import commonConst from '@/common/utils/commonConst';

-export default function pluginClickEvent({ plugin, fe, cmd, ext, openPlugin }) {
+export default function pluginClickEvent({
+  plugin,
+  fe,
+  cmd,
+  ext,
+  openPlugin,
+  option,
+}) {
  const pluginPath = path.resolve(baseDir, 'node_modules', plugin.name);
  const pluginDist = {
    ...toRaw(plugin),
@@ -24,5 +31,5 @@ export default function pluginClickEvent({ plugin, fe, cmd, ext, openPlugin }) {
      ? 'http://localhost:8081/#/'
      : `file://${__static}/feature/index.html`;
  }
-  openPlugin(pluginDist);
+  openPlugin(pluginDist, option);
 }
--- a/src/renderer/shims-vue.d.ts
+++ b/src/renderer/shims-vue.d.ts
@@ -21,6 +21,8 @@ interface Window {
  loadPlugin: (plugin: any) => void;
  updatePlugin: (plugin: any) => void;
  initRubick: () => void;
+  addLocalStartPlugin: (plugin: any) => void;
+  removeLocalStartPlugin: (plugin: any) => void;
  setCurrentPlugin: (plugin: any) => void;
  pluginLoaded: () => void;
  getMainInputInfo: () => any;