@lxzy/code-snippet 0.0.10 → 0.0.12

package/.opencode/commands/push-yw.md

@@ -4,5 +4,5 @@ agent: build
 model: opencode/mimo-v2.5-free
 ---
 
-修改 package.json 里的 version 字段，版本号加 1
+修改 package.json 里的 version 字段，版本号根据 patch bump 规则加 1
 执行`pnpm pub`

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lxzy/code-snippet",
-  "version": "0.0.10",
+  "version": "0.0.12",
   "files": [
     "*",
     "!dist",

package/routes/menu.ts

@@ -3,10 +3,12 @@ export default [
     path: '/home',
     name: '首页',
     component: 'home',
+    icon: 'smile',
   },
   {
     path: '/activityCenter',
     name: '活动中心',
+    icon: 'sound',
     routes: [
       {
         path: '/activityCenter/activitySystemManagement',

package/src/App.tsx

@@ -1,18 +1,48 @@
 import React, { Suspense, lazy } from 'react';
-import { Switch, Route, Redirect } from 'react-router-dom';
+import { Switch, Route, Redirect, useHistory, useLocation } from 'react-router-dom';
 import { Router } from 'react-router-dom';
 import history from '@/umi';
 import BasicLayout from '@/layouts/index';
 import routes from '../routes';
 
+const pageModules = import.meta.glob('./pages/**/*.tsx');
+
 const componentCache = {};
 const loadComponent = (path) => {
   if (!componentCache[path]) {
-    componentCache[path] = lazy(() => import(`./pages/${path}`));
+    const factory: any =
+      pageModules[`./pages/${path}.tsx`] ||
+      pageModules[`./pages/${path}/index.tsx`];
+    if (!factory) {
+      throw new Error(`Page component not found: ${path}`);
+    }
+    componentCache[path] = lazy(factory);
   }
   return componentCache[path];
 };
 
+const parseQuery = (search) => {
+  if (!search) return {};
+  const params = new URLSearchParams(search);
+  const query = {};
+  for (const [key, value] of params) {
+    query[key] = value;
+  }
+  return query;
+};
+
+const RouteWrapper = ({ componentPath }) => {
+  const routeHistory = useHistory();
+  const routeLocation = useLocation();
+  const Component = loadComponent(componentPath);
+  return (
+    <Component
+      history={routeHistory}
+      location={{ ...routeLocation, query: parseQuery(routeLocation.search) }}
+    />
+  );
+};
+
 const App = () => {
   return (
     <Router history={history}>
@@ -29,10 +59,7 @@ const App = () => {
                   key={route.path || i}
                   path={route.path}
                   exact={route.path !== '/404'}
-                  render={() => {
-                    const Component = loadComponent(route.component);
-                    return <Component />;
-                  }}
+                  render={() => <RouteWrapper componentPath={route.component} />}
                 />
               ),
             )}

package/src/layouts/index.tsx

@@ -1,13 +1,15 @@
-import React from 'react';
+import React, { useState, useEffect } from 'react';
 import { Avatar, Dropdown, Menu, Space } from 'antd';
 import ProLayout from '@ant-design/pro-layout';
 import history from '@/umi';
 import menuRoutes from '../../routes/menu';
+import getIcon from '@/utils/getIcon';
 
 const menuDataRender = (menuList) => {
   return menuList.map((item) => {
     const localItem = {
       ...item,
+      icon: item.icon ? getIcon(item.icon) : undefined,
       children: item.children ? menuDataRender(item.children) : undefined,
     };
     return localItem;
@@ -16,6 +18,14 @@ const menuDataRender = (menuList) => {
 
 const BasicLayout = (props) => {
   const { children } = props;
+  const [location, setLocation] = useState(history.location);
+
+  useEffect(() => {
+    const unlisten = history.listen((location) => {
+      setLocation(location);
+    });
+    return () => unlisten();
+  }, []);
 
   return (
     <ProLayout
@@ -24,9 +34,10 @@ const BasicLayout = (props) => {
       layout="mix"
       fixSiderbar={false}
       fixedHeader
+      location={location}
       route={{
         path: '/',
-        routes: menuRoutes,
+        routes: menuDataRender(menuRoutes),
       }}
       menuItemRender={(item, dom) => (
         <a onClick={() => history.push(item.path || '/')}>{dom}</a>

package/src/pages/home.tsx

@@ -1,5 +1,7 @@
 import React, { useState } from 'react';
 
-export default function Home() {
+export default function Home(props) {
+  console.log(props);
+  const { history, location } = props;
   return <div>home</div>;
 }

package/src/utils/getIcon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+import * as Icons from '@ant-design/icons';
+
+const getIcon = (name) => {
+  if (!name) return undefined;
+  const capitalize = (s) => s.charAt(0).toUpperCase() + s.slice(1);
+  const parts = name.split('-');
+  const baseName = parts.map(capitalize).join('');
+  const hasSuffix = name.endsWith('Filled') || name.endsWith('TwoTone');
+  const componentName = hasSuffix ? baseName : baseName + 'Outlined';
+  const IconComp = Icons[componentName];
+  if (!IconComp) return undefined;
+  return React.createElement(IconComp);
+};
+
+export default getIcon;