feat(notfound): use empty rewrite notfound

Author: LuckyFBB

src/notFound/__tests__/notFound.test.tsx

@@ -9,7 +9,7 @@ describe('test NotFound', () => {
 
     test('renders not found message', () => {
         const { getByText } = render(<NotFound />);
-        const element = getByText(/亲，是不是走错地方了？/i);
+        const element = getByText(/抱歉，您访问的页面不存在/i);
         expect(element).toBeInTheDocument();
     });
 });

src/notFound/index.tsx

@@ -1,21 +1,23 @@
 import React from 'react';
-import { FrownOutlined } from '@ant-design/icons';
 import classNames from 'classnames';
 
+import Empty from '../empty';
 import './style.scss';
 
-const NotFound: React.FC<any> = function ({
-    className,
-    style,
-}: {
+interface INotFoundProps {
     className?: string;
     style?: React.CSSProperties;
-}) {
+}
+
+const NotFound: React.FC<INotFoundProps> = function ({ className, style }) {
     return (
         <div className={classNames('dtc-not-found', className)} style={style}>
-            <h1>
-                <FrownOutlined /> 亲，是不是走错地方了？
-            </h1>
+            <Empty
+                type="notFound"
+                description="抱歉，您访问的页面不存在"
+                className="dtc-not-found__empty"
+                imageStyle={{ height: 250 }}
+            />
         </div>
     );
 };

src/notFound/style.scss

@@ -1,4 +1,6 @@
 .dtc-not-found {
-    line-height: 200px;
-    text-align: center;
+    margin-top: 160px;
+    width: 100%;
+    display: flex;
+    justify-content: center;
 }