diff --git a/config/config.ts b/config/config.ts
index e76e1a2e..97a98c68 100644
--- a/config/config.ts
+++ b/config/config.ts
@@ -93,8 +93,14 @@ export default {
           icon: 'smile',
           component: './Welcome',
         },
+        {
+          component: './404',
+        },
       ],
     },
+    {
+      component: './404',
+    },
   ],
   // Theme for antd: https://ant.design/docs/react/customize-theme-cn
   theme: {
diff --git a/scripts/fetch-blocks.js b/scripts/fetch-blocks.js
index 98c63584..996ef78f 100644
--- a/scripts/fetch-blocks.js
+++ b/scripts/fetch-blocks.js
@@ -41,6 +41,9 @@ const findAllInstallRouter = router => {
 const filterParentRouter = (router, layout) => {
   return [...router]
     .map(item => {
+      if (!item.path && item.component === '404') {
+        return item;
+      }
       if (item.routes && (!router.component || layout)) {
         return { ...item, routes: filterParentRouter(item.routes, false) };
       }
diff --git a/src/components/NoticeIcon/NoticeList.tsx b/src/components/NoticeIcon/NoticeList.tsx
index 4b0923d8..f056b5b4 100644
--- a/src/components/NoticeIcon/NoticeList.tsx
+++ b/src/components/NoticeIcon/NoticeList.tsx
@@ -19,6 +19,7 @@ export interface NoticeIconTabProps {
   emptyText?: string;
   clearText?: string;
   viewMoreText?: string;
+  list: NoticeIconData[];
   onViewMore?: (e: any) => void;
 }
 const NoticeList: React.SFC<NoticeIconTabProps> = ({
diff --git a/src/components/NoticeIcon/index.tsx b/src/components/NoticeIcon/index.tsx
index 322ca3e8..8876ef93 100644
--- a/src/components/NoticeIcon/index.tsx
+++ b/src/components/NoticeIcon/index.tsx
@@ -117,7 +117,7 @@ export default class NoticeIcon extends Component<NoticeIconProps> {
       },
     );
     return (
-      <Spin spinning={loading} delay={0}>
+      <Spin spinning={loading} delay={300}>
         <Tabs className={styles.tabs} onChange={this.onTabChange}>
           {panes}
         </Tabs>
diff --git a/src/models/global.ts b/src/models/global.ts
index 367ac486..a79cac67 100644
--- a/src/models/global.ts
+++ b/src/models/global.ts
@@ -7,6 +7,7 @@ import { queryNotices } from '@/services/user';
 export interface NoticeItem extends NoticeIconData {
   id: string;
   type: string;
+  status: string;
 }
 
 export interface GlobalModelState {
diff --git a/src/pages/404.tsx b/src/pages/404.tsx
new file mode 100644
index 00000000..a8ee0ee7
--- /dev/null
+++ b/src/pages/404.tsx
@@ -0,0 +1,24 @@
+import React from 'react';
+import { Button } from 'antd';
+
+// 这里应该使用 antd 的 404 result 组件，
+// 但是还没发布，先来个简单的。
+
+const NoFoundPage: React.FC<{}> = () => (
+  <div
+    style={{
+      height: '100vh',
+      padding: 80,
+      textAlign: 'center',
+    }}
+  >
+    <img src="https://gw.alipayobjects.com/zos/antfincdn/wsE2Pw%243%26L/noFound.svg" alt="404" />
+    <br />
+    <br />
+    <h1>404</h1>
+    <p>Sorry, the page you visited does not exist.</p>
+    <Button type="primary">Back Home</Button>
+  </div>
+);
+
+export default NoFoundPage;