feat(route): add route demo

Author: kagol

devui/accordion/demo/accordion-demo.tsx

@@ -0,0 +1,12 @@
+import { defineComponent } from 'vue'
+
+export default defineComponent({
+  name: 'd-accordion-demo',
+  props: {
+  },
+  setup(props, ctx) {
+    return () => {
+      return <div>devui-accordion-demo</div>
+    }
+  }
+})

devui/accordion/demo/accordion.route.ts

@@ -0,0 +1,13 @@
+import AccordionDemoComponent from './accordion-demo'
+import DevUIApiComponent from '../../shared/devui-api/devui-api'
+
+const routes = [
+  { path: '',  redirectTo: 'demo' },
+  { path: 'demo', component: AccordionDemoComponent},
+  { path: 'api', component: DevUIApiComponent, meta: {
+    'zh-cn': '../doc/api-cn.md',
+    'en-us': '../doc/api-en.md'
+  }}
+]
+
+export default routes

devui/button/demo/button.route.ts

@@ -0,0 +1,13 @@
+import ButtonDemoComponent from './button-demo.vue'
+import DevUIApiComponent from '../../shared/devui-api/devui-api'
+
+const routes = [
+  { path: '',  redirectTo: 'demo' },
+  { path: 'demo', component: ButtonDemoComponent},
+  { path: 'api', component: DevUIApiComponent, meta: {
+    'zh-cn': '../doc/api-cn.md',
+    'en-us': '../doc/api-en.md'
+  }}
+]
+
+export default routes

devui/shared/devui-api/devui-api.tsx

@@ -0,0 +1,12 @@
+import { defineComponent } from 'vue'
+
+export default defineComponent({
+  name: 'd-api',
+  props: {
+  },
+  setup(props, ctx) {
+    return () => {
+      return <div>devui-api</div>
+    }
+  }
+})

src/components/app-content.vue

@@ -78,7 +78,7 @@ export default {
             if (item.meta.name) {
               return {
                 title: item.meta.name + ' ' + item.meta.cnName,
-                link: item.path,
+                link: '/components/' + item.path + '/demo',
               };
             } else {
               return {};

src/components/app-demo-cell.vue

@@ -16,7 +16,7 @@
     <div class="examples-viewer">
       <div class="examples-viewer-wrapper">
         <!-- TODO: Demo列表 -->
-        <d-button-demo></d-button-demo>
+        <router-view></router-view>
       </div>
     </div>
   </div>

src/components/component.route.ts

@@ -3,6 +3,9 @@ import GetStartedComponent from './app-demo-cell.vue';
 import ColorComponent from './app-demo-cell.vue';
 import ThemeGuideComponent from './app-demo-cell.vue';
 
+import accordionRoutes from '../../devui/accordion/demo/accordion.route'
+import buttonRoutes from '../../devui/button/demo/button.route'
+
 export const routesConfig = [
   {
     path: '',
@@ -28,7 +31,7 @@ export const routesConfig = [
   {
     path: 'accordion',
     component: ExamplePanelComponent,
-
+    children: accordionRoutes,
     meta: {
       type: '导航',
       enType: 'Navigation',
@@ -118,7 +121,7 @@ export const routesConfig = [
   {
     path: 'button',
     component: ExamplePanelComponent,
-
+    children: buttonRoutes,
     meta: {
       name: 'Button',
       cnName: '按钮',