0.0.3

src/App.vue

@@ -1,9 +1,8 @@
 <template>
   <div id="app">
-    <a-button>按钮</a-button>
     <div id="nav">
-      <router-link to="/">Home</router-link> |
-      <router-link to="/about">About</router-link>
+      <router-link to="/dashboard/analysis">dashboard</router-link> |
+      <router-link to="/form">form</router-link>
     </div>
     <router-view />
   </div>

src/layouts/BasicLayout.vue

@@ -0,0 +1,23 @@
+<template>
+  <div>
+    <Header />
+    <SiderMenu />
+    <router-view></router-view>
+    <Footer />
+  </div>
+</template>
+
+<script>
+import Header from "./Header";
+import Footer from "./Footer";
+import SiderMenu from "./SiderMenu";
+export default {
+  components: {
+    Header,
+    Footer,
+    SiderMenu
+  }
+};
+</script>
+
+<style></style>

src/layouts/Footer.vue

@@ -0,0 +1,9 @@
+<template>
+  <div>Footer</div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style></style>

src/layouts/Header.vue

@@ -0,0 +1,9 @@
+<template>
+  <div>Header</div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style></style>

src/layouts/SiderMenu.vue

@@ -0,0 +1,11 @@
+<template>
+  <div>
+    菜单
+  </div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style></style>

src/layouts/UserLayout.vue

@@ -0,0 +1,12 @@
+<template>
+  <div>
+    <div class="desc">Ant Design Vue Pro</div>
+    <router-view></router-view>
+  </div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style></style>

src/router.js

@@ -1,26 +1,122 @@
 import Vue from "vue";
 import Router from "vue-router";
-import Home from "./views/Home.vue";
+import NProgress from "nprogress";
+import "nprogress/nprogress.css";
+import NotFound from "./views/404";
 
 Vue.use(Router);
 
-export default new Router({
+const router = new Router({
   mode: "history",
   base: process.env.BASE_URL,
   routes: [
     {
-      path: "/",
-      name: "home",
-      component: Home
+      path: "/user",
+      component: () =>
+        import(/* webpackChunkName: "layout" */ "./layouts/UserLayout"),
+      children: [
+        {
+          path: "/user",
+          redirect: "/user/login"
+        },
+        {
+          path: "/user/login",
+          name: "login",
+          component: () =>
+            import(/* webpackChunkName: "user" */ "./views/User/Login")
+        },
+        {
+          path: "/user/register",
+          name: "register",
+          component: () =>
+            import(/* webpackChunkName: "user" */ "./views/User/Register")
+        }
+      ]
     },
     {
-      path: "/about",
-      name: "about",
-      // route level code-splitting
-      // this generates a separate chunk (about.[hash].js) for this route
-      // which is lazy-loaded when the route is visited.
+      path: "/",
       component: () =>
-        import(/* webpackChunkName: "about" */ "./views/About.vue")
+        import(/* webpackChunkName: "layout" */ "./layouts/BasicLayout"),
+      children: [
+        // dashboard
+        {
+          path: "/",
+          redirect: "/dashboard/analysis"
+        },
+        {
+          path: "/dashboard",
+          name: "dashboard",
+          component: { render: h => h("router-view") },
+          children: [
+            {
+              path: "/dashboard/analysis",
+              name: "analysis",
+              component: () =>
+                import(/* webpackChunkName: "dashboard" */ "./views/Dashboard/Analysis")
+            }
+          ]
+        },
+        // form
+        {
+          path: "/form",
+          name: "form",
+          component: { render: h => h("router-view") },
+          children: [
+            {
+              path: "/form/basic-form",
+              name: "basicform",
+              component: () =>
+                import(/* webpackChunkName: "form" */ "./views/Forms/BasicForm")
+            },
+            {
+              path: "/form/step-form",
+              name: "stepform",
+              component: () =>
+                import(/* webpackChunkName: "form" */ "./views/Forms/StepForm"),
+              children: [
+                {
+                  path: "/form/step-form",
+                  redirect: "/form/step-form/info"
+                },
+                {
+                  path: "/form/step-form/info",
+                  name: "info",
+                  component: () =>
+                    import(/* webpackChunkName: "form" */ "./views/Forms/StepForm/Step1")
+                },
+                {
+                  path: "/form/step-form/confirm",
+                  name: "confirm",
+                  component: () =>
+                    import(/* webpackChunkName: "form" */ "./views/Forms/StepForm/Step2")
+                },
+                {
+                  path: "/form/step-form/result",
+                  name: "result",
+                  component: () =>
+                    import(/* webpackChunkName: "form" */ "./views/Forms/StepForm/Step3")
+                }
+              ]
+            }
+          ]
+        }
+      ]
+    },
+    {
+      path: "*",
+      name: "404",
+      component: NotFound
     }
   ]
 });
+
+router.beforeEach((to, form, next) => {
+  NProgress.start();
+  next();
+});
+
+router.afterEach(() => {
+  NProgress.done();
+});
+
+export default router;

src/views/404.vue

@@ -0,0 +1,9 @@
+<template>
+  <div>404</div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style></style>

src/views/Dashboard/Analysis.vue

@@ -0,0 +1,9 @@
+<template>
+  <div>分析页</div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style></style>

src/views/Forms/BasicForm.vue

@@ -0,0 +1,9 @@
+<template>
+  <div>基础表单</div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style></style>

src/views/Forms/StepForm/Step1.vue

@@ -0,0 +1,9 @@
+<template>
+  <div>第一步</div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style></style>

src/views/Forms/StepForm/Step2.vue

@@ -0,0 +1,9 @@
+<template>
+  <div>第二步</div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style></style>

src/views/Forms/StepForm/Step3.vue

@@ -0,0 +1,9 @@
+<template>
+  <div>第三步</div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style></style>

src/views/Forms/StepForm/index.vue

@@ -0,0 +1,11 @@
+<template>
+  <div>
+    <router-view></router-view>
+  </div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style></style>

src/views/User/Login.vue

@@ -0,0 +1,9 @@
+<template>
+  <div>登录页</div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style></style>

src/views/User/Register.vue

@@ -0,0 +1,9 @@
+<template>
+  <div>注册页</div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style></style>