修复图表配色，筛选中文条件筛选错误

2025-05-09 17:28:09 +08:00 · 2025-05-09 17:28:09 +08:00 · fc7653011b
commit fc7653011b
parent 55a928b545
10 changed files with 70 additions and 122 deletions
--- a/astro.config.mjs
+++ b/astro.config.mjs
@ -4,7 +4,6 @@ import { defineConfig } from "astro/config";
 import tailwindcss from "@tailwindcss/vite";
 import mdx from "@astrojs/mdx";
 import react from "@astrojs/react";
-import remarkEmoji from "remark-emoji";
 import rehypeExternalLinks from "rehype-external-links";
 import sitemap from "@astrojs/sitemap";
 import fs from "node:fs";
--- a/package-lock.json
+++ b/package-lock.json
@ -18,6 +18,7 @@
        "@expressive-code/plugin-line-numbers": "^0.41.2",
        "@mermaid-js/mermaid-cli": "^11.4.2",
        "@swup/astro": "^1.6.0",
+        "@swup/fragment-plugin": "^1.1.1",
        "@tailwindcss/vite": "^4.1.4",
        "@types/react": "^19.1.2",
        "@types/react-dom": "^19.1.2",
@ -32,14 +33,14 @@
        "react": "^19.1.0",
        "react-dom": "^19.1.0",
        "react-masonry-css": "^1.0.16",
+        "swup": "^4.8.2",
        "tailwindcss": "^4.1.4",
        "three": "^0.176.0"
      },
      "devDependencies": {
        "@tailwindcss/typography": "^0.5.16",
        "astro-compressor": "^1.0.0",
-        "rehype-external-links": "^3.0.0",
-        "remark-emoji": "^5.0.1"
+        "rehype-external-links": "^3.0.0"
      }
    },
    "node_modules/@alloc/quick-lru": {
@ -4023,19 +4024,6 @@
      "integrity": "sha512-83yeghZ2xxin3Nj8z1NMd/NCuca+gsYXswywDy5bHvwlWL8tpTQmzGeUuHd9FC3E/SBEMvzJRwWEOz5gGes9Qg==",
      "license": "MIT"
    },
-    "node_modules/@sindresorhus/is": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmmirror.com/@sindresorhus/is/-/is-4.6.0.tgz",
-      "integrity": "sha512-t09vSN3MdfsyCHoFcTRCH/iUtG7OJ0CsjzB8cjAmKc/va/kIgeDI/TxsigdncE/4be734m0cvIYwNaV4i2XqAw==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/sindresorhus/is?sponsor=1"
-      }
-    },
    "node_modules/@surma/rollup-plugin-off-main-thread": {
      "version": "2.2.3",
      "resolved": "https://registry.npmmirror.com/@surma/rollup-plugin-off-main-thread/-/rollup-plugin-off-main-thread-2.2.3.tgz",
@ -4157,6 +4145,18 @@
        "swup": "^4.6.0"
      }
    },
+    "node_modules/@swup/fragment-plugin": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmmirror.com/@swup/fragment-plugin/-/fragment-plugin-1.1.1.tgz",
+      "integrity": "sha512-VDDk/4uKgYhRzX/Xo0SwKGVs8smIiy3HWQXqVMOlq9010ckRT6v1fhwhfbziE2QCMnD59S65CGjWzzMHVXbMLA==",
+      "license": "MIT",
+      "dependencies": {
+        "@swup/plugin": "^4.0.0"
+      },
+      "peerDependencies": {
+        "swup": "^4.6.0"
+      }
+    },
    "node_modules/@swup/head-plugin": {
      "version": "2.3.1",
      "resolved": "https://registry.npmmirror.com/@swup/head-plugin/-/head-plugin-2.3.1.tgz",
@ -6620,16 +6620,6 @@
        "url": "https://github.com/chalk/chalk?sponsor=1"
      }
    },
-    "node_modules/char-regex": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmmirror.com/char-regex/-/char-regex-1.0.2.tgz",
-      "integrity": "sha512-kWWXztvZ5SBQV+eRgKFeh8q5sLuZY2+8WUIzlxWVTg+oGwY14qylx1KbKzHd8P6ZYkAg0xyIDU9JMHhyJMZ1jw==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=10"
-      }
-    },
    "node_modules/character-entities": {
      "version": "2.0.2",
      "resolved": "https://registry.npmmirror.com/character-entities/-/character-entities-2.0.2.tgz",
@ -8322,24 +8312,6 @@
      "integrity": "sha512-EC+0oUMY1Rqm4O6LLrgjtYDvcVYTy7chDnM4Q7030tP4Kwj3u/pR6gP9ygnp2CJMK5Gq+9Q2oqmrFJAz01DXjw==",
      "license": "MIT"
    },
-    "node_modules/emojilib": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmmirror.com/emojilib/-/emojilib-2.4.0.tgz",
-      "integrity": "sha512-5U0rVMU5Y2n2+ykNLQqMoqklN9ICBT/KsvC1Gz6vqHbz2AXXGkG+Pm5rMWk/8Vjrr/mY9985Hi8DYzn1F09Nyw==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/emoticon": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmmirror.com/emoticon/-/emoticon-4.1.0.tgz",
-      "integrity": "sha512-VWZfnxqwNcc51hIy/sbOdEem6D+cVtpPzEEtVAFdaas30+1dgkyaOQ4sQ6Bp0tOMqWO1v+HQfYaoodOkdhK6SQ==",
-      "dev": true,
-      "license": "MIT",
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/wooorm"
-      }
-    },
    "node_modules/encodeurl": {
      "version": "2.0.0",
      "resolved": "https://registry.npmmirror.com/encodeurl/-/encodeurl-2.0.0.tgz",
@ -13189,22 +13161,6 @@
        "node": ">=10.5.0"
      }
    },
-    "node_modules/node-emoji": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmmirror.com/node-emoji/-/node-emoji-2.2.0.tgz",
-      "integrity": "sha512-Z3lTE9pLaJF47NyMhd4ww1yFTAP8YhYI8SleJiHzM46Fgpm5cnNzSl9XfzFNqbaz+VlJrIj3fXQ4DeN1Rjm6cw==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@sindresorhus/is": "^4.6.0",
-        "char-regex": "^1.0.2",
-        "emojilib": "^2.4.0",
-        "skin-tone": "^2.0.0"
-      },
-      "engines": {
-        "node": ">=18"
-      }
-    },
    "node_modules/node-fetch": {
      "version": "3.3.2",
      "resolved": "https://registry.npmmirror.com/node-fetch/-/node-fetch-3.3.2.tgz",
@ -15369,23 +15325,6 @@
        "url": "https://opencollective.com/unified"
      }
    },
-    "node_modules/remark-emoji": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmmirror.com/remark-emoji/-/remark-emoji-5.0.1.tgz",
-      "integrity": "sha512-QCqTSvcZ65Ym+P+VyBKd4JfJfh7icMl7cIOGVmPMzWkDtdD8pQ0nQG7yxGolVIiMzSx90EZ7SwNiVpYpfTxn7w==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@types/mdast": "^4.0.4",
-        "emoticon": "^4.0.1",
-        "mdast-util-find-and-replace": "^3.0.1",
-        "node-emoji": "^2.1.3",
-        "unified": "^11.0.4"
-      },
-      "engines": {
-        "node": ">=18"
-      }
-    },
    "node_modules/remark-gfm": {
      "version": "4.0.1",
      "resolved": "https://registry.npmmirror.com/remark-gfm/-/remark-gfm-4.0.1.tgz",
@ -16444,19 +16383,6 @@
      "integrity": "sha512-w+tIMs3rq2afQdsPJlODhoUEKzFP1ayaoyl1CcnwtIlsVe7K7bA1NGm4s3PraqTLlXnbIN84zuBlxBWo1u9BLw==",
      "license": "MIT"
    },
-    "node_modules/skin-tone": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmmirror.com/skin-tone/-/skin-tone-2.0.0.tgz",
-      "integrity": "sha512-kUMbT1oBJCpgrnKoSr0o6wPtvRWT9W9UKvGLwfJYO2WuahZRHOpEyL1ckyMGgMWh0UdpmaoFqKKD29WTomNEGA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "unicode-emoji-modifier-base": "^1.0.0"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
    "node_modules/slash": {
      "version": "3.0.0",
      "resolved": "https://registry.npmmirror.com/slash/-/slash-3.0.0.tgz",
@ -17577,16 +17503,6 @@
        "node": ">=4"
      }
    },
-    "node_modules/unicode-emoji-modifier-base": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmmirror.com/unicode-emoji-modifier-base/-/unicode-emoji-modifier-base-1.0.0.tgz",
-      "integrity": "sha512-yLSH4py7oFH3oG/9K+XWrz1pSi3dfUrWEnInbxMfArOfc1+33BlGPQtLsOYwvdMy11AwUBetYuaRxSPqgkq+8g==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=4"
-      }
-    },
    "node_modules/unicode-match-property-ecmascript": {
      "version": "2.0.0",
      "resolved": "https://registry.npmmirror.com/unicode-match-property-ecmascript/-/unicode-match-property-ecmascript-2.0.0.tgz",
--- a/package.json
+++ b/package.json
@ -19,6 +19,7 @@
    "@expressive-code/plugin-line-numbers": "^0.41.2",
    "@mermaid-js/mermaid-cli": "^11.4.2",
    "@swup/astro": "^1.6.0",
+    "@swup/fragment-plugin": "^1.1.1",
    "@tailwindcss/vite": "^4.1.4",
    "@types/react": "^19.1.2",
    "@types/react-dom": "^19.1.2",
@ -33,13 +34,13 @@
    "react": "^19.1.0",
    "react-dom": "^19.1.0",
    "react-masonry-css": "^1.0.16",
+    "swup": "^4.8.2",
    "tailwindcss": "^4.1.4",
    "three": "^0.176.0"
  },
  "devDependencies": {
    "@tailwindcss/typography": "^0.5.16",
    "astro-compressor": "^1.0.0",
-    "rehype-external-links": "^3.0.0",
-    "remark-emoji": "^5.0.1"
+    "rehype-external-links": "^3.0.0"
  }
 }
--- a/src/components/ArticleFilter.tsx
+++ b/src/components/ArticleFilter.tsx
@ -615,7 +615,7 @@ const ArticleFilter: React.FC<ArticleFilterProps> = ({ searchParams = {} }) => {
    
    try {
      // 解析 Base64 编码的 JSON 参数
-      const jsonStr = atob(returnFilter);
+      const jsonStr = decodeURIComponent(atob(returnFilter));
      const paramsObj = JSON.parse(jsonStr);
      
      // 从解析后的对象中提取筛选条件
@ -1844,7 +1844,9 @@ const ArticleFilter: React.FC<ArticleFilterProps> = ({ searchParams = {} }) => {
    const connector = hasQueryParams ? '&' : '?';
    
    // 附加处理后的查询参数，使用 Base64 编码
-    const base64Params = btoa(paramsJson);
+    // 修改: 先使用 encodeURIComponent 处理 JSON 字符串，再使用 btoa 进行 Base64 编码
+    // 这样可以处理中文等非ASCII字符
+    const base64Params = btoa(encodeURIComponent(paramsJson));
    
    // 返回最终链接
    return `${articleUrl}${connector}return_filter=${base64Params}`;
--- a/src/components/Search.tsx
+++ b/src/components/Search.tsx
@ -521,12 +521,15 @@ const Search: React.FC<SearchProps> = ({
        );
        
        if (exactMatchForSuggestion) {
-          // 如果有完全匹配的结果，直接导航
+          // 如果有完全匹配的结果，关闭搜索结果面板并导航
+          setShowResults(false);
+          setInlineSuggestion(prev => ({ ...prev, visible: false }));
          window.location.href = exactMatchForSuggestion.url;
          return;
        }
        
        // 没有完全匹配，先补全建议并导航到第一个结果
+        // completeInlineSuggestion会自动处理关闭搜索结果的逻辑
        completeInlineSuggestion(true); // 传入true表示需要导航到第一个结果
        return;
      } 
@ -538,12 +541,16 @@ const Search: React.FC<SearchProps> = ({
        );
        
        if (exactMatch) {
-          // 找到完全匹配，直接导航到该文章
+          // 找到完全匹配，关闭搜索结果面板并导航
+          setShowResults(false);
+          setInlineSuggestion(prev => ({ ...prev, visible: false }));
          window.location.href = exactMatch.url;
          return;
        }
        
-        // 如果没有完全匹配，但有搜索结果，进入第一个结果
+        // 如果没有完全匹配，但有搜索结果，关闭搜索结果面板并进入第一个结果
+        setShowResults(false);
+        setInlineSuggestion(prev => ({ ...prev, visible: false }));
        window.location.href = allItems[0].url;
        return;
      }
@ -721,8 +728,14 @@ const Search: React.FC<SearchProps> = ({
      // 更新React状态
      setQuery(textToComplete);
      
-      // 立即执行搜索
-      performSearch(textToComplete, false, shouldNavigateToFirstResult);
+      // 如果需要导航到第一个结果，保持结果面板显示状态，立即执行搜索
+      if (shouldNavigateToFirstResult) {
+        performSearch(textToComplete, false, true);
+      } else {
+        // 如果不需要导航，关闭搜索结果面板，但仍然执行搜索以更新结果
+        setShowResults(false);
+        performSearch(textToComplete, false, false);
+      }
      
      // 聚焦输入框并设置光标位置
      if (searchInputRef.current) {
@ -763,7 +776,12 @@ const Search: React.FC<SearchProps> = ({
  // 处理提交搜索
  const handleSubmit = (e: React.FormEvent) => {
    e.preventDefault();
-    performSearch(query, false); // 传入false表示不是加载更多
+    // 执行搜索但不立即关闭结果面板，等待搜索完成
+    performSearch(query, false);
+    // 如果查询为空，关闭搜索结果面板
+    if (!query.trim()) {
+      setShowResults(false);
+    }
  };

  // 加载更多结果
@ -1133,6 +1151,11 @@ const Search: React.FC<SearchProps> = ({
                  <a 
                    href={item.url} 
                    className="group block hover:bg-primary-200/80 dark:hover:bg-primary-800/20 hover:shadow-md rounded-lg transition-all duration-200 ease-in-out p-2 -m-2 border border-transparent hover:border-primary-300/60 dark:hover:border-primary-700/30"
+                    onClick={() => {
+                      // 点击搜索结果项时关闭搜索结果面板
+                      setShowResults(false);
+                      setInlineSuggestion(prev => ({ ...prev, visible: false }));
+                    }}
                  >
                    <div className="flex items-start">
                      <div className="flex-grow min-w-0">
--- a/src/components/ThemeToggle.astro
+++ b/src/components/ThemeToggle.astro
@ -1052,16 +1052,6 @@ import "../styles/theme-toggle.css";
      // 设置主题切换功能
      setupThemeToggle();
      
-      // 设置防止内存泄漏的自动清理 - 最多30秒后自毁
-      setTimeout(() => {
-        // 如果页面没有被卸载，检查是否已经清理过
-        if (document.body && !document._themeToggleCleanedUp) {
-          // 为避免重复清理，设置一个标记
-          document._themeToggleCleanedUp = true;
-          // 执行清理
-          selfDestruct();
-        }
-      }, 30000);
    }

    // 判断DOM是否已加载
--- a/src/consts.ts
+++ b/src/consts.ts
@ -33,7 +33,7 @@ export const NAV_STRUCTURE = [
        text: '文章',
        items: [
            { id: 'filter', text: '筛选', href: '/filtered' },
-            { id: 'path', text: '文章', href: '/articles' }
+            { id: 'path', text: '网格', href: '/articles' }
        ]
    },
    {
--- a/src/content/技术日志/web/echoes博客使用说明.md
+++ b/src/content/技术日志/web/echoes博客使用说明.md
--- a/src/content/理解计算机/Web/markdown使用教程.md
+++ b/src/content/理解计算机/Web/markdown使用教程.md
@ -195,4 +195,4 @@ function greet(user: User): string {

 <br/>

---
+---
--- a/src/styles/articles-mermaid.css
+++ b/src/styles/articles-mermaid.css
@ -16,6 +16,15 @@
  font-family: inherit !important;
 }

+/* 添加edgeLabel文本颜色样式 */
+.mermaid .edgeLabel,
+.mermaid .edgeLabel p,
+.mermaid .edgeLabel span {
+  color: var(--color-secondary-800) !important;
+  fill: var(--color-secondary-800) !important;
+  background-color: transparent !important;
+}
+
 /* 节点样式设置 */
 .mermaid .node rect, 
 .mermaid .node circle, 
@ -122,6 +131,14 @@
  fill: var(--color-secondary-300) !important;
 }

+/* 暗色模式edgeLabel文本颜色样式 */
+[data-theme='dark'] .mermaid .edgeLabel,
+[data-theme='dark'] .mermaid .edgeLabel p,
+[data-theme='dark'] .mermaid .edgeLabel span {
+  color: var(--color-secondary-300) !important;
+  fill: var(--color-secondary-300) !important;
+}
+
 [data-theme='dark'] .mermaid .node rect, 
 [data-theme='dark'] .mermaid .node circle, 
 [data-theme='dark'] .mermaid .node ellipse,