修复popup的样式

apps/background/background.js

@@ -242,12 +242,37 @@ let BgPageInstance = (function () {
      * @param callback
      */
     let browserActionClickedHandler = function (request, sender, callback) {
-        chrome.DynamicToolRunner({
-            tool: MSG_TYPE.JSON_FORMAT
+        // 获取当前唯一安装的工具并直接打开
+        Awesome.getInstalledTools().then(tools => {
+            const installedTools = Object.keys(tools).filter(tool => tools[tool].installed);
+            if (installedTools.length === 1) {
+                const singleTool = installedTools[0];
+                chrome.DynamicToolRunner({
+                    tool: singleTool,
+                    noPage: !!tools[singleTool].noPage
+                });
+                
+                // 记录工具使用
+                Statistics.recordToolUsage(singleTool);
+            } else {
+                // 备用方案：如果检测失败，打开JSON格式化工具
+                chrome.DynamicToolRunner({
+                    tool: MSG_TYPE.JSON_FORMAT
+                });
+                
+                // 记录工具使用
+                Statistics.recordToolUsage(MSG_TYPE.JSON_FORMAT);
+            }
+        }).catch(error => {
+            console.error('获取工具列表失败，使用默认工具:', error);
+            // 出错时的备用方案
+            chrome.DynamicToolRunner({
+                tool: MSG_TYPE.JSON_FORMAT
+            });
+            
+            // 记录工具使用
+            Statistics.recordToolUsage(MSG_TYPE.JSON_FORMAT);
         });
-        
-        // 记录工具使用
-        Statistics.recordToolUsage(MSG_TYPE.JSON_FORMAT);
     };
 
     /**
@@ -259,20 +284,41 @@ let BgPageInstance = (function () {
      */
     let _updateBrowserAction = function (action, showTips, menuOnly) {
         if (!menuOnly) {
-            // 如果有安装过工具，则显示Popup模式
-            Awesome.getInstalledTools().then(tools => {
-                if (Object.keys(tools).length > 1) {
+            // 对于卸载操作，添加一个小延迟确保存储操作完成
+            const delay = action === 'offload' ? 100 : 0;
+            
+            setTimeout(() => {
+                // 如果有安装过工具，则显示Popup模式
+                Awesome.getInstalledTools().then(tools => {
+                // 计算已安装的工具数量
+                const installedTools = Object.keys(tools).filter(tool => tools[tool].installed);
+                const installedCount = installedTools.length;
+                
+                if (installedCount > 1) {
+                    // 多个工具：显示popup
                     chrome.action.setPopup({ popup: '/popup/index.html' });
-                } else {
-                    // 删除popup page
+                    // 移除点击监听器（如果存在）
+                    if (chrome.action.onClicked.hasListener(browserActionClickedHandler)) {
+                        chrome.action.onClicked.removeListener(browserActionClickedHandler);
+                    }
+                } else if (installedCount === 1) {
+                    // 只有一个工具：直接打开工具，不显示popup
                     chrome.action.setPopup({ popup: '' });
-
-                    // 否则点击图标，直接打开页面
+                    
+                    // 添加点击监听器
                     if (!chrome.action.onClicked.hasListener(browserActionClickedHandler)) {
                         chrome.action.onClicked.addListener(browserActionClickedHandler);
                     }
+                } else {
+                    // 没有安装任何工具：显示popup（让用户去安装工具）
+                    chrome.action.setPopup({ popup: '/popup/index.html' });
+                    // 移除点击监听器（如果存在）
+                    if (chrome.action.onClicked.hasListener(browserActionClickedHandler)) {
+                        chrome.action.onClicked.removeListener(browserActionClickedHandler);
+                    }
                 }
-            });
+                });
+            }, delay);
 
             if (action === 'offload') {
                 _animateTips('-1');

apps/en-decode/endecode-lib.js

@@ -172,6 +172,18 @@ let EncodeUtils = (() => {
      * @return {String} 源码
      */
     let _base64Decode = function (str) {
+        // 首先进行URL解码处理，将%XX格式的字符转换回原始字符
+        try {
+            // 使用decodeURIComponent进行URL解码
+            str = decodeURIComponent(str);
+        } catch (e) {
+            // 如果decodeURIComponent失败，尝试手动替换常见的URL编码字符
+            str = str.replace(/%2B/g, '+')
+                    .replace(/%2F/g, '/')
+                    .replace(/%3D/g, '=')
+                    .replace(/%20/g, ' ');
+        }
+        
         let c1, c2, c3, c4;
         let i, len, out;
         len = str.length;

apps/options/index.js

@@ -790,6 +790,10 @@ new Vue({
                     message: `确定要卸载"${this.originalTools[toolKey].name}"工具吗？`,
                     callback: async (key) => {
                         try {
+                            // 先调用Awesome.offLoad卸载工具（确保存储数据先被删除）
+                            await Awesome.offLoad(key);
+                            
+                            // 再发送消息给background更新browser action
                             await chrome.runtime.sendMessage({
                                 type: MSG_TYPE.DYNAMIC_TOOL_INSTALL_OR_OFFLOAD,
                                 toolName: key,
@@ -797,9 +801,6 @@ new Vue({
                                 showTips: true
                             });
                             
-                            // 调用Awesome.offLoad卸载工具
-                            await Awesome.offLoad(key);
-                            
                             // 更新原始数据和当前活动数据
                             this.originalTools[key].installed = false;
                             this.originalTools[key].inContextMenu = false;

apps/popup/index.css

@@ -1,13 +1,11 @@
 html, body {
-    height: 100%;
     margin: 0;
     padding: 0;
 }
 
 .fe-whole-page {
     width: 152px;
-    min-height: 120px; /* 设置最小高度，确保工具很少时不会过于矮小 */
-    max-height: 600px; /* 设置最大高度，避免工具太多时popup过高 */
+    min-height: 140px;
     font-size: 14px;
     user-select: none;
     padding: 0;
@@ -15,8 +13,8 @@ html, body {
     position: relative;
     display: flex;
     flex-direction: column;
-    overflow: hidden; /* 确保内容不会溢出 */
-    transition: min-height 0.2s ease-out; /* 添加平滑过渡效果 */
+    overflow: hidden;
+    transition: min-height 0.2s ease-out;
 }
 
 .fe-hide {
@@ -32,6 +30,7 @@ html, body {
     background: linear-gradient(to right, #f8f9ff, #f0f2ff);
     font-size: 12px;
     letter-spacing: 0.5px;
+    flex-shrink: 0; /* 防止被压缩 */
 }
 
 .fe-function-title span {
@@ -45,10 +44,43 @@ ul.fe-function-list {
     list-style: none;
     width: 100%;
     margin: 0;
-    flex: 1; /* 自动占用剩余空间 */
-    min-height: 40px; /* 确保即使没有工具时也有基本高度 */
-    overflow-y: auto; /* 当工具太多时允许滚动 */
-    max-height: 500px; /* 设置最大高度 */
+    flex: 1;
+    min-height: 40px;
+    overflow-y: auto; /* 允许垂直滚动 */
+    overflow-x: hidden; /* 隐藏水平滚动 */
+    max-height: 500px; /* 不再限制最大高度 */
+    display: flex;
+    flex-direction: column-reverse;
+    scrollbar-width: thin; /* Firefox 下的滚动条样式 */
+    scrollbar-color: rgba(67, 97, 238, 0.3) transparent;
+}
+
+/* 自定义滚动条样式 - Webkit内核浏览器 */
+ul.fe-function-list::-webkit-scrollbar {
+    width: 6px;
+}
+
+ul.fe-function-list::-webkit-scrollbar-track {
+    background: transparent;
+}
+
+ul.fe-function-list::-webkit-scrollbar-thumb {
+    background: rgba(67, 97, 238, 0.3);
+    border-radius: 3px;
+    transition: background 0.2s ease;
+}
+
+ul.fe-function-list::-webkit-scrollbar-thumb:hover {
+    background: rgba(67, 97, 238, 0.5);
+}
+
+/* 暗黑模式下的滚动条 */
+html[dark-mode="on"] ul.fe-function-list::-webkit-scrollbar-thumb {
+    background: rgba(255, 255, 255, 0.3);
+}
+
+html[dark-mode="on"] ul.fe-function-list::-webkit-scrollbar-thumb:hover {
+    background: rgba(255, 255, 255, 0.5);
 }
 
 ul.fe-function-list li {
@@ -58,13 +90,14 @@ ul.fe-function-list li {
     transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1), height 0.2s ease-out, margin 0.2s ease-out;
     display: block;
     align-items: center;
-    height: 28px;
+    height: 28px; /* 默认高度 */
     border-radius: 6px;
     margin: 2px 0;
     border-bottom: 1px solid rgba(67, 97, 238, 0.05);
     text-align: justify;
     position: relative;
     line-height: 28px;
+    flex-shrink: 0; /* 防止被压缩 */
 }
 
 ul.fe-function-list li:last-child {
@@ -128,11 +161,14 @@ ul.fe-function-list li i {
     font-size: 13px;
     border-top: 1px solid rgba(67, 97, 238, 0.08);
     padding: 8px 16px;
-    margin-top: auto; /* 自动推到底部 */
     background: linear-gradient(to right, rgba(67, 97, 238, 0.05), rgba(67, 97, 238, 0.05));
     color: var(--text-color);
     opacity: 0.9;
     flex-shrink: 0; /* 防止被压缩 */
+    position: relative; /* 改为相对定位 */
+    width: 100%;
+    box-sizing: border-box;
+    margin-top: auto; /* 确保在容器底部 */
 }
 
 .fe-feedback a {
@@ -191,7 +227,7 @@ svg:not(:root) {
     justify-content: center;
     padding: 20px;
     min-height: 60px;
-    flex: 1; /* 占用剩余空间 */
+    flex: 1;
 }
 
 .loading-spinner {
@@ -219,7 +255,7 @@ svg:not(:root) {
 .fe-no-tools {
     padding: 20px;
     text-align: center;
-    flex: 1; /* 占用剩余空间 */
+    flex: 1;
     display: flex;
     align-items: center;
     justify-content: center;
@@ -258,48 +294,21 @@ html[dark-mode="on"] .loading-spinner {
     border-left-color: #4361ee;
 }
 
-/* 工具数量少时的优化样式 */
-.fe-whole-page.few-tools {
-    min-height: 140px; /* 当工具数量少于等于3个时，增加最小高度 */
-}
-
-.fe-whole-page.very-few-tools {
-    min-height: 110px; /* 当只有1个工具时，适度减少高度 */
-}
 
-/* 当工具列表为空时，确保有合适的间距 */
+/* 工具列表为空时的基本样式 */
 .fe-function-list:empty {
     min-height: 20px;
 }
 
-/* 优化工具数量少时的间距 */
+/* 1个工具时的优化 */
 .fe-function-list li:only-child {
-    margin: 4px 0; /* 只有一个工具时增加上下间距 */
-}
-
-.fe-function-list li:first-child:nth-last-child(2),
-.fe-function-list li:first-child:nth-last-child(2) ~ li {
-    margin: 3px 0; /* 只有两个工具时的间距 */
-}
-
-.fe-function-list li:first-child:nth-last-child(3),
-.fe-function-list li:first-child:nth-last-child(3) ~ li {
-    margin: 2px 0; /* 只有三个工具时的间距 */
-}
-
-/* 工具数量少时的类样式 */
-.fe-function-list.few-tools {
-    padding: 4px 0; /* 增加上下内边距 */
-}
-
-.fe-function-list.few-tools li {
-    height: 32px; /* 稍微增加高度 */
+    margin: 4px 0;
+    height: 32px;
     line-height: 32px;
-    margin: 3px 0; /* 增加间距 */
 }
 
-.fe-function-list.few-tools li > b {
-    top: 6px; /* 调整图标位置 */
+.fe-function-list li:only-child > b {
+    top: 6px;
 }
 
 /* 当只有极少工具时的特殊优化 */
@@ -313,11 +322,6 @@ html[dark-mode="on"] .loading-spinner {
     margin: 4px 0;
 }
 
-.very-few-tools .fe-function-list li > b {
-    top: 7px;
-}
-
-/* 注释：.fe-feedback的margin-top: auto样式已在主样式定义中设置 */
 
 /* 当没有工具时，优化无工具提示的显示 */
 .fe-no-tools .no-tools-message {
@@ -327,4 +331,7 @@ html[dark-mode="on"] .loading-spinner {
 /* 优化加载状态的显示 */
 .fe-loading {
     justify-content: center;
+    align-items: center;
+    display: flex;
+    height: 120px;
 }