!3078 功能:配置列表搜索/筛选支持拼音首字母或拼音

package.json

@@ -105,6 +105,7 @@
         "@epicgames-ps/lib-pixelstreamingfrontend-ue5.2": "^0.5.1",
         "@jscad/modeling": "^2.12.2",
         "blueimp-md5": "^2.19.0",
+        "core-js": "3.37.1",
         "detect-browser": "^5.3.0",
         "dwg2dxf": "^1.0.0",
         "dxf-parser": "^1.1.2",
@@ -119,6 +120,7 @@
         "monotone-convex-hull-2d": "^1.0.1",
         "p-queue": "^6.6.2",
         "pako": "1.0.11",
+        "pinyin-pro": "^3.24.2",
         "polylabel": "^1.1.0",
         "qrcode": "^1.5.3",
         "react": "^18.3.1",
@@ -136,8 +138,7 @@
         "stats.js": "^0.17.0",
         "swiper": "6.8.4",
         "three": "npm:three-cf@0.122.6",
-        "xaop": "^2.1.0",
-        "core-js": "3.37.1"
+        "xaop": "^2.1.0"
     },
     "resolutions": {
         "acorn": "8.8.1",

src/UI/Components/Board/ConfigList.tsx

@@ -1,6 +1,7 @@
 import { Button, InputGroup, Intent, Menu, MenuItem, Popover, Position, Tab, Tabs, Tooltip } from "@blueprintjs/core";
 import { autorun, observable } from "mobx";
 import { observer } from "mobx-react";
+import { pinyin } from "pinyin-pro";
 import React from "react";
 import { DndProvider } from "react-dnd";
 import { HTML5Backend } from "react-dnd-html5-backend";
@@ -263,10 +264,36 @@ export class ConfigList extends React.Component<IConfigListProps>
         );
     };
 
+    filterConfigsNames()
+    {
+        const pinyinMap = new Map<string, string[]>();
+        this.props.store.configsNames.forEach(name =>
+        {
+            const py = pinyin(name, { toneType: 'none', type: 'array' }).join("");
+            const pyInitial = pinyin(name, { pattern: 'initial', type: 'array' }).join("");
+            pinyinMap.set(name, [py, pyInitial]);
+        });
+
+        const name1 = []; //原名称搜索先显示
+        const name2 = []; //拼音缩写搜索第二显示
+        const name3 = []; //拼音全拼第三显示
+        for (const [name, [py, pyInitial]] of pinyinMap.entries())
+        {
+            if (CompareIsEqual(name, this.searchName, ECompareType.Include))
+                name1.push(name);
+            if (CompareIsEqual(pyInitial, this.searchName, ECompareType.Include))
+                name2.push(name);
+            if (CompareIsEqual(py, this.searchName, ECompareType.Include))
+                name3.push(name);
+        }
+        const configsNames = [...new Set(name1.concat(name2, name3))];
+        return configsNames;
+    }
+
     ConfigListTag = (errorMsg: string) =>
     {
         const { store, type } = this.props;
-        const configsNames = store.configsNames.filter(name => CompareIsEqual(name, this.searchName, ECompareType.Include));
+        const configsNames = this.filterConfigsNames();
         return (
             <div className='config-list'>
                 <div className="flex-between">