add article panel to omi cli template

packages/omi-cli/template/weui/src/elements/app/index.js

@@ -12,6 +12,7 @@ import 'omi-weui/cells'
 import 'omi-router'
 import '../button-panel'
 import '../list-panel'
+import '../article-panel'
 import route from 'omi-router'
 
 define('my-app', class extends WeElement {
@@ -23,7 +24,8 @@ define('my-app', class extends WeElement {
 
   data = {
     visible: {
-      form: true
+      form: false,
+      layout: false
     },
     tag: null,
     atHome: true
@@ -40,6 +42,23 @@ define('my-app', class extends WeElement {
       this.data.atHome = false
     })
 
+    route('/input', () => {
+      alert('开发中，敬请期待')
+    })
+
+    route('/article', () => {
+      this.data.tag = 'article-panel'
+      this.data.atHome = false
+    })
+
+    route('/slider', () => {
+      alert('开发中，敬请期待')
+    })
+
+    route('/uploader', () => {
+      alert('开发中，敬请期待')
+    })
+
     route('*', () => {
       this.data.atHome = true
     })
@@ -49,6 +68,11 @@ define('my-app', class extends WeElement {
     this.data.visible.form = !this.data.visible.form
   }
 
+  clickLayout = () => {
+    this.data.visible.layout = !this.data.visible.layout
+  }
+
+  
   render(props, data) {
     return (
       <div>
@@ -72,21 +96,21 @@ define('my-app', class extends WeElement {
                 <div class="page__category js_categoryInner">
                   <ow-cells class="page__category-content">
                     <ow-cell href="#/button">Button</ow-cell>
-                    <ow-cell>Input</ow-cell>
+                    <ow-cell href="#/input">Input</ow-cell>
                     <ow-cell href="#/list">List</ow-cell>
-                    <ow-cell>Slider</ow-cell>
-                    <ow-cell>Uploader</ow-cell>
+                    <ow-cell href="#/slider">Slider</ow-cell>
+                    <ow-cell href="#/uploader">Uploader</ow-cell>
                   </ow-cells>
                 </div>
               </li>
-              <li>
-                <div class="weui-flex js_category">
+              <li class={data.visible.layout && 'js_show'}>
+                <div class="weui-flex js_category"  onClick={this.clickLayout}>
                   <p class="weui-flex__item">基础组件</p>
                   <img src={iconNavLayout} alt="" />
                 </div>
                 <div class="page__category js_categoryInner">
-                  <ow-cells>
-                    <ow-cell>Article</ow-cell>
+                  <ow-cells class="page__category-content">
+                    <ow-cell href="#/article">Article</ow-cell>
                     <ow-cell>Badge</ow-cell>
                     <ow-cell>Flex</ow-cell>
                     <ow-cell>Footer</ow-cell>
@@ -106,7 +130,7 @@ define('my-app', class extends WeElement {
                   <img src={iconNavFeedback} alt="" />
                 </div>
                 <div class="page__category js_categoryInner">
-                  <ow-cells>
+                  <ow-cells class="page__category-content">
                     <ow-cell>Actionsheet</ow-cell>
                     <ow-cell>Dialog</ow-cell>
                     <ow-cell>Msg</ow-cell>
@@ -121,7 +145,7 @@ define('my-app', class extends WeElement {
                   <img src={iconNavNav} alt="" />
                 </div>
                 <div class="page__category js_categoryInner">
-                  <ow-cells>
+                  <ow-cells class="page__category-content">
                     <ow-cell>Navbar</ow-cell>
                     <ow-cell>Tabbar</ow-cell>
                   </ow-cells>
@@ -133,7 +157,7 @@ define('my-app', class extends WeElement {
                   <img src={iconNavSearch} alt="" />
                 </div>
                 <div class="page__category js_categoryInner">
-                  <ow-cells>
+                  <ow-cells class="page__category-content">
                     <ow-cell>Search Bar</ow-cell>
                   </ow-cells>
                 </div>

packages/omi-cli/template/weui/src/elements/article-panel/index.js

@@ -0,0 +1,34 @@
+import { define, WeElement } from 'omi'
+import style from './_index.css'
+import 'omi-weui/article'
+import picArticle from './pic_article.png'
+
+define('article-panel', class extends WeElement {
+  css() {
+    return style
+  }
+
+  render() {
+    return (
+      <div>
+        <ow-article>
+          <h1>H1 Heading</h1>
+          <section>
+            <h2>H2 Title</h2>
+            <p>
+              <h3>H3 Heading</h3>
+              <p>
+                Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
+                eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
+                enim ad minim veniam, quis nostrud exercitation ullamco laboris
+                nisi ut aliquip ex ea commodo consequat. Duis aute
+          </p>
+              <img src={picArticle} alt="" />
+              <p />
+            </p>
+          </section>
+        </ow-article>
+      </div>
+    )
+  }
+})

packages/omi-cli/template/weui/src/elements/list-panel/index.js

@@ -7,7 +7,7 @@ define('list-panel', class extends WeElement {
     return style
   }
 
-  render(props, data) {
+  render() {
     return (
       <div>
         <ow-list title="如果爱情有天意……">