🚨 增加 prettier

feature/src/views/installed/index.vue

@@ -15,7 +15,7 @@
           @click="currentSelect = [index]"
           v-for="(plugin, index) in localPlugins"
         >
-          <img :src="plugin.logo" />
+          <img :src="plugin.logo"/>
           <div class="info">
             <div class="title">
               {{ plugin.pluginName }}
@@ -63,18 +63,25 @@
                 <a-tag
                   :key="cmd"
                   v-for="cmd in item.cmds"
-                  @close="removeFeature(cmd)"
-                  @click="
-                    !cmd.label &&
-                      openPlugin({
-                        code: item.code,
-                        cmd
-                      })
-                  "
                   :class="{ executable: !cmd.label }"
                   :color="!cmd.label && '#87d068'"
                 >
-                  {{ cmd.label || cmd }}
+                  <span @click="!cmd.label &&
+                    openPlugin({
+                      code: item.code,
+                      cmd
+                    })"
+                  >
+                    {{ cmd.label || cmd }}
+                  </span>
+                  <template v-if="!cmd.label" #icon>
+                    <a-tooltip v-if="!hasAdded(cmd)" placement="topLeft" title="点击+号，固定关键词到超级面板">
+                      <PlusCircleOutlined @click="addCmdToSuperPanel({code: item.code, cmd})" />
+                    </a-tooltip>
+                    <a-tooltip v-else placement="topLeft" title="点击-号，从超级面板移除关键词">
+                      <MinusCircleOutlined @click="removePluginToSuperPanel(cmd)" />
+                    </a-tooltip>
+                  </template>
                 </a-tag>
               </div>
             </div>
@@ -89,13 +96,15 @@
 </template>
 
 <script setup>
-import { useStore } from "vuex";
-import { computed, ref } from "vue";
+import {useStore} from "vuex";
+import {computed, ref, toRaw} from "vue";
 import path from "path";
 import MarkdownIt from "markdown-it";
-const { ipcRenderer } = window.require("electron");
+import {PlusCircleOutlined, MinusCircleOutlined} from "@ant-design/icons-vue";
 
-const { remote } = window.require("electron");
+const {ipcRenderer} = window.require("electron");
+
+const {remote} = window.require("electron");
 const fs = window.require("fs");
 const md = new MarkdownIt();
 
@@ -117,8 +126,46 @@ const pluginDetail = computed(() => {
   return localPlugins.value[currentSelect.value] || {};
 });
 
-const openPlugin = ({ cmd, code }) => {
-  console.log(pluginDetail.value);
+const superPanelPlugins = ref(window.rubick.db.get("super-panel-plugins") || {
+  data: [],
+  _id: "super-panel-plugins",
+});
+console.log(toRaw(superPanelPlugins.value.data))
+const addCmdToSuperPanel = ({cmd, code}) => {
+  const plugin = {
+    ...toRaw(pluginDetail.value),
+    cmd,
+    ext: {
+      code,
+      type: "text",
+      payload: null,
+    },
+  };
+  superPanelPlugins.value.data.push(plugin);
+  window.rubick.db.put(toRaw(superPanelPlugins.value));
+};
+
+const removePluginToSuperPanel = (cmd) => {
+  superPanelPlugins.value.data = toRaw(superPanelPlugins.value).data.filter((item) => {
+    return item.cmd !== cmd;
+  });
+  console.log(toRaw(superPanelPlugins.value) )
+  window.rubick.db.put(toRaw(superPanelPlugins.value));
+};
+
+const hasAdded = (cmd) => {
+  let added = false;
+  superPanelPlugins.value.data.some((item) => {
+    if (item.cmd === cmd) {
+      added = true;
+      return true;
+    }
+    return false;
+  });
+  return added;
+};
+
+const openPlugin = ({cmd, code}) => {
   window.rubick.openPlugin(
     JSON.parse(
       JSON.stringify({
@@ -163,6 +210,7 @@ const deletePlugin = async plugin => {
   overflow: hidden;
   background: #f3efef;
   height: calc(~"100vh - 46px");
+  
   .container {
     box-sizing: border-box;
     width: 100%;
@@ -171,6 +219,7 @@ const deletePlugin = async plugin => {
     height: 100%;
     display: flex;
   }
+  
   .installed-list {
     width: 40%;
     background: #fff;
@@ -178,68 +227,84 @@ const deletePlugin = async plugin => {
     padding: 10px 0;
     border-right: 1px solid #eee;
     overflow: auto;
+    
     .item {
       padding: 10px 20px;
       display: flex;
       align-items: center;
+      
       img {
         width: 40px;
         height: 40px;
         margin-right: 20px;
       }
+      
       .desc {
         color: #999;
       }
+      
       &.active {
         background: #eee;
       }
     }
   }
+  
   .plugin-detail {
     padding: 20px 20px 0 20px;
     box-sizing: border-box;
     width: 60%;
     height: 100%;
     background: #fff;
+    
     .plugin-top {
       display: flex;
       align-items: flex-start;
       justify-content: space-between;
+      
       .title {
         font-size: 20px;
         display: flex;
         align-items: center;
       }
+      
       .desc {
         font-size: 13px;
         color: #999;
       }
     }
+    
     .detail-container,
     .feature-container {
       height: 380px;
       overflow: auto;
+      
       img {
         width: 100%;
       }
     }
+    
     .desc-item {
       border-bottom: 1px solid #ddd;
       padding: 10px 0;
+      
       .ant-tag {
         margin-top: 6px;
+        
         &.executable {
           cursor: pointer;
+          
           &:hover {
-           transform: translateY(-2px);
+            transform: translateY(-2px);
           }
         }
       }
+      
       .desc-title {
         display: flex;
         align-items: center;
         justify-content: space-between;
       }
+      
       .desc-info {
         color: #999;
       }