From 365bba283739b9aae7be73530d6cafce27bec515 Mon Sep 17 00:00:00 2001
From: Erica-WX <2544194336@qq.com>
Date: Wed, 24 Apr 2019 21:07:47 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0story?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/stories/index.stories.tsx | 109 ++++++++++++++++++++++-------
 1 file changed, 83 insertions(+), 26 deletions(-)

diff --git a/frontend/stories/index.stories.tsx b/frontend/stories/index.stories.tsx
index b755a730..42aa3889 100644
--- a/frontend/stories/index.stories.tsx
+++ b/frontend/stories/index.stories.tsx
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { storiesOf, addDecorator } from '@storybook/react';
-import { Carousel } from '../src/view/components/carousel';
+import { Carousel } from '../src/view/components/common/carousel';
+import { Badge } from '../src/view/components/common/badge';
 import { withViewport } from '@storybook/addon-viewport';
 import { withConsole } from '@storybook/addon-console';
 import { withKnobs, boolean } from '@storybook/addon-knobs';
@@ -13,35 +14,91 @@ import { pageDecorator } from './decorator';
 
 const core = new Core();
 
+
+
 addDecorator((storyFn, context) => withConsole()(storyFn)(context));
 
 storiesOf('Home', module)
-    .addDecorator(withViewport())
-    .addDecorator(withKnobs)
-    .addDecorator(pageDecorator)
-    .add('Carousel', () => 
-        <Carousel
-            windowResizeEvent={core.windowResizeEvent}
-            slides={[
-                <span>one</span>,
-                <span>two</span>,
-                <span>three</span>,
-            ]}
-            indicator={boolean(true)} />
-    )
+  .addDecorator(withViewport())
+  .addDecorator(withKnobs)
+  .addDecorator(pageDecorator)
+  .add('Carousel', () => 
+    <Carousel
+      windowResizeEvent={core.windowResizeEvent}
+      slides={[
+      <span>one</span>,
+      <span>two</span>,
+      <span>three</span>,
+    ]}
+    indicator={boolean(true)} />
+  )
+;
+
+let value:number = 10;
+let max:number = 99;
+storiesOf('Home', module)
+  .addDecorator(withViewport())
+  .addDecorator(withKnobs)
+  .addDecorator(pageDecorator)
+  .add('Badge1', () => 
+    <Badge num={value}>
+      <span>
+      test
+      </span>
+    </Badge>
+  )
+;
+
+storiesOf('Home', module)
+  .addDecorator(withViewport())
+  .addDecorator(withKnobs)
+  .addDecorator(pageDecorator)
+  .add('Badge2', () => 
+    <Badge num={value+90} max={max}>
+      <span>
+      test
+      </span>
+    </Badge>
+  )
 ;
 
+
+storiesOf('Home', module)
+  .addDecorator(withViewport())
+  .addDecorator(withKnobs)
+  .addDecorator(pageDecorator)
+  .add('Badge3', () => 
+    <Badge dot>
+      <span>
+      test
+      </span>
+    </Badge>
+  )
+;
+
+storiesOf('Home', module)
+  .addDecorator(withViewport())
+  .addDecorator(withKnobs)
+  .addDecorator(pageDecorator)
+  .add('Badge4', () => 
+    <Badge hidden>
+      <span>
+      test
+      </span>
+    </Badge>
+  )
+;
 // storiesOf('Book', module)
-//     .addDecorator(withViewport())
-//     .addDecorator(withKnobs)
-//     .add('Chapter', () =>
-//         <Chapter chapter={{
-//             type: 'chapter',
-//             id: 0,
-//             attributes: {
-//                 title: '',
-//                 body: '',
-//             }
-//         }} /> 
-//     )
+//   .addDecorator(withViewport())
+//   .addDecorator(withKnobs)
+//   .add('Chapter', () =>
+//     <Chapter chapter={{
+//       type: 'chapter',
+//       id: 0,
+//       attributes: {
+//       title: '',
+//       body: '',
+//       }
+//     }} /> 
+//   )
 // ;