From 261a4ef18956f20a0e2264c4051e0d73a366702f Mon Sep 17 00:00:00 2001
From: lin-xin <2981207131@qq.com>
Date: Thu, 23 Feb 2017 08:56:34 +0800
Subject: [PATCH] Add readme component

---
 src/components/common/sidebar.vue |  9 ++-
 src/components/page/Readme.vue    | 98 +++++++++++++++++++++++++++++++
 src/router/index.js               |  6 +-
 3 files changed, 109 insertions(+), 4 deletions(-)
 create mode 100644 src/components/page/Readme.vue

diff --git a/src/components/common/sidebar.vue b/src/components/common/sidebar.vue
index 5e0ad57..522121a 100644
--- a/src/components/common/sidebar.vue
+++ b/src/components/common/sidebar.vue
@@ -1,19 +1,22 @@
 <template>
     <div class="sidebar">
         <el-menu :default-active="onRoutes" class="el-menu-vertical-demo" theme="dark" unique-opened router>
-            <el-submenu index="1">
+            <el-menu-item index="readme">
+                <i class="el-icon-setting"></i>自述
+            </el-menu-item>
+            <el-submenu index="2">
                 <template slot="title"><i class="el-icon-menu"></i>表格</template>
                 <el-menu-item index="basetable">基础表格</el-menu-item>
                 <el-menu-item index="vuetable">Vue表格组件</el-menu-item>
             </el-submenu>
-            <el-submenu index="2">
+            <el-submenu index="3">
                 <template slot="title"><i class="el-icon-date"></i>表单</template>
                 <el-menu-item index="baseform">基本表单</el-menu-item>
                 <el-menu-item index="vueeditor">编辑器</el-menu-item>
                 <el-menu-item index="markdown">markdown</el-menu-item>
                 <el-menu-item index="upload">文件上传</el-menu-item>
             </el-submenu>
-            <el-submenu index="3">
+            <el-submenu index="4">
                 <template slot="title"><i class="el-icon-star-on"></i>图表</template>
                 <el-menu-item index="basecharts">基础图表</el-menu-item>
                 <el-menu-item index="mixcharts">混合图表</el-menu-item>
diff --git a/src/components/page/Readme.vue b/src/components/page/Readme.vue
new file mode 100644
index 0000000..43b8bae
--- /dev/null
+++ b/src/components/page/Readme.vue
@@ -0,0 +1,98 @@
+<template>
+    <div>
+        <div class="crumbs">
+            <el-breadcrumb separator="/">
+                <el-breadcrumb-item><i class="el-icon-setting"></i> 自述</el-breadcrumb-item>
+            </el-breadcrumb>
+        </div>
+        <div class="ms-doc">
+            <h3>README.md</h3>
+            <article>
+                <h1>manage-system</h1>
+                <p>基于Vue.js 2.x系列 + Element UI 的后台管理系统解决方案</p>
+                <p>该方案作为一套多功能的后台框架模板，适用于绝大部分的后台管理系统（Web Management System）开发。基于vue.js,使用vue-cli脚手架快速生成项目目录，引用Element UI组件库，方便开发快速简洁好看的组件。</p>
+                <h2>功能</h2>
+                <el-checkbox disabled checked>Element UI</el-checkbox>
+                <br>
+                <el-checkbox disabled checked>表格</el-checkbox>
+                <br>
+                <el-checkbox disabled checked>表单</el-checkbox>
+                <br>
+                <el-checkbox disabled checked>图表</el-checkbox>
+                <br>
+                <el-checkbox disabled checked>富文本编辑器</el-checkbox>
+                <br>
+                <el-checkbox disabled checked>markdown编辑器</el-checkbox>
+                <br>
+                <el-checkbox disabled checked>图片拖拽/裁剪上传</el-checkbox>
+                <br>
+
+            </article>
+        </div>
+
+    </div>
+</template>
+
+<script>
+    export default {
+        data: function(){
+            return {}
+        }
+    }
+</script>
+
+<style scoped>
+    .ms-doc{
+        width:100%;
+        max-width: 980px;
+        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
+    }
+    .ms-doc h3{
+        padding: 9px 10px 10px;
+        margin: 0;
+        font-size: 14px;
+        line-height: 17px;
+        background-color: #f5f5f5;
+        border: 1px solid #d8d8d8;
+        border-bottom: 0;
+        border-radius: 3px 3px 0 0;
+    }
+    .ms-doc article{
+        padding: 45px;
+        word-wrap: break-word;
+        background-color: #fff;
+        border: 1px solid #ddd;
+        border-bottom-right-radius: 3px;
+        border-bottom-left-radius: 3px;
+    }
+    .ms-doc article h1{
+        font-size:32px;
+        padding-bottom: 10px;
+        margin-bottom: 15px;
+        border-bottom: 1px solid #ddd;
+    }
+    .ms-doc article h2 {
+        margin: 24px 0 16px;
+        font-weight: 600;
+        line-height: 1.25;
+        padding-bottom: 7px;
+        font-size: 24px;
+        border-bottom: 1px solid #eee;
+    }
+    .ms-doc article p{
+        margin-bottom: 15px;
+        line-height: 1.5;
+    }
+    .ms-doc article .el-checkbox{
+        margin-bottom: 5px;
+    }
+    .ms-doc .el-checkbox__input.is-disabled+.el-checkbox__label{
+
+    }
+</style>
+<style>
+    .ms-doc .el-checkbox__input.is-disabled+.el-checkbox__label{
+        color: #333;
+        cursor: pointer;
+    }
+</style>
\ No newline at end of file
diff --git a/src/router/index.js b/src/router/index.js
index 822ad17..b3fa106 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -6,9 +6,13 @@ Vue.use(Router);
 export default new Router({
     routes: [
         {
-            path: '/admin',
+            path: '/readme',
             component: resolve => require(['../components/common/Home.vue'], resolve),
             children:[
+                {
+                    path: '/',
+                    component: resolve => require(['../components/page/Readme.vue'], resolve)
+                },
                 {
                     path: '/basetable',
                     component: resolve => require(['../components/page/BaseTable.vue'], resolve)