feat: init

packages/shared/src/error-page/errorBoundary/index.tsx

@@ -0,0 +1,49 @@
+// components/ErrorBoundary/index.tsx
+import React, { Component, ReactNode } from "react";
+import { Result, Button } from "antd-mobile";
+
+interface Props {
+  children: ReactNode;
+  fallback?: ReactNode;
+}
+
+interface State {
+  hasError: boolean;
+  error?: Error;
+}
+
+class ErrorBoundary extends Component<Props, State> {
+  constructor(props: Props) {
+    super(props);
+    this.state = { hasError: false };
+  }
+
+  static getDerivedStateFromError(error: Error): State {
+    return { hasError: true, error };
+  }
+
+  componentDidCatch(error: Error, errorInfo: any) {
+    console.error("ErrorBoundary caught an error:", error, errorInfo);
+  }
+
+  render() {
+    if (this.state.hasError) {
+      if (this.props.fallback) {
+        return this.props.fallback;
+      }
+
+      return (
+        <div style={{ padding: "20px", textAlign: "center" }}>
+          <Result status="error" title="页面出错了" description="抱歉，页面出现了错误" />
+          <Button color="primary" onClick={() => window.location.reload()}>
+            刷新页面
+          </Button>
+        </div>
+      );
+    }
+
+    return this.props.children;
+  }
+}
+
+export default ErrorBoundary;

packages/shared/src/error-page/index.module.less

@@ -0,0 +1,20 @@
+// components/ErrorPages/ErrorPages.module.less
+.errorPage {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  min-height: 100vh;
+  padding: 20px;
+  background-color: #f5f5f5;
+}
+
+.actions {
+  display: flex;
+  gap: 16px;
+  margin-top: 24px;
+
+  .button {
+    min-width: 100px;
+  }
+}

packages/shared/src/error-page/notFound/index.tsx

@@ -0,0 +1,25 @@
+// components/ErrorPages/NotFound.tsx
+import React from "react";
+import { Button, Result } from "antd-mobile";
+import { useNavigate } from "react-router-dom";
+import styles from "../index.module.less";
+
+const NotFound: React.FC = () => {
+  const navigate = useNavigate();
+
+  return (
+    <div className={styles.errorPage}>
+      <Result status="error" title="页面不存在" description="抱歉，您访问的页面不存在" />
+      <div className={styles.actions}>
+        <Button color="primary" onClick={() => navigate(-1)} className={styles.button}>
+          返回上页
+        </Button>
+        <Button onClick={() => navigate("/")} className={styles.button}>
+          回到首页
+        </Button>
+      </div>
+    </div>
+  );
+};
+
+export default NotFound;

packages/shared/src/error-page/serverError/index.tsx

@@ -0,0 +1,29 @@
+// components/ErrorPages/ServerError.tsx
+import React from "react";
+import { Button, Result } from "antd-mobile";
+import { useNavigate } from "react-router-dom";
+import styles from "../index.module.less";
+
+const ServerError: React.FC = () => {
+  const navigate = useNavigate();
+
+  const handleRefresh = () => {
+    window.location.reload();
+  };
+
+  return (
+    <div className={styles.errorPage}>
+      <Result status="error" title="服务器错误" description="服务器开小差了，请稍后再试" />
+      <div className={styles.actions}>
+        <Button color="primary" onClick={handleRefresh} className={styles.button}>
+          刷新页面
+        </Button>
+        <Button onClick={() => navigate("/")} className={styles.button}>
+          回到首页
+        </Button>
+      </div>
+    </div>
+  );
+};
+
+export default ServerError;

packages/shared/src/xpopup/index.tsx

@@ -12,7 +12,7 @@ function XPopup(props: DefinedProps) {
   const { visible, title, children, onClose } = props;
 
   return (
-    <Popup visible={visible} closeOnMaskClick={true} className="xpopup">
+    <Popup visible={visible} closeOnMaskClick={true} className="xpopup" onMaskClick={onClose}>
       <div className="header">
         <h3 className="title">{title}</h3>
         <span className="closeIcon" onClick={onClose}>